/* ==========================================================================
   ORCA V2 MERGED - Compact Dark Professional Design
   ========================================================================== */

:root {
  /* ORCA Navy Brand Colors */
  --navy: #0A1628;
  --navy-deep: #0a192f;
  --navy-mid: #0d1f3c;
  --navy-light: #162544;
  --gold: #d4af55;

  /* Accent — gold sitewide. Buttons, CTAs, focus glows, hover underlines all
     resolve to var(--gold). Use var(--accent-blue) for legitimate-blue
     surfaces (Stripe icon, etc.) — those are not "accent" they are vendor
     brand colors. (R3-B Frontend R2-C-1 fix 2026-05-09.)

     WCAG contrast (verified 2026-05-09 R4 closure of Code R3-I-1):
       gold #d4af55 on navy #0a1628        : 8.69:1  (AAA ≥7:1 ✓)
       gold on navy-deep #0a192f           : 8.43:1  (AAA ✓)
       navy-deep text on gold background   : 8.43:1  (AAA ✓)
       white text on navy                  : 18.13:1 (AAA ✓)
       white text on gold                  : 2.09:1  (FAIL — DO NOT USE)
     Rule: when var(--gold) is the BACKGROUND, text MUST be var(--navy)/
     var(--navy-deep), never white. Current consumers (.skip-link +
     .submitted-home) follow this rule. */
  --accent: var(--gold);
  --accent-dark: #b8973f;
  --accent-light: #e8c578;
  --accent-blue: #2563EB;
  --accent-blue-dark: #1D4ED8;

  /* Status */
  --success: #059669;
  --warning: #D97706;
  --danger: #DC2626;

  /* Teal accent */
  --teal: #4a9a9a;

  /* Neutrals */
  --cream: #FAF9F7;
  --white: #ffffff;
  --gray-50: #F8FAFC;
  --gray-100: #F1F5F9;
  --gray-200: #E2E8F0;
  --gray-300: #CBD5E1;
  --gray-400: #94A3B8;
  --gray-500: #64748B;
  --gray-600: #475569;
  --gray-700: #334155;
  --gray-800: #1E293B;
  --gray-900: #0F172A;

  /* Typography */
  --font-primary: 'Heebo', sans-serif;

  /* Compact Spacing */
  --space-xs: 0.25rem;
  --space-sm: 0.5rem;
  --space-md: 0.75rem;
  --space-lg: 1rem;
  --space-xl: 1.5rem;
  --space-2xl: 2rem;
  --space-3xl: 2.5rem;

  /* Layout */
  --container-max: 1100px;
  --prose-max: 680px;  /* Comfortable prose width for editorial sections, body copy, disclaimers. Sweep 14 sites 2026-05-09 R3-M-1 close. */
  --border-radius: 6px;
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.1);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.15);
  --transition: all 0.2s ease;

  /* ==========================================================================
     Editorial palette — reserved for future draft-review surfaces.
     Warm-paper / deep-ink aesthetic, oxblood/ochre/forest severity vocabulary.
     Frank Ruhl Libre 500/700 loaded sitewide via main.hbs (about-name +
     convergence-quote currently consume; pruned from 5→2 weights 2026-05-09
     R3-E for ~150KB payload reduction). Noto Serif Hebrew dropped (0 live
     consumers; FRL covers Hebrew + Latin via Hebrew-friendly serif glyphs).
     IBM Plex Mono editorial-mono is still inert — load on consuming page.
     ========================================================================== */

  /* Paper & ink */
  --editorial-paper:        #F6F2EA;
  --editorial-paper-alt:    #EFE9DD;
  --editorial-page:         #FBF8F2;
  --editorial-rule:         #E3DAC6;
  --editorial-rule-strong:  #C9BE9F;
  --editorial-ink:          #1A1614;
  --editorial-ink-soft:     #4A433C;
  --editorial-ink-mute:     #8A8174;
  --editorial-ink-faint:    #B8B0A1;

  /* Severity accents */
  --editorial-oxblood:      #7A1F2B;
  --editorial-oxblood-tint: #F3E4E2;
  --editorial-ochre:        #8A6B2B;
  --editorial-ochre-tint:   #F1E7D0;
  --editorial-forest:       #2E4A36;
  --editorial-forest-tint:  #DEE7DD;

  /* Type stack -- only FRL is actually loaded sitewide (main.hbs:25 weights
     500/700; .about-name + .convergence-quote are current consumers). David
     Libre + Noto Serif Hebrew were removed from Google Fonts URL R3-E; chain
     pruned to FRL -> Georgia (universal system serif) -> browser default. */
  --editorial-serif: 'Frank Ruhl Libre', Georgia, serif;
  /* IBM Plex Mono is inert (not loaded); --editorial-mono is reserved for
     future draft-review surfaces and currently falls back to system mono. */
  --editorial-mono:  'IBM Plex Mono', ui-monospace, Menlo, monospace;
}

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

html {
  font-size: 15px;
  scroll-behavior: smooth;
  width: 100%;
  max-width: 100%;
  min-height: 100vh;
  overflow-x: hidden;
}

body {
  font-family: var(--font-primary);
  line-height: 1.5;
  color: var(--text-body, rgba(255,255,255,0.75));
  background: var(--navy-deep);
  width: 100%;
  min-height: 100vh;
  margin: 0;
  padding: 0;
  overflow-x: hidden;
}

/* Direction inherited from html[dir] attribute set by Handlebars layout */

h1, h2, h3, h4 {
  font-family: var(--font-primary);
  font-weight: 700;
  color: var(--navy);
  line-height: 1.2;
}

a { color: var(--gold); text-decoration: none; transition: var(--transition); }
a:hover { color: #e8c578; }

/* Container */
.container,
.section-container {
  max-width: var(--container-max);
  width: 100%;
  margin: 0 auto;
  padding: 0 var(--space-lg);
  box-sizing: border-box;
}

.section-container {
  max-width: var(--container-max);
  margin: 0 auto;
  padding: 0 var(--space-lg);
  box-sizing: border-box;
}

/* Prevent any element from overflowing */
section, .section, main, article {
  max-width: 100%;
  overflow-x: hidden;
}

/* ==========================================================================
   NAVBAR - Compact Dark
   ========================================================================== */
.navbar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  background: var(--navy);
  padding: var(--space-md) 0;
  box-shadow: var(--shadow-md);
}

/* ============================================================
   PREVIEW NOTICE STRIP (pre-launch)
   Site-wide, non-dismissible bar above the navbar. The fixed
   navbar (top:0) and all in-flow content are shifted down by the
   strip height so every page's existing hero clearance is kept.
   To take the site live: delete this whole block AND the
   .preview-strip markup in views/layouts/main.hbs.
   ============================================================ */
:root { --preview-strip-h: 2.5rem; }

.preview-strip {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1001; /* above the navbar (1000) */
  height: var(--preview-strip-h);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  padding: 0 1rem;
  box-sizing: border-box;
  background: var(--gold);
  color: var(--navy-deep);
  border-bottom: 1px solid rgba(10, 25, 47, 0.25);
  text-align: center;
}

.preview-strip-text {
  font-size: 0.8rem;
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: 0.01em;
}

/* Shift the fixed navbar + all in-flow content down by the strip height */
.navbar { top: var(--preview-strip-h); }
body { padding-top: var(--preview-strip-h); }

@media (max-width: 600px) {
  :root { --preview-strip-h: 3.4rem; }
  .preview-strip-text { font-size: 0.72rem; }
}

@media print {
  .preview-strip { display: none; }
  body { padding-top: 0; }
  .navbar { top: 0; }
}

.navbar-container,
.nav-container {
  max-width: var(--container-max);
  margin: 0 auto;
  padding: 0 var(--space-lg);
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.logo {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}

.navbar-brand {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  text-decoration: none;
}

.navbar-logo {
  height: 72px;
  width: auto;
  filter: brightness(0) invert(1);
  object-fit: cover;
  object-position: top;
  max-height: 48px;
}

/* Brand tagline beside the logo (promoted from footer 2026-06-19) */
.navbar-tagline {
  font-family: "Frank Ruhl Libre", David, serif;
  font-size: 0.82rem;
  font-weight: 500;
  color: var(--gold);
  white-space: nowrap;
  padding-inline-start: 0.7rem;
  border-inline-start: 1px solid rgba(255, 255, 255, 0.18);
  letter-spacing: 0.01em;
}

@media (max-width: 1024px) {
  .navbar-tagline { display: none; }
}

.navbar-beta {
  font-size: 0.6rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: #d4af55;
  border: 1px solid rgba(212,175,85,0.5);
  padding: 0.15rem 0.45rem;
  border-radius: 4px;
  line-height: 1;
  margin-top: 0.15rem;
}

.navbar-menu,
.nav-links {
  display: flex;
  align-items: center;
  gap: var(--space-xl);
  list-style: none;
}

.nav-links a {
  color: rgba(255,255,255,0.85);
  font-size: 0.9rem;
  font-weight: 500;
  padding: var(--space-sm) 0;
  text-decoration: none;
  transition: var(--transition);
}

.nav-links a:hover {
  color: var(--white);
}

.nav-links a.active {
  color: var(--white);
}

.nav-links .nav-cta {
  background: var(--accent);
  color: var(--navy-deep);
  padding: var(--space-sm) var(--space-lg);
  border-radius: var(--border-radius);
  font-weight: 600;
}

.nav-links .nav-cta:hover {
  background: var(--accent-dark);
}

.navbar-link {
  color: rgba(255,255,255,0.85);
  font-size: 0.9rem;
  font-weight: 500;
  padding: var(--space-sm) 0;
  position: relative;
}

.navbar-link:hover { color: var(--white); }

.navbar-link::after {
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  width: 0;
  height: 2px;
  background: var(--accent-light);
  transition: var(--transition);
}

.navbar-link:hover::after { width: 100%; }

.navbar-link.active { color: var(--white); }
.navbar-link.active::after { width: 100%; }

.navbar-cta {
  background: var(--accent);
  color: var(--navy-deep);
  padding: var(--space-sm) var(--space-lg);
  border-radius: var(--border-radius);
  font-size: 0.85rem;
  font-weight: 600;
}

.navbar-cta:hover {
  background: var(--accent-dark);
  color: var(--navy-deep);
}

.nav-toggle {
  display: none;
  flex-direction: column;
  gap: 4px;
  background: none;
  border: none;
  cursor: pointer;
  padding: var(--space-sm);
}

.nav-toggle span {
  width: 22px;
  height: 2px;
  background: var(--white);
  transition: var(--transition);
}

/* Navbar Dropdown */
.navbar-dropdown {
  position: relative;
}

.navbar-dropdown-toggle {
  background: none;
  border: none;
  cursor: pointer;
  font-family: inherit;
  color: rgba(255,255,255,0.85);
  font-size: 0.9rem;
  font-weight: 500;
  padding: var(--space-sm) 0;
}

.navbar-dropdown-toggle:hover { color: var(--white); }

.navbar-dropdown-toggle::after {
  content: " \25BE";
  font-size: 0.7em;
  opacity: 0.6;
}

.navbar-dropdown-menu {
  display: none;
  position: absolute;
  top: 100%;
  inset-inline-end: 0;
  background: var(--navy-deep, #0a192f);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 8px;
  padding: var(--space-sm) 0;
  min-width: 160px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.3);
  z-index: 100;
  list-style: none;
}

.navbar-dropdown:hover .navbar-dropdown-menu,
.navbar-dropdown:focus-within .navbar-dropdown-menu,
.navbar-dropdown-menu.show {
  display: block;
}

.navbar-dropdown-menu li { padding: 0; }

.navbar-dropdown-menu .navbar-link {
  display: block;
  padding: var(--space-sm) var(--space-lg);
  font-size: 0.85rem;
  white-space: nowrap;
}

.navbar-dropdown-menu .navbar-link:hover {
  background: rgba(255,255,255,0.05);
}

.navbar-dropdown-menu .navbar-link::after { display: none; }

/* Hero Price Badge */
.hero-price-badge {
  display: inline-block;
  background: rgba(212, 175, 85, 0.12);
  border: 1px solid rgba(212, 175, 85, 0.3);
  color: var(--gold, #d4af55);
  padding: 8px 20px;
  border-radius: 8px;
  font-size: 0.9rem;
  font-weight: 500;
  margin-top: var(--space-sm);
}

/* Hero Input Hint */
.hero-input-hint {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.7);
  margin-top: var(--space-xs);
  text-align: center;
  font-style: italic;
}

/* Quick Nav Strip */
.quick-nav {
  display: flex;
  gap: 1.5rem;
  justify-content: center;
  flex-wrap: wrap;
  padding: 0.75rem 1rem;
  background: rgba(255,255,255,0.04);
  border-bottom: 1px solid rgba(255,255,255,0.08);
}
.quick-nav a {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.55);
  text-decoration: none;
  letter-spacing: 0.03em;
}
.quick-nav a:hover {
  color: var(--gold, #d4af55);
}

/* 10 Parts collapsible */
.parts-expand {
  margin-top: 0.5rem;
}
.parts-expand summary {
  cursor: pointer;
  font-size: 0.75rem;
  color: var(--gold, #d4af55);
  opacity: 0.8;
  user-select: none;
  list-style: none;
}
.parts-expand summary::-webkit-details-marker { display: none; }
.parts-expand .parts-list {
  font-size: 0.75rem;
  color: rgba(255,255,255,0.55);
  line-height: 1.7;
  margin-top: 0.35rem;
  padding: 0;
}

/* Social Proof Line */
.hero-social-proof {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.7);
  text-align: center;
  margin: var(--space-md) 0 0;
  letter-spacing: 0.02em;
}

/* Wizard Price Note */
.wizard-price-note {
  font-size: 0.85rem;
  color: var(--gold, #d4af55);
  margin-top: var(--space-xs);
  opacity: 0.85;
}

/* ICP Card Link */
.icp-card-link {
  display: inline-block;
  margin-top: var(--space-sm);
  color: #946f1a;
  font-size: 0.85rem;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.icp-card-link:hover {
  color: var(--gold, #d4af55);
}

/* (Replaced by .founder-card - see end of file) */

/* Pricing Page CTA Card */
.pricing-cta-card {
  max-width: 520px;
  margin: var(--space-xl) auto;
  text-align: center;
}

.pricing-primary-cta {
  display: inline-block;
  font-size: 1.1rem;
  padding: 14px 40px;
  margin-bottom: var(--space-lg);
}


/* ==========================================================================
   HERO - Compact Dark Gradient
   ========================================================================== */
.hero {
  background: linear-gradient(135deg, var(--navy) 0%, var(--navy-deep) 100%);
  color: var(--white);
  padding: calc(52px + var(--space-3xl)) var(--space-lg) var(--space-3xl);
  text-align: center;
}

.hero-container {
  max-width: 700px;
  margin: 0 auto;
}

.hero-title {
  font-size: 2.5rem;
  color: var(--white);
  margin-bottom: var(--space-lg);
  line-height: 1.15;
}

.hero-highlight { color: var(--accent-light); }

.hero-subtitle {
  font-size: 1.1rem;
  color: rgba(255,255,255,0.9);
  margin-bottom: var(--space-xl);
  line-height: 1.6;
}

.hero-subtitle strong { color: var(--white); }

.hero-cta {
  display: flex;
  gap: var(--space-md);
  justify-content: center;
  flex-wrap: wrap;
}

/* ==========================================================================
   BUTTONS - Compact
   ========================================================================== */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-sm);
  padding: var(--space-md) var(--space-xl);
  font-family: var(--font-primary);
  font-size: 0.9rem;
  font-weight: 600;
  border-radius: var(--border-radius);
  border: none;
  cursor: pointer;
  transition: var(--transition);
}

.btn-lg {
  padding: var(--space-lg) var(--space-2xl);
  font-size: 1rem;
}

.btn-primary {
  background: var(--accent);
  color: var(--navy-deep);
}

.btn-primary:hover {
  background: var(--accent-dark);
  color: var(--navy-deep);
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
}

.btn-secondary {
  background: transparent;
  color: var(--white);
  border: 2px solid rgba(255,255,255,0.5);
}

.btn-secondary:hover {
  background: rgba(255,255,255,0.1);
  border-color: var(--white);
  color: var(--white);
}

.btn-accent {
  background: var(--success);
  color: var(--white);
}

.btn-accent:hover {
  background: #047857;
  color: var(--white);
}

.btn-outline-light {
  background: transparent;
  color: var(--white);
  border: 2px solid var(--white);
}

.btn-outline-light:hover {
  background: var(--white);
  color: var(--navy);
}

/* ==========================================================================
   SECTIONS - Compact
   ========================================================================== */
.section {
  padding: var(--space-3xl) 0;
  background: var(--navy);
  color: var(--white);
  width: 100%;
}

section {
  width: 100%;
  display: block;
}

.section h2, .section h3, .section h4 {
  color: var(--white);
}

.section p {
  color: rgba(255,255,255,0.8);
}

.section-dark {
  background: var(--navy-light);
  color: var(--white);
}

.section-dark h2,
.section-dark h3,
.section-dark h4 {
  color: var(--white);
}

.section-dark p {
  color: rgba(255,255,255,0.8);
}

.section-header {
  text-align: center;
  margin-bottom: var(--space-2xl);
}

.section-title {
  font-size: 1.75rem;
  margin-bottom: var(--space-sm);
}

/* ==========================================================================
   FEATURES GRID - From V1
   ========================================================================== */
.features-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-lg);
}

.feature-card {
  background: var(--white);
  border-radius: var(--border-radius);
  padding: var(--space-xl);
  text-align: center;
  box-shadow: var(--shadow-sm);
  transition: var(--transition);
}

.feature-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-md);
}

.feature-icon {
  width: 48px;
  height: 48px;
  background: rgba(212, 175, 85, 0.1);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto var(--space-lg);
  color: var(--accent);
}

.feature-icon svg {
  width: 24px;
  height: 24px;
}

.feature-card h3 {
  font-size: 1rem;
  margin-bottom: var(--space-sm);
}

.feature-card p {
  font-size: 0.85rem;
  color: var(--gray-500);
  margin: 0;
}

/* ==========================================================================
   DOMAINS SECTION
   ========================================================================== */
/* ==========================================================================
   DOMAINS COVERAGE SECTION - Simplified
   ========================================================================== */
.domains-coverage-section {
  background: var(--navy);
  padding: var(--space-3xl) 0;
  color: var(--white);
}

.domains-coverage-section .section-title {
  color: var(--white);
  margin-bottom: var(--space-xl);
}

.domains-coverage-content {
  max-width: 800px;
  margin: 0 auto;
  text-align: center;
}

.coverage-text {
  font-size: 1.25rem;
  line-height: 1.8;
  color: rgba(255,255,255,0.95);
  margin-bottom: var(--space-lg);
}

.coverage-text strong {
  color: var(--teal);
}

.coverage-subtext {
  font-size: 1.05rem;
  line-height: 1.6;
  color: rgba(255,255,255,0.75);
  margin-bottom: var(--space-xl);
}

.coverage-subtext strong {
  color: var(--white);
}

.coverage-cta {
  margin-top: var(--space-lg);
}

.btn-outline-light {
  display: inline-block;
  padding: var(--space-md) var(--space-xl);
  border: 2px solid rgba(255,255,255,0.5);
  color: var(--white);
  background: transparent;
  border-radius: var(--border-radius);
  font-size: 1rem;
  font-weight: 500;
  text-decoration: none;
  transition: var(--transition);
}

.btn-outline-light:hover {
  background: rgba(255,255,255,0.1);
  border-color: var(--teal);
  color: var(--teal);
}

/* ==========================================================================
   STEPS - Compact
   ========================================================================== */
.steps-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-lg);
}

.step-card {
  background: var(--white);
  padding: var(--space-xl);
  border-radius: var(--border-radius);
  text-align: center;
  box-shadow: var(--shadow-sm);
}

.step-number {
  width: 40px;
  height: 40px;
  background: var(--accent);
  color: var(--navy-deep);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.25rem;
  font-weight: 700;
  margin: 0 auto var(--space-md);
}

.step-card h3 {
  font-size: 1rem;
  margin-bottom: var(--space-sm);
}

.step-card p {
  font-size: 0.85rem;
  color: var(--gray-500);
  margin: 0;
}

/* ==========================================================================
   PRICING - Compact
   ========================================================================== */
.pricing {
  padding: var(--space-3xl) 0;
  background: var(--gray-100);
}

.pricing-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-lg);
  max-width: 900px;
  margin: 0 auto;
}

.pricing-card {
  background: var(--white);
  border-radius: var(--border-radius);
  padding: var(--space-xl);
  text-align: center;
  box-shadow: var(--shadow-sm);
  position: relative;
  transition: var(--transition);
}

.pricing-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-md);
}

.pricing-card-featured {
  border: 2px solid var(--accent);
}

.pricing-badge {
  position: absolute;
  top: -10px;
  right: 50%;
  transform: translateX(50%);
  background: var(--accent);
  color: var(--navy-deep);
  padding: var(--space-xs) var(--space-md);
  border-radius: 20px;
  font-size: 0.75rem;
  font-weight: 600;
}

.pricing-header h3 {
  font-size: 1.1rem;
  margin-bottom: var(--space-sm);
}

.pricing-price {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 2px;
  margin-bottom: var(--space-lg);
}

.price-amount {
  font-size: 2.25rem;
  font-weight: 700;
  color: var(--accent);
}

.price-currency {
  font-size: 1rem;
  color: var(--gray-500);
}

.pricing-features {
  list-style: none;
  margin-bottom: var(--space-lg);
}

.pricing-features li {
  padding: var(--space-sm) 0;
  border-bottom: 1px solid var(--gray-100);
  font-size: 0.85rem;
}

.pricing-features li:last-child {
  border-bottom: none;
}

.status-tag {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 4px;
  font-family: monospace;
  font-size: 0.75rem;
}

.status-tag.draft {
  background: rgba(217, 119, 6, 0.1);
  color: var(--warning);
}

.status-tag.ready {
  background: rgba(5, 150, 105, 0.1);
  color: var(--success);
}

.pricing-usecase {
  font-size: 0.8rem;
  color: var(--gray-500);
  font-style: italic;
  margin-bottom: var(--space-lg);
}

/* ==========================================================================
   PRICING SECTION - Dark Theme (for landing page)
   ========================================================================== */
.pricing-section {
  background: var(--navy);
  padding: var(--space-3xl) 0;
}

.pricing-section .section-title {
  color: var(--white);
}

.pricing-section .pricing-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-lg);
  max-width: 900px;
  margin: 0 auto;
}

.pricing-section .pricing-card {
  background: var(--navy-light);
  border-radius: var(--border-radius);
  padding: var(--space-xl);
  text-align: center;
  position: relative;
  transition: var(--transition);
  border: 1px solid rgba(255,255,255,0.1);
}

.pricing-section .pricing-card:hover {
  transform: translateY(-4px);
  border-color: rgba(255,255,255,0.2);
}

.pricing-section .pricing-card.featured {
  border: 2px solid var(--accent);
}

.pricing-section .pricing-badge {
  position: absolute;
  top: -10px;
  right: 50%;
  transform: translateX(50%);
  background: var(--accent);
  color: var(--navy-deep);
  padding: var(--space-xs) var(--space-md);
  border-radius: 20px;
  font-size: 0.75rem;
  font-weight: 600;
}

.pricing-section .pricing-card h3 {
  color: var(--white);
  font-size: 1.1rem;
  margin-bottom: var(--space-sm);
}

.pricing-section .price {
  font-size: 2.25rem;
  font-weight: 700;
  color: var(--accent-light);
  margin-bottom: var(--space-lg);
}

.pricing-section .pricing-features {
  list-style: none;
  margin-bottom: var(--space-lg);
  text-align: right;
}

.pricing-section .pricing-features li {
  padding: var(--space-sm) 0;
  border-bottom: 1px solid rgba(255,255,255,0.1);
  font-size: 0.85rem;
  color: rgba(255,255,255,0.8);
}

.pricing-section .pricing-features li:last-child {
  border-bottom: none;
}

.pricing-section .pricing-cta {
  display: inline-block;
  padding: var(--space-sm) var(--space-xl);
  background: var(--accent);
  color: var(--navy-deep);
  border-radius: var(--border-radius);
  font-weight: 600;
  transition: var(--transition);
}

.pricing-section .pricing-cta:hover {
  background: var(--accent-dark);
  color: var(--navy-deep);
}

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

/* ==========================================================================
   FAQ SECTION
   ========================================================================== */
.faq-section {
  background: var(--cream);
  padding: var(--space-3xl) 0;
}

.faq-section .section-title {
  color: var(--navy);
}

.faq-grid {
  max-width: 800px;
  margin: 0 auto;
}

.faq-item {
  background: var(--white);
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: var(--border-radius);
  margin-bottom: var(--space-md);
  overflow: hidden;
}

.faq-question {
  padding: var(--space-lg);
  font-weight: 600;
  color: var(--navy);
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  list-style: none;
}

.faq-question::-webkit-details-marker {
  display: none;
}

.faq-question::after {
  content: '+';
  font-size: 1.5rem;
  font-weight: 400;
  color: var(--accent);
  transition: var(--transition);
}

.faq-item[open] .faq-question::after {
  transform: rotate(45deg);
}

.faq-answer {
  padding: 0 var(--space-lg) var(--space-lg);
  color: var(--gray-600);
  line-height: 1.7;
  margin: 0;
}

/* ==========================================================================
   TRUST SECTION - Security & AI
   ========================================================================== */
.section-dark {
  background: var(--navy);
  color: var(--white);
}

.section-dark .section-title {
  color: var(--white);
}

.trust-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-xl);
  max-width: 900px;
  margin: 0 auto;
}

.trust-card {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: var(--border-radius);
  padding: var(--space-xl);
  text-align: center;
}

.trust-icon {
  width: 48px;
  height: 48px;
  margin: 0 auto var(--space-md);
  color: var(--accent);
}

.trust-icon svg {
  width: 100%;
  height: 100%;
}

.trust-title {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--white);
  margin-bottom: var(--space-sm);
}

.trust-description {
  font-size: 0.95rem;
  color: rgba(255,255,255,0.8);
  line-height: 1.6;
  margin: 0;
}

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

/* Founder Quote */
.founder-quote {
  font-size: 1.15rem;
  font-weight: 500;
  color: var(--white);
  border-right: 3px solid var(--accent);
  padding-right: var(--space-lg);
  margin-bottom: var(--space-xl);
  line-height: 1.7;
}

/* Trust Bar - Compact horizontal */
.trust-bar {
  background: var(--cream);
  padding: var(--space-lg) 0;
  border-top: 1px solid rgba(0,0,0,0.05);
  border-bottom: 1px solid rgba(0,0,0,0.05);
}

.trust-bar-grid {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: var(--space-2xl);
  flex-wrap: wrap;
}

.trust-bar-item {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  color: var(--navy);
  font-size: 0.9rem;
  font-weight: 500;
}

.trust-bar-icon {
  width: 20px;
  height: 20px;
  color: var(--accent);
  flex-shrink: 0;
}

@media (max-width: 992px) {
  .trust-bar-grid {
    flex-direction: column;
    gap: var(--space-md);
  }
}

/* ==========================================================================
   CTA - Compact Dark
   ========================================================================== */
.cta-section {
  background: linear-gradient(135deg, var(--navy) 0%, var(--navy-light) 100%);
  padding: var(--space-3xl) 0;
}

.cta-content {
  text-align: center;
  max-width: 550px;
  margin: 0 auto;
}

.cta-title {
  font-size: 1.75rem;
  color: var(--white);
  margin-bottom: var(--space-md);
}

.cta-subtitle {
  font-size: 1rem;
  color: rgba(255,255,255,0.85);
  margin-bottom: var(--space-xl);
}

.cta-buttons {
  display: flex;
  gap: var(--space-md);
  justify-content: center;
  flex-wrap: wrap;
}

/* ==========================================================================
   FOOTER - Compact Dark
   ========================================================================== */
.footer {
  background: var(--navy-deep);
  color: rgba(255,255,255,0.7);
  padding: var(--space-2xl) 0 var(--space-lg);
}

.footer-container {
  max-width: var(--container-max);
  margin: 0 auto;
  padding: 0 var(--space-lg);
}

.footer-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  gap: var(--space-2xl);
  margin-bottom: var(--space-xl);
}

.footer-logo {
  height: 36px;
  width: auto;
  margin-bottom: var(--space-md);
  filter: brightness(0) invert(1);
}

.footer-description {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.6);
  margin: 0;
}

.footer-nav h3 {
  color: var(--white);
  font-size: 0.9rem;
  font-weight: 600;
  margin-bottom: var(--space-md);
}

.footer-nav ul { list-style: none; }

.footer-nav li { margin-bottom: var(--space-sm); }

.footer-nav a {
  color: rgba(255,255,255,0.6);
  font-size: 0.85rem;
}

.footer-nav a:hover { color: var(--white); }

.article-embed {
  text-decoration: none;
  color: inherit;
  display: block;
}

.article-headline-en {
    direction: ltr;
    text-align: left;
    font-style: italic;
    font-size: 0.95rem;
    color: rgba(255,255,255,0.7);
    border-inline-start: 3px solid rgba(255,255,255,0.2);
    padding-inline-start: 0.75rem;
    margin-bottom: 0.75rem;
}

.footer-founder {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.7);
  margin-top: var(--space-sm);
}

.footer-disclaimer {
  text-align: center;
  padding: var(--space-lg) 0;
  border-top: 1px solid rgba(255,255,255,0.1);
  border-bottom: 1px solid rgba(255,255,255,0.1);
  font-size: 0.8rem;
  color: rgba(255,255,255,0.7);
  margin-bottom: var(--space-lg);
}

.footer-bottom {
  text-align: center;
  font-size: 0.8rem;
  color: rgba(255,255,255,0.7);
}

.footer-bottom p { margin: 0; }

.footer-links {
  display: flex;
  justify-content: center;
  gap: var(--space-lg);
  margin-top: var(--space-md);
}

.footer-links a {
  color: rgba(255,255,255,0.7);
  font-size: 0.8rem;
  text-decoration: none;
}

.footer-links a:hover {
  color: rgba(255,255,255,0.8);
}

.footer-links .operator-link {
  opacity: 0.3;
  font-size: 0.7rem;
}

.footer-links .operator-link:hover {
  opacity: 0.6;
}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width: 1200px) {
  .domains-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

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

  .steps-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .footer-grid {
    grid-template-columns: 1fr 1fr;
  }

  .nav-toggle { display: flex; }

  .navbar-menu,
  .nav-links {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: var(--navy);
    flex-direction: column;
    padding: var(--space-lg);
    gap: var(--space-md);
    display: none;
    border-top: 1px solid rgba(255,255,255,0.1);
  }

  .navbar-menu.active,
  .nav-links.active { display: flex; }

  .navbar-cta { width: 100%; text-align: center; }

  /* Mobile: dropdown items inline */
  .navbar-dropdown-menu {
    position: static;
    display: block;
    background: none;
    border: none;
    box-shadow: none;
    padding: 0;
    padding-inline-start: var(--space-lg);
    min-width: unset;
  }

  .navbar-dropdown-toggle::after { content: ""; }

  .navbar-dropdown-menu .navbar-link {
    padding: var(--space-xs) 0;
  }

  .navbar-dropdown-menu .navbar-link:hover {
    background: none;
  }
}

@media (max-width: 768px) {
  html { font-size: 14px; }

  .hero-title { font-size: 2rem; }

  .features-grid,
  .domains-grid,
  .steps-grid {
    grid-template-columns: 1fr;
  }

  .footer-grid {
    grid-template-columns: 1fr;
    gap: var(--space-xl);
  }

  .hero-cta {
    flex-direction: column;
    align-items: center;
  }

  .btn-lg {
    width: 100%;
    max-width: 250px;
  }
}

/* Utilities */
.text-center { text-align: center; }
.btn-block { width: 100%; }

/* ==========================================================================
   HOW IT WORKS - 3 Steps
   ========================================================================== */
.how-it-works {
  background: var(--cream);
  padding: var(--space-3xl) 0;
}

.how-it-works .section-title {
  color: var(--navy);
  text-align: center;
  margin-bottom: var(--space-2xl);
}

.steps-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-lg);
  flex-wrap: wrap;
}

.step-item {
  background: var(--white);
  border-radius: var(--border-radius);
  padding: var(--space-xl);
  text-align: center;
  box-shadow: var(--shadow-sm);
  flex: 1;
  min-width: 200px;
  max-width: 280px;
}

.step-item .step-number {
  width: 48px;
  height: 48px;
  background: var(--accent);
  color: var(--navy-deep);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
  font-weight: 700;
  margin: 0 auto var(--space-md);
}

.step-item h3 {
  font-size: 1.1rem;
  color: var(--navy);
  margin-bottom: var(--space-sm);
}

.step-item p {
  font-size: 0.9rem;
  color: var(--gray-600);
  margin: 0;
  line-height: 1.5;
}

.step-arrow {
  font-size: 2rem;
  color: var(--accent);
  font-weight: 300;
}
/* RTL: steps lay out right-to-left, so the inter-step arrow must point LEFT.
   The glyph is "→" (U+2192); flip it horizontally in RTL. (Audit 3.1) */
[dir="rtl"] .step-arrow {
  transform: scaleX(-1);
}

@media (max-width: 768px) {
  .steps-row {
    flex-direction: column;
  }
  /* Mobile stacks vertically -> arrow points DOWN in both directions.
     Dir-scoped so the RTL scaleX(-1) above (higher specificity) doesn't win here. */
  .step-arrow,
  [dir="rtl"] .step-arrow {
    transform: rotate(90deg);
  }
  .step-item {
    max-width: 100%;
  }
}

/* ==========================================================================
   SOCIAL PROOF STATS
   ========================================================================== */
.social-proof-section {
  background: linear-gradient(180deg, var(--navy) 0%, var(--navy-light) 100%);
  padding: 5rem 0;
  border-top: 1px solid rgba(212, 175, 85, 0.2);
  border-bottom: 1px solid rgba(212, 175, 85, 0.2);
}

.stats-row {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: var(--space-3xl);
  flex-wrap: wrap;
}

.stat-item {
  text-align: center;
  padding: var(--space-lg);
}

.stat-number {
  font-family: 'Inter', sans-serif;
  font-size: 2.5rem;
  font-weight: 700;
  color: #d4af55;
  line-height: 1;
  margin-bottom: var(--space-sm);
}

.stat-label {
  font-size: 0.9rem;
  color: rgba(255, 255, 255, 0.75);
  font-weight: 500;
}

@media (max-width: 768px) {
  .stats-row {
    gap: var(--space-xl);
  }
  .stat-item {
    flex: 0 0 45%;
  }
  .stat-number {
    font-size: 2rem;
  }
}

/* ==========================================================================
   COMPARISON TABLE
   ========================================================================== */
.comparison-section {
  background: var(--navy);
  padding: var(--space-3xl) 0;
}

.comparison-section .section-title {
  color: var(--white);
  text-align: center;
  margin-bottom: var(--space-2xl);
}

.comparison-table-wrapper {
  max-width: 700px;
  margin: 0 auto;
  overflow-x: auto;
}

.comparison-table {
  width: 100%;
  border-collapse: collapse;
  background: var(--white);
  border-radius: var(--border-radius);
  overflow: hidden;
}

.comparison-table th,
.comparison-table td {
  padding: var(--space-md) var(--space-lg);
  text-align: right;
  border-bottom: 1px solid var(--gray-100);
}

.comparison-table thead th {
  background: var(--gray-50);
  font-weight: 600;
  color: var(--navy);
  font-size: 0.95rem;
}

.comparison-table thead th.highlight {
  background: var(--accent);
  color: var(--navy-deep);
}

.comparison-table tbody td {
  font-size: 0.9rem;
  color: var(--gray-700);
}

.comparison-table tbody td:first-child {
  font-weight: 600;
  color: var(--navy);
}

.comparison-table tbody td.highlight {
  background: rgba(212, 175, 85, 0.05);
  color: var(--accent);
  font-weight: 600;
}

.comparison-table tbody tr:last-child td {
  border-bottom: none;
}

@media (max-width: 600px) {
  .comparison-table th,
  .comparison-table td {
    padding: var(--space-sm) var(--space-md);
    font-size: 0.85rem;
  }
}

/* ==========================================================================
   COOKIE CONSENT BANNER
   ========================================================================== */
.cookie-banner {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background: var(--navy);
  color: var(--white);
  padding: var(--space-md) var(--space-lg);
  z-index: 9999;
  display: flex;
  justify-content: center;
  align-items: center;
  box-shadow: 0 -4px 12px rgba(0,0,0,0.2);
}

.cookie-content {
  display: flex;
  align-items: center;
  gap: var(--space-lg);
  max-width: var(--container-max);
  flex-wrap: wrap;
  justify-content: center;
}

.cookie-content p {
  margin: 0;
  font-size: 0.9rem;
  color: rgba(255,255,255,0.9);
}

.cookie-content a {
  color: var(--accent-light);
  text-decoration: underline;
}

.cookie-accept {
  background: var(--accent);
  color: var(--navy-deep);
  border: none;
  padding: var(--space-sm) var(--space-xl);
  border-radius: var(--border-radius);
  font-weight: 600;
  cursor: pointer;
  transition: var(--transition);
  white-space: nowrap;
}

.cookie-accept:hover {
  background: var(--accent-dark);
}

.cookie-decline {
  background: transparent;
  color: var(--white);
  border: 1px solid rgba(255,255,255,0.4);
  padding: var(--space-sm) var(--space-lg);
  border-radius: var(--border-radius);
  font-weight: 500;
  cursor: pointer;
  transition: var(--transition);
  white-space: nowrap;
  font: inherit;
}

.cookie-decline:hover {
  background: rgba(255,255,255,0.08);
  border-color: rgba(255,255,255,0.7);
}

.cookie-manage {
  color: var(--accent-light);
  text-decoration: underline;
  font-size: 0.9rem;
  white-space: nowrap;
}

/* ==========================================================================
   TRUST BAR ENHANCEMENTS
   ========================================================================== */
.trust-link {
  color: var(--accent);
  text-decoration: underline;
}

.trust-link:hover {
  color: var(--accent-dark);
}

.trust-badge-img {
  height: 24px;
  width: auto;
  margin-left: var(--space-sm);
}

/* ==========================================================================
   PAGE HEADER - For subpages (pricing, about, etc.)
   ========================================================================== */
.page-header {
  background: linear-gradient(135deg, var(--navy) 0%, var(--navy-deep) 100%);
  color: var(--white);
  padding: calc(60px + var(--space-3xl)) var(--space-lg) var(--space-2xl);
  text-align: center;
}

.page-title {
  font-size: 2.25rem;
  color: var(--white);
  margin-bottom: var(--space-sm);
}

.page-subtitle {
  font-size: 1.1rem;
  color: rgba(255,255,255,0.8);
  margin: 0;
}

/* ==========================================================================
   SECTION LIGHT - Light background sections
   ========================================================================== */
.section-light {
  background: var(--cream);
  color: var(--navy);
  padding: var(--space-3xl) 0;
}

.section-light h2,
.section-light h3,
.section-light h4 {
  color: var(--navy);
}

.section-light p {
  color: var(--gray-600);
}

/* ==========================================================================
   PRICING PAGE FIXES - Proper 3-column layout
   ========================================================================== */
.section .pricing-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-lg);
  max-width: 100%;
  width: 100%;
  margin: 0 auto;
  padding: 0;
  box-sizing: border-box;
}

.section .pricing-card {
  background: var(--white);
  border-radius: 12px;
  padding: var(--space-2xl);
  text-align: center;
  box-shadow: 0 4px 20px rgba(0,0,0,0.08);
  position: relative;
  transition: var(--transition);
  display: flex;
  flex-direction: column;
}

.section .pricing-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 12px 40px rgba(0,0,0,0.15);
}

.section .pricing-card.featured {
  border: 2px solid var(--accent);
  transform: scale(1.02);
}

.section .pricing-card.featured:hover {
  transform: scale(1.02) translateY(-8px);
}

.pricing-name {
  font-size: 1.25rem;
  color: var(--navy);
  margin-bottom: var(--space-md);
}

.pricing-price {
  font-size: 2.5rem;
  font-weight: 700;
  color: var(--accent);
  margin-bottom: var(--space-xs);
}

.pricing-period {
  font-size: 0.9rem;
  color: var(--gray-500);
  margin-bottom: var(--space-lg);
}

.pricing-description {
  font-size: 0.95rem;
  color: var(--gray-600);
  margin-bottom: var(--space-xl);
  line-height: 1.5;
}

.section .pricing-features {
  list-style: none;
  margin-bottom: var(--space-xl);
  text-align: right;
  flex-grow: 1;
}

.section .pricing-features li {
  padding: var(--space-sm) 0;
  font-size: 0.9rem;
  color: var(--gray-700);
  border-bottom: 1px solid var(--gray-100);
  position: relative;
  padding-right: var(--space-xl);
}

.section .pricing-features li::before {
  content: '✓';
  position: absolute;
  right: 0;
  color: var(--success);
  font-weight: bold;
}

.section .pricing-features li:last-child {
  border-bottom: none;
}

.section .pricing-badge {
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--accent);
  color: var(--navy-deep);
  padding: var(--space-xs) var(--space-lg);
  border-radius: 20px;
  font-size: 0.8rem;
  font-weight: 600;
  white-space: nowrap;
}

@media (max-width: 900px) {
  .section .pricing-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-sm);
  }

  .section .pricing-card {
    padding: var(--space-lg);
  }

  .pricing-price {
    font-size: 1.8rem;
  }

  .pricing-name {
    font-size: 1rem;
  }

  .section .pricing-features li {
    font-size: 0.8rem;
    padding: var(--space-xs) 0;
  }
}

@media (max-width: 600px) {
  .section .pricing-grid {
    grid-template-columns: 1fr;
    max-width: 350px;
    margin: 0 auto;
  }

  .section .pricing-card.featured {
    transform: none;
  }

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

/* ==========================================================================
   FAQ LIST - For pricing and other pages
   ========================================================================== */
.faq-list {
  max-width: 800px;
  margin: 0 auto;
}

.faq-honest-box {
    max-width: 800px;
    margin: 1.5rem auto 0;
    background: rgba(220, 38, 38, 0.06);
    border-inline-end: 3px solid rgba(220, 38, 38, 0.4);
    padding: 1.25rem 1.5rem;
    border-radius: 4px;
}

.faq-honest-box .label {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: rgba(248, 113, 113, 0.85);
    margin-bottom: 0.5rem;
}

.faq-honest-box p {
    font-size: 0.9rem;
    color: rgba(255,255,255,0.7);
    line-height: 1.7;
    margin-bottom: 0.4rem;
}

.faq-honest-box p:last-child { margin-bottom: 0; }

.faq-list .faq-item {
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-radius: var(--border-radius);
  margin-bottom: var(--space-md);
  overflow: hidden;
}

.faq-list .faq-question {
  font-size: 1rem;
  font-weight: 600;
  color: var(--navy);
  padding: var(--space-lg);
  margin: 0;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.faq-list .faq-question::after {
  content: '+';
  font-size: 1.5rem;
  font-weight: 300;
  color: var(--accent);
  transition: var(--transition);
}

.faq-list .faq-answer {
  padding: 0 var(--space-lg) var(--space-lg);
  color: var(--gray-600);
  line-height: 1.7;
  font-size: 0.95rem;
}

/* ==========================================================================
   PRINT STYLES - Legal Pages (terms, privacy)
   ========================================================================== */
@media print {
  /* Reset colors for printing */
  * {
    color: #000 !important;
    background: #fff !important;
    box-shadow: none !important;
    text-shadow: none !important;
  }

  /* Hide non-essential elements */
  .navbar,
  .footer,
  .cta-section,
  .btn,
  .btn-primary,
  .btn-outline,
  .nav-toggle,
  .orca-widget-container {
    display: none !important;
  }

  /* Page setup */
  @page {
    margin: 2cm;
    size: A4;
  }

  body {
    font-size: 12pt;
    line-height: 1.5;
    direction: inherit;
  }

  /* Legal page content - terms and privacy */
  .terms-container,
  .privacy-container {
    padding: 0 !important;
    max-width: 100% !important;
  }

  .terms-header,
  .privacy-header {
    border-bottom: 1pt solid #000 !important;
  }

  .terms-header h1,
  .privacy-header h1 {
    font-size: 18pt;
    margin-bottom: 0.5cm;
  }

  .terms-header .version,
  .privacy-header .version {
    font-size: 10pt;
    color: #666 !important;
  }

  .terms-section h2,
  .privacy-section h2 {
    font-size: 14pt;
    margin-top: 1cm;
    margin-bottom: 0.5cm;
    page-break-after: avoid;
    color: #000 !important;
  }

  .terms-section h3,
  .privacy-section h3 {
    font-size: 12pt;
    margin-top: 0.7cm;
    margin-bottom: 0.3cm;
    page-break-after: avoid;
  }

  .terms-section p,
  .privacy-section p,
  .terms-section li,
  .privacy-section li {
    orphans: 3;
    widows: 3;
  }

  .terms-section ul,
  .privacy-section ul,
  .terms-section ol,
  .privacy-section ol {
    page-break-inside: avoid;
  }

  /* Table of contents styling for print */
  .terms-toc,
  .privacy-toc {
    border: 1pt solid #ccc !important;
    page-break-inside: avoid;
    padding: 1cm !important;
    margin-bottom: 1cm;
  }

  .terms-toc ol,
  .privacy-toc ol {
    display: block !important;
    columns: 2;
    column-gap: 2cm;
  }

  /* Show link URLs for external links only */
  .terms-container a[href^="http"]:after,
  .privacy-container a[href^="http"]:after {
    content: " (" attr(href) ")";
    font-size: 9pt;
    font-weight: normal;
  }
}


/* ==========================================================================
   UNIFIED COMPARISON SECTION - Manual vs ORCA vs ChatGPT
   ========================================================================== */

.unified-comparison-section {
  background: linear-gradient(180deg, var(--navy) 0%, var(--navy-deep) 100%);
  padding: var(--space-3xl) 0;
}

.section-title-large {
  text-align: center;
  color: var(--white);
  font-size: 2.5rem;
  margin-bottom: var(--space-md);
}

.section-intro {
  text-align: center;
  color: rgba(255,255,255,0.8);
  font-size: 1.15rem;
  margin-bottom: var(--space-2xl);
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
}

/* 3-column comparison grid */
.comparison-mega-grid {
  display: grid;
  grid-template-columns: 1fr 1.2fr 1fr;
  gap: var(--space-lg);
  max-width: 1100px;
  margin: 0 auto;
  align-items: stretch;
}

.comparison-column {
  background: rgba(255,255,255,0.03);
  border-radius: var(--border-radius);
  padding: var(--space-xl);
  border: 1px solid rgba(255,255,255,0.1);
  display: flex;
  flex-direction: column;
}

/* Bad columns (Manual & ChatGPT) */
.comparison-column.manual,
.comparison-column.chatgpt {
  border-color: rgba(220, 38, 38, 0.25);
  background: rgba(220, 38, 38, 0.04);
}

/* Hero column (ORCA) */
.comparison-column.orca-hero {
  border-color: rgba(5, 150, 105, 0.5);
  background: rgba(5, 150, 105, 0.1);
  box-shadow: 0 0 40px rgba(5, 150, 105, 0.15);
  transform: scale(1.02);
  position: relative;
}

.comparison-column.orca-hero::before {
  content: "מומלץ";
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--teal);
  color: var(--white);
  padding: 4px 16px;
  border-radius: 20px;
  font-size: 0.85rem;
  font-weight: 600;
}

/* Column headers */
.column-header {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-md);
  margin-bottom: var(--space-lg);
  padding-bottom: var(--space-md);
  border-bottom: 1px solid rgba(255,255,255,0.1);
}

.column-icon {
  font-size: 2rem;
}

.column-header h3 {
  color: var(--white);
  font-size: 1.3rem;
  margin: 0;
}

.bad-header h3 {
  color: rgba(255,255,255,0.85);
}

.good-header h3 {
  color: #10b981;
}

/* Comparison lists */
.comparison-list {
  list-style: none;
  padding: 0;
  margin: 0;
  flex: 1;
}

.comparison-list li {
  color: rgba(255,255,255,0.9);
  padding: var(--space-sm) 0;
  display: flex;
  align-items: flex-start;
  gap: var(--space-sm);
  font-size: 0.95rem;
  line-height: 1.6;
}

.x-mark {
  color: #ef4444;
  font-weight: bold;
  flex-shrink: 0;
}

.check-mark {
  color: #10b981;
  font-weight: bold;
  flex-shrink: 0;
}

/* Bottom note */
.comparison-bottom-note {
  text-align: center;
  color: rgba(255,255,255,0.95);
  font-size: 1.1rem;
  margin-top: var(--space-2xl);
  padding: var(--space-lg) var(--space-xl);
  background: rgba(212, 175, 85, 0.12);
  border-radius: var(--border-radius);
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
  border: 1px solid rgba(212, 175, 85, 0.2);
}

.comparison-bottom-note em {
  color: var(--teal);
  font-style: normal;
  font-weight: 600;
}

/* Responsive */
@media (max-width: 900px) {
  .comparison-mega-grid {
    grid-template-columns: 1fr;
    gap: var(--space-lg);
  }

  .comparison-column.orca-hero {
    transform: none;
    order: -1; /* ORCA first on mobile */
  }

  .section-title-large {
    font-size: 2rem;
  }
}

/* ==========================================================================
   VALUES GRID - About Page
   ========================================================================== */
.values-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-lg);
  max-width: 1000px;
  margin: 0 auto;
}

.value-card {
  background: var(--white);
  border-radius: var(--border-radius);
  padding: var(--space-xl);
  text-align: center;
  box-shadow: var(--shadow-sm);
  transition: var(--transition);
}

.value-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-md);
}

.value-icon {
  width: 48px;
  height: 48px;
  margin: 0 auto var(--space-md);
  color: var(--accent);
  display: flex;
  align-items: center;
  justify-content: center;
}

.value-icon svg {
  width: 32px;
  height: 32px;
}

.value-title {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--navy);
  margin-bottom: var(--space-sm);
}

.value-description {
  font-size: 0.9rem;
  color: var(--gray-600);
  line-height: 1.6;
  margin: 0;
}

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

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

/* ==========================================================================
   DOMAINS GRID - About Page Standards Section
   ========================================================================== */
.domains-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-lg);
  max-width: 900px;
  margin: 0 auto;
}

.domain-card {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: var(--border-radius);
  padding: var(--space-xl);
  text-align: center;
  transition: var(--transition);
}

.domain-card:hover {
  border-color: rgba(255,255,255,0.2);
  background: rgba(255,255,255,0.08);
}

.domain-icon {
  width: 48px;
  height: 48px;
  margin: 0 auto var(--space-md);
  color: var(--accent-light);
  display: flex;
  align-items: center;
  justify-content: center;
}

.domain-icon svg {
  width: 32px;
  height: 32px;
}

.domain-title {
  font-size: 1rem;
  font-weight: 600;
  color: var(--white);
  margin-bottom: var(--space-sm);
}

.domain-description {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.7);
  margin: 0;
}

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

/* ==========================================================================
   FAQ DETAILS/SUMMARY - Native Accordion
   ========================================================================== */
.faq-list details {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: var(--border-radius);
  margin-bottom: var(--space-md);
  overflow: hidden;
}

.faq-list details[open] {
  border-color: rgba(255,255,255,0.2);
}

.faq-list summary {
  font-weight: 600;
  cursor: pointer;
  color: var(--white);
  padding: var(--space-lg);
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  transition: var(--transition);
}

.faq-list summary::-webkit-details-marker {
  display: none;
}

.faq-list summary::after {
  content: '+';
  font-size: 1.5rem;
  font-weight: 300;
  color: var(--accent-light);
  transition: transform 0.2s ease;
}

.faq-list details[open] summary::after {
  transform: rotate(45deg);
}

.faq-list summary:hover {
  background: rgba(255,255,255,0.03);
}

.faq-list details > p,
.faq-list details > div {
  padding: 0 var(--space-lg) var(--space-lg);
  color: rgba(255,255,255,0.8);
  line-height: 1.7;
  margin: 0;
}

/* Light theme FAQ (for section-light) */
.section-light .faq-list details {
  background: var(--white);
  border-color: var(--gray-200);
}

.section-light .faq-list details[open] {
  border-color: var(--gray-300);
}

.section-light .faq-list summary {
  color: var(--navy);
}

.section-light .faq-list summary:hover {
  background: var(--gray-50);
}

.section-light .faq-list details > p {
  color: var(--gray-600);
}

/* ==========================================================================
   FORM STYLES - Dark Glassmorphism
   ========================================================================== */
.form-group {
  margin-bottom: var(--space-lg);
}

.form-label {
  display: block;
  font-size: 0.9rem;
  font-weight: 600;
  color: rgba(255,255,255,0.9);
  margin-bottom: var(--space-sm);
}

.form-input,
.form-textarea,
.form-select {
  width: 100%;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: 8px;
  padding: var(--space-md) var(--space-lg);
  font-family: var(--font-primary);
  font-size: 0.95rem;
  color: var(--white);
  transition: var(--transition);
  direction: inherit;
}

.form-input::placeholder,
.form-textarea::placeholder {
  color: rgba(255,255,255,0.4);
}

.form-input:focus,
.form-textarea:focus,
.form-select:focus {
  outline: none;
  border-color: rgba(212, 175, 85, 0.6);
  background: rgba(255,255,255,0.1);
  box-shadow: 0 0 20px rgba(212, 175, 85, 0.15);
}

.form-textarea {
  resize: vertical;
  min-height: 120px;
  line-height: 1.6;
}

.form-select {
  appearance: none;
  cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='rgba(255,255,255,0.5)' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: left 1rem center;
  padding-left: 2.5rem;
}

.form-select option {
  background: var(--navy);
  color: var(--white);
}

/* ==========================================================================
   CONTACT GRID - Two Column Layout
   ========================================================================== */
.contact-grid {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: var(--space-2xl);
  align-items: start;
}

.contact-info {
  padding: var(--space-xl) 0;
}

.contact-info h2 {
  color: var(--white);
  font-size: 1.5rem;
  margin-bottom: var(--space-lg);
}

.contact-info p {
  color: rgba(255,255,255,0.75);
  line-height: 1.7;
  margin-bottom: var(--space-xl);
}

.contact-detail {
  display: flex;
  align-items: center;
  gap: var(--space-md);
  padding: var(--space-md) var(--space-lg);
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 8px;
  margin-bottom: var(--space-md);
  transition: var(--transition);
}

.contact-detail:hover {
  border-color: rgba(255,255,255,0.2);
  background: rgba(255,255,255,0.07);
}

.contact-detail svg {
  width: 20px;
  height: 20px;
  color: #d4af55;
  flex-shrink: 0;
}

.contact-detail span {
  color: rgba(255,255,255,0.9);
  font-size: 0.95rem;
}

@media (max-width: 768px) {
  .contact-grid {
    grid-template-columns: 1fr;
    gap: var(--space-xl);
  }
}

/* ========== Trust & Credibility (Features 9, 10, 11, 12) ========== */

/* Feature 9: Litigator Badge */
.litigator-badge-section {
  padding: 3rem 1.5rem;
  background: linear-gradient(180deg, #0a192f 0%, #0d1f3c 100%);
}
.litigator-badge-card {
  background: rgba(212, 175, 85, 0.06);
  border: 1px solid rgba(212, 175, 85, 0.2);
  border-radius: 12px;
  padding: 2rem 2.5rem;
  text-align: center;
}
.litigator-badge-title {
  color: #d4af55;
  font-size: 1.1rem;
  font-weight: 700;
  margin-bottom: 0.75rem;
}
.litigator-badge-desc {
  color: rgba(255,255,255,0.7);
  font-size: 0.95rem;
  line-height: 1.7;
  margin: 0;
}

/* Feature 10 + 12: Trust Signals Section (pricing page) */
.trust-signals-section {
  padding: 4rem 0;
  background: linear-gradient(180deg, #0d1f3c 0%, #0a192f 100%);
}
.trust-signals-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
}
@media (max-width: 768px) {
  .trust-signals-grid { grid-template-columns: 1fr; }
}
.trust-signal-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 12px;
  padding: 2rem;
}
.trust-signal-card h2 {
  color: #fff;
  font-size: 1.15rem;
  margin-bottom: 0.75rem;
}
.trust-signal-card p {
  color: rgba(255,255,255,0.7);
  font-size: 0.9rem;
  line-height: 1.7;
  margin-bottom: 1rem;
}
.trust-signal-icon {
  font-size: 1.5rem;
  margin-bottom: 0.75rem;
  color: #d4af55;
}
.trust-signal-label {
  display: inline-block;
  background: rgba(16, 185, 129, 0.15);
  border: 1px solid rgba(16, 185, 129, 0.3);
  color: #10b981;
  padding: 0.3rem 0.8rem;
  border-radius: 20px;
  font-size: 0.8rem;
  font-weight: 600;
}
.sovereignty-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}
.sovereignty-badge {
  background: rgba(212, 175, 85, 0.1);
  border: 1px solid rgba(212, 175, 85, 0.25);
  color: rgba(255,255,255,0.8);
  padding: 0.3rem 0.8rem;
  border-radius: 20px;
  font-size: 0.75rem;
  font-weight: 500;
}

/* Feature 11: Bar Compliance in Footer */
.footer-bar-compliance {
  color: rgba(255,255,255,0.4);
  font-size: 0.75rem;
  text-align: center;
  margin: 0.5rem 0;
  padding: 0 1.5rem;
}

/* Wizard Trust Signal */
.wizard-trust-signal {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.75rem 1rem;
  background: rgba(16, 185, 129, 0.08);
  border: 1px solid rgba(16, 185, 129, 0.2);
  border-radius: 8px;
  color: rgba(255,255,255,0.7);
  font-size: 0.85rem;
  margin-top: 1rem;
}
.trust-signal-check {
  color: #10b981;
  font-weight: 700;
}

.cta-btn:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(212, 175, 85, 0.6), 0 10px 40px rgba(212, 175, 85, 0.4);
}

/* --- Animations --- */
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes fadeInUp {
  from {
      opacity: 0;
      transform: translateY(20px);
  }
  to {
      opacity: 1;
      transform: translateY(0);
  }
}

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


/* ==========================================================================
   Wizard Enhancements - NER, Chat Mode, Preview
   ========================================================================== */

/* Defendant NER Suggestion Chip */
.defendant-input-wrapper {
  position: relative;
}

.ner-suggestion {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.5rem;
  padding: 0.5rem 0.75rem;
  background: rgba(212, 175, 85, 0.1);
  border: 1px solid rgba(212, 175, 85, 0.3);
  border-radius: var(--border-radius-sm, 6px);
  font-size: 0.9rem;
  color: rgba(255, 255, 255, 0.85);
}

.ner-suggestion-text {
  flex: 1;
  font-weight: 600;
  color: var(--gold, #d4af55);
}

.ner-suggestion-text::before {
  content: "זוהה: ";
  font-weight: 400;
  color: rgba(255, 255, 255, 0.6);
}

.ner-accept,
.ner-dismiss {
  background: none;
  border: 1px solid rgba(255, 255, 255, 0.2);
  color: rgba(255, 255, 255, 0.7);
  width: 28px;
  height: 28px;
  border-radius: 50%;
  cursor: pointer;
  font-size: 0.8rem;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
}

.ner-accept:hover {
  background: rgba(16, 185, 129, 0.2);
  border-color: #10b981;
  color: #10b981;
}

.ner-dismiss:hover {
  background: rgba(239, 68, 68, 0.2);
  border-color: #ef4444;
  color: #ef4444;
}

/* Add Defendant Button */
.btn-add-defendant {
  background: none;
  border: 1px dashed rgba(255, 255, 255, 0.2);
  color: var(--gold);
  padding: 0.4rem 0.8rem;
  border-radius: 6px;
  cursor: pointer;
  font-size: 0.85rem;
  margin-top: 0.5rem;
  transition: all 0.2s;
  font-family: inherit;
}
.btn-add-defendant:hover {
  border-color: var(--gold);
  background: rgba(212, 175, 85, 0.08);
}
.extra-defendant-row {
  display: flex;
  gap: 0.5rem;
  align-items: center;
  margin-top: 0.5rem;
}
.extra-defendant-row .form-input {
  flex: 1;
}
.btn-remove-defendant {
  background: none;
  border: 1px solid rgba(239, 68, 68, 0.3);
  color: #ef4444;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  cursor: pointer;
  font-size: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
  flex-shrink: 0;
}
.btn-remove-defendant:hover {
  background: rgba(239, 68, 68, 0.15);
  border-color: #ef4444;
}

/* Chat Mode Toggle */
.intake-mode-btn.chat-toggle .mode-icon::before {
  content: "\2709";
}

.wizard-chat-container {
  min-height: 300px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: var(--border-radius-sm, 6px);
  margin-top: 1rem;
}

.chat-intake-info {
  padding: 1rem;
  background: rgba(212, 175, 85, 0.06);
  border-radius: var(--border-radius-sm, 6px);
  margin-bottom: 1rem;
}

.chat-intake-info p {
  color: rgba(255, 255, 255, 0.7);
  font-size: 0.95rem;
  margin: 0;
}

/* Preview Section in Step 4 */
.preview-loading {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.75rem 0;
  color: rgba(255, 255, 255, 0.6);
  font-size: 0.9rem;
}

.spinner-small {
  width: 20px;
  height: 20px;
  border: 2px solid rgba(255, 255, 255, 0.15);
  border-top-color: var(--gold, #d4af55);
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}

@keyframes spin {
  to { transform: rotate(360deg); }
}

.preview-badge {
  background: rgba(212, 175, 85, 0.15) !important;
  color: var(--gold, #d4af55) !important;
  font-size: 0.75rem;
}

.preview-content {
  padding: 0.5rem 0;
}

.preview-cause-item {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.5rem 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.preview-cause-item:last-child {
  border-bottom: none;
}

.preview-cause-name {
  font-weight: 600;
  color: rgba(255, 255, 255, 0.9);
  font-size: 0.95rem;
}

.preview-cause-statute {
  font-size: 0.8rem;
  color: rgba(255, 255, 255, 0.5);
  font-style: italic;
}

.preview-error {
  color: rgba(255, 255, 255, 0.5);
  font-size: 0.9rem;
  padding: 0.5rem 0;
}

/* ==========================================================================
   Sample SOC Annotations
   ========================================================================== */

.annotation-toggle-btn {
  background: transparent;
  border: 1px solid rgba(212, 175, 85, 0.4);
  color: var(--gold, #d4af55);
  padding: 0.35rem 1rem;
  border-radius: var(--border-radius-sm, 6px);
  font-family: inherit;
  font-size: 0.85rem;
  cursor: pointer;
  transition: all 0.2s;
  margin-inline-start: auto;
}

.annotation-toggle-btn:hover,
.annotation-toggle-btn.active {
  background: var(--gold, #d4af55);
  color: var(--navy-deep, #0a192f);
}

/* ============================================================================
   FOLLOW-UP QUESTIONS PANEL (Intake Wizard v2)
   ============================================================================ */

.followup-panel {
    margin-top: 1.5rem;
    padding: 1.5rem;
    background: rgba(212, 175, 85, 0.06);
    border: 1px solid rgba(212, 175, 85, 0.25);
    border-radius: 12px;
    animation: followupSlideIn 0.4s ease-out;
}

@keyframes followupSlideIn {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: translateY(0); }
}

.followup-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.25rem;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.followup-title {
    font-size: 1.1rem;
    font-weight: 600;
    color: #d4af55;
    margin: 0;
}

.followup-score {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.85rem;
}

.followup-score-label {
    color: rgba(255,255,255,0.6);
}

.followup-score-bar {
    width: 80px;
    height: 6px;
    background: rgba(255,255,255,0.1);
    border-radius: 3px;
    overflow: hidden;
}

.followup-score-fill {
    height: 100%;
    width: 0%;
    background: #d4af55;
    border-radius: 3px;
    transition: width 0.6s ease;
}

.followup-score-value {
    color: #d4af55;
    font-weight: 600;
    min-width: 32px;
    text-align: left;
}

.followup-questions {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-bottom: 1.25rem;
}

.followup-question {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.followup-question-label {
    font-size: 0.95rem;
    color: rgba(255,255,255,0.85);
    font-weight: 500;
}

.followup-question-category {
    font-size: 0.75rem;
    color: rgba(212, 175, 85, 0.7);
    font-weight: 400;
}

.followup-question-input {
    width: 100%;
    padding: 0.6rem 0.75rem;
    background: rgba(255,255,255,0.05);
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 8px;
    color: #fff;
    font-size: 0.9rem;
    font-family: 'Heebo', sans-serif;
    direction: rtl;
    transition: border-color 0.2s;
}

.followup-question-input:focus {
    outline: none;
    border-color: rgba(212, 175, 85, 0.5);
}

.followup-question-input::placeholder {
    color: rgba(255,255,255,0.3);
}

.followup-actions {
    display: flex;
    gap: 0.75rem;
    justify-content: flex-start;
}

.followup-loading {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 0;
    color: rgba(255,255,255,0.6);
    font-size: 0.9rem;
}

.followup-round-indicator {
    font-size: 0.8rem;
    color: rgba(255,255,255,0.4);
    text-align: center;
    margin-top: 0.5rem;
}

/* ==========================================================================
   PHASE 2: Semantic classes replacing inline styles
   ========================================================================== */

/* Validation stats strip */
.validation-stats-strip {
    background: #0d1f3c;
    padding: 1.5rem 0;
    border-top: 1px solid rgba(212, 175, 85, 0.15);
    border-bottom: 1px solid rgba(212, 175, 85, 0.15);
}

.validation-stats-row {
    max-width: 900px;
    margin: 0 auto;
    padding: 0 1.5rem;
    display: flex;
    justify-content: center;
    gap: 3rem;
    flex-wrap: wrap;
    text-align: center;
}

.validation-stat-number {
    font-family: 'Inter', sans-serif;
    font-size: 1.5rem;
    font-weight: 700;
    color: #d4af55;
}

.validation-stat-label {
    font-size: 0.8rem;
    color: rgba(255,255,255,0.55);
}

/* "What is ORCA" section */
.about-orca-section {
    background: linear-gradient(180deg, #0a192f 0%, #0d1f3c 100%);
    padding: 3.5rem 0;
    position: relative;
    overflow: hidden;
    border-top: 1px solid rgba(212, 175, 85, 0.15);
    border-bottom: 1px solid rgba(212, 175, 85, 0.15);
}

/* Stat detail line under stats */
.stat-detail {
    font-size: 0.75rem;
    color: rgba(255,255,255,0.5);
    margin-top: 0.3rem;
}

.stat-number-smaller {
    font-size: 1.5rem;
}

/* Section title margin override */
.section-title-spaced {
    margin-bottom: 2rem;
}

/* Sample output CTA section */
.sample-cta-section {
    background: linear-gradient(135deg, #0d1f3c 0%, #162544 100%);
    padding: 2.5rem 0;
    border-top: 1px solid rgba(212, 175, 85, 0.15);
    text-align: center;
}

/* Narrow section container (700px, 800px, 900px variants) */
.section-container-sm {
    max-width: 700px;
    margin: 0 auto;
    padding: 0 1.5rem;
}

.section-container-md {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 1.5rem;
}

.section-container-lg {
    max-width: 900px;
    margin: 0 auto;
    padding: 0 1.5rem;
}

/* Sample CTA description text */
.sample-cta-desc {
    color: rgba(255,255,255,0.6);
    font-size: 0.95rem;
    margin-bottom: 1rem;
}

/* Sample CTA button (gold outline) */
.btn-gold-outline {
    display: inline-block;
    background: rgba(212, 175, 85, 0.12);
    border: 1px solid rgba(212, 175, 85, 0.4);
    color: #d4af55;
    padding: 0.85rem 2rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 1rem;
    text-decoration: none;
    transition: all 0.25s ease;
}

.btn-gold-outline:hover {
    background: rgba(212, 175, 85, 0.2);
    color: #d4af55;
}

/* Comparison section */
.comparison-section {
    background: #0a192f;
    padding: 3rem 0;
    border-top: 1px solid rgba(212, 175, 85, 0.1);
}

.comparison-subtitle {
    text-align: center;
    color: rgba(255,255,255,0.55);
    font-size: 0.85rem;
    margin-bottom: 2rem;
}

.comparison-table-wrapper {
    overflow-x: auto;
}

.comparison-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
    direction: rtl;
}

.comparison-table thead tr {
    border-bottom: 2px solid rgba(212, 175, 85, 0.3);
}

.comparison-table th {
    padding: 0.75rem;
    font-weight: 600;
}

.comparison-table th:first-child {
    text-align: right;
    color: rgba(255,255,255,0.55);
}

.comparison-table th.col-orca {
    text-align: center;
    color: #d4af55;
    font-weight: 700;
}

.comparison-table th.col-other {
    text-align: center;
    color: rgba(255,255,255,0.55);
}

.comparison-table tbody tr {
    border-bottom: 1px solid rgba(255,255,255,0.06);
}

.comparison-table tbody tr:last-child {
    border-bottom: none;
}

.comparison-table td {
    padding: 0.75rem;
}

.comparison-table td:first-child {
    color: rgba(255,255,255,0.75);
}

.comparison-table td.cell-orca {
    text-align: center;
    color: #fff;
    font-weight: 600;
}

.comparison-table td.cell-other {
    text-align: center;
    color: rgba(255,255,255,0.55);
}

.comparison-footnote {
    text-align: center;
    color: rgba(255,255,255,0.4);
    font-size: 0.75rem;
    margin-top: 1rem;
    font-style: italic;
}

/* FAQ / Concerns section */
.concerns-section-styled {
    background: #0d1f3c;
    padding: 3rem 0;
    border-top: 1px solid rgba(255,255,255,0.1);
}

.faq-list {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.faq-card {
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 10px;
    padding: 1.25rem;
}

.faq-card-title {
    color: #d4af55;
    font-size: 1rem;
    margin-bottom: 0.5rem;
}

.faq-card-body {
    color: rgba(255,255,255,0.8);
    font-size: 0.9rem;
    line-height: 1.7;
    margin: 0;
}

/* Section title size override */
.section-title-compact {
    font-size: 1.5rem;
    margin-bottom: 0.5rem;
    color: #fff;
}

.section-title-compact-spaced {
    font-size: 1.5rem;
    margin-bottom: 2rem;
}

/* Footer with watermark positioning */
.footer-watermark {
    position: relative;
    overflow: hidden;
}

.footer-watermark-svg {
    position: absolute;
    bottom: -20px;
    left: 50%;
    transform: translateX(-50%);
    width: 200px;
    height: 130px;
    opacity: 0.03;
    pointer-events: none;
}

/* Footer trust bar - used across multiple pages */
.footer-trust-bar {
    color: rgba(255,255,255,0.5);
    font-size: 0.8rem;
    margin: 1rem 0;
    text-align: center;
}

/* Trust signals full-width strip */
.trust-signals-strip {
    background: #0a192f;
    padding: 1rem 0;
    text-align: center;
    color: rgba(255,255,255,0.5);
    font-size: 0.8rem;
    border-top: 1px solid rgba(255,255,255,0.08);
}

/* PDF preview signature area */
.pdf-signature-area {
    margin-top: 24px;
    padding-top: 16px;
    border-top: 1px solid #e2e8f0;
}

.pdf-signature-text {
    text-align: center;
    font-style: italic;
    color: #666;
}

/* Closing CTA section text */
.closing-cta-desc {
    color: rgba(255,255,255,0.7);
    max-width: 500px;
    margin: 0 auto 1.5rem;
}

.closing-peer-pressure {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--gold, #d4af55);
    max-width: 560px;
    margin: 0 auto 1.5rem;
    line-height: 1.5;
}

/* Inline-block link helper */
.link-inline-block {
    display: inline-block;
}

/* Gold accent letter for ORCA acronym */
.gold-letter {
    color: #d4af55;
}

/* Origin page story link */
.story-inline-link {
    color: var(--origin-gold, #d4af55);
    text-decoration: none;
    border-bottom: 1px solid rgba(212,175,85,0.3);
}

.story-inline-link:hover {
    color: #d4af55;
    border-bottom-color: #d4af55;
}

/* Origin intake CTA margin */
.intake-cta-spaced {
    margin-left: 1rem;
}

/* Footer "more" link in gold */
.footer-more-link {
    color: var(--gold);
}

.footer-more-link:hover {
    color: #d4af55;
}

/* Payment page brand mark */
.brand-mark-icon {
    font-size: 1.5rem;
    margin-left: 0.5rem;
}

.brand-mark-text {
    color: white;
    font-weight: 700;
    font-size: 1.25rem;
}

/* Payment success status color */
.status-processing {
    color: var(--success);
}

/* Wizard footer */
.wizard-footer-bar {
    background: #0a192f;
    padding: 1.5rem;
    text-align: center;
    color: rgba(255,255,255,0.5);
    font-size: 0.8rem;
    border-top: 1px solid rgba(255,255,255,0.08);
}

.wizard-footer-inner {
    max-width: 700px;
    margin: 0 auto;
}

.wizard-footer-line {
    margin-bottom: 0.5rem;
}

/* SOC legal document styles */
.soc-indent {
    padding-right: 2em;
}

.soc-signature-date {
    margin-top: 0.5em;
}

.soc-signature-block {
    margin-top: 3em;
}

.soc-attorney-label {
    font-size: 11pt;
    color: #444;
}

.soc-footer {
    text-align: center;
    padding: 1.5rem;
    background: #0a192f;
    color: rgba(255,255,255,0.5);
    font-size: 0.8rem;
}

.soc-footer-line {
    margin-top: 0.5rem;
}

/* Toolbar helpers */
.toolbar-flex-row {
    display: flex;
    align-items: center;
    gap: 16px;
}

.toolbar-link {
    text-decoration: none;
}

.toolbar-clickable {
    cursor: pointer;
}

/* Sample SOC CTA in HBS */
.sample-soc-cta-btn {
    display: inline-block;
    margin-top: 1rem;
    text-decoration: none;
}
.sample-cta-secondary {
    display: block;
    margin-top: 0.9rem;
    font-size: 0.88rem;
    color: rgba(255,255,255,0.5);
    text-decoration: none;
    transition: color 0.2s;
}
.sample-cta-secondary:hover { color: var(--gold); }

/* Prose margin-top helper */
.mt-prose {
    margin-top: 1.5rem;
}

/* Hidden but taking space (visibility) */
.hidden-visibility {
    visibility: hidden;
}

/* Hidden (display none) - used across wizard, submitted, and other templates */
.hidden {
    display: none !important;
}

/* ==========================================================================
   WIZARD PAGE STYLES
   ========================================================================== */

/* Inter for numbers & English - sharp geometric feel */
.stepper-number,
.step-info,
.form-input[type="number"],
.form-input[type="tel"],
.form-input[type="email"],
.claim-value-input,
.file-info,
.file-size,
code, pre {
    font-family: 'Inter', sans-serif;
    font-feature-settings: 'tnum' 1;
}

.wizard-container {
    max-width: 700px;
    margin: 0 auto;
    padding: calc(60px + var(--space-2xl)) var(--space-lg) var(--space-2xl);
}

.wizard-header {
    text-align: center;
    margin-bottom: var(--space-2xl);
}

.wizard-header h1 {
    color: var(--white);
    font-size: 2rem;
    margin-bottom: var(--space-sm);
}

.wizard-header p {
    color: rgba(255,255,255,0.7);
    font-size: 1rem;
}

/* Stepper */
.wizard-stepper {
    display: flex;
    justify-content: center;
    gap: var(--space-sm);
    margin-bottom: var(--space-2xl);
}

.stepper-item {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
}

.stepper-number {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1.1rem;
    letter-spacing: -0.02em;
    transition: all 0.3s ease;
}

.stepper-item.active .stepper-number {
    background: var(--accent);
    color: var(--navy-deep);
    box-shadow:
        0 0 20px rgba(212, 175, 85, 0.5),
        0 0 40px rgba(212, 175, 85, 0.2);
    animation: pulse-glow 2s ease-in-out infinite;
}

@keyframes pulse-glow {
    0%, 100% { box-shadow: 0 0 20px rgba(212, 175, 85, 0.5), 0 0 40px rgba(212, 175, 85, 0.2); }
    50% { box-shadow: 0 0 25px rgba(212, 175, 85, 0.6), 0 0 50px rgba(212, 175, 85, 0.3); }
}

.stepper-item[data-step="1"].active .stepper-number {
    background: linear-gradient(135deg, #10b981, #059669);
    box-shadow:
        0 0 20px rgba(16, 185, 129, 0.5),
        0 0 40px rgba(5, 150, 105, 0.2);
    animation: pulse-glow-green 2s ease-in-out infinite;
}

@keyframes pulse-glow-green {
    0%, 100% { box-shadow: 0 0 20px rgba(16, 185, 129, 0.5), 0 0 40px rgba(5, 150, 105, 0.2); }
    50% { box-shadow: 0 0 25px rgba(16, 185, 129, 0.6), 0 0 50px rgba(5, 150, 105, 0.3); }
}

.stepper-item[data-step="5"].active .stepper-number {
    background: linear-gradient(135deg, #8b5cf6, #a855f7);
    box-shadow:
        0 0 20px rgba(139, 92, 246, 0.5),
        0 0 40px rgba(168, 85, 247, 0.2);
    animation: pulse-glow-purple 2s ease-in-out infinite;
}

@keyframes pulse-glow-purple {
    0%, 100% { box-shadow: 0 0 20px rgba(139, 92, 246, 0.5), 0 0 40px rgba(168, 85, 247, 0.2); }
    50% { box-shadow: 0 0 25px rgba(139, 92, 246, 0.6), 0 0 50px rgba(168, 85, 247, 0.3); }
}

.stepper-item.completed .stepper-number {
    background: var(--success);
    color: var(--white);
    box-shadow: 0 0 15px rgba(5, 150, 105, 0.4);
}

.stepper-item:not(.active):not(.completed) .stepper-number {
    background: rgba(255,255,255,0.1);
    color: rgba(255,255,255,0.5);
}

.stepper-label {
    font-size: 0.85rem;
    color: rgba(255,255,255,0.6);
    display: none;
}

@media (min-width: 768px) {
    .stepper-label { display: block; }
}

.stepper-line {
    width: 40px;
    height: 2px;
    background: rgba(255,255,255,0.2);
}

.stepper-item.completed + .stepper-line {
    background: var(--success);
}

/* Step Content */
.wizard-content {
    background: rgba(30, 45, 61, 0.8);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: var(--border-radius);
    padding: var(--space-2xl);
    margin-bottom: var(--space-xl);
    min-height: 350px;
    box-shadow:
        0 4px 30px rgba(0, 0, 0, 0.3),
        inset 0 0 60px rgba(212, 175, 85, 0.03);
}

.step { display: none; }
.step.active { display: block; }

.step-title {
    color: var(--white);
    font-size: 1.5rem;
    text-align: center;
    margin-bottom: var(--space-sm);
}

.step-subtitle {
    color: rgba(255,255,255,0.7);
    text-align: center;
    margin-bottom: var(--space-xl);
}

/* Wizard Form Inputs */
.wizard-container .form-group {
    margin-bottom: var(--space-lg);
}

.wizard-container .form-label {
    display: block;
    color: var(--white);
    font-weight: 500;
    margin-bottom: var(--space-sm);
}

.wizard-container .form-label .required {
    color: var(--danger);
}

.wizard-container .form-input,
.wizard-container .form-textarea {
    width: 100%;
    padding: var(--space-md);
    background: rgba(255,255,255,0.05);
    border: 1px solid rgba(255,255,255,0.2);
    border-radius: var(--border-radius);
    color: var(--white);
    font-family: var(--font-primary);
    font-size: 1rem;
    transition: all 0.2s ease;
}

.wizard-container .form-input:focus,
.wizard-container .form-textarea:focus {
    outline: none;
    border-color: rgba(212, 175, 85, 0.6);
    background: rgba(255,255,255,0.08);
    box-shadow:
        0 0 15px rgba(212, 175, 85, 0.15),
        0 0 30px rgba(212, 175, 85, 0.05);
}

.wizard-container .form-textarea {
    min-height: 180px;
    resize: vertical;
    line-height: 1.6;
}

.wizard-container .form-input::placeholder,
.wizard-container .form-textarea::placeholder {
    color: rgba(255,255,255,0.4);
}

.form-row {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-lg);
}

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

/* File Upload */
.upload-zone {
    border: 2px dashed rgba(255,255,255,0.3);
    border-radius: var(--border-radius);
    padding: var(--space-3xl);
    text-align: center;
    cursor: pointer;
    transition: all 0.3s ease;
    background: rgba(255,255,255,0.02);
}

.upload-zone:hover,
.upload-zone.dragover {
    border-color: var(--accent);
    background: rgba(212, 175, 85, 0.1);
}

.upload-zone-icon {
    font-size: 3rem;
    margin-bottom: var(--space-md);
}

.upload-zone h3 {
    color: var(--white);
    font-size: 1.1rem;
    margin-bottom: var(--space-sm);
}

.upload-zone p {
    color: rgba(255,255,255,0.6);
    font-size: 0.9rem;
    margin: 0;
}

.upload-zone .supported-types {
    margin-top: var(--space-md);
    font-size: 0.8rem;
    color: rgba(255,255,255,0.5);
}

.upload-input {
    display: none;
}

.optional-badge {
    display: inline-block;
    background: rgba(217, 119, 6, 0.2);
    color: #fbbf24;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 0.75rem;
    margin-right: var(--space-sm);
}

/* File List */
.file-list {
    margin-top: var(--space-lg);
}

.file-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--space-md);
    background: rgba(255,255,255,0.05);
    border-radius: var(--border-radius);
    margin-bottom: var(--space-sm);
}

.file-info {
    display: flex;
    align-items: center;
    gap: var(--space-md);
}

.file-icon { font-size: 1.5rem; }
.file-name { color: var(--white); font-size: 0.9rem; }
.file-size { color: rgba(255,255,255,0.5); font-size: 0.8rem; }

.file-remove {
    background: rgba(220, 38, 38, 0.2);
    border: none;
    color: var(--danger);
    width: 32px;
    height: 32px;
    border-radius: 50%;
    cursor: pointer;
    font-size: 1.2rem;
    transition: all 0.2s ease;
}

.file-remove:hover {
    background: rgba(220, 38, 38, 0.4);
}

/* Summary Section */
.summary-section {
    margin-bottom: var(--space-xl);
}

.summary-card {
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: var(--border-radius);
    padding: var(--space-lg);
    margin-bottom: var(--space-md);
}

.summary-card h3 {
    color: var(--accent-light);
    font-size: 0.9rem;
    margin-bottom: var(--space-sm);
}

.summary-card p {
    color: var(--white);
    margin: 0;
    line-height: 1.6;
}

.summary-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-md);
}

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

.summary-card-header {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    margin-bottom: var(--space-sm);
}

.summary-card-header h3 { margin: 0; flex: 1; }
.summary-icon { font-size: 1.1rem; }

.summary-badge {
    font-size: 0.7rem;
    padding: 2px 8px;
    background: rgba(212, 175, 85, 0.2);
    border: 1px solid rgba(212, 175, 85, 0.3);
    border-radius: 20px;
    color: var(--accent-light);
}

.summary-card-body {
    padding-right: calc(1.1rem + var(--space-sm));
}

.summary-main { font-weight: 500; margin-bottom: var(--space-xs); }
.summary-secondary { font-size: 0.85rem; color: rgba(255,255,255,0.6) !important; }

.summary-description {
    font-size: 0.9rem;
    line-height: 1.7;
    max-height: 4.5em;
    overflow: hidden;
    text-overflow: ellipsis;
}

.summary-card.wide { grid-column: 1 / -1; }

.summary-card.info {
    background: rgba(212, 175, 85, 0.08);
    border-color: rgba(212, 175, 85, 0.2);
}

.summary-card.info h3 { color: var(--white); }

.next-steps-list {
    margin: 0;
    padding-right: var(--space-lg);
    color: rgba(255,255,255,0.85);
}

.next-steps-list li { margin-bottom: var(--space-xs); line-height: 1.6; }
.next-steps-list li:last-child { margin-bottom: 0; }

/* Terms Checkbox */
.terms-section {
    margin: var(--space-xl) 0;
    padding: var(--space-lg);
    background: rgba(255,255,255,0.03);
    border-radius: var(--border-radius);
}

.terms-checkbox {
    display: flex;
    align-items: flex-start;
    gap: var(--space-md);
    cursor: pointer;
}

.terms-checkbox input[type="checkbox"] {
    width: 22px;
    height: 22px;
    margin-top: 2px;
    accent-color: var(--accent);
    cursor: pointer;
}

.terms-checkbox span {
    color: rgba(255,255,255,0.8);
    font-size: 0.95rem;
    line-height: 1.5;
}

.terms-checkbox a {
    color: var(--accent-light);
    text-decoration: underline;
}

.wizard-disclaimer {
    color: rgba(255, 200, 100, 0.9);
    font-size: 0.9rem;
    margin-bottom: var(--space-md);
    padding: var(--space-sm) var(--space-md);
    background: rgba(255, 200, 100, 0.1);
    border-radius: var(--border-radius-sm);
    border-right: 3px solid rgba(255, 200, 100, 0.5);
}

/* Payment Options */
.payment-options {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
}

.payment-option {
    display: flex;
    align-items: center;
    gap: var(--space-lg);
    padding: var(--space-lg);
    background: rgba(255,255,255,0.03);
    border: 2px solid transparent;
    border-radius: var(--border-radius);
    cursor: pointer;
    transition: all 0.2s ease;
}

.payment-option:hover {
    background: rgba(255,255,255,0.06);
    border-color: rgba(212, 175, 85, 0.3);
}

.payment-option.selected {
    background: rgba(212, 175, 85, 0.1);
    border-color: var(--accent);
}

.payment-icon {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.6rem;
}

.payment-option.free .payment-icon { background: rgba(5, 150, 105, 0.2); }
.payment-option.stripe .payment-icon { background: rgba(37, 99, 235, 0.2); }

.payment-info { flex: 1; }
.payment-info h3 { color: var(--white); margin-bottom: var(--space-xs); font-size: 1.1rem; }
.payment-info p { color: rgba(255,255,255,0.6); font-size: 0.9rem; margin: 0; }

.payment-check {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    border: 2px solid rgba(255,255,255,0.3);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
    font-size: 0.9rem;
}

.payment-option.selected .payment-check {
    background: var(--accent);
    border-color: var(--accent);
    color: var(--navy-deep);
}

.free-badge {
    display: inline-block;
    background: linear-gradient(135deg, #059669, #10b981);
    color: white;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
    margin-right: var(--space-sm);
}

/* Navigation */
.wizard-nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.wizard-nav .step-info {
    color: rgba(255,255,255,0.5);
    font-size: 0.9rem;
}

.wizard-container .btn {
    padding: var(--space-md) var(--space-xl);
    border-radius: var(--border-radius);
    font-weight: 600;
    font-size: 1rem;
    cursor: pointer;
    transition: all 0.2s ease;
    border: none;
    min-width: 130px;
}

.btn-prev {
    background: transparent;
    border: 1px solid rgba(255,255,255,0.3);
    color: var(--white);
}

.btn-prev:hover {
    background: rgba(212, 175, 85, 0.1);
    border-color: rgba(212, 175, 85, 0.5);
    box-shadow: 0 0 15px rgba(212, 175, 85, 0.2);
}

.btn-next {
    background: var(--accent);
    color: var(--navy-deep);
    box-shadow: 0 0 20px rgba(212, 175, 85, 0.3);
    transition: all 0.2s ease;
}

.btn-next:hover {
    background: var(--accent-dark);
    box-shadow: 0 0 30px rgba(212, 175, 85, 0.5);
}

.btn-next:disabled,
.btn-submit:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    box-shadow: none;
}

.btn-submit {
    background: var(--success);
    color: var(--white);
    box-shadow: 0 0 20px rgba(5, 150, 105, 0.3);
    transition: all 0.2s ease;
}

.btn-submit:hover:not(:disabled) {
    background: #047857;
    box-shadow: 0 0 30px rgba(5, 150, 105, 0.5);
}

/* Loading State */
.wizard-container .loading {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-3xl);
}

.wizard-container .spinner {
    width: 48px;
    height: 48px;
    border: 3px solid rgba(255,255,255,0.1);
    border-top-color: var(--accent);
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

.wizard-container .loading p {
    color: rgba(255,255,255,0.7);
    margin-top: var(--space-lg);
}

/* Error Alert */
.wizard-container .alert {
    padding: var(--space-md) var(--space-lg);
    border-radius: var(--border-radius);
    margin-bottom: var(--space-lg);
    display: flex;
    align-items: center;
    gap: var(--space-md);
}

.alert-error {
    background: rgba(220, 38, 38, 0.15);
    border: 1px solid rgba(220, 38, 38, 0.3);
    color: #fca5a5;
}

.alert-icon { font-size: 1.25rem; }

/* Success / Results Page */
.success-message {
    text-align: center;
    padding: var(--space-xl);
    max-width: 600px;
    margin: 0 auto;
}

.success-header { margin-bottom: var(--space-xl); }
.success-icon { font-size: 4rem; margin-bottom: var(--space-md); }
.success-title { color: var(--success) !important; margin-bottom: var(--space-sm) !important; }

/* Status Card */
.status-card {
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: var(--border-radius);
    padding: var(--space-lg);
    margin-bottom: var(--space-lg);
}

.status-header { margin-bottom: var(--space-md); }
.status-indicator { font-size: 1.2rem; font-weight: 600; color: var(--accent-light); }
.status-message { color: rgba(255,255,255,0.7); font-size: 0.95rem; margin-bottom: var(--space-lg); }

/* Pipeline Steps */
.pipeline-steps {
    display: flex;
    justify-content: space-between;
    gap: var(--space-sm);
}

.pipeline-step {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-xs);
    padding: var(--space-sm);
    border-radius: var(--border-radius-sm);
    background: rgba(255,255,255,0.02);
    opacity: 0.5;
    transition: all 0.3s ease;
}

.pipeline-step.active { opacity: 1; background: rgba(212, 175, 85, 0.15); }
.pipeline-step.completed { opacity: 1; background: rgba(5, 150, 105, 0.15); }
.pipeline-step .step-icon { font-size: 1.3rem; }
.pipeline-step .step-label { font-size: 0.75rem; color: rgba(255,255,255,0.7); text-align: center; }
.pipeline-step.active .step-label { color: var(--accent-light); }
.pipeline-step.completed .step-label { color: var(--success); }

/* Case ID Card */
.case-id-card {
    background: rgba(255,255,255,0.05);
    padding: var(--space-md) var(--space-lg);
    border-radius: var(--border-radius);
    margin-bottom: var(--space-lg);
}

.case-id-label { color: rgba(255,255,255,0.6); font-size: 0.85rem; margin-bottom: var(--space-xs); }
.case-id-value { color: var(--accent); font-family: 'Inter', monospace; font-size: 0.9rem; margin: 0; }

/* Download Section */
.download-section {
    background: linear-gradient(135deg, rgba(5, 150, 105, 0.15), rgba(212, 175, 85, 0.1));
    border: 2px solid var(--success);
    border-radius: var(--border-radius);
    padding: var(--space-lg);
    margin-bottom: var(--space-lg);
    text-align: center;
    animation: fadeInUp 0.5s ease;
}

@keyframes fadeInUp {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

.download-section h3 { color: var(--success); margin-bottom: var(--space-md); font-size: 1.2rem; }

.email-delivery-notice {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-sm);
    padding: var(--space-md) 0;
}

.email-delivery-icon {
    font-size: 2.5rem;
    line-height: 1;
}

.email-delivery-notice p {
    color: rgba(255,255,255,0.85);
    font-size: 1rem;
    line-height: 1.6;
    text-align: center;
    margin: 0;
    max-width: 480px;
}

.download-buttons {
    display: flex;
    gap: var(--space-md);
    justify-content: center;
    flex-wrap: wrap;
    margin-bottom: var(--space-md);
}

.btn-download {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    padding: var(--space-md) var(--space-lg);
    border-radius: var(--border-radius);
    text-decoration: none;
    font-weight: 600;
    transition: all 0.2s ease;
}

.btn-download.btn-primary { background: var(--success); color: white; }
.btn-download.btn-primary:hover { background: #059669; transform: translateY(-2px); }
.btn-download.btn-secondary { background: var(--accent); color: var(--navy-deep); }
.btn-download.btn-secondary:hover { background: var(--accent-hover); transform: translateY(-2px); }
.btn-download.btn-outline { background: transparent; border: 2px solid rgba(255,255,255,0.3); color: var(--white); }
.btn-download.btn-outline:hover { border-color: var(--accent); background: rgba(212, 175, 85, 0.1); }

.download-icon { font-size: 1.2rem; }
.download-note { color: rgba(255,255,255,0.7); font-size: 0.85rem; margin: 0; }

/* Download Confirmation Modal */
.download-modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    animation: modalFadeIn 0.2s ease;
}

.download-modal-overlay.hidden {
    display: none !important;
}

@keyframes modalFadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

.download-modal {
    background: var(--dark);
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: var(--border-radius);
    padding: var(--space-xl);
    max-width: 480px;
    width: 90%;
    text-align: center;
}

.download-modal-icon { font-size: 2.5rem; margin-bottom: var(--space-md); }
.download-modal-title { color: var(--white); margin-bottom: var(--space-sm); }
.download-modal-message { color: rgba(255,255,255,0.7); font-size: 0.9rem; margin-bottom: var(--space-md); }

.download-modal-warning {
    background: rgba(245, 158, 11, 0.15);
    border: 1px solid rgba(245, 158, 11, 0.4);
    border-radius: 8px;
    padding: var(--space-md);
    margin-bottom: var(--space-lg);
    color: #fbbf24;
    font-size: 0.85rem;
    text-align: right;
    direction: rtl;
}

.download-modal-warning.structural {
    background: rgba(239, 68, 68, 0.15);
    border-color: rgba(239, 68, 68, 0.4);
    color: #f87171;
}

.download-modal-actions {
    display: flex;
    gap: var(--space-md);
    justify-content: center;
}

/* What's Next Card */
.whats-next-card {
    background: rgba(212, 175, 85, 0.08);
    border: 1px solid rgba(212, 175, 85, 0.2);
    border-radius: var(--border-radius);
    padding: var(--space-lg);
    margin-bottom: var(--space-xl);
    text-align: right;
}

.whats-next-card h3 { color: var(--white); margin-bottom: var(--space-md); }

.whats-next-list {
    margin: 0;
    padding-right: var(--space-lg);
    color: rgba(255,255,255,0.85);
}

.whats-next-list li { margin-bottom: var(--space-sm); line-height: 1.6; }
.whats-next-list li:last-child { margin-bottom: 0; }

/* Success Actions */
.success-actions { margin-top: var(--space-lg); }
.success-actions .btn-primary {
    background: var(--accent);
    color: var(--navy-deep);
    padding: var(--space-md) var(--space-xl);
    text-decoration: none;
    border-radius: var(--border-radius);
    display: inline-block;
}

.success-actions .btn-primary:hover { background: var(--accent-hover); }

@media (max-width: 500px) {
    .pipeline-steps { flex-wrap: wrap; }
    .pipeline-step { flex-basis: 45%; }
}

/* Form Validation Feedback */
.form-group.error .form-input,
.form-group.error .form-textarea {
    border-color: var(--danger);
    background: rgba(220, 38, 38, 0.05);
}

.form-group.error .form-input:focus,
.form-group.error .form-textarea:focus {
    border-color: var(--danger);
    box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.15);
}

.form-error {
    display: none;
    color: #fca5a5;
    font-size: 0.85rem;
    margin-top: var(--space-xs);
    padding-right: var(--space-sm);
}

.form-group.error .form-error { display: block; }

.form-group.success .form-input,
.form-group.success .form-textarea {
    border-color: var(--success);
}

/* Intake Mode Toggle */
.intake-mode-toggle {
    display: flex;
    justify-content: center;
    gap: var(--space-sm);
    margin-bottom: var(--space-xl);
    flex-wrap: wrap;
}

.intake-mode-btn {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    padding: var(--space-md) var(--space-lg);
    background: rgba(255,255,255,0.05);
    border: 2px solid rgba(255,255,255,0.15);
    border-radius: var(--border-radius);
    color: rgba(255,255,255,0.7);
    font-family: var(--font-primary);
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
}

.intake-mode-btn:hover {
    background: rgba(212, 175, 85, 0.08);
    border-color: rgba(212, 175, 85, 0.4);
    color: var(--white);
    box-shadow: 0 0 20px rgba(212, 175, 85, 0.15);
}

.intake-mode-btn.active {
    background: rgba(212, 175, 85, 0.15);
    border: 1px solid rgba(212, 175, 85, 0.5);
    color: var(--white);
    box-shadow:
        0 0 20px rgba(212, 175, 85, 0.25),
        0 0 40px rgba(212, 175, 85, 0.1),
        inset 0 0 20px rgba(212, 175, 85, 0.05);
}

.intake-mode-btn .mode-icon { font-size: 1.1rem; }

.intake-mode-divider {
    display: flex;
    align-items: center;
    color: rgba(255,255,255,0.35);
    font-size: 0.8rem;
    padding: 0 var(--space-xs);
}

.intake-mode-secondary {
    padding: var(--space-sm) var(--space-md);
    font-size: 0.8rem;
    font-weight: 400;
    border-width: 1px;
    color: rgba(255,255,255,0.45);
    background: transparent;
}

.intake-mode-secondary:hover {
    color: rgba(255,255,255,0.75);
}

.intake-section { animation: fadeIn 0.2s ease; }

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Intake File Upload */
.intake-file-upload { max-width: 100%; }
#intake-upload-zone { min-height: 200px; }

.intake-file-preview {
    margin-top: var(--space-lg);
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: var(--border-radius);
    overflow: hidden;
}

.preview-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-md) var(--space-lg);
    background: rgba(212, 175, 85, 0.1);
    border-bottom: 1px solid rgba(255,255,255,0.1);
}

.preview-filename { color: var(--accent-light); font-weight: 500; }

.preview-remove {
    background: rgba(220, 38, 38, 0.2);
    border: none;
    color: var(--danger);
    padding: var(--space-xs) var(--space-md);
    border-radius: var(--border-radius);
    cursor: pointer;
    font-family: var(--font-primary);
    font-size: 0.85rem;
    transition: all 0.2s ease;
}

.preview-remove:hover { background: rgba(220, 38, 38, 0.4); }

.wizard-container .preview-content {
    max-height: 250px;
    overflow-y: auto;
    padding: var(--space-lg);
}

.wizard-container .preview-content pre {
    color: rgba(255,255,255,0.8);
    font-family: monospace;
    font-size: 0.85rem;
    white-space: pre-wrap;
    word-wrap: break-word;
    margin: 0;
    direction: ltr;
    text-align: left;
}

.intake-file-error {
    margin-top: var(--space-lg);
    padding: var(--space-md) var(--space-lg);
    background: rgba(220, 38, 38, 0.15);
    border: 1px solid rgba(220, 38, 38, 0.3);
    border-radius: var(--border-radius);
    color: #fca5a5;
    display: flex;
    align-items: center;
    gap: var(--space-md);
}

.intake-file-error .error-icon { font-size: 1.25rem; }

/* Example Banner */
.example-banner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-md);
    padding: var(--space-md) var(--space-lg);
    margin-bottom: var(--space-xl);
    background: rgba(212, 175, 85, 0.08);
    border: 1px solid rgba(212, 175, 85, 0.25);
    border-radius: var(--border-radius);
}

.example-banner.loaded {
    background: rgba(5, 150, 105, 0.08);
    border-color: rgba(5, 150, 105, 0.3);
}

.example-banner-text {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    color: rgba(255,255,255,0.85);
    font-size: 0.9rem;
    line-height: 1.5;
}

.example-banner-icon { font-size: 1.2rem; flex-shrink: 0; }

.example-banner-btn {
    flex-shrink: 0;
    padding: var(--space-sm) var(--space-lg);
    background: linear-gradient(135deg, #d4af55, #c4a04a);
    color: #0a192f;
    border: none;
    border-radius: var(--border-radius);
    font-family: var(--font-primary);
    font-weight: 600;
    font-size: 0.85rem;
    cursor: pointer;
    transition: all 0.2s ease;
}

.example-banner-btn:hover {
    background: linear-gradient(135deg, #e0bf65, #d4af55);
    box-shadow: 0 0 15px rgba(212, 175, 85, 0.3);
}

.example-banner-btn.clear {
    background: rgba(220, 38, 38, 0.15);
    color: #fca5a5;
    border: 1px solid rgba(220, 38, 38, 0.3);
}

.example-banner-btn.clear:hover { background: rgba(220, 38, 38, 0.25); }

.example-banner-link {
    flex-shrink: 0;
    color: #d4af55;
    font-size: 0.8rem;
    font-weight: 500;
    text-decoration: none;
    padding: var(--space-xs) var(--space-sm);
    border: 1px solid rgba(212, 175, 85, 0.3);
    border-radius: var(--radius);
    transition: all 0.2s ease;
    white-space: nowrap;
}

.example-banner-link:hover {
    background: rgba(212, 175, 85, 0.1);
    border-color: rgba(212, 175, 85, 0.5);
}

@media (max-width: 600px) {
    .example-banner { flex-direction: column; text-align: center; }
}

/* Napkin Preview - Step 3 */
.napkin-loading {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-2xl) 0;
    color: rgba(255,255,255,0.7);
}

.napkin-loading .spinner {
    width: 40px;
    height: 40px;
    border: 3px solid rgba(255,255,255,0.1);
    border-top-color: var(--gold);
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
    margin-bottom: var(--space-md);
}

.napkin-preview-card,
.napkin-fallback-card {
    background: var(--navy-light);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: var(--space-lg);
}

.napkin-section { margin-bottom: var(--space-lg); }
.napkin-section:last-child { margin-bottom: 0; }

.napkin-section-title {
    color: var(--gold);
    font-size: 0.95rem;
    font-weight: 600;
    margin-bottom: var(--space-sm);
}

.napkin-party-row {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    margin-bottom: var(--space-xs);
}

.napkin-party-row .form-input { flex: 1; }

.napkin-remove-btn {
    background: none;
    border: 1px solid rgba(239, 68, 68, 0.3);
    color: #ef4444;
    width: 32px;
    height: 32px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 1.2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
}

.napkin-remove-btn:hover { background: rgba(239, 68, 68, 0.1); border-color: #ef4444; }
.napkin-remove-btn:focus { outline: 2px solid var(--gold); outline-offset: 2px; }

.napkin-add-btn { margin-top: var(--space-sm); font-size: 0.85rem; padding: 6px 16px; }

.napkin-fact-row {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    margin-bottom: var(--space-xs);
}

.napkin-fact-num {
    color: rgba(255,255,255,0.4);
    font-family: 'Inter', sans-serif;
    font-size: 0.75rem;
    min-width: 28px;
    text-align: center;
}

.napkin-fact-row .form-input { flex: 1; font-size: 0.9rem; }

.napkin-fallback-note {
    color: rgba(255,255,255,0.7);
    margin-bottom: var(--space-md);
    font-size: 0.9rem;
}

/* ==========================================================================
   BETA EXPLANATION (Pricing Page)
   ========================================================================== */
.beta-explain {
    max-width: var(--prose-max);
    margin: var(--space-xl) auto var(--space-2xl);
    text-align: right;
    color: rgba(255,255,255,0.8);
    font-size: 1rem;
    line-height: 1.7;
}

.beta-explain p {
    margin-bottom: var(--space-md);
}

.beta-price-callout {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--gold, #d4af55);
    margin-top: var(--space-lg);
}

.beta-price-note {
    font-size: 0.95rem;
    color: rgba(255,255,255,0.65);
    font-style: italic;
}

.beta-deliverables-title {
    font-weight: 600;
    color: var(--white);
    margin-top: var(--space-lg);
    margin-bottom: var(--space-sm);
}

.beta-deliverables-list {
    list-style: none;
    padding: 0;
    margin: 0 0 var(--space-lg) 0;
}

.beta-deliverables-list li {
    padding: var(--space-sm) 0;
    padding-right: 1.5em;
    position: relative;
    color: rgba(255,255,255,0.85);
}

.beta-deliverables-list li::before {
    content: "✓";
    position: absolute;
    right: 0;
    color: var(--success, #10b981);
    font-weight: 700;
}

.beta-disclaimer {
    font-size: 0.9rem;
    color: rgba(255,255,255,0.55);
    border-top: 1px solid rgba(255,255,255,0.1);
    padding-top: var(--space-md);
    margin-top: var(--space-lg);
}

/* Cost Comparison Box (Pricing Page) */
.cost-compare-box {
    max-width: var(--prose-max);
    margin: var(--space-2xl) auto var(--space-xl);
}

.cost-compare-title {
    text-align: center;
    font-size: 1.15rem;
    color: var(--gold, #d4af55);
    margin-bottom: var(--space-lg);
    font-weight: 600;
}

.cost-compare-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-md);
}

.cost-compare-card {
    padding: var(--space-lg);
    border-radius: 12px;
    text-align: center;
}

.cost-compare-manual {
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.08);
}

.cost-compare-orca {
    background: rgba(212,175,85,0.08);
    border: 1px solid rgba(212,175,85,0.25);
}

.cost-compare-label {
    font-size: 0.85rem;
    letter-spacing: 0.05em;
    color: rgba(255,255,255,0.55);
    margin-bottom: var(--space-sm);
}

.cost-compare-time {
    font-size: 0.95rem;
    color: rgba(255,255,255,0.75);
    margin-bottom: var(--space-sm);
}

.cost-compare-cost {
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: var(--space-xs, 4px);
}

.cost-compare-manual .cost-compare-cost {
    color: rgba(255,255,255,0.6);
}

.cost-compare-orca .cost-compare-cost {
    color: var(--gold, #d4af55);
}

.cost-compare-note {
    font-size: 0.8rem;
    color: rgba(255,255,255,0.5);
}

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

/* ==========================================================================
   GPT vs ORCA - Side-by-Side Comparison (Homepage)
   ========================================================================== */
.gpt-vs-orca {
    padding: var(--space-3xl) 0;
    background: var(--navy-mid, #0d1f3c);
}

.gpt-vs-orca .section-overline {
    text-align: center;
    font-size: 0.8rem;
    letter-spacing: 0.1em;
    color: var(--gold, #d4af55);
    margin-bottom: var(--space-sm);
}

.vs-intro {
    text-align: center;
    color: rgba(255,255,255,0.65);
    max-width: 600px;
    margin: 0 auto var(--space-2xl);
    font-size: 0.95rem;
}

.vs-grid {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: var(--space-lg);
    align-items: start;
    max-width: 960px;
    margin: 0 auto;
}

.vs-card {
    border-radius: 12px;
    padding: var(--space-lg);
    border: 1px solid rgba(255,255,255,0.08);
    background: rgba(255,255,255,0.03);
}

.vs-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--space-md);
    gap: var(--space-sm);
}

.vs-label {
    font-family: 'Inter', sans-serif;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    padding: 4px 10px;
    border-radius: 4px;
}

.vs-label-gpt {
    background: rgba(239, 68, 68, 0.15);
    color: #f87171;
}

.vs-label-orca {
    background: rgba(212, 175, 85, 0.15);
    color: var(--gold, #d4af55);
}

.vs-verdict {
    font-size: 0.8rem;
    color: rgba(255,255,255,0.5);
    font-style: italic;
}

.vs-verdict-gpt { color: rgba(248, 113, 113, 0.7); }
.vs-verdict-orca { color: rgba(212, 175, 85, 0.7); }

.vs-content {
    margin-bottom: var(--space-md);
    padding: var(--space-md);
    border-radius: 8px;
    font-size: 0.88rem;
    line-height: 1.7;
    color: rgba(255,255,255,0.75);
}

.vs-gpt .vs-content {
    background: rgba(239, 68, 68, 0.05);
    border-inline-start: 3px solid rgba(239, 68, 68, 0.3);
}

.vs-orca .vs-content {
    background: rgba(212, 175, 85, 0.05);
    border-inline-start: 3px solid rgba(212, 175, 85, 0.3);
}

.vs-excerpt { margin: 0; }

.vs-issues, .vs-strengths {
    list-style: none;
    padding: 0;
    margin: 0;
    font-size: 0.82rem;
}

.vs-issues li, .vs-strengths li {
    padding-block: 6px;
    padding-inline-start: 20px;
    padding-inline-end: 0;
    position: relative;
    color: rgba(255,255,255,0.6);
}

.vs-issues li::before {
    content: "\2717";
    position: absolute;
    inset-inline-start: 0;
    color: #f87171;
    font-weight: 700;
}

.vs-strengths li::before {
    content: "\2713";
    position: absolute;
    inset-inline-start: 0;
    color: var(--gold, #d4af55);
    font-weight: 700;
}

.vs-divider {
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Inter', sans-serif;
    font-size: 0.85rem;
    font-weight: 600;
    color: rgba(255,255,255,0.3);
    letter-spacing: 0.1em;
}

.vs-bottom-line {
    text-align: center;
    color: rgba(255,255,255,0.7);
    margin-top: var(--space-2xl);
    font-size: 0.95rem;
    font-weight: 500;
}

.vs-arch-note {
    text-align: center;
    color: rgba(255,255,255,0.55);
    margin-top: var(--space-lg);
    font-size: 0.88rem;
    line-height: 1.6;
    max-width: 580px;
    margin-inline: auto;
}

.vs-car-metaphor {
    text-align: center;
    color: rgba(255,255,255,0.75);
    margin-top: var(--space-xl);
    font-size: 1rem;
    line-height: 1.7;
    max-width: 600px;
    margin-inline: auto;
    font-style: italic;
    border-inline-start: 3px solid var(--gold, #d4af55);
    padding-inline-start: 1rem;
}

.vs-sample-link {
    display: block;
    text-align: center;
    margin-top: var(--space-md);
    color: var(--gold, #d4af55);
    font-size: 0.9rem;
    text-decoration: none;
    transition: opacity 0.2s;
}

.vs-sample-link:hover {
    opacity: 0.8;
    text-decoration: underline;
}

@media (max-width: 768px) {
    .vs-grid {
        grid-template-columns: 1fr;
        gap: var(--space-md);
    }
    .vs-divider {
        padding: var(--space-sm) 0;
    }
}

/* ── Bridge Line (between GPT vs ORCA and How It Works) ── */
.bridge-line-section {
    padding: var(--space-lg, 2rem) 0;
    background: var(--navy-mid, #0d1f3c);
    border-top: 1px solid rgba(212,175,85,0.15);
    border-bottom: 1px solid rgba(212,175,85,0.15);
}

.bridge-line {
    max-width: var(--prose-max);
    margin: 0 auto;
    text-align: center;
    font-size: 1.15rem;
    font-weight: 500;
    color: rgba(255,255,255,0.85);
    line-height: 1.6;
    font-style: italic;
}

/* ── About Pre-Pull (before the pull quote) ── */
.orca-about-pre-pull {
    max-width: 640px;
    margin: var(--space-lg, 2rem) auto var(--space-sm, 0.75rem);
    font-size: 1rem;
    color: rgba(255,255,255,0.7);
    line-height: 1.6;
    font-style: italic;
}

/* ── Domains Knowledge paragraph ── */
.domains-knowledge {
    max-width: var(--prose-max);
    margin: var(--space-md, 1.25rem) auto var(--space-xl, 2.5rem);
    text-align: center;
    font-size: 0.95rem;
    color: rgba(255,255,255,0.65);
    line-height: 1.7;
}

/* ── Hero H1 - full sentence form (index page) ── */
/* Overrides the 3.5rem brand-mark rule in shared.css */
.hero .hero-content h1 {
    font-size: 1.85rem;
    line-height: 1.4;
    max-width: var(--prose-max);
    margin-left: auto;
    margin-right: auto;
    font-weight: 700;
}

@media (max-width: 768px) {
    .hero .hero-content h1 {
        font-size: 1.35rem;
    }
}

/* ═══════════════════════════════════════════════════════════════
   PODCAST-DERIVED SECTIONS (Mar 2026)
   ═══════════════════════════════════════════════════════════════ */

/* Section: The Problem (X-ray analogy) */
.section-problem {
  padding: 5rem 2rem;
  background: var(--navy);
  color: #fff;
}

.section-problem .problem-content {
  max-width: 760px;
  margin: 0 auto;
  text-align: center;
}

.section-problem h2 {
  font-size: 1.85rem;
  margin-bottom: 2rem;
  line-height: 1.5;
  color: #fff;
}

.section-problem .problem-lead {
  font-size: 1.1rem;
  line-height: 1.8;
  color: rgba(255,255,255,0.85);
  margin-bottom: 1.5rem;
}

.section-problem .problem-body {
  font-size: 1.05rem;
  line-height: 1.8;
  color: rgba(255,255,255,0.65);
  margin-bottom: 1.5rem;
}

.section-problem .problem-conclusion {
  font-size: 1.15rem;
  font-weight: 600;
  line-height: 1.7;
  color: #fff;
  border-top: 1px solid rgba(255,255,255,0.15);
  padding-top: 1.5rem;
}

/* Section: Why Different (two cards) */
.section-why-different {
  padding: 4rem 2rem;
  background: #f0f4f8;
}

.section-why-different .why-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2.5rem;
  max-width: 900px;
  margin: 0 auto;
}

.section-why-different .why-card {
  padding: 2rem;
  border-radius: 12px;
  background: #fff;
  border: 1px solid #e2e8f0;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.section-why-different .why-card:hover {
  border-color: var(--accent);
  box-shadow: 0 4px 12px rgba(212,175,85,0.1);
}

.section-why-different .why-card h3 {
  font-size: 1.2rem;
  color: var(--navy);
  margin-bottom: 0.75rem;
}

.section-why-different .why-card p {
  font-size: 0.95rem;
  color: #64748b;
  line-height: 1.8;
}

/* Section: What You See (status badges) */
.section-what-you-see {
  padding: 4rem 2rem;
  background: #f0f4f8;
}

.section-what-you-see .what-you-see-content {
  max-width: 720px;
  margin: 0 auto;
  text-align: center;
}

.section-what-you-see h2 {
  font-size: 1.6rem;
  margin-bottom: 1rem;
  line-height: 1.5;
  color: var(--navy);
}

.section-what-you-see .section-subtitle {
  font-size: 1rem;
  color: #64748b;
  line-height: 1.7;
  margin-bottom: 2.5rem;
}

.section-what-you-see .status-demo {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  margin-bottom: 1.5rem;
}

.section-what-you-see .status-row {
  display: flex;
  align-items: center;
  gap: 1.25rem;
  padding: 1rem 1.5rem;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.06);
  text-align: start;
}

.status-badge-lg {
  display: inline-block;
  padding: 0.4rem 1rem;
  border-radius: 6px;
  font-weight: 600;
  font-size: 0.9rem;
  white-space: nowrap;
  min-width: 65px;
  text-align: center;
}

.status-badge-lg.status-ready {
  background: rgba(5, 150, 105, 0.12);
  color: #059669;
}
.status-badge-lg.status-ready::before { content: "\2713 "; }

.status-badge-lg.status-draft {
  background: rgba(217, 119, 6, 0.12);
  color: #d97706;
}
.status-badge-lg.status-draft::before { content: "\270E "; }

.status-badge-lg.status-failed {
  background: rgba(220, 38, 38, 0.12);
  color: #dc2626;
}
.status-badge-lg.status-failed::before { content: "\2717 "; }

.section-what-you-see .status-desc {
  font-size: 0.95rem;
  color: #1e293b;
  line-height: 1.5;
}

.section-what-you-see .what-you-see-footnote {
  font-size: 0.9rem;
  color: #64748b;
  font-style: italic;
}

/* Section: Gates Detail (What 65 Checks Means) */
.section-gates-detail {
  padding: 4rem 2rem;
  background: var(--navy-mid, #0d1f3c);
}
.section-gates-detail .gates-intro {
  color: rgba(255,255,255,0.75);
  max-width: 700px;
  margin: 0 auto 2rem;
  text-align: center;
  line-height: 1.7;
}
.section-gates-detail .gates-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem 2rem;
  max-width: 800px;
  margin: 0 auto 2rem;
}
.section-gates-detail .gate-check {
  display: flex;
  align-items: flex-start;
  gap: 0.7rem;
  color: rgba(255,255,255,0.85);
  font-size: 0.95rem;
  line-height: 1.5;
}
.section-gates-detail .gate-icon {
  color: var(--gold, #d4af55);
  font-weight: 700;
  flex-shrink: 0;
  margin-top: 0.1rem;
}
.section-gates-detail .gates-footnote {
  text-align: center;
  color: var(--gold, #d4af55);
  font-weight: 600;
  font-size: 0.95rem;
  max-width: 600px;
  margin: 0 auto;
}

/* Section: Compare Grid (Generic AI vs ORCA) */
.section-compare-grid {
  padding: 4rem 2rem;
  background: var(--navy-mid, #0d1f3c);
}
.section-compare-grid .compare-table {
  max-width: 850px;
  margin: 2rem auto 0;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,0.1);
}
.section-compare-grid .compare-header {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  background: rgba(255,255,255,0.05);
  font-weight: 700;
  font-size: 0.9rem;
}
.section-compare-grid .compare-row {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  border-top: 1px solid rgba(255,255,255,0.06);
}
.section-compare-grid .compare-label-col {
  padding: 0.9rem 1.2rem;
  color: rgba(255,255,255,0.9);
  font-weight: 600;
  font-size: 0.9rem;
}
.section-compare-grid .compare-col {
  padding: 0.9rem 1.2rem;
  font-size: 0.88rem;
  line-height: 1.5;
}
.section-compare-grid .compare-generic {
  color: rgba(255,255,255,0.5);
  background: rgba(239,68,68,0.04);
}
.section-compare-grid .compare-orca {
  color: rgba(255,255,255,0.9);
  background: rgba(212,175,85,0.06);
}
.section-compare-grid .compare-header .compare-generic {
  color: rgba(255,255,255,0.6);
  text-align: center;
}
.section-compare-grid .compare-header .compare-orca {
  color: var(--gold, #d4af55);
  text-align: center;
}

/* Section: Pull Quote Banner */
.section-quote-banner {
  padding: 3.5rem 2rem;
  background: var(--navy);
  text-align: center;
}

.section-quote-banner .orca-quote {
  font-size: 1.3rem;
  font-weight: 500;
  color: #fff;
  line-height: 1.7;
  max-width: 700px;
  margin: 0 auto;
  font-style: italic;
  transition: opacity 0.4s ease;
  will-change: opacity;
  border: none;
  padding: 0;
}

/* Responsive: podcast sections */
@media (max-width: 768px) {
  .section-problem h2 { font-size: 1.4rem; }
  .section-problem .problem-lead,
  .section-problem .problem-body { font-size: 0.95rem; }
  .section-problem .problem-conclusion { font-size: 1rem; }

  .section-why-different .why-grid {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }

  .section-what-you-see h2 { font-size: 1.3rem; }
  .section-what-you-see .status-row {
    flex-direction: column;
    text-align: center;
    gap: 0.5rem;
  }

  .section-quote-banner .orca-quote { font-size: 1.1rem; }

  .section-gates-detail .gates-grid {
    grid-template-columns: 1fr;
    gap: 0.8rem;
  }

  .section-compare-grid .compare-table {
    font-size: 0.8rem;
  }
  .section-compare-grid .compare-header,
  .section-compare-grid .compare-row {
    grid-template-columns: 0.8fr 1fr 1fr;
  }
  .section-compare-grid .compare-label-col,
  .section-compare-grid .compare-col {
    padding: 0.6rem 0.7rem;
    font-size: 0.8rem;
  }
}

/* ==========================================================================
   Accessibility: Skip Link
   ========================================================================== */
.skip-link {
  position: absolute;
  top: -100%;
  inset-inline-start: 0;
  z-index: 10000;
  padding: 0.75rem 1.5rem;
  background: var(--gold);
  color: var(--navy-deep);
  font-weight: 600;
  font-size: 0.9rem;
  text-decoration: none;
  border-start-end-radius: 8px;
  border-end-end-radius: 8px;
}
.skip-link:focus-visible {
  top: 0;
}

/* ==========================================================================
   Accessibility: Global Focus Visible
   ========================================================================== */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid var(--gold, #d4af55);
  outline-offset: 3px;
}

/* ==========================================================================
   Accessibility: Reduced Motion
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  .reveal {
    opacity: 1 !important;
    transform: none !important;
  }
}

/* ==========================================================================
   Founder Card
   ========================================================================== */
.founder-card {
  display: flex;
  align-items: center;
  gap: 1.25rem;
  margin: 2rem auto;
  max-width: var(--prose-max);
  padding: 1.5rem;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 12px;
}
.founder-avatar {
  flex-shrink: 0;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  overflow: hidden;
}
.founder-info {
  flex: 1;
  min-width: 0;
}
.founder-name {
  font-family: 'Heebo', sans-serif;
  font-weight: 700;
  font-size: 1.05rem;
  color: var(--text-primary, #fff);
}
.founder-role {
  font-size: 0.85rem;
  color: var(--gold, #d4af55);
  margin-bottom: 0.5rem;
}
.founder-bio {
  font-size: 0.9rem;
  line-height: 1.6;
  color: var(--text-body, rgba(255,255,255,0.75));
  margin: 0;
}
@media (max-width: 600px) {
  .founder-card {
    flex-direction: column;
    text-align: center;
  }
}

/* ==========================================================================
   Security Page
   ========================================================================== */
.security-hero {
  padding: calc(60px + 4rem) 0 3rem;
  text-align: center;
}
.security-title {
  font-family: 'Heebo', sans-serif;
  font-weight: 700;
  font-size: 2rem;
  color: var(--text-primary, #fff);
  margin-bottom: 0.75rem;
}
.security-subtitle {
  font-size: 1.05rem;
  color: var(--text-body, rgba(255,255,255,0.75));
  max-width: 600px;
  margin: 0 auto;
}
.security-content {
  padding-bottom: 4rem;
}
.security-content .section-container {
  max-width: 780px;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}
.security-card {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 12px;
  padding: 1.5rem 2rem;
}
.security-card h2 {
  font-family: 'Heebo', sans-serif;
  font-weight: 600;
  font-size: 1.1rem;
  color: var(--gold, #d4af55);
  margin: 0 0 0.5rem;
}
.security-card p {
  font-size: 0.95rem;
  line-height: 1.7;
  color: var(--text-body, rgba(255,255,255,0.75));
  margin: 0;
}
.security-contact {
  text-align: center;
  padding: 2rem 0 0;
  font-size: 1rem;
  color: var(--text-body, rgba(255,255,255,0.75));
}
.security-contact a {
  color: var(--gold, #d4af55);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* ============================================================
   Homepage Phase 2 - new section styles
   ============================================================ */

/* Section heading colour fix - sections without .section or .section-dark
   class get the global h2 default (var(--navy) = dark). Override to white
   for all dark-background homepage sections. */
.gpt-vs-orca h2,
.not-for-section h2,
.closing-cta-section h2 {
  color: #fff;
}

/* Hero ICP one-liner */
.hero-icp-line {
  font-size: 0.9rem;
  color: rgba(255,255,255,0.55);
  margin: 0.5rem 0 1.5rem;
  letter-spacing: 0.2px;
}

/* Problem / Solution section */
.section-problem {
  background: #0a192f;
  padding: 3rem 0 2.5rem;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.problem-content {
  max-width: var(--prose-max);
  margin: 0 auto;
  padding: 0 1.5rem;
}
.problem-p1 {
  font-size: 1.15rem;
  color: rgba(255,255,255,0.9);
  font-weight: 600;
  margin-bottom: 1.25rem;
  line-height: 1.65;
}
.problem-p2, .problem-p3 {
  font-size: 1rem;
  color: rgba(255,255,255,0.75);
  line-height: 1.75;
  margin-bottom: 1.1rem;
}
.problem-p4 {
  font-size: 1rem;
  color: rgba(255,255,255,0.65);
  line-height: 1.7;
  font-style: italic;
  margin-bottom: 0;
}

/* ==========================================================================
   Hero - Orphaned classes (beta-badge, tagline, trust row, secondary CTA)
   ========================================================================== */
.beta-badge {
  display: inline-block;
  background: linear-gradient(135deg, rgba(212,175,85,0.2), rgba(212,175,85,0.1));
  border: 1px solid rgba(212,175,85,0.4);
  color: #d4af55;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.35rem 0.9rem;
  border-radius: 20px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 1rem;
}

.tagline {
  font-size: clamp(1rem, 2vw, 1.25rem);
  color: rgba(255,255,255,0.85);
  margin-bottom: 1.5rem;
  line-height: 1.5;
}

.hero-trust-row {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 2rem;
  padding: 0 1rem;
}

.hero-trust-badge {
  font-size: 0.95rem;
  font-weight: 500;
  color: rgba(255,255,255,0.88);
  background: rgba(212,175,85,0.08);
  border: 1px solid rgba(212,175,85,0.28);
  border-radius: 8px;
  padding: 0.55rem 1.15rem;
  letter-spacing: 0.01em;
  transition: background 0.2s ease, border-color 0.2s ease;
}

/* ===== About page (Layout 1 -- brief; placeholders until Moran fills) ===== */
.about-page {
  padding: 5rem 0 6rem;
  min-height: 60vh;
}
.about-page .section-head {
  text-align: center;
  margin-bottom: 2.5rem;
}
.about-page h1.about-name {
  font-family: 'Frank Ruhl Libre', serif;
  font-size: clamp(2rem, 4vw, 2.75rem);
  font-weight: 500;
  margin: 0.5rem 0 0.5rem;
  letter-spacing: -0.01em;
  color: #fff;
}
.about-page .about-title {
  font-size: 1.0625rem;
  color: rgba(255,255,255,0.72);
  margin: 0;
}
.about-page .about-bio {
  max-width: 640px;
  margin: 0 auto 2.5rem;
  text-align: right;
}
.about-page .about-bio p {
  font-size: 1.125rem;
  line-height: 1.8;
  color: rgba(255,255,255,0.88);
  margin: 0;
}
.about-page .about-facts {
  max-width: 480px;
  margin: 0 auto 2.5rem;
  padding: 1.25rem 1.5rem;
  list-style: none;
  background: rgba(212,175,85,0.05);
  border: 1px solid rgba(212,175,85,0.18);
  border-radius: 8px;
}
.about-page .about-facts li {
  display: flex;
  justify-content: space-between;
  padding: 0.5rem 0;
  font-size: 0.95rem;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.about-page .about-facts li:last-child { border-bottom: 0; }
.about-page .about-fact-label {
  color: rgba(255,255,255,0.55);
  font-weight: 500;
}
.about-page .about-fact-value {
  color: rgba(255,255,255,0.92);
}
.about-page .about-contact {
  display: flex;
  gap: 1rem;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 1.5rem;
}
.about-page .about-contact-link {
  font-size: 0.95rem;
  color: #d4af55;
  text-decoration: none;
  padding: 0.5rem 1rem;
  border: 1px solid rgba(212,175,85,0.3);
  border-radius: 6px;
  transition: background 0.2s ease, border-color 0.2s ease;
}
.about-page .about-contact-link:hover {
  background: rgba(212,175,85,0.08);
  border-color: rgba(212,175,85,0.55);
}

/* Corporate disclaimer (Bar Rule 2(c) safeguard).
   USE WHEN: a page mentions Moran Bickel (founder/litigator) by name AND
   describes ORCA Legal Labs Ltd. as the corporate entity. Required by Israeli
   Bar Rule 2(c) on attorney advertising/marketing.
   APPLIED ON: /about (about.corporateNote) + /story (story.proofCorporateNote).
   Italic, muted, top-border-on-section. Sitewide class -- promote new pages
   to use this class rather than redefining the styling.
   (R3-M-1 close 2026-05-09.) */
.corporate-disclaimer {
  font-family: 'Heebo', sans-serif;
  font-size: 0.85rem;
  line-height: 1.6;
  color: rgba(255,255,255,0.5);
  font-style: italic;
  border-top: 1px solid rgba(255,255,255,0.08);
  padding-top: 1.25rem;
  margin-top: 2.5rem;
  max-width: var(--prose-max);
}

/* Page meta byline: author + last-updated.
   USE WHEN: long-form authority page needs E-E-A-T / GEO citation
   eligibility (author attribution + currency signal). Restrained
   typography — small, muted, italic — does not compete with hero or
   section heads. Sitewide class; promote new pages to use this class
   rather than redefining styling.
   APPLIED ON: /methodology + /trust (R2 fold 2026-05-16). */
.page-meta {
  font-family: 'Heebo', sans-serif;
  font-size: 0.85rem;
  line-height: 1.5;
  color: rgba(255,255,255,0.5);
  font-style: italic;
  margin-bottom: 2rem;
  max-width: var(--prose-max);
}

.hero-trust-badge:hover {
  background: rgba(212,175,85,0.14);
  border-color: rgba(212,175,85,0.45);
}

@media (max-width: 640px) {
  .hero-trust-badge {
    font-size: 0.85rem;
    padding: 0.45rem 0.9rem;
  }
}

/* Primary CTA button - gold, used in hero and closing section */
.cta {
  display: inline-block;
  background: linear-gradient(135deg, #d4af55 0%, #c9a227 100%);
  color: #0a192f;
  font-weight: 700;
  font-size: 1rem;
  font-family: 'Heebo', sans-serif;
  padding: 0.85rem 2rem;
  border-radius: 8px;
  text-decoration: none;
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(212,175,85,0.3);
}
.cta:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(212,175,85,0.45);
}

.hero-cta-secondary {
  display: inline-block;
  color: rgba(255,255,255,0.6);
  font-size: 0.9rem;
  text-decoration: none;
  padding: 0.4rem 0;
  border-bottom: 1px solid rgba(255,255,255,0.2);
  transition: color 0.2s, border-color 0.2s;
}
.hero-cta-secondary:hover {
  color: rgba(255,255,255,0.9);
  border-color: rgba(255,255,255,0.5);
}

.faq-container {
  max-width: 780px;
  margin: 0 auto;
  padding: 0 1.5rem;
}

/* ==========================================================================
   System Brief - architectural description block between Hero and Showcase
   ========================================================================== */
.system-brief {
  padding: 2.5rem 1.5rem 1.5rem;
  background: transparent;
}

.system-brief-inner {
  max-width: var(--prose-max);
  margin: 0 auto;
  text-align: inherit;
  direction: inherit;
}

.system-brief-p {
  font-size: 1rem;
  line-height: 1.8;
  color: rgba(255, 255, 255, 0.78);
  margin: 0 0 1rem;
  font-family: 'Heebo', sans-serif;
}

.system-brief-cta {
  display: inline-block;
  margin-top: 0.25rem;
  color: #d4af55;
  font-size: 0.95rem;
  font-weight: 600;
  text-decoration: none;
  transition: opacity 0.2s;
}

.system-brief-cta:hover {
  opacity: 0.75;
  text-decoration: underline;
}

.system-brief-cta:focus-visible {
  outline: 2px solid #d4af55;
  outline-offset: 2px;
}

/* ==========================================================================
   Showcase Section - Before / After Panels
   ========================================================================== */
.showcase-section {
  background: linear-gradient(180deg, #0a192f 0%, #0d1f3c 100%);
  padding: 3.5rem 0;
  border-top: 1px solid rgba(255,255,255,0.06);
}

.showcase-head {
  text-align: center;
  margin-bottom: 2.5rem;
}

.showcase-overline {
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #d4af55;
  margin-bottom: 0.6rem;
}

.showcase-intro {
  color: rgba(255,255,255,0.65);
  font-size: 1rem;
  margin-top: 0.5rem;
}

/* Panels */
.ba-panel {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 12px;
  padding: 1.5rem 1.75rem;
  margin-bottom: 1.5rem;
}

.ba-input {
  border-right: 3px solid rgba(255,255,255,0.15);
}

.ba-output {
  border-right: 3px solid #d4af55;
}

.ba-label {
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.5px;
  color: rgba(255,255,255,0.45);
  text-align: right;
  margin-bottom: 1rem;
}

.ba-output .ba-label {
  color: #d4af55;
}

/* Input text */
.intake-text {
  color: rgba(255,255,255,0.72);
  font-size: 0.9rem;
  line-height: 1.75;
}

.intake-text p {
  margin: 0 0 0.75rem;
}

/* Expand accordion */
.ba-expand {
  margin-top: 0.5rem;
}

.ba-expand > summary {
  font-size: 0.82rem;
  color: rgba(255,255,255,0.4);
  cursor: pointer;
  list-style: none;
  text-align: right;
  padding: 0.25rem 0;
}

.ba-expand > summary::-webkit-details-marker { display: none; }

/* SOC Excerpt - ORCA output */
.soc-excerpt {
  color: rgba(255,255,255,0.82);
  font-size: 0.9rem;
  line-height: 1.75;
}

.soc-excerpt p {
  margin: 0 0 1rem;
}

.soc-cause-head {
  font-weight: 700;
  color: #d4af55;
  font-size: 0.88rem;
  margin-bottom: 1rem !important;
}

.soc-relief-line {
  font-weight: 700;
  color: rgba(255,255,255,0.9);
  border-top: 1px solid rgba(255,255,255,0.1);
  padding-top: 0.75rem;
  margin-top: 0;
}

.soc-attribution {
  font-size: 0.76rem;
  color: rgba(255,255,255,0.3);
  text-align: center;
  margin-top: 1rem;
  font-style: italic;
}

.showcase-full-soc-link {
  display: block;
  text-align: center;
  color: #d4af55;
  font-size: 0.88rem;
  font-weight: 600;
  margin-top: 0.75rem;
  text-decoration: none;
  transition: opacity 0.2s;
}

.showcase-full-soc-link:hover {
  opacity: 0.8;
}

/* Pull Quote */
.section-pull-quote {
  background: linear-gradient(135deg, #0d1f3c 0%, #162544 100%);
  padding: 2.5rem 0;
  border-top: 1px solid rgba(212,175,85,0.15);
  border-bottom: 1px solid rgba(212,175,85,0.15);
  text-align: center;
}
.orca-pull-quote {
  font-size: clamp(1.4rem, 3.5vw, 2rem);
  color: #d4af55;
  font-weight: 700;
  margin: 0 auto;
  max-width: 600px;
  padding: 0 1.5rem;
  quotes: none;
  line-height: 1.4;
}

/* Products section */
.products-section {
  background: #0a192f;
  padding: 3.5rem 0;
}
.products-section h2 {
  color: #fff;
}
.products-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.25rem;
  max-width: 900px;
  margin: 2rem auto 0;
  padding: 0 1.5rem;
}
.product-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 12px;
  padding: 1.5rem;
  transition: border-color 0.2s, background 0.2s;
}
.product-card:hover {
  border-color: rgba(212,175,85,0.3);
  background: rgba(255,255,255,0.06);
}
.product-card h3 {
  color: #d4af55;
  font-size: 1rem;
  font-weight: 700;
  margin-bottom: 0.6rem;
}
.product-card p {
  color: rgba(255,255,255,0.7);
  font-size: 0.88rem;
  line-height: 1.65;
  margin: 0;
}

.products-cards-section {
    padding: 2rem 0 0;
}

.products-cards-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
    margin-bottom: 2.5rem;
}

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

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

.product-card-badge {
    display: inline-block;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    padding: 2px 8px;
    border-radius: 4px;
    margin-bottom: 0.75rem;
}

.product-card-badge.live {
    background: rgba(16, 185, 129, 0.15);
    color: #10b981;
    border: 1px solid rgba(16, 185, 129, 0.3);
}

.product-card-title {
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--gold, #d4af55);
    margin-bottom: 0.4rem;
}

.product-card-desc {
    font-size: 0.82rem;
    color: rgba(255,255,255,0.6);
    line-height: 1.6;
    margin: 0;
}

/* Quality layer inside products */
.quality-layer {
  max-width: 900px;
  margin: 2rem auto 0;
  padding: 1.5rem;
  background: rgba(212,175,85,0.05);
  border: 1px solid rgba(212,175,85,0.15);
  border-radius: 12px;
}
.quality-intro {
  font-size: 0.9rem;
  color: rgba(255,255,255,0.7);
  margin-bottom: 1rem;
  line-height: 1.6;
}
.quality-gates-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.6rem;
  margin-bottom: 1rem;
}
.quality-layer-link {
  font-size: 0.85rem;
  color: #d4af55;
  text-decoration: none;
}
.quality-layer-link:hover { text-decoration: underline; }

/* Roadmap section */
.roadmap-section {
  background: linear-gradient(180deg, #0d1f3c 0%, #0a192f 100%);
  padding: 3rem 0;
  border-top: 1px solid rgba(255,255,255,0.06);
}
.roadmap-section h2 {
  color: #fff;
}
.roadmap-intro {
  font-size: 0.95rem;
  color: rgba(255,255,255,0.65);
  margin-bottom: 1.5rem;
}
.roadmap-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.25rem;
  max-width: 900px;
  margin: 0 auto;
  padding: 0 1.5rem;
}
.roadmap-item {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 10px;
  padding: 1.25rem;
}
.roadmap-status {
  display: inline-block;
  font-size: 0.72rem;
  font-weight: 700;
  color: rgba(255,255,255,0.45);
  background: rgba(255,255,255,0.06);
  border-radius: 20px;
  padding: 0.2rem 0.7rem;
  margin-bottom: 0.75rem;
  letter-spacing: 0.3px;
  text-transform: uppercase;
}
.roadmap-item h3 {
  color: rgba(255,255,255,0.85);
  font-size: 0.95rem;
  font-weight: 700;
  margin-bottom: 0.5rem;
}
.roadmap-item p {
  color: rgba(255,255,255,0.55);
  font-size: 0.83rem;
  line-height: 1.6;
  margin: 0;
}
.roadmap-closing {
  max-width: var(--prose-max);
  margin: 1.75rem auto 0;
  text-align: center;
  font-size: 0.88rem;
  color: rgba(255,255,255,0.5);
  padding: 0 1.5rem;
  line-height: 1.6;
}

/* Domains one-liner */
.domains-line-section {
  background: #0a192f;
  padding: 1.25rem 0;
  border-top: 1px solid rgba(255,255,255,0.05);
}
.domains-oneliner {
  text-align: center;
  font-size: 0.88rem;
  color: rgba(255,255,255,0.5);
  margin: 0;
  padding: 0 1.5rem;
}
.domains-oneliner a {
  color: #d4af55;
  text-decoration: none;
  margin-right: 0.5rem;
}
.domains-oneliner a:hover { text-decoration: underline; }

/* Privacy + Founder lines in closing */
.privacy-line {
  font-size: 0.82rem;
  color: rgba(255,255,255,0.45);
  margin: 1.75rem auto 0.5rem;
  max-width: 560px;
  line-height: 1.55;
}
.founder-line {
  font-size: 0.82rem;
  color: rgba(255,255,255,0.4);
  margin: 0 auto;
  max-width: 560px;
  font-style: italic;
  line-height: 1.55;
}

/* Not-For section */
.not-for-section {
  background: #0a192f;
  padding: 3rem 0;
  border-top: 1px solid rgba(255,255,255,0.06);
}
.not-for-intro {
  color: rgba(255,255,255,0.65);
  font-size: 0.95rem;
  margin-bottom: 1.25rem;
}
.not-for-list {
  list-style: none;
  padding: 0;
  margin: 0 0 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}
.not-for-list li {
  color: rgba(255,255,255,0.7);
  font-size: 0.95rem;
  line-height: 1.6;
  padding-right: 0.5rem;
}
.not-for-closing {
  color: rgba(255,255,255,0.5);
  font-size: 0.88rem;
  font-style: italic;
  margin: 0;
}

/* Pricing Context section */
.pricing-context-section {
  background: #f5f4f0;
  padding: 3.5rem 0;
  border-top: 1px solid rgba(0,0,0,0.06);
}
.pricing-context-section .section-title {
  color: #0a192f;
  text-align: center;
  margin-bottom: 2rem;
}
.pricing-context-overline {
  color: #c9a227;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  text-align: center;
  margin-bottom: 0.5rem;
}
.pricing-compare {
  display: flex;
  align-items: stretch;
  justify-content: center;
  gap: 0;
  max-width: 640px;
  margin: 0 auto 2rem;
}
.pricing-compare-card {
  flex: 1;
  background: #fff;
  border: 1px solid rgba(0,0,0,0.1);
  border-radius: 12px;
  padding: 1.75rem 1.5rem;
  text-align: center;
}
.pricing-compare-card.orca {
  background: #0a192f;
  border-color: #0a192f;
}
.pricing-compare-vs {
  display: flex;
  align-items: center;
  padding: 0 1.25rem;
  color: rgba(0,0,0,0.3);
  font-size: 0.85rem;
  font-weight: 600;
  flex-shrink: 0;
}
.pricing-compare-label {
  font-size: 0.8rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 0.75rem;
  color: rgba(0,0,0,0.45);
}
.pricing-compare-card.orca .pricing-compare-label {
  color: rgba(255,255,255,0.5);
}
.pricing-compare-time {
  font-size: 1rem;
  font-weight: 600;
  color: #0a192f;
  margin-bottom: 0.4rem;
}
.pricing-compare-card.orca .pricing-compare-time {
  color: #d4af55;
}
.pricing-compare-cost {
  font-size: 0.88rem;
  color: rgba(0,0,0,0.55);
}
.pricing-compare-card.orca .pricing-compare-cost {
  color: rgba(255,255,255,0.7);
  font-size: 1.1rem;
  font-weight: 700;
}
.pricing-context-cta {
  display: block;
  text-align: center;
  color: #0a192f;
  font-size: 0.9rem;
  font-weight: 600;
  text-decoration: none;
  margin-top: 0.5rem;
  opacity: 0.7;
}
.pricing-context-cta:hover { opacity: 1; }

/* FAQ / Concerns section */
.concerns-section {
  background: linear-gradient(180deg, #0d1f3c 0%, #0a192f 100%);
  padding: 3.5rem 0;
  border-top: 1px solid rgba(255,255,255,0.06);
}
.concerns-section h2 {
  color: #fff;
}
.concerns-section .faq-item {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 10px;
  margin-bottom: 0.75rem;
  overflow: hidden;
}
.concerns-section .faq-item summary {
  padding: 1rem 1.25rem;
  color: rgba(255,255,255,0.85);
  font-size: 0.95rem;
  font-weight: 600;
  cursor: pointer;
  list-style: none;
}
.concerns-section .faq-item summary::-webkit-details-marker { display: none; }
.concerns-section .faq-item p {
  padding: 0 1.25rem 1rem;
  color: rgba(255,255,255,0.65);
  font-size: 0.9rem;
  line-height: 1.7;
  margin: 0;
}

/* Products Context Block (problem/solution paragraphs inside Products section) */
.products-context-block {
  max-width: var(--prose-max);
  margin: 0 auto 2.5rem;
  padding: 0 1.5rem;
}
.products-context-block p {
  color: rgba(255,255,255,0.75);
  font-size: 1rem;
  line-height: 1.8;
  margin-bottom: 1.25rem;
}
.products-context-block p:last-child {
  margin-bottom: 0;
}

/* Roadmap Mini (compact roadmap strip inside Products section) */
.roadmap-mini {
  max-width: 900px;
  margin: 0 auto 2.5rem;
  padding: 1.5rem;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 12px;
}
.roadmap-mini-label {
  color: rgba(255,255,255,0.55);
  font-size: 0.85rem;
  text-align: center;
  margin-bottom: 1rem;
  letter-spacing: 0.3px;
}
.roadmap-mini-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
}
.roadmap-mini-item {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 8px;
  padding: 1rem 1.25rem;
  text-align: center;
}
.roadmap-mini-item h3 {
  color: rgba(255,255,255,0.85);
  font-size: 0.9rem;
  margin-bottom: 0.35rem;
}
.roadmap-mini-item p {
  color: rgba(255,255,255,0.5);
  font-size: 0.8rem;
  line-height: 1.5;
  margin: 0;
}
.roadmap-mini-item .roadmap-badge,
.roadmap-mini-item .roadmap-status {
  display: inline-block;
  font-size: 0.7rem;
  font-weight: 700;
  padding: 0.15rem 0.6rem;
  border-radius: 10px;
  margin-bottom: 0.5rem;
  background: rgba(212, 175, 85, 0.15);
  color: #d4af55;
  border: 1px solid rgba(212, 175, 85, 0.3);
}

/* FAQ Not-For Body (not-for content inside FAQ accordion) */
.faq-not-for-body {
  padding: 0 1.25rem 1rem;
}
.faq-not-for-body ul {
  list-style: none;
  padding: 0;
  margin: 0.5rem 0 0.75rem;
}
.faq-not-for-body ul li {
  color: rgba(255,255,255,0.65);
  font-size: 0.9rem;
  line-height: 1.7;
  padding: 0.2rem 0;
}
.faq-not-for-body ul li::before {
  content: '- ';
  color: rgba(255,255,255,0.35);
}
.faq-not-for-body .not-for-closing {
  color: rgba(255,255,255,0.45);
  font-size: 0.85rem;
  font-style: italic;
}
/* Prevent double horizontal padding: .concerns-section .faq-item p also adds 1.25rem */
.faq-not-for-body p {
  padding-right: 0;
  padding-left: 0;
}

/* FAQ Domains Line (domains oneliner at bottom of FAQ section) */
.faq-domains-line {
  text-align: center;
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid rgba(255,255,255,0.06);
  color: rgba(255,255,255,0.5);
  font-size: 0.88rem;
}
.faq-domains-line a {
  color: #d4af55;
  text-decoration: none;
  font-weight: 600;
}
.faq-domains-line a:hover {
  text-decoration: underline;
}

/* Mobile adjustments */
@media (max-width: 768px) {
  .products-grid {
    grid-template-columns: 1fr;
    max-width: 400px;
  }
  .quality-gates-grid {
    grid-template-columns: 1fr;
  }
  .roadmap-grid {
    grid-template-columns: 1fr;
    max-width: 400px;
  }
  .orca-pull-quote {
    font-size: 1.3rem;
  }
  .pricing-compare {
    flex-direction: column;
    max-width: 320px;
  }
  .pricing-compare-vs {
    justify-content: center;
    padding: 0.75rem 0;
  }
  .roadmap-mini-grid {
    grid-template-columns: 1fr;
    max-width: 320px;
    margin: 0 auto;
  }
  .roadmap-mini {
    padding: 1.25rem 1rem;
  }
  .products-context-block {
    padding: 0 1rem;
  }
}

/* ─── Hero Price Hint ─── */
.hero-price-hint {
  font-size: 0.82rem;
  color: rgba(255,255,255,0.65);
  margin: 0.6rem 0 0;
  letter-spacing: 0.2px;
  text-align: center;
}

/* ─── Pricing: Transition Hint ─── */
.pricing-transition-hint {
  font-size: 0.88rem;
  color: rgba(255,255,255,0.65);
  text-align: center;
  margin: 0.25rem 0 1.5rem;
}
.pricing-transition-hint a {
  color: rgba(212,175,85,0.8);
  text-decoration: none;
  transition: color 0.2s;
}
.pricing-transition-hint a:hover {
  color: #d4af55;
}

/* ─── Pricing: Demoted Waitlist (secondary) ─── */
.pricing-waitlist-secondary {
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid rgba(255,255,255,0.07);
}
.pricing-waitlist-secondary .waitlist-card {
  background: transparent;
  border: 1px solid rgba(255,255,255,0.07);
  backdrop-filter: none;
  padding: 1.5rem 1.25rem;
  max-width: 440px;
}
.pricing-waitlist-secondary .waitlist-card .waitlist-toggle-label {
  font-size: 0.95rem;
  color: rgba(255,255,255,0.65);
}
.btn-waitlist-secondary {
  width: 100%;
  background: rgba(255,255,255,0.07);
  color: rgba(255,255,255,0.8);
  border: 1px solid rgba(255,255,255,0.15);
  padding: 0.75rem 1.5rem;
  border-radius: 8px;
  font-size: 0.95rem;
  font-weight: 600;
  font-family: 'Heebo', sans-serif;
  cursor: pointer;
  transition: all 0.2s ease;
  margin-top: 0.5rem;
}
.btn-waitlist-secondary:hover {
  background: rgba(255,255,255,0.12);
  border-color: rgba(255,255,255,0.25);
}

/* ─── Products: Domain Summary Grid ─── */
.domains-summary-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  max-width: 720px;
  margin: 1.5rem auto 0;
}
.domain-summary-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.09);
  border-radius: 10px;
  padding: 1.1rem 1.25rem;
  direction: rtl;
}
.domain-summary-cat {
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: rgba(212,175,85,0.85);
  margin-bottom: 0.65rem;
}
.domain-summary-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  align-items: center;
}
.domain-tag {
  display: inline-block;
  background: rgba(255,255,255,0.07);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 20px;
  padding: 0.25rem 0.7rem;
  font-size: 0.82rem;
  color: rgba(255,255,255,0.8);
  white-space: nowrap;
}
.domain-more {
  font-size: 0.78rem;
  color: rgba(255,255,255,0.4);
  margin-right: 0.2rem;
}
.domains-note {
  text-align: center;
  font-size: 0.85rem;
  color: rgba(255,255,255,0.4);
  margin-top: 1rem;
}
@media (max-width: 600px) {
  .domains-summary-grid {
    grid-template-columns: 1fr;
  }
}

/* ── Dual-output showcase (homepage section 3b) ───────────── */
.outputs-duo-section {
  padding: 4rem 0;
  background: var(--navy-mid, #0d1f3c);
}
.outputs-duo-head {
  text-align: center;
  margin-bottom: 2.5rem;
}
.outputs-duo-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
  max-width: 900px;
  margin: 0 auto;
}
.output-preview-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 12px;
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.output-preview-tag {
  display: inline-block;
  background: rgba(212,175,85,0.15);
  color: #d4af55;
  border: 1px solid rgba(212,175,85,0.3);
  padding: 0.25rem 0.75rem;
  border-radius: 20px;
  font-size: 0.8rem;
  font-weight: 700;
  width: fit-content;
}
.output-preview-tag.strategy-tag {
  background: rgba(16,185,129,0.12);
  color: #10b981;
  border-color: rgba(16,185,129,0.25);
}
.output-preview-body {
  flex: 1;
}
.soc-preview-body {
  direction: rtl;
}
.preview-court {
  font-size: 0.78rem;
  color: rgba(255,255,255,0.45);
  margin-bottom: 0.2rem;
}
.preview-title-doc {
  font-size: 1rem;
  font-weight: 700;
  color: #fff;
  margin-bottom: 0.25rem;
}
.preview-parties {
  font-size: 0.88rem;
  color: rgba(255,255,255,0.7);
  margin-bottom: 0.75rem;
}
.preview-vs {
  color: rgba(255,255,255,0.35);
  margin: 0 0.4rem;
}
.preview-excerpt {
  font-size: 0.88rem;
  color: rgba(255,255,255,0.65);
  line-height: 1.6;
  border-right: 2px solid rgba(212,175,85,0.3);
  padding-right: 0.75rem;
}
.strategy-preview-body {
  direction: rtl;
}
.strategy-preview-body .preview-excerpt {
  border-right-color: rgba(16,185,129,0.3);
}
.preview-stats-row {
  display: flex;
  gap: 1rem;
  margin-bottom: 0.75rem;
}
.preview-stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 1;
}
.preview-stat-num {
  font-size: 1.1rem;
  font-weight: 800;
  color: #10b981;
  line-height: 1.2;
}
.preview-stat-label {
  font-size: 0.72rem;
  color: rgba(255,255,255,0.45);
  text-align: center;
  margin-top: 2px;
}
.output-preview-link {
  display: inline-block;
  color: rgba(255,255,255,0.55);
  font-size: 0.85rem;
  text-decoration: none;
  border-top: 1px solid rgba(255,255,255,0.08);
  padding-top: 0.75rem;
  transition: color 0.2s;
}
.output-preview-link:hover { color: #d4af55; }
@media (max-width: 700px) {
  .outputs-duo-grid { grid-template-columns: 1fr; }
}

/* F2 Phase 2 — reviewer override visualization (CSP-safe; replaces inline styles
   removed from reviewer-relief.js per CSP style-src 'self' 'nonce-...' policy) */
.f2-amount-overridden { text-decoration: line-through; opacity: 0.6; }
.f2-amount-override-tag { font-size: 0.875rem; color: #92400e; }
.f2-error-message { color: #991b1b; }