/* ============================================================
   kültfilmler — DİZİ TANITIM (single-series)
   Tasarım: özel tasarım
   ============================================================ */

.crumb{ display:flex; align-items:center; gap:7px; font-size:11.5px; color:var(--faint); padding-top:16px; }
.crumb a:hover{ color:var(--muted); }
.crumb svg{ opacity:.6; }

/* HERO 3-COL */
.hero2{ display:grid; grid-template-columns:230px 1fr 248px; gap:28px; padding:22px 0 30px; align-items:start; }
.backdrop{ position:relative; aspect-ratio:2/3; border-radius:12px; overflow:hidden; border:1px solid var(--line-2);
  background:repeating-linear-gradient(135deg, rgba(255,255,255,.03) 0 1px, transparent 1px 10px), radial-gradient(120% 90% at 50% -5%, hsla(220,32%,40%,.55), transparent 62%), linear-gradient(160deg,#222632,#12141b); box-shadow:0 18px 40px -18px rgba(0,0,0,.6); }
.backdrop img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:1; } /* z-index:1 → shimmer iskeletinin üstünde */
.backdrop .bl{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; text-align:center; padding:18px; }
.backdrop .bl .k{ font-size:9px; letter-spacing:2px; text-transform:uppercase; color:rgba(255,255,255,.5); font-weight:700; }
.backdrop .bl .t{ font-family:var(--display); font-weight:700; letter-spacing:-.4px; font-size:24px; color:rgba(255,255,255,.92); }

.mid h1{ font-family:var(--display); font-weight:700; letter-spacing:-.5px; font-size:30px; line-height:1.1; color:#fff; }
.mid h1 span{ color:var(--muted); font-weight:600; font-size:22px; }
.mid .dsyn{ font-size:13.5px; line-height:1.7; color:var(--muted); margin-top:14px; }
.mid .dsyn p{ margin:0 0 10px; } .mid .dsyn p:last-child{ margin-bottom:0; }
.mid .dsyn.clamp{ display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.moreBtn{ margin-top:9px; display:inline-flex; align-items:center; gap:6px; font-size:12.5px; font-weight:600; color:var(--muted); background:none; border:none; cursor:pointer; font-family:inherit; }
.moreBtn:hover{ color:var(--orange); }
.moreBtn svg{ transition:transform .2s; } .moreBtn.open svg{ transform:rotate(180deg); }
.midacts{ display:flex; gap:9px; margin-top:18px; flex-wrap:wrap; }
.midacts a, .midacts button{ display:inline-flex; align-items:center; gap:8px; height:40px; padding:0 17px; border-radius:8px; font:inherit; font-size:12.5px; font-weight:600; cursor:pointer; transition:.15s; }
.midacts .play{ border:none; color:#241a09; background:linear-gradient(180deg,var(--orange),var(--orange-deep)); }
.midacts .play:hover{ filter:brightness(1.06); }
.midacts .last{ background:#fff; color:#1a1a1c; border:none; }
.midacts .last:hover{ filter:brightness(.96); }
.midacts .fav{ background:rgba(255,255,255,.05); border:1px solid var(--line-2); color:var(--ink); }
.midacts .fav:hover{ background:rgba(255,255,255,.09); }
.midacts .fav.on{ color:#fff; background:#d8536b; border-color:transparent; }

.midcast{ margin-top:26px; }
.midcast h2{ font-family:var(--display); font-weight:700; letter-spacing:-.4px; font-size:17px; color:#f2f2f3; margin-bottom:14px; }
.ccast{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px 16px; }
.cm{ display:flex; align-items:center; gap:11px; min-width:0; }
.cm .av{ width:44px; height:44px; flex:none; border-radius:50%; overflow:hidden; border:1px solid var(--line); display:grid; place-items:center; font-size:14px; font-weight:700; color:#fff; }
.cm .ct{ min-width:0; }
.cm h5{ font-size:12.5px; font-weight:600; color:#eee; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cm p{ font-size:10.5px; color:var(--faint); margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* SIDEBAR INFO CARD */
.side{ background:var(--bg-2); border:1px solid var(--line); border-radius:11px; overflow:hidden; position:sticky; top:14px; }
.irow{ padding:14px 16px; border-bottom:1px solid var(--line); }
.irow:last-child{ border-bottom:none; }
.il{ font-size:11px; color:var(--faint); font-weight:600; letter-spacing:.2px; margin-bottom:7px; }
.imdb{ display:flex; align-items:center; gap:10px; }
.imdb .b{ height:24px; padding:0 7px; border-radius:4px; background:var(--orange); color:#241a09; font-weight:800; font-size:11px; letter-spacing:.5px; display:grid; place-items:center; }
.imdb .score{ font-size:17px; font-weight:700; color:#fff; }
.imdb .votes{ font-size:11.5px; color:var(--faint); margin-left:auto; }
.iv{ font-size:13px; color:var(--ink); font-weight:500; }
.iv .gn, .iv.gn{ color:var(--muted); }
.istatus{ display:inline-flex; align-items:center; gap:7px; }
.istatus i{ width:8px; height:8px; border-radius:50%; background:#4f9d6b; display:inline-block; }

/* EPISODES */
.epsection{ margin-top:4px; padding-top:26px; border-top:1px solid var(--line); }
.ephead{ display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-bottom:16px; }
.ephead h2{ font-family:var(--display); font-weight:700; letter-spacing:-.4px; font-size:21px; color:#f2f2f3; }
.ephead .seasontabs{ margin-left:auto; }
.seasontabs{ display:flex; gap:3px; padding:3px; background:var(--bg-2); border:1px solid var(--line); border-radius:8px; }
.seasontabs button{ height:30px; padding:0 16px; border:none; border-radius:6px; background:transparent; color:var(--muted); font:inherit; font-size:12.5px; font-weight:600; cursor:pointer; transition:.14s; }
.seasontabs button:hover{ color:var(--ink); }
.seasontabs button.on{ background:var(--card-2); color:#fff; box-shadow:0 1px 2px rgba(0,0,0,.3); }
.eps{ display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }
.ep{ position:relative; display:block; padding:13px 14px; border-radius:10px; background:var(--bg-2); border:1px solid var(--line); cursor:pointer; transition:.15s; }
.ep:hover{ border-color:var(--line-2); background:var(--card); transform:translateY(-2px); }
.ep h4{ font-size:13px; font-weight:600; color:#eef; padding-right:30px; }
.ep .edate{ display:inline-block; font-size:11px; color:var(--faint); background:var(--bg); border:1px solid var(--line); border-radius:20px; padding:4px 10px; margin-top:10px; }
.ep .ecc{ position:absolute; top:13px; right:13px; font-size:9px; font-weight:800; letter-spacing:.3px; color:var(--muted); border:1px solid var(--line-2); border-radius:4px; padding:2px 5px; line-height:1; }

/* COMMENTS */
.dcmts{ margin-top:38px; padding-top:22px; border-top:1px solid var(--line); }
.dcmt-head{ display:flex; align-items:center; justify-content:space-between; }
.dcmt-head h2{ font-family:var(--display); font-weight:700; letter-spacing:-.4px; font-size:18px; color:#f2f2f3; }
.dcmt-head .dots{ color:var(--faint); font-size:18px; }
.dcmt-empty{ display:flex; flex-direction:column; align-items:center; gap:11px; padding:34px 0 8px; text-align:center; }
.dcmt-empty svg{ color:var(--faint); opacity:.5; }
.dcmt-empty p{ font-size:13px; color:var(--faint); }

@media (max-width:1000px){
  .hero2{ grid-template-columns:190px 1fr; }
  .side{ grid-column:1 / -1; position:static; }
  .eps{ grid-template-columns:repeat(3,1fr); }
  .ccast{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:680px){
  .hero2{ grid-template-columns:1fr; gap:18px; }
  .hero2 > *{ min-width:0; }
  .mid, .midacts{ min-width:0; max-width:100%; }
  .backdrop{ display:none; }
  .mid h1{ font-size:24px; } .mid h1 span{ font-size:18px; }
  .ccast{ grid-template-columns:1fr 1fr; }
  .ccast .cm:nth-child(n+5){ display:none; } /* mobilde yalnız ilk 4 oyuncu (masaüstü 12 gösterir) */
  .midacts{ flex-wrap:nowrap; gap:8px; margin-top:16px; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; padding-bottom:2px; }
  .midacts::-webkit-scrollbar{ display:none; }
  .midacts a, .midacts button{ flex:none; height:38px; padding:0 14px; font-size:12px; white-space:nowrap; }
  .ep .edate{ display:none; }
  .side{ border:none; background:none; border-radius:0; }
  .side .irow{ display:flex; align-items:center; justify-content:space-between; gap:14px; padding:9px 0; }
  .side .irow .il{ margin-bottom:0; font-size:11.5px; }
  .side .irow .iv, .side .irow .iv.gn{ font-size:12.5px; text-align:right; }
  .side .irow .imdb{ gap:7px; }
  .side .irow .imdb .b{ height:20px; font-size:10px; }
  .side .irow .imdb .score{ font-size:14px; }
  .side .irow .imdb .votes{ display:none; }
  .eps{ grid-template-columns:1fr 1fr; }
}