:root {
  /* ── palette ─────────────────────────────────────────── */
  --sv-indigo-50: #F0F2FA;
  --sv-indigo-100: #DDE1F2;
  --sv-indigo-200: #BCC4E6;
  --sv-indigo-300: #94A0D6;
  --sv-indigo-400: #6B79C2;
  --sv-indigo-500: #4A57AC;
  --sv-indigo-600: #27339B;
  --sv-indigo-700: #1F2A80;
  --sv-indigo-800: #182063;
  --sv-indigo-900: #141C52;
  --sv-indigo-950: #0D1238;
  --sv-gold-50: #FEF8EE;
  --sv-gold-100: #FCEBCF;
  --sv-gold-200: #F8D79F;
  --sv-gold-300: #F2BC64;
  --sv-gold-400: #E8A33D;
  --sv-gold-500: #D48A22;
  --sv-gold-600: #9E6518;
  --sv-gold-700: #8A5715;
  --sv-gold-800: #6B4310;
  --sv-sand-0: #FFFFFF;
  --sv-sand-50: #FAF8F4;
  --sv-sand-100: #F2EFE9;
  --sv-sand-200: #E4E0D8;
  --sv-sand-300: #CBC6BC;
  --sv-sand-400: #A29C92;
  --sv-sand-500: #78736B;
  --sv-sand-600: #565249;
  --sv-sand-700: #3C3A34;
  --sv-sand-800: #2A2C33;
  --sv-sand-900: #22242A;
  --sv-sand-950: #15161A;
  --sv-success-50: #E7F5EE;
  --sv-success-100: #C6E8D7;
  --sv-success-500: #15794D;
  --sv-success-600: #14724A;
  --sv-success-700: #0F5A3A;
  --sv-warning-50: #FEF6E7;
  --sv-warning-500: #B45309;
  --sv-warning-600: #92400E;
  --sv-danger-50: #FDECEA;
  --sv-danger-500: #B42318;
  --sv-danger-600: #912018;

  /* ── semantic ────────────────────────────────────────── */
  --sv-bg-page: #FAF8F4;
  --sv-bg-surface: #FFFFFF;
  --sv-bg-raised: #FFFFFF;
  --sv-bg-sunken: #F2EFE9;
  --sv-bg-inverse: #27339B;
  --sv-bg-inverse-deep: #141C52;
  --sv-bg-accent-subtle: #FEF8EE;
  --sv-bg-brand-subtle: #F0F2FA;
  --sv-fg-default: #22242A;
  --sv-fg-muted: #565249;
  --sv-fg-subtle: #78736B;
  --sv-fg-brand: #27339B;
  --sv-fg-accent: #9E6518;
  --sv-fg-on-inverse: #FAF8F4;
  --sv-fg-on-inverse-muted: #BCC4E6;
  --sv-fg-on-brand: #FFFFFF;
  --sv-border-default: #E4E0D8;
  --sv-border-strong: #CBC6BC;
  --sv-border-brand: #27339B;
  --sv-border-on-inverse: rgb(250 248 244 / 0.16);
  --sv-action-primary-bg: #27339B;
  --sv-action-primary-bg-hover: #1F2A80;
  --sv-action-primary-fg: #FFFFFF;
  --sv-action-secondary-bg: #FFFFFF;
  --sv-action-secondary-border: #CBC6BC;
  --sv-action-accent-bg: #E8A33D;
  --sv-action-accent-fg: #141C52;
  --sv-action-focus-ring: #E8A33D;

  /* ── type ────────────────────────────────────────────── */
  --sv-font-sans: Poppins, ui-sans-serif, system-ui, -apple-system, sans-serif;
  --sv-text-xs: 0.75rem;
  --sv-leading-xs: 1.5;
  --sv-text-sm: 0.875rem;
  --sv-leading-sm: 1.5;
  --sv-text-base: 1rem;
  --sv-leading-base: 1.625;
  --sv-text-lg: 1.125rem;
  --sv-leading-lg: 1.6;
  --sv-text-xl: 1.25rem;
  --sv-leading-xl: 1.5;
  --sv-text-2xl: 1.5rem;
  --sv-leading-2xl: 1.35;
  --sv-text-3xl: 1.875rem;
  --sv-leading-3xl: 1.25;
  --sv-text-4xl: 2.25rem;
  --sv-leading-4xl: 1.15;
  --sv-text-5xl: 3rem;
  --sv-leading-5xl: 1.08;
  --sv-text-6xl: 3.75rem;
  --sv-leading-6xl: 1.05;
  --sv-text-7xl: 4.5rem;
  --sv-leading-7xl: 1.02;
  --sv-tracking-tight: -0.02em;
  --sv-tracking-normal: 0;
  --sv-tracking-wordmark: 0.012em;
  --sv-tracking-wide: 0.06em;
  --sv-tracking-eyebrow: 0.16em;

  /* ── shape & depth ───────────────────────────────────── */
  --sv-radius-sm: 0.375rem;
  --sv-radius-md: 0.625rem;
  --sv-radius-lg: 0.875rem;
  --sv-radius-xl: 1.25rem;
  --sv-radius-2xl: 1.75rem;
  --sv-radius-3xl: 2.25rem;
  --sv-radius-full: 9999px;
  --sv-shadow-sm: 0 1px 2px 0 rgb(20 28 82 / 0.05);
  --sv-shadow-md: 0 4px 12px -2px rgb(20 28 82 / 0.08), 0 2px 4px -2px rgb(20 28 82 / 0.05);
  --sv-shadow-lg: 0 12px 28px -6px rgb(20 28 82 / 0.12), 0 4px 8px -4px rgb(20 28 82 / 0.06);
  --sv-shadow-xl: 0 24px 56px -12px rgb(20 28 82 / 0.18);
  --sv-shadow-gold: 0 8px 24px -6px rgb(232 163 61 / 0.35);
  --sv-motion-fast: 140ms;
  --sv-motion-base: 220ms;
  --sv-motion-slow: 380ms;
  --sv-motion-ease: cubic-bezier(0.4, 0, 0.2, 1);
  --sv-motion-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
}

/* ── base ────────────────────────────────────────────────── */
html { -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--sv-font-sans);
  background: var(--sv-bg-page);
  color: var(--sv-fg-default);
  font-size: var(--sv-text-base);
  line-height: var(--sv-leading-base);
  -webkit-font-smoothing: antialiased;
}
h1,h2,h3,h4 { font-weight: 600; letter-spacing: var(--sv-tracking-tight); color: var(--sv-fg-default); }
:focus-visible { outline: 3px solid var(--sv-action-focus-ring); outline-offset: 2px; border-radius: 4px; }

/* The eyebrow label used above section headings. */
.sv-eyebrow {
  display:inline-block; font-size: var(--sv-text-xs); font-weight:600;
  letter-spacing: var(--sv-tracking-eyebrow); text-transform: uppercase;
  color: var(--sv-fg-brand); background: var(--sv-bg-brand-subtle);
  padding: .5rem 1rem; border-radius: var(--sv-radius-full);
}
.sv-eyebrow--on-dark { color: var(--sv-indigo-200); background: rgb(250 248 244 / .1); }

/* Primary button. */
.sv-btn {
  display:inline-flex; align-items:center; gap:.5rem; justify-content:center;
  font-weight:600; font-size: var(--sv-text-base); padding: .875rem 1.75rem;
  border-radius: var(--sv-radius-full); border:1px solid transparent; cursor:pointer;
  transition: background var(--sv-motion-base) var(--sv-motion-ease),
              transform var(--sv-motion-fast) var(--sv-motion-ease);
}
.sv-btn:active { transform: translateY(1px); }
.sv-btn--primary   { background: var(--sv-action-primary-bg); color: var(--sv-action-primary-fg); }
.sv-btn--primary:hover { background: var(--sv-action-primary-bg-hover); }
.sv-btn--secondary { background: var(--sv-bg-surface); color: var(--sv-fg-brand);
                     border-color: var(--sv-border-strong); }
.sv-btn--accent    { background: var(--sv-action-accent-bg); color: var(--sv-action-accent-fg); }

/* Card. */
.sv-card {
  background: var(--sv-bg-surface); border:1px solid var(--sv-border-default);
  border-radius: var(--sv-radius-xl); box-shadow: var(--sv-shadow-md); padding: 1.75rem;
}

/* Verified badge — green is a deliberate exception to the two-colour palette:
   it is the single most important trust signal in the product, and green reads
   as "checked" faster than any brand colour would. */
.sv-badge-verified {
  display:inline-flex; align-items:center; gap:.3rem;
  font-size: var(--sv-text-xs); font-weight:600;
  color: var(--sv-success-600); background: var(--sv-success-50);
  padding: .2rem .55rem; border-radius: var(--sv-radius-full);
}