/* ════════════════════════════════════════════════════════════════════
   GABRIELLE LONGE — Author Hub
   Dark, myth-forged fantasy. Obsidian · bone · gold · a whisper of drakon teal.
   ════════════════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500;600;700;800;900&family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600&display=swap');

:root{
  /* grounds */
  --obsidian:#0a0d11;
  --ink-900:#0e1217;
  --ink-800:#141a20;
  --ink-700:#1a212a;
  --panel:#171d25;
  --panel-2:#1d242d;

  /* ink */
  --bone:#ece7dd;
  --bone-soft:#d6d2c8;
  --muted:#9aa1a8;
  --muted-2:#717880;

  /* metal + drakon */
  --gold:#b59a5e;
  --gold-bright:#cdb074;
  --gold-deep:#7e6a3b;
  --teal:#6fb6ae;

  /* vessel files — ember / blood */
  --crimson:#b04e52;
  --crimson-bright:#c96a6c;
  --ember:#c2603f;

  /* ascendant crucible — celestial frost */
  --frost:#7d8ec0;
  --frost-bright:#9aa9d6;

  /* children of ouroboros — void iris */
  --iris:#9b74bd; /* @kind color */
  --iris-bright:#b78fd6; /* @kind color */


  /* lines */
  --rule:rgba(181,154,94,0.30);
  --rule-soft:rgba(236,231,221,0.10);
  --rule-faint:rgba(236,231,221,0.055);

  --display:'Cinzel',serif; /* @kind font */
  --body:'Cormorant Garamond',serif; /* @kind font */
  --mono:ui-monospace,'SF Mono',Menlo,Consolas,monospace; /* @kind font */

  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); /* @kind other */

  --maxw:1240px;
  --gutter:clamp(22px,5vw,72px); /* @kind spacing */
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--obsidian);
  color:var(--bone);
  font-family:var(--body);
  font-size:20px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
body::before{ /* page-wide grain */
  content:"";position:fixed;inset:0;z-index:9999;pointer-events:none;
  background-image:var(--grain);background-size:180px;
  opacity:0.05;mix-blend-mode:overlay;
}
img{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}

/* ── type helpers ─────────────────────────────────────────────── */
.eyebrow{
  font-family:var(--body);
  font-size:13px;letter-spacing:.42em;text-transform:uppercase;
  color:var(--gold);font-weight:600;
}
.kicker{
  font-family:var(--mono);font-size:11.5px;letter-spacing:.28em;
  text-transform:uppercase;color:var(--muted-2);
}
h1,h2,h3{font-family:var(--display);font-weight:700;margin:0;color:var(--bone);line-height:1.06;}
.display{
  font-family:var(--display);font-weight:800;
  font-size:clamp(40px,7vw,92px);line-height:0.98;letter-spacing:0.01em;
}
.serif-lead{
  font-family:var(--body);font-size:clamp(20px,2.4vw,27px);
  line-height:1.5;color:var(--bone-soft);font-weight:400;text-wrap:pretty;
}
.italic{font-style:italic;}
p{text-wrap:pretty;}

/* the "OF" divider used in the title lockup */
.lockup{display:flex;flex-direction:column;align-items:center;text-align:center;}
.lockup .of{
  display:flex;align-items:center;justify-content:center;gap:18px;margin:4px 0;
  font-size:0.42em;font-weight:500;color:var(--gold);letter-spacing:0.4em;
}
.lockup .of::before,.lockup .of::after{
  content:"";height:1px;width:clamp(34px,5vw,64px);background:var(--gold);opacity:.8;
}

/* diamond motif */
.diamond{width:9px;height:9px;transform:rotate(45deg);background:var(--gold);display:inline-block;}
.diamond.hollow{background:transparent;border:1.5px solid var(--gold);}

/* ── layout ───────────────────────────────────────────────────── */
.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:var(--gutter);}
section{position:relative;}
.section-pad{padding-block:clamp(72px,11vw,140px);}
.hairline{height:1px;background:var(--rule-soft);border:0;margin:0;}

/* ── top nav ──────────────────────────────────────────────────── */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  display:flex;align-items:center;justify-content:space-between;
  padding:18px var(--gutter);
  background:linear-gradient(180deg,rgba(8,11,14,0.92),rgba(8,11,14,0));
  transition:background .3s ease,border-color .3s ease;
  border-bottom:1px solid transparent;
}
.nav.solid{
  background:rgba(9,12,16,0.86);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--rule-faint);
}
.brand{
  font-family:var(--display);font-weight:600;font-size:17px;
  letter-spacing:0.34em;text-transform:uppercase;color:var(--bone);
  display:flex;align-items:center;gap:14px;white-space:nowrap;
}
.brand .diamond{width:7px;height:7px;}
.nav-links{display:flex;align-items:center;gap:34px;}
.nav-links a{
  font-family:var(--body);font-size:16.5px;letter-spacing:0.16em;
  text-transform:uppercase;color:var(--bone-soft);position:relative;padding:4px 0;
  transition:color .25s ease;white-space:nowrap;
}
.nav-links a::after{
  content:"";position:absolute;left:0;right:100%;bottom:-2px;height:1px;
  background:var(--gold);transition:right .3s ease;
}
.nav-links a:hover{color:var(--bone);}
.nav-links a:hover::after,.nav-links a.active::after{right:0;}
.nav-links a.active{color:var(--gold);}
.nav-cta{
  font-family:var(--display)!important;font-size:13px!important;font-weight:600;
  letter-spacing:0.2em!important;padding:11px 20px!important;
  border:1px solid var(--rule);color:var(--gold)!important;
  text-transform:uppercase;transition:all .25s ease;white-space:nowrap;
}
.nav-cta::after{display:none;}
.nav-cta:hover{background:var(--gold);color:var(--obsidian)!important;border-color:var(--gold);}
.nav-toggle{display:none;background:none;border:0;color:var(--bone);cursor:pointer;}

/* ── buttons ──────────────────────────────────────────────────── */
.btn{
  display:inline-flex;align-items:center;gap:12px;cursor:pointer;
  font-family:var(--display);font-weight:600;font-size:14px;
  letter-spacing:0.2em;text-transform:uppercase;
  padding:16px 30px;border:1px solid var(--gold);background:transparent;color:var(--gold);
  transition:all .25s ease;
}
.btn:hover{background:var(--gold);color:var(--obsidian);}
.btn.solid{background:var(--gold);color:var(--obsidian);}
.btn.solid:hover{background:var(--gold-bright);border-color:var(--gold-bright);}
.btn.ghost{border-color:var(--rule-soft);color:var(--bone-soft);}
.btn.ghost:hover{border-color:var(--bone-soft);background:transparent;color:var(--bone);}
.btn .arrow{transition:transform .25s ease;}
.btn:hover .arrow{transform:translateX(4px);}

/* ── section heading block ────────────────────────────────────── */
.head{display:flex;flex-direction:column;gap:18px;}
.head .eyebrow{display:flex;align-items:center;gap:14px;}
.head h2{font-size:clamp(30px,4.4vw,52px);}

/* ── footer ───────────────────────────────────────────────────── */
.footer{background:var(--ink-900);border-top:1px solid var(--rule-faint);}
.footer .wrap{padding-block:clamp(56px,8vw,86px);}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:56px;}
.footer h4{font-family:var(--display);font-size:13px;letter-spacing:.26em;text-transform:uppercase;color:var(--gold);margin:0 0 20px;font-weight:600;}
.footer-links{display:flex;flex-direction:column;gap:12px;}
.footer-links a{font-size:18px;color:var(--muted);transition:color .2s;}
.footer-links a:hover{color:var(--bone);}
.footer .mark{font-family:var(--display);font-weight:700;font-size:22px;letter-spacing:.2em;text-transform:uppercase;}
.footer .legal{display:flex;justify-content:space-between;align-items:center;margin-top:64px;padding-top:26px;border-top:1px solid var(--rule-faint);color:var(--muted-2);font-size:14px;font-family:var(--mono);letter-spacing:.08em;}

/* ── image placeholder ────────────────────────────────────────── */
.ph{
  position:relative;background:
    repeating-linear-gradient(135deg,rgba(181,154,94,0.06) 0 10px,transparent 10px 22px),
    var(--ink-700);
  border:1px solid var(--rule-faint);display:flex;align-items:center;justify-content:center;
  overflow:hidden;
}
.ph span{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted-2);text-align:center;padding:8px;}

/* film-photo helper */
.photo{position:relative;overflow:hidden;background:var(--ink-800);}
.photo::after{content:"";position:absolute;inset:0;background-image:var(--grain);background-size:180px;opacity:.06;mix-blend-mode:overlay;}

/* status pill */
.pill{
  display:inline-flex;align-items:center;gap:9px;font-family:var(--mono);
  font-size:11px;letter-spacing:.2em;text-transform:uppercase;
  padding:7px 13px;border:1px solid var(--rule);color:var(--gold);border-radius:1px;
}
.pill.dot::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--teal);box-shadow:0 0 10px var(--teal);}
.pill.muted{border-color:var(--rule-soft);color:var(--muted);}

/* reveal-on-scroll */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1);}
.reveal.in{opacity:1;transform:none;}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none;}}

/* ── series theming: Vessel Files runs crimson where Deathmarked runs gold ── */
.theme-vessel{
  --gold:var(--crimson);
  --gold-bright:var(--crimson-bright);
  --teal:var(--ember);
  --rule:rgba(176,78,82,0.32);
}
.theme-crucible{
  --gold:var(--frost);
  --gold-bright:var(--frost-bright);
  --teal:var(--frost-bright);
  --rule:rgba(125,142,192,0.34);
}
.theme-ouroboros{
  --gold:var(--iris);
  --gold-bright:var(--iris-bright);
  --teal:var(--iris-bright);
  --rule:rgba(155,116,189,0.34);
}

/* ── book feature + mini covers (shared) ──────────────────────── */
.book-grid{display:grid;grid-template-columns:minmax(280px,360px) 1fr;gap:clamp(40px,7vw,96px);align-items:center;}
.book-grid.reverse{direction:rtl;}
.book-grid.reverse>*{direction:ltr;}
.book-cover-wrap{display:flex;flex-direction:column;align-items:center;gap:18px;}
.book-text{display:flex;flex-direction:column;gap:22px;align-items:flex-start;}
.book-text h2{font-size:clamp(28px,4vw,48px);}
.book-text p{margin:0;color:var(--muted);}
.book-text .serif-lead{color:var(--bone-soft);}
.closer{color:var(--bone)!important;font-size:21px;border-left:2px solid var(--gold);padding-left:22px;font-style:italic;}
.comps{color:var(--muted-2);line-height:1.7;max-width:54ch;letter-spacing:.16em;}
.book-actions{display:flex;gap:16px;flex-wrap:wrap;margin-top:8px;}
.cover-caption{opacity:.85;}

.mini-cover{position:relative;width:100%;max-width:360px;aspect-ratio:2/3;overflow:hidden;background:#08090c;box-shadow:0 40px 90px -30px rgba(0,0,0,.9),0 0 0 1px var(--rule-faint);display:flex;flex-direction:column;justify-content:space-between;padding:34px 26px;text-align:center;}
.mini-cover>*{position:relative;z-index:1;}
/* neutral, color-themed emblem covers — no photography */
.cv-glow{position:absolute;inset:0;z-index:0;background:radial-gradient(66% 48% at 50% 37%,color-mix(in srgb,var(--gold) 30%,transparent),transparent 70%);}
.cv-scrim{position:absolute;inset:0;z-index:0;background:linear-gradient(180deg,rgba(8,9,12,.5) 0%,transparent 28%,transparent 56%,rgba(8,9,12,.78) 100%);}
.cv-emblem{position:absolute;left:50%;top:37%;transform:translate(-50%,-50%);width:56%;aspect-ratio:1;z-index:0;
  background:repeating-linear-gradient(135deg,color-mix(in srgb,var(--gold) 12%,transparent) 0 9px,transparent 9px 20px),color-mix(in srgb,var(--gold) 5%,transparent);
  border:1px solid color-mix(in srgb,var(--gold) 32%,transparent);}
.cv-emblem.em-diamond{width:48%;transform:translate(-50%,-50%) rotate(45deg);}
.cv-emblem.em-circle{border-radius:50%;}
.cv-emblem.em-triangle{clip-path:polygon(50% 1%,100% 100%,0 100%);border:0;background:repeating-linear-gradient(135deg,color-mix(in srgb,var(--gold) 14%,transparent) 0 9px,transparent 9px 20px),color-mix(in srgb,var(--gold) 6%,transparent);}
.cv-emblem.em-ring{border-radius:50%;border-width:2px;background:none;box-shadow:inset 0 0 46px color-mix(in srgb,var(--gold) 26%,transparent),0 0 30px color-mix(in srgb,var(--gold) 14%,transparent);}
.cv-emblem.em-ring::after{content:"";position:absolute;inset:18%;border-radius:50%;border:1px solid color-mix(in srgb,var(--gold) 24%,transparent);}
.mc-top{font-family:var(--body);font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);text-shadow:0 2px 12px rgba(0,0,0,.8);}
.mc-title{font-family:var(--display);font-weight:800;font-size:clamp(28px,3.8vw,38px);line-height:.96;color:#f0ebe1;text-shadow:0 4px 26px rgba(0,0,0,.85);}
.mc-title .of{font-size:.4em;color:var(--gold);}
.mc-foot{display:flex;flex-direction:column;gap:12px;}
.mc-tag{font-size:16px;color:var(--bone-soft);text-shadow:0 2px 12px rgba(0,0,0,.9);}
.mc-author{font-family:var(--display);font-size:14px;letter-spacing:.32em;text-transform:uppercase;color:var(--bone);}
/* stacked title (multi-line series like The Judgment Trials) */
.cc-title{display:flex;flex-direction:column;align-items:center;gap:2px;text-shadow:0 4px 26px rgba(0,0,0,.85);}
.cc-the{font-family:var(--display);font-size:13px;letter-spacing:.4em;color:var(--gold);text-transform:uppercase;}
.cc-main{font-family:var(--display);font-weight:800;font-size:clamp(24px,3.2vw,32px);line-height:.98;color:#eef0f4;letter-spacing:.02em;}

@media (max-width:880px){
  .book-grid{grid-template-columns:1fr;gap:48px;}
  .book-cover-wrap{max-width:320px;margin:0 auto;}
}

/* ── book detail page ─────────────────────────────────────────── */
.spec-bar{display:flex;flex-wrap:wrap;gap:0;border:1px solid var(--rule-faint);}
.spec{padding:20px 26px;border-left:1px solid var(--rule-faint);flex:1 1 160px;}
.spec:first-child{border-left:0;}
.spec .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--muted-2);margin-bottom:8px;}
.spec .v{font-family:var(--display);font-size:16px;color:var(--bone);letter-spacing:.02em;}
.bd-grid{display:grid;grid-template-columns:minmax(260px,330px) 1fr;gap:clamp(40px,6vw,88px);align-items:start;margin-top:clamp(48px,7vw,80px);}
.bd-cover{position:sticky;top:104px;display:flex;flex-direction:column;gap:18px;}
.bd-synopsis{display:flex;flex-direction:column;gap:22px;}
.bd-synopsis h2{font-size:clamp(26px,3.6vw,40px);}
.bd-synopsis p{margin:0;font-size:21px;line-height:1.6;color:var(--bone-soft);}
.bd-synopsis p.muted{color:var(--muted);font-size:20px;}
.bd-cta{display:flex;gap:16px;flex-wrap:wrap;margin-top:10px;}

.firstlook{background:var(--ink-900);border-block:1px solid var(--rule-faint);}
.fl-inner{max-width:760px;margin:0 auto;text-align:center;}
.fl-excerpt{font-family:var(--body);font-size:clamp(22px,2.8vw,30px);line-height:1.6;color:var(--bone);text-align:left;margin-top:38px;}
.fl-excerpt p{margin:0 0 22px;text-wrap:pretty;}
.fl-excerpt .dropcap::first-letter{font-family:var(--display);font-weight:700;font-size:3.4em;line-height:.82;float:left;padding:6px 14px 0 0;color:var(--gold);}
.gate{position:relative;margin-top:10px;}
.gate-fade{position:absolute;left:0;right:0;bottom:0;height:200px;background:linear-gradient(transparent,var(--ink-900));pointer-events:none;}
.gate-cta{display:flex;flex-direction:column;align-items:center;gap:20px;padding-top:44px;border-top:1px solid var(--rule-faint);margin-top:44px;}
.gate-cta .lock{font-family:var(--mono);font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);}

/* ── fixed cinematic book backgrounds (real art, behind all content) ── */
.book-stage{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:var(--obsidian);}
.bs-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;}
.bs-scrim{position:absolute;inset:0;}
/* mask the body's solid bg so the fixed stage shows through transparent sections */
body.has-stage{background:transparent;}
/* legibility for text floating over the fixed art */
body.has-stage .page-hero h1,
body.has-stage .page-hero .lead,
body.has-stage .bd-synopsis h2,
body.has-stage .bd-synopsis p,
body.has-stage .spec .v,
body.has-stage .spec .k,
body.has-stage .eyebrow{text-shadow:0 2px 16px rgba(0,0,0,.92),0 1px 3px rgba(0,0,0,.8);}
body.has-stage .spec-bar{background:rgba(10,13,17,.5);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);}

/* Oni — mask anchored right, slow breathing float */
.bs-oni{object-position:62% 38%;animation:bsFloat 16s ease-in-out infinite;}
@keyframes bsFloat{0%,100%{transform:scale(1.06) translateY(0);}50%{transform:scale(1.11) translateY(-14px);}}
.bs-scrim-oni{background:
  radial-gradient(70% 65% at 64% 40%,rgba(8,9,12,.28),rgba(8,9,12,.84) 78%),
  linear-gradient(180deg,rgba(8,9,12,.55) 0%,rgba(8,9,12,.4) 45%,rgba(8,9,12,.72) 100%);}

/* Mountain — slow cinematic drift */
.bs-mtn{object-position:50% 30%;animation:bsZoom 22s ease-in-out infinite;}
@keyframes bsZoom{0%,100%{transform:scale(1.05) translateY(0);}50%{transform:scale(1.12) translateY(-10px);}}
.bs-scrim-mtn{background:
  radial-gradient(80% 60% at 50% 28%,rgba(10,13,17,.2),rgba(10,13,17,.8) 80%),
  linear-gradient(180deg,rgba(10,13,17,.5) 0%,rgba(10,13,17,.35) 40%,rgba(10,13,17,.74) 100%);}

/* Fire — green flames licking along the bottom of the viewport, alive */
.bs-fire{top:auto;bottom:0;height:62vh;object-fit:cover;object-position:center bottom;mix-blend-mode:screen;
  animation:bsFlame 5s ease-in-out infinite;transform-origin:center bottom;}
@keyframes bsFlame{0%,100%{transform:scaleY(1) scaleX(1);filter:brightness(1) saturate(1);}
  35%{transform:scaleY(1.05) scaleX(.99);filter:brightness(1.18) saturate(1.15);}
  70%{transform:scaleY(.97) scaleX(1.01);filter:brightness(.92) saturate(1.05);}}
.bs-fire2{top:auto;bottom:0;height:62vh;object-fit:cover;object-position:center bottom;mix-blend-mode:screen;opacity:.6;
  animation:bsFlame2 7s ease-in-out infinite;transform-origin:center bottom;}
@keyframes bsFlame2{0%,100%{transform:scaleX(1.04) scaleY(.98) translateX(0);}50%{transform:scaleX(.97) scaleY(1.06) translateX(14px);}}
.bs-scrim-fire{background:linear-gradient(180deg,rgba(8,11,14,.55) 0%,rgba(8,11,14,.2) 40%,transparent 62%,rgba(8,11,14,.15) 100%);}

@media (prefers-reduced-motion:reduce){.bs-oni,.bs-mtn,.bs-fire,.bs-fire2{animation:none;}}

/* Ouroboros — real drawing, inverted to glow on dark, edges masked, slowly circling */
.bs-ouro-wrap{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%);width:min(98vh,860px);height:min(98vh,860px);}
.bs-ouro-img{width:100%;height:100%;object-fit:contain;opacity:.55;
  filter:invert(1) brightness(1.08) contrast(1.05);
  mix-blend-mode:screen;
  -webkit-mask:radial-gradient(circle at 50% 47%,#000 52%,transparent 70%);
  mask:radial-gradient(circle at 50% 47%,#000 52%,transparent 70%);
  animation:crestSpin 90s linear infinite;transform-origin:50% 50%;}
.bs-scrim-ouro{background:radial-gradient(58% 54% at 50% 44%,transparent,rgba(10,13,17,.5) 80%),linear-gradient(180deg,rgba(10,13,17,.32),rgba(10,13,17,.42));}
@media (prefers-reduced-motion:reduce){.bs-ouro-img{animation:none;}}

/* ── series crest (page-foot motif, themed) ───────────────────── */
.book-crest{position:relative;padding:clamp(64px,10vw,128px) 0 clamp(44px,7vw,80px);text-align:center;overflow:hidden;}
.crest-glow{position:absolute;left:50%;bottom:-30%;transform:translateX(-50%);width:min(120vw,1100px);height:120%;z-index:0;
  background:radial-gradient(50% 60% at 50% 100%,color-mix(in srgb,var(--gold) 22%,transparent),transparent 70%);pointer-events:none;
  animation:crestPulse 6s ease-in-out infinite;}
@keyframes crestPulse{0%,100%{opacity:.7;}50%{opacity:1;}}
.crest-inner{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:24px;}
.crest-art{color:var(--gold);filter:drop-shadow(0 0 26px color-mix(in srgb,var(--gold) 50%,transparent));}
.crest-art[data-parallax]{transition:transform .25s cubic-bezier(.2,.7,.2,1);transform-style:preserve-3d;will-change:transform;}
.crest-art svg{display:block;width:clamp(220px,30vw,360px);height:auto;}
.crest-art [data-eye]{transform-box:fill-box;transform-origin:center;transition:transform .14s ease-out;}
.crest-art [data-spin]{transform-box:view-box;transform-origin:100px 100px;animation:crestSpin 36s linear infinite;}
@keyframes crestSpin{to{transform:rotate(360deg);}}
.crest-art [data-aurora]{animation:auroraDrift 9s ease-in-out infinite;}
.crest-art [data-aurora]:nth-of-type(2){animation-duration:12s;animation-delay:-3s;}
.crest-art [data-aurora]:nth-of-type(3){animation-duration:14s;animation-delay:-6s;}
@keyframes auroraDrift{0%,100%{transform:translateX(-12px);}50%{transform:translateX(12px);}}
.crest-cap{font-family:var(--display);font-weight:500;font-style:italic;font-size:clamp(20px,3vw,30px);color:var(--bone);max-width:22ch;line-height:1.3;}
.crest-rule{width:90px;height:1px;background:var(--gold);opacity:.7;}
@media (prefers-reduced-motion:no-preference){
  .crest-art [data-flick]{transform-box:fill-box;transform-origin:center bottom;animation:crestFlick 3.4s ease-in-out infinite;}
  .crest-art [data-flick="2"]{animation-duration:4.2s;animation-delay:-1.1s;}
  .crest-art [data-flick="3"]{animation-duration:3.8s;animation-delay:-2.2s;}
}
@media (prefers-reduced-motion:reduce){.crest-glow,.crest-art [data-spin],.crest-art [data-aurora]{animation:none;}}
@keyframes crestFlick{0%,100%{opacity:.85;}50%{opacity:1;}}

/* black-&-green flame band (Daughter of Death) */
.flame-band{position:relative;height:clamp(220px,28vw,360px);overflow:hidden;background:var(--obsidian);}
.flame-band svg{position:absolute;inset:0;width:100%;height:100%;transform-origin:center bottom;transition:transform .3s ease-out;}
@media (prefers-reduced-motion:no-preference){
  .flame-band [data-flame]{transform-box:fill-box;transform-origin:center bottom;animation:flameLick 2.8s ease-in-out infinite;}
  .flame-band [data-flame="2"]{animation-duration:2.2s;animation-delay:-.7s;}
  .flame-band [data-flame="3"]{animation-duration:3.3s;animation-delay:-1.5s;}
  .flame-band [data-ember]{transform-box:fill-box;animation:emberRise linear infinite;}
}
@keyframes flameLick{0%,100%{transform:scaleY(1) scaleX(1);}50%{transform:scaleY(1.12) scaleX(.96);}}
@keyframes emberRise{0%{transform:translateY(0) scale(1);opacity:0;}18%{opacity:.9;}100%{transform:translateY(-240px) scale(.2);opacity:0;}}

/* up-next other books strip */
.upnext{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.un-card{display:flex;gap:20px;align-items:center;padding:24px;border:1px solid var(--rule-faint);transition:border-color .25s,transform .25s;}
.un-card:hover{border-color:var(--rule);transform:translateY(-3px);}
.un-thumb{width:64px;height:96px;flex:0 0 auto;border-radius:1px;position:relative;overflow:hidden;}
.un-card h4{font-family:var(--display);font-size:19px;margin:0 0 6px;color:var(--bone);}
.un-card .kicker{color:var(--muted-2);}

@media (max-width:880px){
  .bd-grid{grid-template-columns:1fr;}
  .bd-cover{position:static;max-width:300px;}
  .upnext{grid-template-columns:1fr;}
}
@media (max-width:560px){
  .spec{flex:1 1 50%;border-left:0;border-top:1px solid var(--rule-faint);}
}

/* ── shared newsletter band ───────────────────────────────────── */
.cta-news{background:radial-gradient(120% 100% at 50% 0%,#141b22 0%,var(--obsidian) 70%);border-top:1px solid var(--rule-faint);padding-block:clamp(64px,9vw,120px);text-align:center;}
.cta-news .wrap{max-width:720px;}
.cta-news h2{font-size:clamp(28px,4vw,46px);margin:14px 0 16px;}
.cta-news p{color:var(--bone-soft);margin:0 auto 28px;max-width:52ch;}
.field-inline{display:flex;gap:12px;max-width:480px;margin:0 auto;}
.field-inline input{flex:1;background:var(--ink-800);border:1px solid var(--rule-soft);color:var(--bone);font-family:var(--body);font-size:19px;padding:15px 18px;transition:border-color .2s;}
.field-inline input::placeholder{color:var(--muted-2);}
.field-inline input:focus{outline:none;border-color:var(--gold);}
.news-done{display:none;align-items:center;justify-content:center;gap:12px;color:var(--gold);font-family:var(--body);font-size:20px;font-style:italic;padding:14px 0;}
.news-fine{opacity:.7;margin-top:14px!important;}
@media (max-width:520px){.field-inline{flex-direction:column;}}

/* ── interior page header ─────────────────────────────────────── */
.page-hero{padding:clamp(130px,16vw,190px) 0 clamp(48px,7vw,80px);position:relative;overflow:hidden;}
.page-hero.center{text-align:center;}
.page-hero .wrap{position:relative;z-index:1;}
.page-hero .eyebrow{display:inline-flex;align-items:center;gap:14px;margin-bottom:22px;white-space:nowrap;}
.page-hero h1{font-family:var(--display);font-weight:800;font-size:clamp(38px,6.5vw,80px);line-height:1.0;letter-spacing:.01em;}
.page-hero .lead{margin:26px auto 0;max-width:60ch;}
.page-hero.center .lead{margin-inline:auto;}
.page-hero .lead.left{margin-inline:0;}
.ph-glow{position:absolute;inset:0;background:radial-gradient(80% 60% at 50% -10%,rgba(181,154,94,.10),transparent 70%);pointer-events:none;}
.theme-vessel .ph-glow{background:radial-gradient(80% 60% at 50% -10%,rgba(176,78,82,.12),transparent 70%);}
.theme-crucible .ph-glow{background:radial-gradient(80% 60% at 50% -10%,rgba(125,142,192,.12),transparent 70%);}

/* ── forms ────────────────────────────────────────────────────── */
.form-section{padding:42px 0;border-top:1px solid var(--rule-faint);display:grid;grid-template-columns:200px 1fr;gap:clamp(24px,5vw,64px);}
.form-section:first-of-type{border-top:0;}
.fs-head{display:flex;flex-direction:column;gap:10px;}
.fs-no{font-family:var(--mono);font-size:12px;letter-spacing:.24em;color:var(--gold);}
.fs-head h3{font-size:24px;}
.fs-head p{font-size:16px;color:var(--muted);margin:0;line-height:1.4;}
.fs-body{display:flex;flex-direction:column;gap:24px;}
.field{display:flex;flex-direction:column;gap:9px;}
.field>label{font-family:var(--display);font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--bone-soft);font-weight:600;}
.field>label .req{color:var(--gold);}
.field .hint{font-family:var(--body);font-size:15px;color:var(--muted-2);font-style:italic;}
.input,select.input,textarea.input{
  background:var(--ink-800);border:1px solid var(--rule-soft);color:var(--bone);
  font-family:var(--body);font-size:19px;padding:14px 16px;width:100%;transition:border-color .2s,background .2s;
}
.input::placeholder{color:var(--muted-2);}
.input:focus{outline:none;border-color:var(--gold);background:var(--ink-700);}
textarea.input{resize:vertical;min-height:120px;line-height:1.5;}
select.input{appearance:none;cursor:pointer;background-image:linear-gradient(45deg,transparent 50%,var(--gold) 50%),linear-gradient(135deg,var(--gold) 50%,transparent 50%);background-position:calc(100% - 20px) 22px,calc(100% - 14px) 22px;background-size:6px 6px,6px 6px;background-repeat:no-repeat;}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.choice{
  display:flex;align-items:center;gap:13px;padding:15px 18px;cursor:pointer;
  border:1px solid var(--rule-soft);background:var(--ink-800);transition:border-color .2s,background .2s;
  font-size:18px;color:var(--bone-soft);user-select:none;
}
.choice:hover{border-color:var(--rule);}
.choice input{position:absolute;opacity:0;width:0;height:0;}
.choice .box{width:18px;height:18px;border:1.5px solid var(--muted-2);flex:0 0 auto;display:flex;align-items:center;justify-content:center;transition:all .2s;}
.choice .box.round{border-radius:50%;}
.choice .box::after{content:"";width:8px;height:8px;transform:rotate(45deg) scale(0);background:var(--gold);transition:transform .18s;}
.choice .box.round::after{transform:scale(0);border-radius:50%;}
.choice input:checked~.box{border-color:var(--gold);}
.choice input:checked~.box::after{transform:rotate(45deg) scale(1);}
.choice input:checked~.box.round::after{transform:scale(1);}
.choice:has(input:checked){border-color:var(--gold);background:var(--ink-700);color:var(--bone);}
.agree{display:flex;flex-direction:column;gap:14px;}
.agree .choice{grid-column:1/-1;}
.form-foot{display:flex;align-items:center;gap:26px;flex-wrap:wrap;padding-top:34px;border-top:1px solid var(--rule-faint);margin-top:8px;}
.field-error{color:var(--crimson-bright);font-size:15px;font-style:italic;display:none;}
.field.invalid .input{border-color:var(--crimson);}
.field.invalid .field-error{display:block;}

/* success seal */
.seal{display:none;flex-direction:column;align-items:center;text-align:center;gap:22px;padding:clamp(60px,10vw,120px) 0;}
.seal .diamond{width:16px;height:16px;}
.seal h2{font-size:clamp(30px,4.4vw,52px);}
.seal p{font-size:21px;color:var(--muted);max-width:48ch;margin:0;}

@media (max-width:760px){
  .form-section{grid-template-columns:1fr;gap:20px;}
  .two-col,.choice-grid{grid-template-columns:1fr;}
}

/* ── HOME: four portals hero ───────────────────────────────────── */
.portals{position:relative;min-height:100svh;display:grid;grid-template-columns:repeat(4,1fr);}
.portals-intro{position:absolute;top:0;left:0;right:0;z-index:6;display:flex;justify-content:center;padding:94px 20px 0;pointer-events:none;}
.portals-intro .eyebrow{display:flex;align-items:center;gap:14px;text-shadow:0 2px 14px rgba(0,0,0,.95);}
.portal{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;padding:44px 30px;border-right:1px solid rgba(0,0,0,.5);text-align:left;}
.portal:last-child{border-right:0;}
.portal-img{position:absolute;inset:0;background-size:cover;background-position:center;transition:transform .8s cubic-bezier(.2,.7,.2,1);}
.portal:hover .portal-img{transform:scale(1.07);}
.portal-scrim{position:absolute;inset:0;transition:opacity .4s;}
.portal::after{content:"";position:absolute;inset:0;z-index:1;background:radial-gradient(72% 46% at 50% 100%,color-mix(in srgb,var(--gold) 26%,transparent),transparent 72%);opacity:0;transition:opacity .45s;pointer-events:none;}
.portal:hover::after{opacity:1;}
.portal>.pkick,.portal>h2,.portal>.pstatus,.portal>.penter{position:relative;z-index:2;}
.portal .pkick{font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:10px;}
.portal h2{font-family:var(--display);font-weight:700;font-size:clamp(23px,1.9vw,30px);line-height:1.05;color:var(--bone);margin:0 0 12px;text-shadow:0 2px 18px rgba(0,0,0,.9);}
.portal .pstatus{font-family:var(--body);font-size:16px;color:var(--bone-soft);margin-bottom:18px;text-shadow:0 1px 10px rgba(0,0,0,.8);}
.portal .penter{font-family:var(--display);font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);display:flex;align-items:center;gap:9px;opacity:0;transform:translateY(8px);transition:opacity .4s,transform .4s;}
.portal .penter span{transition:transform .3s;}
.portal:hover .penter{opacity:1;transform:none;}
.portal:hover .penter span{transform:translateX(4px);}
@media (hover:none){.portal .penter{opacity:1;transform:none;}}
@media (max-width:900px){
  .portals{grid-template-columns:1fr 1fr;}
  .portal{border-bottom:1px solid rgba(0,0,0,.5);min-height:52svh;}
  .portal:nth-child(odd of .portal){}
}
@media (max-width:560px){
  .portals{grid-template-columns:1fr;}
  .portal{min-height:60svh;border-right:0;}
  .portals-intro{padding-top:84px;}
}
/* entrance — panels rise in, staggered (opacity stays 1 so panels are never stranded invisible) */
@media (prefers-reduced-motion:no-preference){
  .portals-intro{animation:portalRise 1s cubic-bezier(.2,.7,.2,1) .1s both;}
  .portal{animation:portalRise 1s cubic-bezier(.2,.7,.2,1) both;}
  .portal:nth-child(2){animation-delay:.18s;}
  .portal:nth-child(3){animation-delay:.32s;}
  .portal:nth-child(4){animation-delay:.46s;}
  .portal:nth-child(5){animation-delay:.60s;}
}
@keyframes portalRise{from{transform:translateY(46px);}to{transform:none;}}

/* ── responsive ───────────────────────────────────────────────── */
@media (max-width:880px){
  body{font-size:18px;}
  .nav-links{
    position:fixed;inset:0 0 0 auto;width:min(78vw,330px);
    flex-direction:column;align-items:flex-start;justify-content:center;gap:26px;
    background:rgba(9,12,16,0.97);backdrop-filter:blur(16px);
    padding:0 var(--gutter);transform:translateX(100%);transition:transform .35s ease;
    border-left:1px solid var(--rule-faint);
  }
  .nav-links.open{transform:none;}
  .nav-links a{font-size:20px;}
  .nav-toggle{display:block;z-index:101;}
  .footer-grid{grid-template-columns:1fr;gap:40px;}
  .footer .legal{flex-direction:column;gap:14px;text-align:center;}
}