/* ═══════════════════════════════════════════════════════════════
   A KNIGHT OF THE SEVEN KINGDOMS — landing experience
   Mobile-first · parchment & tourney-grounds · no frameworks
   ═══════════════════════════════════════════════════════════════ */

/* ---------- fonts ---------- */
@font-face{font-family:'Cinzel';font-style:normal;font-weight:400 900;font-display:swap;src:url('../fonts/Cinzel-400-900.woff2') format('woff2')}
@font-face{font-family:'EB Garamond';font-style:normal;font-weight:400 800;font-display:swap;src:url('../fonts/EBGaramond-400-800.woff2') format('woff2')}
@font-face{font-family:'EB Garamond';font-style:italic;font-weight:400 800;font-display:swap;src:url('../fonts/EBGaramond-400-800-i.woff2') format('woff2')}
@font-face{font-family:'IM Fell English';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/IMFellEnglish-400.woff2') format('woff2')}
@font-face{font-family:'IM Fell English';font-style:italic;font-weight:400;font-display:swap;src:url('../fonts/IMFellEnglish-400-i.woff2') format('woff2')}

/* ---------- tokens ---------- */
:root{
  --ink:#171208;
  --ink-2:#221a0e;
  --ink-3:#2d2214;
  --parchment:#e9dcbd;
  --parchment-2:#e0d0ab;
  --parchment-deep:#cdbb90;
  --paper-ink:#2e2415;
  --paper-ink-soft:#5a4a2f;
  --gold:#c9a227;
  --gold-soft:#b08d3c;
  --ember:#d4692a;
  --ember-soft:#e8955a;
  --leaf:#5a6b46;
  --blood:#8f3b2e;
  --cream:#f4ecd8;
  --serif:'EB Garamond',Georgia,serif;
  --display:'Cinzel',serif;
  --fell:'IM Fell English',Georgia,serif;
  --nav-h:64px;
  --ease-out:cubic-bezier(.22,1,.36,1);
  --ease-tale:cubic-bezier(.6,.05,.2,1);
}

/* ---------- reset ---------- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--nav-h) + 8px);-webkit-text-size-adjust:100%}
body{
  font-family:var(--serif);
  font-size:16.5px;
  line-height:1.65;
  background:var(--ink);
  color:var(--cream);
  overflow-x:hidden;
  min-height:100svh;
}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
ul,ol{list-style:none}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:2px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip-link{position:fixed;top:-60px;left:12px;z-index:300;background:var(--gold);color:var(--ink);padding:10px 16px;border-radius:4px;font-family:var(--display);font-size:13px;letter-spacing:.08em;transition:top .25s}
.skip-link:focus{top:12px}
::selection{background:rgba(201,162,39,.85);color:var(--ink)}
::-webkit-scrollbar{width:10px}
::-webkit-scrollbar-track{background:var(--ink)}
::-webkit-scrollbar-thumb{background:#4a3a20;border-radius:5px;border:2px solid var(--ink)}

/* ---------- buttons ---------- */
.btn{
  position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:48px;padding:12px 26px;
  font-family:var(--display);font-weight:700;font-size:14px;letter-spacing:.14em;text-transform:uppercase;
  border-radius:3px;transition:transform .35s var(--ease-out),box-shadow .35s,background .35s,color .35s,border-color .35s;
  -webkit-tap-highlight-color:transparent;user-select:none;
}
.btn__icon{width:18px;height:18px;fill:currentColor;flex:none}
.btn--gold{background:linear-gradient(160deg,#dcb545,#a8842a);color:#1d1503;box-shadow:0 10px 30px -8px rgba(201,162,39,.45),inset 0 1px 0 rgba(255,255,255,.35)}
.btn--gold:hover{transform:translateY(-2px);box-shadow:0 16px 38px -8px rgba(201,162,39,.6),inset 0 1px 0 rgba(255,255,255,.4)}
.btn--gold:active{transform:translateY(0) scale(.97)}
.btn--ghost{border:1px solid rgba(244,236,216,.4);color:var(--cream);background:rgba(23,18,8,.35);backdrop-filter:blur(6px)}
.btn--ghost:hover{border-color:var(--gold);color:var(--gold);transform:translateY(-2px)}
.btn--ghost:active{transform:scale(.97)}
.btn--ink{border:1px solid rgba(46,36,21,.5);color:var(--paper-ink);background:transparent}
.btn--ink:hover{background:var(--paper-ink);color:var(--parchment);transform:translateY(-2px)}
.btn--ink:active{transform:scale(.97)}
.btn--sm{min-height:40px;padding:8px 18px;font-size:12px}
.btn--lg{min-height:56px;padding:15px 34px;font-size:15px}

/* ---------- nav ---------- */
.nav{
  position:fixed;inset:0 0 auto 0;z-index:200;
  transition:background .45s,box-shadow .45s,transform .45s var(--ease-out);
  background:linear-gradient(180deg,rgba(14,10,4,.72),rgba(14,10,4,0));
}
.nav--solid{background:rgba(17,12,5,.92);backdrop-filter:blur(12px);box-shadow:0 1px 0 rgba(201,162,39,.18),0 14px 40px -18px rgba(0,0,0,.8)}
.nav--hidden{transform:translateY(-100%)}
.nav__progress{position:absolute;left:0;bottom:-1px;height:2px;width:100%;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,var(--gold),var(--ember));z-index:2}
.nav__inner{max-width:1400px;margin:0 auto;height:var(--nav-h);display:flex;align-items:center;gap:20px;padding:0 clamp(16px,4vw,40px)}
.nav__brand{flex:none}
.nav__wordmark{width:clamp(150px,18vw,220px);height:auto;filter:drop-shadow(0 2px 8px rgba(0,0,0,.6))}
.nav__links{display:none;margin-left:auto;gap:clamp(14px,2.2vw,30px)}
.nav__link{
  position:relative;font-family:var(--display);font-size:12.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:rgba(244,236,216,.75);padding:8px 2px;transition:color .3s;
}
.nav__link::after{content:"";position:absolute;left:0;right:100%;bottom:2px;height:1px;background:var(--gold);transition:right .35s var(--ease-out)}
.nav__link:hover,.nav__link--active{color:var(--gold)}
.nav__link:hover::after,.nav__link--active::after{right:0}
.nav__actions{margin-left:auto;display:flex;align-items:center;gap:14px}
@media(min-width:960px){.nav__links{display:flex}.nav__actions{margin-left:0}}
.nav__burger{display:flex;flex-direction:column;justify-content:center;gap:5px;width:44px;height:44px;align-items:center;border-radius:4px}
.nav__burger span{display:block;width:24px;height:2px;background:var(--cream);transition:transform .35s var(--ease-out),opacity .25s;transform-origin:center}
.nav__burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav__burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.nav__burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media(min-width:960px){.nav__burger{display:none}}
.nav__cta{display:none}
@media(min-width:640px){.nav__cta{display:inline-flex}}

/* ---------- mobile menu ---------- */
.mmenu{
  position:fixed;inset:0;z-index:190;display:flex;flex-direction:column;justify-content:center;gap:8px;
  padding:calc(var(--nav-h) + 24px) clamp(24px,8vw,64px) 40px;
  background:
    radial-gradient(120% 80% at 50% 0%,rgba(90,64,24,.35),transparent 60%),
    linear-gradient(180deg,#120d05,#1c150a 60%,#120d05);
  opacity:0;visibility:hidden;transition:opacity .45s var(--ease-out),visibility 0s .45s;
}
.mmenu--open{opacity:1;visibility:visible;transition:opacity .45s var(--ease-out)}
.mmenu__links{display:flex;flex-direction:column}
.mmenu__link{
  display:flex;align-items:baseline;gap:16px;padding:16px 4px;
  font-family:var(--display);font-size:clamp(24px,7vw,34px);font-weight:700;letter-spacing:.04em;color:var(--cream);
  border-bottom:1px solid rgba(201,162,39,.16);
  opacity:0;transform:translateY(18px);transition:opacity .5s var(--ease-out),transform .5s var(--ease-out),color .3s,padding-left .3s;
}
.mmenu--open .mmenu__link{opacity:1;transform:none}
.mmenu--open .mmenu__link:nth-child(1){transition-delay:.08s}
.mmenu--open .mmenu__link:nth-child(2){transition-delay:.14s}
.mmenu--open .mmenu__link:nth-child(3){transition-delay:.2s}
.mmenu--open .mmenu__link:nth-child(4){transition-delay:.26s}
.mmenu--open .mmenu__link:nth-child(5){transition-delay:.32s}
.mmenu__link:hover{color:var(--gold);padding-left:10px}
.mmenu__numeral{font-family:var(--fell);font-style:italic;font-size:.6em;color:var(--gold-soft);min-width:2ch}
.mmenu__cta{margin-top:28px;align-self:flex-start}
.mmenu__foot{margin-top:14px;font-family:var(--fell);font-style:italic;color:rgba(244,236,216,.5);font-size:15px}

/* ---------- hero ---------- */
.hero{position:relative;min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;text-align:center;padding:calc(var(--nav-h) + 32px) 20px 90px;isolation:isolate}
.hero__sky{position:absolute;inset:0;z-index:-5;background:linear-gradient(180deg,#0c0a06 0%,#241a0c 38%,#4a3218 62%,#7a5224 82%,#93642c 100%)}
.hero__backdrop{position:absolute;inset:-12% 0 0 0;z-index:-4}
.hero__backdrop img{width:100%;height:112%;object-fit:cover;object-position:center 62%;opacity:.85;animation:heroDrift 36s ease-in-out infinite alternate;will-change:transform}
@keyframes heroDrift{from{transform:scale(1.02) translateY(0)}to{transform:scale(1.1) translateY(-1.5%)}}
.hero__grade{position:absolute;inset:0;z-index:-3;background:
  radial-gradient(90% 60% at 50% 38%,transparent 30%,rgba(12,9,4,.55) 100%),
  linear-gradient(180deg,rgba(12,9,4,.72) 0%,transparent 26%,transparent 55%,rgba(12,9,4,.9) 88%,#0c0904 100%)}
.hero__embers{position:absolute;inset:0;z-index:-2;pointer-events:none}
.hero__star{position:absolute;top:12%;left:-10%;z-index:-1;width:190px;height:2px;border-radius:2px;pointer-events:none;opacity:0;
  background:linear-gradient(90deg,transparent,rgba(255,244,214,.9));
  filter:drop-shadow(0 0 6px rgba(255,238,190,.8));}
.hero__star--fall{animation:starFall 1.6s ease-out forwards}
@keyframes starFall{0%{opacity:0;transform:translate3d(0,0,0) rotate(24deg)}8%{opacity:1}70%{opacity:1}100%{opacity:0;transform:translate3d(72vw,26vh,0) rotate(24deg)}}
.hero__ridge{position:absolute;left:0;right:0;bottom:-2px;z-index:-1;pointer-events:none}
.hero__ridge svg{display:block;width:100%;height:clamp(70px,14vw,170px)}
.ridge-back{fill:#171006}
.ridge-front{fill:#0c0904}
.hero__content{position:relative;max-width:860px;display:flex;flex-direction:column;align-items:center}
.hero__kicker{
  font-family:var(--display);font-size:clamp(11px,2.6vw,14px);font-weight:600;letter-spacing:.34em;text-transform:uppercase;
  color:var(--gold);text-shadow:0 2px 14px rgba(0,0,0,.7);margin-bottom:clamp(18px,3.5vh,30px);
}
.hero__kicker em{font-style:normal;color:var(--cream)}
.hero__wordmark{width:min(680px,92vw);height:auto;filter:drop-shadow(0 6px 30px rgba(0,0,0,.75));margin-bottom:clamp(16px,3vh,26px)}
.hero__logline{
  font-family:var(--fell);font-size:clamp(17px,2.4vw,21px);line-height:1.6;color:rgba(244,236,216,.92);
  max-width:56ch;text-shadow:0 2px 16px rgba(0,0,0,.8);margin-bottom:clamp(24px,4vh,38px);
}
.hero__ctas{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;margin-bottom:clamp(22px,3.5vh,34px)}
.hero__meta{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:12px;font-size:14px;letter-spacing:.06em;color:rgba(244,236,216,.72)}
.hero__meta strong{color:var(--gold);font-weight:600}
.hero__meta-dot{width:4px;height:4px;border-radius:50%;background:rgba(201,162,39,.6)}
.hero__cue{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:10px;color:rgba(244,236,216,.6);transition:color .3s}
.hero__cue:hover{color:var(--gold)}
.hero__cue-text{font-family:var(--display);font-size:11px;font-weight:600;letter-spacing:.3em;text-transform:uppercase}
.hero__cue-line{width:1px;height:44px;background:linear-gradient(180deg,currentColor,transparent);position:relative;overflow:hidden}
.hero__cue-line::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent,var(--gold));animation:cueDrop 2.2s var(--ease-tale) infinite}
@keyframes cueDrop{0%{transform:translateY(-100%)}60%,100%{transform:translateY(100%)}}

/* ---------- chapters shared ---------- */
.chapter{position:relative;padding:clamp(72px,12vh,130px) clamp(18px,5vw,48px)}
.chapter--parchment{
  color:var(--paper-ink);
  background:
    radial-gradient(120% 90% at 50% 0%,rgba(120,90,40,.14),transparent 55%),
    var(--parchment) url('../img/tex-parchment.webp');
  background-size:auto,1024px;
}
.chapter--ink{
  color:var(--cream);
  background:
    radial-gradient(110% 60% at 50% 0%,rgba(90,60,22,.22),transparent 60%),
    linear-gradient(180deg,#141007,#1d160b 55%,#120d06);
}
.chapter__head{max-width:820px;margin:0 auto clamp(44px,7vh,72px);text-align:center}
.chapter__numeral{font-family:var(--fell);font-style:italic;font-size:clamp(15px,2vw,18px);letter-spacing:.22em;color:var(--gold-soft);margin-bottom:10px}
.chapter--ink .chapter__numeral{color:var(--gold)}
.chapter__title{font-family:var(--display);font-weight:700;font-size:clamp(30px,6.4vw,54px);line-height:1.08;letter-spacing:.02em}
.chapter__title span{font-weight:400;font-size:.82em}
.chapter__flourish{width:200px;margin:20px auto 0;color:var(--gold-soft);opacity:.8}
.chapter__sub{font-family:var(--fell);font-style:italic;font-size:clamp(15px,2vw,17.5px);margin-top:16px;color:inherit;opacity:.75}

/* torn paper edges */
.torn{position:absolute;left:0;right:0;height:34px;pointer-events:none;z-index:5;background:transparent}
.torn--down{top:-33px}
.torn--up{bottom:-33px}
.torn::before{
  content:"";position:absolute;inset:0;
  clip-path:polygon(0 100%,0 55%,4% 70%,8% 45%,13% 68%,19% 40%,24% 62%,30% 38%,36% 66%,41% 44%,47% 70%,53% 42%,58% 64%,64% 36%,70% 60%,75% 44%,81% 68%,86% 40%,91% 62%,96% 46%,100% 58%,100% 100%);
}
.chapter--parchment .torn::before{background:var(--parchment)}
.chapter--ink .torn::before{background:#141007}
.torn--up::before{transform:scaleY(-1)}

/* ---------- boot veil ---------- */
.veil{
  position:fixed;inset:0;z-index:500;display:flex;align-items:center;justify-content:center;
  background:#0c0904;opacity:1;visibility:visible;
  transition:opacity .8s var(--ease-out) .15s,visibility 0s 1s;
}
.veil__sigil{width:54px;height:54px;color:var(--gold);animation:veilPulse 1.6s ease-in-out infinite}
@keyframes veilPulse{0%,100%{opacity:.55;transform:scale(.96)}50%{opacity:1;transform:scale(1)}}
.veil--gone{opacity:0;visibility:hidden}
@media(prefers-reduced-motion:reduce){.veil{display:none}}

/* ---------- film grain on ink chapters ---------- */
.chapter--ink::after{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:url('../img/tex-grain.webp');background-size:320px;
  opacity:.07;mix-blend-mode:screen;
}

/* ---------- reveal ---------- */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .9s var(--ease-out),transform .9s var(--ease-out)}
.reveal--in{opacity:1;transform:none}
.reveal[data-stagger]{transition-delay:var(--stagger,0s)}

/* ---------- tale ---------- */
.tale{max-width:1200px;margin:0 auto;display:grid;gap:clamp(36px,5vw,64px)}
@media(min-width:900px){.tale{grid-template-columns:1.05fr .95fr;align-items:start}}
.tale__lede{font-size:clamp(18px,2.3vw,21px);line-height:1.7;color:var(--paper-ink)}
.tale__prose>p:not(.tale__lede){margin-top:22px;color:var(--paper-ink-soft);font-size:clamp(16px,2vw,18px)}
.dropcap{
  float:left;font-family:var(--display);font-weight:900;font-size:3.4em;line-height:.78;
  padding:6px 10px 0 0;color:var(--blood);
}
.tale__quote{
  margin:34px 0;padding:22px 26px;border-left:3px solid var(--gold-soft);
  background:linear-gradient(90deg,rgba(176,141,60,.12),transparent 75%);
  font-family:var(--fell);font-style:italic;font-size:clamp(18px,2.4vw,22px);line-height:1.55;color:var(--paper-ink);
}
.tale__quote strong{color:var(--blood);font-style:normal}
.tale__quote cite{display:block;margin-top:12px;font-family:var(--serif);font-style:normal;font-size:14px;letter-spacing:.08em;color:var(--paper-ink-soft)}
.tale__novellas{margin-top:34px;border-top:1px solid rgba(90,64,24,.3);padding-top:24px}
.tale__novellas h3{font-family:var(--display);font-size:14px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--blood);margin-bottom:12px}
.tale__novellas p{font-size:16px;color:var(--paper-ink-soft)}
.tale__aside{display:grid;gap:28px}
@media(min-width:560px){.tale__aside{grid-template-columns:1.15fr .85fr;align-items:start}}
@media(min-width:900px){.tale__aside{grid-template-columns:1fr;}}

.frame{position:relative;border:6px solid #3a2c16;outline:1px solid rgba(201,162,39,.5);outline-offset:3px;background:#241a0c;box-shadow:0 24px 50px -20px rgba(46,36,21,.55);overflow:hidden;transform-style:preserve-3d}
.frame img{width:100%;height:auto;transition:transform 1.2s var(--ease-out)}
.frame:hover img{transform:scale(1.04)}
.frame figcaption{position:absolute;left:0;right:0;bottom:0;padding:34px 16px 12px;font-family:var(--fell);font-style:italic;font-size:13.5px;color:rgba(244,236,216,.9);background:linear-gradient(180deg,transparent,rgba(12,9,4,.85))}
.frame__shine{position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 30%,rgba(255,244,214,.16) 45%,transparent 60%);transform:translateX(-120%);transition:transform 1.1s var(--ease-out)}
.frame:hover .frame__shine,[data-tilt]:hover .frame__shine{transform:translateX(120%)}
.keyart{position:relative;border:6px solid #3a2c16;outline:1px solid rgba(201,162,39,.5);outline-offset:3px;box-shadow:0 24px 50px -18px rgba(46,36,21,.6);overflow:hidden;transform-style:preserve-3d}
.keyart img{width:100%;height:auto}

/* ---------- timeline ---------- */
.timeline{max-width:1000px;margin:clamp(48px,8vh,80px) auto 0;padding:0 8px}
.timeline__track{position:relative;height:2px;background:rgba(90,64,24,.3);margin-bottom:30px}
.timeline__fill{position:absolute;inset:0;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,var(--blood),var(--gold-soft))}
.timeline__marks{display:grid;gap:26px}
@media(min-width:760px){.timeline__marks{grid-template-columns:repeat(3,1fr)}}
.timeline__mark{position:relative;padding-top:14px}
.timeline__mark::before{content:"";position:absolute;top:-37px;left:2px;width:12px;height:12px;border-radius:50%;background:var(--parchment);border:3px solid var(--blood)}
.timeline__mark:nth-child(2)::before{border-color:var(--gold-soft)}
.timeline__mark:nth-child(3)::before{border-color:var(--leaf)}
.timeline__year{display:block;font-family:var(--display);font-weight:900;font-size:clamp(20px,2.6vw,26px);color:var(--blood)}
.timeline__mark:nth-child(2) .timeline__year{color:var(--gold-soft)}
.timeline__mark:nth-child(3) .timeline__year{color:var(--leaf)}
.timeline__label{font-size:14.5px;line-height:1.55;color:var(--paper-ink-soft)}

/* ---------- wanderers: duo ---------- */
.duo{max-width:1100px;margin:0 auto clamp(40px,6vh,64px);display:grid;gap:26px}
@media(min-width:820px){.duo{grid-template-columns:1fr 1fr}}
.duo__card{
  position:relative;display:grid;grid-template-columns:112px 1fr;gap:20px;align-items:center;
  padding:clamp(18px,3vw,28px);border:1px solid rgba(201,162,39,.28);border-radius:6px;
  background:linear-gradient(150deg,rgba(46,34,16,.85),rgba(24,18,8,.92));
  box-shadow:0 24px 60px -28px rgba(0,0,0,.9),inset 0 1px 0 rgba(244,236,216,.06);
  overflow:hidden;transform-style:preserve-3d;transition:border-color .4s,box-shadow .4s;
}
.duo__card:hover{border-color:rgba(201,162,39,.6)}
@media(min-width:560px){.duo__card{grid-template-columns:150px 1fr}}
.duo__media{border:3px solid rgba(201,162,39,.5);border-radius:4px;overflow:hidden;box-shadow:0 12px 30px -12px rgba(0,0,0,.8)}
.duo__media img{width:100%;height:auto;filter:saturate(.92)}
.duo__epithet{font-family:var(--fell);font-style:italic;color:var(--gold);font-size:14px;letter-spacing:.1em}
.duo__name{font-family:var(--display);font-weight:700;font-size:clamp(20px,2.6vw,26px);line-height:1.15;margin:4px 0 2px}
.duo__actor{font-size:13.5px;letter-spacing:.14em;text-transform:uppercase;color:rgba(244,236,216,.55);margin-bottom:12px}
.duo__bio{font-size:15.5px;line-height:1.6;color:rgba(244,236,216,.85)}
.duo__body .sigil{position:absolute;top:18px;right:18px}

/* ---------- sigils ---------- */
.sigil{width:34px;height:34px;color:var(--gold-soft);opacity:.85}
.sigil--lg{width:44px;height:44px;margin-bottom:14px}
.sigil--ember{color:var(--ember-soft)}

/* ---------- wanderers: card grid ---------- */
.cast{max-width:1200px;margin:0 auto;display:grid;gap:18px;grid-template-columns:repeat(auto-fill,minmax(158px,1fr))}
@media(min-width:640px){.cast{grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:22px}}
.ccard{position:relative;aspect-ratio:3/4.1;perspective:1200px;cursor:pointer;border-radius:6px;-webkit-tap-highlight-color:transparent}
.ccard__face{
  position:absolute;inset:0;border-radius:6px;overflow:hidden;
  backface-visibility:hidden;-webkit-backface-visibility:hidden;
  transition:transform .8s var(--ease-tale);
  border:1px solid rgba(201,162,39,.3);
  box-shadow:0 18px 44px -20px rgba(0,0,0,.85);
}
.ccard__front{transform:rotateY(0)}
.ccard__front img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease-out),filter .5s}
.ccard:hover .ccard__front img{transform:scale(1.06)}
.ccard__plate{position:absolute;left:0;right:0;bottom:0;padding:40px 14px 14px;background:linear-gradient(180deg,transparent,rgba(10,7,3,.92) 60%)}
.ccard__plate h3{font-family:var(--display);font-weight:700;font-size:clamp(14.5px,1.7vw,17.5px);line-height:1.2}
.ccard__epithet{font-family:var(--fell);font-style:italic;font-size:12.5px;color:var(--gold);margin-top:3px}
.ccard__actor{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:rgba(244,236,216,.55);margin-top:5px}
.ccard__back{
  transform:rotateY(180deg);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;
  padding:14px;background:linear-gradient(160deg,#31250f,#171106);
  font-size:clamp(13px,1.4vw,15px);line-height:1.55;color:rgba(244,236,216,.92);
}
@media(max-width:639px){
  .ccard{aspect-ratio:3/4.35}
  .ccard__back{padding:12px 11px;font-size:12px;line-height:1.48}
  .ccard__back .sigil--lg{width:28px;height:28px;margin-bottom:8px}
}
.ccard[aria-pressed="true"] .ccard__front{transform:rotateY(-180deg)}
.ccard[aria-pressed="true"] .ccard__back{transform:rotateY(0)}
@media(hover:hover) and (pointer:fine){
  .ccard:hover .ccard__front{transform:rotateY(-180deg)}
  .ccard:hover .ccard__back{transform:rotateY(0)}
  .ccard[aria-pressed="true"]:hover .ccard__front{transform:rotateY(-180deg)}
}

/* ---------- tourney rail ---------- */
.rail{max-width:1360px;margin:0 auto}
.rail__scroller{overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;border-radius:8px}
.rail__scroller::-webkit-scrollbar{display:none}
.rail__track{display:flex;gap:clamp(14px,2vw,24px);padding:6px 2px 18px;width:max-content}
.ep{
  scroll-snap-align:start;width:min(78vw,420px);flex:none;position:relative;
  background:#f0e6cd;border:1px solid rgba(90,64,24,.35);border-radius:6px;overflow:hidden;
  box-shadow:0 20px 44px -22px rgba(46,36,21,.55);
  transition:transform .5s var(--ease-out),box-shadow .5s;
}
.ep:hover{transform:translateY(-6px);box-shadow:0 30px 54px -22px rgba(46,36,21,.65)}
.ep__still{width:100%;aspect-ratio:16/9;object-fit:cover;filter:saturate(.95)}
.ep__body{padding:18px 20px 24px;border-top:3px solid var(--ep-accent,var(--gold-soft))}
.ep__num{font-family:var(--display);font-weight:900;font-size:15px;color:var(--ep-accent,var(--gold-soft));letter-spacing:.2em}
.ep__title{font-family:var(--display);font-weight:700;font-size:clamp(19px,2.2vw,23px);color:var(--paper-ink);margin:6px 0 4px;line-height:1.15}
.ep__date{font-family:var(--fell);font-style:italic;font-size:13.5px;color:var(--blood);margin-bottom:10px}
.ep__syn{font-size:15px;line-height:1.6;color:var(--paper-ink-soft)}
.rail__hud{display:flex;align-items:center;gap:16px;margin-top:14px}
.rail__progress{position:relative;flex:1;height:2px;background:rgba(90,64,24,.28);border-radius:2px;overflow:hidden}
.rail__progress span{position:absolute;inset:0;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,var(--blood),var(--gold-soft))}
.rail__arrow{
  flex:none;width:48px;height:48px;border-radius:50%;border:1px solid rgba(90,64,24,.45);
  display:flex;align-items:center;justify-content:center;color:var(--paper-ink);
  transition:background .3s,color .3s,transform .3s,border-color .3s;
}
.rail__arrow svg{width:20px;height:20px}
.rail__arrow:hover{background:var(--paper-ink);color:var(--parchment);border-color:var(--paper-ink)}
.rail__arrow:active{transform:scale(.92)}
.rail__arrow[disabled]{opacity:.3;pointer-events:none}

/* ---------- season 2 banner ---------- */
.s2{max-width:1000px;margin:clamp(44px,7vh,70px) auto 0}
.s2__banner{
  position:relative;text-align:center;padding:clamp(30px,5vw,46px) clamp(20px,4vw,48px);
  border:1px solid rgba(143,59,46,.45);border-radius:6px;
  background:
    radial-gradient(80% 120% at 50% 0%,rgba(143,59,46,.16),transparent 60%),
    linear-gradient(160deg,rgba(90,64,24,.12),rgba(46,36,21,.06));
  overflow:hidden;
}
.s2__banner::before,.s2__banner::after{content:"";position:absolute;top:0;bottom:0;width:3px;background:linear-gradient(180deg,transparent,var(--blood),transparent)}
.s2__banner::before{left:14px}.s2__banner::after{right:14px}
.s2__kicker{font-family:var(--fell);font-style:italic;letter-spacing:.24em;color:var(--blood);font-size:14px;margin-bottom:8px}
.s2__title{font-family:var(--display);font-weight:700;font-size:clamp(22px,3.4vw,30px);color:var(--paper-ink)}
.s2__title em{font-style:normal;color:var(--blood)}
.s2__text{max-width:60ch;margin:12px auto 0;font-size:16px;color:var(--paper-ink-soft)}

/* ---------- media ---------- */
.trailer{max-width:1080px;margin:0 auto clamp(44px,7vh,72px)}
.trailer__facade{
  position:relative;display:block;width:100%;border-radius:8px;overflow:hidden;cursor:pointer;
  border:1px solid rgba(201,162,39,.35);box-shadow:0 34px 80px -30px rgba(0,0,0,.9);
  transition:transform .5s var(--ease-out),box-shadow .5s;
}
.trailer__facade:hover{transform:scale(1.008)}
.trailer__facade img{width:100%;aspect-ratio:16/9;object-fit:cover;filter:brightness(.72) saturate(.9);transition:filter .6s,transform 1.4s var(--ease-out)}
.trailer__facade:hover img{filter:brightness(.85) saturate(1);transform:scale(1.03)}
.trailer__ring{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:clamp(72px,10vw,96px);height:clamp(72px,10vw,96px);border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:rgba(20,14,5,.55);border:2px solid rgba(244,236,216,.85);backdrop-filter:blur(4px);
  transition:transform .4s var(--ease-out),background .4s,border-color .4s;
}
.trailer__ring svg{width:38%;height:38%;fill:var(--cream);margin-left:6%}
.trailer__facade:hover .trailer__ring{transform:translate(-50%,-50%) scale(1.1);background:rgba(201,162,39,.85);border-color:var(--gold)}
.trailer__facade:hover .trailer__ring svg{fill:#1d1503}
.trailer__ring::after{content:"";position:absolute;inset:-2px;border-radius:50%;border:2px solid rgba(244,236,216,.5);animation:ringPulse 2.4s var(--ease-out) infinite}
@keyframes ringPulse{0%{transform:scale(1);opacity:.8}100%{transform:scale(1.45);opacity:0}}
.trailer__label{position:absolute;left:18px;bottom:16px;display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;text-shadow:0 2px 12px rgba(0,0,0,.8)}
.trailer__label strong{font-family:var(--display);font-weight:700;font-size:clamp(15px,2vw,19px);letter-spacing:.1em;text-transform:uppercase}
.trailer__label span{font-family:var(--fell);font-style:italic;font-size:13.5px;color:rgba(244,236,216,.75)}

.gallery{max-width:1200px;margin:0 auto}
.gallery__title{font-family:var(--display);font-weight:700;font-size:clamp(19px,2.6vw,24px);letter-spacing:.06em;margin-bottom:22px;text-align:center;color:var(--gold)}
.gallery__grid{display:grid;gap:14px;grid-template-columns:repeat(2,1fr)}
@media(min-width:760px){.gallery__grid{grid-template-columns:repeat(3,1fr);gap:18px}}
.gallery__item{position:relative;display:block;width:100%;border-radius:6px;overflow:hidden;cursor:zoom-in;border:1px solid rgba(201,162,39,.22);transition:transform .45s var(--ease-out),border-color .45s,box-shadow .45s}
.gallery__item img{width:100%;aspect-ratio:16/9;object-fit:cover;filter:saturate(.9);transition:transform 1.1s var(--ease-out),filter .5s}
.gallery__item:hover{transform:translateY(-4px);border-color:rgba(201,162,39,.6);box-shadow:0 20px 44px -18px rgba(0,0,0,.85)}
.gallery__item:hover img{transform:scale(1.07);filter:saturate(1.05)}
.gallery__item::after{content:"⤢";position:absolute;top:8px;right:10px;font-size:15px;color:rgba(244,236,216,.9);opacity:0;transition:opacity .35s;text-shadow:0 2px 8px rgba(0,0,0,.8)}
.gallery__item:hover::after{opacity:1}

.notes{max-width:1000px;margin:clamp(44px,7vh,68px) auto 0;display:grid;gap:16px}
@media(min-width:820px){.notes{grid-template-columns:repeat(3,1fr)}}
.note{
  padding:20px 22px;border:1px solid rgba(201,162,39,.22);border-radius:6px;
  background:linear-gradient(160deg,rgba(46,34,16,.5),rgba(24,18,8,.6));
  font-family:var(--fell);font-style:italic;font-size:15.5px;line-height:1.55;color:rgba(244,236,216,.85);
}
.note strong{display:block;font-family:var(--display);font-style:normal;font-weight:700;font-size:13px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin-bottom:8px}

/* ---------- watch ---------- */
.watch{max-width:1150px;margin:0 auto;display:grid;gap:34px;align-items:center}
@media(min-width:920px){.watch{grid-template-columns:1.25fr .75fr}}
.watch__panel{
  position:relative;text-align:center;padding:clamp(36px,6vw,64px) clamp(22px,5vw,60px);
  border-radius:10px;overflow:hidden;color:var(--cream);
  background:
    radial-gradient(100% 90% at 50% 0%,rgba(90,60,22,.5),transparent 65%),
    linear-gradient(170deg,#241b0d,#120d05 70%);
  border:1px solid rgba(201,162,39,.4);
  box-shadow:0 34px 90px -30px rgba(46,36,21,.7);
  transform-style:preserve-3d;
  overflow:hidden;
}
.watch__glow{position:absolute;inset:-40%;background:radial-gradient(40% 40% at 50% 42%,rgba(201,162,39,.16),transparent 70%);animation:glowBreathe 7s ease-in-out infinite alternate;pointer-events:none}
@keyframes glowBreathe{from{transform:scale(1);opacity:.7}to{transform:scale(1.15);opacity:1}}
.watch__logo{width:min(340px,64vw);margin:0 auto 20px;filter:invert(1) brightness(1.6);position:relative}
.watch__status{display:flex;align-items:center;justify-content:center;gap:10px;font-family:var(--fell);font-style:italic;font-size:clamp(16px,2.2vw,19px);color:rgba(244,236,216,.9);margin-bottom:26px}
.watch__pulse{width:9px;height:9px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 0 rgba(201,162,39,.6);animation:pulse 2s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(201,162,39,.55)}70%{box-shadow:0 0 0 12px rgba(201,162,39,0)}100%{box-shadow:0 0 0 0 rgba(201,162,39,0)}}
.watch__ctas{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;margin-bottom:26px}
.watch__facts{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 20px;font-size:13.5px;letter-spacing:.12em;text-transform:uppercase;color:rgba(244,236,216,.55)}
.watch__art{position:relative;border:6px solid #3a2c16;outline:1px solid rgba(201,162,39,.5);outline-offset:3px;overflow:hidden;box-shadow:0 26px 60px -22px rgba(46,36,21,.65);max-width:420px;margin:0 auto;transform-style:preserve-3d}
.watch__art img{width:100%;height:auto}

/* ---------- footer ---------- */
.footer{background:#0c0904;border-top:1px solid rgba(201,162,39,.2);padding:56px 22px 44px;text-align:center}
.footer__inner{max-width:760px;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:22px}
.footer__wordmark{width:min(300px,70vw);opacity:.9}
.footer__nav{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 22px}
.footer__nav a{font-family:var(--display);font-size:12px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:rgba(244,236,216,.6);padding:8px 2px;transition:color .3s}
.footer__nav a:hover{color:var(--gold)}
.footer__fine{font-size:12.5px;line-height:1.7;color:rgba(244,236,216,.42);max-width:64ch}
.footer__fine em{color:rgba(244,236,216,.6)}

/* wax seal */
.seal{
  position:relative;width:64px;height:64px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:radial-gradient(circle at 34% 30%,#a8483a,#7c2f24 55%,#5d2018);
  box-shadow:0 8px 20px -6px rgba(0,0,0,.8),inset 0 2px 6px rgba(255,255,255,.18),inset 0 -4px 8px rgba(0,0,0,.4);
  transition:transform .25s var(--ease-out),box-shadow .25s;
}
.seal svg{width:34px;height:34px;color:rgba(255,228,200,.85)}
.seal:hover{transform:translateY(-2px)}
.seal:active,.seal--pressed{transform:scale(.9)}
.seal--pressed{box-shadow:0 3px 10px -4px rgba(0,0,0,.9),inset 0 2px 10px rgba(0,0,0,.55)}
.seal__whisper{min-height:1.5em;font-family:var(--fell);font-style:italic;font-size:15px;color:var(--gold);opacity:0;transition:opacity .6s}
.seal__whisper--show{opacity:1}

/* ---------- modal & lightbox ---------- */
.modal,.lightbox{position:fixed;inset:0;z-index:400;display:flex;align-items:center;justify-content:center;padding:18px;opacity:0;visibility:hidden;transition:opacity .4s,visibility 0s .4s}
.modal--open,.lightbox--open{opacity:1;visibility:visible;transition:opacity .4s}
.modal__backdrop,.lightbox__backdrop{position:absolute;inset:0;background:rgba(8,6,2,.9);backdrop-filter:blur(8px)}
.modal__box{position:relative;width:min(1000px,96vw);background:#0c0904;border:1px solid rgba(201,162,39,.4);border-radius:10px;overflow:hidden;box-shadow:0 40px 120px -30px rgba(0,0,0,1);transform:translateY(20px) scale(.97);transition:transform .45s var(--ease-out)}
.modal--open .modal__box{transform:none}
.modal__player{position:relative;aspect-ratio:16/9;background:#000}
.modal__player iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.modal__fallback{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;color:rgba(244,236,216,.8);font-family:var(--fell);font-style:italic;font-size:17px}
.modal__close,.lightbox__close{
  position:absolute;top:10px;right:10px;z-index:5;width:44px;height:44px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;background:rgba(12,9,4,.7);border:1px solid rgba(244,236,216,.3);
  color:var(--cream);transition:background .3s,transform .3s;
}
.modal__close:hover,.lightbox__close:hover{background:var(--blood);transform:rotate(90deg)}
.modal__close svg,.lightbox__close svg{width:18px;height:18px}
.lightbox__stage{position:relative;max-width:min(1200px,94vw);max-height:88svh;display:flex;flex-direction:column;gap:12px}
.lightbox__stage img{max-width:100%;max-height:76svh;width:auto;height:auto;margin:0 auto;border-radius:6px;border:1px solid rgba(201,162,39,.4);box-shadow:0 40px 110px -30px rgba(0,0,0,1)}
.lightbox__stage figcaption{text-align:center;font-family:var(--fell);font-style:italic;font-size:15.5px;color:rgba(244,236,216,.85);padding:0 48px}
.lightbox__arrow{
  position:absolute;top:50%;transform:translateY(-50%);width:48px;height:48px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;background:rgba(12,9,4,.7);border:1px solid rgba(244,236,216,.3);color:var(--cream);
  transition:background .3s;
}
.lightbox__arrow:hover{background:var(--gold);color:#1d1503}
.lightbox__arrow svg{width:20px;height:20px}
.lightbox__arrow--prev{left:-8px}
.lightbox__arrow--next{right:-8px}
@media(min-width:760px){.lightbox__arrow--prev{left:-64px}.lightbox__arrow--next{right:-64px}}

/* ---------- body lock ---------- */
body.is-locked{overflow:hidden}

/* ---------- reduced motion ---------- */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .reveal{opacity:1;transform:none}
  .hero__backdrop img{animation:none}
}