@font-face{font-family:'JetBrains Mono';src:url('/fonts/JetBrainsMono-100-800-normal-latin-ext.woff2')format('woff2');font-weight:100 800;font-style:normal;font-display:swap;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:'JetBrains Mono';src:url('/fonts/JetBrainsMono-100-800-normal-latin.woff2')format('woff2');font-weight:100 800;font-style:normal;font-display:swap;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:'IBM Plex Sans';src:url('/fonts/IBMPlexSans-400-normal-latin-ext.woff2')format('woff2');font-weight:400;font-style:normal;font-display:swap;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:'IBM Plex Sans';src:url('/fonts/IBMPlexSans-400-normal-latin.woff2')format('woff2');font-weight:400;font-style:normal;font-display:swap;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:'IBM Plex Sans';src:url('/fonts/IBMPlexSans-700-normal-latin-ext.woff2')format('woff2');font-weight:700;font-style:normal;font-display:swap;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:'IBM Plex Sans';src:url('/fonts/IBMPlexSans-700-normal-latin.woff2')format('woff2');font-weight:700;font-style:normal;font-display:swap;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{--color-primary:#dc2626;--color-primary-soft:#fce9e9;--color-accent:#f59e0b;--color-secondary:#1e3a5f;--color-text:#c8d6e8;--color-muted:#738698;--color-bg:#080c12;--color-bg-alt:#0f1626;--color-surface:#141d30;--color-border:#243040;--color-on-primary:#ffffff;--color-on-accent:#0b0f13;--color-on-dark:#ffffff;--color-accent-readable:#f59e0b;--footer-bg:#0b0f13;--footer-text:rgba(255,255,255,0.8);--footer-muted:rgba(255,255,255,0.5);--footer-border:rgba(255,255,255,0.12);--space-section-y:clamp(4rem,7vw,6.5rem);--space-section-y-lg:clamp(5.5rem,10vw,9.5rem);--space-container-x:clamp(1.25rem,3vw,2rem);--space-gap:1rem;--spacing-section:clamp(4rem,7vw,6.5rem);--s-1:0.25rem;--s-2:0.5rem;--s-3:0.75rem;--s-4:1rem;--s-5:1.5rem;--s-6:2rem;--s-7:2.5rem;--s-8:3rem;--s-9:4rem;--s-10:5rem;--s-11:6rem;--s-12:8rem;--radius-sm:0;--radius:0.125rem;--radius-lg:0.25rem;--radius-pill:0.25rem;--shadow:none;--shadow-lg:0 0 0 1px rgba(15,23,42,0.12);--font-heading:'JetBrains Mono',sans-serif;--font-body:'IBM Plex Sans',sans-serif;--font-accent:var(--font-heading);--container-width:1200px;--fs-display:clamp(2.25rem,1.6rem + 3.2vw,4rem);--fs-h1:clamp(1.875rem,1.4rem + 2.2vw,3rem);--fs-h2:clamp(1.5rem,1.2rem + 1.5vw,2.25rem);--fs-h3:clamp(1.125rem,1.05rem + 0.3vw,1.3125rem);--fs-body:0.9375rem;--fs-small:0.875rem;--tracking-display:0;--tracking-heading:0;--leading-display:1.1;--leading-heading:1.2;--leading-body:1.65;--measure:65ch}*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}html{font-size:clamp(15px,0.95rem + 0.1vw,17px);scroll-behavior:smooth;-webkit-text-size-adjust:100%}body{font-family:var(--font-body);color:var(--color-text);background:var(--color-bg);line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;font-feature-settings:"kern","liga","ss01"}img,svg,video{display:block;max-width:100%;height:auto}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit;color:inherit}ul,ol{list-style:none}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);line-height:var(--leading-heading);letter-spacing:var(--tracking-heading);color:var(--color-text);text-wrap:balance}h1{line-height:var(--leading-display);letter-spacing:var(--tracking-display)}p{margin:0;text-wrap:pretty;max-width:var(--measure)}::selection{background:var(--color-primary);color:var(--color-on-primary)}:focus-visible{outline:2px solid var(--color-primary);outline-offset:3px;border-radius:var(--radius-sm)}.sr-only,.visually-hidden{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:-9999px;top:0;z-index:2147483646;background:var(--color-primary);color:var(--color-on-primary);padding:.75rem 1.25rem;border-radius:0 0 var(--radius-sm) 0;font-weight:600;text-decoration:none}.skip-link:focus{left:0}.container{max-width:var(--container-width);margin-inline:auto;padding-inline:var(--space-container-x)}.legal-page{max-width:min(72ch,100%);margin-inline:auto;padding:clamp(4.5rem,9vw,7rem) var(--space-container-x) clamp(3.5rem,7vw,5.5rem);color:var(--color-text)}.legal-page>section+section{margin-top:clamp(2rem,4vw,3rem)}.legal-page h1{font-size:var(--fs-h1);margin-bottom:clamp(1.25rem,2.5vw,2rem)}.legal-page h2{font-size:var(--fs-h2);margin-top:2.25em;margin-bottom:.6em}.legal-page h3{font-size:var(--fs-h3);margin-top:1.75em;margin-bottom:.4em}.legal-page p{margin-bottom:1em;max-width:none;line-height:var(--leading-body)}.legal-page ul,.legal-page ol{margin:0 0 1.25em;padding-left:1.4em;list-style:revert}.legal-page li{margin-bottom:.4em;line-height:var(--leading-body)}.legal-page a{color:var(--color-primary);text-decoration:underline;text-underline-offset:2px}.legal-page:is(h1,h2,h3)+p{margin-top:0}.btn{display:inline-flex;align-items:center;justify-content:center;gap:0.5rem;padding:0.875rem 1.5rem;border-radius:var(--radius-pill);font-weight:600;font-size:1rem;line-height:1.2;border:1.5px solid transparent;cursor:pointer;transition:transform 0.15s,box-shadow 0.15s,background 0.15s,color 0.15s,filter 0.15s;text-decoration:none;white-space:nowrap}.btn:hover{transform:translateY(-1px)}.btn:active{transform:translateY(0) scale(0.98)}.btn:focus-visible{outline:none;box-shadow:0 0 0 4px color-mix(in srgb,var(--color-primary) 30%,transparent)}.btn--primary:focus-visible{box-shadow:var(--shadow-lg),0 0 0 4px color-mix(in srgb,var(--color-primary) 30%,transparent)}.btn--on-dark:focus-visible{box-shadow:0 0 0 4px rgba(255,255,255,0.32)}.btn--primary{background:var(--color-primary);color:var(--color-on-primary);box-shadow:var(--shadow)}.btn--primary:hover{box-shadow:var(--shadow-lg)}.btn--secondary{background:var(--color-surface);color:var(--color-primary);border-color:var(--color-primary)}.btn--secondary:hover{background:var(--color-primary);color:var(--color-on-primary);border-color:var(--color-primary)}.btn--ghost{background:transparent;color:var(--color-text);border-color:transparent}.btn--ghost:hover{background:var(--color-bg-alt)}.page [data-comp] .btn--ghost{color:inherit}.page [data-comp] .btn--ghost:hover{background:color-mix(in srgb,currentColor 12%,transparent)}.btn--on-dark{background:rgba(255,255,255,0.12);color:var(--color-on-dark);border-color:rgba(255,255,255,0.24);backdrop-filter:blur(8px)}.btn--on-dark:hover{background:rgba(255,255,255,0.2)}.btn--sm{padding:0.5rem 1rem;font-size:0.875rem}.btn--lg{padding:1.125rem 2rem;font-size:1.125rem}.sosei-credit{font:400 11px/1.4 system-ui,-apple-system,"Segoe UI",sans-serif;opacity:.5;color:inherit;text-decoration:none;margin-left:auto;white-space:nowrap;flex-shrink:0}.sosei-credit:hover{opacity:.8}.embed-wrap{position:relative;border-radius:var(--radius-lg);overflow:hidden;background:var(--color-bg-alt);box-shadow:var(--shadow-md);max-width:100%}.embed-wrap__frame{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}.embed-wrap__ratio--16x9{padding-top:56.25%}.embed-wrap__ratio--4x3{padding-top:75%}.embed-wrap__ratio--social{padding-top:120%;max-width:560px;margin-inline:auto}.embed-wrap__ratio--newsletter{padding-top:0;min-height:520px;background:var(--color-surface)}.embed-wrap__ratio--newsletter .embed-wrap__frame{position:relative;inset:auto;height:520px}.embed-wrap__ratio--audio{padding-top:0;min-height:152px;background:transparent;box-shadow:none}.embed-wrap__ratio--audio .embed-wrap__frame{position:relative;inset:auto;height:152px}.embed-wrap__ratio--audio-tall{padding-top:0;min-height:450px;background:transparent;box-shadow:none}.embed-wrap__ratio--audio-tall .embed-wrap__frame{position:relative;inset:auto;height:450px}.embed-wrap--widget{padding:2rem 1.5rem;min-height:280px;display:flex;flex-direction:column;justify-content:center;align-items:stretch}.embed-wrap__widget{width:100%}.embed-wrap__placeholder{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0.75rem;text-align:center;padding:1.5rem;background:var(--color-bg-alt);color:var(--color-text);z-index:1}.embed-wrap[data-embed-state="loaded"] .embed-wrap__placeholder{display:none}.embed-wrap[data-embed-state="pending"] .embed-wrap__frame[data-consent]:not([src]){visibility:hidden}.embed-wrap__placeholder-title{font-family:var(--font-heading);font-weight:600;font-size:1.05rem;margin:0}.embed-wrap__placeholder-body{color:var(--color-muted);font-size:0.9rem;margin:0;max-width:36ch}.embed-wrap__load{margin-top:0.5rem}.cookie-banner{position:fixed;bottom:1rem;left:1rem;right:1rem;max-width:600px;margin-inline:auto;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:1.25rem 1.5rem;box-shadow:var(--shadow-lg);z-index:90;display:none;flex-direction:column;gap:0.75rem}.cookie-banner[data-visible="true"]{display:flex}.cookie-banner p{color:var(--color-muted);font-size:0.925rem;line-height:1.5}.cookie-actions{display:flex;gap:0.5rem;flex-wrap:wrap}.cookie-btn{padding:0.55rem 1.1rem;border-radius:var(--radius-pill);font-size:0.9rem;font-weight:600;border:1.5px solid transparent;cursor:pointer;background:var(--color-surface);color:var(--color-text)}.cookie-btn--accept{background:var(--color-primary);color:var(--color-on-primary)}.cookie-btn--reject{background:var(--color-surface);color:var(--color-text);border-color:var(--color-border)}.page{min-height:100vh;display:flex;flex-direction:column}.page__main{flex:1}@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}}@media (prefers-reduced-motion:no-preference){}

/* ── icon size floor (deterministic; components may scale up) ── */
.page .icon{display:inline-block;vertical-align:middle;width:1.5em;height:1.5em;flex:none}
.page li:has(.icon){list-style:none !important}
.page li:has(.icon)::before{content:none !important}

/* ── motion language (CD-declared duration ladder + easing; authored CSS references these) ── */
.page{--motion-fast:125ms;--motion:250ms;--motion-slow:375ms;--motion-ease:cubic-bezier(.16,.84,.44,1)}

/* ── slot floor (deterministic typographic default for inner-role suffixes; components override) ── */
:where(.page) [class$="-eyebrow"]{font-family:var(--font-body);font-size:var(--fs-small);font-weight:600;letter-spacing:.12em;text-transform:uppercase;display:block;margin:0 0 .5rem}
:where(.page) [class$="-title"],:where(.page) [class$="-heading"]{font-family:var(--font-heading);font-size:var(--fs-h2);line-height:var(--leading-heading);letter-spacing:var(--tracking-heading);text-wrap:balance;margin:0 0 var(--space-gap)}
:where(.page) [class$="-subtitle"],:where(.page) [class$="-subheading"]{font-size:var(--fs-body);line-height:var(--leading-body);opacity:.78;margin:0 0 var(--space-gap)}
:where(.page) [class$="-label"]{font-size:var(--fs-small);font-weight:600;letter-spacing:.04em}

/* ── utility floor (global accent-word/section-rule + empty-scrim fill; components override) ── */
:where(.page) .accent-word{color:var(--color-accent-readable);font-style:italic}
:where(.page) .section-rule{border:0;width:100%;height:1px;background:var(--color-border);opacity:.7;margin:var(--space-gap) 0}
:where(.page) [class$="-scrim"],:where(.page) [class$="-overlay"]{background:linear-gradient(105deg,rgba(0,0,0,.5),transparent 42%)}
:where(.page) [data-comp]:has([class$="-bg"])::before{background:linear-gradient(0deg,rgba(0,0,0,.82),rgba(0,0,0,.34) 55%,rgba(0,0,0,.1))}
:where(.page) h1,:where(.page) h2,:where(.page) h3,:where(.page) [class$="-headline"],:where(.page) [class$="-title"]{overflow-wrap:normal;hyphens:auto;text-wrap:balance}
:where(.page) [class$="-text"]{overflow-wrap:break-word}
:where(.page) [data-focal="top"]{object-position:center top!important}
:where(.page) [data-focal="bottom"]{object-position:center bottom!important}
:where(.page) [data-focal="left"]{object-position:left center!important}
:where(.page) [data-focal="right"]{object-position:right center!important}

/* ── tabs behavior-primitive floor (ADR-008; correctness only, AD styles the look) ── */
:where(.page) [data-tabs] [role="tab"]{cursor:pointer}
:where(.page) [role="tabpanel"][hidden]{display:none!important}

/* ── authored component library (experiment) ── */
/* hero (hero) */
.page [data-comp="hero"].hero{position:relative;min-height:100svh;display:flex;align-items:center;overflow:hidden;background:var(--color-bg);margin-top:calc(-1 * 76px);padding-top:calc(76px + var(--space-section-y));padding-bottom:var(--space-section-y);}

.page [data-comp="hero"] .hero-media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center right;z-index:0;transition:transform var(--motion-slow) var(--motion-ease);}

.page [data-comp="hero"].hero:hover .hero-media{transform:scale(1.04);}

.page [data-comp="hero"] .hero-scrim{position:absolute;inset:0;z-index:1;pointer-events:none;}

.page [data-comp="hero"] .hero-inner{position:relative;z-index:2;max-width:var(--container-width);margin-inline:auto;padding-inline:var(--space-container-x);width:100%;}

.page [data-comp="hero"] .hero-content{max-width:min(580px,100%);display:flex;flex-direction:column;gap:calc(var(--space-gap) * 0.75);}

.page [data-comp="hero"] .hero-eyebrow{font-family:var(--font-heading);font-size:var(--fs-small);color:var(--color-primary);letter-spacing:0.18em;text-transform:uppercase;display:flex;align-items:center;gap:var(--s-2);}

.page [data-comp="hero"] .hero-eyebrow::before{content:'';display:inline-block;width:2rem;height:2px;background:var(--color-primary);flex-shrink:0;}

.page [data-comp="hero"] .hero-title{font-family:var(--font-heading);font-size:clamp(2.2rem, 5.2vw, 3.8rem);font-weight:700;line-height:1.15;letter-spacing:-0.02em;color:var(--color-on-dark);margin:0;}

.page [data-comp="hero"] .hero-title-accent{color:var(--color-primary);font-style:normal;font-weight:700;}

.page [data-comp="hero"] .hero-sub{font-family:var(--font-body);font-size:var(--fs-body);line-height:var(--leading-body);color:var(--color-text);max-width:52ch;margin:0;}

.page [data-comp="hero"] .hero-actions{display:flex;flex-wrap:wrap;gap:calc(var(--space-gap) * 0.6);margin-top:calc(var(--space-gap) * 0.25);}

.page [data-comp="hero"] .hero-stats{display:flex;flex-wrap:wrap;gap:var(--space-gap);padding-top:var(--space-gap);border-top:1px solid var(--color-border);margin-top:calc(var(--space-gap) * 0.5);}

.page [data-comp="hero"] .hero-stat{display:flex;flex-direction:column;gap:var(--s-1);}

.page [data-comp="hero"] .hero-stat-num{font-family:var(--font-heading);font-size:var(--fs-h3);font-weight:700;color:inherit;line-height:1;letter-spacing:-0.01em;}

.page [data-comp="hero"] .hero-stat-label{font-family:var(--font-body);font-size:var(--fs-small);color:var(--color-muted);letter-spacing:0.04em;}

@media (max-width:700px){.page [data-comp="hero"].hero{min-height:100svh;align-items:flex-end;padding-bottom:calc(var(--space-section-y) * 1.25);}.page [data-comp="hero"] .hero-media{object-position:60% center;}.page [data-comp="hero"] .hero-scrim{}.page [data-comp="hero"] .hero-content{max-width:100%;}.page [data-comp="hero"] .hero-stats{gap:calc(var(--space-gap)*0.75);}}
/* pageBanner */
/* ===== pageBanner ===== */

.page [data-comp="pageBanner"].pageBanner {
  position: relative;
  min-height: clamp(11rem, 26vh, 18rem);
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  background: var(--color-bg-alt);
  color: var(--color-on-dark);
  border-bottom: 1px solid var(--color-border);
}

/* Background image — covers the full band */
.page [data-comp="pageBanner"] .pageBanner-media {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  z-index: 0;
  transition: transform var(--motion-slow) var(--motion-ease);
}

.page [data-comp="pageBanner"].pageBanner:hover .pageBanner-media {
  transform: scale(1.04);
}

/* Dark scrim — heavier on left for copy legibility, fades right */
.page [data-comp="pageBanner"] .pageBanner-scrim {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
}

/* When no image is present the scrim is invisible and bg-alt shows through */

/* Inner container — flush-bottom alignment so content sits above border */
.page [data-comp="pageBanner"] .pageBanner-inner {
  position: relative;
  z-index: 2;
  max-width: var(--container-width);
  margin-inline: auto;
  padding-inline: var(--space-container-x);
  padding-block: var(--space-section-y);
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: calc(var(--space-gap) * 0.4);
  /* 3px primary left accent rule — the section heading signature move */
  border-left: 3px solid var(--color-primary);
  padding-left: calc(var(--space-container-x) + var(--space-gap));
}

/* Eyebrow — page/section label */
.page [data-comp="pageBanner"] .pageBanner-eyebrow {
  font-family: var(--font-heading);
  font-size: var(--fs-small);
  color: var(--color-primary);
  letter-spacing: 0.18em;
  text-transform: uppercase;
  display: flex;
  align-items: center;
  gap: var(--s-2);
  line-height: 1;
}

.page [data-comp="pageBanner"] .pageBanner-eyebrow::before {
  content: '';
  display: inline-block;
  width: 1.5rem;
  height: 2px;
  background: var(--color-primary);
  flex-shrink: 0;
}

/* Main page title — h1 treatment */
.page [data-comp="pageBanner"] .pageBanner-title {
  font-family: var(--font-heading);
  font-size: clamp(1.75rem, 4vw, 2.8rem);
  font-weight: 700;
  line-height: var(--leading-heading);
  letter-spacing: var(--tracking-heading);
  color: var(--color-on-dark);
  margin: 0;
}

/* Subtitle / lead sentence */
.page [data-comp="pageBanner"] .pageBanner-subtitle {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--leading-body);
  color: var(--color-text);
  max-width: 60ch;
  margin: 0;
}

/* ── Responsive ── */
@media (max-width: 700px) {
  .page [data-comp="pageBanner"].pageBanner {
    align-items: flex-end;
    min-height: clamp(10rem, 32vw, 14rem);
  }

  .page [data-comp="pageBanner"] .pageBanner-scrim {
  }

  .page [data-comp="pageBanner"] .pageBanner-inner {
    padding-block: calc(var(--space-section-y) * 0.75);
    gap: calc(var(--space-gap) * 0.35);
  }

  .page [data-comp="pageBanner"] .pageBanner-title {
    font-size: clamp(1.5rem, 6vw, 2rem);
  }
}

/* statBand */

/* ============================================================
   statBand — full-bleed proof band
   terminal-dev / Meixit design system
   ============================================================ */

.page [data-comp="statBand"].statBand {
  background: var(--color-bg-alt);
  border-top: 1px solid var(--color-border);
  border-bottom: 1px solid var(--color-border);
  padding-block: var(--space-section-y);
  color: var(--color-on-dark);
}

.page [data-comp="statBand"] .statBand-inner {
  max-width: var(--container-width);
  margin-inline: auto;
  padding-inline: var(--space-container-x);
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-gap);
  justify-content: space-between;
  align-items: stretch;
}

/* ── individual stat item ── */
.page [data-comp="statBand"] .statBand-item {
  flex: 1 1 160px;
  display: flex;
  flex-direction: column;
  gap: var(--s-1);
  padding: calc(var(--space-gap) * 0.75) var(--space-gap);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-top: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow);
  transition:
    transform var(--motion) var(--motion-ease),
    box-shadow var(--motion) var(--motion-ease),
    border-color var(--motion-fast) var(--motion-ease);
  cursor: default;
  position: relative;
}

.page [data-comp="statBand"] .statBand-item:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-lg);
  border-top-color: var(--color-primary);
}

/* ── number — amber mono, display-scale ── */
.page [data-comp="statBand"] .statBand-num {
  font-family: var(--font-heading);
  font-size: var(--fs-h1);
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.02em;
  color: inherit;
  display: block;
}

/* ── label — muted mono, tight caps ── */
.page [data-comp="statBand"] .statBand-label {
  font-family: var(--font-heading);
  font-size: var(--fs-small);
  font-weight: 400;
  color: var(--color-muted);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  line-height: var(--leading-heading);
  display: block;
}

/* ── responsive: 2-up on mid, stack on narrow ── */
@media (max-width: 900px) {
  .page [data-comp="statBand"] .statBand-inner {
    gap: calc(var(--space-gap) * 0.75);
  }

  .page [data-comp="statBand"] .statBand-item {
    flex: 1 1 calc(50% - var(--space-gap));
  }
}

@media (max-width: 500px) {
  .page [data-comp="statBand"] .statBand-item {
    flex: 1 1 100%;
  }

  .page [data-comp="statBand"] .statBand-num {
    font-size: var(--fs-h2);
  }
}

/* featureGrid */

/* =============================================
   featureGrid — flat scoped CSS
   Terminal-dev dark aesthetic | Meixit DS
   ============================================= */

.page [data-comp="featureGrid"].featureGrid {
  background: var(--color-bg-alt);
  padding-block: var(--space-section-y);
  color: var(--color-text);
}

.page [data-comp="featureGrid"] .featureGrid-inner {
  max-width: var(--container-width);
  margin-inline: auto;
  padding-inline: var(--space-container-x);
  display: flex;
  flex-direction: column;
  gap: var(--space-gap);
}

/* Eyebrow label */
.page [data-comp="featureGrid"] .featureGrid-header {
  display: block;
  font-family: var(--font-heading);
  font-size: var(--fs-small);
  color: var(--color-primary);
  text-transform: uppercase;
  letter-spacing: 0.18em;
  margin-bottom: calc(var(--space-gap) * 0.25);
}

/* Section lead / heading — page author places an <h2> inside or uses this as-is */
.page [data-comp="featureGrid"] .featureGrid-lead {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--leading-body);
  color: var(--color-muted);
  max-width: var(--measure);
  margin: 0;
  /* tighten gap between eyebrow and grid */
  margin-top: calc(var(--space-gap) * -0.25);
}

/* 3- or 4-column responsive grid */
.page [data-comp="featureGrid"] .featureGrid-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(260px, 100%), 1fr));
  gap: var(--space-gap);
}

/* -----------------------------------------------
   Card — flat, dense, terminal aesthetic
   ----------------------------------------------- */
.page [data-comp="featureGrid"] .featureGrid-card {
  position: relative;
  background: var(--color-surface);
  border-radius: var(--radius-sm);
  border: 1px solid var(--color-border);
  border-top: 1px solid var(--color-border);
  box-shadow: var(--shadow);
  padding: calc(var(--space-gap) * 1.25) var(--space-gap);
  display: flex;
  flex-direction: column;
  gap: calc(var(--space-gap) * 0.6);
  /* Animate transform + shadow + top-border colour */
  transition:
    transform var(--motion) var(--motion-ease),
    box-shadow var(--motion) var(--motion-ease),
    border-color var(--motion-fast) var(--motion-ease);
  overflow: hidden;
}

/* Hover: lift + shadow-lg + primary top accent */
.page [data-comp="featureGrid"] .featureGrid-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-lg);
  border-top-color: var(--color-primary);
  border-right-color: var(--color-border);
  border-bottom-color: var(--color-border);
  border-left-color: var(--color-border);
}

/* Icon */
.page [data-comp="featureGrid"] .featureGrid-card-icon {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 2.25rem;
  height: 2.25rem;
  color: inherit;
  flex-shrink: 0;
  transition: color var(--motion-fast) var(--motion-ease);
}

.page [data-comp="featureGrid"] .featureGrid-card-icon svg {
  width: 100%;
  height: 100%;
  display: block;
}

.page [data-comp="featureGrid"] .featureGrid-card:hover .featureGrid-card-icon {
  color: var(--color-primary);
}

/* Card heading — mono, section heading treatment with 3px left rule */
.page [data-comp="featureGrid"] .featureGrid-card-title {
  font-family: var(--font-heading);
  font-size: var(--fs-h3);
  font-weight: 700;
  line-height: var(--leading-heading);
  letter-spacing: var(--tracking-heading);
  color: var(--color-on-dark);
  margin: 0;
  border-left: 3px solid var(--color-primary);
  padding-left: var(--space-gap);
  transition: border-color var(--motion-fast) var(--motion-ease);
}

/* Card body text */
.page [data-comp="featureGrid"] .featureGrid-card-body {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--leading-body);
  color: var(--color-text);
  margin: 0;
  flex: 1;
  max-width: var(--measure);
}

/* -----------------------------------------------
   Section heading (h2 authored inside .featureGrid-inner
   outside the grid, or placed by page author above grid)
   — matching the Design Language Contract
   ----------------------------------------------- */
.page [data-comp="featureGrid"] .featureGrid-inner > h2 {
  font-family: var(--font-heading);
  font-size: var(--fs-h2);
  font-weight: 700;
  line-height: var(--leading-heading);
  letter-spacing: var(--tracking-heading);
  color: var(--color-on-dark);
  margin: 0;
  border-left: 3px solid var(--color-primary);
  padding-left: var(--space-gap);
}

/* -----------------------------------------------
   Responsive
   ----------------------------------------------- */
@media (max-width: 900px) {
  .page [data-comp="featureGrid"] .featureGrid-grid {
    grid-template-columns: repeat(auto-fill, minmax(min(220px, 100%), 1fr));
  }
}

@media (max-width: 600px) {
  .page [data-comp="featureGrid"] .featureGrid-grid {
    grid-template-columns: 1fr;
  }

  .page [data-comp="featureGrid"] .featureGrid-card {
    padding: var(--space-gap) calc(var(--space-gap) * 0.875);
  }
}

/* -----------------------------------------------
   Reduced-motion safety
   ----------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  .page [data-comp="featureGrid"] .featureGrid-card {
    transition: none;
  }

  .page [data-comp="featureGrid"] .featureGrid-card-icon {
    transition: none;
  }
}

/* splitFeature */
/* ============================================================
   splitFeature — two-column split: media frame + copy column
   ============================================================ */

.page [data-comp="splitFeature"].splitFeature {
  background: var(--color-bg-alt);
  padding-block: var(--space-section-y);
  color: var(--color-text);
}

.page [data-comp="splitFeature"] .splitFeature-inner {
  max-width: var(--container-width);
  margin-inline: auto;
  padding-inline: var(--space-container-x);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: calc(var(--space-gap) * 2);
  align-items: center;
}

/* Reverse modifier — flips column order */
.page [data-comp="splitFeature"].splitFeature--reverse .splitFeature-inner {
  direction: rtl;
}

.page [data-comp="splitFeature"].splitFeature--reverse .splitFeature-inner > * {
  direction: ltr;
}

/* ── Media frame ── */
.page [data-comp="splitFeature"] .splitFeature-media {
  position: relative;
  overflow: hidden;
  border-radius: var(--radius-sm);
  border: 1px solid var(--color-border);
  box-shadow: var(--shadow);
  background: var(--color-surface);
  /* Terminal-frame top accent bar */
  border-top: 3px solid var(--color-primary);
}

.page [data-comp="splitFeature"] .splitFeature-media::before {
  /* Pseudo terminal-chrome bar with dot indicators */
  content: '● ● ●';
  display: block;
  font-family: var(--font-heading);
  font-size: var(--fs-small);
  letter-spacing: 0.25em;
  color: var(--color-muted);
  background: var(--color-surface);
  padding: 0.45rem calc(var(--space-gap) * 0.5);
  border-bottom: 1px solid var(--color-border);
}

.page [data-comp="splitFeature"] .splitFeature-media-img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 320px;
  object-fit: cover;
  object-position: center;
  transition: transform var(--motion-slow) var(--motion-ease);
}

.page [data-comp="splitFeature"] .splitFeature-media:hover .splitFeature-media-img {
  transform: scale(1.04);
}

/* ── Copy column ── */
.page [data-comp="splitFeature"] .splitFeature-content {
  display: flex;
  flex-direction: column;
  gap: var(--space-gap);
}

/* Eyebrow */
.page [data-comp="splitFeature"] .splitFeature-eyebrow {
  display: inline-block;
  font-family: var(--font-heading);
  font-size: var(--fs-small);
  color: var(--color-primary);
  text-transform: uppercase;
  letter-spacing: 0.18em;
  line-height: 1;
}

/* Section heading with left accent rule */
.page [data-comp="splitFeature"] .splitFeature-title {
  font-family: var(--font-heading);
  font-size: var(--fs-h2);
  font-weight: 700;
  letter-spacing: var(--tracking-heading);
  line-height: var(--leading-heading);
  color: var(--color-on-dark);
  margin: 0;
  border-left: 3px solid var(--color-primary);
  padding-left: var(--space-gap);
}

/* Body text */
.page [data-comp="splitFeature"] .splitFeature-body {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--leading-body);
  color: var(--color-text);
  max-width: var(--measure);
  margin: 0;
}

/* Bullet list */
.page [data-comp="splitFeature"] .splitFeature-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: calc(var(--space-gap) * 0.5);
}

.page [data-comp="splitFeature"] .splitFeature-list-item {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--leading-body);
  color: var(--color-text);
  display: flex;
  align-items: flex-start;
  gap: var(--s-2);
}

/* Accent chevron bullet */
.page [data-comp="splitFeature"] .splitFeature-list-item::before {
  content: '▸';
  font-family: var(--font-heading);
  color: var(--color-primary);
  font-size: var(--fs-small);
  line-height: var(--leading-body);
  flex-shrink: 0;
  margin-top: var(--s-1);
}

/* CTA — positions the btn wrapper; btn itself is pre-styled */
.page [data-comp="splitFeature"] .splitFeature-cta {
  margin-top: calc(var(--space-gap) * 0.25);
  align-self: flex-start;
}

/* ── Responsive ── */
@media (max-width: 900px) {
  .page [data-comp="splitFeature"] .splitFeature-inner {
    grid-template-columns: 1fr;
    gap: var(--space-gap);
  }

  /* RTL reset for reverse on mobile */
  .page [data-comp="splitFeature"].splitFeature--reverse .splitFeature-inner {
    direction: ltr;
  }

  /* Always show media on top on mobile */
  .page [data-comp="splitFeature"] .splitFeature-media {
    order: -1;
  }

  .page [data-comp="splitFeature"] .splitFeature-media-img {
    min-height: 240px;
  }
}

@media (max-width: 480px) {
  .page [data-comp="splitFeature"] .splitFeature-media-img {
    min-height: 200px;
  }

  .page [data-comp="splitFeature"] .splitFeature-title {
    font-size: var(--fs-h3);
  }
}
/* processList */

/* ============================================================
   processList — vertical / horizontal numbered steps
   CLASS CONTRACT: .processList, .processList-inner,
   .processList-header, .processList-lead, .processList-steps,
   .processList-step, .processList-step-num, .processList-step-title,
   .processList-step-body, .processList-connector
   ============================================================ */

.page [data-comp="processList"].processList {
  background: var(--color-bg-alt);
  padding-block: var(--space-section-y);
}

.page [data-comp="processList"] .processList-inner {
  max-width: var(--container-width);
  margin-inline: auto;
  padding-inline: var(--space-container-x);
  display: flex;
  flex-direction: column;
  gap: var(--space-gap);
}

/* ── Eyebrow header ── */
.page [data-comp="processList"] .processList-header {
  display: block;
  font-family: var(--font-heading);
  font-size: var(--fs-small);
  color: var(--color-primary);
  letter-spacing: 0.18em;
  text-transform: uppercase;
  border-left: 3px solid var(--color-primary);
  padding-left: var(--space-gap);
}

/* ── Lead paragraph ── */
.page [data-comp="processList"] .processList-lead {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--leading-body);
  color: var(--color-text);
  max-width: var(--measure);
  margin: 0;
  padding-left: calc(var(--space-gap) + 3px); /* align with eyebrow text */
}

/* ── Steps container — vertical default ── */
.page [data-comp="processList"] .processList-steps {
  display: flex;
  flex-direction: column;
  gap: 0;
  position: relative;
}

/* ── Single step ── */
.page [data-comp="processList"] .processList-step {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: calc(var(--space-gap) * 1.25);
  align-items: flex-start;
  position: relative;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-top: 3px solid transparent;
  border-radius: var(--radius-sm);
  padding: calc(var(--space-gap) * 1.25) calc(var(--space-gap) * 1.25);
  margin-bottom: calc(var(--space-gap) * 0.75);
  box-shadow: var(--shadow);
  transition:
    transform var(--motion) var(--motion-ease),
    box-shadow var(--motion) var(--motion-ease),
    border-color var(--motion-fast) var(--motion-ease);
  cursor: default;
}

.page [data-comp="processList"] .processList-step:last-child {
  margin-bottom: 0;
}

.page [data-comp="processList"] .processList-step:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-lg);
  border-top-color: var(--color-primary);
}

/* ── Step number — large mono accent ── */
.page [data-comp="processList"] .processList-step-num {
  font-family: var(--font-heading);
  font-size: var(--fs-h2);
  font-weight: 700;
  color: var(--color-primary);
  line-height: 1;
  letter-spacing: var(--tracking-heading);
  min-width: 2.4ch;
  padding-top: var(--s-1);
  flex-shrink: 0;
  user-select: none;
  transition: color var(--motion-fast) var(--motion-ease);
}

.page [data-comp="processList"] .processList-step:hover .processList-step-num {
  color: inherit;
}

/* ── Step text block ── */
.page [data-comp="processList"] .processList-step-title {
  font-family: var(--font-heading);
  font-size: var(--fs-h3);
  font-weight: 700;
  color: var(--color-on-dark);
  letter-spacing: var(--tracking-heading);
  line-height: var(--leading-heading);
  margin: 0 0 calc(var(--space-gap) * 0.4) 0;
}

.page [data-comp="processList"] .processList-step-body {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--leading-body);
  color: var(--color-text);
  margin: 0;
  max-width: var(--measure);
}

/* ── Connector — the 1px vertical line between steps ── */
.page [data-comp="processList"] .processList-connector {
  display: block;
  width: 1px;
  height: calc(var(--space-gap) * 0.75);
  background: var(--color-border);
  margin-left: calc(
    var(--space-gap) * 1.25       /* card padding-left */
    + 2ch                         /* ~half num width */
  );
  flex-shrink: 0;
}

/* ============================================================
   ≥ 900px — HORIZONTAL LAYOUT
   Steps in a row; connectors are horizontal lines
   ============================================================ */
@media (min-width: 900px) {
  .page [data-comp="processList"] .processList-steps {
    flex-direction: row;
    align-items: flex-start;
    gap: 0;
  }

  .page [data-comp="processList"] .processList-step {
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
    gap: calc(var(--space-gap) * 0.75);
    grid-template-columns: unset;
    margin-bottom: 0;
    margin-right: calc(var(--space-gap) * 0.75);
  }

  .page [data-comp="processList"] .processList-step:last-child {
    margin-right: 0;
  }

  .page [data-comp="processList"] .processList-step-num {
    font-size: var(--fs-h1);
    min-width: unset;
  }

  /* Horizontal connector — sits between step cards */
  .page [data-comp="processList"] .processList-connector {
    /* vertical rule becomes a horizontal mid-connector */
    width: calc(var(--space-gap) * 0.75);
    height: 1px;
    margin-left: 0;
    /* vertically centred relative to the step-num line */
    align-self: flex-start;
    margin-top: calc(
      var(--space-gap) * 1.25   /* card padding-top */
      + 0.55em                  /* ~half of fs-h1 */
    );
    flex-shrink: 0;
  }
}

/* ============================================================
   Reduced-motion — strip transforms, keep colour transitions
   ============================================================ */
@media (prefers-reduced-motion: no-preference) {
  /* transitions already declared above — nothing extra needed */
}

@media (prefers-reduced-motion: reduce) {
  .page [data-comp="processList"] .processList-step {
    transition:
      box-shadow var(--motion) var(--motion-ease),
      border-color var(--motion-fast) var(--motion-ease);
  }

  .page [data-comp="processList"] .processList-step:hover {
    transform: none;
  }
}

/* faqAccordion */
/* ============================================================
   faqAccordion — native <details>/<summary> accordion
   Design Language: terminal-dev / MEIXIT
   ============================================================ */

.page [data-comp="faqAccordion"].faqAccordion {
  background: var(--color-bg-alt);
  padding-block: var(--space-section-y);
}

.page [data-comp="faqAccordion"] .faqAccordion-inner {
  max-width: var(--container-width);
  margin-inline: auto;
  padding-inline: var(--space-container-x);
  display: flex;
  flex-direction: column;
  gap: var(--space-gap);
}

/* --- Eyebrow header --- */
.page [data-comp="faqAccordion"] .faqAccordion-header {
  display: block;
  font-family: var(--font-heading);
  font-size: var(--fs-small);
  color: var(--color-primary);
  text-transform: uppercase;
  letter-spacing: 0.18em;
  border-left: 3px solid var(--color-primary);
  padding-left: var(--space-gap);
}

/* --- Lead paragraph --- */
.page [data-comp="faqAccordion"] .faqAccordion-lead {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--leading-body);
  color: var(--color-text);
  max-width: var(--measure);
  margin: 0;
  padding-left: calc(var(--space-gap) + 3px);
}

/* --- Accordion list --- */
.page [data-comp="faqAccordion"] .faqAccordion-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  border-top: 1px solid var(--color-border);
}

/* --- Individual item (<details>) --- */
.page [data-comp="faqAccordion"] .faqAccordion-item {
  background: var(--color-surface);
  border-left: 3px solid transparent;
  border-right: 1px solid var(--color-border);
  border-bottom: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow);
  margin-top: 0;
  overflow: hidden;
  transition:
    border-color var(--motion-fast) var(--motion-ease),
    box-shadow var(--motion) var(--motion-ease),
    transform var(--motion) var(--motion-ease);
  /* reset <details> default marker */
  list-style: none;
}

/* Remove default disclosure triangle in all browsers */
.page [data-comp="faqAccordion"] .faqAccordion-item::-webkit-details-marker {
  display: none;
}

/* Open state: 3px primary left rule */
.page [data-comp="faqAccordion"] .faqAccordion-item[open] {
  border-left-color: var(--color-primary);
  box-shadow: var(--shadow-lg);
}

/* Hover lift on closed items */
.page [data-comp="faqAccordion"] .faqAccordion-item:not([open]):hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-lg);
  border-left-color: var(--color-primary);
}

/* --- Question (<summary>) --- */
.page [data-comp="faqAccordion"] .faqAccordion-question {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-gap);
  padding: calc(var(--space-gap) * 0.85) var(--space-gap);
  font-family: var(--font-heading);
  font-size: var(--fs-h3);
  font-weight: 700;
  letter-spacing: var(--tracking-heading);
  color: var(--color-on-dark);
  cursor: pointer;
  user-select: none;
  list-style: none;
  /* remove default summary arrow */
  -webkit-appearance: none;
  appearance: none;
  transition: color var(--motion-fast) var(--motion-ease);
}

.page [data-comp="faqAccordion"] .faqAccordion-question::-webkit-details-marker {
  display: none;
}

.page [data-comp="faqAccordion"] .faqAccordion-item[open] .faqAccordion-question {
  color: var(--color-on-dark);
  border-bottom: 1px solid var(--color-border);
}

.page [data-comp="faqAccordion"] .faqAccordion-question:hover {
  color: var(--color-primary);
}

/* --- Chevron icon --- */
.page [data-comp="faqAccordion"] .faqAccordion-icon {
  flex-shrink: 0;
  width: 1.1em;
  height: 1.1em;
  color: var(--color-muted);
  transition:
    transform var(--motion) var(--motion-ease),
    color var(--motion-fast) var(--motion-ease);
}

.page [data-comp="faqAccordion"] .faqAccordion-item[open] .faqAccordion-icon {
  transform: rotate(180deg);
  color: var(--color-primary);
}

.page [data-comp="faqAccordion"] .faqAccordion-question:hover .faqAccordion-icon {
  color: var(--color-primary);
}

/* --- Answer panel --- */
.page [data-comp="faqAccordion"] .faqAccordion-answer {
  padding: var(--space-gap);
  padding-top: calc(var(--space-gap) * 0.75);
}

.page [data-comp="faqAccordion"] .faqAccordion-answer p {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--leading-body);
  color: var(--color-text);
  margin: 0;
  max-width: var(--measure);
}

.page [data-comp="faqAccordion"] .faqAccordion-answer p + p {
  margin-top: calc(var(--space-gap) * 0.5);
}

/* --- Open animation (non-essential — wrap in reduced-motion query) --- */
@media (prefers-reduced-motion: no-preference) {
  .page [data-comp="faqAccordion"] .faqAccordion-answer {
    animation: faqAccordion-faq-reveal var(--motion) var(--motion-ease) both;
  }

  @keyframes faqAccordion-faq-reveal {
    from {
      opacity: 0;
      transform: translateY(-6px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
}

/* --- Responsive --- */
@media (max-width: 700px) {
  .page [data-comp="faqAccordion"] .faqAccordion-question {
    font-size: var(--fs-body);
    padding: calc(var(--space-gap) * 0.75) calc(var(--space-gap) * 0.75);
  }

  .page [data-comp="faqAccordion"] .faqAccordion-answer {
    padding: calc(var(--space-gap) * 0.75);
  }

  .page [data-comp="faqAccordion"] .faqAccordion-lead {
    padding-left: 0;
  }
}
/* testimonialPull */
/* =============================================
   testimonialPull — single featured pull-quote
   ============================================= */

.page [data-comp="testimonialPull"].testimonialPull {
  background: var(--color-bg-alt);
  padding-block: var(--space-section-y);
  border-top: 1px solid var(--color-border);
  border-bottom: 1px solid var(--color-border);
  color: var(--color-on-dark);
}

.page [data-comp="testimonialPull"] .testimonialPull-inner {
  max-width: var(--container-width);
  margin-inline: auto;
  padding-inline: var(--space-container-x);
  display: flex;
  justify-content: center;
}

/* blockquote resets */
.page [data-comp="testimonialPull"] .testimonialPull-quote {
  margin: 0;
  padding: 0;
  border: none;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-gap);
  max-width: 72ch;
  text-align: center;
  position: relative;
}

/* oversized mono quotation mark via ::before */
.page [data-comp="testimonialPull"] .testimonialPull-quote::before {
  content: '\201C';
  font-family: var(--font-heading);
  font-size: clamp(5rem, 12vw, 9rem);
  font-weight: 700;
  line-height: 0.75;
  color: var(--color-primary);
  display: block;
  letter-spacing: -0.04em;
  user-select: none;
  pointer-events: none;
  /* visual only — sits above the text */
  margin-bottom: calc(var(--space-gap) * -0.25);
}

/* 3px left accent rule on the quote as a block — rendered as top border on the text */
.page [data-comp="testimonialPull"] .testimonialPull-text {
  font-family: var(--font-heading);
  font-size: var(--fs-h2);
  font-weight: 700;
  line-height: var(--leading-heading);
  letter-spacing: var(--tracking-heading);
  color: var(--color-on-dark);
  margin: 0;
  padding: 0;
}

.page [data-comp="testimonialPull"] .testimonialPull-attr {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--s-1);
  padding-top: var(--space-gap);
  /* 3px primary top rule — the brand's repeating accent mark */
  border-top: 3px solid var(--color-primary);
  width: min(18rem, 100%);
}

.page [data-comp="testimonialPull"] .testimonialPull-attr-name {
  font-family: var(--font-heading);
  font-size: var(--fs-body);
  font-weight: 700;
  color: var(--color-on-dark);
  letter-spacing: var(--tracking-heading);
  text-transform: uppercase;
}

.page [data-comp="testimonialPull"] .testimonialPull-attr-role {
  font-family: var(--font-body);
  font-size: var(--fs-small);
  color: var(--color-muted);
  letter-spacing: 0.04em;
}

.page [data-comp="testimonialPull"] .testimonialPull-attr-logo {
  display: block;
  margin-top: var(--s-2);
  max-height: 1.75rem;
  max-width: 8rem;
  width: auto;
  /* muted so it reads as secondary without overpowering */
  opacity: 0.55;
  filter: grayscale(1) brightness(2);
  transition: opacity var(--motion-fast) var(--motion-ease),
              filter var(--motion-fast) var(--motion-ease);
}

.page [data-comp="testimonialPull"] .testimonialPull-attr-logo:hover {
  opacity: 0.85;
  filter: grayscale(0) brightness(1);
}

/* ---- Responsive ---- */
@media (max-width: 700px) {
  .page [data-comp="testimonialPull"] .testimonialPull-quote::before {
    font-size: clamp(4rem, 18vw, 6rem);
  }

  .page [data-comp="testimonialPull"] .testimonialPull-text {
    font-size: var(--fs-h3);
  }

  .page [data-comp="testimonialPull"] .testimonialPull-attr {
    width: 100%;
  }
}
/* ctaBand */
/* ============================================================
   ctaBand — Full-bleed CTA section
   --color-primary bg · on-primary text · mono heading
   ============================================================ */

.page [data-comp="ctaBand"].ctaBand {
  position: relative;
  background: var(--color-primary);
  color: var(--color-on-primary);
  padding-block: var(--space-section-y);
  overflow: hidden;
}

/* Subtle terminal-grid texture scrim — neutral rgba ok */
.page [data-comp="ctaBand"].ctaBand::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    repeating-linear-gradient(
      0deg,
      rgba(0,0,0,.06) 0px,
      rgba(0,0,0,.06) 1px,
      transparent 1px,
      transparent 40px
    ),
    repeating-linear-gradient(
      90deg,
      rgba(0,0,0,.06) 0px,
      rgba(0,0,0,.06) 1px,
      transparent 1px,
      transparent 40px
    );
  pointer-events: none;
  z-index: 0;
}

/* 3px primary-contrast accent rule along the top — brand signature */
.page [data-comp="ctaBand"].ctaBand::after {
  content: '';
  position: absolute;
  inset-block-start: 0;
  inset-inline: 0;
  height: 3px;
  background: rgba(255,255,255,.25);
  z-index: 1;
  pointer-events: none;
}

.page [data-comp="ctaBand"] .ctaBand-inner {
  position: relative;
  z-index: 2;
  max-width: var(--container-width);
  margin-inline: auto;
  padding-inline: var(--space-container-x);
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: var(--space-gap);
}

/* ── Eyebrow ─────────────────────────────────────────────── */
.page [data-comp="ctaBand"] .ctaBand-eyebrow {
  font-family: var(--font-heading);
  font-size: var(--fs-small);
  font-weight: 600;
  color: var(--color-on-primary);
  letter-spacing: 0.18em;
  text-transform: uppercase;
  opacity: 0.72;
  display: flex;
  align-items: center;
  gap: var(--s-2);
}

.page [data-comp="ctaBand"] .ctaBand-eyebrow::before,
.page [data-comp="ctaBand"] .ctaBand-eyebrow::after {
  content: '';
  display: inline-block;
  width: 1.5rem;
  height: 2px;
  background: var(--color-on-primary);
  opacity: 0.45;
  flex-shrink: 0;
}

/* ── Heading ─────────────────────────────────────────────── */
.page [data-comp="ctaBand"] .ctaBand-title {
  font-family: var(--font-heading);
  font-size: var(--fs-h2);
  font-weight: 700;
  line-height: var(--leading-heading);
  letter-spacing: var(--tracking-heading);
  color: var(--color-on-primary);
  margin: 0;
  max-width: 22ch;
}

/* ── Body ────────────────────────────────────────────────── */
.page [data-comp="ctaBand"] .ctaBand-body {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--leading-body);
  color: var(--color-on-primary);
  opacity: 0.82;
  max-width: var(--measure);
  margin: 0;
}

/* ── Actions ─────────────────────────────────────────────── */
.page [data-comp="ctaBand"] .ctaBand-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: calc(var(--space-gap) * 0.6);
  margin-top: calc(var(--space-gap) * 0.25);
}

/* ── Trust-badge row ─────────────────────────────────────── */
.page [data-comp="ctaBand"] .ctaBand-badge {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: calc(var(--space-gap) * 0.75);
  padding-top: var(--space-gap);
  border-top: 1px solid rgba(255,255,255,.18);
  margin-top: calc(var(--space-gap) * 0.25);
  font-family: var(--font-heading);
  font-size: var(--fs-small);
  color: var(--color-on-primary);
  opacity: 0.65;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

/* ── Responsive ──────────────────────────────────────────── */
@media (max-width: 600px) {
  .page [data-comp="ctaBand"] .ctaBand-title {
    font-size: var(--fs-h3);
    max-width: 100%;
  }

  .page [data-comp="ctaBand"] .ctaBand-actions {
    flex-direction: column;
    width: 100%;
  }

  .page [data-comp="ctaBand"] .ctaBand-badge {
    gap: calc(var(--space-gap) * 0.5);
  }
}
/* contactSplit */
/* ============================================================
   contactSplit — two-column contact layout
   Left: info panel on dark surface | Right: form on surface
   ============================================================ */

.page [data-comp="contactSplit"].contactSplit {
  background: var(--color-bg-alt);
  padding-block: var(--space-section-y);
  color: var(--color-text);
}

.page [data-comp="contactSplit"] .contactSplit-inner {
  max-width: var(--container-width);
  margin-inline: auto;
  padding-inline: var(--space-container-x);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  align-items: stretch;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow);
  overflow: hidden;
}

/* ── LEFT PANEL — info ────────────────────────────────────── */

.page [data-comp="contactSplit"] .contactSplit-info {
  background: var(--color-surface);
  padding: calc(var(--space-section-y) * 0.75) calc(var(--space-gap) * 1.5);
  display: flex;
  flex-direction: column;
  gap: var(--space-gap);
  border-right: 1px solid var(--color-border);
  color: var(--color-on-dark);
  position: relative;
}

/* 3px primary left accent rule on the info panel */
.page [data-comp="contactSplit"] .contactSplit-info::before {
  content: '';
  position: absolute;
  inset-block: 0;
  left: 0;
  width: 3px;
  background: var(--color-primary);
}

.page [data-comp="contactSplit"] .contactSplit-info-title {
  font-family: var(--font-heading);
  font-size: var(--fs-h2);
  font-weight: 700;
  letter-spacing: var(--tracking-heading);
  line-height: var(--leading-heading);
  color: var(--color-on-dark);
  margin: 0;
  border-left: 3px solid var(--color-primary);
  padding-left: var(--space-gap);
}

.page [data-comp="contactSplit"] .contactSplit-info-body {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--leading-body);
  color: var(--color-text);
  margin: 0;
  max-width: var(--measure);
}

/* ── Contact detail rows ─────────────────────────────────── */

.page [data-comp="contactSplit"] .contactSplit-detail {
  display: flex;
  align-items: flex-start;
  gap: calc(var(--space-gap) * 0.6);
  padding: calc(var(--space-gap) * 0.6) calc(var(--space-gap) * 0.75);
  background: rgba(0, 0, 0, 0.22);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  transition: transform var(--motion) var(--motion-ease),
              box-shadow var(--motion) var(--motion-ease),
              border-color var(--motion-fast) var(--motion-ease);
}

.page [data-comp="contactSplit"] .contactSplit-detail:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-lg);
  border-color: var(--color-primary);
}

.page [data-comp="contactSplit"] .contactSplit-detail-icon {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  color: inherit;
  font-family: var(--font-heading);
  font-size: var(--fs-small);
}

.page [data-comp="contactSplit"] .contactSplit-detail-text {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  color: var(--color-text);
  line-height: var(--leading-body);
  word-break: break-word;
}

/* ── RIGHT PANEL — form ───────────────────────────────────── */

.page [data-comp="contactSplit"] .contactSplit-form {
  background: var(--color-bg-alt);
  padding: calc(var(--space-section-y) * 0.75) calc(var(--space-gap) * 1.5);
  display: flex;
  flex-direction: column;
  gap: calc(var(--space-gap) * 0.9);
}

.page [data-comp="contactSplit"] .contactSplit-form-title {
  font-family: var(--font-heading);
  font-size: var(--fs-h3);
  font-weight: 700;
  letter-spacing: var(--tracking-heading);
  line-height: var(--leading-heading);
  color: var(--color-on-dark);
  margin: 0;
  border-left: 3px solid var(--color-primary);
  padding-left: var(--space-gap);
}

/* ── Field ───────────────────────────────────────────────── */

.page [data-comp="contactSplit"] .contactSplit-field {
  display: flex;
  flex-direction: column;
  gap: var(--s-2);
}

.page [data-comp="contactSplit"] .contactSplit-label {
  font-family: var(--font-heading);
  font-size: var(--fs-small);
  color: var(--color-muted);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.page [data-comp="contactSplit"] .contactSplit-input {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  color: var(--color-text);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  padding: var(--s-3) var(--s-3);
  width: 100%;
  outline: none;
  box-shadow: var(--shadow);
  transition: border-color var(--motion-fast) var(--motion-ease),
              box-shadow var(--motion-fast) var(--motion-ease);
  appearance: none;
}

.page [data-comp="contactSplit"] .contactSplit-input::placeholder {
  color: var(--color-muted);
  opacity: 0.7;
}

.page [data-comp="contactSplit"] .contactSplit-input:focus {
  border-color: var(--color-primary);
}

.page [data-comp="contactSplit"] .contactSplit-input:hover:not(:focus) {
  border-color: var(--color-text);
}

/* ── Submit button wrapper spacing ──────────────────────── */

.page [data-comp="contactSplit"] .contactSplit-submit {
  align-self: flex-start;
  margin-top: calc(var(--space-gap) * 0.25);
}

/* ── Responsive ──────────────────────────────────────────── */

@media (max-width: 900px) {
  .page [data-comp="contactSplit"] .contactSplit-inner {
    grid-template-columns: 1fr;
  }

  .page [data-comp="contactSplit"] .contactSplit-info {
    border-right: none;
    border-bottom: 1px solid var(--color-border);
    padding: calc(var(--space-section-y) * 0.6) var(--space-gap);
  }

  .page [data-comp="contactSplit"] .contactSplit-form {
    padding: calc(var(--space-section-y) * 0.6) var(--space-gap);
  }
}

@media (max-width: 480px) {
  .page [data-comp="contactSplit"] .contactSplit-info,
  .page [data-comp="contactSplit"] .contactSplit-form {
    padding: calc(var(--space-gap) * 1.25) var(--space-gap);
  }

  .page [data-comp="contactSplit"] .contactSplit-submit {
    width: 100%;
    align-self: stretch;
  }
}
/* serviceCards */
/* ── serviceCards ──────────────────────────────────────────── */

.page [data-comp="serviceCards"].serviceCards {
  background: var(--color-bg-alt);
  padding-block: var(--space-section-y);
  color: var(--color-text);
}

.page [data-comp="serviceCards"] .serviceCards-inner {
  max-width: var(--container-width);
  margin-inline: auto;
  padding-inline: var(--space-container-x);
  display: flex;
  flex-direction: column;
  gap: var(--space-gap);
}

/* eyebrow */
.page [data-comp="serviceCards"] .serviceCards-header {
  display: block;
  font-family: var(--font-heading);
  font-size: var(--fs-small);
  color: var(--color-primary);
  text-transform: uppercase;
  letter-spacing: 0.18em;
  border-left: 3px solid var(--color-primary);
  padding-left: var(--space-gap);
}

/* lead paragraph */
.page [data-comp="serviceCards"] .serviceCards-lead {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--leading-body);
  color: var(--color-text);
  max-width: var(--measure);
  margin: 0;
  padding-left: calc(var(--space-gap) + 3px);
}

/* grid */
.page [data-comp="serviceCards"] .serviceCards-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-gap);
}

/* card */
.page [data-comp="serviceCards"] .serviceCards-card {
  position: relative;
  background: var(--color-surface);
  border-radius: var(--radius-sm);
  border: 1px solid var(--color-border);
  border-top: 1px solid var(--color-border);
  box-shadow: var(--shadow);
  padding: calc(var(--space-gap) * 1.25);
  display: flex;
  flex-direction: column;
  gap: calc(var(--space-gap) * 0.6);
  transition:
    transform var(--motion) var(--motion-ease),
    box-shadow var(--motion) var(--motion-ease),
    border-color var(--motion-fast) var(--motion-ease);
}

.page [data-comp="serviceCards"] .serviceCards-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-lg);
  border-top-color: var(--color-primary);
}

/* tag */
.page [data-comp="serviceCards"] .serviceCards-card-tag {
  display: inline-block;
  font-family: var(--font-heading);
  font-size: var(--fs-small);
  color: var(--color-primary);
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-weight: 700;
  line-height: 1;
}

/* card title */
.page [data-comp="serviceCards"] .serviceCards-card-title {
  font-family: var(--font-heading);
  font-size: var(--fs-h3);
  font-weight: 700;
  letter-spacing: var(--tracking-heading);
  line-height: var(--leading-heading);
  color: var(--color-on-dark);
  margin: 0;
}

/* card body */
.page [data-comp="serviceCards"] .serviceCards-card-body {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--leading-body);
  color: var(--color-text);
  margin: 0;
  flex-grow: 1;
}

/* feature list */
.page [data-comp="serviceCards"] .serviceCards-card-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: calc(var(--space-gap) * 0.35);
  border-top: 1px solid var(--color-border);
  padding-top: calc(var(--space-gap) * 0.6);
}

.page [data-comp="serviceCards"] .serviceCards-card-list-item {
  font-family: var(--font-body);
  font-size: var(--fs-small);
  color: var(--color-muted);
  line-height: var(--leading-body);
  padding-left: var(--s-4);
  position: relative;
}

.page [data-comp="serviceCards"] .serviceCards-card-list-item::before {
  content: '›';
  position: absolute;
  left: 0;
  color: var(--color-primary);
  font-family: var(--font-heading);
  font-weight: 700;
  line-height: inherit;
}

/* ghost CTA link — wrapper/positioning only; .btn classes handle all visual styles */
.page [data-comp="serviceCards"] .serviceCards-card-cta {
  align-self: flex-start;
  margin-top: auto;

  /* link underline draw left-to-right (supplementary to .btn styles) */
  background-image: linear-gradient(currentColor, currentColor);
  background-repeat: no-repeat;
  background-position: 0 100%;
  background-size: 0 1px;
  transition:
    background-size var(--motion-fast) var(--motion-ease),
    color var(--motion-fast) var(--motion-ease),
    transform var(--motion) var(--motion-ease),
    box-shadow var(--motion) var(--motion-ease);
}

.page [data-comp="serviceCards"] .serviceCards-card-cta:hover {
  background-size: 100% 1px;
}

/* ── responsive ────────────────────────────────────────────── */

@media (max-width: 1024px) {
  .page [data-comp="serviceCards"] .serviceCards-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 600px) {
  .page [data-comp="serviceCards"] .serviceCards-grid {
    grid-template-columns: 1fr;
  }

  .page [data-comp="serviceCards"] .serviceCards-lead {
    padding-left: calc(var(--space-gap) + 3px);
  }
}

/* ── reduced motion ─────────────────────────────────────────── */

@media (prefers-reduced-motion: no-preference) {
  .page [data-comp="serviceCards"] .serviceCards-card {
    transition:
      transform var(--motion) var(--motion-ease),
      box-shadow var(--motion) var(--motion-ease),
      border-color var(--motion-fast) var(--motion-ease);
  }
}

@media (prefers-reduced-motion: reduce) {
  .page [data-comp="serviceCards"] .serviceCards-card {
    transition: border-color var(--motion-fast) var(--motion-ease);
  }

  .page [data-comp="serviceCards"] .serviceCards-card:hover {
    transform: none;
  }

  .page [data-comp="serviceCards"] .serviceCards-card-cta {
    transition: color var(--motion-fast) var(--motion-ease);
  }
}
/* siteHeader */
.siteHeader{position:sticky;top:0;z-index:50;width:100%;transition:background var(--motion) var(--motion-ease), box-shadow var(--motion) var(--motion-ease);background:var(--color-surface);box-shadow:var(--shadow);}

[data-comp="siteHeader"] .siteHeader-inner{max-width:var(--container-width);margin-inline:auto;padding-inline:var(--space-container-x);height:76px;display:flex;align-items:center;gap:var(--space-gap);}

[data-comp="siteHeader"] .siteHeader-logo{display:flex;align-items:center;flex-shrink:0;background:rgba(0,0,0,.35);padding:var(--s-1) var(--s-2);border-radius:var(--radius-sm);}

[data-comp="siteHeader"] .siteHeader-logo img{height:36px;width:auto;display:block;}

[data-comp="siteHeader"] .siteHeader-nav{margin-inline-start:auto;}

[data-comp="siteHeader"] .siteHeader-nav-list{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:calc(var(--space-gap)*0.1);}

[data-comp="siteHeader"] .siteHeader-nav-item a{font-family:var(--font-heading);font-size:var(--fs-small);font-weight:600;letter-spacing:0.06em;text-transform:uppercase;color:var(--color-text);text-decoration:none;padding:var(--s-2) var(--s-3);display:block;position:relative;transition:color var(--motion-fast) var(--motion-ease);}

[data-comp="siteHeader"] .siteHeader-nav-item a::after{content:'';position:absolute;bottom:-2px;left:0.75em;right:0.75em;height:2px;background:var(--color-primary);transform:scaleX(0);transform-origin:left;transition:transform var(--motion) var(--motion-ease);}

[data-comp="siteHeader"] .siteHeader-nav-item a:hover{color:var(--color-on-dark);}

[data-comp="siteHeader"] .siteHeader-nav-item a:hover::after{transform:scaleX(1);}

[data-comp="siteHeader"] .siteHeader-nav-item a[aria-current="page"]{color:var(--color-primary);}

[data-comp="siteHeader"] .siteHeader-nav-item a[aria-current="page"]::after{transform:scaleX(1);}

[data-comp="siteHeader"] .siteHeader-actions{display:flex;align-items:center;gap:calc(var(--space-gap)*0.5);margin-inline-start:var(--space-gap);}

[data-comp="siteHeader"] .siteHeader-hamburger{display:none;flex-direction:column;justify-content:center;gap:var(--s-1);background:none;border:none;cursor:pointer;padding:var(--s-2);}

[data-comp="siteHeader"] .siteHeader-hamburger-bar{display:block;width:22px;height:2px;background:var(--color-text);border-radius:var(--radius-sm);transition:transform var(--motion-fast) var(--motion-ease), opacity var(--motion-fast) var(--motion-ease);}

.home-hero .siteHeader{background:linear-gradient(180deg, rgba(0,0,0,.55) 0%, rgba(0,0,0,0) 100%);box-shadow:none;}

.home-hero .siteHeader .siteHeader-nav-item a{color:var(--color-on-dark);}

.home-hero .siteHeader .siteHeader-nav-item a:hover{color:var(--color-primary);}

.home-hero .siteHeader .siteHeader-cta{color:var(--color-on-primary);}

.home-hero.hero-light .siteHeader{background:linear-gradient(180deg, rgba(255,255,255,.72) 0%, rgba(255,255,255,0) 100%);box-shadow:none;}

.home-hero.hero-light .siteHeader .siteHeader-nav-item a{color:var(--color-text);}

.home-hero.hero-light .siteHeader .siteHeader-nav-item a:hover{color:var(--color-primary);}

.home-hero.hero-light .siteHeader .siteHeader-logo{background:rgba(0,0,0,.45);}

.home-hero .siteHeader.is-scrolled{background:var(--color-surface);box-shadow:var(--shadow);}

.home-hero .siteHeader.is-scrolled .siteHeader-nav-item a{color:var(--color-text);}

.home-hero .siteHeader.is-scrolled .siteHeader-nav-item a:hover{color:var(--color-on-dark);}

.home-hero .siteHeader.is-scrolled .siteHeader-cta{color:var(--color-on-primary);}

@media (max-width:900px){[data-comp="siteHeader"] .siteHeader-nav{inset:0;top:76px;background:var(--color-surface);padding:var(--space-gap);transform:translateX(100%);transition:transform var(--motion) var(--motion-ease);z-index:49;display:flex;flex-direction:column;border-left:1px solid var(--color-border);}[data-comp="siteHeader"] .siteHeader-nav[aria-hidden="false"],[data-comp="siteHeader"] .siteHeader-nav.is-open{transform:translateX(0);}[data-comp="siteHeader"] .siteHeader-nav-list{flex-direction:column;gap:var(--s-1);width:100%;}[data-comp="siteHeader"] .siteHeader-nav-item a{padding:var(--s-3) var(--s-4);border-bottom:1px solid var(--color-border);font-size:var(--fs-body);}[data-comp="siteHeader"] .siteHeader-nav-item a::after{display:none;}[data-comp="siteHeader"] .siteHeader-hamburger{display:flex;}[data-comp="siteHeader"] .siteHeader-actions .siteHeader-cta{display:none;}}
/* siteFooter */
/* ── Root surface ── */
.siteFooter {
  background-color: var(--color-bg-alt);
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--leading-body);
  border-top: 1px solid var(--color-border);
}

/* ── Inner grid ── */
[data-comp="siteFooter"] .siteFooter__inner {
  max-width: var(--container-width);
  margin: 0 auto;
  padding: var(--space-section-y) var(--space-container-x) calc(var(--space-section-y) * 0.6);
  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr;
  gap: var(--space-gap);
  align-items: start;
}

/* ── Brand column ── */
[data-comp="siteFooter"] .siteFooter__logo-link {
  display: inline-block;
  margin-bottom: calc(var(--space-gap) * 0.75);
  text-decoration: none;
  /* Logo has light/white ink — give it the brand dark backdrop for legibility */
  background-color: var(--color-primary);
  border-radius: var(--radius-sm);
  padding: var(--s-2) var(--s-3);
  transition: opacity var(--motion-fast) var(--motion-ease);
}

[data-comp="siteFooter"] .siteFooter__logo-link:hover {
  opacity: 0.85;
}

[data-comp="siteFooter"] .siteFooter__logo {
  display: block;
  height: 36px;
  width: auto;
  object-fit: contain;
}

[data-comp="siteFooter"] .siteFooter__blurb {
  color: var(--color-muted);
  font-size: var(--fs-small);
  line-height: var(--leading-body);
  max-width: 32ch;
  margin: 0 0 calc(var(--space-gap) * 0.9) 0;
}

/* ── Socials ── */
[data-comp="siteFooter"] .siteFooter__socials {
  display: flex;
  gap: calc(var(--space-gap) * 0.5);
  align-items: center;
}

[data-comp="siteFooter"] .siteFooter__social-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: var(--radius);
  background-color: var(--color-surface);
  color: var(--color-primary);
  border: 1px solid var(--color-border);
  text-decoration: none;
  transition: background-color var(--motion-fast) var(--motion-ease),
              color var(--motion-fast) var(--motion-ease),
              border-color var(--motion-fast) var(--motion-ease);
}

[data-comp="siteFooter"] .siteFooter__social-link:hover {
  background-color: var(--color-primary);
  color: var(--color-on-primary);
  border-color: var(--color-primary);
}

[data-comp="siteFooter"] .siteFooter__social-icon {
  display: block;
  flex-shrink: 0;
}

/* ── Nav columns ── */
[data-comp="siteFooter"] .siteFooter__col-heading {
  font-family: var(--font-heading);
  font-size: var(--fs-small);
  font-weight: 700;
  letter-spacing: var(--tracking-heading);
  text-transform: uppercase;
  color: var(--color-text);
  margin: 0 0 calc(var(--space-gap) * 0.65) 0;
}

[data-comp="siteFooter"] .siteFooter__nav-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: calc(var(--space-gap) * 0.45);
}

[data-comp="siteFooter"] .siteFooter__nav-link {
  color: var(--color-muted);
  text-decoration: none;
  font-size: var(--fs-small);
  transition: color var(--motion-fast) var(--motion-ease);
}

[data-comp="siteFooter"] .siteFooter__nav-link:hover {
  color: var(--color-primary);
}

/* ── Bottom bar ── */
[data-comp="siteFooter"] .siteFooter__bottom {
  max-width: var(--container-width);
  margin: 0 auto;
  padding: calc(var(--space-gap) * 0.75) var(--space-container-x);
  border-top: 1px solid var(--color-border);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-gap);
  flex-wrap: wrap;
}

[data-comp="siteFooter"] .siteFooter__copyright {
  color: var(--color-muted);
  font-size: var(--fs-small);
}

/* ── Sosei credit ── */
.siteFooter .sosei-credit {
  color: var(--color-muted);
  font-size: var(--fs-small);
  text-decoration: none;
  transition: color var(--motion-fast) var(--motion-ease);
}

.siteFooter .sosei-credit:hover {
  color: var(--color-primary);
}

/* ── Responsive: tablet ── */
@media (max-width: 860px) {
  [data-comp="siteFooter"] .siteFooter__inner {
    grid-template-columns: 1fr 1fr;
  }

  [data-comp="siteFooter"] .siteFooter__col--brand {
    grid-column: 1 / -1;
  }

  [data-comp="siteFooter"] .siteFooter__blurb {
    max-width: 48ch;
  }
}

/* ── Responsive: mobile ── */
@media (max-width: 520px) {
  [data-comp="siteFooter"] .siteFooter__inner {
    grid-template-columns: 1fr;
    gap: calc(var(--space-gap) * 1.25);
  }

  [data-comp="siteFooter"] .siteFooter__col--brand {
    grid-column: auto;
  }

  [data-comp="siteFooter"] .siteFooter__bottom {
    flex-direction: column;
    align-items: flex-start;
    gap: calc(var(--space-gap) * 0.4);
  }
}

/* ── chrome fallback floor (deterministic; unstyled header/footer skeleton + mobile nav-panel position guard) ── */
/* mobile nav-panel position guard (translateX+inset without position:fixed) */
@media (max-width:900px){[data-comp="siteHeader"] .siteHeader-nav{position:fixed}}