/* ═══════════════════════ PROXMIO — Deep Ocean ═══════════════════════ */
:root{
  --bg:#030B11;
  --surf:#0A1A1F;
  --surf2:#11272D;
  --pr:#2DD4BF;
  --prh:#5EEAD4;
  --blue:#60A5FA;
  --tx:#F0FDFA;
  --txm:rgba(224,247,242,0.65);
  --txf:rgba(224,247,242,0.42);
  --grad:linear-gradient(135deg,#0F766E 0%,#38BDF8 100%);
  --ok:#34D399;
  --err:#FB7185;
  --ease:cubic-bezier(0.22,1,0.36,1);
  --spring:cubic-bezier(0.34,1.56,0.64,1);
  --r-card:20px;
  --r-btn:16px;
  --r-input:12px;
  --header-h:72px;
}
@property --ga{ syntax:'<angle>'; inherits:false; initial-value:160deg; }

*{ margin:0; padding:0; box-sizing:border-box; }
html{ scroll-behavior:smooth; background:#030B11; scrollbar-color:#11272D #030B11; overflow-x:clip; }
body{
  background:var(--bg);
  color:var(--tx);
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  font-size:16px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
::selection{ background:rgba(45,212,191,.32); color:var(--tx); }
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:none; cursor:pointer; }
input{ font:inherit; }

/* ── Ambient background blooms ─────────────────────────────────── */
.blooms{ position:fixed; inset:0; z-index:0; pointer-events:none; overflow:hidden; }
.bloom{ position:absolute; border-radius:50%; filter:blur(90px); opacity:.55; will-change:transform; }
.bloom-a{ width:54vmax; height:54vmax; left:-18vmax; top:-16vmax;
  background:radial-gradient(circle at 40% 40%, rgba(15,118,110,.42), transparent 65%);
  animation:driftA 36s var(--ease) infinite alternate; }
.bloom-b{ width:46vmax; height:46vmax; right:-16vmax; top:22vh;
  background:radial-gradient(circle at 55% 45%, rgba(56,189,248,.20), transparent 62%);
  animation:driftB 44s var(--ease) infinite alternate; }
.bloom-c{ width:50vmax; height:50vmax; left:8vw; bottom:-28vmax;
  background:radial-gradient(circle at 50% 50%, rgba(45,212,191,.16), transparent 64%);
  animation:driftC 52s var(--ease) infinite alternate; }
@keyframes driftA{ from{ transform:translate3d(0,0,0) scale(1);} to{ transform:translate3d(9vw,7vh,0) scale(1.14);} }
@keyframes driftB{ from{ transform:translate3d(0,0,0) scale(1.08);} to{ transform:translate3d(-7vw,-9vh,0) scale(.94);} }
@keyframes driftC{ from{ transform:translate3d(0,0,0) scale(1);} to{ transform:translate3d(6vw,-6vh,0) scale(1.18);} }

.grain{ position:fixed; inset:0; z-index:1; pointer-events:none; opacity:.05; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='0.6'/%3E%3C/svg%3E"); }

main, header.site-header, footer{ position:relative; z-index:2; }

/* ── Glass surface language ───────────────────────────────────── */
.glass{
  position:relative;
  background:linear-gradient(165deg, rgba(17,39,45,.60) 0%, rgba(10,26,31,.42) 60%, rgba(10,26,31,.52) 100%);
  -webkit-backdrop-filter:blur(22px) saturate(1.6);
  backdrop-filter:blur(22px) saturate(1.6);
  border-radius:var(--r-card);
  box-shadow:
    inset 0 1px 0 rgba(240,253,250,.09),
    inset 0 0 0 1px rgba(240,253,250,.02),
    0 18px 48px rgba(1,6,10,.5),
    0 4px 14px rgba(1,6,10,.35);
}
.glass::before{
  content:""; position:absolute; inset:0; border-radius:inherit; padding:1px;
  background:linear-gradient(var(--ga), rgba(94,234,212,.38), rgba(96,165,250,.10) 40%, rgba(94,234,212,.04) 70%, rgba(96,165,250,.16));
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
  pointer-events:none;
}
.glass-soft{
  background:linear-gradient(165deg, rgba(17,39,45,.34) 0%, rgba(10,26,31,.26) 100%);
  -webkit-backdrop-filter:blur(12px) saturate(1.35);
  backdrop-filter:blur(12px) saturate(1.35);
}
.glass-anim::before{ animation:borderHue 9s linear infinite; }
@keyframes borderHue{ to{ --ga:520deg; } }

/* ── Layout primitives ────────────────────────────────────────── */
.wrap{ width:min(1180px, calc(100% - 48px)); margin-inline:auto; }
section{ padding:clamp(84px,11vh,140px) 0; position:relative; scroll-margin-top:calc(var(--header-h) + 12px); }
.kicker{ display:inline-flex; align-items:center; gap:8px; font-size:13px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--pr); margin-bottom:18px; }
.kicker::before{ content:""; width:22px; height:1px; background:var(--pr); opacity:.7; }
.sec-title{ font-size:clamp(30px,4.4vw,52px); font-weight:800; letter-spacing:-0.025em; line-height:1.1; text-wrap:balance; }
.sec-sub{ color:var(--txm); max-width:560px; margin-top:16px; font-size:clamp(15px,1.4vw,18px); text-wrap:pretty; }
.sec-head{ margin-bottom:clamp(40px,6vh,64px); }
.center{ text-align:center; }
.center .sec-sub{ margin-inline:auto; }

/* ── Reveal-on-scroll (progressive enhancement) ───────────────── */
/* Visible by default. The hidden pre-reveal state only applies once JS has
   confirmed a live frame loop and added .anim-ready to <html>; if frames
   stall it removes the class and everything is simply visible. */
[data-reveal]{ opacity:1; transform:none; filter:none; }
.anim-ready [data-reveal]{
  opacity:0; transform:translateY(30px); filter:blur(10px);
  transition:opacity .75s var(--ease) var(--d,0s), transform .75s var(--ease) var(--d,0s), filter .75s var(--ease) var(--d,0s);
  will-change:opacity,transform,filter;
}
.anim-ready [data-reveal].in{ opacity:1; transform:none; filter:blur(0); }

/* ── Buttons ──────────────────────────────────────────────────── */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:15px 28px; border-radius:var(--r-btn);
  font-weight:600; font-size:15.5px; line-height:1;
  position:relative; will-change:transform;
  transition:transform .45s var(--spring), box-shadow .5s var(--ease), background-color .4s var(--ease), border-color .4s var(--ease);
  white-space:nowrap;
}
.btn-primary{
  background:var(--grad); color:#04211E;
  box-shadow:0 4px 18px rgba(45,212,191,.28), inset 0 1px 0 rgba(255,255,255,.32);
  font-weight:700;
}
.btn-primary:hover{ box-shadow:0 8px 34px rgba(45,212,191,.5), 0 0 0 1px rgba(94,234,212,.45), inset 0 1px 0 rgba(255,255,255,.4); }
.btn-ghost{
  background:rgba(17,39,45,.45); border:1px solid rgba(94,234,212,.22); color:var(--tx);
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
}
.btn-ghost:hover{ border-color:rgba(94,234,212,.55); background:rgba(17,39,45,.7); box-shadow:0 6px 26px rgba(45,212,191,.16); }
.btn .arr{ transition:transform .45s var(--spring); }
.btn:hover .arr{ transform:translateX(4px); }

/* ── Header ───────────────────────────────────────────────────── */
.site-header{
  position:fixed; top:0; left:0; right:0; z-index:60;
  transition:transform .5s var(--ease);
}
.header-bar{
  margin:14px auto 0; width:min(1180px, calc(100% - 32px));
  display:flex; align-items:center; gap:28px;
  padding:10px 12px 10px 22px;
  border-radius:18px;
}
.logo{ display:flex; align-items:center; gap:10px; font-weight:800; font-size:19px; letter-spacing:-0.02em; }
.logo-mark{ width:28px; height:28px; border-radius:9px; overflow:hidden; display:block; flex-shrink:0; }
@keyframes ping{ 0%{ transform:scale(.45); opacity:1;} 70%,100%{ transform:scale(1.5); opacity:0;} }
.nav{ display:flex; gap:4px; margin-inline:auto; }
.nav a{
  padding:9px 15px; border-radius:12px; font-size:14.5px; font-weight:500; color:var(--txm);
  transition:color .35s var(--ease), background-color .35s var(--ease);
}
.nav a:hover{ color:var(--tx); background:rgba(94,234,212,.08); }
.header-actions{ display:flex; align-items:center; gap:10px; }
.header-cta{ padding:11px 20px; font-size:14px; border-radius:13px; }

/* Language switcher */
.lang{ position:relative; }
.lang-btn{
  display:flex; align-items:center; gap:7px; padding:10px 13px; border-radius:12px;
  font-size:13.5px; font-weight:600; color:var(--txm); letter-spacing:.04em;
  border:1px solid rgba(240,253,250,.1);
  transition:color .35s var(--ease), border-color .35s var(--ease), background-color .35s var(--ease);
}
.lang-btn:hover, .lang.open .lang-btn{ color:var(--tx); border-color:rgba(94,234,212,.4); background:rgba(17,39,45,.55); }
.lang-btn svg{ opacity:.8; }
.lang-btn .chev{ transition:transform .4s var(--ease); }
.lang.open .lang-btn .chev{ transform:rotate(180deg); }
.lang-menu{
  position:absolute; top:calc(100% + 10px); right:0; min-width:176px;
  padding:7px; border-radius:16px; z-index:70;
  opacity:0; transform:translateY(-8px) scale(.96); transform-origin:top right;
  pointer-events:none; visibility:hidden;
  transition:opacity .4s var(--ease), transform .4s var(--ease), visibility 0s .4s;
}
.lang.open .lang-menu{ opacity:1; transform:none; pointer-events:auto; visibility:visible; transition-delay:0s; }
.lang-menu button{
  display:flex; align-items:center; justify-content:space-between; width:100%;
  padding:10px 13px; border-radius:10px; font-size:14px; font-weight:500; color:var(--txm);
  transition:background-color .3s var(--ease), color .3s var(--ease);
}
.lang-menu button:hover{ background:rgba(94,234,212,.09); color:var(--tx); }
.lang-menu button .check{ opacity:0; color:var(--pr); transform:scale(.6); transition:opacity .3s var(--ease), transform .3s var(--spring); }
.lang-menu button.active{ color:var(--tx); }
.lang-menu button.active .check{ opacity:1; transform:scale(1); }
.lang-menu .ln{ display:flex; gap:9px; align-items:baseline; }
.lang-menu .lc{ font-size:11.5px; font-weight:700; letter-spacing:.08em; color:var(--pr); width:22px; }

/* Burger + drawer */
.burger{ display:none; width:42px; height:42px; border-radius:12px; border:1px solid rgba(240,253,250,.12); position:relative; flex-shrink:0; }
.burger span{ position:absolute; left:12px; right:12px; height:1.6px; background:var(--tx); border-radius:2px; transition:transform .45s var(--spring), opacity .3s, top .45s var(--spring); }
.burger span:nth-child(1){ top:15px; } .burger span:nth-child(2){ top:20.5px; } .burger span:nth-child(3){ top:26px; }
body.drawer-open .burger span:nth-child(1){ top:20.5px; transform:rotate(45deg); }
body.drawer-open .burger span:nth-child(2){ opacity:0; }
body.drawer-open .burger span:nth-child(3){ top:20.5px; transform:rotate(-45deg); }
.drawer{
  position:fixed; top:0; right:0; bottom:0; width:min(340px, 86vw); z-index:55;
  padding:104px 26px 30px; border-radius:0;
  transform:translateX(105%); transition:transform .6s var(--ease);
  display:flex; flex-direction:column; gap:6px;
}
body.drawer-open .drawer{ transform:none; }
.drawer a{ padding:15px 14px; border-radius:14px; font-size:17px; font-weight:600; color:var(--txm); transition:background-color .3s, color .3s; }
.drawer a:hover{ background:rgba(94,234,212,.08); color:var(--tx); }
.drawer .btn{ margin-top:18px; }
.scrim{ position:fixed; inset:0; z-index:50; background:rgba(2,8,12,.5); -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px);
  opacity:0; pointer-events:none; transition:opacity .5s var(--ease); }
body.drawer-open .scrim{ opacity:1; pointer-events:auto; }

/* ── HERO ─────────────────────────────────────────────────────── */
.hero{
  min-height:100svh;
  display:flex; align-items:center;
  padding:calc(var(--header-h)+60px) 0 clamp(220px,30vh,360px);
  overflow:hidden; position:relative;
}
/* bottom fade — fully reaches var(--bg) well inside the section so the clipped boundary is invisible */
.hero::after{
  content:""; position:absolute; bottom:0; left:0; right:0;
  height:clamp(300px,38vh,460px);
  background:linear-gradient(to bottom, transparent 0%, rgba(3,11,17,.35) 28%, rgba(3,11,17,.72) 55%, rgba(3,11,17,.94) 78%, var(--bg) 100%);
  z-index:4; pointer-events:none;
}
.hero::before{
  content:""; position:absolute; inset:0; z-index:2; pointer-events:none;
  background:linear-gradient(90deg, rgba(3,11,17,.90) 0%, rgba(3,11,17,.70) 30%, rgba(3,11,17,.28) 56%, transparent 72%);
}
.hero > .wrap{ flex:0 1 auto; position:relative; z-index:3; }
.hero .wrap{ display:block; }
.hero-copy{ max-width:min(580px,52vw); position:relative; }
/* hero copy — no mask, clean left column */
.hero-copy-inner{ position:relative; z-index:2; }
.hero-badge{
  display:inline-flex; align-items:center; gap:9px; padding:9px 16px; border-radius:999px;
  font-size:13px; font-weight:600; color:var(--prh); margin-bottom:26px;
}
.hero-badge .pulse{ width:7px; height:7px; border-radius:50%; background:var(--ok); box-shadow:0 0 0 0 rgba(52,211,153,.6); animation:badgePulse 2.4s var(--ease) infinite; }
@keyframes badgePulse{ 0%{ box-shadow:0 0 0 0 rgba(52,211,153,.55);} 70%,100%{ box-shadow:0 0 0 9px rgba(52,211,153,0);} }
.hero h1{
  font-size:clamp(40px,5.6vw,72px); font-weight:800; letter-spacing:-0.035em; line-height:1.04; text-wrap:balance;
}
.hero h1 .l2{
  display:block;
  background:linear-gradient(100deg, var(--prh) 10%, #38BDF8 55%, var(--pr) 90%);
  background-size:200% 100%;
  -webkit-background-clip:text; background-clip:text; color:transparent;
  animation:shimmer 7s var(--ease) infinite alternate;
}
@keyframes shimmer{ from{ background-position:0% 0;} to{ background-position:100% 0;} }
.hero-sub{ color:var(--txm); font-size:clamp(16px,1.6vw,19px); max-width:480px; margin:24px 0 36px; text-wrap:pretty; }
.hero-ctas{ display:flex; gap:14px; flex-wrap:wrap; }
.hero-meta{ display:flex; gap:22px; margin-top:42px; color:var(--txf); font-size:13px; flex-wrap:wrap; }
.hero-meta span{ display:inline-flex; align-items:center; gap:7px; }
.hero-meta svg{ color:var(--pr); opacity:.8; flex-shrink:0; }

/* full-bleed radar stage — mask fades all edges so canvas never shows a hard line */
.hero-stage{
  position:absolute; inset:0; z-index:1; overflow:hidden;
  -webkit-mask-image:linear-gradient(to bottom, black 52%, rgba(0,0,0,.4) 76%, transparent 96%);
  mask-image:linear-gradient(to bottom, black 52%, rgba(0,0,0,.4) 76%, transparent 96%);
}
#radar{
  position:absolute; inset:0; width:100%; height:100%; display:block; cursor:default;
}
.hero-stage .stage-glow{
  position:absolute; left:50%; top:55%; width:70%; aspect-ratio:1; transform:translate(-50%,-50%);
  background:radial-gradient(circle, rgba(45,212,191,.16), transparent 62%);
  filter:blur(30px); pointer-events:none; animation:breathe 6s var(--ease) infinite alternate;
}
@keyframes breathe{ from{ opacity:.6; transform:translate(-50%,-50%) scale(.94);} to{ opacity:1; transform:translate(-50%,-50%) scale(1.06);} }
.radar-tip{
  position:absolute; bottom:6px; left:50%; transform:translateX(-50%);
  font-size:12px; color:var(--txf); letter-spacing:.06em; display:flex; gap:7px; align-items:center;
  padding:7px 14px; border-radius:999px;
}

/* ── HOW IT WORKS ─────────────────────────────────────────────── */
.steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; counter-reset:step; }
.step{ padding:34px 28px 32px; overflow:hidden; transition:transform .6s var(--spring), box-shadow .6s var(--ease); }
.step:hover{ transform:translateY(-6px); }
.step-num{
  font-size:13px; font-weight:700; letter-spacing:.12em; color:var(--pr);
  display:flex; align-items:center; gap:12px; margin-bottom:46px;
}
.step-num::after{ content:""; flex:1; height:1px; background:linear-gradient(90deg, rgba(45,212,191,.4), transparent); }
.step-icon{ width:52px; height:52px; border-radius:15px; display:grid; place-items:center; margin-bottom:22px;
  background:linear-gradient(150deg, rgba(45,212,191,.16), rgba(56,189,248,.07));
  border:1px solid rgba(94,234,212,.25); color:var(--prh);
  box-shadow:0 0 22px rgba(45,212,191,.12) inset; }
.step h3{ font-size:19.5px; font-weight:700; letter-spacing:-0.015em; margin-bottom:10px; }
.step p{ color:var(--txm); font-size:15px; }

/* ── MATCHING ─────────────────────────────────────────────────── */
.match-stage{ position:relative; padding:clamp(28px,4vw,56px); margin-bottom:60px; overflow:hidden; }
.match-grid{ position:relative; display:grid; grid-template-columns:1fr minmax(90px,150px) 1fr; align-items:center; gap:0; }
.mcard{ padding:24px 24px 22px; border-radius:18px; position:relative; z-index:2; transition:transform .8s var(--ease), box-shadow .8s var(--ease); }
.mcard .tag{ display:inline-flex; padding:5px 12px; border-radius:999px; font-size:11.5px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; margin-bottom:14px; }
.mcard-need .tag{ background:rgba(45,212,191,.14); color:var(--prh); border:1px solid rgba(45,212,191,.3); }
.mcard-offer .tag{ background:rgba(96,165,250,.13); color:#93C5FD; border:1px solid rgba(96,165,250,.3); }
.mcard h4{ font-size:16.5px; font-weight:600; line-height:1.4; letter-spacing:-0.01em; }
.mcard .meta{ display:flex; gap:8px; margin-top:14px; flex-wrap:wrap; }
.mcard .meta span{ font-size:12px; color:var(--txf); padding:4px 10px; border:1px solid rgba(240,253,250,.1); border-radius:999px; }
.match-stage.matched .mcard-need{ transform:translateX(14px); }
.match-stage.matched .mcard-offer{ transform:translateX(-14px); }
.match-stage.matched .mcard{ box-shadow:0 0 0 1px rgba(94,234,212,.3), 0 14px 44px rgba(45,212,191,.13); }
.match-wire{ position:absolute; inset:0; z-index:1; width:100%; height:100%; overflow:visible; }
/* drawn by default; only hidden/animated once the animation layer is active */
.match-wire path{ stroke-dasharray:var(--len,300); stroke-dashoffset:0; }
.anim-ready .match-wire .wire-base{ stroke-dashoffset:var(--len,300); }
.anim-ready .match-stage.matched .match-wire .wire-base{ animation:wire 1.1s var(--ease) .15s forwards; }
@keyframes wire{ to{ stroke-dashoffset:0; } }
/* a pulse of light travelling along the connection once it's drawn */
.match-wire .wire-pulse{ opacity:0; stroke-dashoffset:0; }
.anim-ready .match-stage.matched .match-wire .wire-pulse{
  stroke-dasharray:20 600; opacity:1;
  animation:wireFlow 2.4s linear 1.3s infinite;
}
@keyframes wireFlow{ from{ stroke-dashoffset:620; } to{ stroke-dashoffset:0; } }
.score-badge{
  position:relative; z-index:3; justify-self:center;
  display:flex; flex-direction:column; align-items:center; gap:1px;
  width:86px; height:86px; border-radius:50%; justify-content:center;
  background:radial-gradient(circle at 35% 30%, rgba(94,234,212,.22), rgba(10,26,31,.85));
  border:1px solid rgba(94,234,212,.45);
  box-shadow:0 0 30px rgba(45,212,191,.25), inset 0 1px 0 rgba(240,253,250,.15);
  opacity:1; transform:none;
}
.anim-ready .score-badge{ opacity:0; transform:scale(.3); transition:opacity .6s var(--ease) .9s, transform .7s var(--spring) .9s; }
.anim-ready .match-stage.matched .score-badge{ opacity:1; transform:scale(1); }
.score-badge b{ font-size:25px; font-weight:800; letter-spacing:-0.03em; color:var(--prh); line-height:1; }
.score-badge small{ font-size:9.5px; font-weight:700; letter-spacing:.13em; color:var(--txf); text-transform:uppercase; }
.match-replay{ position:absolute; right:16px; bottom:14px; z-index:4; font-size:12px; color:var(--txf); padding:7px 13px; border-radius:999px;
  border:1px solid rgba(240,253,250,.1); transition:color .3s, border-color .3s; }
.match-replay:hover{ color:var(--pr); border-color:rgba(45,212,191,.4); }

.mx-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-bottom:44px; }
.mx{ padding:28px 26px; }
.mx .mx-k{ font-size:12px; font-weight:700; letter-spacing:.13em; color:var(--pr); text-transform:uppercase; display:block; margin-bottom:12px; }
.mx h4{ font-size:17px; font-weight:700; margin-bottom:8px; letter-spacing:-0.01em; }
.mx p{ font-size:14.5px; color:var(--txm); }
.mx .pts{ font-variant-numeric:tabular-nums; color:var(--prh); font-weight:700; }
.domains{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center; }
.domains .dlabel{ width:100%; text-align:center; font-size:12.5px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--txf); margin-bottom:6px; }
.chip{
  padding:9px 18px; border-radius:999px; font-size:14px; font-weight:500; color:var(--txm);
  border:1px solid rgba(94,234,212,.18);
  background:rgba(17,39,45,.4);
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  transition:transform .5s var(--spring), border-color .4s var(--ease), color .4s var(--ease), box-shadow .5s var(--ease);
}
.chip:hover{ transform:translateY(-3px); border-color:rgba(94,234,212,.55); color:var(--prh); box-shadow:0 8px 22px rgba(45,212,191,.14); }

/* ── FOR WHOM ─────────────────────────────────────────────────── */
.who-grid{ display:grid; grid-template-columns:1fr 1fr; gap:26px; max-width:920px; margin-inline:auto; }
.who{ padding:38px 34px; display:flex; flex-direction:column; }
.who-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; }
.who h3{ font-size:23px; font-weight:800; letter-spacing:-0.02em; }
.who .pill{ font-size:11.5px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; padding:6px 13px; border-radius:999px; }
.who-ind .pill{ background:rgba(45,212,191,.15); color:var(--prh); border:1px solid rgba(45,212,191,.35); }
.who-biz .pill{ background:rgba(96,165,250,.13); color:#93C5FD; border:1px solid rgba(96,165,250,.35); }
.who .who-sub{ color:var(--txm); font-size:14.5px; margin-bottom:26px; }
.who ul{ list-style:none; display:flex; flex-direction:column; gap:14px; }
.who li{ display:flex; gap:12px; font-size:15px; color:var(--txm); align-items:flex-start; }
.who li svg{ flex-shrink:0; margin-top:4px; }
.who-ind li svg{ color:var(--pr); }
.who-biz li svg{ color:var(--blue); }
.who-biz::before{ background:linear-gradient(var(--ga), rgba(96,165,250,.45), rgba(96,165,250,.08) 45%, rgba(94,234,212,.05) 75%, rgba(96,165,250,.2)); }

/* ── FEATURES ─────────────────────────────────────────────────── */
.feat-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; perspective:1400px; }
.feat{
  padding:30px 28px; transform-style:preserve-3d;
  transition:transform .18s linear, box-shadow .6s var(--ease);
  will-change:transform;
}
.feat.settling{ transition:transform .9s var(--spring), box-shadow .6s var(--ease); }
.feat-icon{ width:48px; height:48px; border-radius:14px; display:grid; place-items:center; margin-bottom:20px;
  background:linear-gradient(150deg, rgba(45,212,191,.15), rgba(56,189,248,.06));
  border:1px solid rgba(94,234,212,.22); color:var(--prh);
  transform:translateZ(34px); }
.feat h3{ font-size:17.5px; font-weight:700; margin-bottom:9px; letter-spacing:-0.01em; transform:translateZ(26px); }
.feat p{ font-size:14.5px; color:var(--txm); transform:translateZ(18px); }
.feat .sheen{ position:absolute; inset:0; border-radius:inherit; pointer-events:none; opacity:0; transition:opacity .5s var(--ease);
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%), rgba(94,234,212,.1), transparent 65%); }
.feat:hover .sheen{ opacity:1; }

/* ── PRICING ──────────────────────────────────────────────────── */
.price-grid{ display:grid; grid-template-columns:1fr 1fr; gap:26px; max-width:920px; margin-inline:auto; perspective:1400px; }
.price{ padding:40px 36px; display:flex; flex-direction:column; transform-style:preserve-3d; transition:transform .18s linear; will-change:transform; }
.price.settling{ transition:transform .9s var(--spring); }
.price-name{ font-size:13px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; color:var(--txm); }
.price-amt{ display:flex; align-items:baseline; gap:9px; margin:16px 0 6px; }
.price-amt b{ font-size:46px; font-weight:800; letter-spacing:-0.04em; line-height:1; }
.price-amt span{ color:var(--txf); font-size:14px; }
.price-note{ font-size:14px; color:var(--txm); margin-bottom:28px; min-height:42px; }
.price-note em{ color:var(--prh); font-style:normal; font-weight:600; }
.price ul{ list-style:none; display:flex; flex-direction:column; gap:13px; margin-bottom:32px; flex:1; }
.price li{ display:flex; gap:12px; font-size:14.5px; color:var(--txm); align-items:flex-start; }
.price li svg{ color:var(--pr); flex-shrink:0; margin-top:4px; }
.price-biz li svg{ color:var(--blue); }
.price-biz .price-name{ color:#93C5FD; }
.price-biz::before{ background:linear-gradient(var(--ga), rgba(96,165,250,.45), rgba(96,165,250,.08) 45%, rgba(94,234,212,.05) 75%, rgba(96,165,250,.2)); }
.price-foot{ text-align:center; margin-top:34px; color:var(--txf); font-size:14px; }
.price-foot strong{ color:var(--prh); font-weight:600; }

/* ── DOWNLOAD ─────────────────────────────────────────────────── */
.dl-grid{ display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center; }
.badges{ display:flex; gap:14px; flex-wrap:wrap; margin:30px 0 34px; }
.store{
  display:flex; align-items:center; gap:12px; padding:12px 22px 12px 16px; border-radius:15px;
  border:1px solid rgba(240,253,250,.14); background:rgba(10,26,31,.55);
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  transition:transform .5s var(--spring), border-color .4s, box-shadow .5s var(--ease);
  cursor:default;
}
.store:hover{ transform:translateY(-3px); border-color:rgba(94,234,212,.4); box-shadow:0 10px 30px rgba(45,212,191,.12); }
.store svg{ flex-shrink:0; }
.store .st{ display:flex; flex-direction:column; line-height:1.25; }
.store .st small{ font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--txf); font-weight:600; }
.store .st b{ font-size:16px; font-weight:700; letter-spacing:-0.01em; }
.email-cap{ display:flex; gap:10px; padding:8px; border-radius:18px; max-width:460px; }
.email-cap input{
  flex:1; min-width:0; background:transparent; border:none; outline:none; color:var(--tx);
  padding:10px 14px; font-size:15px; border-radius:var(--r-input);
}
.email-cap input::placeholder{ color:var(--txf); }
.email-cap .btn{ padding:13px 22px; font-size:14px; }
.email-msg{ font-size:13.5px; margin-top:12px; min-height:20px; transition:opacity .4s; }
.email-msg.ok{ color:var(--ok); } .email-msg.err{ color:var(--err); }

/* Phone mockup */
.phone-stage{ display:flex; justify-content:center; align-items:center; perspective:1200px; }
.phone-anim-wrap{
  animation:phoneIframeFloat 7s var(--ease) infinite alternate;
  transform-style:preserve-3d;
  /* shadow on wrapper but NOT filter (filter composites the iframe as a texture, blurring it) */
}
@keyframes phoneIframeFloat{
  from{ transform:rotateY(-7deg) rotateX(3deg) rotateZ(1deg) translateY(0); }
  to{ transform:rotateY(-4deg) rotateX(2deg) rotateZ(-.5deg) translateY(-14px); }
}
@media (prefers-reduced-motion:reduce){ .phone-anim-wrap{ animation:none; } }
.phone{
  width:min(300px,68vw); aspect-ratio:9/19; border-radius:44px; position:relative;
  background:linear-gradient(165deg, #0E2228, #07151A);
  border:1px solid rgba(240,253,250,.14);
  box-shadow:
    inset 0 0 0 7px #04090C,
    inset 0 1px 0 8px rgba(240,253,250,.07),
    0 40px 90px rgba(1,6,10,.7),
    0 0 70px rgba(45,212,191,.1);
}
.phone::after{
  content:""; position:absolute; inset:7px; border-radius:37px; pointer-events:none; z-index:5;
  background:linear-gradient(115deg, rgba(240,253,250,.10) 0%, transparent 28%, transparent 70%, rgba(94,234,212,.05) 100%);
}
.phone-screen{ position:absolute; inset:7px; border-radius:37px; overflow:hidden; background:#041014; }
.phone-notch{ position:absolute; top:13px; left:50%; transform:translateX(-50%); width:88px; height:22px; border-radius:999px; background:#04090C; z-index:6; }
.app-frame{ position:absolute; inset:0; width:100%; height:100%; border:0; display:block; background:#030B11; color-scheme:dark; }
@media (max-width:860px){ .phone{ width:min(270px,80vw); } }
@media (max-width:860px){
  .app-frame{ height:600px; }
}
.phone{
  width:min(290px, 70vw); aspect-ratio:9/19; border-radius:44px; position:relative;
  background:linear-gradient(165deg, #0E2228, #07151A);
  border:1px solid rgba(240,253,250,.14);
  box-shadow:
    inset 0 0 0 7px #04090C,
    inset 0 1px 0 8px rgba(240,253,250,.07),
    0 40px 90px rgba(1,6,10,.7),
    0 0 70px rgba(45,212,191,.1);
  transform:rotateY(-14deg) rotateX(7deg) rotateZ(2deg);
  animation:phoneFloat 7s var(--ease) infinite alternate;
}
@keyframes phoneFloat{
  from{ transform:rotateY(-14deg) rotateX(7deg) rotateZ(2deg) translateY(0); }
  to{ transform:rotateY(-9deg) rotateX(4deg) rotateZ(-1deg) translateY(-16px); }
}
.phone::after{ /* screen reflection */
  content:""; position:absolute; inset:7px; border-radius:37px; pointer-events:none; z-index:5;
  background:linear-gradient(115deg, rgba(240,253,250,.10) 0%, transparent 28%, transparent 70%, rgba(94,234,212,.05) 100%);
}
.phone-screen{ position:absolute; inset:7px; border-radius:37px; overflow:hidden; background:#041014; }
.phone-notch{ position:absolute; top:13px; left:50%; transform:translateX(-50%); width:88px; height:22px; border-radius:999px; background:#04090C; z-index:6; }
.pradar{ position:absolute; left:50%; top:43%; width:150%; aspect-ratio:1; transform:translate(-50%,-50%); }
.pradar .pring{ position:absolute; inset:0; border-radius:50%; border:1px solid rgba(45,212,191,.22); }
.pradar .pring:nth-child(2){ inset:16%; border-color:rgba(45,212,191,.3); }
.pradar .pring:nth-child(3){ inset:32%; border-color:rgba(45,212,191,.4); }
.pradar .pring:nth-child(4){ inset:48%; border-color:rgba(45,212,191,.5); }
.pradar .psweep{ position:absolute; inset:0; border-radius:50%;
  background:conic-gradient(from 0deg, rgba(45,212,191,.3), transparent 18%, transparent 100%);
  animation:psweep 5s linear infinite; }
@keyframes psweep{ to{ transform:rotate(360deg); } }
.pradar .pdot{ position:absolute; width:9px; height:9px; border-radius:50%; background:var(--prh); box-shadow:0 0 10px rgba(94,234,212,.9); }
.pradar .pdot::after{ content:""; position:absolute; inset:-6px; border-radius:50%; border:1px solid rgba(94,234,212,.4); animation:ping 3s var(--ease) infinite; }
.pradar .pme{ position:absolute; left:50%; top:50%; width:13px; height:13px; transform:translate(-50%,-50%); border-radius:50%;
  background:var(--grad); box-shadow:0 0 16px rgba(45,212,191,.9), 0 0 0 4px rgba(45,212,191,.18); }
.pcard{
  position:absolute; left:9%; right:9%; bottom:7%; padding:13px 14px; border-radius:15px;
  background:rgba(17,39,45,.78); border:1px solid rgba(94,234,212,.3);
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  box-shadow:0 12px 30px rgba(1,6,10,.5);
  animation:pcardFloat 7s var(--ease) infinite alternate;
}
@keyframes pcardFloat{ from{ transform:translateY(0);} to{ transform:translateY(-7px);} }
.pcard .prow{ display:flex; align-items:center; gap:10px; }
.pcard .pav{ width:32px; height:32px; border-radius:50%; background:var(--grad); flex-shrink:0;
  display:grid; place-items:center; font-size:12px; font-weight:800; color:#04211E; }
.pcard .pn{ font-size:12.5px; font-weight:700; line-height:1.3; }
.pcard .pd{ font-size:10.5px; color:var(--txm); line-height:1.3; }
.pcard .psc{ margin-left:auto; font-size:12px; font-weight:800; color:var(--prh); flex-shrink:0; }
.phone-statusbar{ position:absolute; top:16px; left:24px; right:24px; display:flex; justify-content:space-between; z-index:5;
  font-size:11px; font-weight:600; color:var(--txm); }

/* ── ABOUT ────────────────────────────────────────────────────── */
.about-card{ max-width:860px; margin-inline:auto; padding:clamp(34px,5vw,58px); }
.about-card p{ color:var(--txm); font-size:clamp(15px,1.5vw,17px); margin-bottom:18px; text-wrap:pretty; }
.about-card p strong{ color:var(--tx); font-weight:600; }
.stack-label{ font-size:12px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; color:var(--txf); margin:30px 0 14px; }
.pills{ display:flex; flex-wrap:wrap; gap:10px; }
.pill-t{ padding:8px 16px; border-radius:999px; font-size:13px; font-weight:600; color:var(--txm);
  border:1px solid rgba(240,253,250,.12); background:rgba(17,39,45,.4);
  display:inline-flex; align-items:center; gap:8px; }
.pill-t i{ width:6px; height:6px; border-radius:50%; background:var(--pr); display:inline-block; }
.about-contact{ margin-top:30px; font-size:14.5px; color:var(--txm); }
.about-contact a{ color:var(--prh); font-weight:600; border-bottom:1px solid rgba(94,234,212,.35); transition:border-color .3s; }
.about-contact a:hover{ border-color:var(--prh); }

/* ── FOOTER ───────────────────────────────────────────────────── */
footer{ padding:0 0 36px; }
.foot-card{ padding:clamp(36px,5vw,56px) clamp(28px,4vw,56px) 30px; }
.foot-grid{ display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:36px; margin-bottom:44px; }
.foot-brand p{ color:var(--txm); font-size:14px; max-width:280px; margin-top:14px; }
.foot-col h5{ font-size:12px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; color:var(--txf); margin-bottom:16px; }
.foot-col a{ display:block; padding:6px 0; font-size:14px; color:var(--txm); transition:color .3s; }
.foot-col a:hover{ color:var(--prh); }
.foot-bottom{ display:flex; justify-content:space-between; align-items:center; gap:20px; flex-wrap:wrap;
  padding-top:26px; border-top:1px solid rgba(240,253,250,.08); }
.foot-bottom small{ color:var(--txf); font-size:13px; }
.trust{ display:flex; gap:10px; flex-wrap:wrap; }
.trust span{ display:inline-flex; align-items:center; gap:7px; font-size:12px; font-weight:600; color:var(--txm);
  padding:7px 14px; border-radius:999px; border:1px solid rgba(240,253,250,.1); background:rgba(17,39,45,.4); }
.trust svg{ color:var(--pr); }

/* ── Responsive ───────────────────────────────────────────────── */
@media (max-width:1020px){
  .nav{ display:none; }
  .burger{ display:block; }
  .header-cta{ display:none; }
  .steps, .feat-grid, .mx-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:860px){
  .hero{ padding-top:calc(var(--header-h) + 44px); }
  .hero::before{ background:linear-gradient(180deg, rgba(3,11,17,.92) 0%, rgba(3,11,17,.72) 46%, rgba(3,11,17,.28) 72%, transparent 90%); }
  .hero-copy{ max-width:100%; text-align:center; }
  .hero-sub{ margin-inline:auto; }
  .hero-ctas, .hero-meta{ justify-content:center; }
  .hero-sub{ margin-inline:auto; }
  .hero-ctas, .hero-meta{ justify-content:center; }
  .who-grid, .price-grid, .dl-grid{ grid-template-columns:1fr; }
  .dl-grid{ gap:70px; }
  .phone-stage{ order:2; }
  .match-grid{ grid-template-columns:1fr; gap:14px; justify-items:center; }
  .match-grid .mcard{ width:100%; }
  .match-wire{ display:none; }
  .score-badge{ margin:4px 0; }
  .match-stage.matched .mcard-need{ transform:translateY(8px); }
  .match-stage.matched .mcard-offer{ transform:translateY(-8px); }
  .foot-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:620px){
  .steps, .feat-grid, .mx-grid{ grid-template-columns:1fr; }
  .wrap{ width:calc(100% - 36px); }
  .email-cap{ flex-direction:column; }
  .email-cap .btn{ width:100%; }
  .lang-btn .lname-cur{ display:none; }
}

/* ── Reduced motion: calm static fallback ─────────────────────── */
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *, *::before, *::after{ animation-duration:.001s !important; animation-iteration-count:1 !important; transition-duration:.001s !important; }
  [data-reveal]{ opacity:1; transform:none; filter:none; }
  .bloom{ animation:none; }
  .phone{ animation:none; }
}


/* ═══════════════════════ UNITY SYSTEM ═══════════════════════════ */

/* Subtle dot-grid texture across all content — ties sections together */
main{
  background-image:radial-gradient(circle, rgba(45,212,191,.055) 1px, transparent 1px);
  background-size:28px 28px;
  background-attachment:fixed;
}

/* ── Ghost section numbers ──────────────────────────────────────── */
section[data-n]{ overflow:hidden; }
section[data-n]::before{
  content:attr(data-n);
  position:absolute;
  right:-0.02em; bottom:-0.08em;
  font-size:clamp(160px,24vw,340px);
  font-weight:900; letter-spacing:-0.06em; line-height:.85;
  color:transparent;
  -webkit-text-stroke:1px rgba(94,234,212,.052);
  text-stroke:1px rgba(94,234,212,.052);
  pointer-events:none; user-select:none;
  z-index:0;
  font-family:'Inter',sans-serif;
}
section[data-n] > .wrap{
  position:relative;
  z-index:2;
}

/* ── Alternating zone tints — even/odd of main's children ───────── */
section[data-n]:nth-child(2n){
  background:linear-gradient(180deg,
    transparent 0%,
    rgba(10,26,31,.22) 10%,
    rgba(10,26,31,.22) 90%,
    transparent 100%);
}
section[data-n]:nth-child(2n+1){
  background:linear-gradient(180deg,
    transparent 0%,
    rgba(5,14,18,.08) 10%,
    rgba(5,14,18,.08) 90%,
    transparent 100%);
}

/* ── Section top hairlines removed — seamless, flowing transitions ── */
section[data-n]::after{ display:none; }

/* ── Kicker: section number prefix ─────────────────────────────── */
.kicker-n{
  font-size:10.5px; font-weight:800;
  color:var(--pr); opacity:.6;
  letter-spacing:.04em; margin-right:1px;
  font-variant-numeric:tabular-nums;
}

/* ── Tighter kicker → title connection ─────────────────────────── */
.kicker{ margin-bottom:10px; }

/* ── Left accent on non-centered section heads ──────────────────── */
.sec-head:not(.center){
  position:relative;
  padding-left:18px;
}
.sec-head:not(.center)::before{
  content:"";
  position:absolute; left:0; top:0; bottom:0;
  width:2px; border-radius:2px;
  background:linear-gradient(to bottom,
    rgba(45,212,191,.6) 0%,
    rgba(45,212,191,.18) 65%,
    transparent 100%);
}

/* Download section head (not in .sec-head wrapper) */
.dl-grid > [data-reveal]:first-child{
  position:relative;
  padding-left:18px;
}
.dl-grid > [data-reveal]:first-child::before{
  content:"";
  position:absolute; left:0; top:0; bottom:0;
  width:2px; border-radius:2px;
  background:linear-gradient(to bottom,
    rgba(45,212,191,.6) 0%,
    rgba(45,212,191,.18) 65%,
    transparent 100%);
}

/* ── Tighter internal text spacing ─────────────────────────────── */
.sec-sub{ margin-top:12px; }
.step h3{ margin-bottom:7px; }
.feat h3{ margin-bottom:7px; }
.mx h4{ margin-bottom:6px; }
.feat p, .step p, .mx p{ line-height:1.55; }

/* ── Slightly tighter section padding for better scroll flow ────── */
section{ padding:clamp(68px,9vh,118px) 0; }

/* ── Reduced motion: hide ghost numbers ─────────────────────────── */
@media(prefers-reduced-motion:reduce){
  section[data-n]::before{ display:none; }
  main{ background-image:none; }
}


/* ═══════════════════════ V3 — IMMERSIVE SCROLL ═══════════════════════ */

/* ── Fixed radar background ─────────────────────────────────────── */
#radar-bg{
  position:fixed; inset:0; z-index:2;
  pointer-events:none;
  will-change:opacity,filter;
}
#radar-bg canvas{
  position:absolute; inset:0;
  width:100% !important; height:100% !important;
}
#radar-bg .stage-glow{
  position:absolute; left:65%; top:48%;
  width:55%; aspect-ratio:1;
  transform:translate(-50%,-50%);
  background:radial-gradient(circle,rgba(45,212,191,.13),transparent 62%);
  filter:blur(28px); pointer-events:none;
  animation:breathe 6s var(--ease) infinite alternate;
}

/* ── Z-index: content must sit above fixed radar ─────────────────── */
main,header.site-header,footer{ z-index:3; }
/* Antetul trebuie sa fie DEASUPRA continutului paginii, altfel meniul de limba
   (prins in contextul de stivuire creat de backdrop-filter pe .header-bar)
   se deseneaza in spatele .hero > .wrap, care e tot pe z-index 3. */
header.site-header{ z-index:60; }

/* ── Hero: radar is now the fixed bg, hero-stage not needed ──────── */
.hero-stage{ display:none; }
.hero::after{
  background:linear-gradient(to bottom,
    transparent 0%,
    rgba(3,11,17,.06) 16%,
    rgba(3,11,17,.18) 34%,
    rgba(3,11,17,.42) 54%,
    rgba(3,11,17,.70) 72%,
    rgba(3,11,17,.90) 88%,
    var(--bg) 100%);
  height:clamp(360px,56vh,640px);
}

/* ── Stronger glass for legibility over ambient radar ────────────── */
.glass{
  background:linear-gradient(165deg,
    rgba(17,39,45,.84) 0%,
    rgba(10,26,31,.76) 60%,
    rgba(10,26,31,.80) 100%);
}

/* ── Sections: transparent — radar shows through gaps ───────────── */
section[data-n]:nth-child(2n),
section[data-n]:nth-child(2n+1){ background:transparent; }

/* Download: let 3D phone overflow without clipping ──────────────── */
#download{ overflow:visible; }

/* ── Zig-zag entrance animations ────────────────────────────────── */
.anim-ready .enter-left  [data-reveal]:not(.in){ transform:translateX(-32px) translateY(14px); }
.anim-ready .enter-right [data-reveal]:not(.in){ transform:translateX( 32px) translateY(14px); }

/* ── Kicker: number via data-n-k attribute (i18n-safe) ───────────── */
.kicker[data-n-k]::before{
  content:attr(data-n-k);
  width:auto; height:auto; background:none; opacity:.6;
  font-size:10.5px; font-weight:800; letter-spacing:.04em;
  font-variant-numeric:tabular-nums;
}
/* Hide legacy kicker-n spans in v3 so number doesn't appear twice */
.kicker[data-n-k] .kicker-n{ display:none; }

/* ── Progress dots (fixed chapter indicator) ─────────────────────── */
.progress-dots{
  position:fixed; right:18px; top:50%;
  transform:translateY(-50%);
  z-index:60;
  display:flex; flex-direction:column; gap:11px;
  pointer-events:auto;
}
.progress-dots a{
  display:block; width:7px; height:7px; border-radius:50%;
  background:rgba(94,234,212,.18);
  border:1px solid rgba(94,234,212,.32);
  transition:background .4s var(--ease), transform .4s var(--spring), box-shadow .4s var(--ease);
  cursor:pointer;
}
.progress-dots a:hover{ background:rgba(94,234,212,.38); }
.progress-dots a.active{
  background:var(--pr);
  transform:scale(1.5);
  box-shadow:0 0 7px rgba(45,212,191,.5);
}
@media(max-width:860px){ .progress-dots{ display:none; } }

/* ── Bento features grid ─────────────────────────────────────────── */
.feat-grid{
  grid-template-columns:repeat(12,1fr);
  grid-auto-rows:minmax(155px,auto);
  gap:18px;
}
.feat:nth-child(1){ grid-column:1/7; }   /* Real-time radar: wide */
.feat:nth-child(2){ grid-column:7/10; }  /* Matching */
.feat:nth-child(3){ grid-column:10/13; } /* Scanning */
.feat:nth-child(4){ grid-column:1/5; }   /* Privacy */
.feat:nth-child(5){ grid-column:5/9; }   /* Pricing */
.feat:nth-child(6){ grid-column:9/13; }  /* Jobs */

@media(max-width:1020px){
  .feat-grid{ grid-template-columns:repeat(6,1fr); }
  .feat:nth-child(1){ grid-column:1/4; }
  .feat:nth-child(2){ grid-column:4/7; }
  .feat:nth-child(3){ grid-column:1/3; }
  .feat:nth-child(4){ grid-column:3/5; }
  .feat:nth-child(5){ grid-column:5/7; }
  .feat:nth-child(6){ grid-column:1/7; }
}
@media(max-width:620px){
  .feat-grid{ grid-template-columns:1fr; }
  .feat:nth-child(n){ grid-column:auto !important; }
}

/* ── Domain marquee (replaces static chips) ──────────────────────── */
.domains{ display:none; }
.domains-wrap{ text-align:center; }
.domains-wrap .dlabel{ display:block; margin-bottom:20px; }
.domain-marquee{
  overflow:hidden; position:relative;
  width:100vw;
  margin-left:calc(-50vw + 50%);
  padding:8px 0;
}
.domain-marquee::before,.domain-marquee::after{
  content:""; position:absolute; top:0; bottom:0; width:100px;
  z-index:2; pointer-events:none;
}
.domain-marquee::before{ left:0;  background:linear-gradient(to right,rgba(3,11,17,.95),transparent); }
.domain-marquee::after { right:0; background:linear-gradient(to left, rgba(3,11,17,.95),transparent); }
.domain-track{
  display:flex; gap:12px;
  width:max-content;
  animation:marqueeScroll 34s linear infinite;
}
@keyframes marqueeScroll{
  from{ transform:translateX(0); }
  to  { transform:translateX(-50%); }
}

/* ── Scroll-scrubbed match wire ──────────────────────────────────── */
/* Disable CSS keyframe animations — JS drives everything */
.match-wire .wire-base{ animation:none !important; transition:none !important; }
.match-wire .wire-pulse{ animation:none !important; opacity:0; }
.anim-ready .match-stage.matched .match-wire .wire-base{ animation:none !important; }
.anim-ready .match-stage.matched .match-wire .wire-pulse{ animation:none !important; opacity:0 !important; }
/* Pulse activates when JS adds .wire-pulsing */
.match-stage.wire-pulsing .match-wire .wire-pulse{
  animation:wireFlow 2.4s linear infinite !important;
  opacity:1 !important;
  stroke-dasharray:20 600;
}
/* Score badge and cards: JS-controlled, no CSS transitions */
.match-stage .score-badge{ transition:none !important; }
.anim-ready .match-stage.matched .score-badge{ transition:none !important; }
.match-stage .mcard-need,
.match-stage .mcard-offer{ transition:none !important; }

/* ── Reduced motion: v3 additions ────────────────────────────────── */
@media(prefers-reduced-motion:reduce){
  .domain-track{ animation:none; }
  .anim-ready .enter-left  [data-reveal]:not(.in),
  .anim-ready .enter-right [data-reveal]:not(.in){ transform:translateY(30px); }
  #radar-bg{ opacity:0.08 !important; filter:blur(3px) !important; }
}
