/* ============================================================
   EthosUI — Radium Blue design system
   Font: Hanken Grotesk · Theme: luminous cobalt + electric cyan
   ============================================================ */

:root{
  /* ---- radium blue surfaces ---- */
  --bg:        #050a24;          /* deep radium navy */
  --bg-2:      #070e2e;
  --bg-3:      #0a1338;
  --surface:   rgba(20,38,92,0.45);
  --surface-2: rgba(28,50,116,0.55);
  --glass:     rgba(12,22,58,0.55);
  --line:      rgba(120,165,255,0.16);
  --line-soft: rgba(120,165,255,0.09);

  /* ---- ink ---- */
  --ink:    #eaf1ff;
  --ink-2:  #c2d0f5;
  --muted:  #8a9bd1;
  --faint:  #5d6ea6;

  /* ---- signal accents ---- */
  --radium:     #36e3ff;         /* electric radium cyan — primary glow */
  --radium-2:   #2f9bff;         /* azure */
  --violet:     #8b7bff;         /* secondary glow */
  --alert:      #ff5d77;         /* coral — detected / risk */
  --alert-2:    #ff8a5b;
  --pass:       #4cf2c3;         /* mint — compliant / pass */

  --grad: linear-gradient(115deg, var(--radium) 0%, var(--radium-2) 45%, var(--violet) 100%);
  --grad-soft: linear-gradient(115deg, rgba(54,227,255,0.16), rgba(139,123,255,0.16));

  --maxw: 1280px;
  --pad: clamp(20px, 5vw, 60px);
  --r: 18px;
  --font: "Hanken Grotesk", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  --shadow: 0 30px 80px -30px rgba(0,0,0,0.7);
}

*{ margin:0; padding:0; box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  font-family:var(--font);
  background:var(--bg);
  color:var(--ink);
  font-size:17px;
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  position:relative;
}
a{ color:inherit; text-decoration:none; }
img,svg{ display:block; max-width:100%; }
button{ font-family:inherit; cursor:pointer; }
::selection{ background:var(--radium); color:#04122a; }
:focus-visible{ outline:2px solid var(--radium); outline-offset:3px; border-radius:6px; }

/* ============ animated radium aurora background ============ */
.aurora{ position:fixed; inset:-20vmax; z-index:-3; pointer-events:none; filter:blur(60px); opacity:0.9; }
.aurora span{ position:absolute; border-radius:50%; mix-blend-mode:screen; will-change:transform; }
.aurora .a1{ width:55vmax; height:55vmax; left:-10vmax; top:-12vmax; background:radial-gradient(circle, rgba(47,155,255,0.55), transparent 62%); animation:drift1 26s ease-in-out infinite; }
.aurora .a2{ width:50vmax; height:50vmax; right:-12vmax; top:2vmax; background:radial-gradient(circle, rgba(54,227,255,0.42), transparent 62%); animation:drift2 32s ease-in-out infinite; }
.aurora .a3{ width:46vmax; height:46vmax; left:30vmax; bottom:-18vmax; background:radial-gradient(circle, rgba(139,123,255,0.40), transparent 62%); animation:drift3 30s ease-in-out infinite; }
@keyframes drift1{ 0%,100%{ transform:translate(0,0) scale(1); } 50%{ transform:translate(8vmax,6vmax) scale(1.12); } }
@keyframes drift2{ 0%,100%{ transform:translate(0,0) scale(1.05); } 50%{ transform:translate(-7vmax,5vmax) scale(0.92); } }
@keyframes drift3{ 0%,100%{ transform:translate(0,0) scale(1); } 50%{ transform:translate(-5vmax,-7vmax) scale(1.15); } }
/* fine grid + vignette over the aurora */
.bg-grid{ position:fixed; inset:0; z-index:-2; pointer-events:none;
  background-image:linear-gradient(rgba(120,165,255,0.05) 1px,transparent 1px),linear-gradient(90deg,rgba(120,165,255,0.05) 1px,transparent 1px);
  background-size:54px 54px;
  -webkit-mask-image:radial-gradient(130% 100% at 50% 0%, #000 35%, transparent 85%);
          mask-image:radial-gradient(130% 100% at 50% 0%, #000 35%, transparent 85%); }
.bg-vignette{ position:fixed; inset:0; z-index:-1; pointer-events:none;
  background:radial-gradient(120% 80% at 50% -10%, transparent 50%, rgba(2,5,18,0.8) 100%); }
/* spotlight that follows cursor (set via JS --mx/--my) */
.spotlight{ position:fixed; inset:0; z-index:-1; pointer-events:none; opacity:0; transition:opacity .4s;
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,30%), rgba(54,227,255,0.10), transparent 60%); }
@media (pointer:fine){ .spotlight{ opacity:1; } }
@media (prefers-reduced-motion:reduce){ .aurora span{ animation:none; } }

/* ============ glow cursor ============ */
.cursor{ position:fixed; top:0; left:0; width:34px; height:34px; border:1.5px solid var(--radium); border-radius:50%;
  transform:translate(-50%,-50%); z-index:9999; pointer-events:none; mix-blend-mode:screen;
  transition:width .2s,height .2s,background .2s,opacity .2s; box-shadow:0 0 18px rgba(54,227,255,0.5); }
.cursor.dot{ width:8px; height:8px; background:var(--radium); }
.cursor.big{ width:64px; height:64px; background:rgba(54,227,255,0.10); }
@media (max-width:900px),(pointer:coarse){ .cursor{ display:none; } }

/* ============ scan progress bar (top) ============ */
.scanbar{ position:fixed; top:0; left:0; height:2px; width:0; z-index:120; background:var(--grad); box-shadow:0 0 12px var(--radium); }

/* ============ layout ============ */
.wrap{ max-width:var(--maxw); margin:0 auto; padding-inline:var(--pad); }
section{ position:relative; z-index:2; }
.sec{ padding-block:clamp(72px,11vw,140px); }

h1,h2,h3,h4{ font-weight:700; line-height:1.02; letter-spacing:-0.025em; }
.eyebrow{ font-size:12px; font-weight:600; letter-spacing:0.2em; text-transform:uppercase; color:var(--radium);
  display:inline-flex; align-items:center; gap:10px; }
.eyebrow::before{ content:""; width:7px; height:7px; border-radius:50%; background:var(--radium); box-shadow:0 0 0 0 var(--radium); animation:pulse 2.4s infinite; }
@keyframes pulse{ 0%{ box-shadow:0 0 0 0 rgba(54,227,255,0.5);} 70%{ box-shadow:0 0 0 10px rgba(54,227,255,0);} 100%{ box-shadow:0 0 0 0 rgba(54,227,255,0);} }
.mono{ font-feature-settings:"tnum"; font-size:12px; letter-spacing:0.14em; text-transform:uppercase; color:var(--muted); }
.grad-text{ background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; }

.sec-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:28px; margin-bottom:56px; flex-wrap:wrap; }
.sec-head h2{ font-size:clamp(32px,5vw,62px); letter-spacing:-0.03em; max-width:20ch; text-wrap:balance; margin-top:16px; }
.sec-head .idx{ font-size:12.5px; letter-spacing:0.12em; color:var(--faint); text-transform:uppercase; }

/* ============ buttons ============ */
.btn{ display:inline-flex; align-items:center; gap:10px; font-size:14px; font-weight:600; letter-spacing:0.02em;
  padding:15px 26px; border-radius:12px; border:1px solid transparent; transition:transform .2s, box-shadow .2s, background .2s, color .2s, border-color .2s; white-space:nowrap; }
.btn .arr{ transition:transform .2s; }
.btn:hover .arr{ transform:translateX(4px); }
.btn-primary{ background:var(--grad); color:#04122a; font-weight:700; box-shadow:0 12px 36px -10px rgba(54,227,255,0.6); }
.btn-primary:hover{ transform:translateY(-2px); box-shadow:0 18px 50px -10px rgba(54,227,255,0.75); }
.btn-ghost{ border-color:var(--line); color:var(--ink); background:rgba(255,255,255,0.02); }
.btn-ghost:hover{ border-color:var(--radium); color:var(--radium); box-shadow:0 0 30px -8px rgba(54,227,255,0.5); }
.btn-lg{ padding:17px 30px; font-size:15px; }

/* ============ nav ============ */
.nav{ position:fixed; inset:0 0 auto 0; z-index:100; transition:background .3s, border-color .3s, backdrop-filter .3s; border-bottom:1px solid transparent; }
.nav.scrolled{ background:rgba(5,10,36,0.72); backdrop-filter:blur(16px); border-color:var(--line-soft); }
.nav-inner{ max-width:var(--maxw); margin:0 auto; padding:15px var(--pad); display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand{ display:flex; align-items:center; gap:12px; font-weight:800; font-size:21px; letter-spacing:-0.02em; }
.brand .glyph{ width:34px; height:34px; flex:none; border-radius:9px; display:grid; place-items:center; position:relative;
  background:var(--grad); box-shadow:0 0 22px -4px rgba(54,227,255,0.7); }
.brand .glyph::before{ content:""; width:15px; height:15px; border:2px solid #04122a; border-radius:50%; }
.brand .glyph::after{ content:""; position:absolute; width:8px; height:2px; background:#04122a; transform:rotate(45deg) translate(8px,8px); border-radius:2px; }
.brand b{ color:var(--ink); } .brand i{ font-style:normal; color:var(--radium); }
.navlinks{ display:flex; gap:30px; }
.navlinks a{ font-size:13.5px; font-weight:500; color:var(--ink-2); transition:color .2s; }
.navlinks a:hover{ color:var(--radium); }
.nav-right{ display:flex; align-items:center; gap:14px; }
.nav-cta{ font-size:13px; font-weight:600; padding:11px 18px; border-radius:10px; border:1px solid var(--radium); color:var(--radium); transition:.2s; }
.nav-cta:hover{ background:var(--radium); color:#04122a; box-shadow:0 0 26px -6px rgba(54,227,255,0.7); }
.burger{ display:none; width:42px; height:42px; border:1px solid var(--line); border-radius:10px; background:var(--glass); position:relative; }
.burger span{ position:absolute; left:11px; right:11px; height:2px; background:var(--ink); transition:.25s; }
.burger span:nth-child(1){ top:15px; } .burger span:nth-child(2){ top:21px; } .burger span:nth-child(3){ top:27px; }
.burger.open span:nth-child(1){ transform:translateY(6px) rotate(45deg); }
.burger.open span:nth-child(2){ opacity:0; }
.burger.open span:nth-child(3){ transform:translateY(-6px) rotate(-45deg); }
.mobile-menu{ position:fixed; inset:62px 0 auto 0; z-index:99; background:rgba(5,10,36,0.96); backdrop-filter:blur(18px);
  border-bottom:1px solid var(--line); padding:18px var(--pad) 28px; display:none; flex-direction:column; gap:6px; }
.mobile-menu.open{ display:flex; }
.mobile-menu a{ padding:13px 4px; font-size:17px; font-weight:600; border-bottom:1px solid var(--line-soft); }
@media (max-width:920px){ .navlinks,.nav-right .nav-cta{ display:none; } .burger{ display:block; } }

/* ============ hero ============ */
.hero{ padding-top:140px; padding-bottom:40px; }
.hero-trust{ display:flex; gap:12px; flex-wrap:wrap; margin-bottom:30px; }
.pill{ font-size:12px; letter-spacing:0.04em; color:var(--ink-2); border:1px solid var(--line); border-radius:100px; padding:8px 15px; display:inline-flex; gap:9px; align-items:center; background:var(--glass); }
.pill b{ color:var(--radium); font-weight:600; }
.hero-grid{ display:grid; grid-template-columns:1.15fr 0.85fr; gap:clamp(28px,4vw,56px); align-items:center; }
@media (max-width:1000px){ .hero-grid{ grid-template-columns:1fr; } }
.hero h1{ font-size:clamp(44px,7.4vw,104px); line-height:0.95; letter-spacing:-0.04em; text-wrap:balance; }
.hero h1 .risk{ position:relative; color:var(--alert); font-style:italic; white-space:nowrap; }
.hero h1 .risk::after{ content:""; position:absolute; left:-3%; right:-3%; bottom:0.07em; height:0.42em; z-index:-1; background:rgba(255,93,119,0.20); transform:skewX(-8deg); border-radius:3px; }
.hero-sub{ margin-top:26px; max-width:52ch; color:var(--ink-2); font-size:clamp(16px,1.5vw,20px); }
.hero-actions{ margin-top:34px; display:flex; gap:14px; flex-wrap:wrap; }
.hero-metrics{ margin-top:40px; display:flex; gap:30px; flex-wrap:wrap; }
.hmetric .n{ font-size:30px; font-weight:800; letter-spacing:-0.02em; }
.hmetric .l{ font-size:12px; letter-spacing:0.08em; text-transform:uppercase; color:var(--muted); }

/* ===== scanner card (hero right) ===== */
.card{ border:1px solid var(--line); border-radius:var(--r); background:var(--glass); backdrop-filter:blur(10px); box-shadow:var(--shadow); }
.scanner{ padding:22px clamp(18px,2.4vw,26px) 24px; position:relative; overflow:hidden; }
.scanner::before{ content:""; position:absolute; inset:0; background:radial-gradient(120% 60% at 50% -10%, rgba(54,227,255,0.10), transparent 60%); pointer-events:none; }
.card-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; }
.card-title{ font-size:12px; letter-spacing:0.14em; text-transform:uppercase; color:var(--muted); }
.live{ font-size:11px; letter-spacing:0.12em; text-transform:uppercase; color:var(--radium); display:flex; align-items:center; gap:8px; }
.live .blip{ width:7px; height:7px; border-radius:50%; background:var(--radium); animation:blink 1.1s steps(1) infinite; box-shadow:0 0 10px var(--radium); }
.live.alert{ color:var(--alert); } .live.alert .blip{ background:var(--alert); box-shadow:0 0 10px var(--alert); }
@keyframes blink{ 50%{ opacity:.25; } }
.scan-form{ display:flex; gap:9px; flex-wrap:wrap; }
.scan-form input{ flex:1; min-width:180px; background:rgba(3,8,26,0.7); border:1px solid var(--line); border-radius:11px; padding:14px 15px; color:var(--ink); font-family:inherit; font-size:14px; transition:border-color .2s, box-shadow .2s; }
.scan-form input:focus{ outline:none; border-color:var(--radium); box-shadow:0 0 0 3px rgba(54,227,255,0.15); }
.scan-form input::placeholder{ color:var(--faint); }
.scan-note{ font-size:11.5px; color:var(--faint); margin-top:10px; letter-spacing:0.02em; }

/* radar */
.radar-wrap{ margin-top:20px; display:grid; grid-template-columns:148px 1fr; gap:20px; align-items:center; }
@media (max-width:520px){ .radar-wrap{ grid-template-columns:1fr; justify-items:center; text-align:center; } }
.radar{ width:148px; height:148px; border-radius:50%; position:relative; flex:none;
  background:radial-gradient(circle, rgba(54,227,255,0.06), transparent 70%);
  border:1px solid var(--line); overflow:hidden; }
.radar .rings{ position:absolute; inset:0; }
.radar .rings i{ position:absolute; border:1px solid rgba(120,165,255,0.18); border-radius:50%; inset:50% auto auto 50%; transform:translate(-50%,-50%); }
.radar .rings i:nth-child(1){ width:33%; height:33%; } .radar .rings i:nth-child(2){ width:66%; height:66%; } .radar .rings i:nth-child(3){ width:99%; height:99%; }
.radar .cross{ position:absolute; inset:0; }
.radar .cross::before,.radar .cross::after{ content:""; position:absolute; background:rgba(120,165,255,0.14); }
.radar .cross::before{ left:50%; top:0; bottom:0; width:1px; } .radar .cross::after{ top:50%; left:0; right:0; height:1px; }
.radar .sweep{ position:absolute; inset:0; border-radius:50%; opacity:0;
  background:conic-gradient(from 0deg, rgba(54,227,255,0.45), rgba(54,227,255,0) 60deg); }
.radar.scanning .sweep{ opacity:1; animation:sweep 1.5s linear infinite; }
@keyframes sweep{ to{ transform:rotate(360deg); } }
.radar .blip2{ position:absolute; width:9px; height:9px; border-radius:50%; background:var(--alert); transform:translate(-50%,-50%) scale(0); box-shadow:0 0 12px var(--alert); }
.radar .blip2.show{ animation:ping .5s ease forwards; }
@keyframes ping{ 0%{ transform:translate(-50%,-50%) scale(0); } 60%{ transform:translate(-50%,-50%) scale(1.5); } 100%{ transform:translate(-50%,-50%) scale(1); } }
.radar .core{ position:absolute; inset:50% auto auto 50%; width:10px; height:10px; transform:translate(-50%,-50%); border-radius:50%; background:var(--radium); box-shadow:0 0 14px var(--radium); }

.radar-meta .rm-lab{ font-size:11px; letter-spacing:0.14em; text-transform:uppercase; color:var(--muted); }
.radar-meta .rm-score{ font-size:46px; font-weight:800; letter-spacing:-0.03em; line-height:1; margin:6px 0 2px; }
.radar-meta .rm-score small{ font-size:18px; color:var(--muted); font-weight:600; }
.radar-meta .rm-verdict{ font-size:15px; font-weight:700; }
.radar-meta p{ font-size:12.5px; color:var(--faint); margin-top:4px; }

.scan-feed{ margin-top:16px; border-top:1px solid var(--line-soft); padding-top:12px; min-height:90px; }
.feed-line{ display:flex; align-items:center; gap:10px; padding:6px 0; font-size:12.5px; opacity:0; transform:translateY(6px); transition:.4s; }
.feed-line.show{ opacity:1; transform:none; }
.feed-line .tag{ font-size:9.5px; letter-spacing:0.1em; padding:3px 7px; border-radius:5px; flex:none; font-weight:600; }
.tag.det{ color:var(--alert); border:1px solid rgba(255,93,119,0.4); background:rgba(255,93,119,0.08); }
.tag.ok{ color:var(--pass); border:1px solid rgba(76,242,195,0.4); background:rgba(76,242,195,0.08); }
.feed-line .nm{ color:var(--ink-2); } .feed-line .ms{ margin-left:auto; color:var(--faint); font-size:11px; }

/* ============ marquee ============ */
.marquee{ border-block:1px solid var(--line); margin-top:64px; overflow:hidden; background:rgba(7,14,46,0.5); }
.marquee-track{ display:flex; gap:46px; padding:16px 0; white-space:nowrap; width:max-content; animation:scrollx 30s linear infinite; }
.marquee:hover .marquee-track{ animation-play-state:paused; }
@keyframes scrollx{ to{ transform:translateX(-50%); } }
.marquee-track span{ font-size:13px; letter-spacing:0.16em; text-transform:uppercase; color:var(--muted); display:inline-flex; align-items:center; gap:46px; }
.marquee-track span::after{ content:"◆"; color:var(--radium); font-size:8px; opacity:.7; }

/* ============ reveal ============ */
.reveal{ opacity:0; transform:translateY(26px); transition:opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1); }
.reveal.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){ .reveal{ opacity:1; transform:none; } }

/* ============ bento / cards ============ */
.bento{ display:grid; grid-template-columns:repeat(12,1fr); gap:18px; }
.bcard{ border:1px solid var(--line); border-radius:var(--r); background:var(--glass); backdrop-filter:blur(8px); padding:26px; position:relative; overflow:hidden; transition:border-color .3s, transform .3s; }
.bcard:hover{ border-color:rgba(54,227,255,0.4); transform:translateY(-3px); }
.bcard::after{ content:""; position:absolute; inset:0; opacity:0; transition:opacity .3s; pointer-events:none;
  background:radial-gradient(300px circle at var(--cx,50%) var(--cy,0%), rgba(54,227,255,0.10), transparent 60%); }
.bcard:hover::after{ opacity:1; }
.col-12{ grid-column:span 12; } .col-8{ grid-column:span 8; } .col-6{ grid-column:span 6; } .col-5{ grid-column:span 5; } .col-4{ grid-column:span 4; } .col-7{ grid-column:span 7; }
@media (max-width:900px){ .col-8,.col-6,.col-5,.col-4,.col-7{ grid-column:span 12; } }
.bcard h3{ font-size:22px; margin-bottom:8px; } .bcard p{ color:var(--muted); font-size:14.5px; }
.bcard .kfn{ font-size:11.5px; letter-spacing:0.14em; text-transform:uppercase; color:var(--radium); margin-bottom:14px; display:block; }

/* ============ patterns grid ============ */
.pat-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:14px; }
.pat{ border:1px solid var(--line); border-radius:14px; background:var(--glass); padding:20px; transition:.3s; position:relative; overflow:hidden; }
.pat:hover{ border-color:var(--alert); transform:translateY(-3px); box-shadow:0 18px 40px -22px rgba(255,93,119,0.5); }
.pat .pn{ font-size:11px; letter-spacing:0.12em; text-transform:uppercase; color:var(--faint); }
.pat svg{ width:26px; height:26px; stroke:var(--radium); fill:none; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; margin:12px 0; transition:stroke .3s; }
.pat:hover svg{ stroke:var(--alert); }
.pat h4{ font-size:16.5px; } .pat p{ font-size:13px; color:var(--muted); margin-top:6px; line-height:1.5; }

/* ============ layers (product) ============ */
.layers{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
@media (max-width:900px){ .layers{ grid-template-columns:1fr; } }
.layer{ border:1px solid var(--line); border-radius:var(--r); background:var(--glass); padding:28px; position:relative; }
.layer .lnum{ font-size:12px; letter-spacing:0.16em; color:var(--muted); display:flex; align-items:baseline; gap:8px; }
.layer .lnum b{ font-size:42px; font-weight:800; background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; letter-spacing:-0.03em; }
.layer h3{ font-size:21px; margin:14px 0 8px; } .layer p{ color:var(--muted); font-size:14px; }
.layer .ld{ margin-top:16px; padding-top:16px; border-top:1px dashed var(--line); font-size:13px; color:var(--ink-2); line-height:1.9; }
.layer .ld b{ color:var(--radium); }

/* agent flow */
.agents{ margin-top:18px; border:1px solid var(--line); border-radius:var(--r); background:var(--glass); padding:30px; }
.bots{ display:grid; grid-template-columns:1fr auto 1fr auto 1fr; align-items:center; gap:16px; }
@media (max-width:820px){ .bots{ grid-template-columns:1fr; } .conduit{ transform:rotate(90deg); height:40px; } }
.bot{ text-align:center; }
.bot .ico{ width:64px; height:64px; margin:0 auto 12px; border-radius:16px; background:var(--grad-soft); border:1px solid var(--line); display:grid; place-items:center; box-shadow:0 0 30px -10px rgba(54,227,255,0.6); }
.bot .ico svg{ width:32px; height:32px; stroke:var(--radium); fill:none; stroke-width:1.7; }
.bot .bn{ font-size:18px; font-weight:700; } .bot .br{ font-size:12.5px; color:var(--muted); margin-top:4px; max-width:22ch; margin-inline:auto; }
.conduit{ height:2px; min-width:40px; background:linear-gradient(90deg,transparent,var(--radium),transparent); position:relative; }
.conduit::after{ content:""; position:absolute; top:50%; left:0; width:7px; height:7px; border-radius:50%; background:var(--radium); transform:translateY(-50%); box-shadow:0 0 10px var(--radium); animation:flow 1.8s linear infinite; }
@keyframes flow{ from{ left:0; } to{ left:100%; } }

/* ============ why / stats ============ */
.bigstat{ border:1px solid var(--line); border-radius:var(--r); background:var(--glass); padding:clamp(28px,5vw,52px); display:flex; gap:clamp(20px,4vw,50px); align-items:center; flex-wrap:wrap; margin-bottom:42px; }
.bigstat .big{ font-size:clamp(56px,11vw,120px); font-weight:800; letter-spacing:-0.04em; line-height:1; background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; }
.bigstat .cap{ font-size:clamp(16px,2vw,22px); color:var(--ink-2); max-width:30ch; }
.facts{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
@media (max-width:900px){ .facts{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .facts{ grid-template-columns:1fr; } }
.fact{ border:1px solid var(--line); border-radius:14px; padding:22px; background:var(--glass); }
.fact .fn{ font-size:11px; letter-spacing:0.14em; text-transform:uppercase; color:var(--radium); }
.fact h3{ font-size:18px; margin:10px 0 8px; } .fact p{ font-size:13.5px; color:var(--muted); }

/* ============ pricing ============ */
.price-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; align-items:stretch; }
@media (max-width:920px){ .price-grid{ grid-template-columns:1fr; max-width:460px; margin-inline:auto; } }
.plan{ border:1px solid var(--line); border-radius:var(--r); background:var(--glass); padding:28px; display:flex; flex-direction:column; position:relative; }
.plan.feat{ border-color:var(--radium); box-shadow:0 0 50px -16px rgba(54,227,255,0.6); background:linear-gradient(180deg, rgba(54,227,255,0.06), var(--glass)); }
.plan .badge{ position:absolute; top:-12px; left:28px; background:var(--grad); color:#04122a; font-size:11px; font-weight:700; letter-spacing:0.06em; padding:5px 12px; border-radius:100px; text-transform:uppercase; }
.plan .pname{ font-size:13px; letter-spacing:0.12em; text-transform:uppercase; color:var(--muted); }
.plan .pprice{ font-size:42px; font-weight:800; letter-spacing:-0.03em; margin:10px 0 2px; }
.plan .pprice .per{ font-size:14px; font-weight:500; color:var(--muted); letter-spacing:0; }
.plan .pdesc{ font-size:14px; color:var(--ink-2); margin-bottom:18px; }
.plan ul{ list-style:none; display:flex; flex-direction:column; gap:11px; margin-bottom:24px; flex:1; }
.plan li{ font-size:14px; color:var(--ink-2); padding-left:26px; position:relative; }
.plan li::before{ content:""; position:absolute; left:0; top:7px; width:14px; height:8px; border-left:2px solid var(--radium); border-bottom:2px solid var(--radium); transform:rotate(-45deg); }
.plan .btn{ width:100%; justify-content:center; }
.cancel-link{ font-size:12px; color:var(--faint); margin-top:12px; text-align:center; transition:color .2s; }
.cancel-link:hover{ color:var(--radium); }
.price-note{ margin-top:26px; font-size:14px; color:var(--muted); border:1px dashed var(--line); border-radius:14px; padding:18px 22px; }
.price-note b{ color:var(--ink); }

/* ============ about ============ */
.about{ display:grid; grid-template-columns:1.3fr 0.7fr; gap:clamp(24px,4vw,52px); }
@media (max-width:900px){ .about{ grid-template-columns:1fr; } }
.about-body p{ font-size:clamp(16px,1.8vw,21px); color:var(--ink-2); margin-bottom:18px; }
.about-body .mission{ color:var(--radium); font-weight:600; border-left:2px solid var(--radium); padding-left:18px; }
.reg{ border:1px solid var(--line); border-radius:var(--r); background:var(--glass); padding:24px; height:max-content; }
.reg .rh{ font-size:12px; letter-spacing:0.14em; text-transform:uppercase; color:var(--muted); margin-bottom:16px; }
.reg .row{ display:flex; justify-content:space-between; gap:14px; padding:9px 0; border-bottom:1px solid var(--line-soft); font-size:13.5px; }
.reg dt{ color:var(--muted); } .reg dd{ color:var(--ink); text-align:right; font-weight:500; }

/* ============ contact ============ */
.contact{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(20px,3vw,40px); }
@media (max-width:900px){ .contact{ grid-template-columns:1fr; } }
.ch-grid{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.chan{ border:1px solid var(--line); border-radius:13px; background:var(--glass); padding:16px 18px; transition:.25s; }
.chan:hover{ border-color:var(--radium); transform:translateY(-2px); }
.chan .ct{ font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--muted); }
.chan .ce{ font-size:14.5px; color:var(--ink); margin-top:4px; word-break:break-word; }
.chan.office{ grid-column:span 2; } .chan.office .ce{ font-size:13.5px; color:var(--ink-2); }
.cform{ border:1px solid var(--line); border-radius:var(--r); background:var(--glass); padding:28px; }
.cform h3{ font-size:22px; } .cform .sub{ font-size:13.5px; color:var(--muted); margin:6px 0 18px; }
.field{ margin-bottom:14px; } .field label{ font-size:12px; letter-spacing:0.06em; text-transform:uppercase; color:var(--muted); display:block; margin-bottom:6px; }
.field input,.field textarea{ width:100%; background:rgba(3,8,26,0.7); border:1px solid var(--line); border-radius:11px; padding:13px 15px; color:var(--ink); font-family:inherit; font-size:14.5px; transition:border-color .2s; }
.field input:focus,.field textarea:focus{ outline:none; border-color:var(--radium); }
.field textarea{ min-height:110px; resize:vertical; }

/* ============ footer ============ */
footer{ border-top:1px solid var(--line); background:rgba(5,10,36,0.6); position:relative; z-index:2; margin-top:40px; }
.foot-top{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:30px; padding:60px 0 40px; }
@media (max-width:820px){ .foot-top{ grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .foot-top{ grid-template-columns:1fr; } }
.foot-brand p{ font-size:14px; color:var(--muted); margin:14px 0; max-width:34ch; }
.foot-brand .cin{ font-size:12px; color:var(--faint); line-height:1.6; }
.foot-col h4{ font-size:12px; letter-spacing:0.12em; text-transform:uppercase; color:var(--muted); margin-bottom:14px; }
.foot-col a{ display:block; font-size:14px; color:var(--ink-2); padding:5px 0; transition:color .2s; }
.foot-col a:hover{ color:var(--radium); }
.foot-bottom{ display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; padding:22px 0; border-top:1px solid var(--line-soft); font-size:13px; color:var(--muted); }
.foot-legal{ font-size:11.5px; color:var(--faint); line-height:1.7; padding-bottom:30px; }

/* ============ legal pages ============ */
.legal-shell{ max-width:var(--maxw); margin:0 auto; padding:120px var(--pad) 80px; display:grid; grid-template-columns:240px 1fr; gap:clamp(28px,5vw,64px); }
@media (max-width:900px){ .legal-shell{ grid-template-columns:1fr; } }
.sidenav{ position:sticky; top:96px; height:max-content; border:1px solid var(--line); border-radius:var(--r); background:var(--glass); padding:18px; }
@media (max-width:900px){ .sidenav{ position:static; } }
.sidenav .sn-title{ font-size:11px; letter-spacing:0.16em; text-transform:uppercase; color:var(--muted); display:block; margin-bottom:12px; }
.sidenav a{ display:block; font-size:14px; color:var(--ink-2); padding:9px 12px; border-radius:9px; transition:.2s; }
.sidenav a:hover{ color:var(--ink); background:rgba(255,255,255,0.03); }
.sidenav a.active{ color:var(--radium); background:rgba(54,227,255,0.08); }
.legal-content{ max-width:78ch; }
.legal-content .a-eyebrow{ font-size:11px; letter-spacing:0.18em; text-transform:uppercase; color:var(--radium); }
.legal-content h1{ font-size:clamp(34px,6vw,56px); margin:12px 0 14px; letter-spacing:-0.03em; }
.legal-content .a-meta{ font-size:13px; color:var(--muted); margin-bottom:20px; }
.legal-content .a-company{ border:1px solid var(--line); border-radius:12px; background:var(--glass); padding:16px 18px; font-size:13.5px; color:var(--ink-2); line-height:1.7; margin-bottom:30px; }
.legal-content h2{ font-size:22px; margin:34px 0 10px; display:flex; gap:12px; align-items:baseline; letter-spacing:-0.02em; }
.legal-content h2 .n{ color:var(--radium); font-size:16px; font-weight:700; }
.legal-content p,.legal-content li{ color:var(--ink-2); font-size:15.5px; }
.legal-content p{ margin-bottom:12px; }
.legal-content ul,.legal-content ol{ margin:0 0 14px 22px; display:flex; flex-direction:column; gap:8px; }
.legal-content a.mail{ color:var(--radium); border-bottom:1px solid rgba(54,227,255,0.4); }
.legal-content .note{ border:1px solid var(--radium); background:rgba(54,227,255,0.07); border-radius:12px; padding:14px 18px; color:var(--ink); margin:14px 0; }
.legal-content strong{ color:var(--ink); }
.legal-nav{ display:flex; gap:10px; flex-wrap:wrap; margin-top:48px; padding-top:24px; border-top:1px solid var(--line); }
.legal-nav a{ font-size:13px; color:var(--ink-2); border:1px solid var(--line); border-radius:100px; padding:8px 15px; transition:.2s; }
.legal-nav a:hover{ border-color:var(--radium); color:var(--radium); }

/* utilities */
.center{ text-align:center; } .mt-0{ margin-top:0; }