/* fonts (generated from src/fonts.mjs) */
@font-face{font-family:'Jost';src:url(/assets/fonts/jost-latin-var.235d8f8964.woff2) format('woff2');font-weight:300 700;font-style:normal;font-display:swap}
@font-face{font-family:'Jost Fallback';src:local('Arial');size-adjust:96%;ascent-override:107%;descent-override:37%}
@font-face{font-family:'Inter';src:url(/assets/fonts/inter-latin-var.c940764593.woff2) format('woff2');font-weight:400 700;font-style:normal;font-display:swap}
@font-face{font-family:'Inter Fallback';src:local('Arial');size-adjust:107%;ascent-override:90%;descent-override:22%}
:root{--font-display:'Jost', 'Jost Fallback', 'Avenir Next', 'Century Gothic', 'Segoe UI', system-ui, sans-serif;--font-body:'Inter', 'Inter Fallback', 'Segoe UI', system-ui, -apple-system, sans-serif;}
/* 00-tokens.css */
/* Palette MEASURED from their logo files (BRIEF §5); every pair contrast-computed (DESIGN §1.2).
   Hex only for colour. Never put a brand hex in JS — read these tokens instead. */
:root{
  --brand-graphite:#585858; --brand-teal:#21B1C2; --brand-teal-shade:#199BBA;
  --brand-sky:#00ACEA; --brand-magenta:#D51375; --brand-moon:#B41960; --brand-moon-shade:#9E125F;
  --brand-green:#7EB341;

  --ink-950:#06101A; --ink-900:#0A1824; --ink-800:#10222F; --ink-700:#1A3244;

  --surface:#F4F8F9; --surface-2:#E8F0F2; --surface-card:#FFFFFF;
  --line:#D5E1E5; --line-input:#7F909B;

  --text-on-dark:#EEF4F6; --text-muted-dark:#A9BAC4;
  --text:#0C1A24; --text-muted:#4A5A66;

  --teal-ink:#156F7A; --sky-ink:#006D95; --green-ink:#4E6F28;
  --magenta-lift:#EE459A;

  --cta:#D51375; --cta-hover:#B41960; --cta-active:#9E125F; --cta-label:#FFFFFF;
  --wa:#25D366;
  --focus-dark:#21B1C2; --focus-light:#156F7A;
  --wordmark:#585858; --wordmark-dark:#D9E1E5;

  --scrim-hero-x: linear-gradient(90deg, rgba(6,16,26,.92) 0%, rgba(6,16,26,.86) 50%, rgba(6,16,26,.58) 78%, rgba(6,16,26,.38) 100%);
  --scrim-hero-top: linear-gradient(180deg, rgba(6,16,26,.55) 0%, rgba(6,16,26,0) 22%);
  --scrim-hero-foot: linear-gradient(180deg, rgba(6,16,26,0) 62%, rgba(6,16,26,1) 100%);
  --scrim-hero-y: linear-gradient(180deg, rgba(6,16,26,.55) 0%, rgba(6,16,26,.70) 30%, rgba(6,16,26,.86) 55%, rgba(6,16,26,.94) 100%);
  --scrim-page-x: linear-gradient(90deg, rgba(6,16,26,.92) 0%, rgba(6,16,26,.82) 48%, rgba(6,16,26,.45) 100%);
  --scrim-page-y: linear-gradient(180deg, rgba(6,16,26,.62) 0%, rgba(6,16,26,.80) 45%, rgba(6,16,26,.94) 100%);
  --scrim-card: linear-gradient(180deg, rgba(6,16,26,.20) 0%, rgba(6,16,26,.62) 55%, rgba(6,16,26,.94) 100%);
  --glow-magenta: radial-gradient(40% 35% at 88% 6%, rgba(213,19,117,.18), rgba(213,19,117,0) 70%);
  --band-cta: linear-gradient(135deg, #06101A 0%, #0A2029 100%);

  --nav-h:72px; --wrap:1200px; --gutter:24px;
  --r-btn:4px; --r-card:14px; --r-panel:20px; --r-pill:999px;
  --section-y:112px;

  --shadow-hover: 0 2px 4px rgba(6,16,26,.06), 0 24px 48px -16px rgba(6,16,26,.28);
  --glow-teal: 0 0 0 1px rgba(33,177,194,.45), 0 12px 40px -12px rgba(33,177,194,.35);

  --ease-out: cubic-bezier(.16,1,.3,1); --ease-std: cubic-bezier(.22,.61,.36,1); --ease-io: cubic-bezier(.65,0,.35,1);
  --t-fast:160ms; --t:220ms; --t-slow:420ms;

  --fs-hero: clamp(2.125rem, 1.2rem + 3.9vw, 4.25rem);
  --fs-h1: clamp(2.25rem, 1.5rem + 3vw, 3.75rem);
  --fs-h2: clamp(1.875rem, 1.3rem + 2.2vw, 3rem);
  --fs-h3: clamp(1.25rem, 1.1rem + .6vw, 1.5rem);
  --fs-h4: clamp(1.125rem, 1.05rem + .25vw, 1.25rem);
  --fs-statement: clamp(1.625rem, 1.1rem + 2.4vw, 2.75rem);
  --fs-lead: clamp(1.0625rem, 1rem + .45vw, 1.3125rem);
  --fs-body: clamp(1rem, .96rem + .2vw, 1.0625rem);
  --fs-sm: .9375rem; --fs-label: .8125rem;
  --fs-numeral: clamp(2.75rem, 1.8rem + 3.2vw, 4.5rem);
  --fs-orbit: clamp(1rem, .8rem + 1vw, 1.75rem);
  --fs-btn: 1rem;
  --reveal-y: 24px;
  --proof-h: 96px;       /* desktop: hero + proof strip compose exactly one viewport */
}
@media (max-width:1023px){ :root{ --nav-h:68px; --section-y:88px; } }
@media (max-width:767px){ :root{ --section-y:64px; } }
@media (max-width:359px){ :root{ --gutter:16px; } }
@media (min-width:768px) and (max-width:1279px){ :root{ --gutter:32px; } }
@media (min-width:1280px){ :root{ --gutter:40px; } }
@media (min-width:1024px) and (max-height:800px){
  :root{ --section-y:80px; --fs-hero: clamp(2.125rem, 1.2rem + 3.9vw, 3.75rem); --fs-h2: clamp(1.875rem, 1.3rem + 2.2vw, 2.5rem); }
}

/* canvases — components never pick a colour themselves */
.is-dark{ --bg:var(--ink-900); --fg:var(--text-on-dark); --fg-muted:var(--text-muted-dark); --link:var(--brand-teal); --eyebrow:var(--brand-teal); --focus:var(--focus-dark); --hair:var(--ink-700); --card:var(--ink-800);
  --mark-ring:var(--wordmark-dark); --wm:var(--wordmark-dark); }
.is-dark.is-deep{ --bg:var(--ink-950); }
.is-light{ --bg:var(--surface); --fg:var(--text); --fg-muted:var(--text-muted); --link:var(--teal-ink); --eyebrow:var(--teal-ink); --focus:var(--focus-light); --hair:var(--line); --card:var(--surface-card);
  --mark-ring:var(--brand-graphite); --wm:var(--wordmark); }
.is-light.is-alt{ --bg:var(--surface-2); }
.is-dark [data-family="comm"], .is-dark[data-family="comm"]{ --fam:var(--brand-teal); }
.is-dark [data-family="conn"], .is-dark[data-family="conn"]{ --fam:var(--brand-sky); }
.is-dark [data-family="tech"], .is-dark[data-family="tech"]{ --fam:var(--brand-green); }
.is-light [data-family="comm"], .is-light[data-family="comm"]{ --fam:var(--teal-ink); }
.is-light [data-family="conn"], .is-light[data-family="conn"]{ --fam:var(--sky-ink); }
.is-light [data-family="tech"], .is-light[data-family="tech"]{ --fam:var(--green-ink); }

/* 10-base.css */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; text-size-adjust:100%; scroll-behavior:auto; background:var(--ink-950); }
body{ margin:0; font:400 var(--fs-body)/1.65 var(--font-body); color:var(--text); background:var(--surface);
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; text-rendering:optimizeLegibility; }
img,video{ display:block; max-width:100%; height:auto; }
svg{ display:block; }
.ic{ display:inline-block; flex:none; }
h1,h2,h3,h4{ font-family:var(--font-display); font-weight:600; margin:0; color:var(--fg); text-wrap:balance; }
h1{ font-size:var(--fs-h1); line-height:1.08; letter-spacing:-.022em; }
h2{ font-size:var(--fs-h2); line-height:1.12; letter-spacing:-.02em; }
h3{ font-size:var(--fs-h3); line-height:1.25; letter-spacing:-.01em; }
p{ margin:0; text-wrap:pretty; }
ul,ol{ margin:0; padding:0; list-style:none; }
address{ font-style:normal; }
a{ color:var(--link); text-decoration-thickness:1px; text-underline-offset:3px; }
button{ font:inherit; color:inherit; }
::selection{ background:var(--brand-teal); color:var(--ink-950); }
:focus-visible{ outline:3px solid var(--focus, var(--focus-light)); outline-offset:3px; border-radius:2px; }
.email{ overflow-wrap:anywhere; }

section{ background:var(--bg); color:var(--fg); padding-block:var(--section-y); position:relative; }
section p{ color:var(--fg-muted); }
.wrap{ width:min(100% - 2*var(--gutter), var(--wrap)); margin-inline:auto; }
.lead{ font-size:var(--fs-lead); line-height:1.55; max-width:44rem; }
.statement{ font:400 var(--fs-statement)/1.2 var(--font-display); letter-spacing:-.015em; color:var(--fg-muted); max-width:24ch; }
.label{ font:500 var(--fs-label)/1.3 var(--font-display); letter-spacing:.16em; text-transform:uppercase; color:var(--fg-muted); }

.skip{ position:fixed; left:16px; top:-80px; z-index:80; background:var(--cta); color:#FFFFFF; padding:12px 20px; border-radius:var(--r-btn);
  font:700 1rem/1.25 var(--font-display); text-decoration:none; }
.skip:focus{ top:12px; }
.sprite{ position:absolute; width:0; height:0; overflow:hidden; }

/* ---------------------------------------------------------------- eyebrow */
.eyebrow{ display:flex; align-items:center; gap:10px; margin:0 0 8px; color:var(--eyebrow);
  font:500 var(--fs-label)/1.3 var(--font-display); letter-spacing:.16em; text-transform:uppercase; }
section .eyebrow{ color:var(--eyebrow); }
.eyeglyph{ flex:none; }
.sechead{ margin-bottom:48px; max-width:46rem; }
.sechead h2{ max-width:22ch; }
.sechead .lead{ margin-top:16px; }
.sechead--c{ text-align:center; margin-inline:auto; }
.sechead--c .eyebrow{ justify-content:center; }
.sechead--c h2{ margin-inline:auto; }
@media (max-width:1023px){ .sechead{ margin-bottom:32px; } }

/* ---------------------------------------------------------------- buttons */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:10px; font:700 var(--fs-btn)/1.25 var(--font-display);
  letter-spacing:.01em; border-radius:var(--r-btn); text-decoration:none; border:1.5px solid transparent; cursor:pointer;
  transition:background-color .2s var(--ease-std), border-color .2s var(--ease-std), color .2s var(--ease-std); white-space:nowrap; }
.btn--sm{ min-height:44px; padding:0 20px; font-size:.9375rem; }
.btn--md{ min-height:52px; padding:0 28px; }
.btn--lg{ min-height:56px; padding:0 32px; }
.btn--full{ width:100%; }
.btn--primary{ background:var(--cta); color:var(--cta-label); }
.btn--primary:hover{ background:var(--cta-hover); }
.btn--primary:active{ background:var(--cta-active); }
.btn--ghost{ background:transparent; color:var(--text-on-dark); border-color:rgba(238,244,246,.55); }
.btn--ghost:hover{ background:rgba(238,244,246,.08); border-color:var(--text-on-dark); }
.btn--ghost:active{ background:rgba(238,244,246,.14); }
.btn--secondary{ background:transparent; color:var(--text); border-color:var(--text); }
.btn--secondary:hover{ background:var(--text); color:var(--surface); }
.is-dark .btn--secondary{ color:var(--text-on-dark); border-color:rgba(238,244,246,.55); }
.is-dark .btn--secondary:hover{ background:var(--text-on-dark); color:var(--text); }
.btn--tertiary{ background:var(--brand-teal); color:var(--ink-950); }
.btn--tertiary:hover{ background:#3CC3D2; }
.btnrow{ display:flex; flex-wrap:wrap; gap:12px; align-items:center; }
.btnrow--c{ justify-content:center; }
@media (max-width:767px){
  .btnrow{ flex-direction:column; align-items:stretch; }
  .btnrow > .btn{ width:100%; white-space:normal; text-align:center; }
}
.tlink{ display:inline-flex; align-items:center; gap:6px; min-height:44px; color:var(--link);
  font:600 .9375rem/1.3 var(--font-display); text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:4px; }
.tlink:hover{ text-decoration-thickness:2px; }

/* ------------------------------------------------------------------- chips */
.chip{ display:inline-flex; align-items:center; gap:8px; min-height:32px; padding:0 14px; border-radius:var(--r-pill);
  font:500 .8125rem/1.2 var(--font-display); letter-spacing:.12em; text-transform:uppercase; }
.is-dark .chip{ border:1px solid rgba(33,177,194,.45); background:rgba(33,177,194,.10); color:var(--text-on-dark); }
.is-light .chip{ border:1px solid rgba(21,111,122,.35); background:rgba(21,111,122,.08); color:var(--teal-ink); }
.is-dark .chip--fam, .is-light .chip--fam{ color:var(--fam); border-color:color-mix(in srgb, var(--fam) 45%, transparent); background:color-mix(in srgb, var(--fam) 10%, transparent); }
.is-dark .chip--fam{ color:var(--text-on-dark); }
.chip--link{ min-height:44px; text-decoration:none; letter-spacing:.06em; }

/* ------------------------------------------------------------------- ticks */
.ticks{ display:grid; gap:12px; }
.ticks li{ display:grid; grid-template-columns:20px minmax(0,1fr); gap:12px; align-items:start; color:var(--fg); }
.ticks .ic{ color:var(--fam, var(--link)); margin-top:3px; }

/* ------------------------------------------------------------------- grids */
.grid2,.grid3,.grid4{ display:grid; gap:24px; grid-template-columns:minmax(0,1fr); }
.grid2 > *,.grid3 > *,.grid4 > *{ min-width:0; }
@media (min-width:640px){ .grid3,.grid4{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (min-width:768px){ .grid2{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (min-width:1024px){ .grid3{ grid-template-columns:repeat(3,minmax(0,1fr)); } .grid4{ grid-template-columns:repeat(4,minmax(0,1fr)); } }

/* ------------------------------------------------------------------- cards */
.card{ position:relative; display:grid; grid-template-rows:auto auto 1fr auto; gap:16px; padding:28px; border-radius:var(--r-card);
  background:var(--card); border:1px solid var(--hair);
  transition:translate var(--t) var(--ease-std), box-shadow var(--t) var(--ease-std), border-color var(--t) var(--ease-std); }
.card h3{ font-size:var(--fs-h4); line-height:1.3; }
.card p{ color:var(--fg-muted); }
.card__ic{ width:48px; height:48px; border-radius:12px; display:grid; place-items:center; color:var(--fam);
  background:color-mix(in srgb, var(--fam) 10%, transparent); }
.card--dark{ --card:var(--ink-800); border-color:rgba(238,244,246,.10); }
.card__go{ font:600 .9375rem/1.3 var(--font-display); color:var(--link); text-decoration:none; align-self:end; min-height:24px; }
.stretch::after{ content:""; position:absolute; inset:0; border-radius:inherit; }
@media (hover:hover) and (min-width:1024px){
  .is-light .card--svc:hover{ translate:0 -4px; box-shadow:var(--shadow-hover); border-color:color-mix(in srgb, var(--fam) 45%, var(--line)); }
  .card--dark:hover{ box-shadow:var(--glow-teal); }
  .card--svc:hover .card__go{ text-decoration:underline; text-underline-offset:4px; }
}
@media (max-width:767px){ .card{ padding:24px; } }

.linkrow{ display:grid; grid-template-columns:40px minmax(0,1fr) auto; align-items:center; gap:16px; min-height:64px; padding:12px 20px;
  border:1px solid var(--hair); border-radius:var(--r-card); background:var(--card); color:var(--fg); text-decoration:none;
  font:600 1.125rem/1.3 var(--font-display); transition:background-color var(--t) var(--ease-std), border-color var(--t) var(--ease-std); }
.linkrow__ic{ width:40px; height:40px; display:grid; place-items:center; color:var(--fam, var(--link)); }
.linkrow__a{ color:var(--link); }
.linkrow:hover{ border-color:var(--link); }
.is-light .linkrow:hover{ background:var(--surface-2); }
.is-dark .linkrow{ --card:var(--ink-800); }

/* ------------------------------------------------------------- orbit rule */
.orbit-rule{ position:relative; height:96px; margin:0; pointer-events:none;
  -webkit-mask:linear-gradient(90deg, transparent 0, #000 12%, #000 88%, transparent 100%);
          mask:linear-gradient(90deg, transparent 0, #000 12%, #000 88%, transparent 100%); }
.orbit-rule svg{ width:100%; height:100%; overflow:visible; }
.or-arc{ fill:none; stroke:var(--link); stroke-width:1.5; vector-effect:non-scaling-stroke; }
.or-sat{ position:absolute; width:8px; height:8px; margin:-4px 0 0 -4px; border-radius:50%; background:var(--brand-green);
  left:calc(var(--t) * 100%); top:calc(16px + 64px * sin(acos(calc(var(--t) * 2 - 1)))); }
.is-light .or-sat{ background:var(--green-ink); }
@media (max-width:767px){ .orbit-rule{ height:64px; } .or-sat{ top:calc((16px + 64px * sin(acos(calc(var(--t) * 2 - 1)))) * .6667); } }

/* 20-nav.css */
/* ------------------------------------------------------------ brand lockup */
.lockup{ width:auto; height:28px; }
.lockup--lg{ height:32px; }
.bw{ fill:none; stroke:var(--wm, var(--wordmark-dark)); stroke-width:4.6; stroke-linecap:round; stroke-linejoin:round; }
.bl{ fill:none; stroke-width:4.6; stroke-linecap:round; }
.bl-i{ stroke:#00ACEA; } .bl-c{ stroke:#D51375; } .bl-t{ stroke:#7EB341; }
.bo-ring{ fill:none; stroke:var(--wm, var(--wordmark-dark)); stroke-width:71; }
.bo-orb{ fill:#00ACEA; } .bo-moon{ fill:#D51375; } .bo-sat{ fill:#7EB341; }
.bi-ring{ fill:none; stroke:var(--mark-ring, var(--wordmark-dark)); stroke-width:86; }
.bi-orb{ fill:var(--brand-teal); } .bi-orb-shadow{ fill:var(--brand-teal-shade); }
.bi-moon{ fill:var(--brand-moon); } .bi-moon-shade{ fill:var(--brand-moon-shade); }
.bi-sat{ fill:var(--brand-teal); } .bi-sat-shade{ fill:var(--brand-teal-shade); }
.mark--light{ --mark-ring:var(--brand-graphite); }
.brand{ display:inline-flex; align-items:center; min-height:44px; text-decoration:none; --wm:var(--wordmark-dark); }

/* --------------------------------------------------------------------- nav */
.nav{ position:fixed; inset:0 0 auto; z-index:50; height:var(--nav-h); padding-inline:var(--gutter);
  background:transparent; border-bottom:1px solid transparent;
  transition:background-color .24s var(--ease-std), border-color .24s var(--ease-std); }
.nav.scrolled, html:not(.js) .nav{ background:rgba(6,16,26,.96); border-bottom-color:rgba(238,244,246,.08); }
@supports (backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px)){
  .nav.scrolled{ background:rgba(6,16,26,.86); -webkit-backdrop-filter:blur(14px) saturate(1.2); backdrop-filter:blur(14px) saturate(1.2); }
}
.nav__in{ height:100%; max-width:var(--wrap); margin-inline:auto; display:grid; align-items:center;
  grid-template-columns:auto minmax(0,1fr) auto; grid-template-areas:"brand links cta"; }
.nav .brand{ grid-area:brand; }
.nav__links{ grid-area:links; justify-self:end; display:flex; gap:4px; margin-right:24px; }
.nav__links a{ position:relative; display:flex; align-items:center; height:44px; padding:0 12px; color:var(--text-muted-dark);
  font:500 .9375rem/1 var(--font-display); text-decoration:none; transition:color .16s var(--ease-std); }
.nav__links a:hover, .nav__links a[aria-current="page"]{ color:var(--text-on-dark); }
.nav__links a[aria-current="page"]::after{ content:""; position:absolute; left:50%; bottom:4px; width:5px; height:5px; margin-left:-2.5px; border-radius:50%; background:var(--brand-teal); }
.nav__cta{ grid-area:cta; }
.nav__call, .burger{ display:none; }
.nav :focus-visible{ outline-color:var(--focus-dark); }
@media (min-width:1280px){ .nav__links a{ padding:0 16px; font-size:1rem; } }

@media (max-width:1023px){
  .nav__in{ grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); grid-template-areas:"call brand burger"; }
  .nav__links, .nav__cta{ display:none; }
  .nav .lockup{ height:24px; }
  .nav__call{ grid-area:call; justify-self:start; display:grid; place-items:center; width:44px; height:44px; color:var(--text-on-dark); border-radius:50%; }
  .burger{ grid-area:burger; justify-self:end; align-self:center; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px;
    width:44px; height:44px; padding:0; border:0; background:transparent; cursor:pointer; }
  .burger span{ display:block; width:22px; height:2px; border-radius:2px; background:var(--text-on-dark); transition:transform .2s var(--ease-std), opacity .2s var(--ease-std); }
  .burger[aria-expanded="true"] span:nth-child(1){ transform:translateY(8px) rotate(45deg); }
  .burger[aria-expanded="true"] span:nth-child(2){ opacity:0; }
  .burger[aria-expanded="true"] span:nth-child(3){ transform:translateY(-8px) rotate(-45deg); }
}

/* ----------------------------------------------------------------- overlay */
.overlay{ position:fixed; inset:0; z-index:70; background:rgba(6,16,26,.985); display:flex; flex-direction:column; align-items:center; justify-content:center;
  padding:80px 24px 64px; --wm:var(--wordmark-dark); --focus:var(--focus-dark); opacity:0; transition:opacity .2s var(--ease-std); overflow-y:auto; }
.overlay[hidden]{ display:none; }
.overlay.is-open{ opacity:1; }
.overlay__brand{ position:absolute; top:12px; left:24px; }
.overlay__brand .lockup{ height:24px; }
.overlay__close{ position:absolute; top:12px; right:24px; width:44px; height:44px; display:grid; place-items:center; border:0; background:transparent; color:var(--text-on-dark); cursor:pointer; }
.overlay__links{ display:flex; flex-direction:column; align-items:center; gap:4px; }
.overlay__links a{ display:flex; align-items:center; gap:10px; min-height:52px; color:var(--text-on-dark); font:500 1.75rem/1.2 var(--font-display); text-decoration:none; }
.overlay__links a[aria-current="page"]{ color:var(--brand-teal); }
.overlay__links a[aria-current="page"]::before{ content:""; width:8px; height:8px; border-radius:50%; background:var(--brand-teal); }
.overlay__cta{ display:flex; flex-direction:column; align-items:center; gap:4px; width:min(100%, 320px); margin-top:32px; }
.overlay__cta .btn{ white-space:normal; text-align:center; }
.overlay__call{ display:flex; align-items:center; min-height:44px; color:var(--brand-teal); font:600 1rem/1.3 var(--font-display); }
.overlay__tag{ position:absolute; bottom:32px; left:0; right:0; text-align:center; color:var(--text-muted-dark);
  font:500 var(--fs-label)/1.3 var(--font-display); letter-spacing:.16em; text-transform:uppercase; }
@media (max-height:600px){ .overlay{ justify-content:flex-start; } .overlay__tag{ position:static; margin-top:24px; } }
body.menu-open .wafloat{ display:none; }

/* ---------------------------------------------------------- whatsapp float */
.wafloat{ position:fixed; z-index:60; right:max(16px, env(safe-area-inset-right)); bottom:max(16px, env(safe-area-inset-bottom));
  width:56px; height:56px; border-radius:50%; background:var(--wa); color:#FFFFFF; display:grid; place-items:center;
  box-shadow:0 0 0 2px var(--ink-950), 0 10px 24px -8px rgba(6,16,26,.55); text-decoration:none; }
.wafloat__lbl{ position:absolute; right:calc(100% + 12px); top:50%; translate:0 -50%; height:36px; padding:0 14px; display:flex; align-items:center;
  white-space:nowrap; border-radius:var(--r-pill); background:var(--ink-800); border:1px solid var(--ink-700); color:var(--text-on-dark);
  font:600 .875rem/1 var(--font-display); opacity:0; pointer-events:none; transition:opacity .16s var(--ease-std); }
@media (min-width:1024px){ .wafloat{ right:24px; bottom:24px; width:60px; height:60px; } }
@media (hover:hover){ .wafloat:hover .wafloat__lbl, .wafloat:focus-visible .wafloat__lbl{ opacity:1; } }

/* ------------------------------------------------------------------ footer */
.footer{ background:var(--ink-950); color:var(--text-muted-dark); padding:0 0 32px; }
.footer .orbit-rule{ width:min(100% - 2*var(--gutter), var(--wrap)); margin-inline:auto; }
.footer__grid{ display:grid; gap:48px; grid-template-columns:minmax(0,1.4fr) repeat(3, minmax(0,1fr)); padding-block:24px 48px; }
.footer__brand p{ margin-top:20px; max-width:36ch; font-size:var(--fs-sm); }
.footer__brand address{ margin-top:16px; font-size:var(--fs-sm); line-height:1.6; }
.footer__h{ display:flex; align-items:center; gap:10px; margin-bottom:12px; color:var(--text-muted-dark);
  font:500 var(--fs-label)/1.3 var(--font-display); letter-spacing:.16em; text-transform:uppercase; }
.footer__h::before{ content:""; width:14px; height:6px; border:1.5px solid var(--brand-teal); border-radius:50%; transform:rotate(-18deg); }
.footer ul{ display:grid; gap:4px; }
.footer li a{ display:inline-flex; align-items:center; min-height:44px; min-width:44px; color:var(--text-muted-dark); text-decoration:none; font-size:var(--fs-sm); }
.footer li a:hover{ color:var(--text-on-dark); text-decoration:underline; }
.footer__touch .btn{ margin-bottom:8px; }
.footer__md{ display:block; padding-block:10px; font-size:var(--fs-sm); }
.footer__bot{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px 24px; padding-top:24px; border-top:1px solid var(--ink-700); font-size:var(--fs-sm); }
.footer__bot{ align-items:center; }
.footer__bot a{ color:var(--text-muted-dark); display:inline-flex; align-items:center; min-height:44px; }
@media (min-width:1024px){ .footer__bot{ padding-right:96px; } }  /* clear the WhatsApp float */
@media (max-width:1023px){ .footer__grid{ grid-template-columns:repeat(2, minmax(0,1fr)); } }
@media (max-width:767px){
  .footer{ padding-bottom:96px; }
  .footer__grid{ grid-template-columns:minmax(0,1fr); gap:32px; }
  .footer__col:not(.footer__touch) ul{ grid-template-columns:repeat(2, minmax(0,1fr)); column-gap:16px; }
  .footer__bot{ flex-direction:column; }
}

/* 30-hero.css */
/* ==================================================================== HERO */
.hero{ min-height:100vh; min-height:100svh; padding:0; display:flex; flex-direction:column; justify-content:center; overflow:hidden; isolation:isolate; }
/* Desktop: the hero is one viewport MINUS the proof strip, so hero + stats land exactly on the fold.
   min-height (not height): if the content ever needs more, the hero grows instead of cropping. */
@media (min-width:1024px){ .hero{ min-height:max(540px, calc(100vh - var(--proof-h))); min-height:max(540px, calc(100svh - var(--proof-h))); } }
.hero__media{ position:absolute; inset:0; z-index:0; overflow:hidden; }
.hero__poster, .hero__poster img, .hero__video{ position:absolute; inset:0; width:100%; height:100%; }
.hero__poster img, .hero__video{ object-fit:cover; object-position:50% 50%; }
.hero__video{ opacity:0; transition:opacity .4s var(--ease-std); }
.hero__media[data-ready][data-state="playing"] .hero__video,
.hero__media[data-ready][data-state="paused-user"] .hero__video,
.hero__media[data-ready][data-state="paused-auto"] .hero__video{ opacity:1; }
.hero__scrim{ position:absolute; inset:0; background:var(--glow-magenta), var(--scrim-hero-top), var(--scrim-hero-foot), var(--scrim-hero-x); }
@media (max-width:1023px) and (orientation:portrait){ .hero__scrim{ background:var(--scrim-hero-y); } }

.hero__lines{ position:absolute; z-index:1; width:900px; max-width:none; right:-160px; top:50%; margin-top:-450px; height:900px; opacity:.6; pointer-events:none; }
.hero__lines .ol{ fill:none; stroke:var(--brand-teal); stroke-width:1.4; vector-effect:non-scaling-stroke; }
.hero__lines .ol-sat{ fill:var(--brand-green); }
@media (max-width:1023px){ .hero__lines{ display:none; } }

.hero__content{ position:relative; z-index:2; padding-top:calc(var(--nav-h) + 32px); padding-bottom:88px; }
.hero__content > *{ max-width:820px; }
.hero__chip{ margin-bottom:24px; }
.hero__chip .eyeglyph{ color:var(--brand-teal); }
.hero__h1{ font-size:var(--fs-hero); line-height:1.06; letter-spacing:-.025em; color:var(--text-on-dark); max-width:15.5ch; }
.hero__h1 .w{ display:inline-block; overflow:hidden; padding-bottom:.12em; margin-bottom:-.12em; vertical-align:top; }
.hero__h1 .w > span{ display:inline-block; }
.hero__loc{ display:block; margin-top:.7em; font:500 max(.8125rem, .3em)/1.3 var(--font-display); letter-spacing:.16em; text-transform:uppercase; color:var(--brand-teal); }
.hero__sub{ margin-top:24px; font-size:var(--fs-lead); line-height:1.55; color:var(--text-on-dark); max-width:44rem; }
.hero__ctas{ margin-top:32px; }
.trustline{ display:flex; flex-wrap:wrap; gap:6px 0; margin-top:28px; color:var(--text-muted-dark); font:500 var(--fs-sm)/1.5 var(--font-body); }
.trustline li{ display:inline-flex; align-items:center; }
.trustline li + li::before{ content:""; width:4px; height:4px; margin:0 12px; border-radius:50%; background:var(--brand-teal); }



.hero__toggle{ position:absolute; z-index:3; left:max(var(--gutter), calc((100% - var(--wrap)) / 2)); bottom:24px; width:44px; height:44px; border-radius:50%;
  display:grid; place-items:center; background:transparent; border:1px solid rgba(238,244,246,.35); color:var(--text-on-dark); cursor:pointer;
  transition:background-color .16s var(--ease-std), border-color .16s var(--ease-std); }
.hero__toggle[hidden]{ display:none; }
@media (min-width:1024px){ .hero__toggle{ left:auto; right:max(var(--gutter), calc((100% - var(--wrap)) / 2)); } }
.hero__toggle:hover{ background:rgba(238,244,246,.08); border-color:var(--text-on-dark); }
.hero__toggle .i-play{ display:none; }
.hero__toggle[aria-pressed="true"] .i-play{ display:block; }
.hero__toggle[aria-pressed="true"] .i-pause{ display:none; }
.hero__toggle span{ display:grid; }

@media (min-width:1024px) and (max-height:800px){
  .hero__content{ padding-top:calc(var(--nav-h) + 20px); padding-bottom:24px; }
  .hero__chip{ margin-bottom:14px; } .hero__sub{ margin-top:14px; } .hero__ctas{ margin-top:22px; } .trustline{ margin-top:16px; }
}
@media (max-width:1023px){
  .hero{ justify-content:flex-end; min-height:max(560px, 100svh); }
  .hero__content{ padding-top:calc(var(--nav-h) + 24px); padding-bottom:88px; }
  .hero__chip{ margin-bottom:16px; min-height:28px; }
  .hero__sub{ margin-top:16px; } .hero__ctas{ margin-top:24px; }
  .trustline{ margin-top:20px; }
  .hero__toggle{ bottom:20px; }
}
@media (max-width:767px){ .hero__content{ padding-bottom:84px; } }

/* entrance — CSS keyframes, desktop motion only; every final frame is opacity:1 + transform:none */
@media (min-width:1024px) and (prefers-reduced-motion:no-preference){
  .hero__chip{ animation:rise8 .5s var(--ease-out) 60ms both; }
  .hero__h1 .w > span{ animation:maskup .76s var(--ease-out) both; animation-delay:calc(120ms + var(--i) * 35ms); }
  .hero__loc{ animation:fadein .6s var(--ease-std) 640ms both; }
  .hero__sub{ animation:rise12 .56s var(--ease-out) 420ms both; }
  .hero__cta{ animation:rise10 .44s var(--ease-out) 520ms both; }
  .hero__cta2{ animation:rise10 .44s var(--ease-out) 600ms both; }
  .trustline{ animation:fadein .5s var(--ease-std) 700ms both; }
  /* the proof strip IS the first viewport — it enters with the hero, never on a scroll trigger
     (at 1920×1080 its top sits at 91%, below the 88% reveal line, so it stayed invisible until a scroll) */
  .proof__tile{ animation:rise10 .44s var(--ease-out) both; animation-delay:calc(760ms + var(--i) * 70ms); }
  .hero__lines .ol{ stroke-dasharray:1; animation:draw 1.4s var(--ease-io) 700ms both; }
  .page-hero__media img{ animation:settle 1.4s var(--ease-out) both; }
  .page-hero .crumbs{ animation:rise12 .5s var(--ease-out) 60ms both; }
  .page-hero h1{ animation:rise12 .5s var(--ease-out) 120ms both; }
  .page-hero .lead{ animation:rise12 .5s var(--ease-out) 220ms both; }
}
@keyframes rise8{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:none; } }
@keyframes rise10{ from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:none; } }
@keyframes rise12{ from{ opacity:0; transform:translateY(12px); } to{ opacity:1; transform:none; } }
@keyframes maskup{ from{ transform:translateY(105%); } to{ transform:none; } }
@keyframes fadein{ from{ opacity:0; } to{ opacity:1; } }
@keyframes draw{ from{ stroke-dashoffset:1; } to{ stroke-dashoffset:0; } }
@keyframes settle{ from{ transform:scale(1.08); } to{ transform:none; } }

/* ============================================================== PAGE HERO */
.page-hero{ min-height:clamp(440px, 64svh, 600px); padding:calc(var(--nav-h) + 32px) 0 64px; display:flex; align-items:flex-end; overflow:hidden; isolation:isolate; }
.page-hero--compact{ min-height:clamp(360px, 46svh, 460px); }
.page-hero__media{ position:absolute; inset:0; z-index:-2; overflow:hidden; }
.page-hero__media picture, .page-hero__media img{ width:100%; height:100%; }
.page-hero__media img{ object-fit:cover; }
.page-hero__scrim{ position:absolute; inset:0; z-index:-1; background:var(--scrim-page-x), var(--scrim-hero-top); }
@media (max-width:1023px) and (orientation:portrait){ .page-hero__scrim{ background:var(--scrim-page-y); } }
.page-hero--plain .page-hero__scrim{ background:radial-gradient(40% 60% at 85% 40%, rgba(33,177,194,.12), rgba(33,177,194,0) 70%); }
.page-hero__lines{ position:absolute; z-index:-1; right:-120px; top:50%; width:640px; height:640px; margin-top:-320px; opacity:.5; }
.page-hero__lines .ol{ fill:none; stroke:var(--brand-teal); stroke-width:1.2; vector-effect:non-scaling-stroke; }
.page-hero__lines .ol-sat{ fill:var(--brand-green); }
.page-hero__in > *{ max-width:760px; }
.page-hero h1{ color:var(--text-on-dark); margin-top:16px; }
.page-hero .chip{ margin-top:16px; }
.page-hero .chip + h1{ margin-top:12px; }
.page-hero .lead{ margin-top:16px; color:var(--text-on-dark); }
.page-hero .btnrow{ margin-top:32px; }
.crumbs ol{ display:flex; flex-wrap:wrap; align-items:center; font:500 var(--fs-sm)/1.4 var(--font-body); color:var(--text-on-dark); }
.crumbs li{ display:inline-flex; align-items:center; }
.crumbs li + li::before{ content:""; width:4px; height:4px; margin:0 10px; border-radius:50%; background:var(--brand-teal); }
.crumbs a{ color:var(--text-on-dark); opacity:.86; text-decoration:none; display:inline-flex; align-items:center; justify-content:center; min-height:44px; min-width:44px; }
.crumbs a:hover{ color:var(--text-on-dark); text-decoration:underline; }
.crumbs [aria-current]{ color:var(--text-on-dark); }
@media (max-width:1023px){
  .page-hero{ min-height:0; padding:calc(var(--nav-h) + 24px) 0 48px; }
  .page-hero .btnrow{ margin-top:24px; }
  .page-hero__lines{ display:none; }
}
@media (min-width:1024px) and (max-height:800px){ .page-hero{ min-height:clamp(420px, 62svh, 520px); padding-bottom:48px; } }
@media (max-width:767px){
  .trustline{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:6px 16px; }
  .trustline li::before, .trustline li + li::before{ content:""; flex:none; width:4px; height:4px; margin:0 8px 0 0; border-radius:50%; background:var(--brand-teal); }
}

/* 40-sections.css */
/* =================================================================== PROOF
   A slim band that sits ON the fold under the hero (desktop) — number beside label, one row. */
.proof{ padding-block:24px; border-top:1px solid rgba(238,244,246,.08); }
.proof__grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px 16px; }
.proof__tile{ display:flex; align-items:center; gap:12px; min-width:0; }
.proof__n{ flex:none; font:300 2rem/1 var(--font-display); letter-spacing:-.01em; font-variant-numeric:tabular-nums; color:var(--brand-teal); }
.proof__ic{ flex:none; display:flex; align-items:center; color:var(--brand-teal); }
.proof__l{ font:500 .875rem/1.35 var(--font-body); color:var(--text-muted-dark); min-width:0; }
@media (min-width:1024px){
  .proof{ height:var(--proof-h); padding-block:0; display:flex; align-items:center; }
  .proof > .wrap{ width:min(100% - 2*var(--gutter), var(--wrap)); }
  .proof__grid{ grid-template-columns:repeat(3, minmax(0,.8fr)) minmax(0,1.3fr); gap:0; }
  .proof__tile{ padding:0 24px; border-left:1px solid var(--ink-700); gap:14px; }
  .proof__tile:first-child{ padding-left:0; border-left:0; }
  .proof__n{ font-size:2.5rem; }
  .proof__l{ font-size:.9375rem; }
}
@media (min-width:1024px) and (max-width:1279px){ .proof__tile{ padding:0 16px; } .proof__n{ font-size:2.125rem; } .proof__l{ font-size:.875rem; } }

/* =================================================================== SPLIT */
.split{ display:grid; gap:32px; grid-template-columns:minmax(0,1fr); align-items:center; }
.split__media{ border-radius:var(--r-panel); overflow:hidden; aspect-ratio:16/10; }
.split__media picture, .split__media img{ width:100%; height:100%; }
.split__media img{ object-fit:cover; }
.split__txt{ display:grid; gap:16px; max-width:600px; }
.split__txt .lead{ color:var(--fg); }
@media (min-width:1024px){
  .split{ grid-template-columns:repeat(12,minmax(0,1fr)); gap:32px; }
  .split__media{ grid-column:1 / span 5; aspect-ratio:4/5; max-height:min(560px, 72svh); }
  .split__txt{ grid-column:7 / span 6; }
}

/* =============================================================== AUDIENCES */
/* aspect-ratio + min-height inflates WIDTH (the min-height transfers through the ratio): at 768 a card grew to 672px in a 340px column. Ratio only where min-height is off. */
.aud{ position:relative; border-radius:var(--r-panel); overflow:hidden; min-height:420px; display:flex; align-items:flex-end; isolation:isolate;
  border:1px solid transparent; transition:border-color .3s var(--ease-std); }
.aud picture{ position:absolute; inset:0; z-index:-2; }
.aud img{ width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease-out); }
.aud::before{ content:""; position:absolute; inset:0; z-index:-1; background:var(--scrim-card); }
.aud__in{ padding:32px; display:grid; gap:12px; justify-items:start; --fg:var(--text-on-dark); --fg-muted:var(--text-on-dark); }
.aud__in h3{ color:var(--text-on-dark); font-size:var(--fs-h3); }
.aud__in p{ color:rgba(238,244,246,.92); max-width:40ch; }
.aud__in .chip{ border:1px solid rgba(33,177,194,.45); background:rgba(33,177,194,.14); color:var(--text-on-dark); }
.aud__in .btn{ margin-top:8px; white-space:normal; text-align:center; }
@media (min-width:1024px){ .aud{ aspect-ratio:4/3; min-height:0; } }
@media (hover:hover) and (min-width:1024px){ .aud:hover img{ transform:scale(1.05); } .aud:hover{ border-color:var(--brand-teal); } }
@media (max-width:767px){ .aud{ min-height:440px; } .aud__in{ padding:24px; } }

/* ===================================================================== AIM */
.aim__grid{ display:grid; gap:32px; grid-template-columns:minmax(0,1fr); align-items:center; }
.aim__statement{ margin-top:12px; font:400 var(--fs-statement)/1.2 var(--font-display); letter-spacing:-.015em; color:var(--text); max-width:22ch; }
.aim__statement em{ font-style:normal; color:var(--teal-ink); }
.aim__mark{ display:none; }
@media (min-width:1024px){
  .aim__grid{ grid-template-columns:repeat(12,minmax(0,1fr)); }
  .aim__grid > :first-child{ grid-column:1 / span 8; }
  .aim__mark{ display:block; grid-column:10 / span 3; justify-self:end; }
  .aim__mark .mark{ width:240px; height:240px; }
}

/* ================================================================ CTA BAND */
.cta-band{ background:var(--band-cta); overflow:hidden; padding-block:clamp(72px, 8vw, 112px); isolation:isolate; }
.cta-band__art{ position:absolute; z-index:-1; right:-140px; top:50%; width:560px; height:560px; margin-top:-280px; opacity:.28; pointer-events:none; }
.cta-band__art .ol{ fill:none; stroke:var(--brand-teal); stroke-width:1.2; vector-effect:non-scaling-stroke; }
.cta-band__art .ol-sat{ fill:var(--brand-green); }
.cta-band__txt{ max-width:40rem; }
.cta-band h2{ max-width:20ch; }
.cta-band .lead{ margin-top:16px; }
.cta-band .btnrow{ margin-top:32px; }
.cta-band--slim{ padding-block:48px; }
@media (min-width:1024px){
  .cta-band--slim .cta-band__in{ display:flex; align-items:center; justify-content:space-between; gap:32px; }
  .cta-band--slim .btnrow{ margin-top:0; flex:none; }
}
@media (max-width:767px){ .cta-band__art{ right:-280px; opacity:.18; } }

/* =================================================================== STORY */
.story__grid{ display:grid; gap:24px; grid-template-columns:minmax(0,1fr); }
.story__year{ display:flex; flex-direction:column; gap:8px; }
.story__n{ font:300 min(96px, calc(var(--fs-numeral) * 1.4))/1 var(--font-display); color:var(--teal-ink); letter-spacing:-.01em; }
.story__txt{ display:grid; gap:16px; max-width:65ch; }
.story__txt .lead{ color:var(--fg); }
@media (min-width:1024px){
  .story__grid{ grid-template-columns:repeat(12,minmax(0,1fr)); gap:32px; }
  .story__year{ grid-column:1 / span 4; position:sticky; top:calc(var(--nav-h) + 48px); align-self:start; }
  .story__txt{ grid-column:6 / span 7; }
}
.grid3--rows{ gap:16px; }

/* ================================================================== PERSON */
.person{ display:flex; gap:24px; align-items:flex-start; max-width:560px; padding:32px; border:1px solid var(--line); border-radius:var(--r-card); background:var(--surface-card); }
.person__mono{ position:relative; flex:none; width:72px; height:72px; border-radius:50%; border:2px solid var(--teal-ink); display:grid; place-items:center;
  font:500 1.375rem/1 var(--font-display); color:var(--text); }
.person__mono i{ position:absolute; width:10px; height:10px; border-radius:50%; background:var(--green-ink); right:4px; top:4px; }
.person h3{ font-size:var(--fs-h3); }
.person .label{ margin-top:4px; }
.person__links{ margin-top:12px; display:grid; gap:2px; }
.person__links a{ display:inline-flex; align-items:center; gap:10px; min-height:44px; color:var(--link); }
@media (max-width:479px){ .person{ flex-direction:column; padding:24px; } }

/* ================================================================ COVERAGE */
.coverage{ padding-block:64px 88px; }
.coverage__line{ font:300 var(--fs-orbit)/1.4 var(--font-display); letter-spacing:.3em; text-transform:uppercase; color:var(--text-on-dark); max-width:36ch; }
section .coverage__line{ color:var(--text-on-dark); }
.coverage__from{ margin-top:16px; color:var(--brand-teal); }
section .coverage__from{ color:var(--brand-teal); }
@media (max-width:767px){ .coverage__line{ letter-spacing:.18em; } }

/* ===================================================================== HUB */
.hub .wrap{ display:grid; gap:96px; }
.row{ display:grid; gap:32px; grid-template-columns:minmax(0,1fr); align-items:center; scroll-margin-top:calc(var(--nav-h) + 16px); }
.row__media{ border-radius:var(--r-panel); overflow:hidden; aspect-ratio:16/10; }
.row__media picture, .row__media img{ width:100%; height:100%; }
.row__media img{ object-fit:cover; }
.row__txt{ display:grid; gap:16px; justify-items:start; max-width:600px; }
.row__txt .lead{ color:var(--fg); }
.row__txt .btnrow{ margin-top:8px; }
@media (min-width:1024px){
  .row{ grid-template-columns:repeat(12,minmax(0,1fr)); }
  .row__media{ grid-column:1 / span 6; aspect-ratio:3/2; }
  .row__txt{ grid-column:8 / span 5; }
  .row--flip .row__media{ grid-column:7 / span 6; grid-row:1; }
  .row--flip .row__txt{ grid-column:1 / span 5; grid-row:1; }
}
@media (max-width:1023px){ .hub .wrap{ gap:64px; } }

/* ============================================================ SERVICE BODY */
.svc-body__grid{ display:grid; gap:32px; grid-template-columns:minmax(0,1fr); }
.svc-body__txt{ display:grid; gap:16px; max-width:65ch; align-content:start; }
.svc-body__txt h2{ max-width:22ch; }
.svc-body__txt .lead{ color:var(--fg); }
.bullets{ display:grid; gap:14px; }
.bullets li{ position:relative; padding-left:28px; color:var(--fg-muted); }
.bullets li::before{ content:""; position:absolute; left:4px; top:.6em; width:10px; height:10px; border-radius:50%; border:2px solid var(--fam, var(--link)); }
.glance{ display:grid; gap:20px; align-content:start; padding:28px; background:var(--surface-card); border:1px solid var(--line); border-radius:var(--r-card); }
.glance .label{ color:var(--teal-ink); }
@media (min-width:1024px){
  .svc-body__grid{ grid-template-columns:repeat(12,minmax(0,1fr)); }
  .svc-body__txt{ grid-column:1 / span 7; }
  .glance{ grid-column:9 / span 4; position:sticky; top:calc(var(--nav-h) + 32px); align-self:start; }
}

/* ================================================================= FEATURE */
.feature{ overflow:hidden; }
.feat{ display:grid; gap:40px; }
.feat .sechead{ margin-bottom:0; }
.feat + .feat{ margin-top:64px; }
.statement--callout{ max-width:30ch; color:var(--text-on-dark); border-left:2px solid var(--brand-teal); padding-left:24px; font-size:clamp(1.375rem, 1rem + 1.6vw, 2.25rem); }
section .statement--callout{ color:var(--text-on-dark); }
.pair{ gap:16px; }
.pair__t, .tile{ display:grid; gap:16px; align-content:start; padding:28px; border-radius:var(--r-card); background:var(--ink-800); border:1px solid rgba(238,244,246,.10); color:var(--fam, var(--brand-teal)); }
.pair__t h3, .tile h3{ font-size:var(--fs-h4); line-height:1.3; }
.tile p{ color:var(--text-muted-dark); }
.tile--wide{ display:flex; align-items:center; gap:16px; }
.tiles{ gap:16px; }
.dia{ width:100%; height:auto; overflow:visible; }
.dia-label{ font:500 26px var(--font-display); fill:var(--text-muted-dark); }
.dia__cap, .pbx__cap{ color:var(--text-muted-dark); max-width:60ch; }
.feat__more{ margin-top:-16px; }

/* voice */
.dia--voice{ height:clamp(120px, 16vw, 200px); }
.wave-base{ stroke:var(--ink-700); stroke-width:1.5; fill:none; vector-effect:non-scaling-stroke; }
.wave{ fill:none; stroke:var(--brand-sky); stroke-width:2.5; vector-effect:non-scaling-stroke; stroke-linejoin:round; filter:drop-shadow(0 0 8px rgba(0,172,234,.45)); }
/* pbx */
.pbx{ display:grid; gap:16px; justify-items:center; text-align:center; }
.dia--pbx{ max-width:900px; }
.pbx-ring{ fill:none; stroke:var(--brand-teal); stroke-width:3; stroke-dasharray:1 18; stroke-linecap:round; }
.pbx-ring--2{ stroke:var(--brand-sky); opacity:.7; }
.pbx-core{ fill:var(--ink-800); stroke:var(--wordmark-dark); stroke-width:14; }
.pbx-lbl{ font:600 34px var(--font-display); fill:var(--text-on-dark); letter-spacing:.08em; }
/* fibre trench */
.tr-bracket{ fill:none; stroke:var(--text-muted-dark); stroke-width:2; }
.tr-unit > rect:first-child{ fill:var(--ink-800); stroke:var(--ink-700); stroke-width:2; }
.tr-win{ fill:var(--brand-teal); fill-opacity:.35; }
.tr-ground{ fill:var(--ink-700); }
.tr-slot{ fill:var(--ink-950); }
.tr-duct{ fill:none; stroke:var(--brand-teal); stroke-width:6; stroke-linecap:round; filter:drop-shadow(0 0 6px rgba(33,177,194,.6)); }
.tr-drop{ fill:none; stroke:var(--brand-sky); stroke-width:3; }
.tr-conn{ fill:var(--brand-green); }
/* lte */
.lte-track{ fill:none; stroke:var(--ink-700); stroke-width:2; }
.lte-flow{ fill:none; stroke-width:6; stroke-linecap:round; stroke-dasharray:0 22; }
.lte-flow--voice{ stroke:var(--brand-teal); }
.lte-flow--data{ stroke:var(--text-muted-dark); opacity:.45; }
.lte-gate{ fill:var(--ink-800); stroke:var(--brand-teal); stroke-width:2; }
.lte-box{ fill:rgba(33,177,194,.06); stroke:var(--brand-teal); stroke-width:2; }
.dia-label--voice{ fill:var(--text-on-dark); }
.dia--lte{ max-width:1000px; }
/* hardware */
.spectrum{ position:relative; padding-top:24px; }
.spectrum__arc{ position:absolute; left:0; right:0; top:0; width:100%; height:96px; }
.spectrum__arc path{ fill:none; stroke:var(--brand-teal); stroke-width:1.5; vector-effect:non-scaling-stroke; opacity:.6; }
.spectrum__row{ position:relative; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:16px; }
.spectrum__row li{ display:grid; justify-items:center; gap:12px; text-align:center; }
.spectrum__ic{ width:88px; height:88px; border-radius:50%; display:grid; place-items:center; background:var(--ink-800); border:1px solid var(--ink-700); color:var(--brand-green); }
.spectrum__l{ font:600 1rem/1.3 var(--font-display); color:var(--text-on-dark); }
.spectrum__mid{ text-align:center; margin-top:16px; color:var(--text-muted-dark); }
@media (max-width:767px){
  .spectrum__arc{ display:none; }
  .spectrum__row{ grid-template-columns:repeat(3,minmax(0,1fr)); row-gap:24px; }
  .spectrum__ic{ width:72px; height:72px; }
}
/* steps (fibre / landlords) */
.steps{ position:relative; display:grid; gap:24px; grid-template-columns:minmax(0,1fr); counter-reset:s; }
.steps li{ position:relative; display:grid; gap:8px; align-content:start; padding-left:64px; }
.steps__mk{ position:absolute; left:0; top:0; width:44px; height:44px; border-radius:50%; border:2px solid var(--brand-teal); display:grid; place-items:center; background:var(--ink-900); }
.steps__mk i{ width:8px; height:8px; border-radius:50%; background:var(--brand-green); }
.steps h3{ font-size:var(--fs-h4); }
.steps p{ color:var(--text-muted-dark); }
@media (min-width:1024px){
  .steps{ grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px; }
  .steps::before{ content:""; position:absolute; left:22px; right:22px; top:22px; height:1.5px; background:linear-gradient(90deg, var(--brand-teal), rgba(33,177,194,.2)); }
  .steps li{ padding-left:0; padding-top:64px; }
}
@media (max-width:1023px){ .steps::before{ content:""; position:absolute; left:21px; top:44px; bottom:0; width:2px; background:rgba(33,177,194,.4); } }
.how .feat + .steps, .how .feat--fibre + .steps{ margin-top:64px; }

/* =============================================================== LANDLORDS */
.what__grid{ display:grid; gap:24px; grid-template-columns:minmax(0,1fr); }
.what__grid .lead{ color:var(--fg); }
@media (min-width:1024px){ .what__grid{ grid-template-columns:repeat(12,minmax(0,1fr)); gap:32px; align-items:end; } .what__grid > :first-child{ grid-column:1 / span 6; } .what__grid .lead{ grid-column:8 / span 5; } }
.card--benefit{ grid-template-rows:auto auto auto; }
.card--benefit h3{ font-size:var(--fs-h3); }
.tenants{ padding-block:64px; }
.tenants__row{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:24px; }
.tenants__q{ font:600 var(--fs-h3)/1.3 var(--font-display); color:var(--fg); }
section .tenants__q{ color:var(--fg); }

/* ================================================================= CONTACT */
.contact__grid{ display:grid; gap:32px; grid-template-columns:minmax(0,1fr); align-items:start; }
.contact__grid > *{ min-width:0; }
@media (min-width:1024px){ .contact__grid{ grid-template-columns:minmax(0,7fr) minmax(0,5fr); } }
@media (max-width:1023px){ .details{ order:-1; } }
.formcard{ background:var(--surface-card); border:1px solid var(--line); border-radius:var(--r-panel); padding:40px; }
.formcard h2{ font-size:var(--fs-h3); }
.formcard__lead{ margin:8px 0 24px; font-size:var(--fs-sm); }
.details{ background:var(--ink-900); color:var(--text-on-dark); border-radius:var(--r-panel); padding:32px; display:grid; gap:24px; }
.wacard{ display:grid; gap:12px; justify-items:start; padding:24px; background:var(--ink-800); border:1px solid rgba(37,211,102,.45); border-radius:var(--r-card); }
.wacard h2{ font-size:var(--fs-h3); color:var(--text-on-dark); }
.wacard p{ color:var(--text-muted-dark); }
.wacard__disc{ width:48px; height:48px; border-radius:50%; background:var(--wa); color:#FFFFFF; display:grid; place-items:center; }
.details__list{ display:grid; gap:8px; }
.details__list li{ display:grid; grid-template-columns:20px minmax(0,1fr); gap:14px; align-items:center; min-height:44px; color:var(--text-on-dark); }
.details__list .ic{ color:var(--brand-teal); }
.details__list a{ color:var(--text-on-dark); display:inline-flex; align-items:center; min-height:44px; }
.details__list address{ line-height:1.55; padding-block:8px; }
.details__md{ font-size:var(--fs-sm); color:var(--text-muted-dark); }
@media (max-width:767px){ .formcard{ padding:24px; } .details{ padding:24px; } }

/* =================================================================== EMPTY */
.empty__card{ max-width:640px; margin-inline:auto; text-align:center; display:grid; gap:12px; justify-items:center; padding:48px; background:var(--surface-card); border:1px solid var(--line); border-radius:var(--r-panel); --mark-ring:var(--brand-graphite); }
.empty__card h2{ font-size:var(--fs-h3); margin-top:12px; }
.empty__card .btnrow{ margin-top:12px; }
@media (max-width:767px){ .empty__card{ padding:32px 24px; } }

/* =================================================================== LEGAL */
.legal__grid{ display:grid; gap:32px; grid-template-columns:minmax(0,1fr); }
.toc summary{ min-height:44px; display:flex; align-items:center; cursor:pointer; font:600 1rem/1.3 var(--font-display); color:var(--fg); }
.toc ol{ display:grid; gap:2px; margin-top:8px; }
.toc a{ display:flex; align-items:center; min-height:44px; padding-left:12px; border-left:2px solid var(--line); color:var(--fg-muted); font-size:var(--fs-sm); text-decoration:none; }
.toc a:hover{ color:var(--fg); border-left-color:var(--teal-ink); }
.legal__body{ display:grid; gap:40px; max-width:68ch; }
.legal__body section{ padding:0; background:none; scroll-margin-top:calc(var(--nav-h) + 24px); }
.legal__body h2{ font-size:var(--fs-h3); margin-bottom:12px; }
.legal__body p{ font-size:1.0625rem; }
@media (min-width:1024px){
  .legal__grid{ grid-template-columns:minmax(0,3fr) minmax(0,8fr); gap:48px; }
  .toc{ position:sticky; top:calc(var(--nav-h) + 32px); align-self:start; }
  .toc summary{ pointer-events:none; list-style:none; }
  .toc summary::-webkit-details-marker{ display:none; }
}

/* ===================================================================== 404 */
.nf{ padding-block:calc(var(--nav-h) + 48px) var(--section-y); }
.nf__top{ display:grid; justify-items:center; text-align:center; gap:16px; margin-bottom:64px; }
.nf__mark{ width:min(240px, 50vw); height:auto; overflow:visible; }
.nf__trail{ fill:none; stroke:var(--brand-teal); stroke-width:10; stroke-dasharray:6 42; stroke-linecap:round; }
.nf h1{ color:var(--text-on-dark); }
.nf .btnrow{ margin-top:16px; }
.btn--ghostwa{ background:transparent; border-color:rgba(238,244,246,.55); color:var(--text-on-dark); }
.btn--ghostwa:hover{ background:rgba(238,244,246,.08); }

/* coverage band on a light canvas (About/Contact no longer end dark → dark → dark) */
section.coverage.is-light .coverage__line{ color:var(--text); }
section.coverage.is-light .coverage__from{ color:var(--teal-ink); }
section .legal__draft{ grid-column:1 / -1; padding:14px 18px; border-left:4px solid var(--brand-moon); background:var(--surface-card); border-radius:var(--r-btn); color:var(--text); }
.form__alt{ margin-top:14px; font-size:var(--fs-sm); }
.form__alt a{ display:inline-flex; align-items:center; min-height:44px; }
@media (max-width:639px){ .pbx-lbl{ font-size:52px; } .pbx-core{ r:110; } }
/* the fixed WhatsApp float (60px + 24px inset) sits over the strip's right end until the page margin clears it */
@media (min-width:1024px) and (max-width:1367px){ .proof__grid{ padding-right:76px; } }

/* 45-scenes.css */
/* ================================================================ FAILOVER
   States are attributes; CSS maps them to tokens. JS never writes a colour. */
.failover{ overflow:hidden; }
.failover__grid{ display:grid; gap:40px; grid-template-columns:minmax(0,1fr); align-items:center; }
.failover__txt{ display:grid; gap:16px; align-content:start; }
.failover__txt h2{ max-width:16ch; }
.failover__steps{ display:grid; gap:8px; margin-top:16px; counter-reset:fs; }
.failover__steps li{ position:relative; padding:12px 16px 12px 44px; border-left:2px solid var(--brand-teal); color:var(--text-on-dark); counter-increment:fs;
  transition:color .24s var(--ease-std), border-color .24s var(--ease-std); }
.failover__steps li::before{ content:""; position:absolute; left:16px; top:20px; width:10px; height:10px; border-radius:50%; background:var(--brand-teal); border:2px solid var(--brand-teal); box-sizing:border-box;
  transition:background-color .24s var(--ease-std), border-color .24s var(--ease-std); }
.failover__more{ margin-top:8px; }
/* pinned mode (desktop) — only the current step is lit; ALL stay opacity 1 */
.failover.is-pinned .failover__steps li{ color:var(--text-muted-dark); border-left-color:var(--ink-700); }
.failover.is-pinned .failover__steps li::before{ background:transparent; border-color:var(--ink-700); }
.failover.is-pinned .failover__steps li.is-active{ color:var(--text-on-dark); border-left-color:var(--brand-teal); }
.failover.is-pinned .failover__steps li.is-active::before{ background:var(--brand-teal); border-color:var(--brand-teal); }
.failover__fig{ margin:0; }
.dia--failover{ max-height:calc(100svh - var(--nav-h) - 160px); }
.dia-track{ fill:none; stroke:var(--ink-700); stroke-width:2; transition:stroke .24s var(--ease-std); }
.dia-flow{ fill:none; stroke-width:5; stroke-linecap:round; stroke-dasharray:0 22; transition:opacity .24s var(--ease-std); }
.dia-flow--p{ stroke:var(--brand-sky); }
.dia-flow--s{ stroke:var(--brand-green); }
.dia-node rect{ fill:var(--ink-800); stroke:var(--ink-700); stroke-width:1.5; }
.dia-node--edge rect{ stroke:var(--brand-teal); stroke-width:2; }
.dia-ic{ color:var(--brand-teal); }
.dia-fault__in{ transform-box:fill-box; transform-origin:center; transition:transform .3s var(--ease-out), opacity .24s var(--ease-std); }
.dia-fault circle{ fill:var(--ink-900); stroke:var(--magenta-lift); stroke-width:3; }
.dia-fault path{ stroke:var(--magenta-lift); stroke-width:4; stroke-linecap:round; }
.dia-chip rect{ fill:var(--ink-800); stroke:var(--brand-green); stroke-width:2; }
.dia-chip__dot{ fill:var(--brand-green); }
.dia-chip text{ font:600 28px var(--font-display); fill:var(--text-on-dark); }
.dia-chip.is-glow rect{ filter:drop-shadow(0 0 10px rgba(126,179,65,.7)); }
[data-step="1"] .dia-flow--s{ opacity:0; }
[data-step="1"] .dia-fault__in{ opacity:0; transform:scale(0); }
[data-step="2"] .dia-flow--p, [data-step="3"] .dia-flow--p{ opacity:0; }
[data-step="2"] .dia-track--p, [data-step="3"] .dia-track--p{ stroke:var(--magenta-lift); stroke-dasharray:6 8; opacity:.7; }
[data-step="2"] .dia-flow--s{ opacity:0; }
.failover__legend{ display:flex; flex-wrap:wrap; gap:8px 24px; margin-top:16px; color:var(--text-muted-dark); font-size:var(--fs-sm); }
.lg{ display:inline-flex; align-items:center; gap:8px; }
.lg::before{ content:""; width:18px; height:4px; border-radius:2px; }
.lg--p::before{ background:var(--brand-sky); } .lg--s::before{ background:var(--brand-green); } .lg--f::before{ background:var(--magenta-lift); }
@media (min-width:1024px){
  .failover__grid{ grid-template-columns:repeat(12,minmax(0,1fr)); gap:32px; }
  .failover__txt{ grid-column:1 / span 5; }
  .failover__fig{ grid-column:6 / span 7; }
}
@media (min-width:1024px) and (min-height:640px){
  .failover.is-pinned{ min-height:100vh; padding:calc(var(--nav-h) + 32px) 0 32px; display:flex; align-items:center; }
  .failover.is-pinned .wrap{ width:min(100% - 2*var(--gutter), var(--wrap)); }
}
@media (min-width:1024px) and (max-height:800px){
  .failover.is-pinned h2{ font-size:2.25rem; }
  .failover.is-pinned .lead{ font-size:1.0625rem; }
  .failover.is-pinned .failover__steps li{ padding-block:8px; }
}
/* step 2 — the fault is the story's turning point: hold it and let it pulse */
[data-step="2"] .dia-fault__in{ animation:faultpulse 1.1s var(--ease-io) infinite; }
@keyframes faultpulse{ 0%,100%{ transform:scale(1); } 50%{ transform:scale(1.18); } }
@media (prefers-reduced-motion:reduce){ [data-step="2"] .dia-fault__in{ animation:none; } }

/* phones: the 1200-unit diagrams shrink to ~340px with illegible labels, so the failover gets a
   real HTML version, the LTE SVG steps aside (its HTML columns + caption carry the meaning) */
.fo-m{ display:none; }
@media (max-width:639px){
  .dia .dia-label{ display:none; }
  .dia--failover, .dia--lte, .failover__legend{ display:none; }
  .fo-m{ display:grid; gap:10px; justify-items:center; padding:20px 16px; border:1px solid var(--ink-700); border-radius:var(--r-card); background:var(--ink-800); }
  .fo-m__node{ display:flex; align-items:center; gap:10px; min-height:44px; padding:0 16px; border-radius:12px; border:1.5px solid var(--ink-700); background:var(--ink-900); color:var(--text-on-dark); font:600 1rem/1.2 var(--font-display); }
  .fo-m__node .ic{ color:var(--brand-teal); }
  .fo-m__node--edge{ border-color:var(--brand-teal); }
  .fo-m__links{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; width:100%; }
  .fo-m__l{ display:flex; align-items:center; justify-content:center; gap:8px; min-height:44px; padding:0 8px; border-radius:10px; font:500 .9375rem/1.2 var(--font-body); color:var(--text-on-dark); border:1.5px dashed var(--ink-700); }
  .fo-m__l i{ width:14px; height:4px; border-radius:2px; flex:none; }
  .fo-m__l--p{ border-color:var(--magenta-lift); } .fo-m__l--p i{ background:var(--magenta-lift); } .fo-m__l--p b{ color:var(--magenta-lift); }
  .fo-m__l--s{ border-style:solid; border-color:var(--brand-green); } .fo-m__l--s i{ background:var(--brand-green); } .fo-m__l--s b{ color:var(--brand-green); }
  .fo-m__chip{ display:inline-flex; align-items:center; gap:8px; min-height:36px; padding:0 16px; border-radius:var(--r-pill); border:1.5px solid var(--brand-green); color:var(--text-on-dark); font:600 .9375rem/1 var(--font-display); }
  .fo-m__chip i{ width:8px; height:8px; border-radius:50%; background:var(--brand-green); }
}

/* =============================================================== ECOSYSTEM */
.ecosystem{ background:radial-gradient(38% 42% at 70% 50%, rgba(33,177,194,.10), rgba(33,177,194,0) 70%), var(--ink-950); padding-top:0; }
.ecosystem .orbit-rule--top{ width:min(100% - 2*var(--gutter), var(--wrap)); margin:0 auto 24px; }
.ecosystem__grid{ display:grid; gap:40px; grid-template-columns:minmax(0,1fr); align-items:center; }
.ecosystem__txt{ display:grid; gap:16px; align-content:start; }
.ecosystem__txt .statement{ color:var(--text-muted-dark); }
.ecosystem__txt h2{ max-width:20ch; }
.eco{ position:relative; width:min(100%, 560px); margin-inline:auto; aspect-ratio:1200/1120; }
.dia--eco{ position:absolute; inset:0; width:100%; height:100%; --mark-ring:var(--wordmark-dark); }
.eco-line{ fill:none; stroke:var(--brand-teal); stroke-width:3; stroke-dasharray:1; stroke-dashoffset:0; opacity:.55; }
.eco-sat circle{ fill:var(--fam); stroke:var(--ink-950); stroke-width:6; transform-box:fill-box; transform-origin:center; transition:transform .2s var(--ease-std); }
.eco-sat[data-hot] circle{ transform:scale(1.2); }
.eco-you{ position:absolute; left:49.67%; top:54.64%; translate:-50% -50%; font:600 .8125rem/1.15 var(--font-display); letter-spacing:.12em; text-transform:uppercase;
  color:var(--text-on-dark); text-align:center; white-space:nowrap; pointer-events:none; }
.eco-lab{ position:absolute; display:inline-flex; align-items:center; padding:6px 12px; white-space:nowrap; border-radius:var(--r-pill);
  background:rgba(6,16,26,.72); border:1px solid var(--ink-700); color:var(--text-on-dark); text-decoration:none; font:500 .9375rem/1.2 var(--font-display);
  transition:border-color .2s var(--ease-std); }
.eco-lab::before{ content:""; position:absolute; inset:-6px; }
.eco-lab:hover, .eco-lab:focus-visible{ border-color:var(--fam); }
.eco-lab--start{ translate:-24px 0; } .eco-lab--mid{ translate:-50% 0; } .eco-lab--end{ translate:calc(-100% + 24px) 0; }
.eco-lab--above.eco-lab--start{ translate:-24px -100%; } .eco-lab--above.eco-lab--mid{ translate:-50% -100%; } .eco-lab--above.eco-lab--end{ translate:calc(-100% + 24px) -100%; }
.eco-list{ display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin-top:24px; }
@media (min-width:1024px){
  .ecosystem__grid{ grid-template-columns:repeat(12,minmax(0,1fr)); gap:32px; }
  .ecosystem__txt{ grid-column:1 / span 5; }
  .ecosystem__fig{ grid-column:6 / span 7; }
  .eco{ width:min(100%, 560px, calc((100svh - var(--nav-h) - 96px) * 1200 / 1120)); }
  .eco-list{ display:none; }
}
@media (max-width:1023px){
  .eco{ max-width:360px; }
  .eco-lab, .eco-you{ display:none; }
}

/* 50-motion.css */
/* ============================================================================
   MOTION GATE. html.js-motion is added ONLY by the inline head script, and only
   when the desktop motion query matches — never typed into markup (KZD K3).
   `:not([data-done])` IS LOAD-BEARING: without it the gate re-applies itself when
   an inline transform is cleared, stranding content 24px low at opacity 1.
   ========================================================================== */
html.js-motion [data-reveal]:not([data-done]){ opacity:0; }
html.js-motion [data-reveal="up"]:not([data-done]){ transform:translateY(var(--reveal-y)); }
html.js-motion [data-clip]:not([data-done]){ clip-path:inset(12% 0 0 0 round 20px); }
html.js-motion [data-clip="l"]:not([data-done]){ clip-path:inset(0 0 0 14% round 20px); }
html.js-motion [data-clip="r"]:not([data-done]){ clip-path:inset(0 14% 0 0 round 20px); }
@media (max-width:1023px), (prefers-reduced-motion:reduce){
  html.js-motion [data-reveal], html.js-motion [data-clip]{ opacity:1 !important; transform:none !important; clip-path:none !important; }
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ transition-duration:.001ms !important; animation-duration:.001ms !important; animation-iteration-count:1 !important; }
}

/* 60-form.css */
.form__row{ display:grid; gap:0 20px; grid-template-columns:minmax(0,1fr); }
@media (min-width:640px){ .form__row{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
.field{ display:grid; gap:8px; margin-bottom:20px; min-width:0; }
.field label{ font:600 .9375rem/1.3 var(--font-body); color:var(--text); }
.req{ color:var(--brand-moon); }
.field input, .field select, .field textarea{ width:100%; min-width:0; min-height:52px; padding:0 16px; font:400 1rem/1.5 var(--font-body); color:var(--text);
  background:#FFFFFF; border:1px solid var(--line-input); border-radius:var(--r-btn); transition:border-color .16s var(--ease-std); }
.field textarea{ min-height:144px; padding:12px 16px; resize:vertical; }
.field input::placeholder{ color:var(--text-muted); }
.field input:hover, .field select:hover, .field textarea:hover{ border-color:var(--text-muted); }
.field input:focus-visible, .field select:focus-visible, .field textarea:focus-visible{ border-color:var(--focus-light); outline:3px solid var(--focus-light); outline-offset:2px; }
.field [aria-invalid="true"]{ border:2px solid var(--brand-moon); }
.field__err{ display:flex; align-items:center; gap:6px; font:500 .875rem/1.4 var(--font-body); color:var(--brand-moon); }
.field__err[hidden]{ display:none; }
.select{ position:relative; }
.select select{ appearance:none; -webkit-appearance:none; padding-right:44px; text-overflow:ellipsis; }
.select__chev{ position:absolute; right:14px; top:50%; translate:0 -50%; rotate:90deg; color:var(--text-muted); pointer-events:none; }
.field--check{ margin-top:4px; }
.check{ position:relative; display:grid; grid-template-columns:24px minmax(0,1fr); gap:12px; align-items:start; min-height:44px; padding-top:10px; font:400 .9375rem/1.5 var(--font-body); color:var(--text); cursor:pointer; }
.check input{ position:absolute; opacity:0; width:24px; height:24px; margin:0; left:0; top:10px; }
.check__box{ width:24px; height:24px; border:1.5px solid var(--line-input); border-radius:var(--r-btn); display:grid; place-items:center; color:transparent; background:#FFFFFF; }
.check input:checked + .check__box{ background:var(--teal-ink); border-color:var(--teal-ink); color:#FFFFFF; }
.check input:focus-visible + .check__box{ outline:3px solid var(--focus-light); outline-offset:2px; }
.check input[aria-invalid="true"] + .check__box{ border:2px solid var(--brand-moon); }
.check a{ color:var(--teal-ink); }
.form__actions{ display:flex; flex-wrap:wrap; gap:12px; margin-top:8px; }
@media (max-width:767px){ .form__actions{ flex-direction:column; } .form__actions .btn{ width:100%; } }
.form__status{ margin-top:20px; padding:16px 20px; background:var(--surface-2); border-left:4px solid var(--teal-ink); border-radius:var(--r-btn); }
.form__status p{ color:var(--text); }
.form__status[hidden]{ display:none; }
.form__status--sent{ margin:0 0 24px; }
.hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
