/* self-hosted webfonts (no external requests) */
@font-face{font-family:"Italiana";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/italiana-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-style:italic;font-weight:500;font-display:swap;src:url("../fonts/cormorant-garamond-latin-500-italic.woff2") format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-style:italic;font-weight:600;font-display:swap;src:url("../fonts/cormorant-garamond-latin-600-italic.woff2") format("woff2")}
@font-face{font-family:"Jost";font-style:normal;font-weight:300;font-display:swap;src:url("../fonts/jost-latin-300-normal.woff2") format("woff2")}
@font-face{font-family:"Jost";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/jost-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Jost";font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/jost-latin-500-normal.woff2") format("woff2")}
/* ============================================================
   VIRTUAL SHOPPING — design system
   Direction: Figma "Virtual Shopping 2026" (cinematic luxury,
   cream editorial base, coal hero, champagne accents)
   ============================================================ */

:root{
  --cream:#F6F1E9;
  --cream-2:#FBF8F2;
  --paper:#FFFFFF;
  --ink:#17130E;
  --ink-soft:#5A5248;
  --ink-faint:#8C8272;
  --line:#E4DACB;
  --champagne:#C9A87C;
  --champagne-2:#E5CBA2;
  --champagne-deep:#A57F4B;
  --coal:#0C0A09;
  --coal-2:#171310;
  --coal-3:#221C17;
  --pink:#E8849B;
  --status-caution:#B07C1E;
  --status-caution-bg:#F6E8CE;
  --status-verified:#3E7C4F;
  --status-verified-bg:#E2EEE4;
  --status-review:#75705F;
  --status-review-bg:#ECE8DD;
  --status-rejected:#A63D2E;
  --status-rejected-bg:#F3DEDA;
  --radius:22px;
  --radius-s:14px;
  --shadow:0 18px 50px -18px rgba(23,19,14,.28);
  --shadow-soft:0 10px 30px -12px rgba(23,19,14,.18);
  --font-display:"Italiana", "Times New Roman", serif;
  --font-serif:"Cormorant Garamond", Georgia, serif;
  --font-sans:"Jost", "Helvetica Neue", Arial, sans-serif;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{overflow-x:clip}
body{
  font-family:var(--font-sans);
  font-weight:300;
  background:var(--cream);
  color:var(--ink);
  font-size:16px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
img,video{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
::selection{background:var(--champagne);color:#fff}

/* ---------- typography helpers ---------- */
.display{font-family:var(--font-display);font-weight:400;line-height:.98;letter-spacing:.01em}
.serif-i{font-family:var(--font-serif);font-style:italic;font-weight:500}
.kicker{
  font-size:11px;letter-spacing:.34em;text-transform:uppercase;
  font-weight:400;color:var(--ink-faint);
}
.kicker.on-dark{color:rgba(255,255,255,.55)}
.kicker.gold{color:var(--champagne-deep)}

/* ---------- layout ---------- */
.wrap{max-width:1280px;margin:0 auto;padding:0 clamp(20px,4vw,56px)}
section{position:relative}

/* ---------- floating pill nav ---------- */
.nav-shell{position:fixed;inset:0 0 auto 0;z-index:120;padding:18px clamp(14px,3vw,36px);pointer-events:none}
.nav{
  pointer-events:auto;
  max-width:1180px;margin:0 auto;
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-radius:999px;
  box-shadow:var(--shadow-soft);
  display:flex;align-items:center;justify-content:space-between;
  padding:10px 12px 10px 26px;
  transition:box-shadow .3s;
}
.nav.scrolled{box-shadow:0 14px 40px -12px rgba(23,19,14,.35)}
.nav-logo img{height:20px;width:auto}
.nav-links{display:flex;gap:clamp(14px,2.6vw,34px);list-style:none}
.nav-links a{
  font-size:11px;letter-spacing:.26em;text-transform:uppercase;font-weight:400;
  color:var(--ink-soft);padding:8px 2px;border-bottom:1px solid transparent;transition:color .2s,border-color .2s;
}
.nav-links a:hover,.nav-links a.active{color:var(--ink);border-color:var(--champagne)}
.nav-cta{
  background:var(--coal);color:#fff;
  font-size:11px;letter-spacing:.22em;text-transform:uppercase;
  padding:12px 26px;border-radius:999px;transition:background .2s;
}
.nav-cta:hover{background:var(--coal-3)}
@media(max-width:840px){.nav-links{display:none}}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:10px;
  font-size:11px;letter-spacing:.24em;text-transform:uppercase;font-weight:400;
  padding:15px 30px;border-radius:999px;transition:.25s;white-space:nowrap;
}
.btn .tri{font-size:8px;transform:translateY(-1px)}
.btn-gold{background:linear-gradient(120deg,var(--champagne-2),var(--champagne));color:var(--coal)}
.btn-gold:hover{filter:brightness(1.06)}
.btn-glass{background:rgba(20,16,12,.42);color:#fff;border:1px solid rgba(255,255,255,.28);backdrop-filter:blur(8px)}
.btn-glass:hover{background:rgba(20,16,12,.6)}
.btn-outline{border:1px solid var(--ink);color:var(--ink);background:transparent}
.btn-outline:hover{background:var(--ink);color:var(--cream)}
.btn-dark{background:var(--coal);color:#fff}
.btn-dark:hover{background:var(--coal-3)}

/* ---------- status chips ---------- */
.chip{
  display:inline-flex;align-items:center;gap:7px;
  font-size:10px;letter-spacing:.2em;text-transform:uppercase;font-weight:500;
  padding:6px 13px;border-radius:999px;
}
.chip .dot{width:6px;height:6px;border-radius:50%;background:currentColor}
.chip-caution{background:var(--status-caution-bg);color:var(--status-caution)}
.chip-verified{background:var(--status-verified-bg);color:var(--status-verified)}
.chip-review{background:var(--status-review-bg);color:var(--status-review)}
.chip-rejected{background:var(--status-rejected-bg);color:var(--status-rejected)}
.chip-ai{background:rgba(255,255,255,.14);color:#fff;border:1px solid rgba(255,255,255,.3);backdrop-filter:blur(6px)}
.chip-ai-dark{background:rgba(23,19,14,.06);color:var(--ink-soft);border:1px solid var(--line)}
.chip-source{background:transparent;border:1px solid var(--line);color:var(--ink-faint);font-weight:400;letter-spacing:.08em;text-transform:none;font-size:11px}
a.chip-source:hover{border-color:var(--champagne-deep);color:var(--champagne-deep)}

/* ---------- section headers (Short / Entertainment pattern) ---------- */
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:clamp(30px,5vw,54px)}
.sec-title .big{
  font-family:var(--font-serif);font-style:italic;font-weight:500;
  font-size:clamp(44px,6.5vw,84px);line-height:.9;color:var(--champagne-deep);display:block;
}
.sec-title .small{
  font-family:var(--font-sans);font-weight:400;letter-spacing:.02em;
  font-size:clamp(20px,2.4vw,30px);color:var(--ink);display:block;margin-top:6px;
}
.sec-title.on-dark .small{color:#fff}

/* ============================================================
   HERO (Startseite)
   ============================================================ */
.hero{
  position:relative;min-height:100svh;display:flex;align-items:flex-end;
  background:var(--coal);color:#fff;overflow:hidden;
}
.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 30%;opacity:.94}
.hero-shade{position:absolute;inset:0;background:
  linear-gradient(90deg,rgba(8,6,5,.82) 0%,rgba(8,6,5,.28) 42%,rgba(8,6,5,.05) 65%,rgba(8,6,5,.42) 100%),
  linear-gradient(0deg,rgba(8,6,5,.88) 0%,rgba(8,6,5,0) 38%)}
.hero-inner{position:relative;width:100%;padding-bottom:clamp(60px,8vh,110px)}
.hero-grid{display:flex;align-items:flex-end;justify-content:space-between;gap:40px}
.hero-copy{max-width:640px}
.hero-ep{font-size:12px;letter-spacing:.42em;text-transform:uppercase;color:var(--champagne-2);margin-bottom:18px}
.hero-title{font-size:clamp(64px,9.5vw,150px);color:#F3E5CF;text-transform:uppercase}
.hero-sub{
  font-size:clamp(20px,2.6vw,32px);letter-spacing:.34em;text-transform:uppercase;
  font-weight:300;color:#fff;margin:10px 0 30px;
}
.hero-ctas{display:flex;gap:14px;flex-wrap:wrap}
.hero-side{flex-shrink:0;width:min(250px,26vw)}
@media(max-width:900px){.hero-side{display:none}}
.side-card{
  background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.22);
  border-radius:var(--radius);padding:10px;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  box-shadow:var(--shadow);
}
.side-card .media{position:relative;border-radius:16px;overflow:hidden;aspect-ratio:9/14}
.side-card .media img,.side-card .media video{width:100%;height:100%;object-fit:cover}
.side-card h3{font-weight:400;font-size:19px;letter-spacing:.02em;margin:14px 6px 4px}
.side-card .ts{display:flex;align-items:center;gap:8px;font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:rgba(255,255,255,.65);margin:0 6px 8px}
.hero-label{position:absolute;top:104px;right:clamp(20px,4vw,56px);z-index:5}
.hero-askbar{position:absolute;left:50%;transform:translateX(-50%);bottom:26px;z-index:6}

/* ask pill */
.ask-pill{
  display:inline-flex;align-items:center;gap:10px;
  background:rgba(22,18,14,.72);border:1px solid rgba(255,255,255,.3);
  color:#fff;border-radius:999px;padding:8px 22px 8px 8px;
  font-size:11px;letter-spacing:.26em;text-transform:uppercase;
  backdrop-filter:blur(10px);transition:.25s;box-shadow:var(--shadow);
}
.ask-pill:hover{background:rgba(22,18,14,.92);border-color:var(--champagne)}
.ask-pill img{width:30px;height:30px;border-radius:50%;object-fit:cover}

/* ---------- program strip ---------- */
.program{background:var(--coal);color:#fff;border-top:1px solid rgba(255,255,255,.08)}
.program .wrap{display:flex;align-items:center;gap:clamp(18px,3vw,44px);padding-top:22px;padding-bottom:22px;overflow-x:auto}
.program .p-label{font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--champagne);flex-shrink:0}
.p-item{display:flex;align-items:center;gap:10px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.72);white-space:nowrap}
.p-item b{font-weight:500;color:#fff}
.p-item .tri{color:var(--champagne);font-size:8px}
.p-item.live{color:var(--champagne-2)}
.p-new{font-size:9px;letter-spacing:.2em;background:var(--pink);color:#fff;border-radius:999px;padding:3px 9px}

/* ============================================================
   SHORT ENTERTAINMENT cards
   ============================================================ */
.shorts{padding:clamp(70px,9vw,130px) 0}
.shorts-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,2vw,26px)}
@media(max-width:980px){.shorts-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.shorts-grid{grid-template-columns:1fr}}
.short-card{
  position:relative;border-radius:var(--radius);overflow:hidden;aspect-ratio:9/15.5;
  box-shadow:var(--shadow);cursor:pointer;background:var(--coal-2);
}
.short-card:nth-child(2){transform:translateY(26px)}
.short-card:nth-child(4){transform:translateY(26px)}
@media(max-width:980px){.short-card:nth-child(n){transform:none}}
.short-card img,.short-card video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 6s ease}
.short-card:hover img{transform:scale(1.08)}
.short-card video{opacity:0;transition:opacity .4s}
.short-card.playing video{opacity:1}
.short-card .grad{position:absolute;inset:0;background:linear-gradient(0deg,rgba(8,6,5,.78),rgba(8,6,5,0) 46%)}
.short-card .txt{position:absolute;left:20px;right:20px;bottom:18px;color:#fff}
.short-card h3{font-weight:400;font-size:clamp(18px,1.7vw,23px);line-height:1.2;letter-spacing:.02em;margin-bottom:8px}
.short-card .ts{display:flex;align-items:center;gap:8px;font-size:9.5px;letter-spacing:.22em;text-transform:uppercase;color:rgba(255,255,255,.7)}
.short-card .ts .tri{color:var(--champagne-2);font-size:8px}

/* ============================================================
   PRODUCT REPORT (dark feature)
   ============================================================ */
.report{background:var(--coal);color:#fff;padding:clamp(80px,10vw,150px) 0;overflow:hidden}
.report-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,80px);align-items:center}
@media(max-width:920px){.report-grid{grid-template-columns:1fr}}
.report-media{position:relative;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.report-media img{width:100%;aspect-ratio:4/4.6;object-fit:cover}
.report-media .playbtn{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fff;
}
.playbtn .ring{
  width:88px;height:88px;border-radius:50%;border:1px solid rgba(255,255,255,.6);
  display:flex;align-items:center;justify-content:center;font-size:15px;
  background:rgba(12,10,9,.35);backdrop-filter:blur(6px);transition:.3s;
}
.report-media:hover .ring{transform:scale(1.08);background:rgba(12,10,9,.6)}
.report-copy .giant{
  font-family:var(--font-display);text-transform:uppercase;
  font-size:clamp(52px,6.6vw,104px);line-height:.95;color:#F3E5CF;
}
.score-row{display:flex;flex-wrap:wrap;gap:10px;margin:26px 0}
.score-pill{
  border:1px solid rgba(255,255,255,.22);border-radius:999px;
  font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;
  padding:8px 15px;color:rgba(255,255,255,.85);
}
.score-pill b{color:var(--champagne-2);font-weight:500}

/* more reports strip */
.more-reports{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2vw,26px);margin-top:clamp(46px,6vw,80px)}
@media(max-width:860px){.more-reports{grid-template-columns:1fr}}
.mini-report{
  display:flex;gap:16px;align-items:center;
  background:var(--coal-2);border:1px solid rgba(255,255,255,.08);
  border-radius:var(--radius-s);padding:14px;transition:.25s;
}
.mini-report:hover{border-color:rgba(255,255,255,.25);transform:translateY(-3px)}
.mini-report img{width:64px;height:82px;object-fit:cover;border-radius:10px}
.mini-report h4{font-weight:400;font-size:15.5px;letter-spacing:.02em;color:#fff;margin-bottom:6px}

/* ============================================================
   TRUST band
   ============================================================ */
.trustband{padding:clamp(80px,10vw,140px) 0}
.trust-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2vw,26px)}
@media(max-width:860px){.trust-cards{grid-template-columns:1fr}}
.trust-card{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);
  padding:clamp(24px,3vw,38px);box-shadow:var(--shadow-soft);
}
.trust-card .num{font-family:var(--font-serif);font-style:italic;font-size:44px;color:var(--champagne);line-height:1}
.trust-card h3{font-weight:400;font-size:20px;margin:14px 0 10px;letter-spacing:.02em}
.trust-card p{font-size:14.5px;color:var(--ink-soft)}

/* ============================================================
   FOOTER
   ============================================================ */
footer{background:var(--coal);color:rgba(255,255,255,.65);padding:clamp(60px,8vw,100px) 0 40px;font-size:13.5px}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1.4fr;gap:clamp(26px,4vw,60px);margin-bottom:54px}
@media(max-width:900px){.foot-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.foot-grid{grid-template-columns:1fr}}
footer .logo img{height:22px;margin-bottom:18px}
footer h5{font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--champagne);font-weight:500;margin-bottom:16px}
footer ul{list-style:none}
footer li{margin-bottom:9px}
footer a:hover{color:#fff}
.foot-note{border-top:1px solid rgba(255,255,255,.12);padding-top:26px;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:11.5px;color:rgba(255,255,255,.4)}
.ai-disclosure{
  border:1px solid rgba(255,255,255,.16);border-radius:var(--radius-s);
  padding:18px 20px;font-size:12.5px;line-height:1.6;color:rgba(255,255,255,.6);
}
.ai-disclosure b{color:#fff;font-weight:500}

/* ============================================================
   SUBPAGE common
   ============================================================ */
.page-head{padding:clamp(150px,17vw,210px) 0 clamp(40px,5vw,70px)}
.page-head .display{font-size:clamp(46px,6.4vw,92px)}
.page-head p.lead{max-width:640px;font-size:17px;color:var(--ink-soft);margin-top:18px}
.crumbs{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:20px}
.crumbs a:hover{color:var(--champagne-deep)}

/* dark page head variant */
.page-head.dark{background:var(--coal);color:#fff}
.page-head.dark p.lead{color:rgba(255,255,255,.7)}

/* ============================================================
   DOSSIER (product page)
   ============================================================ */
.verdict-card{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);
  padding:26px 28px;box-shadow:var(--shadow-soft);min-width:280px;
}
.verdict-card .v-status{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.v-badge{
  font-size:13px;letter-spacing:.3em;text-transform:uppercase;font-weight:500;
  color:var(--status-caution);border:1.5px solid var(--status-caution);
  padding:10px 20px;border-radius:999px;
}
.verdict-card .meta{font-size:12.5px;color:var(--ink-faint);line-height:1.8}
.verdict-card .meta b{color:var(--ink);font-weight:500}

.dossier-hero{display:flex;justify-content:space-between;gap:clamp(26px,4vw,60px);align-items:flex-end;flex-wrap:wrap}

.d-section{padding:clamp(46px,6vw,84px) 0;border-top:1px solid var(--line)}
.d-section > .wrap > .kicker{display:block;margin-bottom:26px}
.d-title{font-size:clamp(30px,3.6vw,52px);margin-bottom:14px}
.d-intro{max-width:760px;color:var(--ink-soft);font-size:16px}

/* media row */
.media-row{display:grid;grid-template-columns:minmax(280px,380px) 1fr;gap:clamp(16px,2.4vw,28px);align-items:start}
@media(max-width:880px){.media-row{grid-template-columns:1fr}}
.video-shell{position:relative;border-radius:var(--radius);overflow:hidden;background:var(--coal);box-shadow:var(--shadow)}
.video-shell video{width:100%;aspect-ratio:9/16;object-fit:cover}
.video-shell .v-tag{position:absolute;top:14px;left:14px;z-index:3}
.gallery{display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:1fr;gap:clamp(10px,1.4vw,18px)}
@media(max-width:880px){.gallery{grid-template-columns:repeat(3,1fr)}}
.gallery .g-item{border-radius:var(--radius-s);overflow:hidden;position:relative;aspect-ratio:3/3.6;box-shadow:var(--shadow-soft)}
.gallery .g-item img{width:100%;height:100%;object-fit:cover;transition:transform .8s}
.gallery .g-item:hover img{transform:scale(1.06)}
.gallery .g-item.tall{grid-row:span 2;aspect-ratio:auto}

/* scores */
.scores{display:grid;gap:14px;max-width:860px}
.score-line{
  display:grid;grid-template-columns:190px 150px 1fr;gap:20px;align-items:center;
  background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-s);
  padding:18px 24px;
}
@media(max-width:800px){.score-line{grid-template-columns:1fr;gap:8px}}
.score-line .s-name{font-size:12px;letter-spacing:.22em;text-transform:uppercase;font-weight:500}
.dots{display:flex;gap:6px}
.dots span{width:11px;height:11px;border-radius:50%;background:var(--line)}
.dots span.on{background:var(--champagne-deep)}
.score-line .s-note{font-size:13px;color:var(--ink-soft);line-height:1.55}

/* claims two-column */
.claims-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,2.6vw,34px)}
@media(max-width:920px){.claims-grid{grid-template-columns:1fr}}
.claims-col{border-radius:var(--radius);padding:clamp(22px,3vw,36px)}
.claims-col.removed{background:var(--coal);color:#fff}
.claims-col.approved{background:var(--paper);border:1px solid var(--line)}
.claims-col h3{font-weight:400;font-size:22px;letter-spacing:.02em;margin-bottom:6px}
.claims-col .sub{font-size:12.5px;margin-bottom:22px;opacity:.6}
.claim-item{padding:13px 0;border-top:1px solid rgba(127,116,99,.22);font-size:14.5px;line-height:1.55}
.claims-col.removed .claim-item{border-color:rgba(255,255,255,.12)}
.claim-item .strike{text-decoration:line-through;text-decoration-color:var(--pink);text-decoration-thickness:1.5px;opacity:.75}
.claim-item .why{display:block;font-size:11.5px;letter-spacing:.06em;color:var(--champagne);margin-top:5px;text-transform:uppercase}
.claim-item .srcs{display:flex;flex-wrap:wrap;gap:7px;margin-top:9px}

/* rating split */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,2.6vw,34px);max-width:900px}
@media(max-width:760px){.split{grid-template-columns:1fr}}
.split-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:30px;text-align:center}
.split-card .big-num{font-family:var(--font-serif);font-style:italic;font-size:76px;line-height:1;color:var(--ink)}
.split-card .big-num.low{color:var(--status-rejected)}
.split-card .big-num.high{color:var(--status-verified)}
.split-card p{font-size:13px;color:var(--ink-soft);margin-top:10px}

/* fit lists */
.fit-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,2.6vw,34px)}
@media(max-width:860px){.fit-grid{grid-template-columns:1fr}}
.fit-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:clamp(22px,3vw,34px)}
.fit-card h3{font-weight:400;font-size:20px;margin-bottom:16px}
.fit-card li{list-style:none;padding:10px 0 10px 30px;position:relative;font-size:14.5px;color:var(--ink-soft);border-top:1px solid var(--line)}
.fit-card li::before{content:"";position:absolute;left:2px;top:16px;width:14px;height:14px;border-radius:50%}
.fit-card.yes li::before{background:var(--status-verified-bg);border:1px solid var(--status-verified)}
.fit-card.no li::before{background:var(--status-caution-bg);border:1px solid var(--status-caution)}
.fit-card li b{color:var(--ink);font-weight:500}

/* decoder + price tables */
.t-table{width:100%;border-collapse:collapse;background:var(--paper);border-radius:var(--radius-s);overflow:hidden;box-shadow:var(--shadow-soft);font-size:14px}
.t-table th{
  text-align:left;font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;font-weight:500;
  color:var(--ink-faint);padding:16px 20px;border-bottom:1px solid var(--line);background:var(--cream-2);
}
.t-table td{padding:15px 20px;border-bottom:1px solid var(--line);vertical-align:top;color:var(--ink-soft)}
.t-table tr:last-child td{border-bottom:none}
.t-table td b{color:var(--ink);font-weight:500}
.t-table .best td{background:#F4EBDC}
.price-note{font-size:12px;color:var(--ink-faint);margin-top:12px}

/* callout */
.callout{
  border-left:3px solid var(--champagne);background:var(--paper);
  border-radius:0 var(--radius-s) var(--radius-s) 0;
  padding:22px 26px;font-size:14.5px;color:var(--ink-soft);max-width:860px;
}
.callout b{color:var(--ink);font-weight:500}
.callout.warn{border-color:var(--status-caution);background:var(--status-caution-bg)}

/* merchant buttons */
.merchants{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.m-btn{
  display:flex;flex-direction:column;gap:2px;
  border:1px solid var(--line);background:var(--paper);border-radius:var(--radius-s);
  padding:14px 22px;transition:.2s;
}
.m-btn:hover{border-color:var(--champagne-deep);transform:translateY(-2px);box-shadow:var(--shadow-soft)}
.m-btn .m-name{font-size:13.5px;font-weight:500;color:var(--ink)}
.m-btn .m-price{font-family:var(--font-serif);font-style:italic;font-size:20px;color:var(--champagne-deep)}
.m-btn .m-aff{font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-faint)}

/* sources cloud */
.src-cloud{display:flex;flex-wrap:wrap;gap:10px;max-width:960px}

/* ============================================================
   PRODUCTS (catalog)
   ============================================================ */
.filter-bar{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin:10px 0 40px}
.filter-bar input{
  font-family:inherit;font-size:14px;font-weight:300;
  border:1px solid var(--line);background:var(--paper);border-radius:999px;
  padding:13px 24px;min-width:min(320px,100%);outline:none;color:var(--ink);
}
.filter-bar input:focus{border-color:var(--champagne-deep)}
.f-chip{
  font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;
  border:1px solid var(--line);border-radius:999px;padding:10px 18px;color:var(--ink-soft);transition:.2s;background:var(--paper);
}
.f-chip:hover{border-color:var(--ink)}
.f-chip.active{background:var(--coal);color:#fff;border-color:var(--coal)}
.prod-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.4vw,30px)}
@media(max-width:980px){.prod-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.prod-grid{grid-template-columns:1fr}}
.prod-card{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;box-shadow:var(--shadow-soft);transition:.3s;display:flex;flex-direction:column;
}
.prod-card:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.prod-card .p-media{position:relative;aspect-ratio:4/4.4;overflow:hidden;background:var(--cream-2)}
.prod-card .p-media img{width:100%;height:100%;object-fit:cover;transition:transform .9s}
.prod-card:hover .p-media img{transform:scale(1.05)}
.prod-card .p-media .chip{position:absolute;top:14px;left:14px}
.prod-card .p-body{padding:22px 24px 26px;display:flex;flex-direction:column;gap:8px;flex:1}
.prod-card .p-brand{font-size:10px;letter-spacing:.26em;text-transform:uppercase;color:var(--ink-faint)}
.prod-card h3{font-weight:400;font-size:20px;letter-spacing:.01em;line-height:1.25}
.prod-card .p-note{font-size:13px;color:var(--ink-soft);flex:1}
.prod-card .p-link{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--champagne-deep);margin-top:10px}

/* ============================================================
   SHOWS
   ============================================================ */
.ep-feature{display:grid;grid-template-columns:1.35fr 1fr;gap:clamp(24px,4vw,60px);align-items:center}
@media(max-width:920px){.ep-feature{grid-template-columns:1fr}}
.ep-feature.flip{grid-template-columns:1fr 1.35fr}
@media(max-width:920px){.ep-feature.flip{grid-template-columns:1fr}}
.video-land{position:relative;border-radius:var(--radius);overflow:hidden;background:var(--coal);box-shadow:var(--shadow)}
.video-land video{width:100%;aspect-ratio:16/9}
.formats{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2vw,26px)}
@media(max-width:860px){.formats{grid-template-columns:1fr}}
.gallery-band{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin-top:60px}
@media(max-width:900px){.gallery-band{grid-template-columns:repeat(3,1fr)}}
.gallery-band img{border-radius:var(--radius-s);aspect-ratio:3/4.4;object-fit:cover;width:100%;box-shadow:var(--shadow-soft)}

/* ============================================================
   TRUST page
   ============================================================ */
.ladder{display:grid;gap:12px;max-width:900px}
.ladder-row{
  display:grid;grid-template-columns:200px 1fr;gap:22px;align-items:start;
  background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-s);padding:20px 26px;
}
@media(max-width:720px){.ladder-row{grid-template-columns:1fr}}
.ladder-row p{font-size:14px;color:var(--ink-soft)}
.steps{counter-reset:step;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2vw,24px)}
@media(max-width:900px){.steps{grid-template-columns:1fr}}
.step{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-s);padding:24px;position:relative;
}
.step::before{
  counter-increment:step;content:"0" counter(step);
  font-family:var(--font-serif);font-style:italic;font-size:34px;color:var(--champagne);display:block;margin-bottom:10px;
}
.step h4{font-weight:500;font-size:15.5px;margin-bottom:8px;letter-spacing:.02em}
.step p{font-size:13px;color:var(--ink-soft)}

/* ============================================================
   ASK ALINA drawer
   ============================================================ */
.ask-fab{
  position:fixed;right:clamp(16px,3vw,36px);bottom:clamp(16px,3vw,32px);z-index:130;
}
.ask-overlay{
  position:fixed;inset:0;background:rgba(10,8,7,.5);backdrop-filter:blur(3px);
  opacity:0;pointer-events:none;transition:opacity .3s;z-index:140;
}
.ask-overlay.open{opacity:1;pointer-events:auto}
.ask-drawer{
  position:fixed;top:0;right:0;bottom:0;width:min(430px,100vw);z-index:150;
  background:var(--coal-2);color:#fff;display:flex;flex-direction:column;
  transform:translateX(105%);visibility:hidden;
  transition:transform .38s cubic-bezier(.3,.7,.2,1),visibility 0s .4s;
  box-shadow:-30px 0 80px rgba(0,0,0,.4);
}
.ask-drawer.open{transform:none;visibility:visible;transition:transform .38s cubic-bezier(.3,.7,.2,1)}
.ask-head{display:flex;align-items:center;gap:14px;padding:22px 24px;border-bottom:1px solid rgba(255,255,255,.1)}
.ask-head img{width:46px;height:46px;border-radius:50%;object-fit:cover;border:1.5px solid var(--champagne)}
.ask-head .n{font-size:16px;letter-spacing:.06em}
.ask-head .l{font-size:9.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--champagne);margin-top:3px}
.ask-close{margin-left:auto;font-size:22px;color:rgba(255,255,255,.6);padding:6px 10px}
.ask-close:hover{color:#fff}
.ask-body{flex:1;overflow-y:auto;padding:22px;display:flex;flex-direction:column;gap:14px}
.msg{max-width:88%;font-size:14px;line-height:1.6;border-radius:18px;padding:13px 17px}
.msg.alina{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.1);border-top-left-radius:6px}
.msg.user{background:var(--champagne);color:var(--coal);align-self:flex-end;border-bottom-right-radius:6px;font-weight:400}
.msg .m-srcs{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.msg .m-srcs .chip-source{border-color:rgba(255,255,255,.25);color:rgba(255,255,255,.6);font-size:10px}
.msg .m-status{display:block;font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--champagne);margin-bottom:7px}
.ask-sugg{padding:0 22px 12px;display:flex;flex-wrap:wrap;gap:8px}
.sugg{
  font-size:11.5px;border:1px solid rgba(255,255,255,.25);border-radius:999px;
  padding:8px 14px;color:rgba(255,255,255,.8);transition:.2s;text-align:left;
}
.sugg:hover{border-color:var(--champagne);color:#fff}
.ask-foot{padding:14px 22px 20px;border-top:1px solid rgba(255,255,255,.1)}
.ask-input{display:flex;gap:10px}
.ask-input input{
  flex:1;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);
  border-radius:999px;padding:13px 20px;color:#fff;font-family:inherit;font-size:14px;font-weight:300;outline:none;
}
.ask-input input:focus{border-color:var(--champagne)}
.ask-input button{background:var(--champagne);color:var(--coal);border-radius:999px;padding:0 22px;font-size:16px}
.ask-note{font-size:10px;color:rgba(255,255,255,.35);margin-top:10px;line-height:1.5}

/* ---------- reveal animation ---------- */
.rv{opacity:0;transform:translateY(26px);transition:opacity .8s ease,transform .8s ease}
.rv.in{opacity:1;transform:none}
.rv-d1{transition-delay:.1s}.rv-d2{transition-delay:.2s}.rv-d3{transition-delay:.3s}

/* ============================================================
   REEL ROWS — netflix-style horizontal cover scrolling
   ============================================================ */
.row-head{display:flex;align-items:baseline;justify-content:space-between;gap:18px;margin:0 0 18px}
.row-head h3{font-weight:400;font-size:clamp(19px,2vw,25px);letter-spacing:.02em;color:#fff}
.row-head .serif-i{color:var(--champagne);font-size:clamp(24px,2.4vw,32px);margin-right:6px}
.row-head .hint{font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:rgba(255,255,255,.4)}
.reel-row-wrap{position:relative;margin-bottom:clamp(34px,4vw,60px)}
.reel-row{
  display:flex;gap:clamp(12px,1.4vw,18px);overflow-x:auto;
  scroll-snap-type:x mandatory;scroll-behavior:smooth;
  padding:6px 4px 20px;scrollbar-width:none;-ms-overflow-style:none;
}
.reel-row::-webkit-scrollbar{display:none}
.reel-cover{
  position:relative;flex:0 0 auto;width:clamp(168px,15.5vw,225px);aspect-ratio:9/16;
  border-radius:16px;overflow:hidden;scroll-snap-align:start;cursor:pointer;
  background:var(--coal-2);box-shadow:0 16px 40px -16px rgba(0,0,0,.65);
}
.reel-cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .7s ease}
.reel-cover:hover img{transform:scale(1.07)}
.reel-cover .grad{position:absolute;inset:0;background:linear-gradient(0deg,rgba(8,6,5,.82),rgba(8,6,5,0) 46%)}
.play-badge{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:52px;height:52px;border-radius:50%;
  border:1px solid rgba(255,255,255,.55);background:rgba(12,10,9,.42);
  backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);
  display:flex;align-items:center;justify-content:center;color:#fff;font-size:13px;
  transition:transform .3s,background .3s;
}
.reel-cover:hover .play-badge{transform:translate(-50%,-50%) scale(1.14);background:rgba(12,10,9,.68)}
.reel-cover .cv-txt{position:absolute;left:14px;right:14px;bottom:12px;color:#fff}
.reel-cover .cv-txt h4{font-weight:400;font-size:15px;letter-spacing:.02em;line-height:1.25}
.reel-cover .cv-txt p{font-size:8.5px;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.6);margin-top:4px}
.row-arrow{
  position:absolute;top:calc(50% - 32px);z-index:6;width:44px;height:44px;border-radius:50%;
  background:rgba(12,10,9,.72);border:1px solid rgba(255,255,255,.3);color:#fff;font-size:15px;
  backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;transition:.2s;
}
.row-arrow:hover{background:rgba(12,10,9,.95);border-color:var(--champagne)}
.row-arrow.prev{left:-12px}
.row-arrow.next{right:-12px}
@media(max-width:760px){.row-arrow{display:none}}

/* episode cards — cover + slide-up info on hover */
.ep-card{
  position:relative;flex:0 0 auto;width:clamp(240px,22vw,310px);aspect-ratio:9/13.6;
  border-radius:18px;overflow:hidden;scroll-snap-align:start;cursor:pointer;
  background:var(--coal-2);box-shadow:0 20px 50px -18px rgba(0,0,0,.7);
}
.ep-card>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s ease}
.ep-card:hover>img{transform:scale(1.06)}
.ep-card .status{position:absolute;top:14px;left:14px;z-index:3}
.ep-card .ep-info{
  position:absolute;left:0;right:0;bottom:0;padding:64px 18px 18px;color:#fff;
  background:linear-gradient(0deg,rgba(8,6,5,.97) 55%,rgba(8,6,5,.55) 78%,transparent);
  transform:translateY(calc(100% - 102px));transition:transform .45s cubic-bezier(.2,.8,.25,1);
}
.ep-card:hover .ep-info,.ep-card:focus-within .ep-info{transform:none}
.ep-info .ep-time{font-size:9px;letter-spacing:.24em;text-transform:uppercase;color:var(--champagne-2);margin-bottom:6px}
.ep-info h4{font-weight:400;font-size:19px;letter-spacing:.02em;line-height:1.2;margin-bottom:10px}
.ep-info .ep-prod{font-size:11.5px;color:rgba(255,255,255,.85);border-left:2px solid var(--champagne);padding-left:10px;margin-bottom:8px;line-height:1.5}
.ep-info .ep-ess{font-size:11.5px;color:rgba(255,255,255,.62);line-height:1.55;margin-bottom:12px}
.ep-info .ep-btns{display:flex;gap:8px;flex-wrap:wrap}
.ep-btn{
  font-size:9px;letter-spacing:.2em;text-transform:uppercase;font-weight:500;
  padding:9px 15px;border-radius:999px;transition:.2s;display:inline-flex;align-items:center;gap:6px;
}
.ep-btn.gold{background:linear-gradient(120deg,var(--champagne-2),var(--champagne));color:var(--coal)}
.ep-btn.gold:hover{filter:brightness(1.07)}
.ep-btn.line{border:1px solid rgba(255,255,255,.4);color:#fff}
.ep-btn.line:hover{border-color:var(--champagne);color:var(--champagne-2)}

/* billboard — featured episode */
.billboard{
  position:relative;border-radius:var(--radius);overflow:hidden;
  min-height:min(560px,72vh);display:flex;align-items:flex-end;
  box-shadow:var(--shadow);margin-bottom:clamp(44px,5vw,70px);
}
.billboard>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 25%}
.bb-shade{position:absolute;inset:0;background:
  linear-gradient(90deg,rgba(8,6,5,.88) 0%,rgba(8,6,5,.45) 45%,rgba(8,6,5,.08) 75%),
  linear-gradient(0deg,rgba(8,6,5,.92) 0%,rgba(8,6,5,0) 55%)}
.bb-content{position:relative;padding:clamp(24px,4vw,54px);max-width:640px;color:#fff}
.bb-content .giant-t{font-family:var(--font-display);font-size:clamp(42px,5.4vw,84px);line-height:.95;color:#F3E5CF;text-transform:uppercase;margin:10px 0 16px}
.product-box{
  border:1px solid rgba(255,255,255,.22);border-radius:14px;
  background:rgba(12,10,9,.52);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  padding:14px 18px;font-size:13px;color:rgba(255,255,255,.85);line-height:1.6;margin:14px 0;
}
.product-box b{color:#fff;font-weight:500}
.bb-ess{font-size:14px;color:rgba(255,255,255,.72);line-height:1.65;max-width:560px;margin-bottom:20px}
.bb-ess b{color:var(--champagne-2);font-weight:500}

/* dark cards (formats on dark page) */
.trust-card.dark{background:var(--coal-2);border:1px solid rgba(255,255,255,.1);box-shadow:none}
.trust-card.dark h3{color:#fff}
.trust-card.dark p{color:rgba(255,255,255,.62)}

/* ============================================================
   VISION / ABOUT — model house section
   ============================================================ */
.vision{background:var(--coal);color:#fff;padding:clamp(80px,10vw,150px) 0 clamp(60px,8vw,100px);overflow:hidden}
.vision-intro{max-width:820px;margin-bottom:clamp(44px,6vw,80px)}
.vision-intro h2{font-family:var(--font-display);font-size:clamp(44px,6vw,96px);line-height:.98;color:#F3E5CF;margin:16px 0 22px}
.vision-intro h2 .serif-i{color:var(--champagne);text-transform:none}
.vision-intro p{font-size:clamp(15px,1.4vw,17.5px);color:rgba(255,255,255,.72);line-height:1.75;max-width:720px}
.vision-intro p b{color:#fff;font-weight:500}
.char-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2.4vw,30px);margin-bottom:clamp(50px,6vw,84px)}
@media(max-width:820px){.char-grid{grid-template-columns:1fr}}
.char-card{
  position:relative;border-radius:var(--radius);overflow:hidden;aspect-ratio:4/4.7;
  box-shadow:var(--shadow);cursor:default;
}
.char-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 18%;transition:transform 1.2s ease}
.char-card:hover img{transform:scale(1.05)}
.char-card .grad{position:absolute;inset:0;background:linear-gradient(0deg,rgba(8,6,5,.92) 4%,rgba(8,6,5,.35) 38%,rgba(8,6,5,0) 60%)}
.char-card .c-txt{position:absolute;left:clamp(18px,3vw,34px);right:clamp(18px,3vw,34px);bottom:clamp(18px,3vw,30px)}
.char-card .c-name{font-family:var(--font-display);font-size:clamp(30px,3.4vw,52px);line-height:1;color:#F3E5CF;text-transform:uppercase}
.char-card .c-role{font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--champagne-2);margin:8px 0 10px}
.char-card .c-desc{font-size:13.5px;color:rgba(255,255,255,.72);line-height:1.6;max-width:460px}

/* ============================================================
   REEL MODAL (shorts viewer)
   ============================================================ */
.reel-modal{
  position:fixed;inset:0;z-index:170;
  background:rgba(8,6,5,.93);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  display:none;align-items:center;justify-content:center;padding:clamp(14px,3vw,40px);
}
.reel-modal.open{display:flex}
.reel-box{
  display:flex;flex-direction:column;gap:0;
  width:min(92vw,440px);max-height:94svh;
  animation:reelIn .35s cubic-bezier(.2,.8,.25,1);
}
@keyframes reelIn{from{opacity:0;transform:scale(.92) translateY(18px)}to{opacity:1;transform:none}}
.reel-media{
  position:relative;border-radius:22px 22px 0 0;overflow:hidden;background:#000;
  box-shadow:0 40px 120px -30px rgba(0,0,0,.8);
}
.reel-media video,.reel-media img{width:100%;max-height:calc(94svh - 92px);aspect-ratio:9/16;object-fit:cover;display:block}
.reel-media .chip{position:absolute;top:14px;left:14px;z-index:3}
.reel-info{
  background:var(--coal-2);border-radius:0 0 22px 22px;
  padding:16px 20px;display:flex;align-items:center;justify-content:space-between;gap:16px;color:#fff;
}
.reel-info .t h3{font-weight:400;font-size:18px;letter-spacing:.02em}
.reel-info .t p{font-size:9.5px;letter-spacing:.22em;text-transform:uppercase;color:rgba(255,255,255,.55);margin-top:4px}
.reel-link{
  flex-shrink:0;display:inline-flex;align-items:center;gap:8px;
  background:linear-gradient(120deg,var(--champagne-2),var(--champagne));color:var(--coal);
  font-size:10px;letter-spacing:.18em;text-transform:uppercase;font-weight:500;
  padding:11px 18px;border-radius:999px;transition:.2s;white-space:nowrap;
}
.reel-link:hover{filter:brightness(1.07)}
.reel-link.hidden{display:none}
.reel-close{
  position:absolute;top:14px;right:14px;z-index:4;
  width:38px;height:38px;border-radius:50%;
  background:rgba(12,10,9,.55);border:1px solid rgba(255,255,255,.3);color:#fff;
  font-size:19px;line-height:1;backdrop-filter:blur(6px);
}
.reel-close:hover{background:rgba(12,10,9,.85)}
@media(max-width:520px){
  .reel-box{width:100vw;max-height:100svh}
  .reel-media{border-radius:0}
  .reel-info{border-radius:0}
}

/* video lightbox */
.lightbox{
  position:fixed;inset:0;z-index:160;background:rgba(8,6,5,.92);
  display:none;align-items:center;justify-content:center;padding:30px;
}
.lightbox.open{display:flex}
.lightbox video{max-height:88vh;max-width:min(92vw,480px);border-radius:18px}
.lightbox video.land{max-width:min(92vw,1100px)}
.lightbox .lb-close{position:absolute;top:22px;right:30px;color:#fff;font-size:30px;opacity:.7}
.lightbox .lb-close:hover{opacity:1}
