/* ═══════════════════════════════════════════════════════════════════════
   AURALENSE MARKETING LANDING PAGE — style.css  v3 Design System Overhaul
   Light-first · Playfair Display (display/headlines) · Inter (body/eyebrows)
   Brand palette: Aubergine #483C51 · Gold #C9A84C · White bg
   ═══════════════════════════════════════════════════════════════════════ */

/* ── DESIGN TOKENS ─────────────────────────────────────────────────────── */
:root {
  /* Type scale (fluid) */
  --text-xs:   clamp(0.75rem,  0.7rem  + 0.25vw, 0.875rem);
  --text-sm:   clamp(0.875rem, 0.8rem  + 0.35vw, 1rem);
  --text-base: clamp(1rem,     0.95rem + 0.25vw, 1.125rem);
  --text-lg:   clamp(1.125rem, 1rem    + 0.75vw, 1.5rem);
  --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(2.25rem,  0.5rem  + 4.5vw,  5rem);

  /* Spacing (4px grid) */
  --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 */
  --radius-sm:   0.375rem;
  --radius-md:   0.5rem;
  --radius-lg:   0.75rem;
  --radius-xl:   1rem;
  --radius-2xl:  1.5rem;
  --radius-full: 9999px;

  /* Transitions */
  --transition-interactive: 180ms cubic-bezier(0.16, 1, 0.3, 1);
  --transition-slow: 400ms cubic-bezier(0.16, 1, 0.3, 1);

  /* Content widths */
  --content-narrow:  640px;
  --content-default: 960px;
  --content-wide:    1200px;

  /* Fonts */
  --font-display: 'Playfair Display', Georgia, serif;
  --font-body:    'Inter', 'Helvetica Neue', Arial, sans-serif;
}

/* ── BRAND COLOR SYSTEM (Light — default) ─────────────────────────────── */
:root,
[data-theme='light'] {
  /* Background */
  --color-bg:              #FFFFFF;
  --color-surface:         #FAFAF8;
  --color-surface-2:       #F7F5F0;
  --color-surface-offset:  #F2EFF8;
  --color-surface-dynamic: #EDE9F4;
  --color-divider:         #E8E4E0;
  --color-border:          #DDD8D0;

  /* Text — Deep Aubergine system */
  --color-text:         #483C51;
  --color-text-muted:   #7B6E8A;
  --color-text-faint:   #B8AFCC;
  --color-text-inverse: #FFFFFF;

  /* Primary — aubergine */
  --color-primary:           #483C51;
  --color-primary-hover:     #3A2F42;
  --color-primary-active:    #2C2233;
  --color-primary-highlight: #F0ECFA;
  --color-primary-glow:      rgba(72, 60, 81, 0.08);

  /* Gold accent */
  --color-gold:              #C9A84C;
  --color-gold-light:        rgba(201, 168, 76, 0.14);
  --color-gold-border:       rgba(201, 168, 76, 0.35);

  /* Gray — desaturated aubergine */
  --color-gray:              #6B6070;

  /* Pastel palette — used in card gradients only */
  --pastel-lavender: #C4B5D4;
  --pastel-blush:    #F2C4BB;
  --pastel-sky:      #B8D8EA;
  --pastel-gold:     #F5C97A;
  --pastel-sage:     #C8E6C0;

  /* Icon pastel pairs */
  --icon-red-bg:    #FAECE9;
  --icon-red-fg:    #A36464;
  --icon-blue-bg:   #E7F1F7;
  --icon-blue-fg:   #4E7E9E;
  --icon-yellow-bg: #FBEDD5;
  --icon-yellow-fg: #967634;
  --icon-green-bg:  #EDF6E9;
  --icon-green-fg:  #4A7C59;
  --icon-purple-bg: #EDEAF2;
  --icon-purple-fg: #6A5490;

  /* Hero gradient */
  --grad-hero: linear-gradient(135deg, #F8F5FF 0%, #FBF0F8 30%, #F0F6FF 60%, #F5FBF5 100%);

  /* Pastel card gradients (internal only) */
  --grad-pastel-1: linear-gradient(135deg, rgba(196,181,212,0.18) 0%, rgba(242,196,187,0.14) 50%, rgba(184,216,234,0.16) 100%);
  --grad-pastel-2: linear-gradient(160deg, rgba(200,230,192,0.15) 0%, rgba(245,201,122,0.12) 50%, rgba(196,181,212,0.18) 100%);

  /* Success */
  --color-success: #4A7C59;

  /* Shadows — soft, warm */
  --shadow-sm:   0 1px 3px rgba(72, 60, 81, 0.06);
  --shadow-md:   0 4px 16px rgba(72, 60, 81, 0.08);
  --shadow-lg:   0 12px 40px rgba(72, 60, 81, 0.10);
  --shadow-glow: 0 0 40px rgba(196, 181, 212, 0.25);
}

/* ── DARK MODE ─────────────────────────────────────────────────────────── */
[data-theme='dark'] {
  --color-bg:              #1A1625;
  --color-surface:         #211C30;
  --color-surface-2:       #272039;
  --color-surface-offset:  #2B2440;
  --color-surface-dynamic: #332C4A;
  --color-divider:         #3A3252;
  --color-border:          #453C5E;

  --color-text:         #EDE8F5;
  --color-text-muted:   #A898C8;
  --color-text-faint:   #6B5E8A;
  --color-text-inverse: #1A1625;

  --color-primary:           #C4B5D4;
  --color-primary-hover:     #D4C8E2;
  --color-primary-active:    #E4DAEE;
  --color-primary-highlight: #332C4A;
  --color-primary-glow:      rgba(196, 181, 212, 0.12);

  --color-gold:              #D4B85A;
  --color-gold-light:        rgba(212, 184, 90, 0.12);
  --color-gold-border:       rgba(212, 184, 90, 0.30);

  --color-gray:              #9888AA;

  --pastel-lavender: #9C8CB8;
  --pastel-blush:    #C4887E;
  --pastel-sky:      #7AAEC8;
  --pastel-gold:     #C8A050;
  --pastel-sage:     #88B882;

  --icon-red-bg:    rgba(163,100,100,0.15);
  --icon-red-fg:    #C4887E;
  --icon-blue-bg:   rgba(78,126,158,0.15);
  --icon-blue-fg:   #7AAEC8;
  --icon-yellow-bg: rgba(150,118,52,0.15);
  --icon-yellow-fg: #C8A050;
  --icon-green-bg:  rgba(74,124,89,0.15);
  --icon-green-fg:  #88B882;
  --icon-purple-bg: rgba(106,84,144,0.15);
  --icon-purple-fg: #9C8CB8;

  --grad-hero:     linear-gradient(135deg, #1E1830 0%, #221528 30%, #1A2030 60%, #1A2018 100%);
  --grad-pastel-1: linear-gradient(135deg, rgba(156,140,184,0.12) 0%, rgba(196,136,126,0.10) 50%, rgba(122,174,200,0.12) 100%);
  --grad-pastel-2: linear-gradient(160deg, rgba(136,184,130,0.10) 0%, rgba(200,160,80,0.08) 50%, rgba(156,140,184,0.12) 100%);

  --color-success: #6DB882;

  --shadow-sm:   0 1px 3px rgba(0,0,0,0.30);
  --shadow-md:   0 4px 16px rgba(0,0,0,0.40);
  --shadow-lg:   0 12px 40px rgba(0,0,0,0.50);
  --shadow-glow: 0 0 40px rgba(196, 181, 212, 0.12);
}

/* System preference dark fallback */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    --color-bg:              #1A1625;
    --color-surface:         #211C30;
    --color-surface-2:       #272039;
    --color-surface-offset:  #2B2440;
    --color-surface-dynamic: #332C4A;
    --color-divider:         #3A3252;
    --color-border:          #453C5E;
    --color-text:         #EDE8F5;
    --color-text-muted:   #A898C8;
    --color-text-faint:   #6B5E8A;
    --color-text-inverse: #1A1625;
    --color-primary:           #C4B5D4;
    --color-primary-hover:     #D4C8E2;
    --color-primary-active:    #E4DAEE;
    --color-primary-highlight: #332C4A;
    --color-primary-glow:      rgba(196, 181, 212, 0.12);
    --color-gold:              #D4B85A;
    --color-gold-light:        rgba(212, 184, 90, 0.12);
    --color-gold-border:       rgba(212, 184, 90, 0.30);
    --color-gray:              #9888AA;
    --pastel-lavender: #9C8CB8;
    --pastel-blush:    #C4887E;
    --pastel-sky:      #7AAEC8;
    --pastel-gold:     #C8A050;
    --pastel-sage:     #88B882;
    --icon-red-bg:    rgba(163,100,100,0.15);
    --icon-red-fg:    #C4887E;
    --icon-blue-bg:   rgba(78,126,158,0.15);
    --icon-blue-fg:   #7AAEC8;
    --icon-yellow-bg: rgba(150,118,52,0.15);
    --icon-yellow-fg: #C8A050;
    --icon-green-bg:  rgba(74,124,89,0.15);
    --icon-green-fg:  #88B882;
    --icon-purple-bg: rgba(106,84,144,0.15);
    --icon-purple-fg: #9C8CB8;
    --grad-hero:     linear-gradient(135deg, #1E1830 0%, #221528 30%, #1A2030 60%, #1A2018 100%);
    --grad-pastel-1: linear-gradient(135deg, rgba(156,140,184,0.12) 0%, rgba(196,136,126,0.10) 50%, rgba(122,174,200,0.12) 100%);
    --grad-pastel-2: linear-gradient(160deg, rgba(136,184,130,0.10) 0%, rgba(200,160,80,0.08) 50%, rgba(156,140,184,0.12) 100%);
    --color-success: #6DB882;
    --shadow-sm:   0 1px 3px rgba(0,0,0,0.30);
    --shadow-md:   0 4px 16px rgba(0,0,0,0.40);
    --shadow-lg:   0 12px 40px rgba(0,0,0,0.50);
    --shadow-glow: 0 0 40px rgba(196, 181, 212, 0.12);
  }
}

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

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

body {
  min-height: 100dvh;
  font-family: var(--font-body);
  font-size: var(--text-base);
  line-height: 1.7;
  color: var(--color-text);
  background-color: var(--color-bg);
  transition: background-color 0.3s ease, color 0.3s ease;
  overflow-x: hidden;
}

img, picture, video, canvas, svg {
  display: block;
  max-width: 100%;
  height: auto;
}

ul[role='list'], ol[role='list'] { list-style: none; }

input, button, textarea, select { font: inherit; color: inherit; }

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-display);
  text-wrap: balance;
  line-height: 1.1;
  color: var(--color-text);
}

p, li, figcaption {
  text-wrap: pretty;
  max-width: 68ch;
}

::selection {
  background: rgba(196, 181, 212, 0.35);
  color: var(--color-text);
}

:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 3px;
  border-radius: var(--radius-sm);
}

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

button { cursor: pointer; background: none; border: none; }

a, button, [role='button'] {
  transition:
    color var(--transition-interactive),
    background var(--transition-interactive),
    border-color var(--transition-interactive),
    box-shadow var(--transition-interactive),
    opacity 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-width: 0;
}

/* ── LAYOUT UTILITIES ──────────────────────────────────────────────────── */
.container {
  width: 100%;
  max-width: var(--content-wide);
  margin-inline: auto;
  padding-inline: clamp(var(--space-6), 5vw, var(--space-16));
}

/* ── TYPOGRAPHY HELPERS ────────────────────────────────────────────────── */
/* Eyebrow — no dash, small gold/aubergine dot marker via ::before */
.eyebrow {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--color-gray);
  margin-bottom: var(--space-4);
  display: flex;
  align-items: center;
  gap: 0.5em;
}

.eyebrow::before {
  content: '';
  display: inline-block;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--color-gold);
  flex-shrink: 0;
  margin-top: 0;
}

[data-theme='light'] .eyebrow,
:root:not([data-theme]) .eyebrow {
  color: var(--color-gray);
}

[data-theme='dark'] .eyebrow {
  color: var(--pastel-lavender);
}

[data-theme='dark'] .eyebrow::before {
  background: var(--pastel-gold);
}

/* Section header — centered layout, consistent alignment */
.section-header {
  text-align: center;
  max-width: 720px;
  margin-inline: auto;
  margin-bottom: clamp(var(--space-10), 6vw, var(--space-16));
}

.section-header .eyebrow {
  justify-content: center;
}

.section-header h2 {
  font-family: var(--font-display);
  font-size: var(--text-2xl);
  font-weight: 400;
  color: var(--color-text);
  margin-bottom: var(--space-4);
}

.section-header h2 em {
  font-style: normal;
  color: var(--color-gold);
}

[data-theme='dark'] .section-header h2 em {
  color: var(--pastel-gold);
}

.section-sub {
  font-family: var(--font-body);
  font-size: var(--text-base);
  color: var(--color-text-muted);
  max-width: 56ch;
  margin-inline: auto;
  line-height: 1.7;
}

/* ── BUTTONS ───────────────────────────────────────────────────────────── */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 600;
  letter-spacing: 0.02em;
  line-height: 1;
  text-decoration: none;
  border-radius: var(--radius-full);
  padding: var(--space-3) var(--space-6);
  transition: all var(--transition-interactive);
  white-space: nowrap;
  cursor: pointer;
}

.btn--primary {
  background: var(--color-primary);
  color: #FFFFFF;
  border: 1.5px solid var(--color-primary);
  box-shadow: 0 2px 12px rgba(72, 60, 81, 0.18);
}
.btn--primary:hover {
  background: var(--color-primary-hover);
  border-color: var(--color-primary-hover);
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(72, 60, 81, 0.24);
}
.btn--primary:active { transform: translateY(0); }

[data-theme='dark'] .btn--primary {
  background: var(--color-primary);
  color: #1A1625;
  box-shadow: 0 2px 12px rgba(196, 181, 212, 0.20);
}
[data-theme='dark'] .btn--primary:hover {
  background: var(--color-primary-hover);
  box-shadow: 0 6px 20px rgba(196, 181, 212, 0.30);
}

.btn--ghost {
  background: transparent;
  color: var(--color-text);
  border: 1.5px solid var(--color-border);
}
.btn--ghost:hover {
  border-color: var(--color-primary);
  color: var(--color-primary);
  background: var(--color-primary-highlight);
}

/* Gold secondary — used in new content sections */
.btn--secondary {
  background: transparent;
  color: #C9A84C;
  border: 1.5px solid #C9A84C;
}
.btn--secondary:hover {
  background: rgba(201, 168, 76, 0.08);
  color: #C9A84C;
  border-color: #C9A84C;
}

.btn--lg {
  font-size: var(--text-base);
  padding: var(--space-4) var(--space-8);
}

.btn--full {
  width: 100%;
  justify-content: center;
  padding-block: var(--space-4);
}

/* Nav-sized small buttons */
.btn--primary-sm {
  background: var(--color-primary);
  color: #FFFFFF;
  border: 1.5px solid var(--color-primary);
  font-size: var(--text-xs);
  font-weight: 600;
  padding: var(--space-2) var(--space-5);
  border-radius: var(--radius-full);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  transition: all var(--transition-interactive);
  box-shadow: 0 1px 6px rgba(72, 60, 81, 0.14);
}
.btn--primary-sm:hover {
  background: var(--color-primary-hover);
  border-color: var(--color-primary-hover);
  transform: translateY(-1px);
}

[data-theme='dark'] .btn--primary-sm {
  color: #1A1625;
}

.btn--ghost-sm {
  background: transparent;
  color: var(--color-text-muted);
  border: 1.5px solid transparent;
  font-size: var(--text-xs);
  padding: var(--space-2) var(--space-4);
  border-radius: var(--radius-full);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  transition: all var(--transition-interactive);
}
.btn--ghost-sm:hover {
  color: var(--color-text);
  border-color: var(--color-border);
}

/* ═══════════════════════════════════════════════════════════════════════
   NAV
   ═══════════════════════════════════════════════════════════════════════ */
.nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 100;
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  border-bottom: none;
  transition: transform 0.3s cubic-bezier(0.16,1,0.3,1),
              background 0.4s ease,
              box-shadow 0.3s cubic-bezier(0.16,1,0.3,1);
}

/* Once user scrolls past hero, nav picks up a light frosted bg */
.nav--scrolled {
  background: color-mix(in oklab, var(--color-bg) 92%, transparent);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--color-divider);
  box-shadow: var(--shadow-sm);
}

.nav--hidden { transform: translateY(-100%); }

/* Nav text: always readable over the light iridescent hero video */
.nav:not(.nav--scrolled) .nav__logo,
.nav:not(.nav--scrolled) .nav__wordmark {
  color: #483C51;
}
.nav:not(.nav--scrolled) .nav__links a {
  color: #2D2A33;
}
.nav:not(.nav--scrolled) .nav__links a:hover {
  color: #483C51;
}
.nav:not(.nav--scrolled) .btn--ghost-sm {
  color: #2D2A33;
}
.nav:not(.nav--scrolled) .btn--ghost-sm:hover {
  color: #483C51;
  border-color: rgba(72,60,81,0.25);
}
.nav:not(.nav--scrolled) .nav__burger span {
  background: #483C51;
}

.nav__inner {
  display: flex;
  align-items: center;
  gap: var(--space-6);
  height: 72px;
}

.nav__logo {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  text-decoration: none;
  color: var(--color-text);
  flex-shrink: 0;
}

.nav__wordmark {
  font-family: var(--font-display);
  font-size: var(--text-lg);
  font-weight: 400;
  letter-spacing: -0.01em;
  color: var(--color-text);
  font-style: normal;
}

.nav__links {
  display: flex;
  align-items: center;
  gap: 36px;
  margin-left: auto;
}

.nav__links a {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 400;
  color: var(--color-text-muted);
  text-decoration: none;
  transition: color var(--transition-interactive);
}
.nav__links a:hover { color: var(--color-text); }

.nav__actions {
  display: flex;
  align-items: center;
  gap: var(--space-4);
  flex-shrink: 0;
}

.nav__burger {
  display: none;
  flex-direction: column;
  gap: 5px;
  padding: var(--space-2);
  margin-left: auto;
  cursor: pointer;
  background: none;
  border: none;
}

.nav__burger span {
  display: block;
  width: 22px;
  height: 1.5px;
  background: var(--color-text);
  border-radius: 2px;
  transition: all 0.3s ease;
}

.nav__burger[aria-expanded='true'] span:nth-child(1) {
  transform: translateY(6.5px) rotate(45deg);
}
.nav__burger[aria-expanded='true'] span:nth-child(2) {
  opacity: 0;
}
.nav__burger[aria-expanded='true'] span:nth-child(3) {
  transform: translateY(-6.5px) rotate(-45deg);
}

/* Mobile menu */
.nav__mobile {
  display: none;
  flex-direction: column;
  gap: 0;
  border-top: none;
  background: var(--color-bg);
  overflow: hidden;
  max-height: 0;
  transition: max-height 0.35s cubic-bezier(0.16,1,0.3,1);
}

.nav__mobile.is-open {
  /* Tall enough for all items; scrolls within the panel on short screens */
  max-height: calc(100vh - 72px);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.nav__mobile a {
  display: block;
  padding: var(--space-4) clamp(var(--space-6), 5vw, var(--space-16));
  font-family: var(--font-body);
  font-size: var(--text-base);
  color: var(--color-text-muted);
  text-decoration: none;
  border-bottom: none;
  transition: color var(--transition-interactive), background var(--transition-interactive);
}
.nav__mobile a:hover { color: var(--color-text); background: var(--color-surface); }

.nav__mobile-actions {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding: var(--space-6) clamp(var(--space-6), 5vw, var(--space-16));
}

@media (max-width: 768px) {
  .nav__links,
  .nav__actions { display: none; }
  .nav__burger { display: flex; }
  .nav__mobile { display: flex; }
}

/* ═══════════════════════════════════════════════════════════════════════
   HERO — Video background, content anchored to bottom-left / bottom-right
   ═══════════════════════════════════════════════════════════════════════ */
.hero {
  position: relative;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  overflow: hidden;
  background: #F6F2F8; /* fallback while video loads */
}

/* Full-bleed background video */
.hero__video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  z-index: 0;
  display: block;
  pointer-events: none;
}

/* Removed: .hero__bg (orb container no longer used) */
.hero__bg { display: none; }

/* ── CSS @PROPERTY — animatable custom properties for color breathing ── */
@property --orb-color-a {
  syntax: '<color>';
  inherits: false;
  initial-value: rgba(196, 181, 212, 0.28);
}
@property --orb-color-b {
  syntax: '<color>';
  inherits: false;
  initial-value: rgba(184, 216, 234, 0.16);
}
@property --orb-color-c {
  syntax: '<color>';
  inherits: false;
  initial-value: rgba(242, 196, 187, 0.22);
}
@property --orb-color-d {
  syntax: '<color>';
  inherits: false;
  initial-value: rgba(200, 230, 192, 0.18);
}

/* ── AURORA ORB BASE — reduced opacity/size for restraint ──────────────── */
.hero__orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(90px);
  mix-blend-mode: multiply;
  will-change: transform;
}

/* ── ORB 1 — Lavender/Sky — top-right ─────────────────────────────────── */
.hero__orb--1 {
  --orb-color-a: rgba(196, 181, 212, 0.28);
  --orb-color-b: rgba(184, 216, 234, 0.16);
  width: 560px;
  height: 560px;
  background: radial-gradient(circle at 40% 40%,
    var(--orb-color-a) 0%,
    var(--orb-color-b) 45%,
    transparent 70%
  );
  top: -20%;
  right: -10%;
  transform-origin: calc(50% - 120px) calc(50% + 200px);
  animation:
    aurora-orbit-cw 22s ease-in-out infinite,
    aurora-breathe-1 16s ease-in-out infinite;
}

/* ── ORB 2 — Blush/Gold — bottom-left ──────────────────────────────────── */
.hero__orb--2 {
  --orb-color-c: rgba(242, 196, 187, 0.22);
  width: 440px;
  height: 440px;
  background: radial-gradient(circle at 50% 50%,
    var(--orb-color-c) 0%,
    rgba(245, 201, 122, 0.12) 45%,
    transparent 70%
  );
  bottom: -5%;
  left: -5%;
  transform-origin: calc(50% + 180px) calc(50% - 160px);
  animation:
    aurora-orbit-ccw 18s ease-in-out infinite,
    aurora-breathe-2 20s ease-in-out infinite;
  animation-delay: -6s, -3s;
}

/* ── ORB 3 — Sage/Lavender — center, gentle pulse ──────────────────────── */
.hero__orb--3 {
  --orb-color-d: rgba(200, 230, 192, 0.16);
  width: 340px;
  height: 340px;
  background: radial-gradient(circle at 50% 50%,
    var(--orb-color-d) 0%,
    rgba(196, 181, 212, 0.12) 50%,
    transparent 70%
  );
  top: 35%;
  left: 30%;
  transform-origin: 50% 50%;
  animation:
    aurora-pulse 14s ease-in-out infinite,
    aurora-breathe-3 18s ease-in-out infinite;
  animation-delay: -4s, -8s;
}

/* ── ORB 4 — Sky blue — top-left ────────────────────────────────────────── */
.hero__orb--4 {
  width: 400px;
  height: 400px;
  background: radial-gradient(circle at 45% 55%,
    rgba(184, 216, 234, 0.20) 0%,
    rgba(200, 230, 192, 0.12) 45%,
    transparent 68%
  );
  top: -5%;
  left: -10%;
  transform-origin: calc(50% + 200px) calc(50% + 140px);
  animation: aurora-orbit-cw 28s ease-in-out infinite;
  animation-delay: -12s;
  filter: blur(100px);
  mix-blend-mode: multiply;
}

/* ── ORB 5 — Warm gold/blush — bottom-right ─────────────────────────────── */
.hero__orb--5 {
  width: 300px;
  height: 300px;
  background: radial-gradient(circle at 50% 50%,
    rgba(245, 201, 122, 0.16) 0%,
    rgba(242, 196, 187, 0.10) 45%,
    transparent 68%
  );
  bottom: 10%;
  right: 12%;
  transform-origin: calc(50% - 160px) calc(50% - 120px);
  animation: aurora-orbit-ccw 24s ease-in-out infinite;
  animation-delay: -9s;
  filter: blur(80px);
  mix-blend-mode: multiply;
}

/* ── AURORA KEYFRAMES ───────────────────────────────────────────────────── */
@keyframes aurora-orbit-cw {
  0%   { transform: rotate(0deg)   translate(0px, 0px)   scale(1); }
  25%  { transform: rotate(5deg)   translate(30px, -20px) scale(1.05); }
  50%  { transform: rotate(0deg)   translate(50px, 10px)  scale(0.97); }
  75%  { transform: rotate(-4deg)  translate(20px, 30px)  scale(1.03); }
  100% { transform: rotate(0deg)   translate(0px, 0px)   scale(1); }
}

@keyframes aurora-orbit-ccw {
  0%   { transform: rotate(0deg)   translate(0px, 0px)    scale(1); }
  25%  { transform: rotate(-6deg)  translate(-25px, 20px) scale(1.04); }
  50%  { transform: rotate(0deg)   translate(-40px, -15px) scale(0.98); }
  75%  { transform: rotate(5deg)   translate(-15px, -30px) scale(1.02); }
  100% { transform: rotate(0deg)   translate(0px, 0px)    scale(1); }
}

@keyframes aurora-pulse {
  0%, 100% { transform: translate(0, 0) scale(1); }
  30%       { transform: translate(20px, -15px) scale(1.06); }
  60%       { transform: translate(-15px, 20px) scale(0.95); }
}

@keyframes aurora-breathe-1 {
  0%, 100% {
    --orb-color-a: rgba(196, 181, 212, 0.28);
    --orb-color-b: rgba(184, 216, 234, 0.16);
  }
  40% {
    --orb-color-a: rgba(184, 216, 234, 0.24);
    --orb-color-b: rgba(200, 230, 192, 0.18);
  }
  70% {
    --orb-color-a: rgba(242, 196, 187, 0.22);
    --orb-color-b: rgba(196, 181, 212, 0.16);
  }
}

@keyframes aurora-breathe-2 {
  0%, 100% { --orb-color-c: rgba(242, 196, 187, 0.22); }
  35%      { --orb-color-c: rgba(245, 201, 122, 0.18); }
  70%      { --orb-color-c: rgba(200, 230, 192, 0.18); }
}

@keyframes aurora-breathe-3 {
  0%, 100% { --orb-color-d: rgba(200, 230, 192, 0.16); }
  40%      { --orb-color-d: rgba(184, 216, 234, 0.20); }
  75%      { --orb-color-d: rgba(196, 181, 212, 0.18); }
}

/* Subtle grid — very faint */
.hero__grid {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(196, 181, 212, 0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(196, 181, 212, 0.04) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: radial-gradient(ellipse 70% 60% at 50% 50%, black 20%, transparent 100%);
  -webkit-mask-image: radial-gradient(ellipse 70% 60% at 50% 50%, black 20%, transparent 100%);
}

@media (prefers-reduced-motion: reduce) {
  .hero__orb { animation: none !important; }
}

/* Hero content — full-width bar at bottom, left content + right proof */
.hero__content {
  position: relative;
  z-index: 1;
  width: 100%;
  padding-top: clamp(60px, 8vh, 120px);
  padding-bottom: clamp(var(--space-8), 4vw, var(--space-12));
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: end;
  gap: var(--space-6) var(--space-12);
}

/* Left: badge, heading, sub, CTAs */
.hero__left {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
  gap: var(--space-4);
  max-width: 720px;
  grid-column: 1;
  grid-row: 1;
}

/* Badge — soft glass style */
.hero__badge {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--color-gray);
  background: #E8E8EA;
  border: 1px solid rgba(201, 168, 76, 0.30);
  padding: var(--space-2) var(--space-5);
  border-radius: var(--radius-full);
  backdrop-filter: blur(8px);
}

[data-theme='dark'] .hero__badge {
  color: var(--pastel-gold);
  background: rgba(201, 168, 76, 0.08);
  border-color: rgba(201, 168, 76, 0.20);
}

.hero__badge-dot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--color-gold);
  animation: pulse-dot 2.5s ease-in-out infinite;
}

@keyframes pulse-dot {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%       { opacity: 0.5; transform: scale(0.65); }
}

.hero__heading {
  font-family: var(--font-display);
  font-size: clamp(1.75rem, 3.5vw, 3rem);
  font-weight: 400;
  letter-spacing: -0.02em;
  color: var(--color-text);
  line-height: 1.1;
  max-width: 14ch;
  text-shadow: none;
}

.hero__heading em {
  font-style: normal;
  color: var(--color-primary);
  display: block;
  background: none;
  -webkit-background-clip: unset;
  background-clip: unset;
  -webkit-text-fill-color: currentColor;
}

[data-theme='dark'] .hero__heading em {
  color: var(--color-primary);
  background: none;
  -webkit-background-clip: unset;
  background-clip: unset;
  -webkit-text-fill-color: currentColor;
}

.hero__sub {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  color: var(--color-text-muted);
  max-width: 52ch;
  line-height: 1.7;
  font-weight: 300;
  text-shadow: none;
}

.hero__ctas {
  display: flex;
  align-items: center;
  gap: var(--space-4);
  flex-wrap: wrap;
  justify-content: flex-start;
}

.hero__proof {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  flex-wrap: nowrap;
  justify-content: flex-end;
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 500;
  color: #7B6E8A;
  grid-column: 2;
  grid-row: 1;
  align-self: end;
  white-space: nowrap;
  padding-bottom: 2px; /* align baseline with CTA buttons */
}

.proof-dot { opacity: 0.4; }

.hero__scroll-hint {
  display: none;
}

.hero__scroll-hint span {
  display: none;
}

@media (max-width: 860px) {
  .hero__content {
    grid-template-columns: 1fr;
  }
  .hero__left {
    grid-column: 1;
    grid-row: 1;
  }
  .hero__proof {
    grid-column: 1;
    grid-row: 2;
    justify-content: flex-start;
    flex-wrap: wrap;
    white-space: normal;
    margin-top: var(--space-4);
  }
}

@media (max-width: 640px) {
  .hero__ctas { flex-direction: column; align-items: stretch; }
  .hero__ctas .btn { text-align: center; }
  .hero__sub { font-size: var(--text-sm); }
}

/* ═══════════════════════════════════════════════════════════════════════
   FEATURES GRID — static 2×4 pill grid replacing the ticker
   ═══════════════════════════════════════════════════════════════════════ */
.features-grid {
  background: #FFFFFF;
  padding-block: clamp(var(--space-8), 4vw, var(--space-12));
  border-top: none;
  border-bottom: none;
}

.features-grid__inner {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 16px 20px;
  max-width: 1100px;
  margin-inline: auto;
}

.feature-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  justify-content: flex-start;
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 500;
  color: var(--color-text);
  text-decoration: none;
  background: #FFFFFF;
  border-radius: var(--radius-full);
  padding: var(--space-3) var(--space-6) var(--space-3) var(--space-4);
  box-shadow: 0 6px 20px rgba(72, 60, 81, 0.20);
  white-space: nowrap;
  transition: box-shadow var(--transition-interactive), transform var(--transition-interactive);
  cursor: default;
}

.feature-pill:hover {
  box-shadow: 0 10px 28px rgba(72, 60, 81, 0.26);
  transform: translateY(-1px);
}

@media (max-width: 900px) {
  .features-grid__inner {
    gap: 12px 14px;
  }
}

@media (max-width: 600px) {
  .features-grid__inner {
    gap: 10px 12px;
  }
  .feature-pill {
    font-size: var(--text-xs);
    padding: var(--space-2) var(--space-4) var(--space-2) var(--space-3);
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   WHAT IS AURALENSE — white bg
   ═══════════════════════════════════════════════════════════════════════ */
.what {
  padding-block: clamp(var(--space-16), 8vw, var(--space-32));
  /* Very light warm gray for subtle separation from surrounding white sections. */
  background: #F8F7F9;
}

.what__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(var(--space-12), 6vw, var(--space-20));
  align-items: center;
}

/* ── WHAT IS — vertical stack layout ─────────────────────────────────── */
.what__stack {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: var(--space-8);
}

.what__eyebrow {
  justify-content: center;
}

.what__body-wrap {
  max-width: 780px;
  width: 100%;
}

.what__body-wrap .what__body {
  max-width: 100%;
  text-align: center;
  margin-bottom: var(--space-5);
}

.what__stack .what__heading {
  text-align: center;
}

.what__stack .what__card-stack {
  max-width: 640px;
  width: 100%;
}

/* Left-aligned text block — eyebrow/h2/body share same left edge */
.what__text .eyebrow,
.what__text h2,
.what__text p,
.what__text .btn {
  margin-left: 0;
}

.what__heading {
  font-family: var(--font-display);
  font-size: var(--text-3xl);
  font-weight: 400;
  color: var(--color-text);
  line-height: 1.05;
  margin-bottom: var(--space-6);
}

.what__heading em {
  font-style: normal;
  color: var(--color-gold);
}

[data-theme='dark'] .what__heading em {
  color: var(--pastel-gold);
}

.what__body {
  font-family: var(--font-body);
  font-size: var(--text-base);
  color: var(--color-text-muted);
  line-height: 1.8;
  margin-bottom: var(--space-5);
  max-width: 52ch;
  font-weight: 300;
}

.what__text .btn { margin-top: var(--space-4); }

/* Card stack visual */
.what__card-stack {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-4);
}

.what__card {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl);
  padding: var(--space-5);
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  transition: transform var(--transition-slow), box-shadow var(--transition-slow);
  box-shadow: var(--shadow-sm);
}

/* Subtle pastel gradient on each card — internal only */
.what__card--1 {
  transform: none;
  background: linear-gradient(135deg, rgba(196,181,212,0.12) 0%, #FFFFFF 100%);
}
.what__card--2 {
  transform: none;
  background: linear-gradient(135deg, rgba(242,196,187,0.12) 0%, #FFFFFF 100%);
}
.what__card--3 {
  transform: none;
  background: linear-gradient(135deg, rgba(184,216,234,0.12) 0%, #FFFFFF 100%);
}
.what__card--4 {
  transform: none;
  background: linear-gradient(135deg, rgba(200,230,192,0.12) 0%, #FFFFFF 100%);
}

[data-theme='dark'] .what__card--1 { background: linear-gradient(135deg, rgba(156,140,184,0.10) 0%, var(--color-surface) 100%); }
[data-theme='dark'] .what__card--2 { background: linear-gradient(135deg, rgba(196,136,126,0.08) 0%, var(--color-surface) 100%); }
[data-theme='dark'] .what__card--3 { background: linear-gradient(135deg, rgba(122,174,200,0.08) 0%, var(--color-surface) 100%); }
[data-theme='dark'] .what__card--4 { background: linear-gradient(135deg, rgba(136,184,130,0.08) 0%, var(--color-surface) 100%); }

.what__card:hover {
  transform: translateY(-4px) rotate(0);
  box-shadow: var(--shadow-md), var(--shadow-glow);
}

.what__card--1:hover,
.what__card--2:hover,
.what__card--3:hover,
.what__card--4:hover { transform: rotate(0) translateY(-4px); }

.what__card-icon {
  width: 40px;
  height: 40px;
  border-radius: var(--radius-md);
  background: var(--icon-purple-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--icon-purple-fg);
  flex-shrink: 0;
}

.what__card span:not(.what__card-status) {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 600;
  color: var(--color-text);
}

.what__card-status {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 500;
  padding: 2px var(--space-3);
  border-radius: var(--radius-full);
  display: inline-block;
  align-self: flex-start;
}

.what__card-status--live {
  background: var(--color-gold-light);
  color: var(--color-gold);
  border: 1px solid var(--color-gold-border);
}

@media (max-width: 768px) {
  .what__inner { grid-template-columns: 1fr; }
  .what__visual { order: -1; }
  .what__stack .what__card-stack { max-width: 100%; }
}

@media (max-width: 480px) {
  .what__card-stack { grid-template-columns: 1fr 1fr; gap: var(--space-3); }
  .what__card--1,
  .what__card--2,
  .what__card--3,
  .what__card--4 { transform: none; }
}

/* ═══════════════════════════════════════════════════════════════════════
   PLATFORM MODULES — white bg (was pastel wash)
   ═══════════════════════════════════════════════════════════════════════ */
.modules {
  padding-block: clamp(var(--space-16), 8vw, var(--space-32));
  background: var(--color-bg);
}

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

/* Featured card */
.module-card--featured {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: start;
  gap: var(--space-6);
  background: linear-gradient(
    135deg,
    rgba(72, 60, 81, 0.06) 0%,
    rgba(201, 168, 76, 0.06) 50%,
    rgba(184, 216, 234, 0.08) 100%
  );
  border: 1px solid rgba(201, 168, 76, 0.25);
}

.module-card--featured h3 {
  font-size: var(--text-xl);
}

.module-card--featured p {
  max-width: 60ch;
}

.module-card--featured .module-card__tags {
  align-self: center;
}

.module-card {
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl);
  padding: var(--space-8);
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  transition: transform var(--transition-slow), box-shadow var(--transition-slow), border-color var(--transition-slow);
  box-shadow: var(--shadow-sm);
}

.module-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-md), var(--shadow-glow);
  border-color: rgba(201, 168, 76, 0.35);
}

/* Icon base */
.module-card__icon {
  width: 48px;
  height: 48px;
  border-radius: var(--radius-lg);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  /* Default purple */
  background: var(--icon-purple-bg);
  color: var(--icon-purple-fg);
}

/* Icon color variants */
.module-card__icon--red    { background: var(--icon-red-bg);    color: var(--icon-red-fg); }
.module-card__icon--blue   { background: var(--icon-blue-bg);   color: var(--icon-blue-fg); }
.module-card__icon--yellow { background: var(--icon-yellow-bg); color: var(--icon-yellow-fg); }
.module-card__icon--green  { background: var(--icon-green-bg);  color: var(--icon-green-fg); }
.module-card__icon--purple { background: var(--icon-purple-bg); color: var(--icon-purple-fg); }

.module-card h3 {
  font-family: var(--font-display);
  font-size: var(--text-lg);
  font-weight: 400;
  color: var(--color-text);
  line-height: 1.2;
}

.module-card p {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  color: var(--color-text-muted);
  line-height: 1.7;
  flex: 1;
  max-width: 100%;
}

.module-card__tags {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  margin-top: auto;
}

.module-card__tags span {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 500;
  color: var(--color-gray);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  padding: 3px var(--space-3);
  border-radius: var(--radius-full);
}

[data-theme='dark'] .module-card__tags span {
  color: var(--pastel-lavender);
  background: rgba(196, 181, 212, 0.08);
  border-color: rgba(196, 181, 212, 0.20);
}

@media (max-width: 900px) {
  .modules__grid { grid-template-columns: repeat(2, 1fr); }
  .module-card--featured {
    grid-template-columns: auto 1fr;
    grid-column: 1 / -1;
  }
  .module-card--featured .module-card__tags { grid-column: 1 / -1; }
}

@media (max-width: 560px) {
  .modules__grid { grid-template-columns: 1fr; }
  .module-card--featured { grid-template-columns: 1fr; }
}

/* ═══════════════════════════════════════════════════════════════════════
   GROWTH NETWORK — white bg
   ═══════════════════════════════════════════════════════════════════════ */
.growth {
  padding-block: clamp(var(--space-16), 8vw, var(--space-32));
  position: relative;
  overflow: hidden;
  background: var(--color-surface);
}

/* Restrained iridescent flare */
.growth::before {
  content: '';
  position: absolute;
  top: -150px;
  right: -150px;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle,
    rgba(201, 168, 76, 0.10) 0%,
    rgba(196, 181, 212, 0.08) 40%,
    transparent 70%
  );
  filter: blur(60px);
  pointer-events: none;
}

.growth::after {
  content: '';
  position: absolute;
  bottom: -100px;
  left: -100px;
  width: 300px;
  height: 300px;
  background: radial-gradient(circle,
    rgba(184, 216, 234, 0.10) 0%,
    rgba(200, 230, 192, 0.08) 40%,
    transparent 70%
  );
  filter: blur(60px);
  pointer-events: none;
}

.growth__inner {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: clamp(var(--space-12), 6vw, var(--space-20));
  align-items: center;
  position: relative;
  z-index: 1;
}

/* Left-aligned text block */
.growth__text .eyebrow,
.growth__text h2,
.growth__text p,
.growth__text .btn {
  margin-left: 0;
}

.growth__text h2 {
  font-family: var(--font-display);
  font-size: var(--text-3xl);
  font-weight: 400;
  color: var(--color-text);
  line-height: 1.05;
  margin-bottom: var(--space-6);
}

.growth__text h2 em {
  font-style: normal;
  color: var(--color-gold);
}

[data-theme='dark'] .growth__text h2 em {
  color: var(--pastel-gold);
}

.growth__text p {
  font-family: var(--font-body);
  font-size: var(--text-base);
  color: var(--color-text-muted);
  line-height: 1.8;
  margin-bottom: var(--space-5);
  max-width: 52ch;
  font-weight: 300;
}

.growth__disciplines {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  margin-bottom: var(--space-8);
}

.growth__disciplines span {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 500;
  color: var(--color-text);
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  padding: var(--space-2) var(--space-4);
  border-radius: var(--radius-full);
  transition: border-color var(--transition-interactive), color var(--transition-interactive), background var(--transition-interactive);
  cursor: default;
}

.growth__disciplines span:hover {
  border-color: var(--color-gold-border);
  color: var(--color-gold);
  background: var(--color-gold-light);
}

[data-theme='dark'] .growth__disciplines span:hover {
  color: var(--pastel-gold);
  background: rgba(212, 184, 90, 0.08);
}

/* Stats grid */
.growth__stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-4);
}

.stat-card {
  background: #FFFFFF;
  border: none;
  border-radius: var(--radius-xl);
  padding: var(--space-6);
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  transition: transform var(--transition-slow), box-shadow var(--transition-slow);
  box-shadow: 0 4px 24px rgba(72, 60, 81, 0.10);
}

.stat-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 32px rgba(72, 60, 81, 0.14);
}

.stat-card__number {
  font-family: var(--font-display);
  font-size: var(--text-2xl);
  font-weight: 400;
  color: var(--color-gold);
  line-height: 1;
}

[data-theme='dark'] .stat-card__number {
  color: var(--pastel-gold);
}

.stat-card__label {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  color: var(--color-text-muted);
  font-weight: 400;
  line-height: 1.4;
}

@media (max-width: 768px) {
  .growth__inner { grid-template-columns: 1fr; }
}

/* ═══════════════════════════════════════════════════════════════════════
   INTEGRATIONS — very light surface (was pastel wash)
   ═══════════════════════════════════════════════════════════════════════ */
.integrations {
  padding-block: clamp(var(--space-16), 8vw, var(--space-32));
  background: var(--color-bg);
}

.integrations__grid {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  gap: var(--space-3);
  margin-top: var(--space-4);
}

.integration-item {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: var(--space-4) var(--space-3);
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 500;
  color: var(--color-text-muted);
  text-align: center;
  transition: all var(--transition-interactive);
  cursor: default;
  box-shadow: var(--shadow-sm);
}

.integration-item:hover {
  border-color: var(--color-gold-border);
  color: var(--color-gold);
  background: var(--color-gold-light);
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
}

[data-theme='dark'] .integration-item:hover {
  color: var(--pastel-gold);
  background: rgba(212, 184, 90, 0.08);
}

@media (max-width: 900px) {
  .integrations__grid { grid-template-columns: repeat(4, 1fr); }
}

@media (max-width: 480px) {
  .integrations__grid { grid-template-columns: repeat(3, 1fr); }
}

/* ═══════════════════════════════════════════════════════════════════════
   WHO IT'S FOR (ICP) — white bg
   ═══════════════════════════════════════════════════════════════════════ */
.icp {
  padding-block: clamp(var(--space-16), 8vw, var(--space-32));
  background: var(--color-surface);
}

.icp__grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: var(--space-5);
}

/* ICP cards — each with a unique subtle gradient (internal only) */
.icp-card {
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl);
  padding: var(--space-8) var(--space-6);
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  transition: transform var(--transition-slow), box-shadow var(--transition-slow), border-color var(--transition-slow);
  box-shadow: var(--shadow-sm);
}

.icp-card:nth-child(1) { background: linear-gradient(160deg, rgba(251,237,213,0.70) 0%, rgba(255,255,255,0.60) 70%); }
.icp-card:nth-child(2) { background: linear-gradient(160deg, rgba(237,234,242,0.70) 0%, rgba(255,255,255,0.60) 70%); }
.icp-card:nth-child(3) { background: linear-gradient(160deg, rgba(237,246,233,0.70) 0%, rgba(255,255,255,0.60) 70%); }
.icp-card:nth-child(4) { background: linear-gradient(160deg, rgba(237,246,233,0.70) 0%, rgba(255,255,255,0.60) 70%); }
.icp-card:nth-child(5) { background: linear-gradient(160deg, rgba(237,234,242,0.70) 0%, rgba(255,255,255,0.60) 70%); }

[data-theme='dark'] .icp-card:nth-child(1) { background: linear-gradient(160deg, rgba(163,100,100,0.08) 0%, var(--color-surface) 70%); }
[data-theme='dark'] .icp-card:nth-child(2) { background: linear-gradient(160deg, rgba(78,126,158,0.08) 0%, var(--color-surface) 70%); }
[data-theme='dark'] .icp-card:nth-child(3) { background: linear-gradient(160deg, rgba(150,118,52,0.08) 0%, var(--color-surface) 70%); }
[data-theme='dark'] .icp-card:nth-child(4) { background: linear-gradient(160deg, rgba(74,124,89,0.08) 0%, var(--color-surface) 70%); }
[data-theme='dark'] .icp-card:nth-child(5) { background: linear-gradient(160deg, rgba(106,84,144,0.08) 0%, var(--color-surface) 70%); }

.icp-card:hover {
  transform: translateY(-5px);
  box-shadow: var(--shadow-md), var(--shadow-glow);
  border-color: var(--color-gold-border);
}

/* ICP icon base */
.icp-card__icon {
  width: 52px;
  height: 52px;
  border-radius: var(--radius-lg);
  display: flex;
  align-items: center;
  justify-content: center;
  /* Default purple */
  background: var(--icon-purple-bg);
  color: var(--icon-purple-fg);
}

/* ICP icon color variants */
.icp-card__icon--red    { background: var(--icon-red-bg);    color: var(--icon-red-fg); }
.icp-card__icon--blue   { background: var(--icon-blue-bg);   color: var(--icon-blue-fg); }
.icp-card__icon--yellow { background: var(--icon-yellow-bg); color: var(--icon-yellow-fg); }
.icp-card__icon--green  { background: var(--icon-green-bg);  color: var(--icon-green-fg); }
.icp-card__icon--purple { background: var(--icon-purple-bg); color: var(--icon-purple-fg); }
.icp-card__icon--pink   { background: #FAECE9;               color: #A36464; }

[data-theme='dark'] .icp-card__icon,
[data-theme='dark'] .icp-card__icon--red,
[data-theme='dark'] .icp-card__icon--blue,
[data-theme='dark'] .icp-card__icon--yellow,
[data-theme='dark'] .icp-card__icon--green,
[data-theme='dark'] .icp-card__icon--purple {
  background: var(--icon-purple-bg);
  color: var(--icon-purple-fg);
}
[data-theme='dark'] .icp-card__icon--pink {
  background: rgba(163,100,100,0.15);
  color: #C4887E;
}

.icp-card h3 {
  font-family: var(--font-display);
  font-size: var(--text-base);
  font-weight: 400;
  color: var(--color-text);
  line-height: 1.3;
}

.icp-card p {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  color: var(--color-text-muted);
  line-height: 1.7;
  flex: 1;
  max-width: 100%;
}

@media (max-width: 1100px) {
  .icp__grid { grid-template-columns: repeat(3, 1fr); }
}

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

@media (max-width: 480px) {
  .icp__grid { grid-template-columns: 1fr; }
}

/* ═══════════════════════════════════════════════════════════════════════
   PRICING — white bg (was pastel wash)
   ═══════════════════════════════════════════════════════════════════════ */
.pricing {
  padding-block: clamp(var(--space-16), 8vw, var(--space-32));
  background: var(--color-bg);
}

.pricing__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-5);
  align-items: stretch;
}

.pricing-card {
  background: #FFFFFF;
  border: none;
  border-radius: 16px;
  padding: var(--space-8);
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  position: relative;
  min-height: 420px;
  box-shadow: 0 4px 24px rgba(72, 60, 81, 0.10);
  transition: transform var(--transition-slow), box-shadow var(--transition-slow);
}

.pricing-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 32px rgba(72, 60, 81, 0.16);
}

/* Featured card: same white surface, no gradient or colored border per spec */
.pricing-card--featured {
  background: #FFFFFF;
  border: none;
}

.pricing-card--featured:hover {
  transform: translateY(-4px);
}

/* MOST POPULAR badge: aubergine pill, white text, top-center, overlapping edge */
.pricing-card__badge {
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  background: #483C51;
  color: #FFFFFF;
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 5px var(--space-4);
  border-radius: var(--radius-full);
  white-space: nowrap;
}

.pricing-card__tier {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #483C51;
  text-align: left;
}

.pricing-card__price {
  display: flex;
  align-items: baseline;
  gap: var(--space-1);
}

.price-amount {
  font-family: var(--font-display);
  font-size: var(--text-4xl);
  font-weight: 400;
  color: #483C51;
  line-height: 1;
}

.price-period {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  color: var(--color-text-muted);
}

.pricing-card__desc {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  color: var(--color-text-muted);
  line-height: 1.6;
  text-align: left;
  max-width: 100%;
}

/* CTA button: full width, aubergine bg, white text */
.pricing-card__cta {
  display: block;
  width: 100%;
  text-align: center;
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 600;
  background: #483C51;
  color: #FFFFFF;
  border-radius: var(--radius-full);
  padding: 0.85em var(--space-5);
  text-decoration: none;
  transition: background var(--transition-interactive);
  margin-top: auto;
}

.pricing-card__cta:hover {
  background: #3a3042;
}

/* Features expand region */
.pricing-card__divider {
  height: 1px;
  background: var(--color-border);
  margin-top: var(--space-4);
}

.pricing-card__toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2);
  width: 100%;
  background: none;
  border: none;
  cursor: pointer;
  padding: var(--space-3) 0 0;
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 500;
  color: #483C51;
  text-align: left;
}

.pricing-card__chevron {
  color: #483C51;
  flex-shrink: 0;
  transition: transform var(--transition-interactive);
}

.pricing-card__toggle[aria-expanded='true'] .pricing-card__chevron {
  transform: rotate(180deg);
}

.pricing-card__panel {
  overflow: hidden;
  max-height: 0;
  opacity: 0;
  transition: max-height 0.35s ease, opacity 0.3s ease, margin-top 0.3s ease;
  margin-top: 0;
}

.pricing-card__panel.is-open {
  max-height: 600px;
  opacity: 1;
  margin-top: var(--space-3);
}

.pricing-card__features {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  margin: 0;
  padding: 0;
}

.pricing-card__features li {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  color: var(--color-text-muted);
  padding-left: var(--space-5);
  position: relative;
  max-width: 100%;
  text-align: left;
}

.pricing-card__features li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 7px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #C9A84C;
  opacity: 1;
}

@media (max-width: 1024px) {
  .pricing__grid { grid-template-columns: repeat(2, 1fr); }
  .pricing-card { min-height: 0; }
}

@media (max-width: 600px) {
  .pricing__grid { grid-template-columns: 1fr; }
}

/* PRICING CLOSING CTA */
.pricing-cta {
  background: #483C51;
  padding-block: clamp(var(--space-16), 8vw, var(--space-24));
}

.pricing-cta__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: var(--space-5);
}

.pricing-cta__headline {
  font-family: var(--font-display);
  font-weight: 400;
  color: #FFFFFF;
  text-align: center;
}

.pricing-cta__body {
  font-family: var(--font-body);
  font-size: var(--text-base);
  color: #F0EDF3;
  line-height: 1.6;
  max-width: 560px;
  text-align: center;
  margin: 0 auto;
}

.pricing-cta__btn {
  display: inline-block;
  font-family: var(--font-body);
  font-size: var(--text-base);
  font-weight: 600;
  background: #C9A84C;
  color: #483C51;
  border-radius: var(--radius-full);
  padding: 0.85em var(--space-8);
  text-decoration: none;
  transition: background var(--transition-interactive), transform var(--transition-interactive);
}

.pricing-cta__btn:hover {
  background: #b8983f;
  transform: translateY(-2px);
}


/* ═══════════════════════════════════════════════════════════════════════
   CTA BAND — plain white, border only (no gradient wash)
   ═══════════════════════════════════════════════════════════════════════ */
.cta-band {
  padding-block: clamp(var(--space-16), 8vw, var(--space-24));
  background: #483C51;
  border-top: none;
  border-bottom: none;
  position: relative;
  overflow: hidden;
}

/* Very subtle gold flare */
.cta-band::before {
  content: '';
  position: absolute;
  top: -80px;
  right: -80px;
  width: 280px;
  height: 280px;
  background: radial-gradient(circle,
    rgba(201, 168, 76, 0.12) 0%,
    rgba(196, 181, 212, 0.08) 40%,
    transparent 70%
  );
  filter: blur(50px);
  pointer-events: none;
}

.cta-band__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-10);
  flex-wrap: wrap;
  position: relative;
  z-index: 1;
}

.cta-band__text h2 {
  font-family: var(--font-display);
  font-size: var(--text-2xl);
  font-weight: 400;
  color: #FFFFFF;
  line-height: 1.1;
  margin-bottom: var(--space-3);
}

.cta-band__text h2 em {
  font-style: normal;
  color: #C9A84C;
}

[data-theme='dark'] .cta-band__text h2 em {
  color: #C9A84C;
}

.cta-band__text p {
  font-family: var(--font-body);
  font-size: var(--text-base);
  color: #F0EDF3;
  max-width: 52ch;
}

.cta-band__actions {
  display: flex;
  gap: var(--space-4);
  flex-shrink: 0;
  flex-wrap: wrap;
}

@media (max-width: 700px) {
  .cta-band__inner { flex-direction: column; align-items: flex-start; }
  .cta-band__actions { width: 100%; flex-direction: column; }
  .cta-band__actions .btn { width: 100%; justify-content: center; }
}

/* ═══════════════════════════════════════════════════════════════════════
   FOOTER
   ═══════════════════════════════════════════════════════════════════════ */
.footer {
  background: var(--color-surface);
  border-top: none;
}

.footer__inner {
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  gap: clamp(var(--space-10), 5vw, var(--space-20));
  padding-block: clamp(var(--space-12), 6vw, var(--space-20));
  align-items: start;
}

.footer__brand .nav__logo {
  margin-bottom: var(--space-4);
}

.footer__tagline {
  font-family: var(--font-body);
  font-size: var(--text-lg);
  font-weight: 400;
  font-style: normal;
  color: var(--color-text);
  margin-bottom: var(--space-2);
  max-width: 100%;
}

.footer__sub {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  color: var(--color-text-muted);
  max-width: 40ch;
  line-height: 1.6;
}

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

.footer__col {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.footer__col-title {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--color-text);
  margin-bottom: var(--space-1);
}

.footer__col a {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  color: var(--color-text-muted);
  text-decoration: none;
  transition: color var(--transition-interactive);
}

.footer__col a:hover { color: var(--color-primary); }

[data-theme='dark'] .footer__col a:hover { color: var(--pastel-lavender); }

/* Footer bottom bar */
.footer__bottom {
  border-top: none;
  padding-block: var(--space-5);
}

.footer__bottom-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--space-4);
}

.footer__bottom p {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  color: var(--color-text-faint);
  max-width: 100%;
}

.footer__investor-link {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 500;
  color: var(--color-text-faint);
  text-decoration: none;
  border: 1px solid var(--color-border);
  padding: var(--space-2) var(--space-4);
  border-radius: var(--radius-full);
  transition: all var(--transition-interactive);
}

.footer__investor-link:hover {
  color: var(--color-primary);
  border-color: rgba(72, 60, 81, 0.35);
  background: var(--color-primary-highlight);
}

[data-theme='dark'] .footer__investor-link:hover {
  color: var(--pastel-lavender);
  border-color: rgba(196, 181, 212, 0.30);
}

@media (max-width: 768px) {
  .footer__inner { grid-template-columns: 1fr; }
  .footer__links { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 420px) {
  .footer__links { grid-template-columns: 1fr; }
  .footer__bottom-inner { flex-direction: column; align-items: flex-start; }
}

/* ═══════════════════════════════════════════════════════════════════════
   SCROLL REVEAL ANIMATIONS
   ═══════════════════════════════════════════════════════════════════════ */
.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.6s cubic-bezier(0.16,1,0.3,1),
              transform 0.6s cubic-bezier(0.16,1,0.3,1);
}

.reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.reveal-delay-1 { transition-delay: 0.1s; }
.reveal-delay-2 { transition-delay: 0.2s; }
.reveal-delay-3 { transition-delay: 0.3s; }
.reveal-delay-4 { transition-delay: 0.4s; }
.reveal-delay-5 { transition-delay: 0.5s; }

/* ═══════════════════════════════════════════════════════════════════════
   FOUNDER STORY — surface bg
   ═══════════════════════════════════════════════════════════════════════ */
.founder-story {
  padding-block: clamp(var(--space-16), 8vw, var(--space-32));
  background: var(--color-surface);
  border-top: none;
}

.founder-story__inner {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: clamp(var(--space-12), 6vw, var(--space-20));
  align-items: start;
}

.founder-story__text p {
  font-family: var(--font-body);
  font-size: var(--text-base);
  color: var(--color-text-muted);
  line-height: 1.85;
  margin-bottom: var(--space-5);
  max-width: 60ch;
  font-weight: 300;
}

.founder-story__text p:last-child { margin-bottom: 0; }

.founder-story__quote {
  position: sticky;
  top: calc(64px + var(--space-8));
}

.founder-story__quote blockquote {
  background: linear-gradient(
    135deg,
    rgba(72, 60, 81, 0.05) 0%,
    rgba(201, 168, 76, 0.05) 50%,
    rgba(184, 216, 234, 0.06) 100%
  );
  border: 1px solid var(--color-border);
  border-left: 4px solid var(--color-gold);
  border-radius: var(--radius-xl);
  padding: var(--space-8);
  box-shadow: var(--shadow-md);
}

.founder-story__quote blockquote p {
  font-family: var(--font-display);
  font-size: var(--text-lg);
  font-style: normal;
  color: var(--color-text);
  line-height: 1.6;
  margin-bottom: var(--space-6);
  max-width: 100%;
}

.founder-story__quote blockquote footer {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.founder-story__quote blockquote footer strong {
  font-family: var(--font-display);
  font-size: var(--text-base);
  font-weight: 400;
  color: var(--color-primary);
}

[data-theme='dark'] .founder-story__quote blockquote footer strong {
  color: var(--pastel-lavender);
}

.founder-story__quote blockquote footer span {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  color: var(--color-text-muted);
}

@media (max-width: 768px) {
  .founder-story__inner { grid-template-columns: 1fr; }
  .founder-story__quote { position: static; }
}

/* ═══════════════════════════════════════════════════════════════════════
   FOUNDER BIO — white bg
   ═══════════════════════════════════════════════════════════════════════ */
.founder-bio {
  padding-block: clamp(var(--space-16), 8vw, var(--space-32));
  background: var(--color-bg);
}

.founder-bio__inner {
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: clamp(var(--space-10), 5vw, var(--space-16));
  align-items: start;
  max-width: 900px;
  margin-inline: auto;
}

.founder-bio__avatar {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-4);
}

.founder-bio__monogram {
  width: 180px;
  height: 180px;
  border-radius: var(--radius-xl);
  background: linear-gradient(
    135deg,
    rgba(72, 60, 81, 0.12) 0%,
    rgba(201, 168, 76, 0.10) 50%,
    rgba(184, 216, 234, 0.14) 100%
  );
  border: 1.5px solid var(--color-gold-border);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-display);
  font-size: var(--text-3xl);
  font-style: normal;
  color: var(--color-primary);
  letter-spacing: -0.02em;
  box-shadow: var(--shadow-md), var(--shadow-glow);
}

[data-theme='dark'] .founder-bio__monogram {
  color: var(--pastel-lavender);
}

.founder-bio__name {
  font-family: var(--font-display);
  font-size: var(--text-xl);
  font-weight: 400;
  color: var(--color-text);
  margin-bottom: var(--space-1);
}

.founder-bio__title {
  display: inline-block;
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--color-gray);
  margin-bottom: var(--space-6);
}

[data-theme='dark'] .founder-bio__title {
  color: var(--pastel-lavender);
}

.founder-bio__content p {
  font-family: var(--font-body);
  font-size: var(--text-base);
  color: var(--color-text-muted);
  line-height: 1.85;
  margin-bottom: var(--space-5);
  max-width: 62ch;
  font-weight: 300;
}

.founder-bio__content p:last-of-type { margin-bottom: var(--space-6); }

.founder-bio__links { display: flex; gap: var(--space-3); flex-wrap: wrap; }

@media (max-width: 640px) {
  .founder-bio__inner { grid-template-columns: 1fr; }
  .founder-bio__avatar { flex-direction: row; align-items: center; }
  .founder-bio__monogram { width: 80px; height: 80px; font-size: var(--text-xl); }
}

/* ═══════════════════════════════════════════════════════════════════════
   ADVISORY BOARD — surface bg (alternates with white)
   ═══════════════════════════════════════════════════════════════════════ */
.advisory {
  padding-block: clamp(var(--space-16), 8vw, var(--space-32));
  background: var(--color-surface);
}

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

.advisor-card {
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl);
  padding: var(--space-7, 1.75rem) var(--space-6);
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  transition: transform var(--transition-slow), box-shadow var(--transition-slow), border-color var(--transition-slow);
  box-shadow: var(--shadow-sm);
}

.advisor-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-md), var(--shadow-glow);
  border-color: var(--color-gold-border);
}

.advisor-card--pending {
  opacity: 0.6;
  border-style: dashed;
}

.advisor-card--pending:hover {
  opacity: 0.85;
  border-style: dashed;
  border-color: var(--color-gold-border);
}

.advisor-card__initials {
  width: 52px;
  height: 52px;
  border-radius: var(--radius-lg);
  background: var(--icon-purple-bg);
  border: 1px solid rgba(201, 168, 76, 0.20);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-display);
  font-size: var(--text-base);
  font-style: normal;
  color: var(--color-primary);
  font-weight: 400;
  flex-shrink: 0;
}

[data-theme='dark'] .advisor-card__initials {
  background: rgba(196, 181, 212, 0.10);
  border-color: rgba(196, 181, 212, 0.22);
  color: var(--pastel-lavender);
}

.advisor-card__info h3 {
  font-family: var(--font-display);
  font-size: var(--text-base);
  font-weight: 400;
  color: var(--color-text);
  margin-bottom: var(--space-1);
}

.advisor-card__info span {
  display: block;
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 700;
  color: var(--color-gray);
  margin-bottom: var(--space-3);
  text-transform: uppercase;
  letter-spacing: 0.09em;
}

[data-theme='dark'] .advisor-card__info span {
  color: var(--pastel-lavender);
}

.advisor-card__info p {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  color: var(--color-text-muted);
  line-height: 1.7;
  max-width: 100%;
}

.advisor-card__linkedin {
  display: inline-flex;
  align-items: center;
  gap: 0.35em;
  font-family: var(--font-body);
  font-size: var(--text-xs);
  color: var(--color-gray);
  text-decoration: none;
  margin-top: auto;
  padding-top: var(--space-3);
  opacity: 0.8;
  transition: opacity var(--transition-interactive), color var(--transition-interactive);
}

[data-theme='dark'] .advisor-card__linkedin {
  color: var(--pastel-lavender);
}

.advisor-card__linkedin:hover {
  opacity: 1;
  text-decoration: underline;
}

.advisor-card__linkedin svg {
  width: 13px;
  height: 13px;
  flex-shrink: 0;
}

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

@media (max-width: 520px) {
  .advisory__grid { grid-template-columns: 1fr; }
}

/* ═══════════════════════════════════════════════════════════════════════
   TEAM — white bg
   ═══════════════════════════════════════════════════════════════════════ */
.team {
  padding-block: clamp(var(--space-16), 8vw, var(--space-32));
  background: var(--color-bg);
}

.team__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-5);
}

.team-card {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl);
  padding: var(--space-8) var(--space-6);
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: var(--space-3);
  transition: transform var(--transition-slow), box-shadow var(--transition-slow), border-color var(--transition-slow);
  box-shadow: var(--shadow-sm);
}

/* Unique pastel tints per team card — internal only */
.team-card:nth-child(1) { background: linear-gradient(180deg, rgba(196,181,212,0.10) 0%, var(--color-surface) 60%); }
.team-card:nth-child(2) { background: linear-gradient(180deg, rgba(184,216,234,0.10) 0%, var(--color-surface) 60%); }
.team-card:nth-child(3) { background: linear-gradient(180deg, rgba(242,196,187,0.10) 0%, var(--color-surface) 60%); }
.team-card:nth-child(4) { background: linear-gradient(180deg, rgba(200,230,192,0.10) 0%, var(--color-surface) 60%); }

.team-card:hover {
  transform: translateY(-5px);
  box-shadow: var(--shadow-md), var(--shadow-glow);
  border-color: var(--color-gold-border);
}

.team-card__avatar {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: linear-gradient(135deg, rgba(72,60,81,0.12), rgba(201,168,76,0.10));
  border: 2px solid var(--color-gold-border);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-display);
  font-size: var(--text-base);
  font-style: normal;
  font-weight: 400;
  color: var(--color-primary);
  margin-bottom: var(--space-2);
  flex-shrink: 0;
}

.team-card__avatar--muted {
  background: rgba(196, 181, 212, 0.12);
  border-color: var(--color-border);
  color: var(--color-text-muted);
}

.team-card--muted {
  opacity: 0.65;
}

.team-card--muted:hover {
  opacity: 0.9;
}

.team-card h3 {
  font-family: var(--font-display);
  font-size: var(--text-base);
  font-weight: 400;
  color: var(--color-text);
  line-height: 1.2;
}

.team-card span {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--color-gray);
  line-height: 1.3;
}

[data-theme='dark'] .team-card span { color: var(--pastel-lavender); }

.team-card p {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  color: var(--color-text-muted);
  line-height: 1.7;
  max-width: 100%;
  margin-top: var(--space-1);
}

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

@media (max-width: 480px) {
  .team__grid { grid-template-columns: 1fr; }
}

/* ═══════════════════════════════════════════════════════════════════════
   CAREERS — surface bg
   ═══════════════════════════════════════════════════════════════════════ */
.careers {
  padding-block: clamp(var(--space-12), 8vw, var(--space-24));
  background: var(--color-surface);
}

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

.career-card {
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl);
  padding: var(--space-8);
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  transition: border-color var(--transition-interactive), transform var(--transition-interactive), box-shadow var(--transition-interactive);
  box-shadow: var(--shadow-sm);
}

.career-card:hover {
  border-color: var(--color-gold-border);
  transform: translateY(-2px);
  box-shadow: var(--shadow-md), var(--shadow-glow);
}

.career-card--featured {
  background: linear-gradient(
    135deg,
    rgba(72, 60, 81, 0.05) 0%,
    rgba(201, 168, 76, 0.05) 50%,
    var(--color-bg) 100%
  );
  border-color: var(--color-gold-border);
  box-shadow: var(--shadow-md);
  grid-column: span 2;
}

.career-card--open {
  background: var(--color-surface);
  border-style: dashed;
  border-color: var(--color-border);
}

.career-card__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2);
  flex-wrap: wrap;
}

.career-card__dept {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.10em;
  color: var(--color-gray);
}

[data-theme='dark'] .career-card__dept {
  color: var(--pastel-lavender);
}

.career-card__type {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  color: var(--color-text-muted);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-full);
  padding: 0.2em 0.75em;
  white-space: nowrap;
}

.career-card__type--equity {
  background: var(--color-gold-light);
  border-color: var(--color-gold-border);
  color: var(--color-gold);
}

[data-theme='dark'] .career-card__type--equity {
  color: var(--pastel-gold);
}

.career-card h3 {
  font-family: var(--font-display);
  font-size: var(--text-lg);
  font-weight: 400;
  color: var(--color-text);
  line-height: 1.25;
}

.career-card p {
  font-family: var(--font-body);
  font-size: var(--text-base);
  color: var(--color-text-muted);
  line-height: 1.65;
  flex: 1;
}

.career-card__skills {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
}

.career-card__skills span {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  color: var(--color-text-muted);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-full);
  padding: 0.25em 0.75em;
}

.career-card__section {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.career-card__section-label {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.10em;
  color: var(--color-gray);
}

.career-card__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.career-card__list li {
  font-family: var(--font-body);
  font-size: var(--text-base);
  color: var(--color-text-muted);
  line-height: 1.6;
  padding-left: var(--space-4);
  position: relative;
}

.career-card__list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.6em;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--color-gold);
  opacity: 0.7;
}

.career-card__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  padding-top: var(--space-4);
  border-top: none;
  flex-wrap: wrap;
}

.career-card__location {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  color: var(--color-text-faint);
  display: flex;
  align-items: center;
  gap: var(--space-1);
}

.career-card__location::before {
  content: '';
  display: inline-block;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--color-gold);
  flex-shrink: 0;
  opacity: 0.7;
}

@media (max-width: 1024px) {
  .careers__grid { grid-template-columns: repeat(2, 1fr); }
  .career-card--featured { grid-column: span 2; }
}

@media (max-width: 640px) {
  .careers__grid { grid-template-columns: 1fr; }
  .career-card--featured { grid-column: span 1; }
}


/* ── PAGE HERO (inner pages) ─────────────────────────────────────────────── */
.page-hero {
  background: var(--color-surface);
  border-bottom: none;
  padding: clamp(var(--space-16), 10vw, var(--space-24)) 0 clamp(var(--space-12), 6vw, var(--space-16));
  padding-top: calc(clamp(var(--space-16), 10vw, var(--space-24)) + 80px);
}
.page-hero .eyebrow { margin-bottom: var(--space-4); justify-content: flex-start; }
.page-hero h1 {
  font-family: var(--font-display);
  font-size: var(--text-3xl);
  font-weight: 400;
  line-height: 1.1;
  letter-spacing: -0.02em;
  color: var(--color-text);
  margin-bottom: var(--space-4);
}
.page-hero h1 em { font-style: normal; color: var(--color-primary); }
.page-hero__sub {
  font-family: var(--font-body);
  font-size: var(--text-base);
  color: var(--color-text-muted);
  line-height: 1.6;
}

/* ── FOUNDER QUOTE SECTION ───────────────────────────────────────────────── */
.founder-quote-section {
  padding: clamp(var(--space-16), 8vw, var(--space-24)) 0;
  background: var(--color-surface);
  border-bottom: none;
}
.founder-quote-section--page {
  padding-top: calc(clamp(var(--space-16), 8vw, var(--space-24)) + 80px);
}
.founder-quote-section__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-5);
  max-width: 720px;
  margin: 0 auto;
  text-align: center;
}
.founder-quote-section__inner .founder-story__quote {
  width: 100%;
}
.founder-quote-section__link {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 500;
  color: var(--color-text-muted);
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color var(--transition-interactive);
}
.founder-quote-section__link:hover { color: var(--color-primary); }

/* ── TRUST SIGNAL ────────────────────────────────────────────────────────── */
.trust-signal {
  padding: var(--space-8) 0;
  border-top: none;
  border-bottom: none;
  background: var(--color-bg);
}
.trust-signal__inner {
  display: flex;
  align-items: center;
  justify-content: center;
}
.trust-signal__badge {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--color-text-muted);
  background: var(--color-surface);
  border: 1px solid var(--color-divider);
  border-radius: var(--radius-full);
  padding: 0.4rem 1.2rem;
}

/* ── NAV TEXT LINK (Watch Demo) ──────────────────────────────────────────── */
.nav__text-link {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 500;
  color: var(--color-text-muted) !important;
  text-decoration: none;
  transition: color var(--transition-interactive);
}
.nav__text-link:hover { color: var(--color-primary) !important; }
.nav__active {
  color: var(--color-primary) !important;
  font-weight: 600;
}

/* ── DARK MODE ADJUSTMENTS ───────────────────────────────────────────────── */
[data-theme='dark'] .trust-signal__badge {
  background: var(--color-surface-2);
  border-color: rgba(255,255,255,0.10);
  color: var(--color-text-muted);
}


/* ── PAGE HERO (inner pages) ─────────────────────────────────────────────── */
.page-hero {
  background: var(--color-surface);
  border-bottom: none;
  padding: clamp(var(--space-16), 10vw, var(--space-24)) 0 clamp(var(--space-12), 6vw, var(--space-16));
  padding-top: calc(clamp(var(--space-16), 10vw, var(--space-24)) + 80px);
}
.page-hero .eyebrow { margin-bottom: var(--space-4); justify-content: flex-start; }
.page-hero h1 {
  font-family: var(--font-display);
  font-size: var(--text-3xl);
  font-weight: 400;
  line-height: 1.1;
  letter-spacing: -0.02em;
  color: var(--color-text);
  margin-bottom: var(--space-4);
}
.page-hero h1 em { font-style: normal; color: var(--color-primary); }
.page-hero__sub {
  font-family: var(--font-body);
  font-size: var(--text-base);
  color: var(--color-text-muted);
  line-height: 1.6;
}

/* ── FOUNDER QUOTE SECTION ───────────────────────────────────────────────── */
.founder-quote-section {
  padding: clamp(var(--space-16), 8vw, var(--space-24)) 0;
  background: var(--color-surface);
  border-bottom: none;
}
.founder-quote-section--page {
  padding-top: calc(clamp(var(--space-16), 8vw, var(--space-24)) + 80px);
}
.founder-quote-section__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-5);
  max-width: 720px;
  margin: 0 auto;
  text-align: center;
}
.founder-quote-section__inner .founder-story__quote {
  width: 100%;
}
.founder-quote-section__link {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 500;
  color: var(--color-text-muted);
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color var(--transition-interactive);
}
.founder-quote-section__link:hover { color: var(--color-primary); }

/* ── TRUST SIGNAL ────────────────────────────────────────────────────────── */
.trust-signal {
  padding: var(--space-8) 0;
  border-top: none;
  border-bottom: none;
  background: var(--color-bg);
}
.trust-signal__inner {
  display: flex;
  align-items: center;
  justify-content: center;
}
.trust-signal__badge {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--color-text-muted);
  background: var(--color-surface);
  border: 1px solid var(--color-divider);
  border-radius: var(--radius-full);
  padding: 0.4rem 1.2rem;
}

/* ── NAV TEXT LINK (Watch Demo) ──────────────────────────────────────────── */
.nav__text-link {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 500;
  color: var(--color-text-muted) !important;
  text-decoration: none;
  transition: color var(--transition-interactive);
}
.nav__text-link:hover { color: var(--color-primary) !important; }
.nav__active {
  color: var(--color-primary) !important;
  font-weight: 600;
}

/* ── DARK MODE ADJUSTMENTS ───────────────────────────────────────────────── */
[data-theme='dark'] .trust-signal__badge {
  background: var(--color-surface-2);
  border-color: rgba(255,255,255,0.10);
  color: var(--color-text-muted);
}


/* ── PAGE HERO (inner pages) ─────────────────────────────────────────────── */
.page-hero {
  background: var(--color-surface);
  border-bottom: none;
  padding: clamp(var(--space-16), 10vw, var(--space-24)) 0 clamp(var(--space-12), 6vw, var(--space-16));
  padding-top: calc(clamp(var(--space-16), 10vw, var(--space-24)) + 80px);
}
.page-hero .eyebrow { margin-bottom: var(--space-4); justify-content: flex-start; }
.page-hero h1 {
  font-family: var(--font-display);
  font-size: var(--text-3xl);
  font-weight: 400;
  line-height: 1.1;
  letter-spacing: -0.02em;
  color: var(--color-text);
  margin-bottom: var(--space-4);
}
.page-hero h1 em { font-style: normal; color: var(--color-primary); }
.page-hero__sub {
  font-family: var(--font-body);
  font-size: var(--text-base);
  color: var(--color-text-muted);
  line-height: 1.6;
}

/* ── FOUNDER QUOTE SECTION ───────────────────────────────────────────────── */
.founder-quote-section {
  padding: clamp(var(--space-16), 8vw, var(--space-24)) 0;
  background: var(--color-surface);
  border-bottom: none;
}
.founder-quote-section--page {
  padding-top: calc(clamp(var(--space-16), 8vw, var(--space-24)) + 80px);
}
.founder-quote-section__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-5);
  max-width: 720px;
  margin: 0 auto;
  text-align: center;
}
.founder-quote-section__inner .founder-story__quote {
  width: 100%;
}
.founder-quote-section__link {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 500;
  color: var(--color-text-muted);
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color var(--transition-interactive);
}
.founder-quote-section__link:hover { color: var(--color-primary); }

/* ── TRUST SIGNAL ────────────────────────────────────────────────────────── */
.trust-signal {
  padding: var(--space-8) 0;
  border-top: none;
  border-bottom: none;
  background: var(--color-bg);
}
.trust-signal__inner {
  display: flex;
  align-items: center;
  justify-content: center;
}
.trust-signal__badge {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--color-text-muted);
  background: var(--color-surface);
  border: 1px solid var(--color-divider);
  border-radius: var(--radius-full);
  padding: 0.4rem 1.2rem;
}

/* ── NAV TEXT LINK (Watch Demo) ──────────────────────────────────────────── */
.nav__text-link {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 500;
  color: var(--color-text-muted) !important;
  text-decoration: none;
  transition: color var(--transition-interactive);
}
.nav__text-link:hover { color: var(--color-primary) !important; }
.nav__active {
  color: var(--color-primary) !important;
  font-weight: 600;
}

/* ── DARK MODE ADJUSTMENTS ───────────────────────────────────────────────── */
[data-theme='dark'] .trust-signal__badge {
  background: var(--color-surface-2);
  border-color: rgba(255,255,255,0.10);
  color: var(--color-text-muted);
}

/* ═══════════════════════════════════════════════════════════════════════
   VISUAL PASS — Logo, Hero overlay, blur, positioning, disclaimer, fade
   ═══════════════════════════════════════════════════════════════════════ */

/* ── LOGO IMAGE — nav (light bg) ──────────────────────────────────────── */
.nav__logo-img {
  height: 54px;
  width: auto;
  max-width: 260px;
  display: block;
  object-fit: contain;
  object-position: left center;
  flex-shrink: 0;
}

/* ── LOGO IMAGE — footer (dark bg) ────────────────────────────────────── */
.nav__logo-img--footer {
  height: 34px;
  width: 180px;
}

/* ── NAV LOGO container — remove gap left by old SVG+wordmark flex layout ── */
.nav__logo {
  gap: 0;
}

/* ── HERO VIDEO — subtle blur on video only ───────────────────────────── */
.hero__video {
  filter: blur(3px);
  transform: scale(1.03); /* compensate blur edge bleed */
}

/* ── HERO OVERLAY — semi-transparent cool dark at 25% ─────────────────── */
.hero__overlay {
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0.24) !important;
  z-index: 0;
  pointer-events: none;
}

/* ── HERO FADE — dissolve bottom edge into section below ──────────────── */
.hero {
  -webkit-mask-image: linear-gradient(to bottom, black 90%, transparent 100%);
  mask-image: linear-gradient(to bottom, black 90%, transparent 100%);
}

/* ── HERO CONTENT — aligned to same horizontal boundary as nav container ── */
.hero__content {
  position: absolute;
  bottom: 60px;
  left: 0;
  right: 0;
  z-index: 1;
  width: 100%;
  max-width: none;
  padding-inline: clamp(var(--space-6), 5vw, var(--space-16));
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: end;
  gap: var(--space-4) var(--space-12);
}

/* ── HERO LEFT BLOCK — constrain to 600px max ─────────────────────────── */
.hero__left {
  max-width: 600px;
}

/* ── HERO HEADLINE — one step smaller, no text-shadow ─────────────────── */
.hero__heading {
  font-size: clamp(1.75rem, 3.5vw, 3rem);
  line-height: 1.1;
  text-shadow: none;
}

/* ── HERO PROOF LINE — match hero__sub body text color #7B6E8A ────────── */
.hero__proof {
  color: #7B6E8A !important;
  font-size: var(--text-sm);
  font-weight: 500;
}
.hero__proof span {
  color: #7B6E8A !important;
}
.hero__proof .proof-dot {
  color: #7B6E8A !important;
  opacity: 0.5;
}

/* ── MOBILE adjustments ────────────────────────────────────────────────── */
@media (max-width: 860px) {
  .hero__content {
    bottom: 40px;
    left: 0;
    right: 0;
    padding-inline: var(--space-6);
    grid-template-columns: 1fr;
  }
  .hero__proof {
    grid-column: 1;
    grid-row: 2;
    justify-content: flex-start;
    flex-wrap: wrap;
    white-space: normal;
    margin-top: var(--space-3);
    color: #7B6E8A !important;
  }
}

@media (max-width: 640px) {
  .hero__content {
    bottom: 32px;
    left: 0;
    right: 0;
    padding-inline: var(--space-5);
  }
  .nav__logo-img {
    height: 30px;
    width: 140px;
  }
}


/* ── HERO CTAs — secondary button: aubergine border + aubergine text, transparent bg ── */
.hero .btn--ghost,
.hero .btn--ghost.btn--lg {
  color: #483C51;
  border: 1.5px solid #483C51;
  background: transparent;
}
.hero .btn--ghost:hover {
  background: rgba(72, 60, 81, 0.06);
  border-color: #483C51;
  color: #483C51;
}
/* ── FEATURE PILL ICON CHIPS ───────────────────────────────────────────── */
.pill-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border-radius: 5px;
  flex-shrink: 0;
}
.pill-icon svg {
  width: 12px;
  height: 12px;
  flex-shrink: 0;
}

/* ═══════════════════════════════════════════════════════════════════════════
   NEW SECTIONS — WHY THIS EXISTS · WHAT CHANGES · WHERE WE ARE NOW
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── WHY THIS EXISTS ──────────────────────────────────────────────────────── */
.why-section {
  background: #FFFFFF;
  padding-block: clamp(var(--space-16), 8vw, var(--space-24));
}

.why-section__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: var(--space-6);
}

.why-section__eyebrow {
  justify-content: center;
}

.why-section__heading {
  font-family: var(--font-display);
  font-size: clamp(var(--text-2xl), 3.5vw, var(--text-3xl));
  font-weight: 400;
  color: var(--color-text);
  line-height: 1.15;
  letter-spacing: -0.02em;
  max-width: 20ch;
  font-style: normal;
}

.why-section__body {
  font-family: var(--font-body);
  font-size: var(--text-base);
  font-weight: 400;
  color: var(--color-gray);
  line-height: 1.75;
  max-width: 680px;
  font-style: normal;
}

.why-section__cta {
  margin-top: var(--space-2);
}

/* ── WHAT CHANGES ─────────────────────────────────────────────────────────── */
.what-changes-section {
  background: #483C51;
  padding-block: clamp(var(--space-16), 8vw, var(--space-24));
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
/* Iridescent atmospheric shimmer over the aubergine — carried over from the
   previous light effect, opacity raised so it reads against the dark background. */
.what-changes-section::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(120% 90% at 18% 12%, rgba(196,181,212,0.30) 0%, transparent 55%),
    radial-gradient(120% 90% at 82% 18%, rgba(180,210,230,0.26) 0%, transparent 55%),
    radial-gradient(140% 100% at 50% 100%, rgba(201,168,76,0.16) 0%, transparent 60%),
    linear-gradient(135deg, rgba(196,181,212,0.18) 0%, rgba(72,60,81,0) 50%, rgba(180,210,230,0.16) 100%);
  mix-blend-mode: screen;
}

.what-changes-section__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: var(--space-6);
}

.what-changes-section__eyebrow {
  justify-content: center;
  color: #C9A84C !important;
}
.what-changes-section__eyebrow::before {
  background: #C9A84C !important;
}

.what-changes-section__heading {
  font-family: var(--font-display);
  font-size: clamp(var(--text-2xl), 3.5vw, var(--text-3xl));
  font-weight: 400;
  color: #FFFFFF;
  line-height: 1.15;
  letter-spacing: -0.02em;
  max-width: 22ch;
  font-style: normal;
}

.what-changes-section__subtitle {
  font-family: var(--font-body);
  font-size: var(--text-base);
  font-weight: 700;
  color: #FFFFFF;
  line-height: 1.6;
  max-width: 640px;
  font-style: normal;
}

.what-changes-section__body {
  font-family: var(--font-body);
  font-size: var(--text-base);
  font-weight: 400;
  color: #F0EDF3;
  line-height: 1.75;
  max-width: 640px;
  font-style: normal;
}
.what-changes-section__tagline {
  color: #C9A84C;
  display: none;
}

.what-changes-section__cta-wrap {
  display: flex;
  justify-content: center;
  margin-top: var(--space-2);
}

/* Ghost CTA — transparent, aubergine border + text (matches hero "See the Platform" radius/padding) */
.btn--ghost-aubergine {
  background: transparent;
  color: #483C51;
  border: 1.5px solid #483C51;
}
.btn--ghost-aubergine:hover {
  background: rgba(72, 60, 81, 0.06);
  color: #483C51;
  border-color: #483C51;
}
/* Watch Demo CTA on the dark What Changes section — gold ghost (scoped, does
   not affect the shared .btn--ghost-aubergine used elsewhere). */
.what-changes-section__cta.btn--ghost-aubergine,
.what-changes-section__cta {
  background: transparent !important;
  color: #C9A84C !important;
  border: 1.5px solid #C9A84C !important;
}
.what-changes-section__cta.btn--ghost-aubergine:hover,
.what-changes-section__cta:hover {
  background: rgba(201, 168, 76, 0.10) !important;
  color: #C9A84C !important;
  border-color: #C9A84C !important;
}

/* ── WHERE WE ARE NOW (about page) ───────────────────────────────────────── */
.where-now-section {
  background: #FFFFFF;
  padding-block: clamp(var(--space-16), 8vw, var(--space-24));
}

.where-now-section__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: var(--space-6);
}

.where-now-section__eyebrow {
  justify-content: center;
}

.where-now-section__heading {
  font-family: var(--font-display);
  font-size: clamp(var(--text-2xl), 3.5vw, var(--text-3xl));
  font-weight: 400;
  color: var(--color-text);
  line-height: 1.15;
  letter-spacing: -0.02em;
  max-width: 22ch;
  font-style: normal;
}

.where-now-section__body {
  font-family: var(--font-body);
  font-size: var(--text-base);
  font-weight: 400;
  color: var(--color-gray);
  line-height: 1.75;
  max-width: 680px;
  font-style: normal;
}

.where-now-section__ctas {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-4);
  flex-wrap: wrap;
  margin-top: var(--space-2);
}

/* ── Responsive ───────────────────────────────────────────────────────────── */
@media (max-width: 640px) {
  .why-section__heading,
  .what-changes-section__heading,
  .where-now-section__heading {
    font-size: var(--text-xl);
  }
  .where-now-section__ctas {
    flex-direction: column;
    align-items: center;
  }
}


/* ═══════════════════════════════════════════════════════════════════════
   FEATURES STAGE — layered composition with browser frame + floating pills
   ═══════════════════════════════════════════════════════════════════════ */
.features-stage {
  background: #FFFFFF;
  padding-block: clamp(var(--space-16), 8vw, var(--space-24));
  overflow: hidden;
}

/* ── Scene container: relative positioning context for scattered bubbles ── */
.features-stage__scene {
  position: relative;
  width: 100%;
  max-width: 1200px;
  margin-inline: auto;
  padding-inline: clamp(var(--space-6), 5vw, var(--space-16));
  min-height: 600px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ── App mockup wrapper — dominant, generous width ─────────────────────── */
.features-stage__left {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
}

/* ── BROWSER FRAME — restored to full generous width ───────────────────── */
.features-stage__frame {
  width: 100%;
  max-width: 760px;
  border-radius: 10px;
  box-shadow:
    0 0 0 1px rgba(72, 60, 81, 0.10),
    0 12px 48px rgba(72, 60, 81, 0.14),
    0 2px 8px rgba(72, 60, 81, 0.08);
  overflow: hidden;
  background: #F8F7FA;
  flex-shrink: 0;
  position: relative;
  z-index: 2;
}

/* Chrome bar */
.features-stage__chrome {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 10px 14px;
  background: #EFECF4;
  border-bottom: 1px solid rgba(72, 60, 81, 0.08);
}

.chrome-dot {
  width: 11px;
  height: 11px;
  border-radius: 50%;
  flex-shrink: 0;
}
.chrome-dot--red    { background: #FF5F57; }
.chrome-dot--yellow { background: #FEBC2E; }
.chrome-dot--green  { background: #28C840; }

.chrome-bar-title {
  margin-left: 10px;
  font-family: var(--font-body);
  font-size: 11px;
  color: #7B6E8A;
  background: rgba(255,255,255,0.6);
  border-radius: 4px;
  padding: 2px 10px;
  flex: 1;
  text-align: center;
  max-width: 240px;
  margin-inline: auto;
}

/* ── DASHBOARD MOCKUP (replica of live app.myauralense.com) ─────────────── */
.features-stage__screens {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9.6;
  overflow: hidden;
}

/* ── VIEW CYCLE — 4 app views crossfade automatically ──────────────────── */
.app-mock-cycle {
  position: relative;
  width: 100%;
  height: 100%;
}
.app-view {
  position: absolute;
  inset: 0;
  opacity: 0;
  /* Step 1: mockup crossfade, 0.5s. JS toggles .is-active. */
  transition: opacity 0.5s ease-in-out;
}
.app-view.is-active {
  opacity: 1;
}
/* Fallback before JS runs: show the first view. */
.app-view--1 { opacity: 1; }
.js-feat-ready .app-view--1 { opacity: 0; }
.js-feat-ready .app-view--1.is-active { opacity: 1; }

@media (prefers-reduced-motion: reduce) {
  .app-view {
    transition: none;
  }
}

.app-mock {
  display: flex;
  height: 100%;
  font-family: var(--font-body);
  font-size: 9px;
  line-height: 1.3;
}

/* ── SIDEBAR ─────────────────────────────────────────────────────────────── */
.app-mock__sidebar {
  width: 124px;
  background: linear-gradient(180deg, #4E4159 0%, #423648 100%);
  display: flex;
  flex-direction: column;
  padding: 11px 10px;
  gap: 11px;
  flex-shrink: 0;
}

.app-mock__brand {
  display: flex;
  align-items: center;
  gap: 6px;
  padding-bottom: 2px;
}
.app-mock__brand-cube {
  width: 18px;
  height: 18px;
  border-radius: 5px;
  background: rgba(255,255,255,0.92);
  flex-shrink: 0;
}
.app-mock__brand-name {
  font-size: 10px;
  font-weight: 700;
  color: #FFFFFF;
  letter-spacing: 0.01em;
}
.app-mock__brand-name sup { font-size: 5px; }

.app-mock__company {
  display: flex;
  align-items: center;
  gap: 6px;
  background: rgba(255,255,255,0.10);
  border: 1px solid rgba(255,255,255,0.14);
  border-radius: 7px;
  padding: 6px 7px;
}
.app-mock__company-icon {
  width: 16px;
  height: 16px;
  border-radius: 4px;
  background: rgba(255,255,255,0.85);
  flex-shrink: 0;
}
.app-mock__company-text {
  display: flex;
  flex-direction: column;
  line-height: 1.2;
  min-width: 0;
}
.app-mock__company-text strong {
  font-size: 8.5px;
  font-weight: 600;
  color: #FFFFFF;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.app-mock__company-text em {
  font-style: normal;
  font-size: 7px;
  color: rgba(255,255,255,0.55);
}

.app-mock__nav {
  display: flex;
  flex-direction: column;
  gap: 3px;
  margin-top: 2px;
}
.app-mock__nav-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 8px;
  border-radius: 7px;
  color: rgba(255,255,255,0.66);
  font-size: 8.5px;
  font-weight: 500;
}
.app-mock__nav-item svg {
  width: 12px;
  height: 12px;
  flex-shrink: 0;
}
.app-mock__nav-item--active {
  background: rgba(201, 168, 76, 0.20);
  color: #E7C977;
  font-weight: 600;
}

.app-mock__sidebar-foot {
  margin-top: auto;
  display: flex;
  flex-direction: column;
  line-height: 1.25;
  padding-top: 8px;
  border-top: 1px solid rgba(255,255,255,0.10);
}
.app-mock__user-name {
  font-size: 8px;
  font-weight: 700;
  color: #FFFFFF;
}
.app-mock__user-role {
  font-size: 7px;
  color: rgba(255,255,255,0.55);
}

/* ── MAIN CANVAS ─────────────────────────────────────────────────────────── */
.app-mock__main {
  flex: 1;
  background: #FAF7F2;
  display: flex;
  flex-direction: column;
  padding: 12px 13px;
  gap: 9px;
  overflow: hidden;
  min-width: 0;
}

.app-mock__pagehead {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}
.app-mock__pagehead-text { display: flex; flex-direction: column; gap: 2px; }
.app-mock__page-title {
  font-size: 13px;
  font-weight: 700;
  color: #2E2636;
  line-height: 1.1;
}
.app-mock__page-sub {
  font-size: 8px;
  color: #8A7F95;
}
.app-mock__recalc {
  font-size: 8px;
  font-weight: 600;
  color: #5A4E68;
  border: 1px solid rgba(72,60,81,0.22);
  border-radius: 9999px;
  padding: 4px 9px;
  white-space: nowrap;
}

/* Net Worth strip */
.app-mock__networth {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  background: #FFFFFF;
  border: 1px solid rgba(72,60,81,0.07);
  border-radius: 10px;
  padding: 9px 12px;
  box-shadow: 0 1px 4px rgba(72,60,81,0.04);
}
.app-mock__nw-primary { display: flex; flex-direction: column; gap: 2px; }
.app-mock__nw-label {
  font-size: 6.5px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #9A8FA6;
}
.app-mock__nw-value {
  font-size: 15px;
  font-weight: 700;
  color: #2E2636;
  white-space: nowrap;
}
.app-mock__nw-delta {
  font-style: normal;
  font-size: 8px;
  font-weight: 600;
  color: #4A7C59;
  margin-left: 3px;
}
.app-mock__nw-breakdown {
  display: flex;
  gap: 13px;
}
.app-mock__nw-breakdown span {
  display: flex;
  flex-direction: column;
  gap: 1px;
  font-size: 8.5px;
  font-weight: 600;
  color: #2E2636;
  white-space: nowrap;
}
.app-mock__nw-breakdown i {
  font-style: normal;
  font-size: 6.5px;
  font-weight: 500;
  color: #9A8FA6;
}

/* Score gauge + stat cards row */
.app-mock__grid {
  display: flex;
  gap: 9px;
}
.app-mock__gauge-card {
  flex: 1.3;
  background: #FFFFFF;
  border: 1px solid rgba(72,60,81,0.07);
  border-radius: 10px;
  padding: 10px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  box-shadow: 0 1px 4px rgba(72,60,81,0.04);
}
.app-mock__gauge {
  position: relative;
  width: 88px;
  height: 50px;
}
.app-mock__gauge svg { width: 88px; height: 50px; display: block; }
.app-mock__gauge-num {
  position: absolute;
  left: 0; right: 0;
  bottom: 6px;
  text-align: center;
  font-size: 17px;
  font-weight: 700;
  color: #2E2636;
}
.app-mock__gauge-cap {
  position: absolute;
  left: 0; right: 0;
  bottom: -1px;
  text-align: center;
  font-size: 6px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #9A8FA6;
}
.app-mock__gauge-delta {
  font-size: 7.5px;
  font-weight: 600;
  color: #4A7C59;
  margin-top: 6px;
}

.app-mock__statcards {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.app-mock__statcard {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #FFFFFF;
  border: 1px solid rgba(72,60,81,0.07);
  border-radius: 10px;
  padding: 7px 11px;
  box-shadow: 0 1px 4px rgba(72,60,81,0.04);
}
.app-mock__statcard > div { display: flex; flex-direction: column; gap: 1px; }
.app-mock__statcard-num {
  font-size: 13px;
  font-weight: 700;
  color: #2E2636;
  line-height: 1;
}
.app-mock__statcard-cap {
  font-size: 7px;
  color: #8A7F95;
}
.app-mock__statcard-ico {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  flex-shrink: 0;
}
.app-mock__statcard-ico--red   { background: #FAE4E1; }
.app-mock__statcard-ico--blue  { background: #E3EDF5; }
.app-mock__statcard-ico--green { background: #E5F1E7; }

/* Lower panels */
.app-mock__lower {
  display: flex;
  gap: 9px;
  flex: 1;
  min-height: 0;
}
.app-mock__panel {
  flex: 1;
  background: #FFFFFF;
  border: 1px solid rgba(72,60,81,0.07);
  border-radius: 10px;
  padding: 9px 11px;
  display: flex;
  flex-direction: column;
  gap: 3px;
  box-shadow: 0 1px 4px rgba(72,60,81,0.04);
  min-width: 0;
}
.app-mock__panel-head {
  display: flex;
  align-items: center;
  gap: 6px;
}
.app-mock__panel-title {
  font-size: 8px;
  font-weight: 600;
  color: #5A4E68;
}
.app-mock__panel-tag {
  font-size: 6.5px;
  font-weight: 600;
  padding: 1px 6px;
  border-radius: 9999px;
}
.app-mock__panel-tag--green { background: #E5F1E7; color: #4A7C59; }
.app-mock__panel-tag--blue  { background: #E3EDF5; color: #4E7E9E; }
.app-mock__panel-big {
  font-size: 16px;
  font-weight: 700;
  color: #2E2636;
  line-height: 1.1;
}
.app-mock__panel-meta {
  font-size: 7px;
  color: #9A8FA6;
}
.app-mock__bars {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-top: 5px;
}
.app-mock__bar {
  height: 4px;
  border-radius: 2px;
  background: linear-gradient(90deg, #C9A84C, #D8BE76);
}
.app-mock__ar-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-top: 5px;
}
.app-mock__ar-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 7.5px;
  color: #5A4E68;
}
.app-mock__ar-row span:first-child {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.app-mock__ar-amt { font-weight: 600; color: #2E2636; flex-shrink: 0; margin-left: 6px; }

/* ── SHARED VIEW ELEMENTS (Obligations / Certification / Back-Office) ────── */

/* Tabs */
.app-mock__tabs {
  display: flex;
  gap: 14px;
  border-bottom: 1px solid rgba(72,60,81,0.10);
  padding-bottom: 5px;
}
.app-mock__tab {
  font-size: 8.5px;
  font-weight: 600;
  color: #9A8FA6;
  position: relative;
  padding-bottom: 5px;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.app-mock__tab--active { color: #2E2636; }
.app-mock__tab--active::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -6px;
  height: 2px;
  border-radius: 2px;
  background: #5A4E68;
}
.app-mock__tab-new {
  font-style: normal;
  font-size: 5.5px;
  font-weight: 700;
  letter-spacing: 0.05em;
  color: #4A7C59;
  background: #E5F1E7;
  border-radius: 9999px;
  padding: 1px 4px;
}

/* Filter chips */
.app-mock__filters {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.app-mock__chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 7.5px;
  font-weight: 600;
  color: #6B6070;
  background: #FFFFFF;
  border: 1px solid rgba(72,60,81,0.12);
  border-radius: 9999px;
  padding: 4px 9px;
  white-space: nowrap;
}
.app-mock__chip i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  flex-shrink: 0;
}
.app-mock__chip--red i    { background: #D98A7E; }
.app-mock__chip--blue i   { background: #6E93B5; }
.app-mock__chip--green i  { background: #6FA67E; }
.app-mock__chip--violet i { background: #8C7BA6; }
.app-mock__chip--on {
  border-color: rgba(72,60,81,0.30);
  background: #F3F0F7;
  color: #2E2636;
}
.app-mock__chip--dark {
  background: #4E4159;
  border-color: #4E4159;
  color: #FFFFFF;
}

/* Section heads */
.app-mock__sectionhead {
  display: flex;
  align-items: baseline;
  gap: 7px;
  font-size: 7px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #9A8FA6;
}
.app-mock__sectionhead-count { color: #5A4E68; }
.app-mock__sectionhead--doc {
  text-transform: none;
  letter-spacing: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: 1px;
  font-size: 9px;
  color: #2E2636;
}
.app-mock__sectionhead-sub {
  font-size: 7px;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
  color: #9A8FA6;
}

/* Obligations list */
.app-mock__oblist {
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1;
  min-height: 0;
}
.app-mock__obrow {
  display: flex;
  align-items: center;
  gap: 8px;
  background: #FFFFFF;
  border: 1px solid rgba(72,60,81,0.07);
  border-radius: 9px;
  padding: 7px 11px;
  box-shadow: 0 1px 4px rgba(72,60,81,0.04);
}
.app-mock__obdot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #6E93B5;
  flex-shrink: 0;
}
.app-mock__obmain {
  display: flex;
  flex-direction: column;
  gap: 2px;
  flex: 1;
  min-width: 0;
}
.app-mock__obtop {
  display: flex;
  align-items: center;
  gap: 7px;
}
.app-mock__obtop b {
  font-size: 9px;
  font-weight: 700;
  color: #2E2636;
}
.app-mock__risk {
  font-size: 6.5px;
  font-weight: 600;
  border-radius: 9999px;
  padding: 1px 6px;
}
.app-mock__risk--high { background: #FAE4E1; color: #B5564A; }
.app-mock__risk--med  { background: #FBF0DC; color: #A07D32; }
.app-mock__obsub {
  font-size: 7.5px;
  color: #8A7F95;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.app-mock__obright {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 1px;
  flex-shrink: 0;
}
.app-mock__obdays {
  font-size: 9px;
  font-weight: 700;
  color: #2E2636;
}
.app-mock__obdays--over { color: #B5564A; }
.app-mock__obdate {
  font-size: 6.5px;
  color: #9A8FA6;
}

/* Certification grid + cards */
.app-mock__certgrid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 7px;
  flex: 1;
  min-height: 0;
}
.app-mock__certcard {
  display: flex;
  flex-direction: column;
  gap: 2px;
  background: #FFFFFF;
  border: 1px solid rgba(72,60,81,0.07);
  border-radius: 9px;
  padding: 8px 9px;
  box-shadow: 0 1px 4px rgba(72,60,81,0.04);
}
.app-mock__certcard-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1px;
}
.app-mock__badge {
  font-size: 6px;
  font-weight: 700;
  border-radius: 9999px;
  padding: 1px 6px;
}
.app-mock__badge--gold { background: #FBF0DC; color: #A07D32; }
.app-mock__badge--blue { background: #E3EDF5; color: #4E7E9E; }
.app-mock__certprog {
  font-size: 7px;
  font-weight: 600;
  color: #9A8FA6;
}
.app-mock__certtitle {
  font-size: 10px;
  font-weight: 700;
  color: #2E2636;
  line-height: 1.1;
}
.app-mock__certsub {
  font-size: 7.5px;
  font-weight: 600;
  color: #5A4E68;
}
.app-mock__certmeta {
  font-size: 6.5px;
  color: #9A8FA6;
}

/* Back-Office stat boxes */
.app-mock__bostat {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
  background: #FFFFFF;
  border: 1px solid rgba(72,60,81,0.07);
  border-radius: 10px;
  padding: 9px 11px;
  box-shadow: 0 1px 4px rgba(72,60,81,0.04);
}
.app-mock__bostat-num {
  font-size: 15px;
  font-weight: 700;
  color: #2E2636;
  line-height: 1;
}
.app-mock__bostat-cap {
  font-size: 7px;
  color: #8A7F95;
}

/* Back-Office document list */
.app-mock__doclist {
  display: flex;
  flex-direction: column;
  gap: 5px;
  flex: 1;
  min-height: 0;
}
.app-mock__docrow {
  display: flex;
  align-items: center;
  gap: 8px;
  background: #FFFFFF;
  border: 1px solid rgba(72,60,81,0.07);
  border-radius: 8px;
  padding: 6px 11px;
  box-shadow: 0 1px 4px rgba(72,60,81,0.04);
}
.app-mock__docico {
  width: 11px;
  height: 13px;
  border-radius: 2px;
  background: #EFEAF4;
  border: 1px solid rgba(72,60,81,0.12);
  flex-shrink: 0;
}
.app-mock__docmain {
  display: flex;
  flex-direction: column;
  gap: 1px;
  flex: 1;
  min-width: 0;
}
.app-mock__docmain b {
  font-size: 8.5px;
  font-weight: 600;
  color: #2E2636;
}
.app-mock__docmain i {
  font-style: normal;
  font-size: 6.5px;
  color: #9A8FA6;
}
.app-mock__docadd {
  font-size: 7.5px;
  font-weight: 600;
  color: #5A4E68;
  border: 1px solid rgba(72,60,81,0.22);
  border-radius: 9999px;
  padding: 3px 8px;
  white-space: nowrap;
  flex-shrink: 0;
}


/* FEATURE BUBBLE PILLS — scattered around the mockup, JS-driven fade */
.feat-bubble {
  position: absolute;
  z-index: 3;
  background: #FFFFFF;
  color: #5A4E68;
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.3;
  padding: 10px 20px;
  border-radius: 999px;
  border: 1.5px solid #C9A84C;
  box-shadow: 0 4px 20px rgba(201, 168, 76, 0.30);
  /* No max-width: pill expands to fit the full text on one line. */
  white-space: nowrap;
  /* Both bubbles fade in/out together with the mockup. JS toggles .is-visible. */
  opacity: 0;
  transition: opacity 0.5s ease-in-out;
  pointer-events: none;
}
.feat-bubble.is-visible {
  opacity: 1;
}

/* Scattered positions — different heights, different sides, overlapping the
   mockup frame edges so the bubbles feel connected to what's on screen.
   Positions stay fixed across all four feature states; only text/opacity change. */
.feat-bubble--top {
  top: 18%;
  /* Default (narrow/standard desktop ≤ 1365px): the 760px frame leaves too
     little room on its right for a full-width pill, so the bubble is
     right-anchored and tucks at the frame's top-right corner. The fluid frame
     (max-width:100% below) becomes the dominant element; the bubble overlaps
     its edge only slightly. This guarantees the text is never cut off. */
  left: auto;
  right: 1%;
}
.feat-bubble--bottom {
  bottom: 20%;
  left: 1%;
}

/* Large desktops (≥ 1366px): there is finally enough horizontal room to place
   the top bubble fully to the RIGHT of the 760px mockup with a small gap, so
   the mockup sits completely unobstructed beneath it and nothing is cut off.
   The scene is widened so the bubble isn't trimmed by the scene's edge. */
@media (min-width: 1366px) {
  .features-stage__scene {
    max-width: 1480px;
  }
  .feat-bubble--top {
    top: 18%;
    left: calc(50% + 392px);
    right: auto;
  }
  .feat-bubble--bottom {
    bottom: 20%;
    left: 4%;
    right: auto;
  }
}

/* Standard / narrow desktop (≤ 1365px): let the mockup grow fluidly so it
   stays the dominant element and leaves the corner-anchored bubbles room to
   tuck without being cut off. (≥ 1366px keeps the fixed 760px frame so the
   bubble can sit fully to its right.) */
@media (max-width: 1365px) {
  .features-stage__frame {
    width: 100%;
    max-width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .feat-bubble {
    transition: none;
  }
}

/* RESPONSIVE: mockup full width; bubbles tuck near the frame edges */
@media (max-width: 900px) {
  .features-stage__scene {
    min-height: 520px;
    padding-block: var(--space-4);
  }
  .features-stage__frame {
    width: 100%;
    max-width: 100%;
  }
  .feat-bubble--top {
    top: 7%;
    left: auto;
    right: 1%;
  }
  .feat-bubble--bottom {
    bottom: 9%;
    left: 1%;
  }
}

@media (max-width: 560px) {
  .feat-bubble {
    font-size: 11px;
    padding: 8px 14px;
  }
  .feat-bubble--top {
    top: 3%;
    left: auto;
    right: 0%;
  }
  .feat-bubble--bottom {
    bottom: 5%;
    left: 0%;
  }
}


/* ═══════════════════════════════════════════════════════════════════════
   FOUNDER QUOTE INLINE — plain text on white, after pills section
   ═══════════════════════════════════════════════════════════════════════ */
.founder-quote-inline {
  padding-block: clamp(var(--space-16), 8vw, var(--space-24));
  background: #FFFFFF;
}

.founder-quote-inline__inner {
  max-width: 720px;
  margin-inline: auto;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-5);
}

.founder-quote-inline__text {
  font-family: var(--font-body);
  font-style: italic;
  font-size: clamp(1.1rem, 1rem + 0.6vw, 1.35rem);
  line-height: 1.65;
  color: #483C51;
  font-weight: 400;
  margin: 0;
}

.founder-quote-inline__attribution {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-1);
}

.founder-quote-inline__name {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 600;
  color: #483C51;
  font-style: normal;
}

.founder-quote-inline__title {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  color: #483C51;
  font-weight: 400;
  font-style: normal;
}



/* ═══════════════════════════════════════════════════════════════════════
   WHY + FOUNDER QUOTE — TWO-COLUMN COMBINED SECTION
   ═══════════════════════════════════════════════════════════════════════ */
.why-quote-section {
  background: #FFFFFF;
  padding-block: clamp(var(--space-16), 8vw, var(--space-24));
}

.why-quote-section__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(var(--space-10), 5vw, var(--space-20));
  align-items: center;
}

.why-quote-section__left {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  align-items: flex-start;
}

.why-quote-section__right {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-4);
}

/* ── GLASSMORPHISM FOUNDER CARD ─────────────────────────────────────────── */
.founder-glass-card {
  position: relative;
  background: rgba(220, 218, 225, 0.45);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(255, 255, 255, 0.55);
  border-radius: 20px;
  box-shadow:
    0 8px 32px rgba(72, 60, 81, 0.10),
    inset 0 1px 0 rgba(255, 255, 255, 0.60);
  padding: 48px;
  overflow: hidden;
}

/* Diagonal light ray — from top-left to bottom-right, behind text */
.founder-glass-card::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    135deg,
    rgba(200, 180, 240, 0.20) 0%,
    rgba(180, 220, 230, 0.15) 50%,
    rgba(220, 200, 180, 0.10) 100%
  );
  pointer-events: none;
  z-index: 0;
  border-radius: 20px;
}

/* Grain texture overlay */
.founder-glass-card::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
  opacity: 0.55;
  pointer-events: none;
  z-index: 0;
  border-radius: 20px;
  mix-blend-mode: overlay;
}

/* Iridescent light sweep — slow continuous prismatic drift across the card */
.founder-glass-card__iris {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  border-radius: 20px;
  overflow: hidden;
}
.founder-glass-card__iris::before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 220%;
  background: linear-gradient(
    105deg,
    transparent 0%,
    transparent 32%,
    rgba(200, 180, 240, 0.12) 42%,
    rgba(180, 220, 230, 0.10) 50%,
    rgba(220, 200, 180, 0.08) 58%,
    transparent 68%,
    transparent 100%
  );
  animation: founderIrisSweep 7s linear infinite;
}

@keyframes founderIrisSweep {
  0%   { transform: translateX(-55%); }
  100% { transform: translateX(0%); }
}

@media (prefers-reduced-motion: reduce) {
  .founder-glass-card__iris::before { animation: none; }
}

/* In-card "Meet the Founder" CTA */
.founder-glass-card__cta {
  position: relative;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 0.45em;
  margin-top: 24px;
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #483C51;
  text-decoration: none;
  transition: gap 0.2s ease, opacity 0.2s ease;
}
.founder-glass-card__cta-arrow {
  display: inline-block;
  font-weight: 400;
  transition: transform 0.2s ease;
}
.founder-glass-card__cta:hover {
  opacity: 0.78;
}
.founder-glass-card__cta:hover .founder-glass-card__cta-arrow {
  transform: translateX(3px);
}

.founder-glass-card__quote {
  position: relative;
  z-index: 2;
  margin: 0 0 var(--space-5);
}

.founder-glass-card__quote p {
  font-family: var(--font-body);
  font-style: italic;
  font-size: clamp(1rem, 0.9rem + 0.4vw, 1.2rem);
  line-height: 1.7;
  color: #483C51;
  font-weight: 400;
  margin: 0;
}

.founder-glass-card__attribution {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.founder-glass-card__attribution strong {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 700;
  color: #483C51;
  font-style: normal;
}

.founder-glass-card__attribution span {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  color: #483C51;
  font-weight: 400;
  font-style: normal;
}

@media (max-width: 768px) {
  .why-quote-section__inner {
    grid-template-columns: 1fr;
  }
  .why-quote-section__left {
    text-align: center;
    align-items: center;
  }
  .why-quote-section__left .why-section__body {
    text-align: center;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   HQ MODULE CARDS — portrait layout, app mockup visuals
   ═══════════════════════════════════════════════════════════════════════ */
.hq-module-cards {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-5);
  width: 100%;
  margin-top: var(--space-8);
}

.hq-module-card {
  background: #FFFFFF;
  border-radius: 16px;
  box-shadow:
    0 2px 16px rgba(72, 60, 81, 0.09),
    0 1px 4px rgba(72, 60, 81, 0.05);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

/* Visual area at top */
.hq-module-card__visual {
  height: 220px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  position: relative;
}

.hq-module-card__visual--card {
  background: linear-gradient(135deg, #483C51 0%, #2E2438 60%, #1a1520 100%);
}

.hq-module-card__visual--compliance {
  background: linear-gradient(160deg, #EDF6E9 0%, #F8F7FA 100%);
}

.hq-module-card__visual--network {
  background: linear-gradient(160deg, #FBEDD5 0%, #F8F7FA 100%);
}

.hq-module-card__visual--tax {
  background: linear-gradient(160deg, #EDEAF2 0%, #F8F7FA 100%);
}

/* Meta row at bottom */
.hq-module-card__meta {
  padding: var(--space-4) var(--space-5);
  display: flex;
  flex-direction: column;
  gap: 4px;
  border-top: 1px solid rgba(72, 60, 81, 0.06);
}

.hq-module-card__title {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 600;
  color: #483C51;
}

.hq-module-card__status {
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 500;
  color: #4A7C59;
  display: flex;
  align-items: center;
  gap: 5px;
}

.hq-module-card__status::before {
  content: '';
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #4A7C59;
}

/* ── AUL CARD MOCKUP ────────────────────────────────────────────────────── */
@keyframes card-tilt {
  0%   { transform: perspective(600px) rotateY(-8deg) rotateX(2deg); }
  50%  { transform: perspective(600px) rotateY(8deg) rotateX(-2deg); }
  100% { transform: perspective(600px) rotateY(-8deg) rotateX(2deg); }
}

.aul-card-mockup {
  width: 158px;
  height: 100px;
  border-radius: 10px;
  background: linear-gradient(135deg,
    rgba(201, 168, 76, 0.30) 0%,
    rgba(196, 181, 212, 0.20) 40%,
    rgba(180, 210, 230, 0.15) 70%,
    rgba(201, 168, 76, 0.10) 100%
  );
  border: 1px solid rgba(255,255,255,0.20);
  box-shadow:
    0 8px 32px rgba(0,0,0,0.30),
    inset 0 1px 0 rgba(255,255,255,0.15);
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 10px 12px 8px;
  animation: card-tilt 4s ease-in-out infinite;
  transform-style: preserve-3d;
}

.aul-card-mockup__chip {
  width: 20px;
  height: 14px;
  border-radius: 3px;
  background: linear-gradient(135deg, #C9A84C, #9B7D36);
  opacity: 0.85;
}

.aul-card-mockup__logo {
  position: absolute;
  top: 10px;
  right: 12px;
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 500;
  color: rgba(255,255,255,0.75);
  letter-spacing: 0.05em;
}

.aul-card-mockup__network {
  position: absolute;
  bottom: 8px;
  right: 10px;
}

.aul-card-mockup__number {
  font-family: var(--font-body);
  font-size: 8px;
  letter-spacing: 0.12em;
  color: rgba(255,255,255,0.55);
  margin-top: auto;
}

.aul-card-mockup__label {
  font-family: var(--font-body);
  font-size: 7px;
  letter-spacing: 0.10em;
  color: rgba(255,255,255,0.45);
  text-transform: uppercase;
}

/* ── COMPLIANCE CURRENCY MOCK ───────────────────────────────────────────── */
.compliance-mock {
  width: 90%;
  max-width: 180px;
  background: #FFFFFF;
  border-radius: 10px;
  box-shadow: 0 2px 12px rgba(72,60,81,0.12);
  overflow: hidden;
}

.compliance-mock__topbar {
  background: #F8F7FA;
  border-bottom: 1px solid rgba(72,60,81,0.07);
  padding: 6px 10px;
  font-size: 9px;
  font-weight: 600;
  color: #7B6E8A;
  font-family: var(--font-body);
}

.compliance-mock__options {
  padding: 4px 0;
}

.compliance-mock__opt {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 7px 10px;
  font-family: var(--font-body);
  font-size: 9px;
  color: #483C51;
  border-bottom: 1px solid rgba(72,60,81,0.04);
}

.compliance-mock__opt--active {
  background: rgba(74,124,89,0.06);
  font-weight: 600;
}

.compliance-mock__flag { font-size: 13px; }

.compliance-mock__currency {
  font-weight: 700;
  min-width: 26px;
  font-size: 9px;
  color: #483C51;
}

.compliance-mock__name {
  flex: 1;
  color: #7B6E8A;
  font-size: 8px;
}

.compliance-mock__check {
  color: #4A7C59;
  font-size: 9px;
  font-weight: 700;
}

/* ── GROWTH NETWORK MOCK ────────────────────────────────────────────────── */
.network-mock {
  width: 90%;
  max-width: 180px;
  background: #FFFFFF;
  border-radius: 10px;
  box-shadow: 0 2px 12px rgba(72,60,81,0.12);
  overflow: hidden;
}

.network-mock__topbar {
  background: #F8F7FA;
  border-bottom: 1px solid rgba(72,60,81,0.07);
  padding: 6px 10px;
  font-size: 9px;
  font-weight: 600;
  color: #7B6E8A;
  font-family: var(--font-body);
}

.network-mock__list {
  padding: 4px 0;
}

.network-mock__item {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 7px 10px;
  font-family: var(--font-body);
  font-size: 9px;
  color: #483C51;
  border-bottom: 1px solid rgba(72,60,81,0.04);
}

.network-mock__item--active {
  background: rgba(201,168,76,0.06);
  font-weight: 600;
}

.network-mock__icon {
  width: 20px;
  height: 20px;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.network-mock__tag {
  margin-left: auto;
  font-size: 8px;
  color: #7B6E8A;
}

/* ── TAX OBLIGATIONS MOCK ───────────────────────────────────────────────── */
.tax-mock {
  width: 90%;
  max-width: 180px;
  background: #FFFFFF;
  border-radius: 10px;
  box-shadow: 0 2px 12px rgba(72,60,81,0.12);
  overflow: hidden;
}

.tax-mock__topbar {
  background: #F8F7FA;
  border-bottom: 1px solid rgba(72,60,81,0.07);
  padding: 6px 10px;
  font-size: 9px;
  font-weight: 600;
  color: #7B6E8A;
  font-family: var(--font-body);
}

.tax-mock__list {
  padding: 4px 0;
}

.tax-mock__row {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  font-family: var(--font-body);
  font-size: 8px;
  border-bottom: 1px solid rgba(72,60,81,0.04);
}

.tax-mock__dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  flex-shrink: 0;
}

.tax-mock__dot--ok   { background: #4A7C59; }
.tax-mock__dot--due  { background: #A36464; }
.tax-mock__dot--warn { background: #967634; }

.tax-mock__label {
  flex: 1;
  color: #483C51;
  font-weight: 500;
}

.tax-mock__badge {
  font-size: 8px;
  font-weight: 600;
  padding: 1px 5px;
  border-radius: 9999px;
}

.tax-mock__badge--ok   { background: #EDF6E9; color: #4A7C59; }
.tax-mock__badge--due  { background: #FAECE9; color: #A36464; }
.tax-mock__badge--warn { background: #FBEDD5; color: #967634; }

@media (max-width: 900px) {
  .hq-module-cards {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 560px) {
  .hq-module-cards {
    grid-template-columns: 1fr 1fr;
    gap: var(--space-3);
  }
  .hq-module-card__visual { height: 160px; }
}

/* ═══════════════════════════════════════════════════════════════════════
   ICP CARDS — GLASSMORPHISM TREATMENT
   ═══════════════════════════════════════════════════════════════════════ */
.icp-card--glass {
  background: rgba(255, 255, 255, 0.55) !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(255, 255, 255, 0.4) !important;
  border-radius: 20px !important;
  box-shadow: 0 8px 32px rgba(72, 60, 81, 0.10) !important;
  position: relative;
  overflow: hidden;
}

/* Color wash behind each glass card */
.icp-card--yellow::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(160deg, rgba(251,237,213,0.55) 0%, rgba(255,255,255,0.10) 70%);
  z-index: 0;
  pointer-events: none;
}

.icp-card--purple::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(160deg, rgba(237,234,242,0.60) 0%, rgba(255,255,255,0.10) 70%);
  z-index: 0;
  pointer-events: none;
}

.icp-card--green::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(160deg, rgba(237,246,233,0.60) 0%, rgba(255,255,255,0.10) 70%);
  z-index: 0;
  pointer-events: none;
}

.icp-card--blue::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(160deg, rgba(231,241,247,0.60) 0%, rgba(255,255,255,0.10) 70%);
  z-index: 0;
  pointer-events: none;
}

.icp-card--pink::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(160deg, rgba(250,236,233,0.60) 0%, rgba(255,255,255,0.10) 70%);
  z-index: 0;
  pointer-events: none;
}

/* Ensure card content sits above the pseudo-element wash */
.icp-card--glass .icp-card__icon,
.icp-card--glass h3,
.icp-card--glass p {
  position: relative;
  z-index: 1;
}

/* ── WHO IT'S FOR EYEBROW — force center ─────────────────────────────────── */
.section-header {
  text-align: center !important;
}

.section-header .eyebrow {
  text-align: center !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  width: auto !important;
  margin-inline: auto !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   CTA BAND — AUBERGINE BUTTONS
   ═══════════════════════════════════════════════════════════════════════ */
.btn--cta-gold {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  padding: var(--space-3) var(--space-7);
  font-family: var(--font-body);
  font-size: var(--text-base);
  font-weight: 600;
  border-radius: 9999px;
  cursor: pointer;
  text-decoration: none;
  border: none;
  background: #C9A84C;
  color: #483C51;
  transition: background 0.2s, transform 0.15s;
}

.btn--cta-gold:hover {
  background: #B8973F;
  transform: translateY(-1px);
}

.btn--cta-ghost {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  padding: var(--space-3) var(--space-7);
  font-family: var(--font-body);
  font-size: var(--text-base);
  font-weight: 600;
  border-radius: 9999px;
  cursor: pointer;
  text-decoration: none;
  background: transparent;
  color: #FFFFFF;
  border: 1.5px solid #FFFFFF;
  transition: background 0.2s;
}

.btn--cta-ghost:hover {
  background: rgba(255,255,255,0.10);
}

.btn--cta-gold.btn--lg,
.btn--cta-ghost.btn--lg {
  padding: var(--space-4) var(--space-9);
  font-size: var(--text-base);
}

/* ── Remove cta-band::before gold flare (no longer fits aubergine bg) ─── */
.cta-band::before {
  display: none;
}


/* ── CTA BAND BUTTON OVERRIDES — ensure gold bg renders ─────────────────── */
.cta-band .btn--cta-gold {
  background: #C9A84C !important;
  color: #483C51 !important;
  border: none !important;
}
.cta-band .btn--cta-gold:hover {
  background: #B8973F !important;
}
.cta-band .btn--cta-ghost {
  background: transparent !important;
  color: #FFFFFF !important;
  border: 1.5px solid #FFFFFF !important;
}
.cta-band .btn--cta-ghost:hover {
  background: rgba(255,255,255,0.10) !important;
}

/* ── WHY-QUOTE SECTION SPECIFIC OVERRIDES ────────────────────────────────── */
.why-quote-section .why-section__eyebrow {
  color: #483C51 !important;
  justify-content: flex-start !important;
  text-align: left !important;
}

.why-quote-section .why-section__eyebrow::before {
  background: #C9A84C !important;
}

.why-quote-section .why-section__heading {
  color: #483C51 !important;
  text-align: left !important;
  max-width: none !important;
  font-size: clamp(2rem, 3vw, 2.8rem) !important;
}

.why-quote-section .why-section__body {
  text-align: left !important;
  max-width: 480px !important;
  color: var(--color-gray) !important;
}

/* See the Platform button: filled aubergine pill, white text.
   Radius and padding are inherited from the base .btn (same as the primary CTA). */
.why-quote-section .btn--secondary {
  color: #FFFFFF !important;
  border-color: #483C51 !important;
  background: #483C51 !important;
  box-shadow: 0 2px 12px rgba(72, 60, 81, 0.18) !important;
}

.why-quote-section .btn--secondary:hover {
  background: var(--color-primary-hover) !important;
  border-color: var(--color-primary-hover) !important;
  color: #FFFFFF !important;
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(72, 60, 81, 0.24) !important;
}

/* Founder quote text inside card */
.founder-glass-card__quote p {
  font-family: var(--font-body) !important;
  font-style: italic !important;
  font-size: 1.1rem !important;
  line-height: 1.7 !important;
  color: #483C51 !important;
  font-weight: 400 !important;
}

.founder-glass-card__attribution {
  margin-top: 24px !important;
  position: relative;
  z-index: 2;
}

.founder-glass-card__attribution strong {
  font-family: var(--font-body) !important;
  font-size: var(--text-sm) !important;
  font-weight: 600 !important;
  color: #483C51 !important;
  font-style: normal !important;
  display: block !important;
}

.founder-glass-card__attribution span {
  font-family: var(--font-body) !important;
  font-size: var(--text-xs) !important;
  color: #6B6070 !important;
  font-weight: 400 !important;
  font-style: normal !important;
  display: block !important;
  margin-top: 2px !important;
}

/* Meet the founder link: aubergine, underlined */
.why-quote-section .founder-quote-section__link {
  color: #483C51 !important;
  text-decoration: underline !important;
  font-family: var(--font-body) !important;
  font-size: var(--text-sm) !important;
}


/* ═══════════════════════════════════════════════════════════════════════
   HQ MODULE CARDS v2 — 2×2 portrait grid with animated app mockups
   ═══════════════════════════════════════════════════════════════════════ */

/* ── Grid container ── */
.hq-module-cards-v2 {
  display: grid;
  grid-template-columns: repeat(2, 280px);
  gap: var(--space-6);
  justify-content: center;
  margin-top: var(--space-10);
  margin-bottom: var(--space-8);
}

/* ── Individual card ── */
.hq-card-v2 {
  width: 280px;
  border-radius: 16px;
  background: #ffffff;
  border: none;
  box-shadow: 0 4px 24px rgba(72, 60, 81, 0.12);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.hq-card-v2:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 36px rgba(72, 60, 81, 0.18);
}

/* ── Visual zone: top 55% (~198px) ── */
.hq-card-v2__visual {
  height: 198px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  padding: var(--space-5);
  position: relative;
}

/* Visual zone backgrounds by variant */
.hq-card-v2__visual--card {
  background: linear-gradient(135deg, #f3f0f7 0%, #e8eef5 50%, #eff5f0 100%);
}
.hq-card-v2__visual--compliance {
  background: linear-gradient(135deg, #f5f3f8 0%, #eef3f5 100%);
}
.hq-card-v2__visual--network {
  background: linear-gradient(135deg, #f4f2f7 0%, #f0f4ee 100%);
}
.hq-card-v2__visual--tax {
  background: linear-gradient(135deg, #f5f2f7 0%, #f2f5ee 100%);
}

/* ── Meta zone: bottom section ── */
.hq-card-v2__meta {
  padding: var(--space-4) var(--space-5) var(--space-5);
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-top: 1px solid rgba(72, 60, 81, 0.07);
  background: #ffffff;
}

.hq-card-v2__title {
  font-family: var(--font-display);
  font-size: var(--text-sm);
  font-weight: 600;
  color: #483C51;
  letter-spacing: -0.01em;
}

.hq-card-v2__status {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 500;
  color: #4A7C59;
  background: #EDF6E9;
  padding: 3px 10px;
  border-radius: 999px;
}

.hq-card-v2__dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #4A7C59;
  flex-shrink: 0;
}

/* ══════════════════════════════════════════════════════
   AUL CARD v2 — iridescent payment card mockup
   ══════════════════════════════════════════════════════ */

.aul-card-v2 {
  width: 210px;
  height: 132px;
  border-radius: 12px;
  background: linear-gradient(135deg,
    #e8e4f0 0%,
    #dce8f0 30%,
    #e4f0e8 60%,
    #f0e8e4 100%
  );
  position: relative;
  transform: rotate(-8deg);
  box-shadow:
    0 8px 24px rgba(72, 60, 81, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.6);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 14px 16px 12px;
  animation: aulCardRock 4s ease-in-out infinite alternate;
  flex-shrink: 0;
}

@keyframes aulCardRock {
  from { transform: rotate(-8deg) rotateY(-5deg); }
  to   { transform: rotate(-8deg) rotateY(5deg); }
}

/* Shimmer overlay */
.aul-card-v2__shimmer {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    115deg,
    transparent 20%,
    rgba(255, 255, 255, 0.35) 40%,
    rgba(201, 168, 76, 0.15) 50%,
    rgba(255, 255, 255, 0.25) 60%,
    transparent 80%
  );
  background-size: 200% 200%;
  animation: aulShimmer 3.5s ease-in-out infinite;
  pointer-events: none;
  border-radius: 12px;
}

@keyframes aulShimmer {
  0%   { background-position: 200% 0%; }
  100% { background-position: -200% 0%; }
}

.aul-card-v2__top {
  display: flex;
  align-items: flex-start;
}

.aul-card-v2__wordmark {
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 600;
  color: #3D3A44;
  letter-spacing: 0.02em;
  position: relative;
  z-index: 1;
}

.aul-card-v2__tagline {
  font-family: var(--font-body);
  font-size: 8px;
  font-weight: 400;
  color: rgba(61, 58, 68, 0.6);
  margin-top: 2px;
  letter-spacing: 0.04em;
  position: relative;
  z-index: 1;
  align-self: flex-end;
  margin-left: auto;
}

.aul-card-v2__bottom {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  position: relative;
  z-index: 1;
}

.aul-card-v2__chip {
  display: flex;
  align-items: center;
  gap: 5px;
}

.aul-card-v2__chip-rect {
  width: 26px;
  height: 20px;
  border-radius: 4px;
  background: linear-gradient(135deg, #C9A84C 0%, #E8C96A 50%, #C9A84C 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.4);
}

.aul-card-v2__nfc {
  flex-shrink: 0;
}

/* ══════════════════════════════════════════════════════
   CURRENCY MOCK — Global Compliance card
   ══════════════════════════════════════════════════════ */

.curr-mock {
  width: 216px;
  background: #ffffff;
  border: 1px solid rgba(72, 60, 81, 0.12);
  border-radius: 12px;
  padding: 12px 0 8px;
  box-shadow: 0 2px 12px rgba(72, 60, 81, 0.08);
  overflow: hidden;
}

.curr-mock__header {
  font-family: var(--font-body);
  font-size: 10px;
  font-weight: 600;
  color: #6B6070;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  padding: 0 14px 8px;
  border-bottom: 1px solid rgba(72, 60, 81, 0.07);
  margin-bottom: 4px;
}

.curr-mock__row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 14px;
  font-family: var(--font-body);
  font-size: 12px;
  color: #483C51;
  position: relative;
  transition: background 0.3s ease, border-color 0.3s ease;
  border-left: 3px solid transparent;
}

.curr-mock__row.is-active {
  background: rgba(201, 168, 76, 0.08);
  border-left-color: #C9A84C;
}

.curr-mock__flag {
  font-size: 14px;
  line-height: 1;
  flex-shrink: 0;
}

.curr-mock__code {
  font-weight: 600;
  color: #483C51;
  min-width: 32px;
}

.curr-mock__name {
  flex: 1;
  color: #6B6070;
  font-size: 11px;
}

.curr-mock__check {
  font-size: 11px;
  color: #4A7C59;
  font-weight: 700;
  opacity: 0;
  transition: opacity 0.25s ease;
}

.curr-mock__row.is-active .curr-mock__check {
  opacity: 1;
}

/* ══════════════════════════════════════════════════════
   DISC MOCK — Growth Network card
   ══════════════════════════════════════════════════════ */

.disc-mock {
  width: 216px;
  background: #ffffff;
  border: 1px solid rgba(72, 60, 81, 0.12);
  border-radius: 12px;
  padding: 12px 0 8px;
  box-shadow: 0 2px 12px rgba(72, 60, 81, 0.08);
  overflow: hidden;
}

.disc-mock__header {
  font-family: var(--font-body);
  font-size: 10px;
  font-weight: 600;
  color: #6B6070;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  padding: 0 14px 8px;
  border-bottom: 1px solid rgba(72, 60, 81, 0.07);
  margin-bottom: 4px;
}

.disc-mock__row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 14px;
  font-family: var(--font-body);
  font-size: 12px;
  border-left: 3px solid transparent;
  transition: background 0.3s ease, border-color 0.3s ease;
}

.disc-mock__row.is-active {
  background: rgba(72, 60, 81, 0.04);
  border-left-color: #483C51;
}

.disc-mock__bar {
  width: 8px;
  height: 8px;
  border-radius: 2px;
  background: rgba(72, 60, 81, 0.18);
  transition: background 0.3s ease;
  flex-shrink: 0;
}

.disc-mock__row.is-active .disc-mock__bar {
  background: #483C51;
}

.disc-mock__label {
  flex: 1;
  color: #483C51;
  font-weight: 500;
}

.disc-mock__count {
  color: #6B6070;
  font-size: 11px;
}

/* ══════════════════════════════════════════════════════
   TAX MOCK v2 — Tax Obligations card
   ══════════════════════════════════════════════════════ */

.tax-mock-v2 {
  width: 216px;
  background: #ffffff;
  border: 1px solid rgba(72, 60, 81, 0.12);
  border-radius: 12px;
  padding: 12px 0 8px;
  box-shadow: 0 2px 12px rgba(72, 60, 81, 0.08);
  overflow: hidden;
}

.tax-mock-v2__header {
  font-family: var(--font-body);
  font-size: 10px;
  font-weight: 600;
  color: #6B6070;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  padding: 0 14px 8px;
  border-bottom: 1px solid rgba(72, 60, 81, 0.07);
  margin-bottom: 4px;
}

.tax-mock-v2__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 6px 14px;
  gap: 8px;
}

.tax-mock-v2__label {
  font-family: var(--font-body);
  font-size: 11px;
  color: #483C51;
  flex: 1;
}

.tax-mock-v2__badge {
  font-family: var(--font-body);
  font-size: 10px;
  font-weight: 600;
  padding: 3px 9px;
  border-radius: 999px;
  white-space: nowrap;
  transition: background 0.4s ease, color 0.4s ease;
  /* Default = warn (Due / Renew) */
  background: #FFF4E5;
  color: #B06B00;
}

.tax-mock-v2__badge--ok {
  background: #EDF6E9;
  color: #4A7C59;
}

/* Animated states added by JS */
.tax-mock-v2__badge.state-ok {
  background: #EDF6E9;
  color: #4A7C59;
}

.tax-mock-v2__badge.state-warn {
  background: #FFF4E5;
  color: #B06B00;
}

/* ── Responsive: stack to 1 column on mobile ── */
@media (max-width: 680px) {
  .hq-module-cards-v2 {
    grid-template-columns: 280px;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   THREE-FIX PASS — Applied in one pass
   ═══════════════════════════════════════════════════════════════════════ */

/* ── FIX 1: ICP cards — 3-card centered grid, full-width spread ── */
/* Grid: 3 equal columns filling the container width, centered */
.icp__grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: var(--space-6) !important;
  justify-content: center !important;
  width: 100% !important;
}

/* Each card: minimum 300px, flex to fill equally */
.icp-card {
  min-width: 300px !important;
  width: 100% !important;
}

/* Responsive: stack earlier now that we have 3 columns instead of 5 */
@media (max-width: 960px) {
  .icp__grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

@media (max-width: 640px) {
  .icp__grid {
    grid-template-columns: 1fr !important;
  }
  .icp-card {
    min-width: unset !important;
  }
}

/* ── FIX 2: WHO IT'S FOR eyebrow — nuclear center fix ── */
/* The eyebrow uses display:flex which ignores text-align.
   Override to block so text-align:center takes effect.
   Also center as a flex item if parent is flex. */
.icp .section-header .eyebrow,
.icp .eyebrow,
section.icp p.eyebrow {
  display: block !important;
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  width: 100% !important;
  justify-content: center !important;
}

/* The ::before dot: re-inject as a centered inline element */
.icp .eyebrow::before,
.icp .section-header .eyebrow::before,
section.icp p.eyebrow::before {
  display: inline-block !important;
  vertical-align: middle !important;
  margin-right: 0.4em !important;
}

/* ── FIX 3: CTA band buttons — min-width + breathing room ── */
.cta-band .btn--cta-gold,
.cta-band .btn--cta-ghost {
  min-width: 200px !important;
  padding: 14px 32px !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
}


/* ═══════════════════════════════════════════════════════════════════
   PHASE 1 FEATURE CARDS
   ═══════════════════════════════════════════════════════════════════ */

/* PHASE 1 FEATURE CARDS — 2x2 grid, wireframe-animation cards */
.p1-cards {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  margin-top: 48px;
  margin-bottom: 0;
  width: 100%;
  align-items: stretch;
}

@media (max-width: 640px) {
  .p1-cards { grid-template-columns: 1fr; }
}

/* ── Card shell: white, no border, soft shadow, 16px radius, equal height ── */
.p1-card {
  position: relative;
  background: #FFFFFF;
  border: none;
  border-radius: 16px;
  box-shadow: 0 4px 24px rgba(72, 60, 81, 0.08);
  padding: 24px 24px 26px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
  min-height: 320px;
  overflow: hidden;
}

/* ── Feature title — Playfair, aubergine, left-aligned ── */
.p1-card__title {
  font-family: 'Playfair Display', serif;
  font-size: 22px;
  font-weight: 600;
  color: #483C51;
  line-height: 1.2;
  text-align: left;
  align-self: stretch;
  margin-top: 4px;
}

/* ── Benefit line — Inter, regular, muted dark gray, left-aligned ── */
.p1-card__benefit {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 400;
  color: #6E6377;
  margin: 8px 0 0;
  line-height: 1.5;
  text-align: left;
  align-self: stretch;
}

@media (max-width: 900px) {
  .p1-card__benefit { line-height: 1.45; }
}

/* ════════ WIREFRAME ANIMATION AREA — shared ════════ */
.p1-card__wire {
  position: relative;
  width: 100%;
  height: 224px;
  margin-bottom: 18px;
  border-radius: 12px;
  background: #F7F6F8;
  border: 1px solid #ECEAEF;
  overflow: hidden;
  flex-shrink: 0;
}

/* ──────── CARD 1: DASHBOARD — soft glow passes element to element, no zoom ──────── */
.wire-dash2 {
  position: absolute;
  inset: 0;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.wire-dash2__top {
  display: grid;
  grid-template-columns: 1fr 0.82fr;
  gap: 12px;
  flex: 1.05;
}
.wire-dash2__gauge {
  position: relative;
  background: #FFFFFF;
  border: 1px solid #E4E1E8;
  border-radius: 10px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 12px 8px 10px;
  transition: box-shadow 0.6s ease, border-color 0.6s ease;
}
.wire-dash2__gaugewrap {
  position: relative;
  width: 78px;
  height: 44px;
}
.wire-dash2__arc { width: 78px; height: 44px; display: block; }
.wire-dash2__score {
  position: absolute;
  left: 50%;
  top: 22px;
  transform: translateX(-50%);
  width: 30px;
  height: 11px;
  border-radius: 5px;
  background: #C9C2D2;
}
.wire-dash2__scorelbl {
  position: absolute;
  left: 50%;
  top: 37px;
  transform: translateX(-50%);
  width: 34px;
  height: 5px;
  border-radius: 3px;
  background: #DAD5E0;
}
.wire-dash2__delta {
  margin-top: 9px;
  width: 34px;
  height: 7px;
  border-radius: 4px;
  background: #DFDAE5;
}
.wire-dash2__status {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.wire-dash2__stat {
  flex: 1;
  background: #FFFFFF;
  border: 1px solid #E4E1E8;
  border-radius: 10px;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 0 10px;
  transition: box-shadow 0.6s ease, border-color 0.6s ease;
}
.wire-dash2__chip {
  width: 22px;
  height: 22px;
  border-radius: 7px;
  flex-shrink: 0;
}
.wire-dash2__chip--red   { background: #FAECE9; }
.wire-dash2__chip--blue  { background: #E7F1F7; }
.wire-dash2__chip--green { background: #EDF6E9; }
.wire-dash2__statbars {
  display: flex;
  flex-direction: column;
  gap: 5px;
  flex: 1;
}
.wire-dash2__statbars span {
  display: block;
  height: 6px;
  border-radius: 3px;
  background: #DFDAE5;
}
.wire-dash2__statbars span:first-child { width: 40%; background: #CFC8D8; }
.wire-dash2__statbars span:last-child  { width: 70%; }
.wire-dash2__bottom {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  flex: 1;
}
.wire-dash2__bcard {
  background: #FFFFFF;
  border: 1px solid #E4E1E8;
  border-radius: 10px;
  padding: 10px 11px;
  display: flex;
  flex-direction: column;
  gap: 5px;
  transition: box-shadow 0.6s ease, border-color 0.6s ease;
}
.wire-dash2__blabel {
  font-family: 'Inter', sans-serif;
  font-size: 9.5px;
  font-weight: 600;
  letter-spacing: 0.03em;
  color: #9A92A3;
  text-transform: uppercase;
}
.wire-dash2__bnum {
  width: 56%;
  height: 12px;
  border-radius: 5px;
  background: #C9C2D2;
  margin-bottom: 3px;
}
.wire-dash2__brow {
  width: 100%;
  height: 5px;
  border-radius: 3px;
  background: #E2DDE8;
}
.wire-dash2__brow:nth-child(3) { width: 90%; }
.wire-dash2__brow:nth-child(4) { width: 78%; }
.wire-dash2__brow:nth-child(5) { width: 84%; }
.wire-dash2__brow:nth-child(6) { width: 66%; }
/* glow passes element to element — 6 elements, ~10s loop, 1.5s hold each */
.wire-dash2 [data-el] { animation: dashGlow 10.2s ease-in-out infinite; }
.wire-dash2 [data-el="0"] { animation-delay: 0s; }
.wire-dash2 [data-el="1"] { animation-delay: 1.6s; }
.wire-dash2 [data-el="2"] { animation-delay: 3.2s; }
.wire-dash2 [data-el="3"] { animation-delay: 4.8s; }
.wire-dash2 [data-el="4"] { animation-delay: 6.4s; }
.wire-dash2 [data-el="5"] { animation-delay: 8.0s; }
@keyframes dashGlow {
  0%      { box-shadow: none; border-color: #E4E1E8; }
  2%      { box-shadow: 0 0 0 2px rgba(72,60,81,0.16), 0 4px 14px rgba(72,60,81,0.10); border-color: #C9C2D2; }
  14.7%   { box-shadow: 0 0 0 2px rgba(72,60,81,0.16), 0 4px 14px rgba(72,60,81,0.10); border-color: #C9C2D2; }
  16.7%   { box-shadow: none; border-color: #E4E1E8; }
  100%    { box-shadow: none; border-color: #E4E1E8; }
}

/* ──────── CARD 2: OBLIGATIONS — status pills highlight one at a time ──────── */
.wire-obl {
  position: absolute;
  inset: 0;
  padding: 20px 18px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.wire-obl__pills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.wire-obl__pill {
  font-family: 'Inter', sans-serif;
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: #8B8392;
  background: #FFFFFF;
  border: 1px solid #E4E1E8;
  border-radius: 999px;
  padding: 5px 11px;
  line-height: 1;
  transition: all 0.4s ease;
}
.wire-obl__pill[data-st="overdue"]   { animation: oblOverdue   6s ease-in-out infinite; }
.wire-obl__pill[data-st="progress"]  { animation: oblProgress  6s ease-in-out infinite; }
.wire-obl__pill[data-st="coming"]    { animation: oblComing    6s ease-in-out infinite; }
.wire-obl__pill[data-st="compliant"] { animation: oblCompliant 6s ease-in-out infinite; }
@keyframes oblOverdue {
  0%, 25%, 100% { background:#FFFFFF; border-color:#E4E1E8; color:#8B8392; }
  4%, 21%       { background:#FBE9E7; border-color:#E8B4AC; color:#B0524A; }
}
@keyframes oblProgress {
  0%, 25%, 50%, 100% { background:#FFFFFF; border-color:#E4E1E8; color:#8B8392; }
  29%, 46%           { background:#FBF1DF; border-color:#E6C98F; color:#9A7B33; }
}
@keyframes oblComing {
  0%, 50%, 75%, 100% { background:#FFFFFF; border-color:#E4E1E8; color:#8B8392; }
  54%, 71%           { background:#E7F1F7; border-color:#A9CDDF; color:#3F7191; }
}
@keyframes oblCompliant {
  0%, 75%, 100% { background:#FFFFFF; border-color:#E4E1E8; color:#8B8392; }
  79%, 96%      { background:#EDF6E9; border-color:#AED3A4; color:#477A52; }
}
.wire-obl__rows {
  display: flex;
  flex-direction: column;
  gap: 11px;
  margin-top: 2px;
}
.wire-obl__row {
  display: block;
  height: 11px;
  border-radius: 6px;
  background: #E6E2EB;
}
.wire-obl__row:nth-child(1) { width: 92%; }
.wire-obl__row:nth-child(2) { width: 78%; }
.wire-obl__row:nth-child(3) { width: 85%; }

/* ──────── CARD 3: CERTIFICATION HUB — scrolling cert cards, ~3s per card ──────── */
.wire-cert2 {
  position: absolute;
  inset: 0;
  overflow: hidden;
}
.wire-cert2__viewport {
  position: absolute;
  inset: 0;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 9%, #000 88%, transparent 100%);
  mask-image: linear-gradient(to bottom, transparent 0, #000 9%, #000 88%, transparent 100%);
}
.wire-cert2__track {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  display: flex;
  flex-direction: column;
  padding: 14px 14px 0;
  gap: 12px;
  animation: cert2Scroll 12s steps(1, end) infinite;
}
/* 5 cards (4 unique + 1 repeat of first); step every 3s, translate one card+gap each step */
@keyframes cert2Scroll {
  0%   { transform: translateY(0); }
  25%  { transform: translateY(calc(-1 * (var(--cert-step)))); }
  50%  { transform: translateY(calc(-2 * (var(--cert-step)))); }
  75%  { transform: translateY(calc(-3 * (var(--cert-step)))); }
  100% { transform: translateY(calc(-4 * (var(--cert-step)))); }
}
.wire-cert2 { --cert-step: 85px; }
.wire-cert2__card {
  background: #FFFFFF;
  border: 1px solid #E9E6ED;
  border-radius: 10px;
  padding: 11px 13px 13px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex-shrink: 0;
}
.wire-cert2__line {
  display: flex;
  align-items: center;
  gap: 7px;
}
.wire-cert2__type {
  font-family: 'Inter', sans-serif;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #8B8392;
}
.wire-cert2__pill {
  font-family: 'Inter', sans-serif;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  border-radius: 999px;
  padding: 3px 8px;
  line-height: 1;
}
.wire-cert2__pill--gold {
  background: #F6EDD5;
  color: #9A7B33;
}
.wire-cert2__pill--gov {
  background: transparent;
  border: 1px solid #A9CDDF;
  color: #3F7191;
}
.wire-cert2__name {
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: #5E5666;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ──────── CARD 4: BACK OFFICE HUB — six rows scroll upward, ~8s full cycle ──────── */
.wire-bo {
  position: absolute;
  inset: 0;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 10%, #000 88%, transparent 100%);
  mask-image: linear-gradient(to bottom, transparent 0, #000 10%, #000 88%, transparent 100%);
}
.wire-bo__viewport {
  position: absolute;
  inset: 0;
  overflow: hidden;
}
.wire-bo__track {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  display: flex;
  flex-direction: column;
  padding: 0 16px;
  animation: boScroll 16s linear infinite;
}
@keyframes boScroll {
  0%   { transform: translateY(0); }
  100% { transform: translateY(-50%); }
}
.wire-bo__row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 13px 4px;
  border-bottom: 1px solid #EEECF1;
}
.wire-bo__chip {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  flex-shrink: 0;
}
.wire-bo__name {
  font-family: 'Inter', sans-serif;
  font-size: 12.5px;
  font-weight: 500;
  color: #6E6377;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media (prefers-reduced-motion: reduce) {
  .wire-dash2 [data-el],
  .wire-obl__pill,
  .wire-cert2__track, .wire-bo__track {
    animation: none !important;
  }
  .wire-bo__track { transform: translateY(0); }
}


/* ═══════════════════════════════════════════════════════════════════
   COMING SOON SECTION
   ═══════════════════════════════════════════════════════════════════ */

.coming-soon-section {
  background: #ffffff;
  padding: 80px 0 88px;
}

.coming-soon-section__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 48px;
}

.coming-soon-section__pill {
  display: inline-block;
  background: #FBEDD5;
  color: #967634;
  font-family: 'Inter', sans-serif;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 3px 9px;
  border-radius: 20px;
  line-height: 1;
  white-space: nowrap;
  margin-bottom: -32px;
}

.coming-soon-section__heading {
  font-family: 'Playfair Display', serif;
  font-size: clamp(26px, 3.5vw, 40px);
  font-weight: 500;
  color: #483C51;
  text-align: center;
  line-height: 1.25;
  margin: 0;
  max-width: 680px;
}
.coming-soon-section__heading em {
  font-style: normal !important;
  color: #483C51;
}

/* ── Grid ── */
.coming-soon-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  width: 100%;
}

@media (max-width: 900px) {
  .coming-soon-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .coming-soon-grid { grid-template-columns: 1fr; }
}

/* ── Coming Soon card ── */
.cs-card {
  background: #F7F5FA;
  border-radius: 14px;
  padding: 22px 22px 24px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  border: 1px solid #EDE9F2;
  transition: box-shadow 0.2s ease;
}
.cs-card:hover {
  box-shadow: 0 4px 16px rgba(72,60,81,0.08);
}

.cs-card__eyebrow {
  font-family: 'Inter', sans-serif;
  font-size: 9px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #B0A6BA;
  margin: 0;
  line-height: 1;
}

.cs-card__title-row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.cs-card__title {
  display: block;
  font-family: 'Playfair Display', serif;
  font-size: 17px;
  font-weight: 600;
  color: #6B6070;
}

.cs-card__tag {
  display: inline-flex;
  align-items: center;
  background: #F2F2F4;
  color: #9B8FA8;
  font-family: 'Inter', sans-serif;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.03em;
  padding: 3px 9px;
  border-radius: 20px;
  white-space: nowrap;
}

.cs-card__desc {
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 400;
  color: #9B8FA8;
  margin: 0;
  line-height: 1.55;
}

/* ═══════════════════════════════════════════════════════════════════════
   WHO IT'S FOR — five-card layout (single row), link line
   Added per homepage update. Card glass treatment unchanged.
   ═══════════════════════════════════════════════════════════════════════ */

/* Single row: 5 equal columns, all five cards side by side, centered. */
.icp__grid--five {
  display: grid !important;
  grid-template-columns: repeat(5, 1fr) !important;
  gap: var(--space-6) !important;
  justify-content: center !important;
  align-items: stretch !important;
  width: 100% !important;
}
.icp__grid--five > .icp-card {
  grid-column: auto !important;
  min-width: 0 !important;
  width: 100% !important;
}

/* Center all card content for the five-card layout */
.icp__grid--five > .icp-card {
  text-align: center !important;
  align-items: center !important;
}
.icp__grid--five > .icp-card .icp-card__icon { margin-inline: auto; }

/* Card eyebrow — Inter, small caps, letter-spaced, centered */
.icp-card__eyebrow {
  font-family: var(--font-body);
  font-size: 0.6875rem;
  font-weight: 600;
  font-style: normal;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: #8A7F96;
  text-align: center;
  margin: 0;
  position: relative;
  z-index: 1;
}

/* Card body — centered, muted dark gray (inherits .icp-card p sizing) */
.icp__grid--five > .icp-card p:not(.icp-card__eyebrow) {
  text-align: center !important;
  color: #4A4453 !important;
}

/* Bottom link line — bold aubergine inline text link, centered */
.icp-card__link {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 700;
  color: #483C51;
  text-align: center;
  text-decoration: none;
  margin-top: auto;
  padding-top: var(--space-2);
  position: relative;
  z-index: 1;
  transition: color var(--transition-fast), text-decoration-color var(--transition-fast);
}
.icp-card__link:hover,
.icp-card__link:focus-visible {
  color: #2F2738;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.icp-card__link:focus-visible {
  outline: 2px solid #483C51;
  outline-offset: 3px;
  border-radius: 4px;
}

/* Responsive: tablet -> 2 per row (4 cols, span 2); phone -> 1 per row */
@media (max-width: 1000px) {
  .icp__grid--five {
    grid-template-columns: repeat(3, 1fr) !important;
  }
  .icp__grid--five > .icp-card {
    grid-column: auto !important;
  }
}
@media (max-width: 720px) {
  .icp__grid--five {
    grid-template-columns: repeat(2, 1fr) !important;
  }
  .icp__grid--five > .icp-card {
    grid-column: auto !important;
  }
}
@media (max-width: 480px) {
  .icp__grid--five {
    grid-template-columns: 1fr !important;
  }
  .icp__grid--five > .icp-card {
    grid-column: 1 / -1 !important;
    min-width: unset !important;
  }
}

/* Five-card layout: keep eyebrow/title/body top-aligned, link pinned bottom.
   Override the inherited flex:1 on body so titles align across cards. */
.icp__grid--five > .icp-card p:not(.icp-card__eyebrow) {
  flex: 0 0 auto !important;
}
.icp__grid--five > .icp-card .icp-card__link {
  margin-top: auto !important;
}

/* Content starts at top of each card; link pinned to bottom via margin-top:auto */
.icp__grid--five > .icp-card {
  justify-content: flex-start !important;
}

/* Eyebrow must not flex-grow (it inherits .icp-card p { flex:1 }) */
.icp__grid--five > .icp-card .icp-card__eyebrow {
  flex: 0 0 auto !important;
}

/* ── FOUNDING MEMBER APPLICATION ─────────────────────────────────────────── */
.founding-apply {
  background: #FFFFFF;
  padding-block: clamp(var(--space-16), 8vw, var(--space-24));
}

.founding-apply__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.founding-apply__intro {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  max-width: 640px;
}

.founding-apply__eyebrow {
  justify-content: center;
  color: var(--color-primary);
}

.founding-apply__eyebrow::before {
  background: var(--color-primary);
}

/* Force aubergine eyebrow over themed .eyebrow overrides (specificity) */
[data-theme='light'] .founding-apply__eyebrow,
:root:not([data-theme]) .founding-apply__eyebrow,
[data-theme='dark'] .founding-apply__eyebrow {
  color: #483C51;
}

[data-theme='light'] .founding-apply__eyebrow::before,
:root:not([data-theme]) .founding-apply__eyebrow::before,
[data-theme='dark'] .founding-apply__eyebrow::before {
  background: #483C51;
}

.founding-apply__heading {
  font-family: var(--font-display);
  font-size: clamp(var(--text-2xl), 3.5vw, var(--text-3xl));
  font-weight: 400;
  color: var(--color-primary);
  line-height: 1.15;
  letter-spacing: -0.02em;
  font-style: normal;
  margin-top: var(--space-2);
}

.founding-apply__body {
  font-family: var(--font-body);
  font-size: var(--text-base);
  font-weight: 400;
  color: var(--color-gray);
  line-height: 1.75;
  max-width: 560px;
  font-style: normal;
}

.founding-apply__intro .founding-apply__body:first-of-type {
  margin-top: var(--space-5);
}

/* Form card */
.founding-apply__form {
  width: 100%;
  max-width: 560px;
  margin-top: var(--space-10);
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  text-align: left;
}

.founding-field {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.founding-field__label {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 600;
  color: var(--color-text);
}

.founding-field__input {
  font-family: var(--font-body);
  font-size: var(--text-base);
  color: var(--color-text);
  background: #FFFFFF;
  border: 1.5px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: 0.85rem 1rem;
  width: 100%;
  transition: border-color var(--transition-interactive), box-shadow var(--transition-interactive);
}

.founding-field__input::placeholder {
  color: var(--color-text-faint);
}

.founding-field__input:focus {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px var(--color-primary-glow);
}

.founding-field__select {
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23483C51' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 1rem center;
  padding-right: 2.5rem;
}

.founding-apply__submit {
  margin-top: var(--space-2);
  align-self: stretch;
  justify-content: center;
}

.founding-apply__disclaimer {
  font-family: var(--font-body);
  font-size: 11px;
  line-height: 1.6;
  color: var(--color-text-faint);
  text-align: center;
  margin-top: var(--space-2);
  max-width: 560px;
}

/* Fade transition for the original section on successful submit */
.founding-apply__intro,
.founding-apply__form {
  transition: opacity 0.3s ease;
}

.founding-apply__intro.is-fading-out,
.founding-apply__form.is-fading-out {
  opacity: 0;
}

/* Growth Network form fade-out mirrors the founding form transition */
.partners-apply__intro,
.partners-form {
  transition: opacity 0.3s ease;
}
.partners-apply__intro.is-fading-out,
.partners-form.is-fading-out {
  opacity: 0;
}

/* Confirmation — centered on white, generous padding, fades in */
.founding-apply__confirm {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  max-width: 560px;
  padding-block: clamp(var(--space-12), 6vw, var(--space-20));
  opacity: 0;
  transition: opacity 0.3s ease;
}

.founding-apply__confirm.is-visible {
  opacity: 1;
}

.founding-apply__confirm-heading {
  font-family: var(--font-display);
  font-size: clamp(var(--text-2xl), 3.5vw, var(--text-3xl));
  font-weight: 400;
  color: #483C51;
  line-height: 1.15;
  letter-spacing: -0.02em;
  font-style: normal;
}

.founding-apply__confirm-body {
  font-family: var(--font-body);
  font-size: var(--text-base);
  font-weight: 400;
  color: var(--color-gray);
  line-height: 1.75;
  max-width: 560px;
  text-align: center;
  font-style: normal;
  margin-top: var(--space-5);
}

@media (max-width: 640px) {
  .founding-apply__heading,
  .founding-apply__confirm-heading {
    font-size: var(--text-xl);
  }
}

/* Ensure hidden attribute wins over flex display for the founding form/confirm */
.founding-apply__intro[hidden],
.founding-apply__form[hidden],
.founding-apply__confirm[hidden] {
  display: none;
}

/* ════════════════════════════════════════════════════════════════════════
   /for/ AUDIENCE SUBPAGE TEMPLATE
   ════════════════════════════════════════════════════════════════════════ */

/* Hero — centered, white background, generous padding */
.for-hero {
  background: #FFFFFF;
  padding-top: calc(var(--space-24) + var(--space-8));
  padding-bottom: clamp(var(--space-14), 7vw, var(--space-24));
}

.for-hero__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  max-width: 760px;
  margin-inline: auto;
}

.for-hero__eyebrow {
  color: var(--color-primary);
  justify-content: center;
}

.for-hero__eyebrow::before {
  background: var(--color-primary);
}

.for-hero__heading {
  font-family: var(--font-display);
  font-weight: 400;
  font-style: normal;
  color: var(--color-primary);
  font-size: clamp(var(--text-2xl), 4vw, var(--text-3xl));
  line-height: 1.12;
  letter-spacing: -0.02em;
  margin-top: var(--space-3);
  max-width: 20ch;
}

.for-hero__intro {
  font-family: var(--font-body);
  font-size: var(--text-base);
  font-weight: 400;
  color: var(--color-gray);
  line-height: 1.85;
  margin-top: var(--space-6);
  max-width: 680px;
}

/* Module rows — alternating, white background, generous padding */
.for-module {
  background: #FFFFFF;
  padding-block: clamp(var(--space-14), 7vw, var(--space-24));
}

.for-module__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: clamp(var(--space-10), 6vw, var(--space-20));
}

.for-module--reverse .for-module__text {
  order: 2;
}

.for-module--reverse .for-module__visual {
  order: 1;
}

.for-module__text {
  max-width: 560px;
  text-align: left;
}

.for-module__eyebrow {
  color: var(--color-primary);
}

.for-module__eyebrow::before {
  background: var(--color-primary);
}

.for-module__heading {
  font-family: var(--font-display);
  font-weight: 400;
  font-style: normal;
  color: var(--color-primary);
  font-size: clamp(var(--text-xl), 2.6vw, var(--text-2xl));
  line-height: 1.18;
  letter-spacing: -0.015em;
  margin-top: var(--space-3);
  text-align: left;
}

.for-module__body {
  font-family: var(--font-body);
  font-size: var(--text-base);
  font-weight: 400;
  color: var(--color-gray);
  line-height: 1.85;
  margin-top: var(--space-5);
  max-width: 520px;
  text-align: left;
}

/* Visual placeholder — soft light gray rounded rectangle with subtle shadow */
.for-module__visual {
  width: 100%;
  display: flex;
  justify-content: center;
}

.for-module__placeholder {
  width: 100%;
  max-width: 480px;
  aspect-ratio: 3 / 2;
  background: #F4F2EF;
  border-radius: 16px;
  box-shadow: 0 4px 24px rgba(72, 60, 81, 0.08);
}

/* Placeholder labels hidden — pure rounded rectangle per design spec */
.for-module__placeholder span {
  display: none;
}

/* Personalized app mockup image — same rounded + soft-shadow treatment as placeholder */
.for-module__shot {
  width: 100%;
  max-width: 480px;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 4px 24px rgba(72, 60, 81, 0.08);
  background: #FFFFFF;
}
.for-module__shot img {
  display: block;
  width: 100%;
  height: auto;
}

/* Final CTA — centered, white background, generous padding */
.for-cta {
  background: #FFFFFF;
  padding-top: clamp(var(--space-10), 5vw, var(--space-14));
  padding-bottom: clamp(var(--space-20), 9vw, var(--space-32));
}

.for-cta__inner {
  display: flex;
  justify-content: center;
}

.for-cta__btn {
  justify-content: center;
}

/* Responsive */
@media (max-width: 860px) {
  .for-module__inner {
    grid-template-columns: 1fr;
    gap: var(--space-8);
  }
  .for-module--reverse .for-module__text,
  .for-module--reverse .for-module__visual {
    order: initial;
  }
  .for-module__visual {
    order: -1;
  }
  .for-module--reverse .for-module__visual {
    order: -1;
  }
  .for-module__placeholder {
    aspect-ratio: 16 / 9;
  }
}

/* ═══════════════════════════════════════════════════════ HOME INTEGRATIONS COMPOSITION */
.home-integrations {
  background: #FFFFFF;
  padding: var(--space-24, 7rem) 0;
  overflow: hidden;
}
.home-integrations__head {
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.home-integrations__eyebrow {
  color: var(--color-primary, #483C51);
  text-align: center;
  margin-bottom: 1rem;
}
.home-integrations__heading {
  font-family: var(--font-display, 'Playfair Display'), serif;
  color: var(--color-primary, #483C51);
  font-weight: 500;
  font-size: clamp(1.9rem, 3.6vw, 2.9rem);
  line-height: 1.15;
  margin: 0 0 1.1rem;
  text-align: center;
}
.home-integrations__sub {
  font-family: var(--font-body, 'Inter'), sans-serif;
  color: var(--color-gray, #6B6070);
  font-size: 1.05rem;
  line-height: 1.6;
  max-width: 560px;
  margin: 0 auto;
  text-align: center;
}

.home-integrations__stage {
  position: relative;
  max-width: 1120px;
  margin: 3.5rem auto 0;
  padding: 0 1.25rem;
}

/* LAYER 1 — scattered icon cards */
.int-cards {
  position: relative;
  height: 175px;
  width: 100%;
  z-index: 3;
}
.int-card {
  position: absolute;
  width: 64px;
  height: 64px;
  background: #FFFFFF;
  border-radius: 16px;
  box-shadow: 0 4px 16px rgba(72, 60, 81, 0.10);
  display: flex;
  align-items: center;
  justify-content: center;
  transform: translateX(-50%);
}
.int-card svg { display: block; }

/* LAYER 2 — funnel lines */
.int-funnel {
  position: absolute;
  top: 88px;
  left: 0;
  width: 100%;
  height: 360px;
  z-index: 1;
  pointer-events: none;
}

/* LAYER 3 — dashboard frame */
.int-dash {
  position: relative;
  z-index: 2;
  max-width: 560px;
  margin: 250px auto 0;
}
.int-dash__frame {
  background: #FFFFFF;
  border: 1px solid var(--color-border, #DDD8D0);
  border-radius: 16px;
  box-shadow: 0 24px 60px rgba(72, 60, 81, 0.16);
  overflow: hidden;
}
.int-dash__bar {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 12px 16px;
  background: var(--color-surface-2, #F7F5F0);
  border-bottom: 1px solid var(--color-border, #DDD8D0);
}
.int-dash__dot {
  width: 9px; height: 9px; border-radius: 50%;
  background: #D8D2E0;
}
.int-dash__title {
  margin-left: 8px;
  font-family: var(--font-body, 'Inter'), sans-serif;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--color-primary, #483C51);
  letter-spacing: 0.02em;
}
.int-dash__body { display: flex; min-height: 230px; }
.int-dash__rail {
  width: 56px;
  background: #FBFAFC;
  border-right: 1px solid var(--color-border, #DDD8D0);
  padding: 18px 12px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.int-dash__navitem {
  height: 8px; border-radius: 4px;
  background: #E7E2EE;
}
.int-dash__main { flex: 1; padding: 18px; display: flex; flex-direction: column; gap: 14px; }
.int-dash__toprow { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.int-dash__block { height: 40px; border-radius: 8px; background: #EFEBF3; }
.int-dash__content { flex: 1; min-height: 110px; border-radius: 10px; background: #F4F1F7; }

/* floating callout bubbles */
.int-bubble {
  position: absolute;
  display: flex;
  align-items: center;
  gap: 8px;
  background: #FFFFFF;
  border: 1px solid var(--color-border, #DDD8D0);
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(72, 60, 81, 0.14);
  padding: 10px 14px;
  font-family: var(--font-body, 'Inter'), sans-serif;
  font-size: 0.82rem;
  font-weight: 500;
  color: var(--color-primary, #483C51);
  white-space: nowrap;
  opacity: 0;
  transform: translateY(8px) scale(0.96);
  pointer-events: none;
  z-index: 4;
  animation: intBubble 18s infinite;
}
.int-bubble__dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: #7BC9A8;
  flex-shrink: 0;
}
.int-bubble--1 { top: -34px;  right: -40px; animation-delay: 0s; }
.int-bubble--2 { top: 70px;   left: -120px; animation-delay: 3s; }
.int-bubble--3 { top: 150px;  right: -70px; animation-delay: 6s; }
.int-bubble--4 { bottom: 40px; left: -110px; animation-delay: 9s; }
.int-bubble--5 { bottom: -28px; right: -30px; animation-delay: 12s; }
.int-bubble--6 { top: 30px;   left: 50%; transform: translateX(-50%) translateY(8px) scale(0.96); animation-delay: 15s; }

@keyframes intBubble {
  0%      { opacity: 0; transform: translateY(8px) scale(0.96); }
  2.2%    { opacity: 1; transform: translateY(0) scale(1); }
  13.8%   { opacity: 1; transform: translateY(0) scale(1); }
  16.6%   { opacity: 0; transform: translateY(-8px) scale(0.97); }
  100%    { opacity: 0; transform: translateY(-8px) scale(0.97); }
}
/* keep bubble 6 centered while animating */
.int-bubble--6 { animation-name: intBubbleCenter; }
@keyframes intBubbleCenter {
  0%      { opacity: 0; transform: translateX(-50%) translateY(8px) scale(0.96); }
  2.2%    { opacity: 1; transform: translateX(-50%) translateY(0) scale(1); }
  13.8%   { opacity: 1; transform: translateX(-50%) translateY(0) scale(1); }
  16.6%   { opacity: 0; transform: translateX(-50%) translateY(-8px) scale(0.97); }
  100%    { opacity: 0; transform: translateX(-50%) translateY(-8px) scale(0.97); }
}

@media (prefers-reduced-motion: reduce) {
  .int-bubble { animation: none; opacity: 1; transform: none; }
  .int-bubble--6 { transform: translateX(-50%); }
}

@media (max-width: 900px) {
  .int-dash { max-width: 92%; margin-top: 230px; }
  .int-bubble { display: none; }
  .int-bubble--1, .int-bubble--3 { display: flex; }
  .int-bubble--1 { right: 4px; top: -28px; }
  .int-bubble--3 { right: 4px; top: auto; bottom: -24px; }
}
@media (max-width: 600px) {
  .int-card { width: 52px; height: 52px; border-radius: 13px; }
  .int-card svg { width: 24px; height: 24px; }
  .int-cards { height: 150px; }
  .int-funnel { top: 70px; }
  .int-dash { margin-top: 200px; }
  .int-bubble { font-size: 0.74rem; padding: 8px 11px; }
}

/* ═══════════════════════════════════════════════════════ NAV / HERO HORIZONTAL ALIGNMENT FIX
   Lock the nav bar container and hero content wrapper to the EXACT same
   horizontal boundary so the logo aligns with the hero headline and the
   Start Free button aligns with the disclaimer text. Desktop only. */
@media (min-width: 861px) {
  .nav__inner,
  .hero__content {
    max-width: 1280px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 64px !important;
    padding-right: 64px !important;
  }
}

/* ═══════════════════════════════════════════════════════ NAV "WHO IT'S FOR" DROPDOWN */
.nav__item--dropdown {
  position: relative;
  display: inline-flex;
  align-items: center;
}
.nav__dropdown-toggle {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  white-space: nowrap;
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 400;
  color: var(--color-text-muted);
  transition: color var(--transition-interactive);
  line-height: 1;
}
.nav:not(.nav--scrolled) .nav__dropdown-toggle {
  color: #2D2A33;
}
.nav__dropdown-toggle:hover,
.nav__item--dropdown.is-open .nav__dropdown-toggle {
  color: #483C51;
}
.nav__chevron {
  transition: transform 0.2s ease;
}
.nav__item--dropdown.is-open .nav__chevron,
.nav__item--dropdown:hover .nav__chevron {
  transform: rotate(180deg);
}

.nav__dropdown {
  position: absolute;
  top: calc(100% + 14px);
  left: 50%;
  transform: translateX(-50%) translateY(6px);
  min-width: 240px;
  background: #FFFFFF;
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(72, 60, 81, 0.16);
  padding: 12px 16px;
  display: flex;
  flex-direction: column;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s;
  z-index: 200;
}
/* hover bridge so cursor can travel from toggle to dropdown */
.nav__item--dropdown::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  height: 16px;
}
.nav__item--dropdown:hover .nav__dropdown,
.nav__item--dropdown.is-open .nav__dropdown {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}
.nav__dropdown-link {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 400;
  color: #3D3A44;
  text-decoration: none;
  padding: 10px 0;
  white-space: nowrap;
  transition: color var(--transition-interactive);
}
.nav__dropdown-link:hover {
  color: #483C51;
}

/* mobile group inside hamburger menu */
.nav__mobile-group {
  display: flex;
  flex-direction: column;
}
.nav__mobile-grouplabel {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-text-faint);
  padding: 8px 0 4px;
}
.nav__mobile-sublink {
  font-family: var(--font-body);
  font-size: var(--text-base);
  font-weight: 400;
  color: #3D3A44;
  text-decoration: none;
  padding: 8px 0 8px 14px;
  transition: color var(--transition-interactive);
}
.nav__mobile-sublink:hover {
  color: #483C51;
}

/* ═══════════════════════════════════════════════════════ NAV FIXES (Jun 2026) */
/* Keep "Growth Network" on a single line */
.nav__nowrap {
  white-space: nowrap;
}

/* Watch Demo CTA button — matches hero "See the Platform" (transparent, aubergine
   border + text) with the same size as the Start Free button (btn--primary-sm) */
.btn--watch-demo-sm {
  background: transparent;
  color: #483C51;
  border: 1.5px solid #483C51;
  font-size: var(--text-xs);
  font-weight: 600;
  padding: var(--space-2) var(--space-5);
  border-radius: var(--radius-full);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  transition: all var(--transition-interactive);
}
.btn--watch-demo-sm:hover {
  background: #483C51;
  color: #FFFFFF;
}


/* ============================================================
   PRODUCT PAGE REBUILD — Sections 1-6 (added 2026-06-25)
   Marketing system: Playfair + Inter + aubergine + gold.
   No italic anywhere on this page.
   ============================================================ */

/* -- SECTION 1: HERO -- */
.prod-hero {
  background: var(--color-surface);
  padding: calc(clamp(var(--space-16), 9vw, var(--space-24)) + 80px) 0 clamp(var(--space-16), 9vw, var(--space-24));
}
.prod-hero__inner {
  display: grid;
  grid-template-columns: 1fr 1.05fr;
  gap: clamp(var(--space-10), 5vw, var(--space-20));
  align-items: center;
}
.prod-hero__copy { max-width: 540px; }
.prod-hero__title {
  font-family: var(--font-display);
  font-size: var(--text-3xl);
  font-weight: 400;
  font-style: normal;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--color-text);
  margin-bottom: var(--space-3);
}
.prod-hero__subhead {
  font-family: var(--font-display);
  font-size: var(--text-3xl);
  font-weight: 400;
  font-style: normal;
  line-height: 1.08;
  letter-spacing: -0.02em;
  color: var(--color-text-muted);
  margin-bottom: var(--space-6);
}
.prod-hero__body {
  font-family: var(--font-body);
  font-size: var(--text-base);
  line-height: 1.7;
  color: var(--color-text-muted);
  margin-bottom: var(--space-8);
}
.prod-hero__cta { display: flex; }
.prod-hero__visual {
  border-radius: var(--radius-2xl);
  overflow: hidden;
  box-shadow: 0 24px 60px rgba(72, 60, 81, 0.16), 0 4px 14px rgba(72, 60, 81, 0.08);
  border: 1px solid var(--color-border);
}
.prod-hero__visual img { display: block; width: 100%; height: auto; }

@media (max-width: 900px) {
  .prod-hero__inner { grid-template-columns: 1fr; gap: var(--space-10); }
  .prod-hero__copy { max-width: none; }
}

/* -- SECTION 2: WHAT IS LIVE NOW -- */
.live-now {
  background: var(--color-bg);
  padding-block: clamp(var(--space-16), 9vw, var(--space-32));
}
.module-row {
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: clamp(var(--space-10), 5vw, var(--space-20));
  align-items: center;
  padding-block: clamp(var(--space-12), 6vw, var(--space-20));
  border-top: 1px solid var(--color-divider);
}
.module-row:first-of-type { border-top: none; }
.module-row--reverse .module-row__copy { order: 2; }
.module-row--reverse .module-row__visual { order: 1; }
.module-row__copy { max-width: 480px; }
.module-row__title {
  font-family: var(--font-display);
  font-size: var(--text-xl);
  font-weight: 400;
  font-style: normal;
  line-height: 1.2;
  color: var(--color-text);
  margin: var(--space-2) 0 var(--space-5);
}
.module-row__body {
  font-family: var(--font-body);
  font-size: var(--text-base);
  line-height: 1.75;
  color: var(--color-text-muted);
}
.module-row__visual {
  border-radius: var(--radius-2xl);
  overflow: hidden;
  box-shadow: 0 18px 48px rgba(72, 60, 81, 0.13), 0 3px 10px rgba(72, 60, 81, 0.07);
  border: 1px solid var(--color-border);
}
.module-row__visual img { display: block; width: 100%; height: auto; }

@media (max-width: 860px) {
  .module-row { grid-template-columns: 1fr; gap: var(--space-8); }
  .module-row__copy { max-width: none; }
  .module-row--reverse .module-row__copy { order: 1; }
  .module-row--reverse .module-row__visual { order: 2; }
}

/* -- SECTION 3: HOW IT WORKS -- */
.how-it-works {
  background: var(--color-surface-2);
  padding-block: clamp(var(--space-16), 9vw, var(--space-32));
}
.how-steps {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(var(--space-8), 4vw, var(--space-16));
}
.how-step { display: flex; flex-direction: column; gap: var(--space-3); }
.how-step__num {
  font-family: var(--font-display);
  font-size: var(--text-xl);
  font-weight: 500;
  font-style: normal;
  color: var(--color-gold);
  line-height: 1;
}
.how-step__title {
  font-family: var(--font-display);
  font-size: var(--text-lg);
  font-weight: 400;
  font-style: normal;
  line-height: 1.25;
  color: var(--color-text);
}
.how-step__body {
  font-family: var(--font-body);
  font-size: var(--text-base);
  line-height: 1.7;
  color: var(--color-text-muted);
}
@media (max-width: 760px) {
  .how-steps { grid-template-columns: 1fr; gap: var(--space-10); }
}

/* -- SECTION 4: THE WHY -- */
.the-why {
  background: var(--color-bg);
  padding-block: clamp(120px, 12vw, 180px);
}
.the-why__inner {
  max-width: 820px;
  margin-inline: auto;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.the-why__eyebrow { justify-content: center; margin-bottom: var(--space-5); }
.the-why__title {
  font-family: var(--font-display);
  font-size: var(--text-2xl);
  font-weight: 400;
  font-style: normal;
  line-height: 1.2;
  color: var(--color-text);
  margin-bottom: var(--space-10);
}
.the-why__body {
  font-family: var(--font-body);
  font-size: var(--text-lg);
  font-weight: 300;
  font-style: normal;
  line-height: 1.85;
  color: var(--color-text-muted);
  margin-bottom: var(--space-6);
  max-width: 820px;
}
.the-why__close {
  font-family: var(--font-display);
  font-size: var(--text-xl);
  font-weight: 400;
  font-style: normal;
  line-height: 1.3;
  color: var(--color-gold);
  margin-top: var(--space-6);
}

/* -- SECTION 5: WHO IT'S FOR (3 + 2 grid) -- */
/* Override conflicting base .icp__grid (repeat(3,1fr) !important) and
   .icp-card (min-width:300px !important) rules with !important. */
.icp__grid.icp__grid--three-two {
  display: grid !important;
  grid-template-columns: repeat(6, 1fr) !important;
  gap: var(--space-6) !important;
  justify-content: center !important;
  align-items: stretch !important;
  width: 100% !important;
}
.icp__grid--three-two > .icp-card {
  grid-column: span 2 !important;
  min-width: 0 !important;
  width: auto !important;
  text-align: center;
  align-items: center;
  justify-content: flex-start;
}
.icp__grid--three-two > .icp-card:nth-child(4) { grid-column: 2 / span 2 !important; }
.icp__grid--three-two > .icp-card:nth-child(5) { grid-column: 4 / span 2 !important; }
.icp__grid--three-two > .icp-card .icp-card__icon { margin-inline: auto; }
.icp__grid--three-two > .icp-card p:not(.icp-card__eyebrow) {
  text-align: center;
  color: #4A4453;
  flex: 0 0 auto;
}
.icp__grid--three-two > .icp-card .icp-card__link { margin-top: auto; }

@media (max-width: 1000px) {
  .icp__grid.icp__grid--three-two { grid-template-columns: repeat(2, 1fr) !important; }
  .icp__grid--three-two > .icp-card,
  .icp__grid--three-two > .icp-card:nth-child(4),
  .icp__grid--three-two > .icp-card:nth-child(5) { grid-column: auto !important; }
}
@media (max-width: 560px) {
  .icp__grid.icp__grid--three-two { grid-template-columns: 1fr !important; }
  .icp__grid--three-two > .icp-card,
  .icp__grid--three-two > .icp-card:nth-child(4),
  .icp__grid--three-two > .icp-card:nth-child(5) { grid-column: auto !important; }
}

/* WHO IT'S FOR — two-on-top, three-on-bottom layout.
   Row 1: 2 cards span 3 cols each (naturally wider).
   Row 2: 3 cards span 2 cols each. Equal height within each row via stretch. */
.icp__grid.icp__grid--two-three {
  display: grid !important;
  grid-template-columns: repeat(6, 1fr) !important;
  gap: var(--space-6) !important;
  justify-content: center !important;
  align-items: stretch !important;
  width: 100% !important;
  max-width: 1100px;
  margin-inline: auto;
}
.icp__grid--two-three > .icp-card {
  min-width: 0 !important;
  width: auto !important;
  text-align: center !important;
  align-items: center !important;
  justify-content: flex-start !important;
  display: flex !important;
  flex-direction: column !important;
}
/* Row 1 — two wider cards */
.icp__grid--two-three > .icp-card:nth-child(1) { grid-column: 1 / span 3 !important; }
.icp__grid--two-three > .icp-card:nth-child(2) { grid-column: 4 / span 3 !important; }
/* Row 2 — three cards */
.icp__grid--two-three > .icp-card:nth-child(3) { grid-column: 1 / span 2 !important; }
.icp__grid--two-three > .icp-card:nth-child(4) { grid-column: 3 / span 2 !important; }
.icp__grid--two-three > .icp-card:nth-child(5) { grid-column: 5 / span 2 !important; }
.icp__grid--two-three > .icp-card .icp-card__icon { margin-inline: auto; }
.icp__grid--two-three > .icp-card h3 {
  font-family: var(--font-display) !important;
  color: #483C51 !important;
}
.icp__grid--two-three > .icp-card p:not(.icp-card__eyebrow) {
  text-align: center !important;
  color: #4A4453 !important;
  flex: 0 0 auto !important;
}
.icp__grid--two-three > .icp-card .icp-card__link {
  margin-top: auto !important;
  letter-spacing: 0.08em !important;
}
@media (max-width: 1000px) {
  .icp__grid.icp__grid--two-three { grid-template-columns: repeat(2, 1fr) !important; }
  .icp__grid--two-three > .icp-card,
  .icp__grid--two-three > .icp-card:nth-child(1),
  .icp__grid--two-three > .icp-card:nth-child(2),
  .icp__grid--two-three > .icp-card:nth-child(3),
  .icp__grid--two-three > .icp-card:nth-child(4),
  .icp__grid--two-three > .icp-card:nth-child(5) { grid-column: auto !important; }
}
@media (max-width: 560px) {
  .icp__grid.icp__grid--two-three { grid-template-columns: 1fr !important; }
  .icp__grid--two-three > .icp-card,
  .icp__grid--two-three > .icp-card:nth-child(1),
  .icp__grid--two-three > .icp-card:nth-child(2),
  .icp__grid--two-three > .icp-card:nth-child(3),
  .icp__grid--two-three > .icp-card:nth-child(4),
  .icp__grid--two-three > .icp-card:nth-child(5) { grid-column: auto !important; }
}

/* -- SECTION 6: CLOSING CTA -- */
.closing-cta {
  background: var(--color-surface);
  padding-block: clamp(var(--space-16), 9vw, var(--space-24));
}
.closing-cta__inner {
  max-width: 640px;
  margin-inline: auto;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.closing-cta__eyebrow { justify-content: center; margin-bottom: var(--space-5); }
.closing-cta__title {
  font-family: var(--font-display);
  font-size: var(--text-2xl);
  font-weight: 400;
  font-style: normal;
  line-height: 1.2;
  color: var(--color-text);
  margin-bottom: var(--space-5);
}
.closing-cta__body {
  font-family: var(--font-body);
  font-size: var(--text-base);
  line-height: 1.75;
  color: var(--color-text-muted);
  margin-bottom: var(--space-8);
}
.closing-cta__actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-5);
}
.closing-cta__link {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 600;
  color: var(--color-text);
  text-decoration: none;
  transition: color var(--transition-interactive);
}
.closing-cta__link:hover,
.closing-cta__link:focus-visible {
  color: var(--color-primary-hover);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* ============================================================
   THE FULL PLATFORM — timeline (between Who It's For and Closing CTA)
   Desktop: horizontal line, points alternate above/below.
   Mobile: vertical line on left, content to the right.
   ============================================================ */
.full-platform {
  background: var(--color-bg, #FBFAF8);
  padding-block: var(--space-32);
}
.full-platform .section-header {
  margin-bottom: var(--space-24);
}
/* Gold COMING SOON pill above headline — matches ACTIVE pill format, gold palette */
.full-platform__pill {
  display: inline-block;
  background: #FBEDD5;
  color: #967634;
  font-family: 'Inter', sans-serif;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 3px 9px;
  border-radius: 20px;
  line-height: 1;
  white-space: nowrap;
  margin-bottom: var(--space-4);
}

/* ---- Shared item parts ---- */
.timeline {
  list-style: none;
  margin: 0;
  padding: 0;
}
/* Icon chip: rounded-square, pastel bg + matching darker stroke (set inline per point) */
.timeline__icon {
  width: 48px;
  height: 48px;
  border-radius: var(--radius-lg);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}
.timeline__icon svg { display: block; }
.timeline__name {
  font-family: var(--font-display);
  font-weight: 400;
  font-style: normal;
  color: var(--color-primary);
  font-size: 1.0625rem;
  line-height: 1.3;
  margin: 0;
}
.timeline__desc {
  font-family: var(--font-body);
  font-style: normal;
  color: var(--color-gray);
  font-size: 0.875rem;
  line-height: 1.5;
  margin: 0;
}
.timeline__node {
  display: block;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: var(--color-primary);
  flex: 0 0 auto;
}

/* ============================================================
   DESKTOP — horizontal timeline (>= 861px)
   ============================================================ */
@media (min-width: 861px) {
  .timeline {
    position: relative;
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    align-items: center;
    column-gap: var(--space-4);
    min-height: 360px;
  }
  /* The continuous horizontal line */
  .timeline::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    height: 2px;
    background: var(--color-primary);
    transform: translateY(-50%);
    z-index: 0;
  }
  .timeline__item {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 50%;
    align-self: start;
  }
  /* Node sits on the center line */
  .timeline__node {
    position: absolute;
    left: 50%;
    top: 100%;
    transform: translate(-50%, -50%);
  }
  /* Content block stacked: icon (closest to line) -> name -> desc */
  .timeline__content {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: var(--space-2);
    max-width: 190px;
    padding-inline: var(--space-2);
  }
  .timeline__desc { max-width: 180px; }

  /* ODD items (1,3,5,7): ABOVE the line.
     Content order reversed so icon sits closest to (just above) the line. */
  .timeline__item:nth-child(odd) {
    align-self: start;
    justify-content: flex-end;
    padding-bottom: var(--space-8);
  }
  .timeline__item:nth-child(odd) .timeline__content {
    flex-direction: column-reverse;
  }

  /* EVEN items (2,4,6): BELOW the line. Icon closest (just below) the line. */
  .timeline__item:nth-child(even) {
    align-self: end;
    justify-content: flex-start;
    padding-top: var(--space-8);
  }
  .timeline__item:nth-child(even) .timeline__node {
    top: 0;
  }
}

/* ============================================================
   MOBILE — vertical timeline (<= 860px)
   ============================================================ */
@media (max-width: 860px) {
  .timeline {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: var(--space-10);
    padding-left: var(--space-8);
    max-width: 460px;
    margin-inline: auto;
  }
  /* Continuous vertical line on the left */
  .timeline::before {
    content: "";
    position: absolute;
    top: 6px;
    bottom: 6px;
    left: 5px;
    width: 2px;
    background: var(--color-primary);
    z-index: 0;
  }
  .timeline__item {
    position: relative;
    z-index: 1;
  }
  .timeline__node {
    position: absolute;
    left: calc(-1 * var(--space-8) + 5px);
    top: 6px;
    transform: translateX(-50%);
  }
  .timeline__content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
    gap: var(--space-2);
  }
  .timeline__desc { max-width: 340px; }
}

/* ═══════════════════════════════════════════════════════ LEGAL PAGES (privacy / terms / cookies) */
.legal-page {
  background: #FFFFFF;
  padding-top: clamp(var(--space-16), 8vw, var(--space-32));
  padding-bottom: clamp(var(--space-20), 9vw, var(--space-32));
}
.legal-page__inner {
  max-width: 760px;
  margin: 0 auto;
}
.legal-page__eyebrow {
  font-family: var(--font-body);
  font-size: 0.75rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--color-gold);
  font-weight: 600;
  margin-bottom: var(--space-4);
}
.legal-page__title {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: clamp(2.25rem, 5vw, 3.25rem);
  line-height: 1.1;
  color: var(--color-text);
  margin: 0 0 var(--space-5);
}
.legal-page__meta {
  font-family: var(--font-body);
  font-size: 0.9375rem;
  color: var(--color-text-muted);
  margin: 0 0 var(--space-6);
}
.legal-page__intro {
  font-family: var(--font-body);
  font-size: 1.0625rem;
  line-height: 1.7;
  color: var(--color-text);
  margin: 0 0 var(--space-10);
}
.legal-page__intro:last-child { margin-bottom: 0; }

/* Section blocks */
.legal-section {
  margin-top: clamp(var(--space-10), 5vw, var(--space-16));
}
.legal-section:first-of-type { margin-top: 0; }
.legal-section__num {
  font-family: var(--font-body);
  font-size: 0.8125rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--color-gold);
  font-weight: 600;
  display: block;
  margin-bottom: var(--space-2);
}
.legal-section__title {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: clamp(1.5rem, 3vw, 1.875rem);
  line-height: 1.2;
  color: var(--color-text);
  margin: 0 0 var(--space-5);
}
.legal-subhead {
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 1.0625rem;
  color: var(--color-text);
  margin: var(--space-8) 0 var(--space-3);
}
.legal-page p,
.legal-page li {
  font-family: var(--font-body);
  font-size: 1rem;
  line-height: 1.7;
  color: var(--color-text);
}
.legal-page p { margin: 0 0 var(--space-4); max-width: 70ch; }
.legal-page ul {
  margin: 0 0 var(--space-4);
  padding-left: 1.25rem;
  max-width: 70ch;
}
.legal-page li { margin-bottom: var(--space-2); padding-left: 0.25rem; }
.legal-page li::marker { color: var(--color-gold); }
.legal-page a:not(.btn):not(.nav__logo):not([class*="footer"]):not([class*="nav"]) {
  color: var(--color-text);
  text-decoration: underline;
  text-underline-offset: 2px;
  text-decoration-color: var(--color-gold-border);
  transition: text-decoration-color 0.2s ease;
}
.legal-page a:not(.btn):not(.nav__logo):not([class*="footer"]):not([class*="nav"]):hover {
  text-decoration-color: var(--color-gold);
}
.legal-page strong { font-weight: 600; color: var(--color-text); }

/* Definition-style rows for data tables in prose */
.legal-deflist {
  margin: 0 0 var(--space-4);
  max-width: 70ch;
}
.legal-deflist dt {
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 1rem;
  color: var(--color-text);
  margin-top: var(--space-4);
}
.legal-deflist dd {
  font-family: var(--font-body);
  font-size: 1rem;
  line-height: 1.7;
  color: var(--color-text);
  margin: var(--space-1) 0 0;
}

/* Contact block at the end of each policy */
.legal-contact {
  margin-top: clamp(var(--space-12), 6vw, var(--space-16));
  padding: var(--space-8);
  background: #FFFFFF;
  border-radius: 16px;
  box-shadow: 0 4px 24px rgba(72, 60, 81, 0.10);
}
.legal-contact__title {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 1.375rem;
  color: var(--color-text);
  margin: 0 0 var(--space-3);
}
.legal-contact p { margin-bottom: var(--space-2); }
.legal-contact p:last-child { margin-bottom: 0; }

@media (max-width: 600px) {
  .legal-contact { padding: var(--space-6); }
}

/* ═══════════════════════════════════════════════════════ PRESS PAGE */
.press-page {
  background: #FFFFFF;
}

/* Hero */
.press-hero {
  background: #FFFFFF;
  padding-top: clamp(var(--space-20), 10vw, var(--space-32));
  padding-bottom: clamp(var(--space-10), 5vw, var(--space-16));
}
.press-hero__inner {
  max-width: 680px;
  margin: 0 auto;
  text-align: center;
}
.press-eyebrow {
  font-family: var(--font-body);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--color-text);
  margin: 0 0 var(--space-5);
}
.press-title {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: clamp(2.5rem, 6vw, 3.75rem);
  line-height: 1.08;
  color: var(--color-text);
  margin: 0 0 var(--space-6);
}
.press-subtext {
  font-family: var(--font-body);
  font-size: 1.0625rem;
  line-height: 1.7;
  color: var(--color-text-muted);
  max-width: 560px;
  margin: 0 auto var(--space-8);
  text-align: center;
}
.press-hero__cta {
  display: flex;
  justify-content: center;
}

/* Coverage section */
.press-coverage {
  background: #FFFFFF;
  padding-top: clamp(var(--space-8), 4vw, var(--space-12));
  padding-bottom: clamp(var(--space-20), 10vw, var(--space-32));
}

/* Current-state placeholder */
.press-coverage__placeholder {
  max-width: 760px;
  margin: 0 auto;
  background: #F5F3F0;
  border-radius: var(--radius-xl);
  padding: clamp(var(--space-16), 9vw, var(--space-20)) var(--space-8);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.press-coverage__placeholder-label {
  font-family: var(--font-body);
  font-size: 1rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  color: var(--color-text-muted);
  margin: 0;
}

/* Future-state grid */
.press-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(var(--space-5), 3vw, var(--space-8));
  max-width: 960px;
  margin: 0 auto;
}
.press-card {
  background: #FFFFFF;
  border-radius: var(--radius-xl);
  box-shadow: 0 4px 24px rgba(72, 60, 81, 0.10);
  padding: var(--space-8);
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.press-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 32px rgba(72, 60, 81, 0.14);
}
.press-card__logo {
  height: 48px;
  display: flex;
  align-items: center;
}
.press-card__logo-text {
  font-family: var(--font-body);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  color: var(--color-text-muted);
  opacity: 0.55;
  border: 1px dashed var(--color-border);
  border-radius: 6px;
  padding: 0.5rem 0.875rem;
}
.press-card__headline {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 1.375rem;
  line-height: 1.25;
  color: var(--color-text);
  margin: 0;
}
.press-card__meta {
  font-family: var(--font-body);
  font-size: 0.9375rem;
  color: var(--color-text-muted);
  margin: 0;
  display: flex;
  align-items: center;
  gap: var(--space-2);
  flex-wrap: wrap;
}
.press-card__publication { font-weight: 600; color: var(--color-text); }
.press-card__dot { color: var(--color-gold); }
.press-card__link {
  font-family: var(--font-body);
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--color-text);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  margin-top: auto;
  transition: color 0.2s ease, gap 0.2s ease;
}
.press-card__link svg { color: var(--color-gold); transition: transform 0.2s ease; }
.press-card__link:hover { color: var(--color-gold); gap: var(--space-3); }
.press-card__link:hover svg { transform: translate(2px, -2px); }

@media (max-width: 760px) {
  .press-grid { grid-template-columns: 1fr; }
  .press-card { padding: var(--space-6); }
}

/* ═══════════════════════════════════════════════════════ PARTNERS PAGE */
.partners-page { background: #FFFFFF; }

/* Shared eyebrow / headings */
.partners-eyebrow {
  font-family: var(--font-body);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--color-text);
  margin: 0 0 var(--space-5);
}
.partners-h2 {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: clamp(1.875rem, 4vw, 2.5rem);
  line-height: 1.15;
  color: var(--color-text);
  margin: 0;
}

/* Hero */
.partners-hero {
  background: #FFFFFF;
  padding-top: clamp(var(--space-20), 10vw, var(--space-32));
  padding-bottom: clamp(var(--space-10), 5vw, var(--space-16));
}
.partners-hero__inner { max-width: 720px; }
.partners-title {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: clamp(2.5rem, 6vw, 3.75rem);
  line-height: 1.08;
  color: var(--color-text);
  margin: 0 0 var(--space-4);
}
.partners-subhead {
  font-family: var(--font-display);
  font-weight: 500;
  font-style: normal;
  font-size: clamp(1.375rem, 3vw, 1.75rem);
  line-height: 1.3;
  color: var(--color-text);
  margin: 0 0 var(--space-6);
}
.partners-body {
  font-family: var(--font-body);
  font-size: 1.0625rem;
  line-height: 1.7;
  color: var(--color-text-muted);
  max-width: 660px;
  margin: 0;
}

/* Benefit blocks */
.partners-benefits {
  background: #FFFFFF;
  padding-block: clamp(var(--space-8), 5vw, var(--space-16));
}
.partners-benefits__row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(var(--space-6), 3vw, var(--space-10));
}
.partners-benefit { display: flex; flex-direction: column; }
.partners-benefit__chip {
  width: 56px;
  height: 56px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: var(--space-5);
}
.partners-benefit__chip svg { width: 26px; height: 26px; }
.partners-benefit__chip--green  { background: #EDF6E9; color: #4A7C59; }
.partners-benefit__chip--blue   { background: #E7F1F7; color: #4E7E9E; }
.partners-benefit__chip--purple { background: #EDEAF2; color: #6A5490; }
.partners-benefit__title {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 1.375rem;
  line-height: 1.25;
  color: var(--color-text);
  margin: 0 0 var(--space-3);
}
.partners-benefit__body {
  font-family: var(--font-body);
  font-size: 1rem;
  line-height: 1.65;
  color: var(--color-text-muted);
  margin: 0;
}

/* What partners access */
.partners-access {
  background: #FFFFFF;
  padding-block: clamp(var(--space-12), 6vw, var(--space-20));
}
.partners-section-header { margin-bottom: clamp(var(--space-8), 4vw, var(--space-12)); max-width: 720px; }
.partners-access__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(var(--space-5), 3vw, var(--space-8));
  max-width: 920px;
}
.partners-access__item {
  display: flex;
  gap: var(--space-5);
  align-items: flex-start;
  background: #FFFFFF;
  border-radius: var(--radius-xl);
  box-shadow: 0 4px 24px rgba(72, 60, 81, 0.10);
  padding: var(--space-6) var(--space-6);
}
.partners-access__chip {
  flex: none;
  width: 48px;
  height: 48px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.partners-access__chip svg { width: 23px; height: 23px; }
.partners-access__chip--green  { background: #EDF6E9; color: #4A7C59; }
.partners-access__chip--blue   { background: #E7F1F7; color: #4E7E9E; }
.partners-access__chip--purple { background: #EDEAF2; color: #6A5490; }
.partners-access__chip--gold   { background: #F7F0DD; color: #A98828; }
.partners-access__title {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 1.1875rem;
  color: var(--color-text);
  margin: 0 0 var(--space-2);
}
.partners-access__body {
  font-family: var(--font-body);
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--color-text-muted);
  margin: 0;
}

/* Application form */
.partners-apply {
  background: #FFFFFF;
  padding-top: clamp(var(--space-8), 4vw, var(--space-12));
  padding-bottom: clamp(var(--space-20), 10vw, var(--space-32));
}
.partners-apply__inner { max-width: 620px; }
.partners-apply__intro { margin-bottom: var(--space-8); }
.partners-apply__lead {
  font-family: var(--font-body);
  font-size: 1.0625rem;
  line-height: 1.7;
  color: var(--color-text-muted);
  margin: var(--space-4) 0 0;
}
.partners-form { display: flex; flex-direction: column; gap: var(--space-5); }
/* Ensure hidden attribute wins over flex display for the partners form/confirm */
.partners-form[hidden],
#partners-confirm[hidden] { display: none; }
.partners-field { display: flex; flex-direction: column; gap: var(--space-2); }
.partners-field__label {
  font-family: var(--font-body);
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--color-text);
}
.partners-field__input {
  font-family: var(--font-body);
  font-size: 1rem;
  color: var(--color-text);
  background: #FFFFFF;
  border: 1.5px solid var(--color-border);
  border-radius: 10px;
  padding: 0.75rem 0.9375rem;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
  width: 100%;
}
.partners-field__input::placeholder { color: var(--color-text-muted); }
.partners-field__input:focus {
  outline: none;
  border-color: var(--color-text);
  box-shadow: 0 0 0 3px rgba(72, 60, 81, 0.10);
}
.partners-field__select {
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%237B6E8A' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.9375rem center;
  padding-right: 2.5rem;
  cursor: pointer;
}
.partners-form__submit {
  font-family: var(--font-body);
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: #FFFFFF;
  background: #483C51;
  border: 1.5px solid #483C51;
  border-radius: var(--radius-full);
  padding: 0.875rem var(--space-8);
  margin-top: var(--space-3);
  cursor: pointer;
  align-self: flex-start;
  transition: background 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
  box-shadow: 0 2px 12px rgba(72, 60, 81, 0.18);
}
.partners-form__submit:hover {
  background: #3a3042;
  border-color: #3a3042;
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(72, 60, 81, 0.24);
}
.partners-form__submit:active { transform: translateY(0); }

/* Confirmation */
.partners-apply__confirm { margin-top: 0; }

/* Responsive */
@media (max-width: 860px) {
  .partners-benefits__row { grid-template-columns: 1fr; gap: var(--space-8); }
  .partners-access__grid { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .partners-form__submit { width: 100%; align-self: stretch; text-align: center; }
}

/* ════════════════════════════════════════════════════════════════
   GLOBAL EYEBROW FIX (sitewide) — alignment, flex centering,
   gold #C9A84C bullet, 6px bullet size. Appended last so it wins.
   Targets every eyebrow class in use across the site.
   ════════════════════════════════════════════════════════════════ */

/* 1 + 2 — Flex container with vertically-centered bullet, for ALL eyebrows.
   align-items:center centers the bullet to the text height.
   Horizontal alignment is matched to the headline via justify-content
   rules below (flex-start = left by default). */
.eyebrow,
.p1-card__eyebrow,
.partners-eyebrow,
.press-eyebrow,
.legal-page__eyebrow,
.home-integrations__eyebrow {
  display: flex !important;
  align-items: center !important;
  gap: 0.5em !important;
}

/* demo-gate eyebrow is a pill badge (inline-flex) — keep its layout,
   only ensure the bullet stays vertically centered. */
.demo-gate__eyebrow {
  align-items: center !important;
}

/* 3 + 4 — Gold #C9A84C bullet, 6px, vertically centered, on ALL eyebrows.
   Standalone block eyebrows (no prior ::before) gain one; existing ones
   are normalized to 6px gold. */
.eyebrow::before,
.p1-card__eyebrow::before,
.partners-eyebrow::before,
.press-eyebrow::before,
.legal-page__eyebrow::before,
.home-integrations__eyebrow::before,
.demo-gate__eyebrow::before,
.icp .eyebrow::before {
  content: '' !important;
  display: inline-block !important;
  width: 6px !important;
  height: 6px !important;
  min-width: 6px !important;
  border-radius: 50% !important;
  background: #C9A84C !important;
  color: #C9A84C !important;
  flex-shrink: 0 !important;
  margin: 0 !important;
  align-self: center !important;
}

/* Alignment — match each eyebrow to the alignment of its headline.
   Left-aligned headline contexts -> eyebrow left (flex-start). */
.p1-card__eyebrow,
.partners-eyebrow,
.press-eyebrow,
.legal-page__eyebrow,
.for-module__eyebrow {
  justify-content: flex-start !important;
  text-align: left !important;
}

/* Centered headline contexts -> eyebrow centered. */
.section-header .eyebrow,
.what__eyebrow,
.why-section__eyebrow,
.what-changes-section__eyebrow,
.where-now-section__eyebrow,
.the-why__eyebrow,
.closing-cta__eyebrow,
.home-integrations__eyebrow,
.for-hero__eyebrow,
.founding-apply__eyebrow {
  justify-content: center !important;
}

/* ICP "Who It's For" eyebrow was forced to display:block for centering.
   Re-flex it so the bullet centers vertically, keep it horizontally centered,
   and restore the gold bullet (the old block fix re-injected ::before inline). */
.icp .section-header .eyebrow,
.icp .eyebrow,
section.icp p.eyebrow {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: auto !important;
}
.icp .eyebrow::before,
.icp .section-header .eyebrow::before,
section.icp p.eyebrow::before {
  display: inline-block !important;
  width: 6px !important;
  height: 6px !important;
  min-width: 6px !important;
  border-radius: 50% !important;
  background: #C9A84C !important;
  margin: 0 !important;
  vertical-align: middle !important;
  align-self: center !important;
}

/* Dark-theme bullet must also be gold #C9A84C (was pastel-gold). */
[data-theme='dark'] .eyebrow::before {
  background: #C9A84C !important;
}

/* ═══════════════════════════════════════════════════════ ICP SUBPAGE — HERO + CAROUSEL (v=20260626t)
   Hero is full-width aubergine #483C51 with adapted text (gold eyebrow, white
   heading, soft-gray intro). Four module sections become a single auto-advancing
   carousel. Scoped to ICP subpages only — .for-hero / .for-carousel are unused elsewhere. */

/* ICP nav-over-aubergine fix — scoped to .for-page so homepage/product are untouched.
   At top (nav not scrolled) the transparent nav sits over the dark aubergine hero,
   so logo, links, dropdown toggle, demo button and burger must read LIGHT.
   Once scrolled, the nav gets a light frosted bg and reverts to the dark default. */
.for-page .nav__logo { position: relative; display: inline-flex; }
.for-page .nav__logo-img--top { display: none; }
/* At top: show the dark-bg (white wordmark) logo, hide the light one */
.for-page .nav:not(.nav--scrolled) .nav__logo-img--scrolled { display: none; }
.for-page .nav:not(.nav--scrolled) .nav__logo-img--top { display: inline-block; }
/* Scrolled: show the standard light logo (default), hide the dark one */
.for-page .nav--scrolled .nav__logo-img--top { display: none; }
.for-page .nav--scrolled .nav__logo-img--scrolled { display: inline-block; }

/* At top: light text over the aubergine hero */
.for-page .nav:not(.nav--scrolled) .nav__links a { color: #F0EDF3; }
.for-page .nav:not(.nav--scrolled) .nav__links a:hover { color: #FFFFFF; }
.for-page .nav:not(.nav--scrolled) .nav__dropdown-toggle { color: #F0EDF3; }
.for-page .nav:not(.nav--scrolled) .nav__dropdown-toggle:hover { color: #FFFFFF; }
.for-page .nav:not(.nav--scrolled) .btn--watch-demo-sm { color: #F0EDF3; border-color: rgba(240,237,243,0.45); }
.for-page .nav:not(.nav--scrolled) .btn--watch-demo-sm:hover { color: #FFFFFF; border-color: #FFFFFF; }
/* Burger bars: light at top so they're visible on the aubergine hero */
.for-page .nav:not(.nav--scrolled) .nav__burger span { background: #F0EDF3; }
/* Start Free: cream pill with aubergine text at top so it pops on the dark hero */
.for-page .nav:not(.nav--scrolled) .btn--primary-sm {
  background: #F4F1F7;
  color: #483C51;
  border-color: #F4F1F7;
}
.for-page .nav:not(.nav--scrolled) .btn--primary-sm:hover {
  background: #FFFFFF;
  color: #483C51;
  border-color: #FFFFFF;
}

/* Hero — full-width aubergine background; text adapted for dark surface */
.for-hero {
  background: #483C51;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding-bottom: 140px;
}
.for-hero__eyebrow {
  color: #C9A84C !important;
}
.for-hero__eyebrow::before {
  background: #C9A84C !important;
}
.for-hero__heading {
  color: #FFFFFF !important;
}
.for-hero__intro {
  color: #F0EDF3 !important;
}

/* Carousel container — generous top padding so it reads as a distinct section */
.for-carousel-section {
  background: #FFFFFF;
  padding-top: 120px;
  padding-bottom: clamp(var(--space-14), 7vw, var(--space-24));
}
.for-carousel {
  position: relative;
  width: 100%;
  overflow: hidden;
}
.for-carousel__viewport {
  overflow: hidden;
  width: 100%;
}
.for-carousel__track {
  display: flex;
  width: 100%;
  transition: transform 0.7s cubic-bezier(0.45, 0.05, 0.25, 1);
  will-change: transform;
}
.for-carousel__slide {
  flex: 0 0 100%;
  min-width: 100%;
  box-sizing: border-box;
}
/* Slide body reuses the two-column module layout, app mockup left + text right */
.for-carousel__slide .for-module__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: clamp(var(--space-10), 6vw, var(--space-20));
}
.for-carousel__slide .for-module__visual { order: 1; }
.for-carousel__slide .for-module__text { order: 2; }

/* Navigation dots */
.for-carousel__dots {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 14px;
  margin-top: clamp(var(--space-8), 4vw, var(--space-10));
}
.for-carousel__dot {
  width: 11px;
  height: 11px;
  border-radius: 50%;
  border: none;
  padding: 0;
  background: #D7D2DC;
  cursor: pointer;
  transition: background 0.25s ease, transform 0.25s ease;
}
.for-carousel__dot:hover { transform: scale(1.15); }
.for-carousel__dot[aria-selected="true"] {
  background: #483C51;
}
.for-carousel__dot:focus-visible {
  outline: 2px solid #483C51;
  outline-offset: 3px;
}

/* Large standalone "Begin with clarity" CTA below the carousel */
.for-cta__btn--large {
  padding: 16px 48px !important;
  background: #483C51 !important;
  color: #FFFFFF !important;
  border: none !important;
  font-size: var(--text-base);
  margin-top: 80px !important;
}
.for-cta__btn--large:hover {
  background: #3A2F44 !important;
  color: #FFFFFF !important;
}

@media (max-width: 860px) {
  .for-carousel__slide .for-module__inner {
    grid-template-columns: 1fr;
    gap: var(--space-8);
  }
  .for-carousel__slide .for-module__visual { order: -1; }
  .for-carousel__slide .for-module__text { order: 2; }
}

/* ═══════════════════════════════════════════════════════════════════════
   ABOUT PAGE — SCOPED UPDATES (v=20260702-about)
   Scoped to About sections only: .founder-story, .founder-bio, .team, .advisory
   ═══════════════════════════════════════════════════════════════════════ */

/* --- Eyebrow bullet fix: override the display:block bug for About eyebrows.
   Force flex + vertical centering so the 6px gold ::before bullet aligns. --- */
.founder-story .section-header .eyebrow,
.founder-bio .section-header .eyebrow,
.team .section-header .eyebrow,
.advisory .section-header .eyebrow {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  width: auto !important;
}
.founder-story .section-header .eyebrow::before,
.founder-bio .section-header .eyebrow::before,
.team .section-header .eyebrow::before,
.advisory .section-header .eyebrow::before {
  content: '' !important;
  display: inline-block !important;
  width: 6px !important;
  height: 6px !important;
  min-width: 6px !important;
  border-radius: 50% !important;
  background: #C9A84C !important;
  flex-shrink: 0 !important;
  margin: 0 !important;
  align-self: center !important;
}

/* --- Our Story: split headline colors --- */
.our-story__line1 { color: #483C51; }
.our-story__line2 { color: #C9A84C; }

/* --- Our Story: single centered column, body max-width 780px, centered --- */
.founder-story .founder-story__inner {
  display: block;
  grid-template-columns: none;
}
.founder-story .founder-story__text {
  max-width: 780px;
  margin: 0 auto;
  text-align: center;
}
.founder-story .founder-story__text p {
  max-width: 780px;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

/* --- Founder photo: fill the 180px avatar box, cover, rounded --- */
.founder-bio__photo {
  width: 180px;
  height: 180px;
  object-fit: cover;
  border-radius: var(--radius-xl);
  border: 1.5px solid var(--color-gold-border);
  box-shadow: var(--shadow-md), var(--shadow-glow);
  display: block;
}
@media (max-width: 640px) {
  .founder-bio__photo { width: 80px; height: 80px; }
}

/* --- Founder links: plain bold text links (match .icp-card__link), left-aligned --- */
.founder-bio__links {
  justify-content: flex-start;
  align-items: center;
  gap: var(--space-6);
}
.founder-bio__textlink {
  display: inline-flex;
  align-items: center;
  gap: 0.4em;
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 700;
  color: #483C51;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  background: none;
  border: none;
  padding: 0;
  transition: color var(--transition-fast), text-decoration-color var(--transition-fast);
}
.founder-bio__textlink:hover,
.founder-bio__textlink:focus-visible {
  color: #2F2738;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.founder-bio__textlink:focus-visible {
  outline: 2px solid #483C51;
  outline-offset: 3px;
  border-radius: 4px;
}
.founder-bio__li-icon { width: 18px; height: 18px; flex-shrink: 0; }
.founder-bio__arrow { font-weight: 700; }
[data-theme='dark'] .founder-bio__textlink { color: var(--pastel-lavender); }

/* --- Team photos: fill the 72px round avatar, cover --- */
.team-card__photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
  display: block;
}
.team-card__avatar:has(.team-card__photo) {
  padding: 0;
  overflow: hidden;
}

/* --- Team LinkedIn link: icon + LINKEDIN word, no arrow, left-aligned --- */
.team-card__linkedin {
  display: inline-flex;
  align-items: center;
  gap: 0.4em;
  justify-content: flex-start;
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 700;
  color: #483C51;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  text-decoration: none;
  margin-top: var(--space-3);
  transition: color var(--transition-fast), text-decoration-color var(--transition-fast);
}
.team-card__linkedin svg { width: 16px; height: 16px; flex-shrink: 0; }
.team-card__linkedin:hover,
.team-card__linkedin:focus-visible {
  color: #2F2738;
  text-decoration: underline;
  text-underline-offset: 3px;
}
[data-theme='dark'] .team-card__linkedin { color: var(--pastel-lavender); }

/* ═══════════════════════════════════════════════════════════════════════
   ABOUT PAGE — EYEBROW CENTER ALIGNMENT (reinforced, v=20260702-about2)
   Every eyebrow shares the exact horizontal center of its headline.
   Applied to each eyebrow element AND its container.
   ═══════════════════════════════════════════════════════════════════════ */
.founder-story .section-header,
.founder-bio .section-header,
.team .section-header,
.advisory .section-header,
.where-now-section .where-now-section__inner {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.founder-story .section-header .eyebrow,
.founder-bio .section-header .eyebrow,
.team .section-header .eyebrow,
.advisory .section-header .eyebrow,
.where-now-section .where-now-section__eyebrow {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  width: fit-content !important;
  max-width: 100% !important;
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
/* Ensure the gold bullet is present + centered on the where-now eyebrow too */
.where-now-section .where-now-section__eyebrow::before {
  content: '' !important;
  display: inline-block !important;
  width: 6px !important;
  height: 6px !important;
  min-width: 6px !important;
  border-radius: 50% !important;
  background: #C9A84C !important;
  flex-shrink: 0 !important;
  margin: 0 !important;
  align-self: center !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   EYEBROW GLOBAL NORMALIZATION (v=20260702-eyebrow) — authoritative, last-wins
   Fix 1: every eyebrow is a flex row, bullet vertically centered to text,
          gold #C9A84C, ~6px, consistent 7px gap to first letter.
   Fix 2: horizontal alignment inherited from the headline context via the
          per-context justify-content rules that already exist; this block
          only normalizes bullet size/appearance + vertical centering and does
          NOT force a horizontal side, so centered eyebrows stay centered and
          left eyebrows stay left.
   ═══════════════════════════════════════════════════════════════════════ */
.eyebrow,
.p1-card__eyebrow,
.partners-eyebrow,
.press-eyebrow,
.legal-page__eyebrow,
.home-integrations__eyebrow,
.for-hero__eyebrow,
.for-module__eyebrow,
.why-section__eyebrow,
.what__eyebrow,
.what-changes-section__eyebrow,
.where-now-section__eyebrow,
.the-why__eyebrow,
.closing-cta__eyebrow,
.founding-apply__eyebrow,
.icp .eyebrow,
section.icp p.eyebrow {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
}
.demo-gate__eyebrow {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
}

.eyebrow::before,
.p1-card__eyebrow::before,
.partners-eyebrow::before,
.press-eyebrow::before,
.legal-page__eyebrow::before,
.home-integrations__eyebrow::before,
.for-hero__eyebrow::before,
.for-module__eyebrow::before,
.why-section__eyebrow::before,
.what__eyebrow::before,
.what-changes-section__eyebrow::before,
.where-now-section__eyebrow::before,
.the-why__eyebrow::before,
.closing-cta__eyebrow::before,
.founding-apply__eyebrow::before,
.demo-gate__eyebrow::before,
.icp .eyebrow::before,
section.icp p.eyebrow::before {
  content: '' !important;
  display: inline-block !important;
  width: 6px !important;
  height: 6px !important;
  min-width: 6px !important;
  max-width: 6px !important;
  min-height: 6px !important;
  max-height: 6px !important;
  border-radius: 50% !important;
  background: #C9A84C !important;
  color: #C9A84C !important;
  flex-shrink: 0 !important;
  flex-grow: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  align-self: center !important;
  vertical-align: middle !important;
  line-height: 0 !important;
  font-size: 0 !important;
}
[data-theme='dark'] .eyebrow::before,
[data-theme='dark'] .for-hero__eyebrow::before,
[data-theme='dark'] .for-module__eyebrow::before {
  background: #C9A84C !important;
}

/* Eyebrow horizontal-alignment corrections (Fix 2), authoritative last-wins */
.press-eyebrow {                 /* press hero headline is centered */
  justify-content: center !important;
  text-align: center !important;
}
.section-header .eyebrow::before {   /* guarantee bullet on all section-header eyebrows */
  content: '' !important;
  display: inline-block !important;
  width: 6px !important;
  height: 6px !important;
  min-width: 6px !important;
  max-width: 6px !important;
  min-height: 6px !important;
  max-height: 6px !important;
  border-radius: 50% !important;
  background: #C9A84C !important;
  flex-shrink: 0 !important;
  flex-grow: 0 !important;
  margin: 0 !important;
  align-self: center !important;
}