/* ============================================================
   Sealevel — design tokens (ported from the sealevel-design
   system, tokens/*.css, verbatim). Single source of truth for
   colour, type, spacing, motion. Linked first, before site.css.
   ============================================================ */

/* ---------- Webfonts ----------
   DECIDED stack: Instrument Sans for all display/heading/body/UI/
   labels; Geist Mono for tabular data readouts only. Outfit is
   retained ONLY for the wordmark lockup (do not use for UI text).

   Self-hosted (SIL Open Font License). Instrument Sans, Geist Mono and
   Outfit are all open-source, so they ship from /fonts with NO third-
   party request: no Google Fonts CDN, GDPR-clean. The latin + latin-ext
   subsets below cover the English site and the German legal pages.
   Source: Google Fonts woff2 builds, self-hosted. Italics can be added
   later if any copy needs them (none currently does). */

@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/instrument-sans-400-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/instrument-sans-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/instrument-sans-500-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/instrument-sans-500-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/instrument-sans-600-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/instrument-sans-600-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/instrument-sans-700-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/instrument-sans-700-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Geist Mono';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/geist-mono-400-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Geist Mono';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/geist-mono-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Geist Mono';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/geist-mono-500-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Geist Mono';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/geist-mono-500-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Geist Mono';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/geist-mono-600-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Geist Mono';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/geist-mono-600-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Outfit';font-style:normal;font-weight:200;font-display:swap;src:url('../fonts/outfit-200-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Outfit';font-style:normal;font-weight:200;font-display:swap;src:url('../fonts/outfit-200-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Outfit';font-style:normal;font-weight:300;font-display:swap;src:url('../fonts/outfit-300-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Outfit';font-style:normal;font-weight:300;font-display:swap;src:url('../fonts/outfit-300-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Outfit';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/outfit-400-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Outfit';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/outfit-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Outfit';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/outfit-500-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Outfit';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/outfit-500-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}

:root {
  /* ============================================================
     Colour — LOCKED dark navy palette
     gold #d4ad5e (warm accent + ALL CTAs) · ember #C85A27 (PRODUCT
     CTA only) · teal #2abfb0 (logo dot + feature accents) ·
     text #f9fafb (primary foreground)
     ============================================================ */

  /* ---- Base ink scale (deep maritime navy) ---- */
  /* ONE page background (#05101d) everywhere. Depth comes from card +
     panel SURFACES sitting on it, never from changing the section bg.
     The footer is the only permitted bg change (deepest #030a13). */
  --ink-975: #030a13;  /* footer only — deepest */
  --ink-950: #05101d;  /* THE single page background */
  --ink-900: #05101d;  /* (alias kept = page; no second blue) */
  --ink-850: #05101d;  /* (alias kept = page; no alternating shade) */
  --ink-800: #0a1c34;  /* large shell surface (dashboard, bands) */
  --ink-700: #0d2240;  /* card / panel surface — THE surface */
  --ink-600: #15355d;  /* card surface, hover */
  --ink-500: #1e4470;  /* strong border / divider */

  /* ---- Hairlines & borders (neutral foreground at alpha over ink) ---- */
  --line-faint: rgba(249, 250, 251, 0.12);
  --line: rgba(249, 250, 251, 0.20);
  --line-strong: rgba(249, 250, 251, 0.38);

  /* ---- Text (neutral foreground on deep navy, cool muted) ---- */
  --text-strong: #f9fafb;   /* headlines / primary text / foreground */
  --text-body: #f9fafb;     /* body copy */
  --text-muted: #6a85a0;    /* captions, labels (secondary) */
  --text-faint: #4a607a;    /* disabled, footnotes */
  --text-on-gold: #05101d;  /* label on a gold CTA */
  --text-on-ember: #f9fafb; /* label on the ember CTA */

  /* ---- Gold — primary CTA / accent color (DECIDED: #d4ad5e) ---- */
  --gold-500: #d4ad5e;      /* base CTA / accent — THE token */
  --gold-400: color-mix(in srgb, var(--gold-500) 78%, #ffffff);   /* hover / highlight */
  --gold-600: color-mix(in srgb, var(--gold-500) 82%, #000000);   /* pressed */
  --gold-tint-12: color-mix(in srgb, var(--gold-500) 12%, transparent);
  --gold-tint-20: color-mix(in srgb, var(--gold-500) 20%, transparent);
  --gold-tint-40: color-mix(in srgb, var(--gold-500) 40%, transparent);

  /* ---- Ember — the PRODUCT CTA only (LOCKED scope) ---- */
  --ember-vivid: #ff6a2a;   /* vivid reveal on hover */
  --ember-500: #c85a27;     /* base ember */
  --ember-700: #7a3415;     /* deep ember (rim) */
  --ember-base: #0a1f38;    /* dark resting base of the product CTA */

  /* ---- Teal — logo dot + selective feature accents (LOCKED scope) ---- */
  --teal-mark: #2abfb0;     /* the logo dot */
  --teal-500: #2abfb0;      /* feature accent */
  --teal-tint-14: rgba(42, 191, 176, 0.14);
  --teal-tint-30: rgba(42, 191, 176, 0.30);

  /* ---- Functional signal tints (product UI illustration) ---- */
  --signal-strong: var(--teal-500);
  --signal-track: rgba(249, 250, 251, 0.08);

  /* ---- Semantic aliases (prefer these in markup) ---- */
  --bg-page: var(--ink-950);
  --bg-alt: var(--ink-950);   /* no alternating shade — same single bg */
  --bg-deep: var(--ink-975);  /* footer only */
  --surface-raised: var(--ink-800);
  --surface-card: var(--ink-700);
  --surface-card-hover: var(--ink-600);
  --border-card: var(--line);
  --border-card-strong: var(--line-strong);
  --divider: var(--line);

  /* Primary action = gold */
  --action: var(--gold-500);
  --action-hover: var(--gold-400);
  --action-press: var(--gold-600);
  --action-text: var(--text-on-gold);
  --action-soft-bg: var(--gold-tint-12);
  --action-ring: var(--gold-tint-40);

  /* Feature accent = teal */
  --accent: var(--teal-500);
  --accent-soft-bg: var(--teal-tint-14);
  --focus-ring: var(--gold-tint-40);

  /* ============================================================
     Typography
     ============================================================ */
  --font-display: 'Instrument Sans', system-ui, sans-serif;
  --font-ui: 'Instrument Sans', system-ui, sans-serif;
  --font-mono: 'Geist Mono', ui-monospace, monospace;

  /* Type scale (ONE modular scale; no one-off sizes) */
  --fs-display: 84px;    /* hero / closing headline */
  --fs-h1: 54px;         /* section openers */
  --fs-h2: 38px;         /* sub-headings, moment titles, big stats */
  --fs-h3: 22px;         /* card / caption / step titles, lead lines */
  --fs-body: 17px;       /* body copy */
  --fs-small: 14px;      /* secondary text, nav, links, meta */
  --fs-caption: 12px;    /* eyebrows, labels, mono tokens, placeholders */

  --fs-display-1: var(--fs-display);
  --fs-display-2: var(--fs-h1);
  --fs-lead: var(--fs-h3);
  --fs-sm: var(--fs-small);
  --fs-label: var(--fs-caption);
  --fs-mono: var(--fs-caption);

  /* Line heights (paired to the scale) */
  --lh-display: 1.0;
  --lh-h1: 1.07;
  --lh-h2: 1.14;
  --lh-h3: 1.3;
  --lh-body: 1.55;
  --lh-small: 1.5;
  --lh-caption: 1.4;
  --lh-tight: var(--lh-display);
  --lh-snug: var(--lh-h3);

  /* Weights (Instrument Sans): display/headings 500-600, body 400, UI 400-500 */
  --fw-light: 400;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;

  /* Tracking */
  --ls-eyebrow: 0.2em;
  --ls-tight: -0.035em;
  --ls-normal: 0;

  /* ============================================================
     Spacing, radii, shadows, layout
     ============================================================ */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --sp-7: 48px;
  --sp-8: 64px;
  --sp-9: 96px;
  --sp-10: 128px;

  --section-pad-y: 112px;
  --section-gap: 28px;
  --container-max: 1200px;
  --container-pad: 32px;

  /* Radii (sharp direction: 0 to 2px maximum) */
  --radius-xs: 0;
  --radius-sm: 0;
  --radius-md: 0;
  --radius-lg: 2px;
  --radius-xl: 2px;
  --radius-pill: 0;

  --bw-hair: 1px;

  /* Shadows (dark UI: low, hard, no soft ambient drift) */
  --shadow-sm: 0 1px 0 rgba(0, 0, 0, 0.40);
  --shadow-md: 0 2px 0 rgba(0, 0, 0, 0.45);
  --shadow-lg: 0 16px 40px rgba(0, 0, 0, 0.55);
  --shadow-hero: 0 24px 70px rgba(0, 0, 0, 0.6), 0 0 0 1px var(--line-strong);
  --glow-gold: 0 0 0 1px var(--gold-tint-40);

  /* Motion */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 140ms;
  --dur: 240ms;
  --dur-slow: 520ms;
}

/* ============================================================
   Base element styles + layout utilities
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body {
  margin: 0;
  background: var(--bg-page);
  color: var(--text-body);
  font-family: var(--font-ui);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  font-weight: var(--fw-regular);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4 {
  color: var(--text-strong);
  font-family: var(--font-display);
  font-weight: var(--fw-semibold);
  letter-spacing: var(--ls-tight);
  margin: 0;
  text-wrap: balance;
}
h1 { font-size: var(--fs-h1); line-height: var(--lh-h1); }
h2 { font-size: var(--fs-h2); line-height: var(--lh-h2); }
h3, h4 { font-size: var(--fs-h3); line-height: var(--lh-h3); letter-spacing: -0.01em; }

p { margin: 0; text-wrap: pretty; }
a { color: inherit; text-decoration: none; }

::selection { background: var(--gold-tint-40); color: var(--text-strong); }

:focus-visible {
  outline: 2px solid var(--gold-500);
  outline-offset: 2px;
  border-radius: 0;
}

.sl-rule { border: 0; border-top: 1px solid var(--line-strong); margin: 0; }

/* ---- Layout utilities ---- */
.sl-container {
  width: 100%;
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-pad);
}
.sl-section { padding-block: var(--section-pad-y); }
/* --alt is the same single page background; keep it TRANSPARENT so the
   ambient left spine shows through instead of being occluded. */
.sl-section--alt { background: transparent; }
.sl-section--deep { background: var(--bg-deep); }

.sl-section-head {
  display: flex;
  flex-direction: column;
  gap: var(--sp-4);
  max-width: 760px;
}
.sl-section-head h2 { font-size: var(--fs-display-2); line-height: var(--lh-h1); }
.sl-lead, .sl-section-head .sl-lead {
  font-family: var(--font-ui);
  font-size: var(--fs-lead);
  color: var(--text-body);
  font-weight: var(--fw-regular);
  line-height: var(--lh-h3);
  max-width: 56ch;
}
.sl-eyebrow {
  font-family: var(--font-ui);
  font-size: var(--fs-label);
  font-weight: var(--fw-medium);
  letter-spacing: var(--ls-eyebrow);
  text-transform: uppercase;
  color: var(--text-muted);
}

/* Visually-hidden helper for accessible labels */
.sl-sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}