/* ============================================================
   JGB. Jeremy Barker · Sample v1
   Custom rugged-heritage palette. Dark mode default.
   ============================================================ */

:root {
  /* Type scale */
  --text-xs: clamp(0.75rem, 0.7rem + 0.25vw, 0.8125rem);
  --text-sm: clamp(0.8125rem, 0.78rem + 0.2vw, 0.875rem);
  --text-base: clamp(1rem, 0.95rem + 0.25vw, 1.0625rem);
  --text-lg: clamp(1.125rem, 1rem + 0.6vw, 1.375rem);
  --text-xl: clamp(1.5rem, 1.2rem + 1.25vw, 2.25rem);
  --text-2xl: clamp(2rem, 1.2rem + 2.5vw, 3.5rem);
  --text-3xl: clamp(2.5rem, 1rem + 4vw, 5rem);
  --text-hero: clamp(3rem, 0.5rem + 7vw, 8rem);

  /* Spacing */
  --space-1: 0.25rem;  --space-2: 0.5rem;  --space-3: 0.75rem;
  --space-4: 1rem;     --space-5: 1.25rem; --space-6: 1.5rem;
  --space-8: 2rem;     --space-10: 2.5rem; --space-12: 3rem;
  --space-16: 4rem;    --space-20: 5rem;   --space-24: 6rem;
  --space-32: 8rem;

  /* Radius / transitions */
  --radius-sm: 0.25rem; --radius-md: 0.375rem; --radius-full: 9999px;
  --transition-interactive: 200ms cubic-bezier(0.16, 1, 0.3, 1);

  /* Content widths */
  --content-narrow: 680px;
  --content-default: 1000px;
  --content-wide: 1280px;

  /* Fonts */
  --font-display: 'Anton', 'Oswald', 'Arial Narrow', sans-serif;
  --font-serif: 'Fraunces', 'Georgia', serif;
  --font-body: 'Inter', 'Helvetica Neue', sans-serif;
  --font-mono: 'IBM Plex Mono', 'Courier New', monospace;

  /* Brand constants (mode-independent) */
  --oxblood: #7A1F1F;
  --oxblood-bright: #9A2A2A;
  --brass: #B8902F;
  --brass-bright: #D0A847;
}

/* ---- LIGHT MODE (bone) ---- */
:root, [data-theme="light"] {
  --color-bg: #F4EFE6;
  --color-surface: #FBF7EF;
  --color-surface-2: #EFE8DA;
  --color-text: #1A1814;
  --color-text-muted: #6B6760;
  --color-border: #D8CFBE;
  --color-primary: var(--oxblood);
  --color-primary-hover: #621818;
  --color-secondary: var(--brass);
  --color-on-dark: #E8E2D5;
  --shadow-md: 0 6px 24px rgba(26,24,20,0.10);
  --shadow-lg: 0 18px 50px rgba(26,24,20,0.16);
}

/* ---- DARK MODE (charcoal) ---- */
[data-theme="dark"] {
  --color-bg: #0E0E0C;
  --color-surface: #161513;
  --color-surface-2: #1E1C19;
  --color-text: #E8E2D5;
  --color-text-muted: #807A6E;
  --color-border: #2A2824;
  --color-primary: #9A2A2A;
  --color-primary-hover: #B83333;
  --color-secondary: #C39A38;
  --color-on-dark: #E8E2D5;
  --shadow-md: 0 6px 24px rgba(0,0,0,0.5);
  --shadow-lg: 0 18px 50px rgba(0,0,0,0.6);
}

@media (prefers-color-scheme: light) {
  :root:not([data-theme]) {
    --color-bg: #F4EFE6; --color-surface: #FBF7EF; --color-surface-2: #EFE8DA;
    --color-text: #1A1814; --color-text-muted: #6B6760; --color-border: #D8CFBE;
    --color-primary: #7A1F1F;
  }
}

/* ============================================================
   BASE
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

/* Single source of truth for anchor-link offsets.
   Header is 4.75rem (76px). Breathing room of ~20px keeps the heading off the
   header underline. Bump this one value if header height ever changes. */
:root { --scroll-offset: 6rem; }

html {
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility; scroll-behavior: smooth;
  scroll-padding-top: var(--scroll-offset);
}

/* Universal anchor-target rule: every id'd element auto-respects the header.
   Native hash navigation, JS scrollTo, and Tab focus all honour this. */
:where([id]) { scroll-margin-top: var(--scroll-offset); }

/* Explicit utility alias for v2 pages and anywhere we want intent visible. */
.anchor-target { scroll-margin-top: var(--scroll-offset); }

body {
  min-height: 100dvh;
  line-height: 1.6;
  font-family: var(--font-body);
  font-size: var(--text-base);
  color: var(--color-text);
  background: var(--color-bg);
  transition: background 300ms ease, color 300ms ease;
}

img, picture, video, svg { display: block; max-width: 100%; height: auto; }
ul[role="list"] { list-style: none; }
input, button, textarea, select { font: inherit; color: inherit; }
button { cursor: pointer; background: none; border: none; }
a { color: inherit; text-decoration: none; }

h1,h2,h3,h4 { line-height: 1.05; text-wrap: balance; }
p { text-wrap: pretty; }

::selection { background: var(--oxblood); color: #F4EFE6; }
:focus-visible { outline: 2px solid var(--color-secondary); outline-offset: 3px; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important; transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

a, button { transition: color var(--transition-interactive),
  background var(--transition-interactive), border-color var(--transition-interactive),
  opacity var(--transition-interactive), transform var(--transition-interactive); }

.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; }

/* ============================================================
   LAYOUT HELPERS
   ============================================================ */
.wrap { width: min(100% - 2.5rem, var(--content-wide)); margin-inline: auto; }
.wrap-narrow { width: min(100% - 2.5rem, var(--content-narrow)); margin-inline: auto; }
.wrap-default { width: min(100% - 2.5rem, var(--content-default)); margin-inline: auto; }
.section { padding-block: clamp(var(--space-16), 8vw, var(--space-32)); }
.section-sm { padding-block: clamp(var(--space-12), 5vw, var(--space-20)); }

.eyebrow {
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: var(--color-secondary);
  margin-bottom: var(--space-4);
}
.display {
  font-family: var(--font-display);
  text-transform: uppercase;
  letter-spacing: 0.01em;
  line-height: 0.92;
  font-weight: 400;
}
.serif { font-family: var(--font-serif); }
.mono { font-family: var(--font-mono); letter-spacing: 0.04em; }
.muted { color: var(--color-text-muted); }
.brass { color: var(--color-secondary); }
.oxblood { color: var(--color-primary); }

/* Brass hairline ornament */
.hairline {
  height: 1px; border: none;
  background: linear-gradient(90deg, transparent, var(--color-secondary), transparent);
  opacity: 0.6; margin-block: var(--space-8);
}

/* ============================================================
   BUTTONS
   ============================================================ */
.btn {
  display: inline-flex; align-items: center; gap: var(--space-2);
  font-family: var(--font-mono); font-size: var(--text-xs);
  letter-spacing: 0.18em; text-transform: uppercase; font-weight: 500;
  padding: 0.95rem 1.6rem; border-radius: var(--radius-sm);
  border: 1px solid transparent; white-space: nowrap;
}
.btn-primary { background: var(--color-primary); color: #F4EFE6; }
.btn-primary:hover { background: var(--color-primary-hover); transform: translateY(-2px); }
.btn-ghost { background: transparent; border-color: var(--color-text); color: var(--color-text); }
.btn-ghost:hover { background: var(--color-text); color: var(--color-bg); }
.btn-brass { background: transparent; border-color: var(--color-secondary); color: var(--color-secondary); }
.btn-brass:hover { background: var(--color-secondary); color: #0E0E0C; }

/* ============================================================
   HEADER
   ============================================================ */
.header {
  position: sticky; top: 0; z-index: 100;
  background: color-mix(in srgb, var(--color-bg) 88%, transparent);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--color-border);
}
.header-inner {
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--space-6); height: 4.75rem;
}
.logo { display: flex; align-items: center; color: var(--color-text); }
.logo svg { height: 34px; width: auto; }
.nav-links { display: flex; align-items: center; gap: var(--space-6); }
.nav-links a {
  font-size: var(--text-sm); font-weight: 500; letter-spacing: 0.02em;
  color: var(--color-text-muted); position: relative;
}
.nav-links a:hover, .nav-links a.active { color: var(--color-text); }
.nav-links a.active::after {
  content: ""; position: absolute; left: 0; bottom: -6px; width: 100%; height: 2px;
  background: var(--color-secondary);
}

/* Active-page nav: the current page is rendered as a <span class="nav-active"> not an <a>.
   No hover, no pointer, no reload. Strong brass underline + dot + brass tint = "you are here." */
.nav-links .nav-active {
  font-size: var(--text-sm); font-weight: 600; letter-spacing: 0.02em;
  color: var(--brass-bright); position: relative;
  cursor: default; padding-bottom: 4px;
}
.nav-links .nav-active::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -6px; height: 2px;
  background: var(--brass-bright); border-radius: 1px;
}
.nav-links .nav-active.brass { color: var(--brass-bright); }
.header-actions { display: flex; align-items: center; gap: var(--space-3); }
.theme-toggle {
  display: grid; place-items: center; width: 2.4rem; height: 2.4rem;
  border-radius: var(--radius-full); border: 1px solid var(--color-border);
  color: var(--color-text);
}
.theme-toggle:hover { border-color: var(--color-secondary); color: var(--color-secondary); }
.cta-pill {
  font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: 0.14em;
  text-transform: uppercase; background: var(--color-primary); color: #F4EFE6;
  padding: 0.7rem 1.15rem; border-radius: var(--radius-full); font-weight: 500;
}
.cta-pill:hover { background: var(--color-primary-hover); }
.nav-toggle { display: none; }

@media (max-width: 940px) {
  .nav-links {
    position: fixed; inset: 4.75rem 0 auto 0; flex-direction: column;
    background: var(--color-surface); border-bottom: 1px solid var(--color-border);
    padding: var(--space-5) 0 calc(20px + env(safe-area-inset-bottom, 0px));
    gap: 0; align-items: stretch;
    transform: translateY(-120%); transition: transform 300ms ease; z-index: 90;
  }
  .nav-links.open { transform: translateY(0); }
  /* Tap targets: 48px minimum (Android Material) / 44pt minimum (iOS HIG).
     Full-row width = block display, padding pushes the hit-area into the
     surrounding gray space that visually reads as tappable. */
  .nav-links a,
  .nav-links .nav-active {
    display: flex; align-items: center;
    min-height: 48px;
    padding: 12px var(--space-6);
    font-size: var(--text-lg);
    /* override the absolute-positioned underline used on desktop */
    width: 100%;
  }
  .nav-links a::after,
  .nav-links .nav-active::after { display: none; }
  .nav-links .nav-active {
    border-left: 3px solid var(--brass-bright);
    padding-left: calc(var(--space-6) - 3px);
  }
  .nav-toggle { display: grid; place-items: center; width: 2.75rem; height: 2.75rem;
    border: 1px solid var(--color-border); border-radius: var(--radius-sm); color: var(--color-text); }
  .cta-pill { display: none; }
  /* Push the bottom drop-list ribbon away from the open drawer so it never
     sits in the iOS bottom-gesture zone while the drawer is open. */
  .nav-links.open ~ .drop-list-ribbon,
  body:has(.nav-links.open) .drop-list-ribbon { transform: translateY(120%); }
}

/* ============================================================
   DROP STATUS BADGES
   ============================================================ */
.badge {
  display: inline-flex; align-items: center; gap: 0.5rem;
  font-family: var(--font-mono); font-size: var(--text-xs);
  letter-spacing: 0.12em; text-transform: uppercase; font-weight: 500;
  padding: 0.4rem 0.75rem; border-radius: var(--radius-sm);
  border: 1px solid currentColor;
}
.badge .dot { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.badge-live { color: var(--color-primary); }
.badge-live .dot { animation: pulse 1.8s ease-in-out infinite; }
.badge-preorder { color: var(--color-secondary); }
.badge-soldout { color: var(--color-text-muted); }
@keyframes pulse {
  0%,100% { opacity: 1; box-shadow: 0 0 0 0 currentColor; }
  50% { opacity: 0.5; box-shadow: 0 0 0 4px transparent; }
}

/* ============================================================
   FOOTER
   ============================================================ */
.footer { background: var(--color-surface); border-top: 1px solid var(--color-border); }
.footer-cta {
  display: grid; grid-template-columns: repeat(3, 1fr);
  border-bottom: 1px solid var(--color-border);
}
.footer-cta a {
  padding: clamp(var(--space-10), 6vw, var(--space-24)) var(--space-6);
  text-align: center; border-right: 1px solid var(--color-border);
  display: flex; flex-direction: column; gap: var(--space-2); align-items: center;
}
.footer-cta a:last-child { border-right: none; }
.footer-cta a:hover { background: var(--color-surface-2); }
.footer-cta .label { font-family: var(--font-display); font-size: var(--text-2xl); }
.footer-cta a:hover .label { color: var(--color-secondary); }
.footer-cta .sub { font-size: var(--text-sm); color: var(--color-text-muted); }
.footer-main {
  display: grid; grid-template-columns: 1.4fr 1fr 1.2fr; gap: var(--space-10);
  padding-block: var(--space-16);
}
.footer-col h4 { font-family: var(--font-mono); font-size: var(--text-xs);
  letter-spacing: 0.18em; text-transform: uppercase; color: var(--color-secondary); margin-bottom: var(--space-5); }
.footer-col ul { list-style: none; display: flex; flex-direction: column; gap: var(--space-3); }
.footer-col a { font-size: var(--text-sm); color: var(--color-text-muted); }
.footer-col a:hover { color: var(--color-text); }
.footer-signup { display: flex; gap: var(--space-2); margin-top: var(--space-4); flex-wrap: wrap; }
.footer-signup input {
  flex: 1; min-width: 0; padding: 0.7rem 0.9rem; background: var(--color-bg);
  border: 1px solid var(--color-border); border-radius: var(--radius-sm);
  font-size: var(--text-sm); color: var(--color-text);
}
.footer-signup input:focus { outline: none; border-color: var(--color-secondary); }
.footer-bottom {
  border-top: 1px solid var(--color-border); padding-block: var(--space-6);
  display: flex; justify-content: space-between; gap: var(--space-4); flex-wrap: wrap;
  font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--color-text-muted);
}
.footer-tagline { color: var(--color-secondary); }

@media (max-width: 760px) {
  .footer-cta { grid-template-columns: 1fr; }
  .footer-cta a { border-right: none; border-bottom: 1px solid var(--color-border); }
  .footer-main { grid-template-columns: 1fr; gap: var(--space-10); }
}

/* ============================================================
   REVEAL ON SCROLL
   ============================================================ */
.reveal { opacity: 0; transform: translateY(24px); transition: opacity 700ms ease, transform 700ms ease; }
.reveal.in { opacity: 1; transform: none; }

/* ============================================================
   HERO (shared editorial)
   ============================================================ */
.hero {
  position: relative; min-height: 88vh; display: flex; align-items: flex-end;
  color: #E8E2D5; overflow: hidden;
}
.hero-bg { position: absolute; inset: 0; z-index: -2; }
.hero-bg img { width: 100%; height: 100%; object-fit: cover; }
.hero-bg::after {
  content: ""; position: absolute; inset: 0;
  /* Editorial film-burn vignette. Dark on text side, breathing space around face. */
  background:
    radial-gradient(ellipse 70% 80% at 68% 50%, rgba(0,0,0,0) 0%, rgba(8,7,6,0.45) 55%, rgba(8,7,6,0.92) 100%),
    linear-gradient(90deg, rgba(6,5,4,0.97) 0%, rgba(8,7,6,0.92) 28%, rgba(10,9,8,0.6) 46%, rgba(12,11,9,0.25) 65%, rgba(12,11,9,0.15) 100%);
}
/* Hero vignette: layered atmosphere - subtle film grain feel via second pseudo */
.hero-vignette {
  position: absolute; inset: 0; pointer-events: none; z-index: -1;
  background:
    radial-gradient(circle at 50% 100%, rgba(0,0,0,0.55), transparent 60%),
    radial-gradient(circle at 50% 0%, rgba(0,0,0,0.4), transparent 55%);
  mix-blend-mode: multiply;
}
/* Hero column: editorial profile layout. Left-anchored on desktop, full-bleed mobile. */
.hero-inner {
  position: relative;
  padding-block: clamp(var(--space-16), 8vw, var(--space-24));
  max-width: 52rem;
}
@media (min-width: 1100px) {
  .hero { align-items: center; min-height: 92vh; }
  .hero-inner {
    margin-inline: 0;
    margin-left: clamp(3rem, 7vw, 7rem);
    padding-left: clamp(1.75rem, 2.5vw, 2.75rem);
    width: 100%;
    max-width: 36rem;
  }
}
@media (min-width: 1600px) {
  .hero-inner { margin-left: clamp(5rem, 9vw, 11rem); max-width: 38rem; }
}

/* ===== HERO PROFILE TREATMENT (v19) =================================================
   Magazine-cover layout. "His father quit. He didn't." sentence-case display.
   Vertical spine eyebrow. Quiet brass proof. Hard-cornered CTA.
===================================================================================== */

/* Vertical spine eyebrow - desktop only, left edge of text column */
.hero-spine {
  display: none;
  position: absolute;
  left: 0; top: 50%;
  transform: rotate(-90deg) translateX(50%);
  transform-origin: left center;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 0.66rem;
  letter-spacing: 0.35em;
  text-transform: uppercase;
  color: #B8942A;
  white-space: nowrap;
  opacity: 0.85;
}
@media (min-width: 1100px) {
  .hero-spine { display: block; }
}

/* Kicker: 90 Proof Wisdom brand line above the H1 */
.hero-kicker {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 0.78rem;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: #B8942A;
  margin: 0 0 var(--space-6);
  font-weight: 500;
}
.hero-kicker::before {
  content: "";
  display: inline-block;
  width: 24px;
  height: 1px;
  background: #B8942A;
  vertical-align: middle;
  margin-right: 0.75rem;
  margin-bottom: 0.18em;
}

/* H1: sentence case at display scale. Two lines, second line italic serif for the turn. */
.hero-h1 {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: clamp(3.25rem, 6.8vw, 6.5rem);
  line-height: 0.95;
  letter-spacing: -0.015em;
  color: #F5EFE2;
  margin: 0;
  max-width: 14ch;
  text-transform: none;
}
.hero-h1-line1, .hero-h1-line2 { display: block; }
.hero-h1-line2 {
  font-family: var(--font-serif, 'Playfair Display', serif);
  font-style: italic;
  font-weight: 500;
  color: #C9A572;
  margin-top: 0.1em;
  letter-spacing: -0.005em;
}
@media (min-width: 1100px) {
  .hero-h1 { font-size: clamp(4.5rem, 6.5vw, 7rem); }
}

/* Proof line: quiet brass fact, sits just below H1 with breath. */
.hero-proof-quiet {
  font-family: var(--font-body);
  font-size: clamp(0.92rem, 1.05vw, 1.1rem);
  letter-spacing: 0.02em;
  color: #B8942A;
  margin: var(--space-8) 0 0;
  max-width: 38ch;
  font-weight: 500;
}

/* CTA: hard-cornered, operator not startup */
.hero-btn-primary {
  padding: 1.1rem 2.25rem;
  font-size: 0.88rem;
  letter-spacing: 0.16em;
  border-radius: 2px;
  background: #A0282A;
  color: #FFFFFF;
  text-transform: uppercase;
  font-weight: 700;
  box-shadow: 0 14px 36px rgba(160, 40, 42, 0.4), 0 0 0 1px rgba(255,255,255,0.05) inset;
  border: none;
  display: inline-block;
  text-decoration: none;
  transition: transform 200ms ease, background 200ms ease;
}
.hero-btn-primary:hover, .hero-btn-primary:focus-visible {
  background: #B73032;
  transform: translateY(-1px);
}
.hero-ctas { display: flex; gap: var(--space-3); margin-top: var(--space-8); flex-wrap: wrap; }
@media (max-width: 760px) {
  .hero-btn-primary { width: 100%; padding: 1.2rem 1.5rem; }
  .hero-ctas { width: 100%; }
}

/* Scarcity line: brass mono, just below CTA, no animation circus */
.hero-scarcity-line {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  margin-top: var(--space-5);
  font-family: 'IBM Plex Mono', monospace;
  font-size: 0.74rem;
  letter-spacing: 0.14em;
  color: #B8942A;
  text-transform: uppercase;
  font-weight: 500;
}

/* H1 is the AEO/entity sentence. readable, scannable, NOT a giant display unit.
   Jeremy's name is the display unit; the tagline is small-caps subhead. */
.hero h1 {
  font-family: var(--font-display);
  text-transform: uppercase;
  letter-spacing: 0.035em;
  font-weight: 400;
  font-size: clamp(3.25rem, 6.2vw, 6.5rem);
  line-height: 0.98;
  max-width: 14ch;
  margin: var(--space-5) 0 0;
  word-spacing: 0.06em;
  color: #F2ECDF;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
.hero h1 .h1-dash { color: var(--brass-bright); font-weight: 400; letter-spacing: 0; }
.hero h1 .h1-tag {
  display: block;
  font-family: var(--font-body);
  font-weight: 600;
  font-size: clamp(0.9rem, 0.95vw, 1.1rem);
  letter-spacing: 0.14em;
  color: #D8CFBE;
  margin-top: var(--space-4);
  line-height: 1.4;
  text-transform: uppercase;
}

/* Hero hook line. AEO/SEO-rich positioning, sized to NOT fight the tee text in the portrait */
.hero .hero-hook {
  font-family: var(--font-serif);
  font-size: clamp(1.2rem, 1.65vw, 1.6rem);
  line-height: 1.35;
  letter-spacing: 0;
  color: #D8D0BE;
  margin-top: var(--space-5);
  max-width: 28ch;
  font-style: italic;
  font-weight: 400;
}
.hero .hero-hook strong { color: var(--brass-bright); font-weight: 600; }
.hero .hero-tee-credit {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  color: #A8A095;
  margin-top: var(--space-4);
  letter-spacing: 0.02em;
}
.hero .hero-tee-credit em { color: #C8BFAF; font-style: italic; }
/* Legacy hero-quote rules retained as no-op below for any cached references */
.hero .hero-quote {
  display: none;
  margin-top: var(--space-6);
  max-width: 16ch;
  text-transform: uppercase;
  font-weight: 700;
}

.hero .hero-sub {
  font-family: var(--font-serif);
  font-size: var(--text-lg);
  color: #D8CFBE;
  margin-top: var(--space-6);
  max-width: 42ch;
  font-style: italic;
}

/* Desktop: keep entire hero column in left negative space, never cross portrait */
@media (min-width: 1100px) {
  .hero-inner { max-width: 42rem; }
  .hero h1 { font-size: clamp(4rem, 5.4vw, 6.25rem); max-width: 14ch; }
  .hero .hero-quote { display: none; }
  .hero .hero-hook { font-size: clamp(1.25rem, 1.4vw, 1.55rem); max-width: 30ch; }
  .hero .hero-sub { max-width: 38ch; }
}
@media (min-width: 1600px) {
  .hero-inner { max-width: 44rem; }
  .hero .hero-quote { display: none; }
  .hero .hero-hook { font-size: clamp(1.35rem, 1.3vw, 1.7rem); max-width: 32ch; }
}
.hero-ctas { display: flex; gap: var(--space-3); margin-top: var(--space-8); flex-wrap: wrap; }
.hero-btn-primary {
  padding: 1.05rem 2.1rem;
  font-size: 0.95rem;
  letter-spacing: 0.14em;
  box-shadow: 0 14px 36px rgba(160, 40, 42, 0.35), 0 0 0 1px rgba(255,255,255,0.04) inset;
}
@media (max-width: 760px) {
  .hero-btn-primary { width: 100%; padding: 1.15rem 1.5rem; }
  .hero-ctas { width: 100%; }
}

/* Stat strip */
.statstrip { background: #0E0E0C; color: #E8E2D5; border-block: 1px solid #2A2824; }
.statstrip-grid { display: grid; grid-template-columns: repeat(5, 1fr); }
.stat { padding: var(--space-10) var(--space-6); text-align: center; border-right: 1px solid #2A2824; }
.stat:last-child { border-right: none; }
.stat .num { font-family: var(--font-display); font-size: var(--text-xl); color: var(--brass-bright); }
.stat .lbl { font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: 0.14em;
  text-transform: uppercase; color: #807A6E; margin-top: var(--space-2); }
@media (max-width: 760px) {
  .statstrip-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 600px) {
  .statstrip-grid { grid-template-columns: 1fr; }
  .stat:nth-child(odd) { border-right: 1px solid #2A2824; }
  .stat:nth-child(1), .stat:nth-child(2) { border-bottom: 1px solid #2A2824; }
}
.statstrip-sub {
  text-align: center;
  max-width: 64rem;
  margin: 0 auto;
  padding: 0 var(--space-6) var(--space-8);
  font-family: var(--font-serif);
  font-style: italic;
  font-size: var(--text-md);
  color: #B6AE9E;
  line-height: 1.6;
}
.statstrip-sub em { font-style: normal; color: var(--brass-bright); font-family: var(--font-serif); }

/* ============================================================
   PRODUCT CARDS / GRIDS
   ============================================================ */
.grid { display: grid; gap: var(--space-6); }
.cols-2 { grid-template-columns: repeat(2, 1fr); }
.cols-3 { grid-template-columns: repeat(3, 1fr); }
.cols-4 { grid-template-columns: repeat(4, 1fr); }

.card {
  background: var(--color-surface); border: 1px solid var(--color-border);
  border-radius: var(--radius-md); overflow: hidden; display: flex; flex-direction: column;
}
.card:hover { border-color: var(--color-secondary); }
.card-media { aspect-ratio: 4/5; overflow: hidden; background: var(--color-surface-2); position: relative; }
.card-media img { width: 100%; height: 100%; object-fit: cover; transition: transform 600ms ease; }
.card:hover .card-media img { transform: scale(1.05); }
/* Sold-out (non-clickable) article cards: no hover affordance. */
article.card:has(.badge-soldout):hover { border-color: var(--color-border); cursor: default; }
article.card:has(.badge-soldout):hover .card-media img { transform: none; }

.card-badge { position: absolute; top: var(--space-3); left: var(--space-3); background: color-mix(in srgb, var(--color-bg) 80%, transparent); backdrop-filter: blur(6px); }
.card-body { padding: var(--space-5); display: flex; flex-direction: column; gap: var(--space-2); flex: 1; }
.card-name { font-family: var(--font-body); font-weight: 600; font-size: var(--text-base); }
.card-meta { font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--color-text-muted); }
.card-price { font-family: var(--font-mono); font-size: var(--text-sm); color: var(--color-secondary); margin-top: auto; }

@media (max-width: 980px) { .cols-4 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 760px) {
  .cols-3, .cols-2 { grid-template-columns: 1fr; }
  .cols-4 { grid-template-columns: repeat(2, 1fr); }
}

/* Section headers */
.sec-head { display: flex; justify-content: space-between; align-items: flex-end;
  gap: var(--space-6); margin-bottom: var(--space-10); flex-wrap: wrap; }
.sec-head h2 { font-family: var(--font-display); font-size: var(--text-2xl); text-transform: uppercase; }
.sec-link { font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--color-secondary); }
.sec-link:hover { color: var(--color-text); }

/* Horizontal scroll strip */
.hscroll { display: flex; gap: var(--space-4); overflow-x: auto; padding-bottom: var(--space-4);
  scroll-snap-type: x mandatory; scrollbar-width: thin; }
.hscroll > * { scroll-snap-align: start; flex: 0 0 auto; }

/* ============================================================
   ABOUT. prose + timeline
   ============================================================ */
.prose h3 { font-family: var(--font-display); font-size: var(--text-xl); text-transform: uppercase;
  color: var(--color-secondary); margin-top: var(--space-12); margin-bottom: var(--space-4); }
.prose h3:first-child { margin-top: 0; }
.prose p { font-family: var(--font-serif); font-size: var(--text-lg); line-height: 1.8;
  margin-bottom: var(--space-5); max-width: 68ch; }
.prose strong { color: var(--color-text); font-weight: 600; }

.dropcap::first-letter {
  font-family: var(--font-display); float: left; font-size: 4.6em; line-height: 0.72;
  padding: 0.06em 0.12em 0 0; color: var(--color-primary);
}

.timeline { display: flex; gap: var(--space-6); overflow-x: auto; padding-bottom: var(--space-6);
  scroll-snap-type: x mandatory; }
.tl-node { flex: 0 0 240px; scroll-snap-align: start; border-top: 2px solid var(--color-secondary);
  padding-top: var(--space-4); position: relative; }
.tl-node::before { content: ""; position: absolute; top: -6px; left: 0; width: 10px; height: 10px;
  border-radius: 50%; background: var(--color-primary); }
.tl-year { font-family: var(--font-display); font-size: var(--text-xl); }
.tl-text { font-size: var(--text-sm); color: var(--color-text-muted); margin-top: var(--space-2); }
@media (max-width: 760px) {
  .timeline { flex-direction: column; gap: var(--space-5); }
  .tl-node { flex: 1 1 auto; border-top: none; border-left: 2px solid var(--color-secondary);
    padding-top: 0; padding-left: var(--space-5); }
  .tl-node::before { top: 0; left: -6px; }
}

.feature-card { display: block; border: 1px solid var(--color-border); border-radius: var(--radius-md);
  padding: var(--space-6); background: var(--color-surface); height: 100%; }
.feature-card:hover { border-color: var(--color-secondary); }
.feature-card .kicker { font-family: var(--font-mono); font-size: var(--text-xs);
  letter-spacing: 0.16em; text-transform: uppercase; color: var(--color-secondary); }
.feature-card h3 { font-family: var(--font-serif); font-size: var(--text-lg); font-style: italic;
  margin-block: var(--space-3); }

/* ============================================================
   SHOP / PDP. utility spec-sheet
   ============================================================ */
.trustbar { border-block: 1px solid var(--color-border); background: var(--color-surface); }
.trustbar-grid { display: grid; grid-template-columns: repeat(5, 1fr); }
.trust { padding: var(--space-6) var(--space-4); text-align: center; border-right: 1px solid var(--color-border);
  font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--color-text-muted); display: flex; flex-direction: column; gap: var(--space-2); align-items: center; }
.trust:last-child { border-right: none; }
.trust svg { width: 22px; height: 22px; color: var(--color-secondary); }
@media (max-width: 900px) { .trustbar-grid { grid-template-columns: repeat(2, 1fr); }
  .trust { border-bottom: 1px solid var(--color-border); }
  .trust:nth-child(odd) { border-right: 1px solid var(--color-border); } }

.dropstrip { background: #0E0E0C; color: #E8E2D5; padding-block: var(--space-6); border-block: 1px solid var(--oxblood); }
.dropstrip-inner { display: flex; align-items: center; justify-content: center; gap: var(--space-5);
  flex-wrap: wrap; font-family: var(--font-mono); font-size: var(--text-sm); letter-spacing: 0.12em;
  text-transform: uppercase; }
.dropstrip .sep { color: var(--brass); }
.dropstrip .countdown { color: var(--brass-bright); }

.collection-tile { position: relative; overflow: hidden; border-radius: var(--radius-md);
  min-height: 320px; display: flex; align-items: flex-end; color: #E8E2D5; border: 1px solid var(--color-border); }
.collection-tile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
  transition: transform 600ms ease; }
.collection-tile::after { content: ""; position: absolute; inset: 0;
  background: linear-gradient(0deg, rgba(14,14,12,0.92), rgba(14,14,12,0.1)); }
.collection-tile:hover img { transform: scale(1.05); }
.collection-tile .tile-body { position: relative; padding: var(--space-6); z-index: 1; }
.collection-tile h3 { font-family: var(--font-display); font-size: var(--text-xl); text-transform: uppercase; }
.collection-tile .tile-meta { font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--brass-bright); margin-bottom: var(--space-2); }
.collection-tile.feature { grid-column: span 2; min-height: 360px; }
@media (max-width: 760px) { .collection-tile.feature { grid-column: span 1; } }

.policy-band { background: var(--color-primary); color: #F4EFE6; text-align: center; }
.policy-band p { font-family: var(--font-mono); font-size: var(--text-sm); letter-spacing: 0.14em;
  text-transform: uppercase; max-width: 60ch; margin-inline: auto; line-height: 1.8; }

/* PDP */
.pdp { display: grid; grid-template-columns: 1.15fr 1fr; gap: clamp(2rem,4vw,4rem); align-items: start; }
@media (max-width: 900px) { .pdp { grid-template-columns: 1fr; } }
.pdp-gallery { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-3); }
.pdp-gallery .lead { grid-column: span 2; }
.pdp-gallery img { width: 100%; border: 1px solid var(--color-border); border-radius: var(--radius-md);
  background: var(--color-surface); }
.pdp-info { position: sticky; top: 6rem; }
@media (max-width: 900px) { .pdp-info { position: static; } }
.pdp-info h1 { font-family: var(--font-display); font-size: var(--text-2xl); text-transform: uppercase; margin-block: var(--space-3) var(--space-2); }
.pdp-price { font-family: var(--font-mono); font-size: var(--text-xl); color: var(--color-secondary); }
.size-row { display: flex; gap: var(--space-2); flex-wrap: wrap; margin-block: var(--space-5); }
.size-row button { font-family: var(--font-mono); font-size: var(--text-sm); padding: 0.6rem 1rem;
  border: 1px solid var(--color-border); border-radius: var(--radius-sm); min-width: 3rem; color: var(--color-text); }
.size-row button:hover { border-color: var(--color-secondary); }
.size-row button[data-selected] { background: var(--color-text); color: var(--color-bg); border-color: var(--color-text); }
.spec-table { width: 100%; border-top: 1px solid var(--color-secondary); margin-top: var(--space-8); }
.spec-table tr { border-bottom: 1px solid var(--color-border); }
.spec-table th, .spec-table td { text-align: left; padding: 0.85rem 0; font-family: var(--font-mono);
  font-size: var(--text-xs); letter-spacing: 0.08em; vertical-align: top; }
.spec-table th { color: var(--color-secondary); text-transform: uppercase; width: 38%; font-weight: 500; }
.spec-table td { color: var(--color-text); }
.care-card { margin-top: var(--space-6); border: 1px dashed var(--color-secondary); border-radius: var(--radius-md);
  padding: var(--space-5); font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--color-text-muted); text-align: center; }
.restock-link { display: inline-block; margin-top: var(--space-4); font-family: var(--font-mono);
  font-size: var(--text-xs); letter-spacing: 0.12em; text-transform: uppercase; color: var(--color-secondary);
  border-bottom: 1px solid currentColor; }

.colorway-chips { display: grid; grid-template-columns: repeat(5, 1fr); gap: var(--space-3); }
@media (max-width: 760px) { .colorway-chips { grid-template-columns: repeat(2, 1fr); } }


/* ============================================================
   LOGO TREATMENTS (v1.1. real brand marks)
   ============================================================ */

/* --- Header / footer JGB shield (white-on-black source) --- */
.logo-shield { display: block; width: auto; }
.logo-shield-head { height: 40px; }
.logo-shield-foot { height: 64px; }
/* Dark mode: black bg blends into charcoal via lighten blend. Light mode: invert to render
   the mark black-on-bone so the black source square doesn't sit as a hard block. */
.logo-shield { mix-blend-mode: lighten; }
[data-theme="light"] .logo-shield { mix-blend-mode: normal; filter: invert(1); }
@media (prefers-color-scheme: light) { :root:not([data-theme]) .logo-shield { mix-blend-mode: normal; filter: invert(1); } }
/* gold underline hairline detail carried over from the original mark */
.logo-shield-wrap { display: inline-flex; flex-direction: column; align-items: center; gap: 5px; }
.logo-shield-wrap::after { content: ""; display: block; width: 100%; height: 1.4px;
  background: var(--color-secondary); opacity: 0.85; }

/* --- Generic logo chips --- */
.logo-chip { display: inline-flex; align-items: center; justify-content: center;
  border-radius: var(--radius-md); overflow: hidden; }
.logo-chip img { display: block; width: auto; }
.logo-chip-white { background: #FBFAF7; padding: 12px 16px; }
.logo-chip-dark { background: #0E0E0C; padding: 12px 16px; border: 1px solid #2A2824; }

/* --- Ventures grid logo bar above photo --- */
.venture-logobar { display: flex; align-items: center; justify-content: center;
  min-height: 64px; padding: var(--space-4) var(--space-5); border-bottom: 1px solid var(--color-border); }
.venture-logobar.bg-white { background: #FBFAF7; }
.venture-logobar.bg-dark  { background: #0E0E0C; }
[data-theme="light"] .venture-logobar.bg-dark { border-bottom-color: #2A2824; }
.venture-logobar img { max-height: 30px; width: auto; object-fit: contain; }
.venture-logobar.tall img { max-height: 42px; }
.venture-logobar.type-mark { font-family: var(--font-display); text-transform: uppercase;
  letter-spacing: 0.04em; font-size: var(--text-lg); color: var(--color-text); }

/* --- Hero trust row --- */
.trust-row { display: flex; align-items: center; justify-content: center; flex-wrap: wrap;
  gap: var(--space-5) var(--space-6); margin-top: var(--space-8); }
.trust-row .ceo-chip { background: #FBFAF7; border-radius: var(--radius-md); padding: 10px 14px;
  display: inline-flex; align-items: center; box-shadow: var(--shadow-md); }
.trust-row .ceo-chip img { height: 40px; width: auto; display: block; }
.trust-mark { font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: 0.14em;
  text-transform: uppercase; color: #D8CFBE; padding-left: var(--space-6);
  border-left: 1px solid rgba(195,154,56,0.45); }
@media (max-width: 680px) { .trust-mark { border-left: none; padding-left: 0; } }

/* --- Podcast featured artwork --- */
.podcast-feature { display: grid; grid-template-columns: minmax(0, 460px) 1fr;
  gap: clamp(2rem, 5vw, 4rem); align-items: center; margin-top: var(--space-12); }
@media (max-width: 900px) { .podcast-feature { grid-template-columns: 1fr; } }
.podcast-art { width: 100%; max-width: 460px; border-radius: var(--radius-md);
  border: 1px solid #2A2824; box-shadow: 0 24px 60px rgba(0,0,0,0.5); }
[data-theme="light"] .podcast-art { border-color: var(--color-border); }
.podcast-seal-watermark { position: absolute; bottom: var(--space-8); right: var(--space-8);
  width: 80px; height: 80px; opacity: 0.15; z-index: 0; pointer-events: none; mix-blend-mode: screen; }
[data-theme="light"] .podcast-seal-watermark { mix-blend-mode: multiply; opacity: 0.12; }
.ep-thumb { width: 56px; height: 56px; flex: 0 0 56px; border-radius: var(--radius-full);
  background: #0E0E0C; border: 1px solid #2A2824; display: grid; place-items: center; overflow: hidden; }
.ep-thumb img { width: 100%; height: 100%; object-fit: cover; }
[data-theme="light"] .ep-thumb { border-color: var(--color-border); }
.ep-head { display: flex; align-items: center; gap: var(--space-3); margin-bottom: var(--space-2); }

/* --- Media wall --- */
.media-wall { display: grid; grid-template-columns: repeat(6, 1fr); gap: 1px;
  background: var(--color-border); border: 1px solid var(--color-border);
  border-radius: var(--radius-md); overflow: hidden; }
.media-cell { background: var(--color-surface); display: flex; align-items: center;
  justify-content: center; padding: var(--space-8) var(--space-5); min-height: 110px; text-align: center; }
.media-cell .outlet { font-family: var(--font-display); text-transform: uppercase;
  letter-spacing: 0.04em; font-size: var(--text-lg); line-height: 1.05; color: var(--color-text-muted); }
@media (max-width: 760px) { .media-wall { grid-template-columns: repeat(2, 1fr); } }
/* CEO badge centerpiece above the outlet row */
.media-ceo { display: flex; justify-content: center; margin-bottom: var(--space-8); }
.media-ceo-chip { background: #FBFAF7; border-radius: var(--radius-md); padding: var(--space-5) var(--space-8);
  display: inline-flex; align-items: center; box-shadow: var(--shadow-md); }
.media-ceo-chip img { max-height: 72px; width: auto; display: block; }

/* --- About: CEO badge chips --- */
.about-trust-chip { display: inline-flex; align-items: center; gap: var(--space-3);
  background: #FBFAF7; border-radius: var(--radius-md); padding: 8px 14px;
  margin-top: var(--space-6); box-shadow: var(--shadow-md); }
.about-trust-chip img { height: 38px; width: auto; display: block; }
.tl-badge { margin-top: var(--space-3); background: #FBFAF7; border-radius: var(--radius-sm);
  padding: 6px 8px; display: inline-flex; }
.tl-badge img { height: 56px; width: auto; display: block; }

/* --- Shop: 90 Proof collection tile seal --- */
.collection-tile .tile-seal { position: absolute; inset: 18px 18px auto auto;
  top: 18px; right: 18px; bottom: auto; left: auto;
  width: 64px; height: 64px; z-index: 2; border-radius: var(--radius-full);
  object-fit: cover; border: 1px solid rgba(195,154,56,0.55);
  box-shadow: 0 8px 22px rgba(0,0,0,0.6); transform: none; }

/* --- PDP: shield + seal accents --- */
.lead-wrap { position: relative; grid-column: span 2; }
.lead-wrap img { width: 100%; border: 1px solid var(--color-border); border-radius: var(--radius-md);
  background: var(--color-surface); display: block; }
.pdp-shield-chip { position: absolute; bottom: 14px; left: 14px; z-index: 2;
  width: 52px; height: 52px; border-radius: var(--radius-sm); overflow: hidden;
  border: 1px solid rgba(195,154,56,0.5); box-shadow: 0 6px 18px rgba(0,0,0,0.55);
  background: #0E0E0C; pointer-events: none; }
.pdp-shield-chip img { width: 100%; height: 100%; object-fit: contain; display: block; }
.story-seal { position: absolute; top: var(--space-8); right: var(--space-8); width: 80px; height: 80px;
  opacity: 0.18; mix-blend-mode: screen; z-index: 0; pointer-events: none; }

/* square brand marks (BCG) need more vertical room to read */
.venture-logobar.square { min-height: 110px; padding: var(--space-3); }
.venture-logobar.square img { max-height: 96px; }

/* ============================================================
   v1.2. Real portrait caption, author lineup, ThriveAxis, press wall
   ============================================================ */

/* --- About hero portrait caption --- */
.portrait-caption {
  margin-top: var(--space-5);
  font-family: var(--font-mono); font-size: var(--text-xs);
  letter-spacing: 0.18em; text-transform: uppercase; color: #D8CFBE;
  display: inline-flex; align-items: center; gap: var(--space-3);
}
.portrait-caption::before {
  content: ""; width: 26px; height: 1.4px; background: var(--color-secondary); opacity: 0.85;
}

/* --- READ. Author lineup --- */
.author-lineup { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-8); }
@media (max-width: 900px) { .author-lineup { grid-template-columns: 1fr; max-width: 360px; margin-inline: auto; } }
.book-card { display: flex; flex-direction: column; gap: var(--space-5); }
.book-card .cover-frame {
  position: relative; aspect-ratio: 2/3; border-radius: var(--radius-sm); overflow: hidden;
  box-shadow: 0 22px 56px rgba(0,0,0,0.5); border: 1px solid var(--color-border);
}
.book-card .cover-frame img { width: 100%; height: 100%; object-fit: cover; }
/* CSS typeset placeholder covers */
.cover-typeset {
  position: relative; aspect-ratio: 2/3; border-radius: var(--radius-sm); overflow: hidden;
  display: flex; flex-direction: column; justify-content: space-between;
  padding: var(--space-8) var(--space-6); box-shadow: 0 22px 56px rgba(0,0,0,0.5);
  border: 1px solid rgba(195,154,56,0.35);
}
.cover-typeset.oxblood-cover { background: linear-gradient(160deg, #7A1F1F 0%, #5A1616 100%); color: #F4EDE0; }
.cover-typeset.charcoal-cover { background: linear-gradient(160deg, #1F1E1B 0%, #0E0E0C 100%); color: #F4EDE0; }
.cover-typeset .cv-eyebrow {
  font-family: var(--font-display); text-transform: uppercase; letter-spacing: 0.22em;
  font-size: var(--text-xs); color: var(--brass-bright);
}
.cover-typeset .cv-title {
  font-family: var(--font-serif); font-style: italic; font-weight: 500;
  font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.2rem); line-height: 1.04;
}
.cover-typeset .cv-rule { height: 1.4px; background: var(--brass); opacity: 0.7; width: 60%; margin-block: var(--space-4); }
.cover-typeset .cv-author {
  font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: 0.16em;
  text-transform: uppercase; color: rgba(244,237,224,0.72);
}
.book-card .bk-status {
  font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--color-secondary);
  display: inline-flex; align-items: center; gap: var(--space-2);
}
.book-card .bk-status.forthcoming { color: var(--color-text-muted); }
.book-card .bk-name { font-family: var(--font-display); font-size: var(--text-xl); text-transform: uppercase; }
.book-card .bk-sub { font-family: var(--font-serif); font-style: italic; font-size: var(--text-base);
  color: var(--color-text-muted); }

/* --- ThriveAxis health & wellness band --- */
.thriveaxis-band { background: #F4EDE0; color: #1A1814; border-top: 3px solid var(--oxblood);
  padding-block: clamp(var(--space-16), 7vw, var(--space-24)); }
.thriveaxis-inner { display: grid; grid-template-columns: minmax(0, 0.85fr) 1.4fr;
  gap: clamp(2rem, 5vw, 4.5rem); align-items: center; }
@media (max-width: 860px) { .thriveaxis-inner { grid-template-columns: 1fr; gap: var(--space-10); } }
.thriveaxis-logo { background: #fff; border-radius: var(--radius-md); padding: var(--space-10) var(--space-8);
  box-shadow: 0 18px 48px rgba(26,24,20,0.16); display: flex; align-items: center; justify-content: center; }
.thriveaxis-logo img { max-width: 280px; width: 100%; height: auto; }
.thriveaxis-band .ta-label { font-family: var(--font-display); text-transform: uppercase;
  letter-spacing: 0.18em; font-size: var(--text-sm); color: var(--brass); }
.thriveaxis-band h2 { font-family: var(--font-serif); font-weight: 500; font-style: normal;
  font-size: clamp(1.9rem, 1.2rem + 2.4vw, 3rem); line-height: 1.05; margin-top: var(--space-4); color: #1A1814; }
.thriveaxis-band .ta-blurb { font-size: var(--text-base); line-height: 1.7; margin-top: var(--space-5);
  max-width: 56ch; color: #46423A; }
.thriveaxis-band .ta-position { font-family: var(--font-serif); font-style: italic; font-size: var(--text-base);
  margin-top: var(--space-5); max-width: 56ch; color: #6B6760; }
.ta-pills { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-8); }
.ta-pill { font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: 0.12em;
  text-transform: uppercase; padding: 0.5rem 1rem; border-radius: var(--radius-full);
  border: 1px solid var(--oxblood); color: var(--oxblood); background: rgba(122,31,31,0.04); }
.ta-foot { display: flex; align-items: center; gap: var(--space-6); flex-wrap: wrap; margin-top: var(--space-8); }
.ta-cta { font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: 0.16em;
  text-transform: uppercase; font-weight: 500; background: var(--oxblood); color: #F4EDE0;
  padding: 0.95rem 1.6rem; border-radius: var(--radius-sm); }
.ta-cta:hover { background: #621818; transform: translateY(-2px); }
.ta-tag { font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: 0.14em;
  text-transform: uppercase; color: #6B6760; }
.ta-audience { font-family: var(--font-serif); font-style: italic; font-size: var(--text-sm);
  color: #6B6760; margin-top: var(--space-4); }

/* --- Monochrome press wall --- */
.press-wall-band { background: #1A1A1A; color: #F4EDE0; }
.press-wall { display: flex; flex-wrap: wrap; align-items: center; justify-content: center;
  gap: clamp(var(--space-8), 5vw, var(--space-16)) clamp(var(--space-10), 6vw, var(--space-20));
  margin-top: var(--space-10); }
.press-wall img {
  max-height: 80px; max-width: 180px; width: auto; height: auto; object-fit: contain;
  filter: brightness(0) invert(1) opacity(0.85);
  transition: filter var(--transition-interactive), transform var(--transition-interactive);
}
.press-wall img:hover { filter: brightness(0) invert(1) opacity(1); transform: translateY(-2px); }
.press-recognition { text-align: center; margin-top: var(--space-12);
  font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: 0.14em;
  text-transform: uppercase; color: #807A6E; }
.press-recognition .sep { color: var(--brass); padding-inline: 0.4rem; }

/* --- Founder Fallout shop tile --- */
.collection-tile.book-tile { align-items: flex-end; background: #14130F; min-height: 420px; }
.collection-tile.book-tile::after { display: none; }
.book-tile .ff-cover-chip { position: absolute; inset: 0 0 38% 0; display: flex; align-items: center; justify-content: center;
  padding: var(--space-6) var(--space-6) 0; z-index: 0;
  background: radial-gradient(ellipse at center top, #232017 0%, #14130F 75%); }
.book-tile .ff-cover-chip img { position: static; width: auto; height: 100%; max-width: 62%; object-fit: contain;
  border-radius: 2px; box-shadow: 0 18px 44px rgba(0,0,0,0.7); border: 1px solid rgba(195,154,56,0.4); transform: none; }
.book-tile:hover .ff-cover-chip img { transform: scale(1.03); }
.book-tile .tile-body { position: relative; z-index: 1; width: 100%;
  background: linear-gradient(0deg, #14130F 62%, rgba(20,19,15,0.92) 88%, transparent); padding-top: var(--space-12); }
.book-tile .ff-price { font-family: var(--font-mono); font-size: var(--text-sm); color: var(--brass-bright);
  margin-top: var(--space-3); letter-spacing: 0.08em; }
.book-tile .card-badge { z-index: 2; }

/* ============ ON THE MIC. unified podcast + guest grid (v1.3) ============ */
.onmic { background: var(--color-bg); }
.onmic-head { text-align: center; max-width: 60ch; margin: 0 auto var(--space-12); }
.onmic-h2 { font-size: var(--text-2xl); line-height: 1.05; margin-top: var(--space-2); color: var(--color-text); }
.onmic-sub { font-family: var(--font-body); font-size: var(--text-sm); color: var(--color-text-muted);
  margin-top: var(--space-4); }

.onmic-grid {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: var(--space-6);
}

.mic-tile {
  display: flex; flex-direction: column;
  background: #1A1A1A; border-radius: 8px; overflow: hidden;
  text-decoration: none; color: inherit;
  border: 1px solid rgba(184,144,47,0.12);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.mic-tile:hover { transform: translateY(-4px); box-shadow: 0 12px 32px rgba(0,0,0,0.4); }

.mic-thumb { position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: #000; }
.mic-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }

.mic-badge {
  position: absolute; top: 0.625rem; left: 0.625rem;
  font-family: 'Bebas Neue', 'Anton', sans-serif;
  font-size: 0.75rem; letter-spacing: 0.1em; line-height: 1;
  padding: 0.25rem 0.625rem; border-radius: var(--radius-sm);
  z-index: 2;
}
.mic-badge.host { background: #7A1F1F; color: #F4EDE0; }
.mic-badge.guest { background: transparent; border: 1px solid #B8902F; color: #B8902F; }

.mic-play {
  position: absolute; inset: 0; margin: auto;
  width: 3.25rem; height: 3.25rem; display: flex; align-items: center; justify-content: center;
  font-size: 1.1rem; color: #F4EDE0;
  background: rgba(122,31,31,0.92); border-radius: var(--radius-full);
  opacity: 0; transform: scale(0.85); transition: opacity 0.2s ease, transform 0.2s ease;
  z-index: 2; pointer-events: none; padding-left: 3px;
}
.mic-tile:hover .mic-play { opacity: 1; transform: scale(1); }

.mic-body { padding: 1.25rem; display: flex; flex-direction: column; gap: 0.4rem; }
.mic-show {
  font-family: 'Bebas Neue', 'Anton', sans-serif;
  font-size: 0.75rem; letter-spacing: 0.12em; color: #B8902F;
}
.mic-title {
  font-family: var(--font-serif); font-size: 1.0625rem; line-height: 1.25;
  color: #F4EDE0; font-weight: 500;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.mic-with {
  font-family: var(--font-body); font-size: 0.75rem; letter-spacing: 0.08em;
  text-transform: uppercase; color: #8A8A8A; margin-top: 0.1rem;
}

.onmic-cta { text-align: center; margin-top: var(--space-12); }
.onmic-platforms {
  font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: 0.08em;
  color: var(--color-text-muted); margin-top: var(--space-4);
}

@media (max-width: 980px) {
  .onmic-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .onmic-grid { grid-template-columns: 1fr; }
}

/* ============================================================
   FORBES PULL QUOTE + MADE IN USA TRUST PANEL
   ============================================================ */
.forbes-block { padding-block: clamp(var(--space-16), 8vw, var(--space-24)); }
.forbes-grid {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: clamp(2rem, 5vw, 4.5rem);
  align-items: center;
}
.forbes-pullquote {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 500;
  font-size: clamp(1.65rem, 2.4vw, 2.6rem);
  line-height: 1.18;
  letter-spacing: -0.005em;
  color: #F2EBDA;
  margin: var(--space-4) 0 var(--space-5);
  max-width: 36ch;
}
.forbes-pullquote .q-open,
.forbes-pullquote .q-close {
  color: var(--brass-bright);
  font-family: var(--font-display);
  font-style: normal;
  font-size: 1.2em;
  line-height: 0;
  vertical-align: -0.05em;
}
.forbes-attrib {
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #D8CFBE;
  margin-bottom: var(--space-6);
}
.forbes-attrib .forbes-source {
  color: var(--brass-bright);
  font-weight: 600;
}
.forbes-context {
  font-size: var(--text-base);
  line-height: 1.7;
  color: #C8C0AE;
  max-width: 52ch;
  margin-bottom: var(--space-6);
}
.forbes-context strong { color: #F2EBDA; font-weight: 600; }
.forbes-trust-marks {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2) var(--space-3);
}
.forbes-trust-marks .trust-mark {
  background: rgba(196, 154, 90, 0.08);
  border: 1px solid rgba(196, 154, 90, 0.35);
  color: #E8E2D5;
  font-family: var(--font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  padding: 0.55rem 0.9rem;
  border-radius: 2px;
}
.forbes-factory-col figure { margin: 0; }
.forbes-factory-col img {
  width: 100%;
  height: auto;
  display: block;
  border: 1px solid #2A2824;
  filter: brightness(0.95) contrast(1.02);
}
.factory-caption {
  font-size: 0.7rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #807A6E;
  margin-top: var(--space-3);
  text-align: right;
}

@media (max-width: 900px) {
  .forbes-grid { grid-template-columns: 1fr; }
  .forbes-factory-col { order: -1; }
  .forbes-pullquote { font-size: clamp(1.4rem, 5vw, 1.9rem); }
  .factory-caption { text-align: left; }
}

/* ============================================================
   BOURBON ROOM HOODIES \u2014 product sheet + colorway entities
   ============================================================ */
.bourbon-sheet {
  margin: 0;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  overflow: hidden;
  background: #0E0E0C;
}
.bourbon-sheet img {
  width: 100%;
  height: auto;
  display: block;
}

.hoodie-colorways {
  list-style: none;
  margin: var(--space-10) 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: var(--space-4);
}
.hoodie-colorways .colorway {
  text-align: center;
  padding: var(--space-5) var(--space-3);
  border-top: 2px solid var(--brass);
  border-bottom: 1px solid var(--color-border);
}
.hoodie-colorways .colorway-name {
  font-family: var(--font-display);
  font-size: clamp(1rem, 1.4vw, 1.25rem);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--brass-bright);
  margin: 0 0 var(--space-2);
}
.hoodie-colorways .colorway-tag {
  font-family: var(--font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-text-muted);
  margin: 0;
  line-height: 1.5;
}

.hoodie-features {
  list-style: none;
  margin: var(--space-8) 0 0;
  padding: var(--space-6) 0 0;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: var(--space-4);
  border-top: 1px solid var(--color-border);
}
.hoodie-features li {
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}
.hoodie-features strong {
  font-family: var(--font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--brass-bright);
}
.hoodie-features span {
  font-family: var(--font-serif);
  font-style: italic;
  font-size: 0.9rem;
  color: var(--color-text-muted);
}

@media (max-width: 900px) {
  .hoodie-colorways { grid-template-columns: repeat(2, 1fr); }
  .hoodie-features { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 520px) {
  .hoodie-colorways { grid-template-columns: 1fr; }
  .hoodie-features { grid-template-columns: 1fr; }
}

/* Shop-page colorway chips with tagline */
.colorway-chips {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: var(--space-3);
}
.colorway-chip {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  text-align: center;
  padding: var(--space-4);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: transparent;
  text-decoration: none;
  transition: border-color 200ms ease, background 200ms ease, transform 200ms ease;
}
.colorway-chip:hover {
  border-color: var(--brass);
  background: rgba(196, 154, 90, 0.05);
  transform: translateY(-2px);
}
.colorway-chip[data-active="true"] { border-color: var(--brass); }
.colorway-chip .cw-name {
  font-family: var(--font-display);
  font-size: 1rem;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--color-text);
}
.colorway-chip .cw-tag {
  font-family: var(--font-mono);
  font-size: 0.65rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-text-muted);
  line-height: 1.5;
  min-height: 2.4em;
}
.colorway-chip .cw-price {
  font-family: var(--font-mono);
  font-size: 0.8rem;
  letter-spacing: 0.08em;
  margin-top: 0.25rem;
}
@media (max-width: 900px) {
  .colorway-chips { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 520px) {
  .colorway-chips { grid-template-columns: 1fr; }
}

/* ============ NAV DROPDOWN (Podcast → Listen / Episodes / Be a Guest) ============ */
.nav-links .nav-has-sub { position: relative; display: inline-block; }
.nav-links .nav-has-sub > a::after {
  content: " ▾"; font-size: 0.7em; color: var(--brass);
  margin-left: 2px; opacity: 0.8;
}
.nav-links .nav-sub {
  display: none; position: absolute; top: 100%; left: -0.5rem;
  background: #0E0E0C;
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 3px;
  padding: 0.4rem 0; min-width: 180px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.5);
  z-index: 50;
}
.nav-links .nav-has-sub:hover .nav-sub,
.nav-links .nav-has-sub:focus-within .nav-sub { display: block; }
.nav-links .nav-sub a {
  display: block; padding: 0.55rem 1.1rem;
  font-size: 0.86rem; color: #D9D3C5;
  letter-spacing: 0.01em;
}
.nav-links .nav-sub a:hover { background: rgba(184,144,47,0.08); color: var(--brass-bright); }
@media (max-width: 860px) {
  .nav-links .nav-has-sub > a::after { content: ""; }
  .nav-links .nav-sub {
    display: block; position: static; box-shadow: none;
    border: none; padding: 0 0 0 1.2rem; min-width: 0;
    background: transparent;
  }
  .nav-links .nav-sub a { padding: 0.4rem 0; font-size: 0.85rem; }
}

/* ============ PITCH YOUR STORY. podcast section CTA ============ */
.pitch-cta-band {
  margin-top: 1.4rem;
  display: flex; flex-wrap: wrap; gap: 1rem;
  align-items: center; justify-content: center;
  padding: 1.4rem 1.6rem;
  background: linear-gradient(90deg, rgba(122,31,31,0.10), rgba(184,144,47,0.06));
  border: 1px solid rgba(184,144,47,0.20);
  border-radius: 4px;
}
.pitch-cta-band .pitch-copy {
  font-family: 'Fraunces', serif; font-style: italic;
  font-size: 1.02rem; color: #E8E2D5; max-width: 44ch;
  line-height: 1.4; margin: 0;
}
.pitch-cta-band .pitch-copy strong { font-style: normal; font-family:'Anton', sans-serif; font-weight:400; letter-spacing:0.04em; color: var(--brass-bright); }
.pitch-cta-band .btn { white-space: nowrap; }

/* ============================================================
   100/100/100 SPRINT PATCH. AEO + CRO + EDITORIAL
   ============================================================ */

/* AEO: visually-hidden helper for screen-reader/SEO-only headings */
.visually-hidden {
  position: absolute !important;
  width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0);
  white-space: nowrap; border: 0;
}

/* AEO: <dl> stat-strip. preserve numeric prominence with semantic markup */
.statstrip-grid dt.lbl {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 0.62rem; letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #807A6E; order: 2;
  margin-top: 0.5rem; line-height: 1.35;
}
.statstrip-grid dd.num {
  font-family: 'Anton', sans-serif;
  font-size: clamp(2rem, 5vw, 3.4rem);
  letter-spacing: 0.02em;
  color: var(--brass-bright);
  margin: 0; order: 1;
  line-height: 1;
}
.statstrip-grid .stat { display: flex; flex-direction: column; }

/* CRO: hero. 80px clear-zone for portrait + collapsed CTA visual weight */
.hero { isolation: isolate; }
.hero-inner { padding-block: clamp(4rem, 10vh, 7rem); }
.hero-inner h1 { max-width: 22ch; }
.hero-inner .hero-hook { max-width: 52ch; }
.hero-ctas { gap: 1.1rem; margin-top: 2rem; align-items: center; }
.hero-ctas .btn-primary {
  padding-inline: 2rem;
  font-size: 0.96rem;
  letter-spacing: 0.10em;
}
.hero-cta-microcopy {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 0.72rem;
  letter-spacing: 0.12em;
  color: var(--brass-bright);
  text-transform: uppercase;
  margin-top: 0.9rem;
  opacity: 0.92;
}
.hero-cta-scarcity {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 0.68rem;
  letter-spacing: 0.10em;
  color: #C9A55A;
  text-transform: uppercase;
  margin-top: 0.35rem;
  display: inline-flex; align-items: center; gap: 0.55rem;
}
.hero-cta-scarcity::before {
  content: "";
  width: 7px; height: 7px;
  border-radius: 50%;
  background: #C9A55A;
  box-shadow: 0 0 8px rgba(201,165,90,0.7);
  animation: pulse-dot 2s ease-in-out infinite;
}
@keyframes pulse-dot {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.55; transform: scale(0.85); }
}

/* ===== HERO TUNE (v18) =================================================
   Bold-move: replace venture-list tagline with $60M / YR proof line.
   Plus: tablet legibility scrim, ghost ghost text-link CTA, tee credit demoted,
   tagline forced to clean balanced wrap.
========================================================================== */
.hero h1 .h1-tag { white-space: nowrap; }
@media (max-width: 900px) {
  .hero h1 .h1-tag { white-space: normal; text-wrap: balance; }
}

/* Proof line: receipts, not description. Sits as quiet brass line, never competes with H1. */
.hero-proof {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.5rem 0.7rem;
  margin: var(--space-5) 0 0;
  font-family: 'IBM Plex Mono', monospace;
  text-transform: uppercase;
  line-height: 1;
}
.hero-proof-num {
  font-size: clamp(1rem, 1.05vw, 1.15rem);
  letter-spacing: 0.16em;
  color: var(--brass-bright);
  font-weight: 500;
  text-shadow: 0 1px 0 rgba(0,0,0,0.4);
}
.hero-proof-sep {
  color: #6B6457;
  font-family: 'IBM Plex Mono', monospace;
  font-size: clamp(0.78rem, 0.95vw, 0.95rem);
  line-height: 1;
  letter-spacing: 0;
  position: relative;
  top: -0.05em;
}
.hero-proof-lbl {
  font-family: 'IBM Plex Mono', monospace;
  font-size: clamp(0.78rem, 0.9vw, 0.92rem);
  letter-spacing: 0.18em;
  color: #A8A095;
  text-transform: uppercase;
}

/* Tertiary text-link CTA replaces second ghost button */
.hero-text-link {
  align-self: center;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 0.82rem;
  letter-spacing: 0.14em;
  color: #E8E2D5;
  text-transform: uppercase;
  text-decoration: none;
  border-bottom: 1px solid rgba(232,226,213,0.35);
  padding: 0.35rem 0.15rem;
  transition: color 0.18s ease, border-color 0.18s ease, transform 0.18s ease;
}
.hero-text-link:hover, .hero-text-link:focus-visible {
  color: var(--brass-bright);
  border-color: var(--brass-bright);
  transform: translateX(2px);
}

/* Scarcity close sits directly under primary CTA in brass, never white. */
.hero-cta-microcopy {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  flex-wrap: wrap;
  margin-top: var(--space-4);
  font-family: 'IBM Plex Mono', monospace;
  font-size: 0.82rem;
  letter-spacing: 0.1em;
  color: var(--brass-bright);
  text-transform: uppercase;
}
.hero-scarcity-dot {
  display: inline-block;
  width: 7px; height: 7px;
  border-radius: 50%;
  background: #C9A55A;
  box-shadow: 0 0 8px rgba(201,165,90,0.7);
  animation: pulse-dot 2s ease-in-out infinite;
  flex-shrink: 0;
}

/* Tee credit demoted: smaller, quieter, sits BELOW microcopy.
   Link label must NEVER wrap mid-label at any breakpoint. */
.hero .hero-tee-credit {
  margin-top: var(--space-4);
  font-size: 0.78rem;
  color: #807A6E;
  letter-spacing: 0.02em;
  text-wrap: balance;
  max-width: 56ch;
}
.hero .hero-tee-credit em { color: #9C9483; }
.hero .hero-tee-credit .hero-tee-quote { white-space: normal; }
.hero .hero-tee-credit .hero-tee-sep { display: inline-block; padding: 0 0.15rem; }
.hero .hero-tee-credit .hero-tee-link {
  color: #B89762;
  text-decoration: none;
  border-bottom: 1px solid rgba(184,151,98,0.4);
  white-space: nowrap;
}
.hero .hero-tee-credit .hero-tee-link:hover,
.hero .hero-tee-credit .hero-tee-link:focus-visible {
  color: var(--brass-bright);
  border-color: var(--brass-bright);
}
/* Mobile: drop the quote framing entirely so we never wrap mid-label */
@media (max-width: 480px) {
  .hero .hero-tee-credit .hero-tee-quote,
  .hero .hero-tee-credit .hero-tee-sep { display: none; }
  .hero .hero-tee-credit { font-size: 0.74rem; }
}

/* Tablet scrim: strengthen lower-left ground beneath text block */
@media (min-width: 700px) and (max-width: 1099px) {
  .hero-bg::after {
    background:
      radial-gradient(ellipse 75% 60% at 18% 78%, rgba(14,14,12,0.92) 0%, rgba(14,14,12,0.7) 40%, rgba(14,14,12,0.2) 70%, transparent 100%),
      linear-gradient(90deg, rgba(14,14,12,0.85) 0%, rgba(14,14,12,0.45) 50%, rgba(14,14,12,0.15) 100%),
      linear-gradient(0deg, rgba(14,14,12,0.95) 0%, rgba(14,14,12,0.25) 60%, transparent 100%);
  }
}

/* Mobile: kill horizontal scroll risk from nowraps, tighten proof line */
@media (max-width: 560px) {
  .hero-proof { gap: 0.4rem 0.6rem; }
  .hero-proof-num { font-size: clamp(1.4rem, 7vw, 1.9rem); }
  .hero-proof-sep { display: none; }
  .hero-text-link { align-self: flex-start; }
}

/* CRO: Founder Fallout. price-on-card */
.ff-price-row {
  display: flex; flex-wrap: wrap; align-items: baseline;
  gap: 0.4rem 1.2rem;
  margin-top: 1.4rem;
  font-family: 'Anton', sans-serif;
  letter-spacing: 0.05em;
}
.ff-price-row .ff-price {
  font-size: 1.6rem; color: var(--brass-bright);
}
.ff-price-row .ff-price-label {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 0.7rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #807A6E;
  margin-right: 0.25rem;
}
.ff-price-row .ff-divider {
  width: 1px; height: 1.4rem;
  background: rgba(232, 226, 213, 0.18);
}

/* CRO: scroll-triggered drop-list ribbon (appears at 60% scroll) */
.drop-list-ribbon {
  position: fixed;
  bottom: 0; left: 0; right: 0;
  z-index: 60;
  background: linear-gradient(90deg, #0E0E0C 0%, #1A1816 50%, #0E0E0C 100%);
  border-top: 1px solid rgba(184,144,47,0.35);
  padding: 0.85rem 1.25rem;
  display: flex; align-items: center; justify-content: center;
  gap: 1.2rem; flex-wrap: wrap;
  transform: translateY(100%);
  transition: transform 0.45s cubic-bezier(0.22, 0.61, 0.36, 1);
  box-shadow: 0 -8px 32px rgba(0,0,0,0.45);
}
.drop-list-ribbon.visible { transform: translateY(0); }

/* Reserve viewport space when the ribbon is up so CTAs inside the hoodie
   section can't be partially obscured at the bottom of the mobile viewport.
   Desktop layout is wide enough that the ribbon never sits over a CTA. */
@media (max-width: 640px) {
  /* Ribbon is ~114px tall on mobile (two-line copy + brass CTA + close).
     Reserve full ribbon height + buffer at the end of the document so the
     footer copyright/tagline can't sit behind the ribbon. Mid-document content
     can still partially sit under the ribbon (that is the intended UX for any
     sticky CTA), but no critical bottom-of-page content gets covered. */
  body:has(.drop-list-ribbon.visible) { padding-bottom: 8rem; }
  /* Fallback for browsers without :has(): JS toggles .ribbon-active on body. */
  body.ribbon-active { padding-bottom: 8rem; }
}
.drop-list-ribbon .ribbon-copy {
  color: #E8E2D5;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 0.78rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.drop-list-ribbon .ribbon-copy strong { color: var(--brass-bright); }
.drop-list-ribbon .ribbon-close {
  position: absolute; right: 0.85rem; top: 50%;
  transform: translateY(-50%);
  background: transparent; border: 0;
  color: #807A6E; font-size: 1.2rem;
  cursor: pointer; padding: 0.3rem 0.5rem;
}
.drop-list-ribbon .ribbon-close:hover { color: #E8E2D5; }
@media (max-width: 640px) {
  .drop-list-ribbon { padding: 0.7rem 0.85rem 0.7rem; gap: 0.7rem; }
  .drop-list-ribbon .ribbon-copy { font-size: 0.66rem; }
}

/* EDITORIAL: hoodie card breathing room */
.bourbon-hoodies .bourbon-sheet { margin-top: calc(var(--space-10) + 24px) !important; }
.bourbon-hoodies .hoodie-colorways { margin-top: calc(var(--space-10) + 24px) !important; }

/* EDITORIAL: David Quick podcast tile desaturate (sits 10th in onmic-grid) */
.onmic-grid .mic-tile:nth-child(10) .mic-thumb img {
  filter: saturate(0.62) contrast(1.05);
  transition: filter 0.4s ease;
}
.onmic-grid .mic-tile:nth-child(10):hover .mic-thumb img {
  filter: saturate(1) contrast(1);
}

/* CRO: trust-row + CEO chip lift to 1.2× */
.trust-row .ceo-chip img {
  transform: scale(1.18);
  transform-origin: center;
  filter: drop-shadow(0 4px 14px rgba(184,144,47,0.28));
}
@media (max-width: 720px) {
  .trust-row .ceo-chip img { transform: scale(1.08); }
}

/* EDITORIAL: tee-credit inline link \u2014 hierarchy below eyebrow */
.hero-tee-credit {
  font-family: 'Fraunces', serif;
  font-style: italic;
  font-size: 0.96rem;
  color: #D8CFBE;
  opacity: 0.88;
  margin-top: 0.85rem;
  max-width: 48ch;
  line-height: 1.45;
}
.hero-tee-credit a {
  color: var(--brass-bright) !important;
  text-decoration: none !important;
  border-bottom: 1px dotted rgba(184,144,47,0.55);
  padding-bottom: 1px;
  font-style: normal;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 0.78rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.hero-tee-credit a:hover {
  border-bottom-color: var(--brass-bright);
  border-bottom-style: solid;
}

/* EDITORIAL: eyebrow consistency */
.eyebrow {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 0.7rem !important;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--brass);
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
}
.eyebrow::before {
  content: ""; width: 22px; height: 1px;
  background: currentColor; opacity: 0.55;
}

/* ===== VENTURES HERO ===== */
.ventures-hero { padding-block: clamp(var(--space-16), 8vw, var(--space-28)); border-top: 1px solid #2A2824; border-bottom: 1px solid #2A2824; }
.v-hero-grid {
  display: grid;
  grid-template-columns: 1fr auto 1fr auto 1fr;
  align-items: center;
  gap: clamp(var(--space-6), 4vw, var(--space-12));
  margin-bottom: var(--space-6);
}
.v-hero-stat { text-align: center; display: flex; flex-direction: column; align-items: center; gap: var(--space-2); }
.v-hero-num {
  font-family: 'Anton', 'Bebas Neue', sans-serif;
  font-size: clamp(5.5rem, 14vw, 12rem);
  line-height: 0.85;
  color: var(--brass-bright);
  letter-spacing: -0.02em;
  display: inline-flex;
  align-items: baseline;
}
.v-hero-dollar { font-size: 0.55em; margin-right: 0.02em; opacity: 0.85; }
.v-hero-lbl {
  font-family: 'IBM Plex Mono', monospace;
  font-size: clamp(0.75rem, 1vw, 0.9rem);
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--color-text-muted);
}
.v-hero-divider {
  width: 1px;
  height: clamp(4rem, 8vw, 7rem);
  background: linear-gradient(180deg, transparent 0%, #3A3630 50%, transparent 100%);
}
.v-hero-tag {
  text-align: center;
  font-family: var(--font-display);
  font-size: clamp(1.05rem, 1.6vw, 1.5rem);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #C8C2B4;
  max-width: 64ch;
  margin: 0 auto;
}
@media (max-width: 720px) {
  .v-hero-grid { grid-template-columns: 1fr; gap: var(--space-6); }
  .v-hero-divider { width: clamp(3rem, 30%, 6rem); height: 1px; background: linear-gradient(90deg, transparent, #3A3630, transparent); }
}

/* ===== CONTACT SECTION ===== */
.contact-section { background: var(--color-bg); border-top: 1px solid #2A2824; padding-block: clamp(var(--space-16), 8vw, var(--space-24)); }
.contact-head { max-width: 60rem; margin-bottom: var(--space-12); }
.contact-head h2 { font-family: var(--font-display); font-size: clamp(2.4rem, 5vw, 4rem); line-height: 0.98; margin: var(--space-3) 0 var(--space-5); text-transform: uppercase; letter-spacing: -0.005em; }
.contact-sub { font-family: var(--font-serif); font-size: var(--text-lg); color: #C8C2B4; max-width: 60ch; margin: 0; }
.contact-routes { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: var(--space-6); margin-bottom: var(--space-16); }
.contact-route {
  display: flex; flex-direction: column; gap: var(--space-3);
  padding: var(--space-7);
  background: var(--color-surface); border: 1px solid #2A2824; border-radius: 4px;
  text-decoration: none; color: inherit;
  transition: transform 0.25s, border-color 0.25s, background 0.25s;
  position: relative; overflow: hidden;
}
.contact-route::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--brass-bright); transform: translateY(-3px); transition: transform 0.25s; }
.contact-route:hover { transform: translateY(-4px); border-color: var(--brass-bright); background: rgba(154,119,67,0.06); }
.contact-route:hover::before { transform: translateY(0); }
.contact-route-num { font-family: var(--font-mono); font-size: 0.7rem; letter-spacing: 0.2em; color: var(--brass); }
.contact-route h3 { font-family: var(--font-display); font-size: clamp(1.4rem, 2vw, 1.85rem); text-transform: uppercase; margin: 0; line-height: 1.05; }
.contact-route p { font-size: var(--text-base); color: #C8C2B4; margin: 0; line-height: 1.5; }
.contact-route-cta { margin-top: auto; padding-top: var(--space-3); font-family: var(--font-mono); font-size: 0.78rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--brass-bright); }

.contact-form-wrap { display: grid; grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr); gap: var(--space-10); align-items: start; }
.contact-form-side h3 { line-height: 1.0; }
.contact-form-blurb { color: #C8C2B4; font-family: var(--font-serif); font-size: var(--text-lg); margin: var(--space-5) 0 var(--space-7); }
.contact-calendly { padding: var(--space-5); border: 1px dashed #3A3630; border-radius: 4px; background: rgba(154,119,67,0.04); }
.contact-calendly-tag { font-family: var(--font-mono); font-size: 0.72rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--brass-bright); margin: 0 0 var(--space-2); }
.contact-calendly-desc { font-size: var(--text-sm); color: #C8C2B4; margin: 0; }

.contact-form { display: flex; flex-direction: column; gap: var(--space-4); background: var(--color-surface); border: 1px solid #2A2824; padding: var(--space-8); border-radius: 4px; }
.contact-row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-4); }
.contact-field { display: flex; flex-direction: column; gap: 0.4rem; }
.contact-field span { font-family: var(--font-mono); font-size: 0.72rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--brass); }
.contact-field input, .contact-field select, .contact-field textarea {
  background: rgba(255,255,255,0.04); border: 1px solid rgba(176,141,87,0.30); color: #E8E2D5;
  padding: 0.85rem 0.95rem; font-size: 0.98rem; font-family: inherit; letter-spacing: 0.01em;
  border-radius: 3px; outline: none; transition: border-color 0.2s, background 0.2s;
}
.contact-field input:focus, .contact-field select:focus, .contact-field textarea:focus {
  border-color: var(--brass-bright); background: rgba(255,255,255,0.07);
}
.contact-field textarea { resize: vertical; min-height: 7rem; }
.contact-submit { width: fit-content; padding: 1rem 1.6rem; margin-top: var(--space-2); }
.contact-form-note { font-family: var(--font-mono); font-size: 0.68rem; letter-spacing: 0.1em; text-transform: uppercase; color: #6E6862; margin: 0; }

@media (max-width: 820px) {
  .contact-form-wrap { grid-template-columns: 1fr; gap: var(--space-8); }
  .contact-row { grid-template-columns: 1fr; }
}

/* ===== CONVERSION BAND (footer top) ===== */
.conv-band {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid #2A2824;
  border-bottom: 1px solid #2A2824;
  background: #0E0E0C;
}
.conv-card {
  position: relative; overflow: hidden;
  display: flex; flex-direction: column;
  text-decoration: none; color: #E8E2D5;
  min-height: 30rem;
  border-right: 1px solid #2A2824;
  transition: background 0.3s;
}
.conv-card:last-child { border-right: none; }
.conv-img { position: absolute; inset: 0; z-index: 0; }
.conv-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s ease, filter 0.4s ease; filter: grayscale(0.4) brightness(0.55) contrast(1.1); }
.conv-card:hover .conv-img img { transform: scale(1.06); filter: grayscale(0) brightness(0.65) contrast(1.05); }
.conv-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(14,14,12,0.25) 0%, rgba(14,14,12,0.9) 100%); z-index: 1; }
.conv-body { position: relative; z-index: 2; margin-top: auto; padding: clamp(1.75rem, 4vw, 2.75rem) clamp(1.5rem, 3.5vw, 2.5rem); display: flex; flex-direction: column; gap: var(--space-3); }
.conv-tag { font-family: var(--font-mono); font-size: 0.72rem; letter-spacing: 0.2em; color: var(--brass-bright); text-transform: uppercase; }
.conv-h { font-family: var(--font-display); font-size: clamp(2.2rem, 3.6vw, 3.4rem); line-height: 0.92; margin: 0; text-transform: uppercase; letter-spacing: -0.005em; color: #F4EFE6; }
.conv-card:hover .conv-h { color: var(--brass-bright); }
.conv-sub { font-family: var(--font-serif); font-size: var(--text-base); color: #C8C2B4; margin: 0; max-width: 32ch; line-height: 1.45; }
.conv-cta { margin-top: var(--space-3); font-family: var(--font-mono); font-size: 0.82rem; letter-spacing: 0.14em; text-transform: uppercase; color: #E8E2D5; border-bottom: 1px solid var(--brass-bright); padding-bottom: 0.3rem; align-self: flex-start; transition: color 0.2s, padding-right 0.2s; }
.conv-card:hover .conv-cta { color: var(--brass-bright); padding-right: 0.5rem; }

@media (max-width: 920px) {
  .conv-band { grid-template-columns: 1fr; }
  .conv-card { min-height: 22rem; border-right: none; border-bottom: 1px solid #2A2824; }
  .conv-card:last-child { border-bottom: none; }
}

/* Footer "you are here" marker - non-clickable for self-page footer link */
.footer-here {
  color: var(--brass-bright);
  font-weight: 600;
  cursor: default;
}
.footer-here::before { content: "» "; opacity: 0.6; }

/* ============================================================
   MOBILE TAP-TARGET COMPLIANCE (WCAG 2.5.5 + Google Mobile-Friendly)
   Floor: 44x44 CSS px for any actionable control on small screens.
   ============================================================ */
@media (max-width: 940px) {
  .nav-toggle,
  .theme-toggle {
    width: 2.75rem !important;   /* 44px */
    height: 2.75rem !important;  /* 44px */
  }
  .logo {
    min-width: 2.75rem;
    min-height: 2.75rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  /* Hero secondary/tertiary links */
  .hero-secondary-link,
  .sp-hero-tertiary {
    min-height: 2.75rem;
    padding: 0.6rem 0.8rem;
    display: inline-flex;
    align-items: center;
  }
  /* Footer thanks-page back links */
  .thx-back {
    min-height: 2.75rem;
    padding: 0.6rem 0.8rem;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
  }
  /* Breadcrumb crumbs on shop PDPs */
  .breadcrumbs a,
  nav.breadcrumbs a,
  .bc a {
    min-height: 2.75rem;
    padding: 0.6rem 0.4rem;
    display: inline-flex;
    align-items: center;
  }
  /* Size selectors on PDPs */
  .size-button,
  button[class*="size"],
  .pdp .size-btn {
    min-height: 2.75rem !important;
    min-width: 2.75rem !important;
  }
  /* Social links in lists */
  .social-link,
  a[href*="instagram.com"],
  a[href*="youtube.com"] {
    min-height: 2.75rem;
    display: inline-flex;
    align-items: center;
    padding-block: 0.3rem;
  }
}

/* Round 3 mobile tap-target cleanup — shop PDP specifics */
@media (max-width: 940px) {
  /* PDP breadcrumb anchors (inline <a> inside .mono <p>) */
  main .wrap p.mono a,
  main p.mono a {
    min-height: 2.75rem !important;
    padding: 0.6rem 0.3rem !important;
    display: inline-flex !important;
    align-items: center !important;
  }
  /* PDP size selector buttons (.size-row > button) */
  .size-row button,
  .size-row > button[type="button"] {
    min-height: 2.75rem !important;
    min-width: 2.75rem !important;
    padding-block: 0.6rem !important;
    box-sizing: border-box !important;
  }
}

@media (max-width: 940px) {
  /* PDP restock subscribe link */
  .restock-link,
  a.restock-link {
    min-height: 2.75rem !important;
    padding-block: 0.7rem !important;
    display: inline-flex !important;
    align-items: center !important;
  }
}

@media (max-width: 940px) {
  /* CTA buttons + ribbon close */
  .btn,
  a.btn,
  button.btn,
  .btn-brass,
  .btn-primary,
  .btn-secondary {
    min-height: 2.75rem !important;
    padding-block: 0.75rem !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
  .ribbon-close,
  button.ribbon-close {
    min-width: 2.75rem !important;
    min-height: 2.75rem !important;
    padding: 0.5rem !important;
  }
}


/* --- PDP color swatches (added v2 sync) --- */
.pdp-swatches { margin: var(--space-5) 0 var(--space-5); }
.pdp-swatch-row { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.pdp-swatch {
  display: inline-flex; align-items: center; gap: 0.5rem;
  padding: 0.5rem 0.8rem 0.5rem 0.5rem;
  border: 1px solid var(--color-border);
  border-radius: 999px;
  background: transparent;
  text-decoration: none;
  font-family: var(--font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  color: var(--color-text);
  transition: border-color 0.15s ease, background 0.15s ease;
}
.pdp-swatch:hover { border-color: var(--brass-bright); background: rgba(184,148,42,0.06); }
.pdp-swatch.is-current { border-color: var(--oxblood-bright); background: rgba(160,40,42,0.08); cursor: default; }
.pdp-swatch-dot {
  width: 1.1rem; height: 1.1rem; border-radius: 50%;
  background: var(--sw, #888);
  border: 1px solid rgba(255,255,255,0.18);
  flex-shrink: 0;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,0.25);
}
.pdp-swatch-name { white-space: nowrap; }
@media (max-width: 480px) {
  .pdp-swatch { padding: 0.4rem 0.65rem 0.4rem 0.4rem; font-size: 0.66rem; }
  .pdp-swatch-dot { width: 0.95rem; height: 0.95rem; }
}