/* ═══════════════════════════════════════════════════════════
   THE WAR WITHIN — Shared Site Stylesheet (site.css)
   Covers: Design tokens, reset, keyframes, reading bar,
           navigation, footer nav band, foot strip, 
           mobile drawer, and global responsive rules.
   Generated from canonical reference: battle-10.html
   DO NOT include page-specific CSS here.
   Update once, applies to all pages via:
     <link rel="stylesheet" href="/site.css">
═══════════════════════════════════════════════════════════ */


/* ═══════════════════════════════════════════════════
   DESIGN TOKENS
═══════════════════════════════════════════════════ */
:root {
  --abyss:       #0E0806;
  --void:        #130705;
  --iron:        #2A0C06;
  --mist:        #9B3A1C;
  --edge:        #D4A017;
  --crimson:     #8B1A1A;
  --aged-gold:   #B8922A;
  --white:       #F2EDE4;
  --white-dim:   rgba(242,237,228,0.55);
  --white-ghost: rgba(242,237,228,0.10);
  --gold-ghost:  rgba(212,160,23,0.07);
  --crimsondim:  rgba(139,26,26,0.35);
  --pad-v:       112px;
  --pad-h:       52px;
  --max-w:       1260px;
  --max:         1260px;
  /* ── Alias variables for page compatibility ── */
  --pad:         52px;      /* alias for --pad-h */
  --vpad:        112px;     /* alias for --pad-v */
  --pale-gold:   #B8922A;   /* alias for --aged-gold */
  --white-d:     rgba(242,237,228,.55); /* alias for --white-dim */

  --gap:         2px;
}

/* ═══════════════════════════════════════════════════
   RESET
═══════════════════════════════════════════════════ */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; scrollbar-width:thin; scrollbar-color:#D4A017 #130705; }
::-webkit-scrollbar { width:8px; }
::-webkit-scrollbar-track { background:var(--void); border-left:1px solid var(--iron); }
::-webkit-scrollbar-thumb {
  background:linear-gradient(to bottom,#B8922A,#D4A017 30%,#FFD700 50%,#D4A017 70%,#B8922A);
  border-radius:2px; border:1px solid var(--iron);
}

body {
  background:var(--abyss); color:var(--white);
  font-family:'Crimson Pro',Georgia,serif;
  font-size:19px; line-height:1.8; overflow-x:hidden;
}
body::before {
  content:''; position:fixed; inset:0; pointer-events:none; z-index:900; opacity:.48;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.05'/%3E%3C/svg%3E");
}

/* ═══════════════════════════════════════════════════
   KEYFRAMES
═══════════════════════════════════════════════════ */
@keyframes fadeUp {
  from { opacity:0; transform:translateY(24px); }
  to   { opacity:1; transform:translateY(0); }
}
@keyframes fadeIn { from{opacity:0} to{opacity:1} }
@keyframes goldShimmer {
  0%   { background-position:200% center; }
  100% { background-position:-200% center; }
}
@keyframes scrollPulse {
  0%,100% { opacity:.35; transform:scaleY(.8); }
  50%     { opacity:1;   transform:scaleY(1); }
}
@keyframes sealPulse {
  0%,100% { box-shadow:0 0 0 0 rgba(139,26,26,0); }
  50%     { box-shadow:0 0 32px 6px rgba(139,26,26,.14); }
}
@keyframes warningBreath {
  0%,100% { border-color:rgba(139,26,26,.5); }
  50%     { border-color:rgba(212,160,23,.28); }
}

/* Skip link */
.skip-link {
  position:absolute; top:-100px; left:24px; z-index:9999;
  font-family:'Cinzel',serif; font-size:11px; letter-spacing:.2em;
  color:var(--abyss); background:var(--edge);
  padding:10px 22px; text-decoration:none; text-transform:uppercase;
  transition:top .2s ease;
}
.skip-link:focus { top:8px; }

/* ═══════════════════════════════════════════════════
   READING BAR
═══════════════════════════════════════════════════ */
.reading-bar { position:fixed; top:0; left:0; right:0; height:2px; z-index:800; }
.reading-bar-fill { height:100%; width:0%; background:linear-gradient(to right,var(--crimson),var(--edge)); transition:width .1s linear; }

/* ═══════════════════════════════════════════════════
   NAVIGATION
═══════════════════════════════════════════════════ */
.b-nav {
  position:fixed; top:0; left:0; right:0; z-index:500;
  padding:0 var(--pad-h);
  height:64px;
  display:flex; align-items:center; justify-content:space-between; gap:20px;
  background:linear-gradient(to bottom,rgba(14,8,6,.97) 0%,transparent 100%);
  transition:background .3s, box-shadow .3s;
}
.b-nav.scrolled { background:rgba(14,8,6,.97); box-shadow:0 1px 0 rgba(139,26,26,.3); }

/* Brand */
.b-nav-brand {
  font-family:'Cinzel',serif; font-size:11px; letter-spacing:.22em;
  color:var(--edge); text-transform:uppercase; text-decoration:none;
  white-space:nowrap; flex-shrink:0; line-height:1;
}

/* ── CENTRAL SITE-WIDE NAV LINKS (replaces b-nav-progress) ── */
.b-nav-center {
  display:flex; align-items:center; gap:0; list-style:none;
  flex:1; justify-content:center;
}
.b-nav-center a {
  font-family:'Cinzel',serif; font-size:9px; letter-spacing:.28em;
  color:var(--white-dim); text-transform:uppercase; text-decoration:none;
  padding:8px 16px; transition:color .22s; white-space:nowrap;
  border-left:1px solid rgba(139,26,26,.2);
}
.b-nav-center li:first-child a { border-left:none; }
.b-nav-center a:hover { color:var(--edge); }

/* ── RIGHT NAV LINKS — Order Now only ── */
.b-nav-links { display:flex; align-items:center; list-style:none; flex-shrink:0; }
.b-nav-links a {
  font-family:'Cinzel',serif; font-size:9px; letter-spacing:.24em;
  color:var(--white-dim); text-transform:uppercase; text-decoration:none;
  padding:8px 16px; border-left:1px solid rgba(139,26,26,.22);
  transition:color .22s; white-space:nowrap;
}
.b-nav-links a:hover { color:var(--edge); }
.b-nav-links .nav-order {
  color:var(--abyss); background:var(--edge); border-color:var(--edge);
  transition:background .25s, color .25s;
}
.b-nav-links .nav-order:hover { background:transparent; color:var(--edge); }

/* ═══════════════════════════════════════════════════
   SHARED TOKENS
═══════════════════════════════════════════════════ */
.wrap { max-width:var(--max-w); margin:0 auto; }
.sec-label {
  font-family:'Cinzel',serif; font-size:10px; letter-spacing:.44em;
  color:var(--edge); text-transform:uppercase; display:block; margin-bottom:18px;
}
.sec-heading {
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(34px,5vw,66px); font-weight:600;
  line-height:1.04; letter-spacing:-.025em; margin-bottom:24px;
}
.sec-heading em { font-style:italic; color:var(--edge); }
.body-p {
  font-size:clamp(16px,1.8vw,19px); color:var(--white-dim); line-height:1.9; margin-bottom:20px;
}
.body-p:last-child { margin-bottom:0; }
.body-p strong { color:var(--white); font-weight:500; }
.body-p em { color:var(--aged-gold); font-style:italic; }

.pull-quote {
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(20px,2.4vw,28px); font-style:italic; font-weight:300;
  color:var(--white); line-height:1.52;
  border-left:2px solid var(--edge); padding-left:26px;
}

.divider {
  display:flex; align-items:center; gap:20px;
  max-width:960px; margin:0 auto; padding:0 var(--pad-h);
}
.divider::before, .divider::after {
  content:''; flex:1; height:1px;
  background:linear-gradient(to right,transparent,var(--crimson),transparent);
}
.diam {
  width:26px; height:26px; border:1px solid var(--crimson);
  transform:rotate(45deg); flex-shrink:0; position:relative;
}
.diam::after { content:''; position:absolute; inset:5px; background:var(--edge); opacity:.5; }

.btn-gold {
  font-family:'Cinzel',serif; font-size:11px; font-weight:600; letter-spacing:.24em;
  text-transform:uppercase; color:var(--abyss); background:var(--edge);
  padding:15px 38px; text-decoration:none; border:1px solid var(--edge);
  transition:all .28s; display:inline-block;
}
.btn-gold:hover { background:var(--aged-gold); border-color:var(--aged-gold); }
.btn-ghost {
  font-family:'Cinzel',serif; font-size:11px; font-weight:600; letter-spacing:.24em;
  text-transform:uppercase; color:var(--white); background:transparent;
  padding:15px 38px; text-decoration:none; border:1px solid rgba(242,237,228,.2);
  transition:all .28s; display:inline-block;
}
.btn-ghost:hover { border-color:var(--edge); color:var(--edge); }
.btn-sm {
  font-family:'Cinzel',serif; font-size:9px; font-weight:600; letter-spacing:.22em;
  text-transform:uppercase; color:var(--white-dim); background:transparent;
  padding:10px 22px; text-decoration:none; border:1px solid rgba(242,237,228,.15);
  transition:all .28s; display:inline-block;
}
.btn-sm:hover { border-color:var(--edge); color:var(--edge); }

/* Reveal animation */
.rev {
  opacity:0; transform:translateY(26px);
  transition:opacity .75s ease, transform .75s ease;
}
.rev.on { opacity:1; transform:translateY(0); }

/* ═══════════════════════════════════════════════════
   HERO
═══════════════════════════════════════════════════ */


.footer-band {
  background:var(--abyss); border-top:1px solid rgba(139,26,26,.35);
  display:grid; grid-template-columns:1fr auto 1fr;
}
.fband-cell { padding:30px 36px; display:flex; flex-direction:column; gap:5px; text-decoration:none; transition:background .25s; }
.fband-cell:hover { background:rgba(139,26,26,.06); }
.fband-cell:first-child { border-right:1px solid rgba(139,26,26,.25); }
.fband-cell:last-child { border-left:1px solid rgba(139,26,26,.25); text-align:right; align-items:flex-end; }
.fband-center { display:flex; flex-direction:column; align-items:center; justify-content:center; padding:22px 36px; gap:8px; }
.fbc-dir { font-family:'Cinzel',serif; font-size:8px; letter-spacing:.36em; color:var(--mist); text-transform:uppercase; }
.fbc-title { font-family:'Cormorant Garamond',serif; font-size:clamp(14px,1.6vw,18px); font-weight:600; color:var(--white); line-height:1.2; }
.fbc-num { font-family:'Cinzel',serif; font-size:8px; letter-spacing:.22em; color:var(--mist); text-transform:uppercase; }
.fbc-ctr-lbl { font-family:'Cinzel',serif; font-size:9px; letter-spacing:.3em; color:var(--edge); text-transform:uppercase; }

/* ═══════════════════════════════════════════════════
   FOOT STRIP — updated layout
═══════════════════════════════════════════════════ */
.foot-strip {
  background:var(--void); border-top:1px solid var(--iron);
  padding:22px var(--pad-h);
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px;
}
/* Left: copyright text */
.foot-copy-left {
  font-family:'Cinzel',serif; font-size:9px; letter-spacing:.22em;
  color:var(--edge);
  text-transform:uppercase;
}
/* Center: site links */
.foot-links { display:flex; gap:22px; list-style:none; }
.foot-links a {
  font-family:'Cinzel',serif; font-size:9px; letter-spacing:.2em;
  color:rgba(242,237,228,.25); text-transform:uppercase; text-decoration:none; transition:color .22s;
}
.foot-links a:hover { color:var(--edge); }
/* Right: legal links */
.foot-legal { display:flex; gap:20px; list-style:none; }
.foot-legal a {
  font-family:'Cinzel',serif; font-size:9px; letter-spacing:.2em;
  color:rgba(242,237,228,.22); text-transform:uppercase; text-decoration:none; transition:color .22s;
}
.foot-legal a:hover { color:var(--edge); }

/* ═══════════════════════════════════════════════════
   ADDITIONAL TEACHING SECTION
═══════════════════════════════════════════════════ */
#teaching {
  padding:var(--pad-v) var(--pad-h);
  max-width:var(--max-w); margin:0 auto;
  border-top:1px solid var(--crimson);
}
.teaching-grid {
  display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center;
}

/* Left — message card */
.teaching-label {
  font-family:'Cinzel',serif; font-size:10px; letter-spacing:.44em;
  color:var(--edge); text-transform:uppercase; display:block; margin-bottom:18px;
}
.teaching-heading {
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(28px,3.2vw,42px); font-weight:600;
  line-height:1.1; letter-spacing:-.02em; color:var(--white);
  margin-bottom:28px;
}
.message-card {
  background:var(--iron); border:1px solid rgba(212,160,23,.12);
  padding:40px 44px; position:relative;
}
.message-card::before {
  content:''; position:absolute; top:0; left:0; right:0; height:2px;
  background:linear-gradient(to right,var(--crimson),transparent);
}
.message-body {
  font-size:clamp(16px,1.7vw,18px); color:var(--white-dim); line-height:1.82;
  margin-bottom:0;
}
.message-sublabel {
  font-family:'Cinzel',serif; font-size:9px; letter-spacing:.38em;
  color:var(--edge); text-transform:uppercase;
  display:flex; align-items:center; gap:14px;
  margin-top:32px; margin-bottom:0;
}
.message-sublabel::after {
  content:''; flex:1; height:1px;
  background:linear-gradient(to right,rgba(212,160,23,.35),transparent);
  max-width:60px;
}
.message-subbody {
  font-size:clamp(14px,1.4vw,16px); color:var(--white-dim); line-height:1.72;
  margin-top:12px;
}
.teaching-btn-group {
  display:flex; flex-direction:row; align-items:center;
  gap:12px; flex-wrap:wrap; margin-top:28px;
}
.btn-play {
  font-family:'Cinzel',serif; font-size:10px; letter-spacing:.24em;
  text-transform:uppercase; color:var(--abyss); background:var(--edge);
  padding:14px 28px; text-decoration:none; border:1px solid var(--edge);
  transition:all .25s; display:inline-flex; align-items:center; gap:10px;;
  width:auto; flex-shrink:0; cursor:pointer;
}
.btn-play::before { content:'▶'; font-size:12px; }
.btn-play:hover { background:var(--aged-gold); border-color:var(--aged-gold); }
.btn-download-outline {
  font-family:'Cinzel',serif; font-size:10px; letter-spacing:.24em;
  text-transform:uppercase; color:var(--edge); background:transparent;
  padding:14px 28px; text-decoration:none; border:1px solid rgba(212,160,23,.4);
  transition:all .25s; display:inline-flex; align-items:center; gap:10px;
}
.btn-download-outline::before { content:'↓'; font-family:'Cormorant Garamond',serif; font-size:18px; line-height:1; }
.btn-download-outline:hover { background:rgba(212,160,23,.06); border-color:var(--edge); }

/* Right — video placeholder */
.video-placeholder {
  position:relative; width:100%;
  aspect-ratio:16/9;
  background:var(--void);
  border:1px solid rgba(139,26,26,.4);
  display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:18px;
  overflow:hidden;
}
/* Subtle grid pattern */
.video-placeholder::before {
  content:''; position:absolute; inset:0; pointer-events:none;
  background-image:
    repeating-linear-gradient(90deg,transparent,transparent 39px,rgba(139,26,26,.06) 40px),
    repeating-linear-gradient(0deg, transparent,transparent 39px,rgba(139,26,26,.04) 40px);
}
/* Radial glow */
.video-placeholder::after {
  content:''; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(ellipse 65% 60% at 50% 50%,rgba(139,26,26,.18) 0%,transparent 70%);
}
.video-play-icon {
  width:64px; height:64px; position:relative; z-index:1;
  border:1px solid rgba(212,160,23,.5); transform:rotate(45deg);
  display:flex; align-items:center; justify-content:center;
  transition:border-color .25s, background .25s;
}
.video-placeholder:hover .video-play-icon {
  border-color:var(--edge); background:rgba(212,160,23,.08);
}
.video-play-icon::after {
  content:''; position:absolute; inset:10px;
  background:rgba(212,160,23,.15);
}
.video-play-glyph {
  position:absolute; z-index:2;
  font-size:22px; color:var(--edge); opacity:.7;
  transform:rotate(-45deg) translateX(3px);
  transition:opacity .25s;
}
.video-placeholder:hover .video-play-glyph { opacity:1; }
.video-label {
  font-family:'Cinzel',serif; font-size:9px; letter-spacing:.36em;
  color:var(--mist); text-transform:uppercase;
  position:relative; z-index:1;
}
.video-sublabel {
  font-family:'Cinzel',serif; font-size:8px; letter-spacing:.24em;
  color:rgba(242,237,228,.2); text-transform:uppercase;
  position:relative; z-index:1;
}
/* Top border accent */
.video-placeholder-inner {
  position:absolute; top:0; left:0; right:0; height:2px;
  background:linear-gradient(to right,transparent,rgba(139,26,26,.6),transparent);
}

@media(max-width:1060px) {
  .teaching-grid { grid-template-columns:1fr; gap:40px; }
}
@media(max-width:760px) {
  .message-card { padding:28px 24px; }
  .teaching-btn-group { flex-direction:column; }
  .btn-play, .btn-download-outline { justify-content:center; }
}

/* ═══════════════════════════════════════════════════
   

/* ═══════════════════════════════════════════════════
MOBILE MENU BUTTON & DRAWER
═══════════════════════════════════════════════════ */

/* Menu trigger — hidden on desktop */
.b-nav-menu-btn {
  display:none;
  flex-direction:column; justify-content:center; gap:5px;
  width:36px; height:36px; cursor:pointer;
  background:transparent; border:1px solid rgba(139,26,26,.35);
  padding:8px; flex-shrink:0;
  transition:border-color .22s;
}
.b-nav-menu-btn:hover { border-color:var(--edge); }
.b-nav-menu-btn span {
  display:block; height:1px; width:100%;
  background:var(--edge);
  transition:transform .3s ease, opacity .3s ease, width .3s ease;
  transform-origin:center;
}
/* Animated to X when open */
.b-nav-menu-btn.open span:nth-child(1) { transform:translateY(6px) rotate(45deg); }
.b-nav-menu-btn.open span:nth-child(2) { opacity:0; width:0; }
.b-nav-menu-btn.open span:nth-child(3) { transform:translateY(-6px) rotate(-45deg); }

/* Overlay — covers page behind drawer */
.drawer-overlay {
  display:none; position:fixed; inset:0; z-index:490;
  background:rgba(14,8,6,.7);
  backdrop-filter:blur(3px);
  opacity:0; transition:opacity .35s ease;
}
.drawer-overlay.visible { opacity:1; }

/* Drawer panel */
.mobile-drawer {
  position:fixed; top:0; right:0; bottom:0; z-index:510;
  width:min(320px, 88vw);
  background:var(--void);
  border-left:1px solid rgba(139,26,26,.4);
  display:flex; flex-direction:column;
  transform:translateX(100%);
  transition:transform .38s cubic-bezier(.4,0,.2,1);
  overflow-y:auto;
}
.mobile-drawer.open { transform:translateX(0); }

/* Drawer header */
.drawer-header {
  display:flex; align-items:center; justify-content:space-between;
  padding:18px 28px;
  border-bottom:1px solid rgba(139,26,26,.28);
  height:64px; flex-shrink:0;
}
.drawer-brand {
  font-family:'Cinzel',serif; font-size:10px; letter-spacing:.22em;
  color:var(--edge); text-transform:uppercase; text-decoration:none;
}
.drawer-close {
  background:transparent; border:1px solid rgba(139,26,26,.35);
  width:32px; height:32px; cursor:pointer; position:relative;
  display:flex; align-items:center; justify-content:center;
  transition:border-color .22s; flex-shrink:0;
}
.drawer-close:hover { border-color:var(--edge); }
.drawer-close::before, .drawer-close::after {
  content:''; position:absolute;
  width:14px; height:1px; background:var(--edge);
}
.drawer-close::before { transform:rotate(45deg); }
.drawer-close::after  { transform:rotate(-45deg); }

/* Drawer nav links */
.drawer-nav {
  flex:1; padding:12px 0;
  display:flex; flex-direction:column;
}
.drawer-nav a {
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(22px,5vw,28px); font-weight:600;
  color:var(--white-dim); text-decoration:none;
  padding:16px 28px;
  border-bottom:1px solid rgba(139,26,26,.15);
  letter-spacing:-.01em; line-height:1.2;
  transition:color .22s, padding-left .22s, background .22s;
  display:flex; align-items:center; gap:12px;
}
.drawer-nav a::before {
  content:''; display:block;
  width:4px; height:4px; border:1px solid rgba(212,160,23,.4);
  transform:rotate(45deg); flex-shrink:0;
  transition:border-color .22s, background .22s;
}
.drawer-nav a:hover {
  color:var(--edge); padding-left:36px;
  background:rgba(212,160,23,.03);
}
.drawer-nav a:hover::before { border-color:var(--edge); background:rgba(212,160,23,.3); }

/* Drawer label above links */
.drawer-nav-label {
  font-family:'Cinzel',serif; font-size:8px; letter-spacing:.42em;
  color:var(--mist); text-transform:uppercase;
  padding:20px 28px 10px;
}

/* Drawer CTA */
.drawer-cta-wrap {
  padding:24px 28px 36px;
  border-top:1px solid rgba(139,26,26,.28);
  flex-shrink:0;
}
.drawer-cta {
  display:block; width:100%; text-align:center;
  font-family:'Cinzel',serif; font-size:11px; font-weight:600; letter-spacing:.24em;
  text-transform:uppercase; color:var(--abyss); background:var(--edge);
  padding:16px 28px; text-decoration:none; border:1px solid var(--edge);
  transition:background .25s, color .25s;
}
.drawer-cta:hover { background:var(--aged-gold); border-color:var(--aged-gold); }

/* ═══════════════════════════════════════════════════
   RESPONSIVE
═══════════════════════════════════════════════════ */
@media(max-width:1060px) {
  #conflict .conflict-mid, .mirror-grid, .practice-grid { grid-template-columns:1fr; gap:52px; }
  .strategy-hdr { grid-template-columns:1fr; gap:40px; }
  .concepts-grid { grid-template-columns:repeat(2,1fr); }
  .concepts-grid .c-card:nth-child(1) { grid-column:span 1; }
  .concepts-grid .c-card:nth-child(2) { grid-column:span 1; }
  .concepts-grid .c-card:nth-child(3) { grid-column:span 1; }
  .concepts-grid .c-card:nth-child(4) { grid-column:span 1; }
  .concepts-grid .c-card:nth-child(5) { grid-column:span 2; }
  .b-nav-center { display:none; }
  .footer-band { grid-template-columns:1fr; }
  .fband-cell, .fband-center { border:none !important; border-top:1px solid rgba(139,26,26,.2) !important; }
  .fband-cell:first-child { border-top:none !important; }
}
@media(max-width:760px) {
  :root { --pad-v:80px; --pad-h:24px; }
  .b-nav { padding:0 24px; height:56px; }
  .b-nav-center { display:none; }
  /* Hide desktop Order Now — moved into drawer */
  .b-nav-links { display:none; }
  /* Show hamburger */
  .b-nav-menu-btn { display:flex; }
  .drawer-overlay { display:block; pointer-events:none; }
  .drawer-overlay.visible { pointer-events:auto; }
  #hero { padding:max(160px,16vh) 24px 100px; }
  .hero-bracket { display:none; }
  .concepts-grid { grid-template-columns:1fr 1fr; }
  .concepts-grid .c-card { grid-column:span 1; }
  .concepts-grid .c-card:nth-child(1),
  .concepts-grid .c-card:nth-child(2),
  .concepts-grid .c-card:nth-child(3),
  .concepts-grid .c-card:nth-child(4),
  .concepts-grid .c-card:nth-child(5) { grid-column:span 1; }
  .danger-items { grid-template-columns:1fr; }
  .danger-item:last-child:nth-child(odd) { grid-column:auto; }
  .danger-panel { padding:36px 28px; }
  .foot-strip { flex-direction:column; text-align:center; padding:24px; gap:14px; }
  .foot-links { justify-content:center; flex-wrap:wrap; }
  .foot-legal { justify-content:center; }
}

/* AUDIO PLAYER */
.audio-player {
  display:none; margin-top:24px;
  background:rgba(26,4,2,.72);
  border:1px solid rgba(139,26,26,.45);
  padding:20px 24px; position:relative; overflow:hidden;
}
.audio-player.active { display:block; animation:ap-in .32s ease; }
@keyframes ap-in { from{opacity:0;transform:translateY(-8px)} to{opacity:1;transform:translateY(0)} }
.audio-player::before {
  content:''; position:absolute; top:0; left:0; right:0; height:2px;
  background:linear-gradient(to right, var(--crimson), var(--edge), var(--crimson));
}
.ap-track-info {
  font-family:'Cinzel',serif; font-size:9px; letter-spacing:.28em;
  color:var(--edge); text-transform:uppercase; margin-bottom:16px;
}
.ap-controls { display:flex; align-items:center; gap:14px; }
.ap-play-btn {
  flex-shrink:0; width:40px; height:40px;
  background:var(--crimson); border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center; transition:background .22s;
}
.ap-play-btn:hover { background:var(--aged-gold); }
.ap-play-btn .ap-icon-play,
.ap-play-btn .ap-icon-pause { display:flex; align-items:center; justify-content:center; color:#F2EDE4; pointer-events:none; }
.ap-play-btn .ap-icon-pause { display:none; }
.ap-play-btn.playing .ap-icon-play  { display:none; }
.ap-play-btn.playing .ap-icon-pause { display:flex; }
.ap-time-current { font-family:'Cinzel',serif; font-size:10px; color:var(--edge); flex-shrink:0; min-width:38px; text-align:right; }
.ap-progress-wrap { flex:1; display:flex; flex-direction:column; gap:6px; }
.ap-progress-bar { width:100%; height:3px; background:rgba(139,26,26,.3); cursor:pointer; border:none; appearance:none; -webkit-appearance:none; outline:none; }
.ap-progress-bar::-webkit-slider-runnable-track { background:transparent; height:3px; }
.ap-progress-bar::-webkit-slider-thumb { -webkit-appearance:none; width:13px; height:13px; background:var(--edge); border-radius:0; transform:rotate(45deg); margin-top:-5px; cursor:pointer; }
.ap-progress-bar::-moz-range-thumb { width:12px; height:12px; background:var(--edge); border:none; border-radius:0; cursor:pointer; }
.ap-progress-bar::-moz-range-track { background:rgba(139,26,26,.3); height:3px; }
.ap-time-total { font-family:'Cinzel',serif; font-size:10px; color:var(--mist); flex-shrink:0; min-width:38px; }
.ap-vol-wrap { display:flex; align-items:center; gap:8px; flex-shrink:0; }
.ap-vol-icon { color:var(--mist); font-size:13px; cursor:pointer; flex-shrink:0; transition:color .2s; user-select:none; }
.ap-vol-icon:hover { color:var(--edge); }
.ap-vol-slider { width:64px; height:3px; background:rgba(139,26,26,.3); cursor:pointer; border:none; appearance:none; -webkit-appearance:none; outline:none; }
.ap-vol-slider::-webkit-slider-thumb { -webkit-appearance:none; width:10px; height:10px; background:var(--aged-gold); border-radius:0; transform:rotate(45deg); margin-top:-4px; cursor:pointer; }
.ap-vol-slider::-moz-range-thumb { width:9px; height:9px; background:var(--aged-gold); border:none; border-radius:0; cursor:pointer; }
@media(max-width:600px) { .ap-vol-wrap { display:none; } .ap-controls { gap:10px; } }


.b-nav {
  position:fixed; top:0; left:0; right:0; z-index:500;
  padding:0 var(--pad-h);
  height:120px;
  display:flex; align-items:center; justify-content:space-between; gap:20px;
  background:linear-gradient(to bottom,rgba(14,8,6,.97) 0%,transparent 100%);
  transition:background .3s, box-shadow .3s;
}
.b-nav.scrolled { background:rgba(14,8,6,.97); box-shadow:0 1px 0 rgba(139,26,26,.3); }

/* Brand */
.b-nav-brand {
  font-family:'Cinzel',serif; font-size:11px; letter-spacing:.22em;
  color:var(--edge); text-transform:uppercase; text-decoration:none;
  white-space:nowrap; flex-shrink:0; line-height:1;
  display:flex; align-items:center;
}
.nav-logo-img { height:96px; width:auto; display:block; }
.drawer-logo-img { height:90px; width:auto; display:block; }

/* ── CENTRAL SITE-WIDE NAV LINKS (replaces b-nav-progress) ── */
.b-nav-center {
  display:flex; align-items:center; gap:0; list-style:none;
  flex:1; justify-content:center;
}
.b-nav-center a {
  font-family:'Cinzel',serif; font-size:9px; letter-spacing:.28em;
  color:var(--white-dim); text-transform:uppercase; text-decoration:none;
  padding:8px 16px; transition:color .22s; white-space:nowrap;
  border-left:1px solid rgba(139,26,26,.2);
}
.b-nav-center li:first-child a { border-left:none; }
.b-nav-center a:hover { color:var(--edge); }

/* ── RIGHT NAV LINKS — Order Now only ── */
.b-nav-links { display:flex; align-items:center; list-style:none; flex-shrink:0; }
.b-nav-links a {
  font-family:'Cinzel',serif; font-size:9px; letter-spacing:.24em;
  color:var(--white-dim); text-transform:uppercase; text-decoration:none;
  padding:8px 16px; border-left:1px solid rgba(139,26,26,.22);
  transition:color .22s; white-space:nowrap;
}
.b-nav-links a:hover { color:var(--edge); }
.b-nav-links .nav-order {
  color:var(--abyss); background:var(--edge); border-color:var(--edge);
  transition:background .25s, color .25s;
}
.b-nav-links .nav-order:hover { background:transparent; color:var(--edge); }

/* ═══════════════════════════════════════════════════
   SHARED TOKENS

/* ═══════════════════════════════════════════════════
   MOBILE MENU BUTTON & DRAWER
═══════════════════════════════════════════════════ */

/* Menu trigger — hidden on desktop */
.b-nav-menu-btn {
  display:none;
  flex-direction:column; justify-content:center; gap:5px;
  width:36px; height:36px; cursor:pointer;
  background:transparent; border:1px solid rgba(139,26,26,.35);
  padding:8px; flex-shrink:0;
  transition:border-color .22s;
}
.b-nav-menu-btn:hover { border-color:var(--edge); }
.b-nav-menu-btn span {
  display:block; height:1px; width:100%;
  background:var(--edge);
  transition:transform .3s ease, opacity .3s ease, width .3s ease;
  transform-origin:center;
}
/* Animated to X when open */
.b-nav-menu-btn.open span:nth-child(1) { transform:translateY(6px) rotate(45deg); }
.b-nav-menu-btn.open span:nth-child(2) { opacity:0; width:0; }
.b-nav-menu-btn.open span:nth-child(3) { transform:translateY(-6px) rotate(-45deg); }

/* Overlay — covers page behind drawer */
.drawer-overlay {
  display:none; position:fixed; inset:0; z-index:490;
  background:rgba(14,8,6,.7);
  backdrop-filter:blur(3px);
  opacity:0; transition:opacity .35s ease;
}
.drawer-overlay.visible { opacity:1; }

/* Drawer panel */
.mobile-drawer {
  position:fixed; top:0; right:0; bottom:0; z-index:510;
  width:min(320px, 88vw);
  background:var(--void);
  border-left:1px solid rgba(139,26,26,.4);
  display:flex; flex-direction:column;
  transform:translateX(100%);
  transition:transform .38s cubic-bezier(.4,0,.2,1);
  overflow-y:auto;
}
.mobile-drawer.open { transform:translateX(0); }

/* Drawer header */
.drawer-header {
  display:flex; align-items:center; justify-content:space-between;
  padding:18px 28px;
  border-bottom:1px solid rgba(139,26,26,.28);
  height:120px; flex-shrink:0;
}
.drawer-brand {
  font-family:'Cinzel',serif; font-size:10px; letter-spacing:.22em;
  color:var(--edge); text-transform:uppercase; text-decoration:none;
  display:flex; align-items:center;
}
.drawer-close {
  background:transparent; border:1px solid rgba(139,26,26,.35);
  width:32px; height:32px; cursor:pointer; position:relative;
  display:flex; align-items:center; justify-content:center;
  transition:border-color .22s; flex-shrink:0;
}
.drawer-close:hover { border-color:var(--edge); }
.drawer-close::before, .drawer-close::after {
  content:''; position:absolute;
  width:14px; height:1px; background:var(--edge);
}
.drawer-close::before { transform:rotate(45deg); }
.drawer-close::after  { transform:rotate(-45deg); }

/* Drawer nav links */
.drawer-nav {
  flex:1; padding:12px 0;
  display:flex; flex-direction:column;
}
.drawer-nav a {
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(22px,5vw,28px); font-weight:600;
  color:var(--white-dim); text-decoration:none;
  padding:16px 28px;
  border-bottom:1px solid rgba(139,26,26,.15);
  letter-spacing:-.01em; line-height:1.2;
  transition:color .22s, padding-left .22s, background .22s;
  display:flex; align-items:center; gap:12px;
}
.drawer-nav a::before {
  content:''; display:block;
  width:4px; height:4px; border:1px solid rgba(212,160,23,.4);
  transform:rotate(45deg); flex-shrink:0;
  transition:border-color .22s, background .22s;
}
.drawer-nav a:hover {
  color:var(--edge); padding-left:36px;
  background:rgba(212,160,23,.03);
}
.drawer-nav a:hover::before { border-color:var(--edge); background:rgba(212,160,23,.3); }

/* Drawer label above links */
.drawer-nav-label {
  font-family:'Cinzel',serif; font-size:8px; letter-spacing:.42em;
  color:var(--mist); text-transform:uppercase;
  padding:20px 28px 10px;
}

/* Drawer CTA */
.drawer-cta-wrap {
  padding:24px 28px 36px;
  border-top:1px solid rgba(139,26,26,.28);
  flex-shrink:0;
}
.drawer-cta {
  display:block; width:100%; text-align:center;
  font-family:'Cinzel',serif; font-size:11px; font-weight:600; letter-spacing:.24em;
  text-transform:uppercase; color:var(--abyss); background:var(--edge);
  padding:16px 28px; text-decoration:none; border:1px solid var(--edge);
  transition:background .25s, color .25s;
}
.drawer-cta:hover { background:var(--aged-gold); border-color:var(--aged-gold); }

@media(max-width:760px) {
  .b-nav { padding:0 16px; height:96px; gap:14px; }
  .nav-logo-img { height:80px; }
}

/* ── Hero reveal: above-fold .rev elements show immediately ── */
#hero .rev,
.hero .rev { opacity:1 !important; transform:none !important; }

/* ── Cross-class reveal compatibility ─────────────────────── */
.rev.visible  { opacity:1; transform:none; }
.rev.active   { opacity:1; transform:none; }
.rev.open     { opacity:1; transform:none; }
.reveal.on    { opacity:1; transform:none; }
.reveal.active{ opacity:1; transform:none; }