/* ==========================================================================
   NAVREN — HOMEPAGE (Signal Room landing page)
   Loaded after navren.css on the homepage only.
   ========================================================================== */

/* ==========================================================================
   HERO — Demand Field
   ========================================================================== */
.hero{
  position:relative; isolation:isolate; overflow:hidden;
  display:grid; grid-template-rows:1fr auto;
  min-height:calc(100vh - var(--header-h));
  min-height:calc(100svh - var(--header-h));
  background:var(--ink);
  border-bottom:1px solid var(--hair);
  padding-top:0; /* copy starts just under the header; the section's default top padding pushed it down */
}
@media (min-width: 900px){ .hero{ min-height:max(660px, calc(100svh - var(--header-h))); max-height:1080px; padding-bottom:clamp(28px, 4vh, 56px); } }
.hero::before{
  content:""; position:absolute; inset:0; z-index:-3; pointer-events:none;
  background-image:radial-gradient(rgba(232,237,234,.085) 1px, transparent 1.3px);
  background-size:28px 28px; background-position:center;
  -webkit-mask-image:radial-gradient(ellipse 62% 78% at 72% 52%, #000 25%, transparent 80%);
  mask-image:radial-gradient(ellipse 62% 78% at 72% 52%, #000 25%, transparent 80%);
}
.hero::after{
  content:""; position:absolute; inset:0; z-index:-3; pointer-events:none;
  background:radial-gradient(ellipse 42% 50% at 74% 48%, rgba(13,107,84,.16), transparent 70%);
}
.hero-canvas{ position:absolute; inset:0; width:100%; height:100%; z-index:-2; display:block; }
.hud{ position:absolute; inset:0; z-index:-1; pointer-events:none; }
.hud .br{ display:none; } /* corner brackets removed */
.hud .br{ position:absolute; width:18px; height:18px; border:0 solid rgba(232,237,234,.3); }
.hud .tl{ left:20px; top:20px; border-left-width:1px; border-top-width:1px; }
.hud .tr{ right:20px; top:20px; border-right-width:1px; border-top-width:1px; }
.hud .bl{ left:20px; bottom:20px; border-left-width:1px; border-bottom-width:1px; }
.hud .bq{ right:20px; bottom:20px; border-right-width:1px; border-bottom-width:1px; }
.hud-coord{
  position:absolute; right:48px; top:22px;
  font:500 10.5px/1 var(--f-mono); letter-spacing:.16em; color:var(--faint);
}

.hero-inner{
  position:relative; z-index:1; display:flex; align-items:center;
  padding-block:clamp(48px, 9vh, 120px) clamp(36px, 6vh, 80px);
}
@media (min-width: 900px){ .hero-inner{ align-items:flex-start; padding-block:clamp(40px, 6vh, 84px) clamp(36px, 6vh, 80px); } }
.hero-copy{ max-width:870px; }
.hero .eyebrow{ margin-bottom:clamp(22px, 3.2vh, 34px); }
.hero h1{
  font:800 clamp(44px, 5.5vw, 86px)/.95 var(--f-display);
  letter-spacing:-.038em;
  margin:0 0 clamp(24px, 3.4vh, 34px);
}
.hero h1 .line{ display:block; width:max-content; white-space:nowrap; overflow:hidden; padding-bottom:.09em; margin-bottom:-.09em; }
.hero h1 .li{ display:block; }
.hero h1 .jade{ color:var(--jade-bright); }
.hero-lede{
  font-size:clamp(17px, 1.32vw, 19.5px); line-height:1.62; color:var(--muted);
  max-width:35em; margin:0 0 clamp(30px, 4.4vh, 42px);
}
.hl{ font-style:normal; font-weight:500; color:var(--jade-bright); }
.hero-ctas{ display:flex; flex-wrap:wrap; gap:12px; }

/* entrance — only once JS has started (html.js) */
html.js.pre-hero .hero [data-h]{ opacity:0; transform:translateY(18px); }
html.js.pre-hero .hero h1 .li{ transform:translateY(105%); }
html.js.pre-hero .hero .src, html.js.pre-hero .hero .rail-readout{ opacity:0; }
.hero [data-h]{ transition:opacity .9s var(--ease-out), transform 1.1s var(--ease-out); transition-delay:calc(var(--i, 0) * 90ms); }
.hero h1 .li{ transition:transform 1.15s var(--ease-out); transition-delay:calc(var(--i, 0) * 90ms); }
.hero .src{ transition:opacity .6s var(--ease-out); transition-delay:calc(var(--i, 0) * 110ms + 250ms); }
.hero .rail-readout{ transition:opacity .6s var(--ease-out) .9s; }

/* Source rail */
.hero-rail{ position:relative; z-index:1; }
.hero-rail::before{
  content:""; position:absolute; left:0; right:0; top:0; height:1px; background:var(--hair);
}
.hero-rail::after{
  content:""; position:absolute; left:0; right:0; top:1px; height:5px;
  background:repeating-linear-gradient(90deg, rgba(232,237,234,.13) 0 1px, transparent 1px 14px);
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
  mask-image:linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
}
.rail-inner{ position:relative; display:flex; align-items:center; justify-content:space-between; height:68px; }
.rail-sources{ display:flex; justify-content:space-between; width:62%; }
.src{
  position:relative; display:inline-flex; align-items:center; gap:8px;
  font:500 11px/1 var(--f-mono); letter-spacing:.14em; color:var(--muted); white-space:nowrap;
  padding:6px 0;
}
.src::before{ content:""; width:5px; height:5px; background:var(--jade-bright); box-shadow:0 0 8px rgba(61,170,136,.8); flex:none; }
.rail-readout{
  display:inline-flex; align-items:center; gap:10px;
  font:500 11px/1 var(--f-mono); letter-spacing:.18em; color:var(--paper);
  padding:8px 12px; border:1px solid var(--hair-2); border-radius:2px; background:rgba(11,17,16,.6);
}
.rd-dot{ width:7px; height:7px; border-radius:50%; background:var(--mint); box-shadow:0 0 10px var(--jade-bright); animation:blinkSoft 1.6s ease-in-out infinite; }
@keyframes blinkSoft{ 0%,100%{ opacity:1; } 50%{ opacity:.25; } }

@media (min-width: 900px) and (max-width: 1199px){
  .rail-sources{ width:calc(100% - 190px); }
}
@media (max-width: 899px){
  .hero{ grid-template-rows:auto 1fr; }
  .hero::before{ -webkit-mask-image:radial-gradient(ellipse 90% 40% at 60% 78%, #000 20%, transparent 80%); mask-image:radial-gradient(ellipse 90% 40% at 60% 78%, #000 20%, transparent 80%); }
  .hero::after{ background:radial-gradient(ellipse 60% 26% at 70% 78%, rgba(13,107,84,.18), transparent 70%); }
  .hero-inner{ padding-block:44px 8px; }
  .hero-rail{ height:clamp(300px, 66vw, 400px); }
  .hero-rail::before, .hero-rail::after{ display:none; }
  .rail-inner{ height:100%; display:block; }
  .rail-sources{ position:absolute; left:0; top:50%; transform:translateY(-54%); flex-direction:column; align-items:flex-start; gap:clamp(12px, 3.2vw, 20px); width:auto; }
  .src{ font-size:10.5px; padding:4px 8px 4px 0; background:linear-gradient(90deg, var(--ink) 70%, transparent); }
  .rail-readout{ position:absolute; right:0; bottom:24px; padding:7px 10px; font-size:10px; }
  .hud .br{ width:12px; height:12px; }
  .hud .tl, .hud .tr{ top:12px; } .hud .bl, .hud .bq{ bottom:12px; }
  .hud .tl, .hud .bl{ left:8px; } .hud .tr, .hud .bq{ right:8px; }
  .hud-coord{ display:none; }
}
@media (max-width: 699px){
  .hero h1{ font-size:clamp(40px, 11.2vw, 64px); }
  .hero h1 .line{ width:auto; white-space:normal; }
  .hero-ctas .btn{ height:50px; }
}
@media (max-width: 479px){
  .hero-ctas{ flex-direction:column; align-items:stretch; }
  .hero-ctas .btn{ width:100%; }
}
/* ==========================================================================
   CONCEPT 6 · PRODUCTIVITY — Who we help
   Near-white ground with soft pastel fields; four near-black product cards in
   mixed-width rows (narrow + wide / wide + narrow), each with a live visual.
   ========================================================================== */
.w6{
  --w6-ink:#0B0F0E; --w6-slate:#3E4A46; --w6-muted:#5B6A65; --w6-jade:#0D6B54;
  --w6-gap:28px; --w6-r:14px;
  position:relative; isolation:isolate; overflow:hidden; overflow:clip;
  padding-block:clamp(96px, 8.6vw, 128px) clamp(80px, 6.8vw, 100px);
  background:#FAFBFA;
  color:var(--w6-slate);
  font:400 17px/1.55 var(--f-body);
}

/* ---------- atmosphere: very soft pastel fields, kept clear of both edges ---------- */
.w6 .w6-air{
  position:absolute; inset:0; z-index:-1; pointer-events:none;
  /* fields always dissolve before the section edges, so neighbouring sections meet seamlessly */
  -webkit-mask-image:linear-gradient(to bottom, transparent 0, #000 160px, #000 calc(100% - 160px), transparent 100%);
  mask-image:linear-gradient(to bottom, transparent 0, #000 160px, #000 calc(100% - 160px), transparent 100%);
}
.w6 .w6-air i{ position:absolute; display:block; border-radius:50%; }
.w6 .w6-f1{ /* mint, behind the right of the first card row */
  width:min(1040px, 82vw); height:760px; right:-14%; top:21%;
  background:radial-gradient(closest-side, rgba(196,236,218,.95), rgba(210,240,227,.55) 45%, rgba(221,243,233,0));
}
.w6 .w6-f2{ /* cool mist, left, lower */
  width:min(900px, 76vw); height:720px; left:-16%; top:50%;
  background:radial-gradient(closest-side, rgba(204,219,236,.95), rgba(222,231,241,.5) 50%, rgba(226,234,241,0));
}
.w6 .w6-f3{ /* sage, bottom centre */
  width:min(1100px, 90vw); height:520px; left:30%; bottom:3%;
  background:radial-gradient(closest-side, rgba(214,233,222,.95), rgba(226,238,231,.5) 50%, rgba(229,238,233,0));
}
.w6 .w6-f4{ /* a whisper of warm, upper right of the heading */
  width:min(720px, 70vw); height:440px; left:38%; top:7%;
  background:radial-gradient(closest-side, rgba(244,233,222,.75), rgba(244,237,230,.35) 50%, rgba(243,236,229,0));
}

/* ---------- heading block ---------- */
.w6 .w6-head{ max-width:860px; }
.w6 .w6-eyebrow{
  display:flex; align-items:center; gap:12px; margin:0 0 28px;
  font:500 11.5px/1.3 var(--f-mono); letter-spacing:.16em; text-transform:uppercase; color:var(--w6-jade);
}
.w6 .w6-eyebrow::before{
  content:""; flex:none; width:7px; height:7px; background:var(--w6-jade);
  box-shadow:0 0 0 4px rgba(13,107,84,.12);
}
.w6 .w6-h2{
  margin:0; max-width:9.7em;
  font:800 clamp(46px, 5.7vw, 84px)/.93 var(--f-display);
  letter-spacing:-.04em; color:var(--w6-ink);
}
.w6 .w6-sub{
  margin:30px 0 0; max-width:31em;
  font:400 clamp(17px, 1.3vw, 19px)/1.5 var(--f-body); color:var(--w6-muted);
}
.w6 .w6-lead{ color:var(--w6-ink); font-weight:500; }

/* ---------- mixed-width card rows ---------- */
.w6 .w6-grid{
  display:flex; flex-wrap:wrap; gap:var(--w6-gap);
  margin:clamp(60px, 6.4vw, 96px) 0 0; padding:0; list-style:none;
}
.w6 .w6-card{
  position:relative; flex:0 0 auto; width:100%;
  display:flex; flex-direction:column; min-height:420px;
  border-radius:var(--w6-r);
  background:
    radial-gradient(ellipse 72% 46% at 50% 44%, rgba(13,107,84,.15), rgba(13,107,84,0) 72%),
    linear-gradient(180deg, #111A18 0%, #0D1513 46%, #0B1110 100%);
  color:#E8EDEA;
  box-shadow:
    0 0 0 6px rgba(255,255,255,.55),
    0 0 0 7px rgba(11,17,16,.06),
    0 40px 80px -40px rgba(9,26,21,.5),
    0 16px 34px -20px rgba(9,26,21,.32);
  transition:transform .55s var(--ease-out), box-shadow .55s var(--ease-out);
}
.w6 .w6-card::before{ /* inner hairline */
  content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none; z-index:1;
  box-shadow:inset 0 0 0 1px rgba(232,237,234,.07), inset 0 1px 0 rgba(232,237,234,.08);
}
@media (min-width: 900px){
  .w6 .w6-n{ width:calc((100% - var(--w6-gap)) * .36); }
  .w6 .w6-w{ width:calc((100% - var(--w6-gap)) * .64); }
}
@media (min-width: 900px) and (max-width: 1199px){
  .w6 .w6-n{ width:calc((100% - var(--w6-gap)) * .42); }
  .w6 .w6-w{ width:calc((100% - var(--w6-gap)) * .58); }
}
.w6 .w6-card:hover, .w6 .w6-card.w6-hot{
  transform:translateY(-5px);
  box-shadow:
    0 0 0 6px rgba(255,255,255,.75),
    0 0 0 7px rgba(13,107,84,.14),
    0 46px 80px -40px rgba(9,26,21,.56),
    0 20px 40px -22px rgba(9,26,21,.36);
}

/* live visual */
.w6 .w6-vis{
  position:relative; flex:1 1 auto; min-height:224px;
  border-radius:var(--w6-r) var(--w6-r) 0 0; overflow:hidden;
}
.w6 .w6-cv{ position:absolute; inset:0; width:100%; height:100%; display:block; }
.w6 .w6-ov{ position:absolute; inset:0; z-index:1; pointer-events:none; overflow:hidden; border-radius:inherit; }
.w6 .w6-lbl, .w6 .w6-key{
  position:absolute; top:20px; z-index:2;
  font:500 10.5px/1 var(--f-mono); letter-spacing:.14em; text-transform:uppercase; color:rgba(232,237,234,.62);
  white-space:nowrap;
}
.w6 .w6-lbl{ left:24px; }
.w6 .w6-lbl b{ font-weight:500; color:#8BE0C0; margin:0 .2em; }
.w6 .w6-key{ right:44px; display:flex; align-items:center; gap:8px; }
.w6 .w6-key i{ width:14px; height:2px; background:#8BE0C0; box-shadow:0 0 6px rgba(139,224,192,.8); }
.w6 .w6-led{
  position:absolute; right:24px; top:20px; z-index:2; width:6px; height:6px;
  background:#8BE0C0; box-shadow:0 0 0 3px rgba(139,224,192,.12), 0 0 10px rgba(61,170,136,.9);
  animation:w6-led 2.4s steps(1, end) infinite;
}
@keyframes w6-led{ 0%, 70%{ opacity:1; } 72%, 78%{ opacity:.25; } 80%{ opacity:1; } }

/* caption */
.w6 .w6-cap{ position:relative; display:flex; flex-direction:column; gap:14px; padding:4px 26px 20px; }
.w6 .w6-txt{ font:400 16px/1.45 var(--f-body); color:rgba(255,255,255,.66); max-width:36em; }
.w6 .w6-t{
  display:inline; margin:0;
  font:800 19px/1.3 var(--f-display); letter-spacing:-.012em; color:#FFFFFF;
}
.w6 .w6-d{ display:inline; margin:0; }
.w6 .w6-tags{ display:flex; flex-wrap:wrap; gap:6px; margin:0; padding:0; list-style:none; }
.w6 .w6-tags li{
  padding:6px 8px 5px; border-radius:3px;
  font:500 10px/1 var(--f-mono); letter-spacing:.11em; color:rgba(232,237,234,.78);
  background:rgba(255,255,255,.055); box-shadow:inset 0 0 0 1px rgba(255,255,255,.07);
  white-space:nowrap;
}
.w6 .w6-link{
  position:static; display:flex; align-items:center; justify-content:space-between; gap:16px;
  margin-top:2px; padding-top:14px; border-top:1px solid rgba(232,237,234,.09);
  font:500 15px/1.2 var(--f-body); color:#FFFFFF; text-decoration:none;
}
.w6 .w6-link::after{ /* whole card is the link's hit area */
  content:""; position:absolute; z-index:3; inset:-6px; border-radius:calc(var(--w6-r) + 6px);
}
.w6 .w6-card{ cursor:pointer; }
.w6 .w6-card .w6-cap{ position:static; }
.w6 .w6-arr{ color:#8BE0C0; font-family:var(--f-body); transition:transform .45s var(--ease-out); }
.w6 .w6-card:hover .w6-arr, .w6 .w6-card.w6-hot .w6-arr{ transform:translateX(5px); }
.w6 .w6-link:focus-visible{ outline:none; }
.w6 .w6-link:focus-visible::after{ outline:2px solid var(--w6-jade); outline-offset:3px; }

/* ---------- tablet / mobile ---------- */
@media (max-width: 899px){
  .w6{ --w6-gap:24px; }
  .w6 .w6-card{
    min-height:0;
    box-shadow:0 0 0 6px rgba(255,255,255,.55), 0 0 0 7px rgba(11,17,16,.06), 0 26px 48px -26px rgba(9,26,21,.5), 0 10px 22px -14px rgba(9,26,21,.3);
  }
  .w6 .w6-vis{ flex:none; height:clamp(200px, 46vw, 280px); min-height:0; }
  .w6 .w6-sub{ margin-top:24px; }
}
@media (max-width: 560px){
  .w6 .w6-eyebrow{ margin-bottom:22px; }
  .w6 .w6-h2{ letter-spacing:-.036em; }
  .w6 .w6-cap{ padding:4px 20px 20px; gap:14px; }
  .w6 .w6-lbl{ left:20px; top:18px; } .w6 .w6-led{ right:20px; top:18px; }
  .w6 .w6-key{ display:none; }
  .w6 .w6-txt{ font-size:16px; } .w6 .w6-t{ font-size:18px; }
  .w6 .w6-tags li{ font-size:9.5px; padding:6px 7px 5px; }
  .w6 .w6-f1{ top:30%; right:-40%; height:620px; } .w6 .w6-f2{ top:58%; left:-40%; }
  .w6 .w6-f4{ left:20%; top:4%; }
}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion: reduce){
  .w6 .w6-card, .w6 .w6-arr{ transition:none; }
  .w6 .w6-led{ animation:none; }
}
/* ==========================================================================
   SERVICES — Circuit board
   ========================================================================== */
.board{
  position:relative;
  display:grid; grid-template-columns:minmax(0,1fr) 204px minmax(0,1fr); grid-template-rows:repeat(3, auto);
  column-gap:clamp(60px, 7.2vw, 116px); row-gap:20px; align-items:stretch;
}
.board-col{ display:contents; }
.board-col.l .svc{ grid-column:1; }
.board-col.r .svc{ grid-column:3; }
.board-col .svc:nth-child(1){ grid-row:1; }
.board-col .svc:nth-child(2){ grid-row:2; }
.board-col .svc:nth-child(3){ grid-row:3; }
.traces{ position:absolute; left:0; top:0; width:100%; height:100%; z-index:0; pointer-events:none; }
.traces path{ fill:none; vector-effect:non-scaling-stroke; }
.traces .t-base{ stroke:rgba(232,237,234,.13); stroke-width:1; }
.traces .t-glow{ stroke:var(--jade-bright); stroke-width:7; opacity:0; transition:opacity .45s; stroke-linejoin:round; }
.traces .t-lit{ stroke:var(--jade-bright); stroke-width:1.5; opacity:0; transition:opacity .45s; }
.traces .t-pulse{ stroke:#DFFFF2; stroke-width:2.4; stroke-linecap:round; opacity:0; }
.traces .on .t-glow{ opacity:.13; }
.traces .on .t-lit{ opacity:1; }
.traces .on .t-pulse{ opacity:1; }
.traces .stub{ stroke:rgba(232,237,234,.09); stroke-width:1; }
.traces .via{ fill:var(--ink); stroke:rgba(232,237,234,.2); stroke-width:1; }

.svc{
  position:relative; z-index:1;
  background:var(--panel); border:1px solid var(--hair); border-radius:3px;
  padding:24px 28px 26px;
  transition:border-color .45s, background-color .45s, box-shadow .6s var(--ease-out);
}
.svc::before{
  content:""; position:absolute; top:50%; width:9px; height:9px; margin-top:-4.5px;
  background:var(--ink); border:1px solid rgba(232,237,234,.28);
  transition:background-color .35s, border-color .35s, box-shadow .35s;
}
.board-col.l .svc::before{ right:-5px; }
.board-col.r .svc::before{ left:-5px; }
.svc.is-active{
  background:var(--panel-2); border-color:rgba(61,170,136,.42);
  box-shadow:0 0 0 1px rgba(61,170,136,.1), 0 24px 60px -34px rgba(61,170,136,.55);
}
.svc.is-active::before{ background:var(--jade-bright); border-color:var(--mint); box-shadow:0 0 12px rgba(61,170,136,.9); }
.svc-head{ display:flex; justify-content:space-between; align-items:center; margin-bottom:16px; }
.svc-led{ width:6px; height:6px; background:rgba(232,237,234,.2); transition:background-color .35s, box-shadow .35s; }
.svc.is-active .svc-led{ background:var(--mint); box-shadow:0 0 10px var(--jade-bright); }
.svc h3{ font:800 clamp(22px, 1.85vw, 27px)/1.15 var(--f-display); letter-spacing:-.01em; margin-bottom:10px; }
.svc p:not(.incl){ font-size:15.5px; line-height:1.6; color:var(--muted); }
.svc .tags{ margin-top:18px; }
.svc.is-active .tags li{ border-color:rgba(61,170,136,.28); }
.svc-link{
  display:inline-flex; align-items:center; gap:8px; margin-top:20px;
  font:500 14.5px/1.2 var(--f-body); color:var(--paper);
  padding-bottom:4px;
  background:linear-gradient(var(--jade-bright), var(--jade-bright)) left bottom / 0 1px no-repeat;
  transition:background-size .5s var(--ease-out);
}
.svc-link:hover, .svc-link:focus-visible{ background-size:100% 1px; }
.svc-link:hover .arr{ transform:translateX(5px); }
.incl{
  display:flex; width:max-content; max-width:100%; align-items:center; gap:9px; margin-top:18px;
  font:500 10.5px/1 var(--f-mono); letter-spacing:.11em; color:var(--mint);
  padding:7px 10px; border:1px solid rgba(61,170,136,.45); border-radius:2px; background:rgba(61,170,136,.07);
}
.incl::before{ content:""; width:5px; height:5px; background:var(--jade-bright); box-shadow:0 0 8px var(--jade-bright); }

/* Chip */
.chip{ position:relative; z-index:1; width:204px; height:204px; justify-self:center; align-self:center; grid-column:2; grid-row:1 / span 3; }
.chip-pins{ position:absolute; display:flex; justify-content:space-evenly; }
.chip-pins.l, .chip-pins.r{ top:22px; bottom:22px; width:22px; flex-direction:column; }
.chip-pins.l{ left:0; } .chip-pins.r{ right:0; }
.chip-pins.t, .chip-pins.b{ left:22px; right:22px; height:22px; }
.chip-pins.t{ top:0; } .chip-pins.b{ bottom:0; }
.chip-pins i{ display:block; background:rgba(232,237,234,.26); transition:background-color .3s, box-shadow .3s; }
.chip-pins.l i, .chip-pins.r i{ width:22px; height:3px; }
.chip-pins.t i, .chip-pins.b i{ width:3px; height:22px; }
.chip-pins i.on{ background:var(--jade-bright); box-shadow:0 0 8px rgba(61,170,136,.9); }
.chip-body{
  position:absolute; inset:22px;
  background:linear-gradient(145deg, #15211E, #0E1715);
  border:1px solid var(--hair-3); border-radius:5px;
  display:grid; place-items:center;
  box-shadow:inset 0 0 0 6px var(--ink-2), inset 0 0 0 7px rgba(232,237,234,.07), 0 30px 60px -30px rgba(0,0,0,.8);
}
.chip-notch{ position:absolute; left:12px; top:12px; width:7px; height:7px; border-radius:50%; border:1px solid rgba(232,237,234,.25); }
.chip-die{
  position:relative; width:64%; aspect-ratio:1; display:grid; place-items:center;
  border:1px solid rgba(61,170,136,.38);
  background:
    radial-gradient(circle at 50% 50%, rgba(61,170,136,.2), transparent 70%),
    repeating-linear-gradient(0deg, rgba(232,237,234,.04) 0 1px, transparent 1px 6px),
    repeating-linear-gradient(90deg, rgba(232,237,234,.04) 0 1px, transparent 1px 6px),
    #0D1614;
  transition:box-shadow .3s;
}
.chip-logo{ font:600 11px/1 var(--f-display); letter-spacing:.3em; color:var(--paper); display:inline-flex; align-items:baseline; padding-left:.3em; }
.chip-logo span{ letter-spacing:.05em; }
.chip-logo b{ display:inline-block; width:.2em; height:.2em; background:var(--jade-bright); }
.chip-tag{ position:absolute; bottom:-30px; left:50%; transform:translateX(-50%); white-space:nowrap; color:var(--faint); font-size:10px; }
.chip.hit .chip-die{ animation:chipHit .8s var(--ease-out); }
@keyframes chipHit{
  0%{ box-shadow:0 0 0 0 rgba(139,224,192,.0), inset 0 0 0 0 rgba(61,170,136,0); }
  20%{ box-shadow:0 0 34px 6px rgba(61,170,136,.55), inset 0 0 24px rgba(61,170,136,.55); }
  100%{ box-shadow:0 0 0 0 rgba(61,170,136,0), inset 0 0 0 rgba(61,170,136,0); }
}

@media (max-width: 1199px){
  .board{ grid-template-columns:minmax(0,1fr) 168px minmax(0,1fr); column-gap:clamp(44px, 5vw, 72px); }
  .chip{ width:168px; height:168px; }
  .svc{ padding:22px 22px 24px; }
}
@media (max-width: 899px){
  .board{ grid-template-columns:1fr 1fr; grid-template-rows:none; gap:14px; }
  .board-col .svc{ grid-column:auto !important; grid-row:auto !important; }
  .traces{ display:none; }
  .chip{ grid-column:1 / -1; grid-row:auto; order:-1; width:100%; height:92px; margin-bottom:10px; }
  .chip-pins.l, .chip-pins.r{ display:none; }
  .chip-pins.t, .chip-pins.b{ left:18%; right:18%; height:14px; }
  .chip-pins.t i, .chip-pins.b i{ height:14px; }
  .chip-body{ inset:14px 12% 14px 12%; }
  .chip-die{ width:auto; height:70%; aspect-ratio:auto; padding:0 26px; }
  .chip-tag{ display:none; }
  .svc::before{ display:none; }
  .svc::after{
    content:""; position:absolute; left:-1px; top:18px; bottom:18px; width:2px;
    background:var(--jade-bright); box-shadow:0 0 14px rgba(61,170,136,.8);
    transform:scaleY(0); transition:transform .5s var(--ease-out);
  }
  .svc.is-active::after{ transform:scaleY(1); }
}
@media (max-width: 639px){
  .board{ grid-template-columns:1fr; }
  .chip-pins.t, .chip-pins.b{ left:14%; right:14%; }
  .chip-body{ inset:14px 8%; }
}
/* ==========================================================================
   APPROACH — "Segments": signal path on white
   ========================================================================== */
/* =====================================================================
   CONCEPT 9 · SEGMENTS — Approach · "Signal path"
   One long path winds down the white section, widening its swings and
   brightening as it descends; it draws itself with scroll and lights
   each step card as its square head arrives.
   ===================================================================== */
.a9{
  --a9-ink:#0B0F0E; --a9-body:#3E4A46; --a9-muted:#5B6A65;
  --a9-jade:#0D6B54; --a9-jb:#3DAA88; --a9-mint:#8BE0C0;
  --a9-lane:clamp(170px, 19vw, 270px);
  --a9-ease:cubic-bezier(.16,1,.3,1);
  position:relative; isolation:isolate; overflow:hidden;
  background:#FAFBFA; color:var(--a9-body); /* same ground as Who we help, so the two read as one light band */
  font:400 17px/1.55 var(--f-body);
  padding:clamp(88px, 8vw, 120px) 0 clamp(104px, 9vw, 132px);
}

/* ---------- atmosphere ---------- */
.a9 .a9-bg{
  position:absolute; inset:0; z-index:-2; pointer-events:none; overflow:hidden;
  -webkit-mask-image:linear-gradient(to bottom, transparent 0, #000 220px, #000 calc(100% - 240px), transparent 100%);
          mask-image:linear-gradient(to bottom, transparent 0, #000 220px, #000 calc(100% - 240px), transparent 100%);
}
.a9 .a9-f{ position:absolute; display:block; border-radius:50%; filter:blur(90px); }
.a9 .a9-f1{ width:560px; height:400px; right:-160px; top:180px; background:#E2EAF1; opacity:.7; }
.a9 .a9-f2{ width:min(520px, 60%); height:900px; left:50%; top:34%; transform:translateX(-50%); background:#DDF3E9; opacity:.75; }
.a9 .a9-f3{ width:560px; height:460px; left:-220px; top:44%; background:#E5EEE9; opacity:.8; }
.a9 .a9-f4{ width:440px; height:320px; right:2%; bottom:300px; background:#F3ECE5; opacity:.5; }

/* ---------- heading ---------- */
.a9 .a9-head{ display:grid; grid-template-columns:minmax(0, 7fr) minmax(0, 5fr); gap:32px 64px; align-items:end; }
.a9 .a9-eyebrow{
  display:flex; align-items:center; gap:12px; margin:0 0 26px;
  font:500 12px/1.3 var(--f-mono); letter-spacing:.16em; text-transform:uppercase; color:var(--a9-jade);
}
.a9 .a9-eyebrow i{ display:block; width:6px; height:6px; background:var(--a9-jade); }
.a9 .a9-h2{
  margin:0; max-width:780px; color:var(--a9-ink);
  font:800 clamp(44px, 5.65vw, 82px)/.93 var(--f-display);
  letter-spacing:-.038em; text-wrap:balance;
}
.a9 .a9-hr{ padding-bottom:6px; }
.a9 .a9-sub{ margin:0; max-width:470px; color:var(--a9-body); font:400 clamp(16.5px, 1.3vw, 18.5px)/1.5 var(--f-body); }
.a9 .a9-lead{ color:var(--a9-ink); font-weight:500; }
.a9 .a9-cta{
  display:inline-flex; align-items:center; gap:10px; margin-top:24px; padding:2px 0 6px;
  font:500 16px/1.2 var(--f-body); color:var(--a9-ink);
  background:linear-gradient(var(--a9-jade), var(--a9-jade)) 0 100% / 100% 1.5px no-repeat;
}
.a9 .a9-arr{ display:inline-block; color:var(--a9-jade); transition:transform .35s var(--a9-ease); }
.a9 .a9-cta:hover{ color:var(--a9-jade); }
.a9 .a9-cta:hover .a9-arr{ transform:translateX(4px); }
.a9 .a9-cta:focus-visible{ outline:2px solid var(--a9-jade); outline-offset:4px; border-radius:3px; }

/* ---------- path area ---------- */
.a9 .a9-path{ position:relative; margin-top:clamp(120px, 10.5vw, 156px); padding:96px 0 118px; }
.a9 .a9-svg{ position:absolute; left:0; top:0; width:100%; height:100%; overflow:visible; pointer-events:none; }
.a9 .a9-svg path{ fill:none; }
.a9 .a9-track{ stroke:#CBD8D3; stroke-width:1.5; stroke-dasharray:1.5 6; stroke-linecap:round; }
.a9 .a9-glow{ stroke:url(#a9-gg); stroke-width:12; stroke-linecap:round; stroke-linejoin:round; }
.a9 .a9-line{ stroke:url(#a9-gl); stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round; }
.a9 .a9-conns line{ stroke:#C9D6D1; stroke-width:1.25; stroke-dasharray:2 4; transition:stroke .5s; }
.a9 .a9-conns line.a9-lit{ stroke:var(--a9-jade); stroke-dasharray:none; }
.a9 .a9-ticks line{ stroke:#CBD8D3; stroke-width:1.25; transition:stroke .4s; }
.a9 .a9-ticks line.a9-lit{ stroke:var(--a9-jb); }

/* channel fan into the start of the path */
.a9 .a9-fb{ stroke:#D3DEDA; stroke-width:1; }
.a9 .a9-ff{ stroke:var(--a9-jb); stroke-width:1.5; stroke-linecap:round; stroke-dasharray:2 14; animation:a9-flow 1.6s linear infinite; opacity:.75; }
@keyframes a9-flow{ from{ stroke-dashoffset:32; } to{ stroke-dashoffset:0; } }
.a9 .a9-fs{ fill:#FFFFFF; stroke:#9FB3AC; stroke-width:1.2; }
.a9 .a9-ft{ fill:#5B6A65; font:500 10px/1 var(--f-mono); letter-spacing:.14em; }

/* start + end + nodes + head (positioned by JS) */
.a9 .a9-start, .a9 .a9-node, .a9 .a9-port, .a9 .a9-end, .a9 .a9-sig{ position:absolute; left:0; top:0; z-index:2; display:block; }
.a9 .a9-start{ width:9px; height:9px; margin:-4.5px 0 0 -4.5px; background:#fff; box-shadow:inset 0 0 0 1.5px #A9BDB6; }
.a9 .a9-node{
  width:14px; height:14px; margin:-7px 0 0 -7px; background:#fff;
  box-shadow:inset 0 0 0 1.5px #B4C6BF, 0 0 0 4px rgba(255,255,255,.9);
  transition:background .45s var(--a9-ease), box-shadow .45s var(--a9-ease);
}
.a9 .a9-node::after{ content:""; position:absolute; left:5px; top:5px; width:4px; height:4px; background:var(--a9-mint); opacity:0; transition:opacity .45s; }
.a9 .a9-step.a9-lit .a9-node{ background:#0B1110; box-shadow:inset 0 0 0 1px #0B1110, 0 0 0 4px rgba(61,170,136,.18), 0 0 18px rgba(61,170,136,.5); }
.a9 .a9-step.a9-lit .a9-node::after{ opacity:1; }

.a9 .a9-sig{ width:14px; height:14px; margin:-7px 0 0 -7px; background:#0B1110; will-change:transform; opacity:0; transition:opacity .3s; }
.a9.a9-ready .a9-sig{ opacity:1; }
.a9 .a9-sig::before{ content:""; position:absolute; inset:-9px; background:rgba(61,170,136,.2); box-shadow:0 0 22px 6px rgba(61,170,136,.38); animation:a9-pulse 1.8s var(--a9-ease) infinite; }
.a9 .a9-sig::after{ content:""; position:absolute; inset:0; background:#0B1110; box-shadow:0 0 0 1px rgba(139,224,192,.5); }
.a9 .a9-sig i{ position:absolute; left:4px; top:4px; z-index:1; width:6px; height:6px; background:#DFFFF2; box-shadow:0 0 8px #8BE0C0; }
@keyframes a9-pulse{ 0%{ transform:scale(.55); opacity:.9; } 100%{ transform:scale(1.35); opacity:0; } }
.a9.a9-done .a9-sig{ opacity:0; }

.a9 .a9-end{
  display:flex; align-items:center; gap:10px; margin:-7px 0 0 -7px; white-space:nowrap;
  font:500 11px/1 var(--f-mono); letter-spacing:.16em; color:var(--a9-muted);
}
.a9 .a9-end > i{ position:relative; display:block; width:14px; height:14px; background:#fff; box-shadow:inset 0 0 0 1.5px #B4C6BF; transition:background .45s, box-shadow .45s; }
.a9 .a9-end em{ display:block; width:6px; height:6px; background:#B4C6BF; transition:background .45s, box-shadow .45s; }
.a9 .a9-end b{ font-weight:500; }
.a9 .a9-end.a9-lit{ color:var(--a9-jade); }
.a9 .a9-end.a9-lit > i{ background:#0B1110; box-shadow:0 0 0 4px rgba(61,170,136,.18), 0 0 18px rgba(61,170,136,.5); }
.a9 .a9-end.a9-lit > i::after{ content:""; position:absolute; left:5px; top:5px; width:4px; height:4px; background:var(--a9-mint); }
.a9 .a9-end.a9-lit em{ background:var(--a9-jb); box-shadow:0 0 8px rgba(61,170,136,.7); animation:a9-blink 2.4s steps(1,end) infinite; }
@keyframes a9-blink{ 0%,100%{ opacity:1; } 50%{ opacity:.35; } }

/* ---------- steps ---------- */
.a9 .a9-steps{ position:relative; z-index:1; display:flex; flex-direction:column; margin:0; padding:0; list-style:none; }
.a9 .a9-step{ width:calc(50% - var(--a9-lane) / 2); }
.a9 .a9-step:nth-child(even){ align-self:flex-end; }
.a9 .a9-step + .a9-step{ margin-top:-48px; }
.a9 .a9-card{
  position:relative; padding:28px 30px 32px; border-radius:16px; background:#FFFFFF;
  box-shadow:0 0 0 1px rgba(11,15,14,.085), 0 1px 2px rgba(11,15,14,.04), 0 12px 30px -20px rgba(10,40,32,.2);
  transition:transform .8s var(--a9-ease), box-shadow .8s var(--a9-ease);
}
.a9 .a9-step.a9-lit .a9-card{
  transform:translateY(-6px);
  box-shadow:0 0 0 1px rgba(13,107,84,.24), 0 2px 4px rgba(11,15,14,.04), 0 34px 60px -30px rgba(8,60,45,.4), 0 12px 24px -16px rgba(8,60,45,.18);
}
.a9 .a9-port{
  position:absolute; left:0; top:0; z-index:2; display:block; width:8px; height:8px; margin:-4px 0 0 -4px; background:#FFFFFF;
  box-shadow:inset 0 0 0 1.25px #B4C6BF; transition:background .5s, box-shadow .5s;
}
.a9 .a9-step.a9-lit .a9-port{ background:var(--a9-jade); box-shadow:inset 0 0 0 1.25px var(--a9-jade); }
.a9 .a9-top{ display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:22px; }
.a9 .a9-k{
  display:flex; align-items:center; gap:10px; margin:0;
  font:500 11.5px/1 var(--f-mono); letter-spacing:.16em; color:var(--a9-muted); transition:color .5s;
}
.a9 .a9-k i{ display:block; width:7px; height:7px; box-shadow:inset 0 0 0 1.5px #9FB3AC; transition:background .5s, box-shadow .5s; }
.a9 .a9-step.a9-lit .a9-k{ color:var(--a9-jade); }
.a9 .a9-step.a9-lit .a9-k i{ background:var(--a9-jade); box-shadow:inset 0 0 0 1.5px var(--a9-jade); }
.a9 .a9-chip{
  flex:none; display:flex; align-items:center; gap:10px; padding:7px 11px 7px 9px; border-radius:9px;
  background:#0B1110; box-shadow:inset 0 0 0 1px rgba(255,255,255,.07), 0 6px 14px -8px rgba(6,20,16,.55);
  font:500 9.5px/1 var(--f-mono); letter-spacing:.14em; color:rgba(232,237,234,.55);
}
.a9 .a9-chip b{ font-weight:500; min-width:5.2em; transition:color .5s; }
.a9 .a9-chip svg{ display:block; width:90px; height:27px; overflow:visible; }
.a9 .a9-chip path{ fill:none; stroke-linecap:round; stroke-linejoin:round; }
.a9 .a9-sp{ stroke:rgba(232,237,234,.24); stroke-width:1.4; stroke-dasharray:1 0; transition:stroke .5s; }
.a9 .a9-sp-b{ stroke:rgba(232,237,234,.12); }
.a9 .a9-sp-c{ stroke:rgba(232,237,234,.16); }
.a9 .a9-chip .a9-sp-a{ fill:rgba(61,170,136,0); stroke:none; transition:fill .8s; }
.a9 .a9-chip .a9-sp-band{ fill:rgba(232,237,234,.05); stroke:none; }
.a9 .a9-step.a9-lit .a9-chip b{ color:var(--a9-mint); }
.a9 .a9-step.a9-lit .a9-sp{ stroke:var(--a9-mint); stroke-dasharray:1 1; animation:a9-draw 1.4s var(--a9-ease) both; }
.a9 .a9-step.a9-lit .a9-sp-b{ stroke:rgba(139,224,192,.35); }
.a9 .a9-step.a9-lit .a9-sp-c{ stroke:rgba(139,224,192,.5); }
.a9 .a9-step.a9-lit .a9-chip .a9-sp-a{ fill:rgba(61,170,136,.22); }
.a9 .a9-step.a9-lit .a9-chip .a9-sp-band{ fill:rgba(139,224,192,.09); }
@keyframes a9-draw{ from{ stroke-dashoffset:1; } to{ stroke-dashoffset:0; } }

.a9 .a9-t{ margin:0; color:var(--a9-ink); font:800 clamp(26px, 2.3vw, 32px)/1.05 var(--f-display); letter-spacing:-.025em; }
.a9 .a9-d{ margin:12px 0 0; color:var(--a9-body); font:400 16.5px/1.55 var(--f-body); }

/* ---------- tablet ---------- */
@media (max-width: 1100px){
  .a9 .a9-card{ padding:24px 24px 28px; }
  .a9 .a9-chip svg{ width:72px; height:22px; }
  .a9 .a9-chip b{ display:none; }
}

/* ---------- mobile: vertical line on the left, cards to its right ---------- */
@media (max-width: 760px){
  .a9{ padding:96px 0 112px; }
  .a9 .a9-head{ grid-template-columns:minmax(0, 1fr); gap:22px; }
  .a9 .a9-eyebrow{ margin-bottom:20px; }
  .a9 .a9-path{ margin-top:48px; padding:40px 0 96px; }
  .a9 .a9-steps{ gap:22px; }
  .a9 .a9-step, .a9 .a9-step:nth-child(even){ width:auto; align-self:stretch; padding-left:38px; }
  .a9 .a9-step + .a9-step{ margin-top:0; }
  .a9 .a9-card{ padding:22px 20px 24px; border-radius:14px; }
  .a9 .a9-top{ margin-bottom:18px; }
  .a9 .a9-chip svg{ width:64px; height:20px; }
  .a9 .a9-t{ font-size:26px; }
  .a9 .a9-d{ font-size:16px; }
  .a9 .a9-step.a9-lit .a9-card{ transform:translateY(-3px); }
}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion: reduce){
  .a9 .a9-card, .a9 .a9-node, .a9 .a9-k, .a9 .a9-k i, .a9 .a9-sp, .a9 .a9-conns line, .a9 .a9-ticks line{ transition:none !important; }
  .a9 .a9-sp, .a9 .a9-ff{ animation:none !important; }
  .a9 .a9-sig{ display:none; }
  .a9 .a9-end.a9-lit em{ animation:none; }
}
/* ==========================================================================
   ABOUT + HOW WE WORK
   ========================================================================== */
.about-grid{
  display:grid; grid-template-columns:minmax(0, 6fr) minmax(0, 6fr);
  column-gap:clamp(40px, 7vw, 120px); align-items:start;
}
.about-copy .eyebrow{ margin-bottom:26px; }
.about-copy .h2{ margin-bottom:34px; max-width:13em; }
.about-copy p:not(.eyebrow){ font-size:17.5px; line-height:1.7; color:var(--muted); max-width:34em; }
.about-copy p.lead-p{ color:var(--paper); }
.about-copy p + p{ margin-top:18px; }
.about-copy .btn{ margin-top:40px; }
/* right column: globe, then "How we work" directly underneath; the copy rides along on the left */
.about-grid{ grid-template-areas:"copy globe" "copy term"; row-gap:18px; }
.about-copy{ grid-area:copy; position:sticky; top:calc(var(--header-h) + 48px); align-self:start; }
.about-globe{ grid-area:globe; }
.about .term{ grid-area:term; }
.ag-panel{
  position:relative; background:var(--ink-2);
  border:1px solid var(--hair-2); border-radius:4px; overflow:hidden;
  box-shadow:0 40px 90px -50px rgba(0,0,0,.9), 0 0 0 1px rgba(61,170,136,.04);
}
.ag-bar{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  height:46px; padding:0 18px; border-bottom:1px solid var(--hair); overflow:hidden; min-width:0;
  background:rgba(232,237,234,.02);
  font:500 10.5px/1 var(--f-mono); letter-spacing:.14em; text-transform:uppercase; color:var(--muted);
}
.ag-bar > span{ display:inline-flex; align-items:center; gap:10px; white-space:nowrap; }
.ag-bar b{ font-weight:500; color:var(--mint); }
.ag-bar .led{ width:6px; height:6px; background:var(--mint); flex:none; animation:livePulse 2.2s var(--ease-out) infinite; }
.ag-bar .ticks{ flex:1; height:7px; max-width:220px; background:repeating-linear-gradient(90deg, rgba(232,237,234,.18) 0 1px, transparent 1px 8px); }
.ag-view{
  position:relative; width:100%; aspect-ratio:1/1;
  min-height:340px;
  background:
    radial-gradient(rgba(232,237,234,.06) 1px, transparent 1.3px) 0 0 / 18px 18px,
    radial-gradient(ellipse 60% 55% at 50% 50%, rgba(13,107,84,.16), transparent 72%);
}
.ag-view canvas{ position:absolute; inset:0; width:100%; height:100%; display:block; touch-action:pan-y; cursor:grab; }
.ag-view canvas:active{ cursor:grabbing; }
.ag-view .br{ position:absolute; width:12px; height:12px; border:0 solid rgba(232,237,234,.3); pointer-events:none; }
.ag-view .b1{ left:12px; top:12px; border-left-width:1px; border-top-width:1px; }
.ag-view .b2{ right:12px; top:12px; border-right-width:1px; border-top-width:1px; }
.ag-view .b3{ left:12px; bottom:12px; border-left-width:1px; border-bottom-width:1px; }
.ag-view .b4{ right:12px; bottom:12px; border-right-width:1px; border-bottom-width:1px; }
.ag-hint{ position:absolute; right:30px; bottom:20px; font:500 9.5px/1 var(--f-mono); letter-spacing:.16em; color:var(--faint); pointer-events:none; }
.ag-foot{
  display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  padding:14px 18px 15px; border-top:1px solid var(--hair);
  font:500 10.5px/1 var(--f-mono); letter-spacing:.14em; text-transform:uppercase; color:var(--muted);
}
.ag-foot .sq{ width:8px; height:8px; background:var(--mint); box-shadow:0 0 8px rgba(61,170,136,.8); flex:none; }
.ag-foot b{ font-weight:500; color:var(--paper); }
.ag-foot .rule{ position:relative; width:42px; height:1px; background:var(--hair-3); flex:none; }
.ag-foot .rule::after{ content:""; position:absolute; right:0; top:-3px; width:7px; height:7px; border-top:1px solid var(--muted); border-right:1px solid var(--muted); transform:rotate(45deg) translate(-1px,1px); }
@media (hover: none){ .ag-hint{ display:none; } }
@media (max-width: 379px){ .ag-coord{ display:none; } }

@keyframes arcP{ 0%{ stroke-dashoffset:7; } 70%,100%{ stroke-dashoffset:-100; } }
@keyframes ring{ 0%{ transform:scale(.6); opacity:.9; } 100%{ transform:scale(3.4); opacity:0; } }

@media (max-width: 899px){
  .about-grid{ grid-template-columns:minmax(0, 1fr); row-gap:18px; grid-template-areas:"copy" "globe" "term"; }
  .about-copy{ position:relative; top:auto; margin-bottom:34px; }
  .ag-view{ min-height:0; }
  .ag-bar .ticks{ display:none; }
  .term-list li{ font-size:13.5px; }
}
/* ==========================================================================
   INTRO LOADER — Circuit
   ========================================================================== */
html.intro::after{
  content:""; position:fixed; inset:0; z-index:180; background:var(--ink);
  animation:coverFailsafe .4s linear 3s forwards;
}
@keyframes coverFailsafe{ to{ opacity:0; visibility:hidden; } }
.loader{ position:fixed; inset:0; z-index:190; cursor:pointer; }
.loader-bg{ position:absolute; inset:0; background:var(--ink); transition:opacity .5s var(--ease-io); }
.loader-bg::before{
  content:""; position:absolute; inset:0;
  background-image:radial-gradient(rgba(232,237,234,.07) 1px, transparent 1.3px);
  background-size:28px 28px; background-position:center;
  -webkit-mask-image:radial-gradient(circle at 50% 50%, #000, transparent 60%);
  mask-image:radial-gradient(circle at 50% 50%, #000, transparent 60%);
}
.loader canvas{ position:absolute; inset:0; width:100%; height:100%; display:block; }
.loader.fade .loader-bg{ opacity:0; }
.loader.out{ opacity:0; transition:opacity .22s linear; }


/* ==========================================================================
   HOMEPAGE — fitting the landing page to the site's own markup
   (labels inside visuals come from data attributes, never from page text)
   ========================================================================== */
/* hero */
.hero h1 br{ display:none; }
.hero h1 mark{ color:var(--jade-bright); }
.hero .phero-actions{ margin-top:0; }
.src::after{ content:attr(data-t); }
.rail-readout [data-t]::before{ content:attr(data-t); }
.hero .eyebrow{ text-transform:uppercase; }

/* who we help */
.w6 .w6-head{ max-width:860px; }
.w6 .w6-lbl::before{ content:attr(data-a); }
.w6 .w6-lbl::after{ content:"/ " attr(data-b); color:rgba(232,237,234,.62); margin-left:.5em; }
.w6 .w6-key::after{ content:attr(data-k); }
.w6 .w6-t::after{ content:"."; }
.w6 .w6-txt .w6-d{ color:rgba(255,255,255,.66); font-size:16px; }
.w6 p.w6-meta{
  margin:0; font:500 10px/1.8 var(--f-mono); letter-spacing:.11em; text-transform:uppercase; color:rgba(139,224,192,.78);
}
.w6 p.w6-more{ margin:0; }
.w6 a.w6-link{ background:none; padding-bottom:0; color:#fff; }
.w6 a.w6-link:hover{ color:#fff; }
.w6 .w6-grid{ list-style:none; }

/* services: circuit board */
.services .board{ counter-reset:svc; }
.services .svc{ counter-increment:svc; }
.svc-n::before{ content:counter(svc, decimal-leading-zero); font:500 11px/1.2 var(--f-mono); letter-spacing:.14em; color:var(--muted); }
.svc p.meta{ margin-top:18px; font:500 10.5px/1.75 var(--f-mono); letter-spacing:.09em; text-transform:uppercase; color:var(--muted); }
.svc.is-active p.meta{ color:rgba(139,224,192,.85); }
.svc p.meta.incl{ color:var(--mint); }
.svc a.svc-link{
  display:inline-flex; margin-top:20px; color:var(--paper); font:500 14.5px/1.2 var(--f-body); padding-bottom:4px;
  background:linear-gradient(var(--jade-bright), var(--jade-bright)) left bottom / 0 1px no-repeat;
}
.svc a.svc-link:hover{ background-size:100% 1px; }
.chip-logo::before{ content:"NAVRE"; }
.chip-logo span::before{ content:"N"; }
.services .sec-head .lede{ color:var(--muted); }

/* approach: signal path */
.a9 .a9-h2 .hl{ color:var(--a9-jade); font-weight:800; }
.a9 .a9-sub.lede{ color:var(--a9-body); max-width:470px; font:400 clamp(16.5px, 1.3vw, 18.5px)/1.5 var(--f-body); }
.a9 .a9-eyebrow{ text-transform:uppercase; }
.a9 .a9-eyebrow::before{ display:none; }
.a9 a.a9-cta{
  height:auto; padding:2px 0 6px; border-radius:0; box-shadow:none; overflow:visible; gap:10px;
  font:500 16px/1.2 var(--f-body); color:var(--a9-ink);
  background:linear-gradient(var(--a9-jade), var(--a9-jade)) 0 100% / 100% 1.5px no-repeat;
}
.a9 a.a9-cta::after{ content:"→"; color:var(--a9-jade); transition:transform .35s var(--a9-ease); }
.a9 a.a9-cta:hover{ color:var(--a9-jade); background:linear-gradient(var(--a9-jade), var(--a9-jade)) 0 100% / 100% 1.5px no-repeat; box-shadow:none; }
.a9 a.a9-cta:hover::after{ transform:translateX(4px); }
.a9 .a9-k{ text-transform:uppercase; }
.a9 .a9-chip::after{ content:attr(data-c); font-weight:500; min-width:5.2em; transition:color .5s; }
.a9 .a9-step.a9-lit .a9-chip::after{ color:var(--a9-mint); }
.a9 .a9-end [data-t]::before{ content:attr(data-t); }
@media (max-width: 1100px){ .a9 .a9-chip::after{ display:none; } }

/* about: copy, globe, terminal */
.about .about-copy .eyebrow{ text-transform:uppercase; }
.about .about-copy .lede{ font-size:17.5px; line-height:1.7; color:var(--muted); max-width:34em; }
.about .about-copy .lede:first-of-type{ color:var(--paper); }
.about .about-copy .phero-actions{ margin-top:40px !important; }
.about .about-term{ grid-area:term; }
.ag-bar .ag-ticks{ flex:1; height:7px; max-width:220px; background:repeating-linear-gradient(90deg, rgba(232,237,234,.18) 0 1px, transparent 1px 8px); }
.ag-bar [data-t]::before, .ag-foot [data-t]::before, .ag-hint::before{ content:attr(data-t); }
@media (max-width: 899px){ .ag-bar .ag-ticks{ display:none; } }

/* the logo's jade square catches the intro chip as it lands */
#nav .word{ position:relative; }
html.dot-land #nav .word::after{
  content:""; position:absolute; right:1px; bottom:9px; width:4px; height:4px;
  animation:dotLand .9s var(--ease-out);
}
@keyframes dotLand{
  0%{ box-shadow:0 0 0 0 rgba(139,224,192,.9), 0 0 14px 4px rgba(61,170,136,.9); }
  100%{ box-shadow:0 0 0 10px rgba(139,224,192,0), 0 0 0 0 rgba(61,170,136,0); }
}

/* homepage: no faint column-line grid behind the Services, About and CTA sections */
.gridlines, .sky-grid{ display:none !important; }
.ag-view .br{ display:none; } /* globe corner brackets removed */