/* Apex Soar Global — site stylesheet
   Sections: fonts, tokens, base, layout, type, buttons, header, drawer, hero,
   page hero, media, cards, bands, tables, tabs, notes, forms, footer,
   mobile bar, responsive, utilities. */

/* ---------- fonts (self-hosted Archivo, SIL OFL) ---------- */
@font-face {
  font-family: "Archivo";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  font-stretch: 62% 125%;
  src: url("../fonts/archivo-latin-wdth-normal.woff2") format("woff2-variations"),
       url("../fonts/archivo-latin-wdth-normal.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: "Archivo";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  font-stretch: 62% 125%;
  src: url("../fonts/archivo-latin-ext-wdth-normal.woff2") format("woff2-variations"),
       url("../fonts/archivo-latin-ext-wdth-normal.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;
}

/* ---------- tokens ---------- */
:root {
  --ink: #13233A;
  --ink-2: #3B4A5E;
  --muted: #5B6878;
  --paper: #F1F3F4;
  --white: #FFFFFF;
  --rule: #D5DADF;
  --rule-soft: #E6E9EC;
  --navy: #13233A;
  --navy-2: #1B2F4B;
  --on-navy: #C7D1DD;
  --on-navy-muted: #8D9AAD;
  --navy-rule: rgba(255, 255, 255, .16);

  --he: #1D63C9;
  --he-tint: #E4EEFB;
  --he-rule: #C9DBF3;
  --he-light: #8DB8F2;

  --bu: #C1440E;
  --bu-fill: #E5541B;
  --bu-tint: #FCE9DF;
  --bu-rule: #F5CDB8;
  --bu-light: #F59A6B;

  --co: #4C5D70;
  --co-tint: #E6EAEE;
  --co-rule: #CED6DE;

  --ac-tint: #ECEEF0;

  --warn: #A16207;
  --warn-bg: #FDF3DC;
  --warn-rule: #F0DDB0;
  --error: #B42318;

  --cta: #C1440E;
  --cta-hover: #A3390B;

  --font: "Archivo", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --maxw: 1240px;
  --gutter: 24px;
  --section: 104px;
  --header-h: 72px;
}

/* ---------- base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--header-h) + 16px); }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body {
  margin: 0;
  background: var(--white);
  color: var(--ink);
  font-family: var(--font);
  font-size: 17px;
  line-height: 1.6;
  text-rendering: optimizeLegibility;
}
body.drawer-open { overflow: hidden; }
img, svg { display: block; max-width: 100%; }
a { color: var(--he); }
a:hover { color: var(--ink); }
:focus-visible { outline: 3px solid var(--he); outline-offset: 2px; }
.on-dark :focus-visible { outline-color: #FFFFFF; }
sub { font-size: 0.62em; line-height: 0; vertical-align: -0.18em; }
h1, h2, h3, p, figure, dl, dd, blockquote { margin: 0; }
h1, h2, h3 { text-wrap: balance; }
ul, ol { margin: 0; padding: 0; }
.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;
}
.skip-link {
  position: absolute; left: 16px; top: -60px; z-index: 100;
  padding: 10px 16px; background: var(--white); color: var(--ink); font-weight: 650;
}
.skip-link:focus { top: 12px; }

/* ---------- layout ---------- */
.container { max-width: var(--maxw); margin: 0 auto; padding-left: var(--gutter); padding-right: var(--gutter); }
.section { padding: var(--section) 0; }
.section--canvas { background: var(--paper); }
.section--ink { background: var(--navy); color: var(--on-navy); }
.section--tight { padding: 72px 0; }

.section__head { max-width: 760px; margin-bottom: 48px; }
.section__head .t-heading-lg { margin-top: 14px; }
.section__head .t-lead { margin-top: 16px; }
.section__head--flush { margin-bottom: 0; }

.grid { display: grid; gap: 24px; }
.grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 40px 72px; align-items: start; }
.split--wide-left { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); }
.split--center { align-items: center; }
.split__body { color: var(--ink-2); }
.split__body > * + * { margin-top: 16px; }

.stack > * + * { margin-top: 24px; padding-top: 24px; border-top: 1px solid var(--rule); }

/* ---------- type ---------- */
.eyebrow {
  display: inline-flex; align-items: center; gap: 10px;
  font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; line-height: 1.3;
  color: var(--eyebrow, var(--ink-2));
}
.eyebrow::before { content: ""; flex: 0 0 20px; width: 20px; height: 2px; background: currentColor; }
.eyebrow--he { --eyebrow: var(--he); }
.eyebrow--bu { --eyebrow: var(--bu); }
.eyebrow--co { --eyebrow: var(--co); }
.eyebrow--light { --eyebrow: var(--he-light); }

.t-display-xl {
  font-size: clamp(38px, 4.4vw, 62px); line-height: 1.04; font-weight: 800;
  font-stretch: 112%; letter-spacing: -0.018em;
}
.t-display-lg {
  font-size: clamp(34px, 3.7vw, 52px); line-height: 1.06; font-weight: 800;
  font-stretch: 112%; letter-spacing: -0.014em;
}
.t-heading-lg {
  font-size: clamp(28px, 2.9vw, 40px); line-height: 1.1; font-weight: 800;
  font-stretch: 110%; letter-spacing: -0.01em;
}
.t-heading-md { font-size: 24px; line-height: 1.2; font-weight: 800; font-stretch: 108%; }
.t-heading-sm { font-size: 19px; line-height: 1.3; font-weight: 700; }
.t-lead { font-size: 18.5px; line-height: 1.55; color: var(--ink-2); max-width: 40em; }
.t-sm { font-size: 15.5px; color: var(--ink-2); }
.on-dark .t-heading-lg, .on-dark .t-display-lg, .on-dark .t-heading-md { color: var(--white); }
.on-dark .t-lead, .on-dark .t-sm { color: var(--on-navy); }

/* ---------- buttons and links ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 48px; padding: 0 22px; border: 1.5px solid transparent; border-radius: 6px;
  font: inherit; font-size: 16px; font-weight: 650; line-height: 1.2; text-align: center;
  text-decoration: none; cursor: pointer; white-space: nowrap;
  transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}
.btn svg { width: 16px; height: 16px; flex: 0 0 16px; }
.btn--primary { background: var(--cta); color: var(--white); }
.btn--primary:hover { background: var(--cta-hover); color: var(--white); }
.btn--light { background: var(--white); color: var(--ink); }
.btn--light:hover { background: var(--paper); color: var(--ink); }
.btn--outline { border-color: var(--ink); color: var(--ink); background: transparent; }
.btn--outline:hover { background: var(--ink); color: var(--white); }
.btn--sm { min-height: 42px; padding: 0 16px; font-size: 15px; }
.btn--block { width: 100%; }
.btn[disabled] { opacity: .6; cursor: progress; }

.quiet {
  display: inline-flex; align-items: center; gap: 8px;
  color: var(--quiet, var(--ink)); font-weight: 650; text-decoration: none;
  border-bottom: 1.5px solid currentColor; padding-bottom: 2px; line-height: 1.3;
}
.quiet svg { width: 15px; height: 15px; flex: 0 0 15px; transition: transform .15s ease; }
.quiet:hover { color: var(--quiet-hover, var(--cta)); }
.quiet:hover svg { transform: translateX(3px); }
.quiet--he { --quiet: var(--he); }
.quiet--bu { --quiet: var(--bu); }
.on-dark .quiet { --quiet: var(--white); --quiet-hover: var(--he-light); }
.action-row { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 28px; margin-top: 32px; }

/* ---------- header ---------- */
.site-header {
  position: sticky; top: 0; z-index: 50;
  background: var(--white); border-bottom: 1px solid var(--rule);
}
.site-header__inner { display: flex; align-items: center; gap: 24px; min-height: var(--header-h); }
.brand { flex: 0 0 auto; display: flex; align-items: center; gap: 12px; color: var(--ink); text-decoration: none; }
.brand:hover { color: var(--ink); }
.brand__mark { flex: 0 0 38px; width: 38px; height: 38px; }
.brand__name { display: flex; flex-direction: column; line-height: 1; }
.brand__word { font-weight: 800; font-stretch: 125%; font-size: 18px; letter-spacing: .05em; }
.brand__legal { margin-top: 5px; font-size: 11.5px; font-weight: 500; color: var(--muted); }
.on-dark .brand, .on-dark .brand:hover { color: var(--white); }
.on-dark .brand__legal { color: var(--on-navy-muted); }

.nav { display: flex; align-items: center; gap: 2px; margin-left: auto; }
.nav__link {
  display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 11px;
  color: var(--ink-2); font-size: 15px; font-weight: 550; text-decoration: none; white-space: nowrap;
}
.nav__link:hover { color: var(--ink); }
.nav__link[aria-current="page"] { color: var(--ink); font-weight: 700; box-shadow: inset 0 -2px 0 var(--cta); }
.nav__dot { flex: 0 0 8px; width: 8px; height: 8px; border-radius: 50%; background: var(--dot, var(--ink-2)); }
.nav__dot--he { --dot: var(--he); }
.nav__dot--bu { --dot: var(--bu-fill); }
.header__actions { display: flex; align-items: center; gap: 10px; }
.menu-btn {
  display: none; align-items: center; justify-content: center; gap: 8px;
  min-width: 44px; min-height: 44px; padding: 0 12px; border: 1.5px solid var(--rule); border-radius: 6px;
  background: var(--white); color: var(--ink); font: inherit; font-size: 15px; font-weight: 600; cursor: pointer;
}
.menu-btn svg { width: 20px; height: 20px; }

/* ---------- drawer (mobile menu) ---------- */
.drawer, .drawer-backdrop { display: none; }
.js .drawer {
  position: fixed; top: 0; right: 0; bottom: 0; z-index: 70;
  width: min(380px, 88vw); background: var(--white);
  display: flex; flex-direction: column; box-shadow: -24px 0 48px -24px rgba(19, 35, 58, .45);
}
.js .drawer[hidden] { display: none; }
.js .drawer-backdrop { display: block; position: fixed; inset: 0; z-index: 65; background: rgba(19, 35, 58, .45); }
.js .drawer-backdrop[hidden] { display: none; }
.drawer__head {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  min-height: var(--header-h); padding: 0 20px; border-bottom: 1px solid var(--rule);
}
.drawer .menu-btn { display: inline-flex; }
.drawer__list { list-style: none; flex: 1 1 auto; overflow-y: auto; padding: 8px 20px; }
.drawer__link {
  display: flex; align-items: center; gap: 10px; min-height: 52px;
  border-bottom: 1px solid var(--rule-soft); color: var(--ink); font-size: 17px; font-weight: 600; text-decoration: none;
}
.drawer__link:hover { color: var(--cta); }
.drawer__link[aria-current="page"] { color: var(--cta); }
.drawer__foot { display: flex; flex-direction: column; gap: 10px; padding: 20px; border-top: 1px solid var(--rule); }
.drawer__contact { display: flex; flex-direction: column; gap: 2px; font-size: 15px; }
.drawer__contact a { color: var(--ink); font-weight: 600; text-decoration: none; }

/* ---------- home hero ---------- */
.hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); background: var(--navy); }
.hero__panel {
  grid-column: 1; grid-row: 1;
  display: flex; flex-direction: column; justify-content: center;
  padding: 88px 56px 72px max(var(--gutter), calc(50vw - var(--maxw) / 2 + var(--gutter)));
  color: var(--on-navy);
}
.hero__panel .t-display-xl { margin-top: 20px; color: var(--white); max-width: 13em; }
.hero__lead { margin-top: 22px; font-size: 19px; line-height: 1.55; max-width: 31em; }
.hero__media { grid-column: 2; grid-row: 1; position: relative; min-height: 620px; }
.hero__media .media { position: absolute; inset: 0; }
.hero__media .slot { height: 100%; aspect-ratio: auto; }

.meta {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 0 24px;
  margin-top: 40px; border-top: 1px solid var(--rule);
}
.meta__item { padding-top: 14px; font-size: 13.5px; line-height: 1.4; color: var(--muted); }
.meta__item b { display: block; margin-top: 4px; font-size: 16px; font-weight: 700; color: var(--ink); }
.on-dark .meta { border-top-color: var(--navy-rule); }
.on-dark .meta__item { color: var(--on-navy-muted); }
.on-dark .meta__item b { color: var(--white); }

/* ---------- page hero ---------- */
.page-hero { background: var(--white); border-bottom: 1px solid var(--rule); }
.page-hero--he { background: var(--he-tint); border-bottom-color: var(--he-rule); }
.page-hero--bu { background: var(--bu-tint); border-bottom-color: var(--bu-rule); }
.page-hero--neutral { background: var(--paper); }
.page-hero__inner {
  display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 32px 72px; align-items: end;
  padding-top: 48px; padding-bottom: 64px;
}
.page-hero .t-display-lg { margin-top: 20px; max-width: 14em; }
.page-hero__lead { font-size: 18.5px; line-height: 1.55; color: var(--ink-2); }
.page-hero .meta { margin-top: 28px; }
.page-hero--he .meta, .page-hero--bu .meta { border-top-color: rgba(19, 35, 58, .18); }
.crumb { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; font-size: 14px; color: var(--ink-2); }
.crumb a { color: var(--ink-2); }
.crumb a:hover { color: var(--ink); }
.crumb [aria-current="page"] { color: var(--ink); font-weight: 600; }

/* ---------- media and image slots ---------- */
.media { min-width: 0; }
.slot {
  position: relative; overflow: hidden; display: flex; align-items: center; justify-content: center;
  aspect-ratio: 3 / 2; background: var(--slot-bg, var(--he-tint));
}
.slot--he { --slot-bg: var(--he-tint); }
.slot--bu { --slot-bg: var(--bu-tint); }
.slot--co { --slot-bg: var(--co-tint); }
.slot--ac { --slot-bg: var(--ac-tint); }
.slot--white { --slot-bg: var(--white); }
.slot__photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.slot__illus { width: 78%; height: 80%; object-fit: contain; }
.slot__id {
  display: none; position: absolute; right: 12px; top: 12px; padding: 4px 9px; border-radius: 3px;
  background: var(--white); border: 1px solid var(--rule); color: var(--ink-2); font-size: 12px; font-weight: 600;
}
.show-slots .slot__id { display: block; }
.media__caption { margin-top: 10px; font-size: 13.5px; line-height: 1.45; color: var(--muted); }
.on-dark .media__caption { color: var(--on-navy-muted); }

/* ---------- cards ---------- */
.line-card {
  display: flex; height: 100%; min-width: 0;
  background: var(--white); border: 1px solid var(--rule); border-top: 4px solid var(--line, var(--ink));
}
.line-card--he { --line: var(--he); --chip-bg: var(--he-tint); --chip-fg: #16509F; }
.line-card--bu { --line: var(--bu-fill); --chip-bg: var(--bu-tint); --chip-fg: #9C360A; }
.line-card--co { --line: var(--co); --chip-bg: var(--co-tint); --chip-fg: var(--ink-2); }
.line-card__media { flex: 0 0 40%; min-width: 0; }
.line-card__media .media, .line-card__media .slot { height: 100%; }
.line-card__media .slot { aspect-ratio: auto; min-height: 320px; }
.line-card__body { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 12px; padding: 28px 28px 30px; }
.line-card__index { font-size: 13px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--line, var(--muted)); }
.line-card__copy { color: var(--ink-2); font-size: 16px; }
.line-card__foot { margin-top: auto; padding-top: 8px; }

.chips { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; }
.chip {
  padding: 5px 12px; border-radius: 999px; font-size: 13.5px; font-weight: 600; line-height: 1.35;
  background: var(--chip-bg, var(--paper)); color: var(--chip-fg, var(--ink-2));
}

.kv { margin-top: 6px; padding-top: 14px; border-top: 1px solid var(--rule); }
.kv__key { font-size: 13.5px; color: var(--muted); }
.kv__val { margin-top: 2px; font-size: 26px; line-height: 1.1; font-weight: 800; font-stretch: 112%; color: var(--line, var(--ink)); }

.cap {
  height: 100%; display: flex; flex-direction: column; gap: 12px;
  background: var(--white); border: 1px solid var(--rule); padding: 28px 28px 26px;
}
.cap__head { display: flex; align-items: center; gap: 14px; }
.cap__icon {
  flex: 0 0 44px; width: 44px; height: 44px; display: flex; align-items: center; justify-content: center;
  border-radius: 8px; background: var(--icon-bg, var(--paper)); color: var(--icon, var(--ink));
}
.cap__icon svg { width: 22px; height: 22px; }
.cap--he { --icon-bg: var(--he-tint); --icon: var(--he); }
.cap--bu { --icon-bg: var(--bu-tint); --icon: var(--bu); }
.cap__title { font-size: 19px; line-height: 1.25; font-weight: 750; }
.cap__copy { color: var(--ink-2); font-size: 16px; }
.cap__list {
  list-style: none; display: flex; flex-wrap: wrap; gap: 4px 18px; margin-top: auto; padding-top: 14px;
  border-top: 1px solid var(--rule-soft); font-size: 14px; font-weight: 600; color: var(--muted);
}

.numbered { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px 24px; }
.numbered__item { min-width: 0; border-top: 2px solid var(--ink); padding-top: 20px; }
.numbered__num { display: block; font-weight: 900; font-stretch: 125%; font-size: 44px; line-height: 1; color: var(--num, var(--he)); }
.numbered__label { margin-top: 16px; font-size: 13px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.numbered__title { margin-top: 6px; font-size: 21px; line-height: 1.25; font-weight: 750; }
.numbered__copy { margin-top: 8px; color: var(--ink-2); font-size: 16px; }

.steps { list-style: none; border-top: 1px solid var(--rule); }
.step { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 8px 24px; padding: 24px 0; border-bottom: 1px solid var(--rule); }
.steps--bu .step__num { color: var(--bu); }
.step__num { font-weight: 900; font-stretch: 125%; font-size: 32px; line-height: 1; color: var(--he); }
.step__title { font-size: 20px; line-height: 1.3; font-weight: 750; }
.step__copy { margin-top: 6px; color: var(--ink-2); font-size: 16px; }
.step > .step__copy { margin-top: 2px; }

.ops { height: 100%; background: var(--white); border: 1px solid var(--rule); border-top: 4px solid var(--ink); padding: 28px 30px 30px; }
.ops--he { border-top-color: var(--he); }
.ops__sub { margin-top: 6px; font-size: 15px; color: var(--muted); }
.dots { list-style: none; display: flex; flex-direction: column; gap: 8px; margin-top: 18px; font-size: 16px; }
.dots li { position: relative; padding-left: 19px; }
.dots li::before {
  content: ""; position: absolute; left: 0; top: calc(0.8em - 3px); width: 7px; height: 7px;
  background: var(--dot, var(--ink));
}
.dots--he { --dot: var(--he); }
.dots--bu { --dot: var(--bu-fill); }
.dots--co { --dot: var(--co); }

.group { height: 100%; background: var(--white); border: 1px solid var(--rule); padding: 24px 26px 26px; }
.group__title { font-size: 18px; line-height: 1.3; font-weight: 750; }
.group .dots { margin-top: 12px; font-size: 15.5px; }

/* ---------- bands ---------- */
.also { background: var(--white); border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
.also__inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 24px 48px; align-items: center; padding-top: 40px; padding-bottom: 40px; }
.also__copy { margin-top: 10px; font-size: 15.5px; color: var(--ink-2); max-width: 26em; }
.also__list { list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.also__item {
  height: 100%; display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 20px 22px; border: 1px solid var(--rule); color: var(--ink); text-decoration: none;
  transition: border-color .15s ease;
}
.also__item:hover { color: var(--ink); border-color: var(--ink); }
.also__title { display: block; font-size: 18px; line-height: 1.3; font-weight: 750; }
.also__meta { display: block; margin-top: 4px; font-size: 14.5px; color: var(--muted); }
.also__item svg { flex: 0 0 18px; width: 18px; height: 18px; color: var(--cta); }

.proof { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px 24px; margin-top: 48px; }
.proof__item { min-width: 0; border-top: 1px solid var(--navy-rule); padding-top: 20px; }
.proof__label { font-size: 13px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--he-light); }
.proof__value { margin-top: 10px; font-size: 23px; line-height: 1.2; font-weight: 800; font-stretch: 110%; color: var(--white); }
.proof__copy { margin-top: 10px; font-size: 15.5px; color: var(--on-navy); }

.cta-band { background: var(--navy); color: var(--on-navy); padding: 88px 0; }
.cta-band--bu { background: var(--bu); color: #FFE7DB; }
.cta-band__inner { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); gap: 32px 64px; align-items: end; }
.cta-band .t-display-lg { margin-top: 16px; color: var(--white); max-width: 15em; }
.cta-band__sub { margin-top: 16px; max-width: 36em; font-size: 18px; line-height: 1.55; }
.cta-band__side { display: flex; flex-direction: column; align-items: flex-start; gap: 18px; }
.cta-band__mail { color: var(--white); font-size: 17px; font-weight: 650; text-underline-offset: 4px; }
.cta-band__mail:hover { color: var(--white); text-decoration-thickness: 2px; }
.cta-band--bu .eyebrow { --eyebrow: #FFE7DB; }
.cta-band--bu .btn--primary { background: var(--white); color: var(--bu); }
.cta-band--bu .btn--primary:hover { background: #FFF3EC; color: var(--cta-hover); }

.safety { background: var(--warn-bg); border-top: 1px solid var(--warn-rule); border-bottom: 1px solid var(--warn-rule); padding: 48px 0; }
.safety__inner { display: grid; grid-template-columns: minmax(0, 300px) minmax(0, 1fr); gap: 20px 56px; align-items: start; }
.safety__title { display: flex; align-items: center; gap: 14px; font-size: 22px; line-height: 1.2; font-weight: 800; font-stretch: 110%; }
.safety__title svg { flex: 0 0 36px; width: 36px; height: 36px; color: var(--warn); }
.safety__list { list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 32px; font-size: 16px; }
.safety__list li { position: relative; padding-left: 19px; }
.safety__list li::before { content: ""; position: absolute; left: 0; top: calc(0.8em - 3px); width: 7px; height: 7px; background: var(--warn); }

/* ---------- tables ---------- */
.spec { background: var(--white); border: 1px solid var(--rule); overflow-x: auto; }
.spec table { width: 100%; min-width: 760px; border-collapse: collapse; font-size: 15px; line-height: 1.45; }
.spec thead th { padding: 14px 18px; background: var(--navy); color: var(--white); font-size: 14px; font-weight: 650; text-align: left; white-space: nowrap; }
.spec tbody th, .spec td { padding: 16px 18px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--rule); }
.spec tbody tr:last-child th, .spec tbody tr:last-child td { border-bottom: 0; }
.spec tbody tr:nth-child(even) { background: #F7F9FA; }
.spec td { color: var(--ink-2); }
.spec__name { font-weight: 700; color: var(--ink); }
.spec__code { display: block; margin-top: 3px; font-size: 12.5px; font-weight: 650; letter-spacing: .05em; color: var(--muted); font-variant-numeric: tabular-nums; }

/* ---------- tabs ---------- */
.tabbar { display: none; }
.js .tabbar {
  display: flex; gap: 4px; margin-bottom: 36px; border-bottom: 1px solid var(--rule);
  overflow-x: auto; scrollbar-width: none;
}
.tab {
  flex: 0 0 auto; min-height: 50px; padding: 0 18px; border: 0; border-bottom: 3px solid transparent; margin-bottom: -1px;
  background: none; color: var(--ink-2); font: inherit; font-size: 16px; font-weight: 600; cursor: pointer; white-space: nowrap;
}
.tab:hover { color: var(--ink); }
.tab[aria-selected="true"] { color: var(--ink); border-bottom-color: var(--cta); }
.tabpanel + .tabpanel { margin-top: 72px; }
.js .tabs:not(.tabs-ready) .tabpanel + .tabpanel { display: none; }
.js .tabpanel + .tabpanel { margin-top: 0; }
.tabpanel__title { font-size: 26px; line-height: 1.2; font-weight: 800; font-stretch: 110%; margin-bottom: 12px; }
.js .tabpanel__title { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.tabpanel__lead { margin-bottom: 24px; }

/* ---------- notes and definition lists ---------- */
.note {
  display: flex; gap: 12px; align-items: flex-start; margin-top: 24px; padding: 16px 18px;
  background: var(--white); border: 1px solid var(--rule); border-left: 3px solid var(--note, var(--ink-2));
  font-size: 15px; line-height: 1.5; color: var(--ink-2);
}
.note svg { flex: 0 0 18px; width: 18px; height: 18px; margin-top: 2px; color: var(--note, var(--ink-2)); }
.note--he { --note: var(--he); }
.note--bu { --note: var(--bu); }
.note--warn { --note: var(--warn); background: var(--warn-bg); border-color: var(--warn-rule); border-left-color: var(--warn); color: var(--ink); }

.deflist { border-top: 1px solid var(--rule); }
.deflist__row { display: grid; grid-template-columns: minmax(0, 190px) minmax(0, 1fr); gap: 6px 32px; padding: 18px 0; border-bottom: 1px solid var(--rule); }
.deflist__key { font-weight: 700; }
.deflist__val { color: var(--ink-2); }
.deflist__val a { color: var(--he); }

.faq { border-top: 1px solid var(--rule); }
.faq__item { padding: 22px 0; border-bottom: 1px solid var(--rule); }
.faq__q { font-size: 18px; line-height: 1.35; font-weight: 700; }
.faq__a { margin-top: 8px; color: var(--ink-2); max-width: 46em; }

/* ---------- forms ---------- */
.contact-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 32px; align-items: start; }
.contact-aside { display: flex; flex-direction: column; gap: 16px; }
.contact-card { background: var(--navy); color: var(--white); padding: 28px; }
.contact-card h2 { font-size: 13px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--he-light); }
.contact-card h2 + a { display: block; margin-top: 6px; color: var(--white); text-decoration: none; overflow-wrap: anywhere; }
.contact-card h2 + a:hover { text-decoration: underline; color: var(--white); }
.contact-card .big { font-weight: 800; font-stretch: 112%; font-size: 26px; }
.contact-card .mid { font-weight: 700; font-size: 19px; }
.contact-card h2 ~ h2 { margin-top: 26px; }
.contact-card .btn { margin-top: 16px; }
.info-card { background: var(--white); border: 1px solid var(--rule); padding: 24px 28px; }
.info-card h2 { font-size: 13px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.info-card h2 ~ h2 { margin-top: 20px; }
.info-card p { margin-top: 6px; font-size: 16px; }

.form-card { background: var(--white); border: 1px solid var(--rule); padding: 36px 40px 40px; min-width: 0; }
.form { display: flex; flex-direction: column; gap: 22px; }
.form__row { display: flex; flex-wrap: wrap; gap: 20px; }
.field { flex: 1 1 240px; min-width: 0; display: flex; flex-direction: column; gap: 6px; font-size: 15px; font-weight: 600; }
.field__label { display: block; }
.form > .field { flex: none; }
.field input, .field select, .field textarea {
  width: 100%; min-height: 48px; padding: 0 14px; border: 1.5px solid #B9C2CE; border-radius: 6px;
  background: var(--white); color: var(--ink); font: inherit; font-size: 16px; font-weight: 400;
}
.field select { padding: 0 12px; }
.field textarea { min-height: 140px; padding: 12px 14px; line-height: 1.5; resize: vertical; }
.field input:hover, .field select:hover, .field textarea:hover { border-color: var(--muted); }
.field input::placeholder, .field textarea::placeholder { color: #6B7785; }
.req { color: var(--cta); }
.options { margin: 0; padding: 0; border: 0; min-width: 0; }
.options legend { padding: 0; font-size: 15px; font-weight: 600; }
.options__list { margin-top: 10px; display: flex; flex-wrap: wrap; gap: 10px; }
.option {
  display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 16px;
  border: 1.5px solid var(--rule); border-radius: 999px; font-size: 15.5px; cursor: pointer;
}
.option:hover { border-color: var(--muted); }
.option input { width: 18px; height: 18px; margin: 0; accent-color: var(--cta); }
.option:has(input:checked) { border-color: var(--cta); background: var(--bu-tint); }
.consent { display: flex; gap: 12px; align-items: flex-start; font-size: 15px; color: var(--ink-2); }
.consent input { flex: 0 0 auto; width: 18px; height: 18px; margin: 3px 0 0; accent-color: var(--cta); }
.form__submit { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 24px; }
.form__submit .btn { min-height: 52px; padding: 0 28px; font-size: 17px; }
.form__hint { font-size: 14.5px; color: var(--muted); }
.field__error, .form__alert { color: var(--error); font-size: 14.5px; font-weight: 500; }
.form__alert { padding: 12px 16px; background: #FDECEA; border-radius: 6px; }
.form__alert[hidden] { display: none; }
.has-error input, .has-error select, .has-error textarea { border-color: var(--error); }
.has-error.consent { color: var(--error); }
.hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.form-done { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; padding: 24px 0; }
.form-done[hidden] { display: none; }
.form-done svg { width: 56px; height: 56px; }
.form-done p { max-width: 32em; color: var(--ink-2); }

/* ---------- where to buy ---------- */
.store { display: flex; flex-wrap: wrap; background: var(--white); border: 1px solid var(--rule); }
.store__mark {
  flex: 0 0 180px; min-height: 200px; display: flex; align-items: center; justify-content: center;
  color: var(--white); font-weight: 900; font-stretch: 125%; font-size: 80px; line-height: 1;
}
.store__mark--us { background: var(--he); }
.store__mark--uk { background: var(--bu); }
.store__body { flex: 1 1 240px; min-width: 0; padding: 32px; display: flex; flex-direction: column; gap: 10px; align-items: flex-start; }
.store__body .btn { margin-top: 12px; }

/* ---------- footer ---------- */
.site-footer { background: #0C1726; color: var(--on-navy); font-size: 15px; }
.footer__top { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 48px 64px; padding: 80px 0 56px; }
.footer__head .brand { margin-bottom: 28px; }
.footer__title { font-size: 28px; line-height: 1.15; font-weight: 800; font-stretch: 110%; color: var(--white); }
.footer__mail {
  display: inline-block; margin-top: 12px; color: var(--white); font-size: clamp(20px, 2vw, 25px); font-weight: 700;
  text-decoration: none; overflow-wrap: anywhere; border-bottom: 2px solid var(--bu-fill);
}
.footer__mail:hover { color: var(--white); border-bottom-color: var(--white); }
.footer__phone { display: block; margin-top: 14px; color: var(--white); font-size: 18px; font-weight: 650; text-decoration: none; }
.footer__phone:hover { color: var(--white); text-decoration: underline; }
.footer__note { margin-top: 14px; max-width: 30em; color: var(--on-navy-muted); }
.footer__cols { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px 24px; }
.footer__col-head { margin-bottom: 14px; font-size: 13px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--white); }
.footer__col ul { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.footer__col a { color: var(--on-navy); text-decoration: none; }
.footer__col a:hover { color: var(--white); text-decoration: underline; }
.footer__col p + p { margin-top: 6px; }
.footer__bottom {
  display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px 24px;
  padding: 22px 0; border-top: 1px solid var(--navy-rule); font-size: 14px; color: var(--on-navy-muted);
}
.footer__legal { display: flex; flex-wrap: wrap; gap: 6px 10px; }
.to-top {
  display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px;
  border: 1px solid var(--navy-rule); border-radius: 50%; background: transparent; color: var(--white); cursor: pointer;
}
.to-top:hover { background: var(--navy); }
.to-top svg { width: 18px; height: 18px; }

/* ---------- mobile action bar ---------- */
.mobile-bar { display: none; }

/* ---------- responsive ---------- */
@media (max-width: 1199px) {
  .js .nav { display: none; }
  .js .menu-btn { display: inline-flex; }
  .header__actions { margin-left: auto; }
  .site-header__inner { flex-wrap: wrap; }
  html:not(.js) .nav { flex-wrap: wrap; margin-left: 0; order: 3; flex-basis: 100%; padding-bottom: 8px; }
}
@media (max-width: 1020px) {
  .grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .grid--4, .proof { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .grid--lines { grid-template-columns: minmax(0, 1fr); }
  .footer__top { grid-template-columns: minmax(0, 1fr); }
  .also__inner { grid-template-columns: minmax(0, 1fr); }
  .contact-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 900px) {
  .hero { grid-template-columns: minmax(0, 1fr); }
  .hero__media { grid-column: 1; grid-row: 1; min-height: 0; aspect-ratio: 16 / 10; }
  .hero__panel { grid-column: 1; grid-row: 2; padding: 48px var(--gutter) 56px; }
  .page-hero__inner, .split, .split--wide-left, .cta-band__inner, .safety__inner { grid-template-columns: minmax(0, 1fr); }
  .page-hero__inner { gap: 24px; padding-top: 32px; padding-bottom: 48px; }
  .numbered { grid-template-columns: minmax(0, 1fr); }
  .cta-band__inner { align-items: start; }
}
@media (max-width: 759px) {
  .header__cta { display: none; }
  .mobile-bar {
    display: flex; gap: 10px; position: fixed; left: 0; right: 0; bottom: 0; z-index: 40;
    padding: 10px var(--gutter) calc(10px + env(safe-area-inset-bottom));
    background: var(--white); border-top: 1px solid var(--rule); box-shadow: 0 -10px 24px -18px rgba(19, 35, 58, .5);
  }
  .mobile-bar .btn { flex: 1 1 auto; }
  .mobile-bar__icon {
    flex: 0 0 48px; display: inline-flex; align-items: center; justify-content: center; height: 48px;
    border: 1.5px solid var(--rule); border-radius: 6px; color: var(--ink);
  }
  .mobile-bar__icon svg { width: 20px; height: 20px; }
  body.has-mobile-bar { padding-bottom: calc(68px + env(safe-area-inset-bottom)); }
  .also__list, .safety__list { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 860px) {
  /* specification tables become cards */
  .spec { background: none; border: 0; overflow: visible; }
  .spec table { min-width: 0; }
  .spec thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .spec table, .spec tbody, .spec tr, .spec tbody th, .spec td { display: block; width: 100%; }
  .spec tbody { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; align-items: start; }
  .spec tbody tr, .spec tbody tr:nth-child(even) { background: var(--white); border: 1px solid var(--rule); }
  .spec tbody th { padding: 14px 16px; border-bottom: 1px solid var(--rule); font-size: 16px; }
  .spec td { display: grid; grid-template-columns: minmax(0, 130px) minmax(0, 1fr); gap: 12px; padding: 9px 16px; border-bottom: 1px solid var(--rule-soft); }
  .spec td::before { content: attr(data-label); font-weight: 600; color: var(--muted); font-size: 13.5px; }
  .spec tbody tr td:last-child { border-bottom: 0; }
  .spec tbody tr:last-child th { border-bottom: 1px solid var(--rule); }
}
@media (max-width: 640px) {
  .spec tbody { grid-template-columns: minmax(0, 1fr); }
  :root { --gutter: 16px; --section: 72px; --header-h: 64px; }
  body { font-size: 16.5px; }
  .grid--2, .grid--3, .grid--4, .proof { grid-template-columns: minmax(0, 1fr); }
  .section__head { margin-bottom: 36px; }
  .t-lead, .page-hero__lead, .hero__lead { font-size: 17.5px; }
  .line-card { flex-direction: column; }
  .line-card__media { flex: none; }
  .line-card__media .slot { min-height: 0; aspect-ratio: 4 / 5; }
  .line-card__body { padding: 22px 20px 24px; }
  .cap, .ops, .group { padding: 22px 20px; }
  .deflist__row { grid-template-columns: minmax(0, 1fr); }
  .step { grid-template-columns: 48px minmax(0, 1fr); gap: 4px 16px; }
  .step__num { font-size: 26px; }
  .cta-band { padding: 64px 0; }
  .form-card { padding: 26px 20px 28px; }
  .footer__top { padding: 56px 0 40px; }
  .footer__cols { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .store__mark { flex-basis: 100%; min-height: 120px; font-size: 64px; }
  .brand__legal { display: none; }
}

/* ---------- utilities (last so they win) ---------- */
.mt-16 { margin-top: 16px; }
.mt-24 { margin-top: 24px; }
.mt-32 { margin-top: 32px; }
.mt-40 { margin-top: 40px; }
.mt-48 { margin-top: 48px; }
.mt-64 { margin-top: 64px; }

@media print {
  .site-header, .site-footer, .cta-band, .mobile-bar, .drawer { display: none; }
}