/* ============================================================================
   ZainCinema — design system  ·  "Marquee"
   Roast-ink marquee board · marigold bulbs (signature) · vermilion reserved for
   ACTIONS · ultra-condensed poster type (Anton) over a clean body (Hanken).
   India cinema-poster vernacular on a JustWatch-style scan-fast skeleton.
   Class names + --var names match the server markup: pure drop-in.
   ============================================================================ */
:root{
  /* --- warm roast marquee ground --- */
  --bg:#161009; --bg-2:#1e1509;
  --surface:#221a0e; --surface-2:#2c2213; --surface-3:#372b18;
  --border:#40331d; --border-2:#4f3f24;

  /* --- warm cream ink --- */
  --text:#f8f0e2; --muted:#b7a88c; --faint:#8a7c62;

  /* --- SIGNATURE marigold (mapped onto old --gold): bulbs, rating, structure --- */
  --gold:#ff9e1b; --gold-2:#ffb84d; --gold-soft:rgba(255,158,27,.14); --gold-ink:#2a1600;

  /* --- vermilion (old --brand*): ACTIONS ONLY --- */
  --brand:#e63016; --brand-2:#ff4a2b; --brand-3:#ff7a5c;

  /* --- support --- */
  --purple:#1f8a80; --ok:#2fbf71; --err:#e0574e;

  --radius:12px; --radius-lg:16px; --radius-sm:8px;
  --shadow:0 22px 54px rgba(0,0,0,.6); --shadow-sm:0 12px 28px rgba(0,0,0,.42);
  --glow:0 0 30px rgba(255,158,27,.26);
  --max:1200px; --ring:0 0 0 3px rgba(255,158,27,.32);

  --display:'Anton',Impact,'Arial Narrow',sans-serif;
  --sans:'Hanken Grotesk',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  box-sizing:border-box;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:
    radial-gradient(1100px 560px at 82% -10%, rgba(255,158,27,.11), transparent 58%),
    radial-gradient(900px 500px at -6% 2%, rgba(230,48,22,.09), transparent 55%),
    var(--bg);
  color:var(--text);
  font-family:var(--sans);
  font-weight:450;
  min-height:100vh;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  line-height:1.6;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer}
:focus-visible{outline:none;box-shadow:var(--ring);border-radius:5px}

/* display = condensed poster caps */
h1,h2,h3,h4{font-family:var(--display);font-weight:400;letter-spacing:.005em;line-height:1.02;text-transform:uppercase}
.container{max-width:var(--max);margin:0 auto;padding:0 24px}

/* ---------- header (marquee bar) ---------- */
.site-header{position:sticky;top:0;z-index:50;backdrop-filter:blur(16px) saturate(1.2);
  background:linear-gradient(to bottom,rgba(22,16,9,.95),rgba(22,16,9,.6));border-bottom:1px solid var(--border-2)}
.site-header .container{display:flex;align-items:center;gap:24px;height:68px}
.logo{display:flex;align-items:center;gap:12px;font-family:var(--display);font-weight:400;font-size:26px;letter-spacing:.02em;text-transform:uppercase}
.logo .dot{color:var(--gold)}
/* marigold marquee tile with a bulb-glow ring */
.logo-badge{width:34px;height:34px;border-radius:7px;display:grid;place-items:center;
  font-family:var(--display);font-size:15px;font-weight:400;color:var(--gold-ink);letter-spacing:.02em;
  background:linear-gradient(150deg,var(--gold-2),var(--gold));
  box-shadow:0 0 0 1px rgba(255,255,255,.18) inset,0 6px 20px rgba(255,158,27,.42)}
.site-nav{margin-left:auto;display:flex;align-items:center;gap:4px}
.site-nav a{color:var(--muted);font-weight:700;font-size:13.5px;letter-spacing:.04em;text-transform:uppercase;padding:9px 14px;border-radius:7px;position:relative;transition:color .14s}
.site-nav a:hover{color:var(--text)}
.site-nav a::after{content:"";position:absolute;left:14px;right:14px;bottom:6px;height:2px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .16s ease}
.site-nav a:hover::after{transform:scaleX(1)}
@media(max-width:520px){.site-nav a{padding:8px 10px;font-size:12.5px}.site-nav a::after{left:10px;right:10px}}

/* ---------- hero + the "lit marquee" search (bulbs = the one bold moment) ---------- */
.hero{padding:74px 0 32px;text-align:center}
.hero h1{font-family:var(--display);font-weight:400;font-size:clamp(42px,8vw,86px);line-height:.9;
  letter-spacing:.01em;text-transform:uppercase;max-width:15ch;margin:0 auto;
  color:var(--text);text-shadow:0 2px 0 rgba(0,0,0,.25)}
.hero p{color:var(--muted);max-width:56ch;margin:20px auto 0;font-size:clamp(15px,2vw,18px);line-height:1.6}
.search-wrap{max-width:660px;margin:44px auto 0;position:relative}
/* the marquee bulbs */
.search-wrap::before{content:"";position:absolute;left:20px;right:20px;top:-15px;height:6px;
  background:radial-gradient(circle,var(--gold) 0 2.4px,transparent 3px);
  background-size:17px 6px;background-repeat:repeat-x;background-position:center;
  filter:drop-shadow(0 0 4px rgba(255,158,27,.6));opacity:.9}
.search-wrap .ico{position:absolute;left:22px;top:50%;transform:translateY(-50%);font-size:14px;font-weight:800;color:var(--gold);pointer-events:none}
.search-wrap input{width:100%;height:64px;border-radius:12px;
  background:linear-gradient(180deg,var(--surface-2),var(--surface));
  border:1px solid var(--border-2);color:var(--text);font-size:17px;font-family:var(--sans);font-weight:500;
  padding:0 24px 0 50px;outline:none;
  box-shadow:0 0 0 1px rgba(255,158,27,.16) inset,var(--shadow);transition:border-color .18s,box-shadow .18s}
.search-wrap input::placeholder{color:var(--faint)}
.search-wrap input:focus{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold) inset,var(--glow),var(--shadow)}
.suggest{position:absolute;left:0;right:0;top:calc(100% + 10px);z-index:40;background:var(--surface);
  border:1px solid var(--border-2);border-radius:12px;box-shadow:var(--shadow);overflow:hidden auto;display:none;max-height:62vh;text-align:left}
.suggest.open{display:block}
.suggest-item{display:flex;gap:12px;padding:11px 15px;align-items:center;border-bottom:1px solid var(--border)}
.suggest-item:last-child{border-bottom:none}
.suggest-item:hover{background:var(--surface-2)}
.suggest-item img{width:44px;height:66px;object-fit:cover;border-radius:6px;background:var(--surface-3);flex:0 0 auto}
.suggest-item .t{font-weight:700;font-size:15px}
.suggest-item .y{color:var(--muted);font-size:13px}
.suggest-empty{padding:16px;color:var(--muted);font-size:14px}

/* ---------- sections (marquee caps over a marigold rule) ---------- */
.section{padding:32px 0 8px}
.section-head{display:flex;align-items:center;gap:12px;margin-bottom:20px;padding-bottom:12px;border-bottom:2px solid var(--border-2);position:relative}
.section-head::after{content:"";position:absolute;left:0;bottom:-2px;width:64px;height:2px;background:var(--gold)}
.section-head h1,.section-head h2{font-family:var(--display);font-weight:400;font-size:clamp(24px,3.2vw,34px);letter-spacing:.02em;text-transform:uppercase}
.section-head .bar{width:12px;height:12px;flex:0 0 auto;background:var(--brand);transform:rotate(45deg)}

/* ---------- poster grid + cards (poster-forward, warm meta strip below) ---------- */
.grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}
.card{display:block;background:var(--surface-2);border:1px solid var(--border);border-radius:11px;overflow:hidden;
  box-shadow:0 10px 26px rgba(0,0,0,.42);transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.card:hover{transform:translateY(-5px);border-color:var(--gold);box-shadow:0 18px 40px rgba(0,0,0,.5),var(--glow)}
.card .poster{aspect-ratio:2/3;width:100%;object-fit:cover;background:var(--surface-3)}
.card .meta{display:block;padding:11px 13px 12px;border-top:1px solid var(--border)}
.card .meta .name{display:-webkit-box;font-weight:700;font-size:14.5px;line-height:1.28;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.card .meta .sub{display:flex;justify-content:space-between;align-items:center;margin-top:8px;color:var(--muted);font-size:12.5px;font-weight:500}
.rating{color:var(--gold);font-weight:800}

/* ---------- movie / TV detail ---------- */
.detail{padding:32px 0}
.back-btn{display:inline-flex;align-items:center;gap:8px;margin-bottom:26px;background:var(--surface);
  border:1px solid var(--border-2);color:var(--text);padding:10px 17px;border-radius:8px;font-size:13px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;transition:.14s}
.back-btn:hover{border-color:var(--gold);color:var(--gold-2)}
.detail-hero{position:relative;border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--border-2);margin-bottom:28px}
.detail-hero .backdrop{width:100%;height:100%;position:absolute;inset:0;object-fit:cover;filter:brightness(.34) saturate(1.15) sepia(.15)}
.detail-hero .scrim{position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(22,16,9,.97),rgba(22,16,9,.8) 44%,rgba(30,20,8,.36)),
             radial-gradient(120% 90% at 90% 8%,rgba(255,158,27,.14),transparent 55%)}
.detail-inner{position:relative;display:flex;gap:34px;padding:34px;flex-wrap:wrap}
/* one-sheet mount: warm frame + marigold hairline + glow */
.detail-poster{width:230px;flex:0 0 auto;border-radius:8px;aspect-ratio:2/3;object-fit:cover;background:var(--surface-3);
  box-shadow:0 0 0 1px var(--gold) inset,0 0 0 7px #120d06,0 0 0 8px rgba(255,158,27,.34),var(--shadow)}
.detail-body{flex:1;min-width:280px}
.detail-body h1{font-family:var(--display);font-weight:400;font-size:clamp(34px,5vw,58px);letter-spacing:.01em;text-transform:uppercase;line-height:.92}
.detail-body .tagline{color:var(--gold-2);font-family:var(--sans);font-style:italic;font-size:17px;margin-top:10px;text-transform:none}
.chips{display:flex;flex-wrap:wrap;gap:9px;margin:18px 0}
.chip{background:rgba(255,255,255,.04);border:1px solid var(--border-2);padding:7px 13px;border-radius:7px;font-size:13px;font-weight:700;color:var(--text);transition:.14s}
a.chip:hover{border-color:var(--gold);background:var(--gold-soft);color:var(--gold-2)}
.chip.gold{color:var(--gold-ink);background:var(--gold);border-color:var(--gold)}
/* quick-take: programme note, marigold rule */
.quick-take{background:linear-gradient(180deg,var(--surface),var(--surface-2));border:1px solid var(--border);
  border-left:5px solid var(--gold);border-radius:10px;padding:17px 20px;margin-top:18px;line-height:1.75;color:#f0e7d6;font-size:15px}
.synopsis{color:#e2d8c4;line-height:1.8;margin-top:18px;max-width:70ch;font-size:15.5px}

/* cast */
.cast-row{display:flex;gap:18px;overflow-x:auto;padding:8px 2px 14px;margin-top:8px;scrollbar-width:thin}
.cast-card{flex:0 0 auto;width:100px;text-align:center}
.cast-card img{width:100px;height:100px;border-radius:50%;object-fit:cover;background:var(--surface-3);margin:0 auto 10px;border:1px solid var(--border-2);box-shadow:0 0 0 3px var(--surface)}
.cast-card .nm{font-size:13px;font-weight:700;line-height:1.2}
.cast-card .ch{font-size:12px;color:var(--muted);margin-top:3px}

/* providers — the "where to watch" tiles (JustWatch job) */
.providers{margin-top:34px}
.prov-group{margin-bottom:22px}
.prov-group h3{font-family:var(--display);font-size:16px;letter-spacing:.06em;color:var(--gold);margin-bottom:12px;font-weight:400;text-transform:uppercase}
.prov-list{display:flex;flex-wrap:wrap;gap:12px}
.prov-btn{display:flex;align-items:center;gap:13px;background:var(--surface);border:1px solid var(--border-2);
  border-radius:10px;padding:10px 20px 10px 11px;font-weight:700;font-size:15px;transition:.16s;min-width:186px}
.prov-btn:hover{transform:translateY(-3px);border-color:var(--gold);box-shadow:var(--shadow-sm)}
.prov-btn img{width:46px;height:46px;border-radius:9px;object-fit:cover;background:var(--surface-3)}
.prov-btn .lbl small{display:block;color:var(--muted);font-weight:500;font-size:12px;margin-top:1px}
.no-prov{background:var(--surface);border:1px dashed var(--border-2);border-radius:var(--radius);padding:26px;text-align:center;color:var(--muted);margin-top:8px}
.no-prov strong{color:var(--text)}

/* VPN — legal geo-unlock; teal/vermilion glow, vermilion CTA (an action) */
.vpn-block{margin:34px 0 8px;border-radius:var(--radius-lg);overflow:hidden;position:relative;
  background:linear-gradient(120deg,#0e1a18,#141110 58%,#231009);border:1px solid var(--border-2)}
.vpn-block .glow{position:absolute;inset:-40%;pointer-events:none;
  background:radial-gradient(circle at 24% 30%,rgba(31,138,128,.4),transparent 46%),
             radial-gradient(circle at 84% 74%,rgba(230,48,22,.32),transparent 46%)}
.vpn-inner{position:relative;display:flex;gap:20px;align-items:center;padding:26px;flex-wrap:wrap}
.vpn-inner .emoji{font-family:var(--sans);font-size:12px;font-weight:800;letter-spacing:.1em;color:#8fe3da;border:1px solid rgba(64,190,178,.4);padding:8px 12px;border-radius:8px;text-transform:uppercase}
.vpn-copy{flex:1;min-width:220px}
.vpn-copy h4{font-family:var(--display);font-weight:400;font-size:24px;letter-spacing:.02em;text-transform:uppercase}
.vpn-copy p{color:var(--muted);font-size:14px;margin-top:5px;line-height:1.6}
.vpn-cta{display:inline-block;background:linear-gradient(135deg,var(--brand-2),var(--brand));color:#fff;border:none;padding:14px 28px;border-radius:9px;font-weight:800;font-size:14px;letter-spacing:.02em;text-transform:uppercase;white-space:nowrap;box-shadow:0 12px 30px rgba(230,48,22,.42);transition:transform .15s,box-shadow .15s}
.vpn-cta:hover{transform:translateY(-2px);box-shadow:0 16px 36px rgba(230,48,22,.5)}

/* ---------- reviews ---------- */
.reviews{margin-top:36px}
.rv-avg{display:inline-flex;align-items:center;gap:4px;font-size:13px;color:var(--gold);font-weight:800;margin-left:10px;background:var(--gold-soft);border:1px solid rgba(255,158,27,.34);padding:3px 11px;border-radius:999px;vertical-align:middle}
.rv-flash{border-radius:9px;padding:13px 16px;margin:0 0 16px;font-size:14px;font-weight:700}
.rv-flash.ok{background:rgba(47,191,113,.13);border:1px solid rgba(47,191,113,.42);color:#8fe3b3}
.rv-flash.err{background:rgba(224,87,78,.13);border:1px solid rgba(224,87,78,.42);color:#f4a79f}
.rv-form-wrap{background:linear-gradient(135deg,var(--surface),var(--surface-2));border:1px solid var(--border-2);border-radius:14px;padding:24px;margin-bottom:26px;box-shadow:var(--shadow-sm)}
.rv-form{display:flex;flex-direction:column;gap:14px}
.rv-form-head{font-family:var(--display);font-weight:400;font-size:20px;letter-spacing:.02em;text-transform:uppercase}
.rv-row{display:flex;gap:12px;flex-wrap:wrap}
.rv-input{background:var(--bg-2);border:1px solid var(--border-2);color:var(--text);border-radius:9px;padding:13px 15px;font-size:15px;font-family:inherit;outline:none;transition:.15s}
.rv-input::placeholder{color:var(--faint)}
.rv-input:focus{border-color:var(--gold);box-shadow:var(--ring)}
.rv-row .rv-input[name=rname]{flex:1;min-width:200px}
.rv-select{min-width:132px;cursor:pointer;appearance:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='%23ff9e1b'><path d='M1 1l5 5 5-5'/></svg>");
  background-repeat:no-repeat;background-position:right 14px center;padding-right:36px}
.rv-textarea{resize:vertical;min-height:104px;line-height:1.65}
/* posting = action -> vermilion */
.rv-submit{align-self:flex-start;background:linear-gradient(135deg,var(--brand-2),var(--brand));color:#fff;border:none;padding:13px 30px;border-radius:9px;font-weight:800;font-size:14px;letter-spacing:.02em;text-transform:uppercase;box-shadow:0 10px 26px rgba(230,48,22,.36);transition:.15s}
.rv-submit:hover{transform:translateY(-2px);box-shadow:0 14px 32px rgba(230,48,22,.46)}
.rv-list{display:flex;flex-direction:column;gap:14px}
.rv-item{display:flex;gap:14px;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:17px 18px}
.rv-avatar{flex:0 0 auto;width:44px;height:44px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(135deg,var(--gold),var(--gold-2));color:var(--gold-ink);font-weight:800;font-size:18px}
.rv-content{flex:1;min-width:0}
.rv-top{display:flex;align-items:center;gap:10px;margin-bottom:6px;flex-wrap:wrap}
.rv-name{font-weight:800;font-size:15px}
.rv-rating{display:inline-flex;align-items:center;gap:3px;color:var(--gold);font-weight:800;font-size:12.5px;background:var(--gold-soft);border:1px solid rgba(255,158,27,.34);padding:2px 9px;border-radius:999px}
.rv-date{color:var(--muted);font-size:12.5px;margin-left:auto}
.rv-body{color:#e4dac6;line-height:1.7;font-size:14.5px;word-wrap:break-word}
.rv-empty{color:var(--muted);font-size:14.5px;padding:18px;text-align:center;background:var(--surface);border:1px dashed var(--border-2);border-radius:12px}

/* ---------- list hubs ---------- */
.list-grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));margin-top:22px}
.list-tile{display:flex;flex-direction:column;gap:8px;background:var(--surface);border:1px solid var(--border-2);border-radius:12px;padding:20px;transition:.15s;position:relative;overflow:hidden}
.list-tile::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--gold);transform:scaleY(0);transform-origin:top;transition:transform .18s}
.list-tile:hover{transform:translateY(-4px);border-color:var(--border-2);box-shadow:var(--shadow-sm)}
.list-tile:hover::before{transform:scaleY(1)}
.lt-title{font-weight:800;font-size:17px;line-height:1.25}
.lt-sub{color:var(--muted);font-size:13.5px;line-height:1.55}

/* ---------- blog ---------- */
.blog-grid{display:grid;gap:22px;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));margin-top:22px}
.blog-card{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border-2);border-radius:14px;overflow:hidden;transition:.16s}
.blog-card:hover{transform:translateY(-5px);border-color:var(--gold);box-shadow:var(--shadow-sm)}
.bc-cover{width:100%;height:180px;object-fit:cover;background:var(--surface-3)}
.bc-ph{background:linear-gradient(135deg,var(--surface-3),#3a1c0c)}
.bc-body{padding:17px 19px;display:flex;flex-direction:column;gap:10px}
.bc-cat{align-self:flex-start;background:var(--gold);color:var(--gold-ink);font-size:11px;font-weight:800;padding:3px 11px;border-radius:6px;text-transform:uppercase;letter-spacing:.06em}
.bc-title{font-size:19px;font-weight:800;line-height:1.24}
.bc-ex{color:var(--muted);font-size:14px;line-height:1.55}
.bc-meta{color:var(--faint);font-size:12.5px;margin-top:auto;font-weight:500}
.blog-pager{display:flex;gap:10px;align-items:center;margin-top:26px}

/* ---------- single post ---------- */
.post{max-width:720px;margin:0 auto}
.post-title{font-family:var(--display);font-weight:400;font-size:clamp(36px,5.6vw,58px);line-height:.94;margin-top:6px;letter-spacing:.01em;text-transform:uppercase}
.post-meta{color:var(--muted);font-size:14px;margin:16px 0 22px;font-weight:500}
.post-cover{width:100%;max-height:440px;object-fit:cover;border-radius:var(--radius);margin-bottom:26px;border:1px solid var(--border-2)}
.post-body{font-size:18px;line-height:1.85;color:#e6dcc8}
.post-body h2{font-family:var(--display);font-weight:400;font-size:30px;margin:36px 0 12px;letter-spacing:.01em;text-transform:uppercase}
.post-body h3{font-family:var(--display);font-weight:400;font-size:23px;margin:26px 0 8px;letter-spacing:.01em;text-transform:uppercase}
.post-body p{margin:0 0 21px}
.post-body ul,.post-body ol{margin:0 0 21px 22px}
.post-body li{margin:7px 0}
.post-body a{color:var(--gold-2);text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(255,158,27,.5);font-weight:600}
.post-body a:hover{text-decoration-color:var(--gold-2)}
.post-body blockquote{border-left:5px solid var(--gold);padding:6px 20px;margin:0 0 21px;color:var(--muted);font-style:italic;font-size:19px}
.post-body code{background:var(--surface);border:1px solid var(--border-2);padding:2px 7px;border-radius:6px;font-size:15px;font-family:ui-monospace,Menlo,Consolas,monospace}

/* ---------- states + footer ---------- */
.state{text-align:center;padding:70px 20px;color:var(--muted)}
.state h2{color:var(--text);font-family:var(--display);font-weight:400;font-size:28px;letter-spacing:.02em;text-transform:uppercase;margin-bottom:8px}
.attribution{color:var(--faint);font-size:12px;margin-top:18px}
.attribution a{color:var(--gold-2)}
.legal-footer{margin-top:46px;background:rgba(15,11,6,.97);backdrop-filter:blur(12px);border-top:1px solid var(--border-2);padding:16px 24px calc(16px + env(safe-area-inset-bottom,0px));text-align:center;font-size:12.5px;color:var(--muted);line-height:1.6}
.legal-footer .brand{color:var(--gold-2);font-weight:400;font-family:var(--display);letter-spacing:.03em;text-transform:uppercase}

/* ---------- footer page links ---------- */
.footer-links{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 4px;margin-bottom:10px}
.footer-links a{color:var(--muted);font-weight:600}
.footer-links a:hover{color:var(--gold-2)}
.footer-links span{color:var(--faint)}

/* ---------- home SEO content + FAQ ---------- */
.home-content{max-width:760px;margin:0 auto;font-size:16px;line-height:1.8;color:#e2d8c4}
.faq{max-width:760px;margin:0 auto;display:flex;flex-direction:column;gap:12px}
.faq-item{background:var(--surface);border:1px solid var(--border-2);border-radius:11px;padding:18px 20px}
.faq-q{font-size:17px;font-weight:800;margin-bottom:6px}
.faq-a{color:#e2d8c4;line-height:1.7;font-size:15px}

/* ---------- author profile ---------- */
.au-head{display:flex;gap:26px;align-items:flex-start;flex-wrap:wrap;margin-top:8px}
.au-avatar{width:114px;height:114px;border-radius:50%;object-fit:cover;flex:0 0 auto;border:1px solid var(--border-2);box-shadow:0 0 0 4px var(--surface)}
.au-avatar.au-ph{display:grid;place-items:center;background:linear-gradient(135deg,var(--gold),var(--gold-2));color:var(--gold-ink);font-weight:800;font-size:46px}
.au-meta{flex:1;min-width:260px}
.au-name{font-family:var(--display);font-weight:400;font-size:clamp(28px,4vw,40px);letter-spacing:.01em;text-transform:uppercase}
.au-title{color:var(--gold-2);font-weight:700;font-size:15px;margin-top:4px}
.au-bio{color:#e2d8c4;line-height:1.78;margin-top:12px;max-width:68ch;font-size:15.5px}

/* ---------- person / cast profile ---------- */
.pf-head{display:flex;gap:28px;align-items:flex-start;flex-wrap:wrap;margin-top:8px}
.pf-photo{width:186px;flex:0 0 auto;border-radius:8px;object-fit:cover;aspect-ratio:2/3;background:var(--surface-3);box-shadow:0 0 0 1px var(--gold) inset,0 0 0 6px #120d06,0 0 0 7px rgba(255,158,27,.3)}
.pf-photo.pf-ph{display:grid;place-items:center;background:linear-gradient(135deg,var(--gold),var(--gold-2));color:var(--gold-ink);font-weight:800;font-size:64px}
.pf-meta{flex:1;min-width:260px}
.pf-name{font-family:var(--display);font-weight:400;font-size:clamp(30px,4vw,44px);letter-spacing:.01em;text-transform:uppercase}
.pf-bio{color:#e2d8c4;line-height:1.78;margin-top:6px;max-width:70ch;font-size:15.5px}

/* ---------- admin: login ---------- */
.adm-login{display:flex;justify-content:center;padding:54px 0 66px}
.adm-login-card{width:100%;max-width:384px;background:linear-gradient(135deg,var(--surface),var(--surface-2));border:1px solid var(--border-2);border-radius:var(--radius-lg);padding:36px 30px;box-shadow:var(--shadow)}
.adm-login-logo{display:flex;align-items:center;gap:11px;font-family:var(--display);font-weight:400;font-size:24px;letter-spacing:.02em;text-transform:uppercase;margin-bottom:26px}
.adm-login-form{display:flex;flex-direction:column;gap:16px}
.adm-login-form label{display:flex;flex-direction:column;gap:7px;font-size:13px;color:var(--muted);font-weight:700}
.adm-in{background:var(--bg-2);border:1px solid var(--border-2);color:var(--text);border-radius:9px;padding:13px 15px;font-size:15px;font-family:inherit;outline:none;transition:.15s}
.adm-in::placeholder{color:var(--faint)}
.adm-in:focus{border-color:var(--gold);box-shadow:var(--ring)}
.adm-login-btn{margin-top:6px;background:linear-gradient(135deg,var(--brand-2),var(--brand));color:#fff;border:none;padding:14px;border-radius:9px;font-weight:800;font-size:15px;letter-spacing:.02em;text-transform:uppercase;box-shadow:0 10px 26px rgba(230,48,22,.34);transition:.15s}
.adm-login-btn:hover{transform:translateY(-2px)}

/* ---------- admin: dashboard + editor ---------- */
.adm-list{display:flex;flex-direction:column;gap:11px;margin-top:18px}
.adm-row{display:flex;align-items:center;justify-content:space-between;gap:14px;background:var(--surface);border:1px solid var(--border-2);border-radius:11px;padding:15px 18px;flex-wrap:wrap}
.adm-row strong{font-size:15.5px;font-weight:700}
.adm-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.adm-form{display:flex;flex-direction:column;gap:16px;max-width:860px;margin-top:18px}
.adm-form label{display:flex;flex-direction:column;gap:7px;font-size:13px;color:var(--muted);font-weight:700}
.adm-form input[type=text],.adm-form input[type=password],.adm-form textarea{background:var(--bg-2);border:1px solid var(--border-2);color:var(--text);border-radius:9px;padding:12px 14px;font-size:15px;font-family:inherit;outline:none;transition:.15s}
.adm-form input:focus,.adm-form textarea:focus{border-color:var(--gold);box-shadow:var(--ring)}
.adm-form input[type=file]{color:var(--muted);font-size:14px}
.adm-body{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:14px;line-height:1.7;min-height:340px}
.adm-2col{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.adm-save-row{display:flex;gap:12px;align-items:center;margin-top:8px}
@media(max-width:640px){.adm-2col{grid-template-columns:1fr}}

.chip.gold{color:var(--gold-ink)}

/* logo image (settings) */
.logo-img{height:34px;width:auto;max-width:200px;object-fit:contain;display:block}

/* blog editor */
.ed-wrap{border:1px solid var(--border-2);border-radius:11px;overflow:hidden;background:var(--bg-2)}
.ed-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:8px 10px;background:var(--surface-2);border-bottom:1px solid var(--border-2)}
.ed-btn{background:var(--surface-3);border:1px solid var(--border-2);color:var(--text);border-radius:7px;padding:6px 11px;font-size:13px;font-weight:700;cursor:pointer;transition:.12s}
.ed-btn:hover{border-color:var(--gold);color:var(--gold-2)}
.ed-tabs{margin-left:auto;display:flex;gap:4px;background:var(--bg-2);border:1px solid var(--border-2);border-radius:8px;padding:3px}
.ed-tab{background:none;border:none;color:var(--muted);font-weight:800;font-size:13px;padding:6px 14px;border-radius:6px;cursor:pointer}
.ed-tab.active{background:var(--gold);color:var(--gold-ink)}
.ed-wrap .adm-body{border:none;border-radius:0;width:100%;display:block}
.ed-preview{padding:18px 20px;min-height:340px;max-height:520px;overflow:auto;font-size:16px}

/* ---------- cookie consent banner ---------- */
.cookie-banner{position:fixed;left:14px;right:14px;bottom:14px;z-index:70;display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:var(--surface);border:1px solid var(--border-2);border-radius:12px;padding:14px 18px;box-shadow:var(--shadow);max-width:760px;margin:0 auto;font-size:13.5px;color:var(--muted)}
.cookie-banner a{color:var(--gold-2);text-decoration:underline}
.cookie-ok{margin-left:auto;background:linear-gradient(135deg,var(--gold),var(--gold-2));color:var(--gold-ink);border:none;padding:10px 22px;border-radius:8px;font-weight:800;font-size:14px;cursor:pointer;white-space:nowrap}
@media(max-width:520px){.cookie-ok{margin-left:0;width:100%;text-align:center}}

/* ============================================================================
   RESPONSIVE / MOBILE
   ============================================================================ */
@media (max-width: 900px){
  .detail-inner{padding:26px;gap:26px}
  .detail-poster{width:192px}
}
@media (max-width: 680px){
  .container{padding:0 16px}
  .site-header .container{gap:12px;height:60px}
  .logo{font-size:22px}
  .logo-badge{width:31px;height:31px}
  .site-nav a{padding:8px 9px;font-size:12px}

  .hero{padding:46px 0 24px}
  .hero h1{font-size:clamp(38px,11vw,58px)}
  .search-wrap{margin-top:34px}
  .search-wrap input{height:58px;font-size:16px;padding:0 22px 0 46px}
  .search-wrap .ico{left:18px}

  .section{padding:26px 0 6px}
  .section-head h1,.section-head h2{font-size:24px}
  .grid{gap:14px;grid-template-columns:repeat(auto-fill,minmax(146px,1fr))}

  .detail{padding:18px 0}
  .detail-inner{flex-direction:column;align-items:center;padding:20px;gap:20px}
  .detail-poster{width:min(210px,58%)}
  .detail-body{min-width:0;width:100%}
  .detail-body h1{font-size:34px}
  .quick-take{font-size:14.5px}
  .synopsis{font-size:15px}

  .prov-list{flex-direction:column}
  .prov-btn{min-width:0;width:100%}
  .vpn-inner{flex-direction:column;align-items:flex-start;text-align:left;padding:22px}
  .vpn-cta{width:100%;text-align:center}

  .cast-card{width:84px}
  .cast-card img{width:84px;height:84px}

  .rv-form-wrap{padding:18px}
  .rv-row{flex-direction:column}
  .rv-row .rv-input[name=rname],.rv-select{width:100%;min-width:0}
  .rv-submit{width:100%;text-align:center}
  .rv-date{margin-left:0}

  .blog-grid,.list-grid{grid-template-columns:1fr;gap:16px}
  .post{max-width:100%}
  .post-title{font-size:clamp(32px,9vw,42px)}
  .post-body{font-size:16.5px}
  .post-body h2{font-size:26px}
  .post-cover{max-height:280px}

  .au-head{gap:16px}
  .au-avatar{width:90px;height:90px}
  .au-avatar.au-ph{font-size:36px}
  .home-content,.faq{max-width:100%}

  .adm-2col{grid-template-columns:1fr}
  .adm-form,.adm-login-card{max-width:100%}
  .adm-row{gap:10px}
  .ed-toolbar{gap:5px;padding:7px 8px}
  .ed-btn{padding:6px 9px;font-size:12.5px}

  .legal-footer{font-size:12px;padding:14px 16px}
  .footer-links{gap:5px 3px;font-size:12.5px}
  .pf-head{gap:18px}
  .pf-photo{width:136px}
}
@media (max-width: 400px){
  .grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .card .meta .name{font-size:13px}
  .site-nav a{padding:7px 7px;font-size:11.5px}
  .logo{font-size:20px}
  .chip{padding:6px 11px;font-size:12.5px}
  .detail-poster{width:min(178px,64%)}
  .section-head h1,.section-head h2{font-size:21px}
}

/* comfier tap targets on touch */
@media (hover:none){
  .site-nav a,.chip,.back-btn{min-height:40px;display:inline-flex;align-items:center}
  .prov-btn,.rv-submit,.vpn-cta,.adm-login-btn{min-height:46px}
}
/* prevent iOS auto-zoom (inputs must be >= 16px) */
@media (max-width: 680px){
  .rv-input,.adm-in,.adm-form input,.adm-form textarea,.adm-form select,.search-wrap input{font-size:16px}
}
/* respect reduced motion */
@media (prefers-reduced-motion: reduce){
  *{animation-duration:.001ms!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .card:hover,.blog-card:hover,.list-tile:hover,.prov-btn:hover,.back-btn:hover,.rv-submit:hover,.vpn-cta:hover,.adm-login-btn:hover{transform:none}
}