/* ============================================================
   DAEP — Landing Page
   Dark engineering aesthetic · electric blue accent
   Saira Condensed (display) + JetBrains Mono (technical)
   ============================================================ */

:root{
  /* surfaces */
  --bg:#000000;
  --bg-2:#070709;
  --surface:#121214;
  --surface-2:#161618;
  --surface-3:#1C1C20;
  --line:rgba(255,255,255,.08);
  --line-2:rgba(255,255,255,.14);

  /* text */
  --text:#F7F9FF;
  --muted:#9AA6BB;
  --faint:#5C6678;

  /* accents */
  --primary:#FFA800;
  --primary-2:#FFBE3D;
  --primary-soft:rgba(255,168,0,.12);
  --primary-line:rgba(255,168,0,.34);
  --glow:transparent;
  --btn-fg:#FFFFFF;

  /* status */
  --live:#1ED184;
  --warn:#FFB020;
  --bad:#FF4D5F;

  /* type scale */
  --f0:12px; --f1:14px; --f2:16px; --f3:19px; --f4:25px;
  --f5:34px; --f6:46px; --f7:58px;

  /* spacing (fibonacci-ish) */
  --s1:8px; --s2:13px; --s3:21px; --s4:34px; --s5:52px; --s6:74px;

  --maxw:1200px;
  --nav-h:64px;

  /* tweakable levers */
  --font-display:'Google Sans',-apple-system,BlinkMacSystemFont,sans-serif;
  --r-card:18px;   /* shape language — card radius */
  --r-pill:12px;   /* shape language — pill/button radius (soft, not fully round) */
  --atmos-grid:.35;     /* backdrop grid opacity */
  --atmos-glow:1;      /* radial halo multiplier */
}

/* headline character — driven by --font-display */
.brand,.hero h1,.h-sec,.def .lead,.card h3,.mod h4,.brand-card h3,
.road .pt h4,.contact-left h2,.form-success h3,.proof .chip b,
.gauge .val b,.core-node b,.ai-core b,.bm .card h3,.layer-row b{
  font-family:var(--font-display);
}

*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;scroll-padding-top:96px;}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}
body{
  background:var(--bg);
  color:var(--text);
  font-family:'Google Sans',-apple-system,BlinkMacSystemFont,sans-serif;
  -webkit-font-smoothing:antialiased;
  line-height:1.5;
  overflow-x:hidden;
}
.mono{font-family:'JetBrains Mono',ui-monospace,monospace;}
a{color:inherit;text-decoration:none;}
img{display:block;max-width:100%;}

/* circuit/grid backdrop */
/* subtle neutral backdrop — no glows */
body::before{
  content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;opacity:var(--atmos-glow);
  background:radial-gradient(1100px 700px at 70% -10%,rgba(255,255,255,.025),transparent 60%);
}
body::after{
  content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;opacity:var(--atmos-grid);
  background-image:
    linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:64px 64px;
  -webkit-mask-image:radial-gradient(circle at 50% 30%,#000,transparent 78%);
          mask-image:radial-gradient(circle at 50% 30%,#000,transparent 78%);
}

/* ---------- layout ---------- */
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px;}
section{position:relative;}
.band{padding:var(--s6) 0;}
/* divider between "What is DAEP" and the "One core, three moves" section */
#overview{border-top:1px solid var(--line);}
.band-tight{padding:var(--s5) 0;}

/* eyebrow / titles */
.eyebrow{
  display:inline-flex;align-items:center;gap:9px;
  font-family:'JetBrains Mono';font-size:var(--f0);font-weight:500;
  letter-spacing:.22em;text-transform:uppercase;color:var(--primary-2);
}
.eyebrow .dot{width:6px;height:6px;border-radius:50%;background:var(--primary);}
.h-sec{
  font-weight:700;font-size:clamp(30px,4.4vw,var(--f5));
  line-height:1.04;letter-spacing:-.022em;margin-top:16px;text-wrap:balance;
}
.h-sec em{color:var(--primary-2);font-style:normal;}
.sub-sec{color:var(--muted);font-size:var(--f3);line-height:1.55;max-width:680px;margin-top:18px;text-wrap:pretty;}
.sec-head{margin-bottom:var(--s5);}

/* ---------- navbar (transparent at top → floating pill toolbar on scroll) ---------- */
.nav{
  position:fixed;top:0;left:50%;transform:translateX(-50%);z-index:100;
  width:100%;
  display:flex;align-items:center;justify-content:space-between;gap:18px;
  height:76px;
  padding-inline:max(24px,calc((100% - var(--maxw))/2 + 24px));
  background:transparent;border:1px solid transparent;border-radius:0;
  transition:background .35s,border-color .35s,box-shadow .35s,backdrop-filter .35s,border-radius .35s,padding .35s,height .35s,width .35s,top .35s;
}
.nav.scrolled{
  top:14px;width:auto;max-width:calc(100% - 28px);height:66px;
  gap:26px;padding:10px 12px 10px 26px;
  border-radius:18px;border-color:rgba(255,255,255,.06);
  background:rgba(12,13,18,.5);backdrop-filter:blur(40px) saturate(180%);-webkit-backdrop-filter:blur(40px) saturate(180%);
  box-shadow:0 14px 40px rgba(0,0,0,.45);
}
.nav.scrolled .nav-links{position:static;transform:none;left:auto;top:auto;}
.brand{display:flex;align-items:center;gap:11px;font-family:var(--font-display);font-weight:800;font-size:22px;letter-spacing:-.01em;z-index:2;}
.brand-logo{height:30px;width:auto;flex:none;display:block;}
.nav .brand{flex:1 1 0;min-width:0;}
.nav .brand-logo{width:101px;}
.footer .brand-logo{height:20px;}
.brand .mk{
  width:28px;height:28px;border-radius:8px;flex:none;
  background:var(--primary);
  display:flex;align-items:center;justify-content:center;position:relative;
}
.brand .mk::after{content:"";position:absolute;width:9px;height:9px;background:#fff;border-radius:2px;transform:rotate(45deg);}
.brand .wm{line-height:1;}
.nav-links{
  display:flex;align-items:center;gap:6px;
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:3;
}
.nav-links a{
  display:inline-flex;align-items:center;gap:7px;
  font-size:17px;color:var(--muted);padding:9px 15px;border-radius:9px;
  transition:color .2s,background .2s,transform .25s cubic-bezier(.2,.7,.2,1);white-space:nowrap;
}
.nav-links a i{font-size:16px;}
.nav-links a:hover{color:var(--text);background:rgba(255,255,255,.05);}
.nav-links a.active{color:var(--text);transform:scale(1.09);}
.nav-links a.nav-demo-m{display:none;}
.nav-cta{display:flex;align-items:center;gap:8px;z-index:2;flex:1 1 0;justify-content:flex-end;}
.nav-toggle{display:none;background:none;border:none;color:var(--text);font-size:24px;cursor:pointer;padding:6px 10px;line-height:0;}
.theme-btn{flex:none;width:38px;height:38px;border-radius:11px;display:inline-flex;align-items:center;justify-content:center;
  background:transparent;border:1px solid var(--line-2);color:var(--text);font-size:16px;cursor:pointer;
  transition:background .2s,border-color .2s,color .2s,transform .2s;}
.theme-btn:hover{border-color:var(--primary-line);transform:translateY(-1px);}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-family:'Google Sans',-apple-system,sans-serif;font-weight:600;font-size:var(--f1);
  padding:9px 20px;border-radius:12px;cursor:pointer;border:1px solid transparent;
  transition:transform .15s,box-shadow .25s,background .25s,border-color .25s,filter .2s;white-space:nowrap;
}
.btn:active{transform:translateY(1px);}
.btn-primary{
  background:var(--primary);color:var(--btn-fg);
  border-color:rgba(255,255,255,.22);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35);
}
.btn-primary:hover{filter:brightness(1.06);transform:translateY(-1px);box-shadow:inset 0 1px 0 rgba(255,255,255,.4);}
.btn-ghost{background:rgba(255,255,255,.04);color:var(--text);border-color:var(--line-2);}
.btn-ghost:hover{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.25);}
.btn-light{background:#fff;color:#0A0A0C;}
.btn-light:hover{background:#eef1f6;}
.btn-lg{font-size:var(--f2);padding:11px 26px;}
.btn i{font-size:15px;}

/* ---------- hero (centered) ---------- */
.hero{
  position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:center;justify-content:flex-start;
  text-align:left;padding:120px 0 80px;overflow:hidden;
}
.hero-bg{position:absolute;inset:0;z-index:0;}
.hero-bg img{width:100%;height:100%;object-fit:cover;object-position:center bottom;}
.hero-bg video{
  width:100%;height:100%;object-fit:cover;object-position:center;display:block;
  transform:scale(.8) translateX(12%);transform-origin:center;will-change:transform;backface-visibility:hidden;
  /* fade the video into the page on the top & sides so there's no hard cut edge
     (theme-agnostic — reveals the real page bg, not a baked colour) */
  -webkit-mask:linear-gradient(90deg,transparent,#000 13%,#000 88%,transparent),
               linear-gradient(180deg,transparent,#000 13%,#000 86%,transparent);
  -webkit-mask-composite:source-in;
          mask:linear-gradient(90deg,transparent,#000 13%,#000 88%,transparent),
               linear-gradient(180deg,transparent,#000 13%,#000 86%,transparent);
          mask-composite:intersect;
}
.hero-bg::after{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(82% 78% at 60% 45%,transparent 30%,rgba(0,0,0,.5) 66%,#000 100%),
    linear-gradient(90deg,#000 0%,rgba(0,0,0,.5) 24%,transparent 54%),
    linear-gradient(0deg,#000 0%,rgba(0,0,0,.4) 10%,transparent 30%);
}
.hero .wrap{position:relative;z-index:2;width:100%;display:flex;justify-content:flex-start;}
.hero-inner{max-width:560px;margin:0;}
/* logo above the hero title — no chip/border, just a soft blur behind a dimmed logo */
.hero-badge{display:inline-flex;align-items:center;margin-bottom:24px;padding:6px 10px;border-radius:12px;
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);}
.hero-badge .brand-logo{height:46px;width:auto;display:block;opacity:.6;}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px;justify-content:flex-start;}
.hero-sub{margin-left:0;margin-right:0;}
.kicker{
  display:inline-flex;align-items:center;gap:10px;margin-bottom:22px;
  font-family:'JetBrains Mono';font-size:var(--f1);letter-spacing:.04em;color:var(--muted);
  border:1px solid var(--line-2);border-radius:var(--r-pill);padding:7px 16px 7px 12px;
  background:rgba(8,11,18,.5);
}
.kicker b{color:var(--primary-2);font-weight:500;}
.kicker .sq{width:7px;height:7px;border-radius:2px;background:var(--primary);}
.hero h1{
  font-weight:800;font-size:clamp(34px,5vw,56px);line-height:1.04;
  letter-spacing:-.03em;text-wrap:balance;color:var(--text);
}
.hero h1 em{
  font-style:normal;color:transparent;
  background:linear-gradient(120deg,var(--primary-2),var(--primary));-webkit-background-clip:text;background-clip:text;
}
.hero-sub{color:#c9cfdb;font-size:clamp(15px,1.6vw,18px);line-height:1.55;max-width:480px;margin-top:20px;text-wrap:pretty;}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:36px;}

/* proof chips under hero */
.proof{display:flex;flex-wrap:wrap;gap:12px;margin-top:46px;}
.proof .chip{
  display:flex;align-items:center;gap:11px;padding:13px 18px;border-radius:14px;
  border:1px solid var(--line);background:rgba(8,11,18,.55);backdrop-filter:blur(6px);
}
.proof .chip b{font-weight:700;font-size:var(--f4);line-height:1;letter-spacing:-.02em;}
.proof .chip span{font-size:var(--f1);color:var(--muted);line-height:1.2;display:block;}
.proof .chip .gd{width:8px;height:8px;border-radius:50%;flex:none;}
.gd.live{background:var(--live);}
.gd.prep{background:var(--warn);}

/* ---------- cards & grids ---------- */
.card{
  position:relative;border:1px solid var(--line);border-radius:var(--r-card);
  background:linear-gradient(180deg,var(--surface),var(--bg-2));
  padding:var(--s4);transition:transform .25s,border-color .25s,box-shadow .25s;
}
.card:hover{transform:translateY(-4px);border-color:var(--primary-line);box-shadow:0 12px 34px rgba(0,0,0,.4);}
.card .ico{
  width:46px;height:46px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  background:var(--primary-soft);border:1px solid var(--primary-line);color:var(--primary-2);
  font-size:22px;margin-bottom:18px;
}
.card h3{font-weight:600;font-size:var(--f3);letter-spacing:-.01em;margin-bottom:9px;}
.card p{color:var(--muted);font-size:var(--f2);line-height:1.55;text-wrap:pretty;}

.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}

/* why-now numbered card */
.why .num{font-family:'JetBrains Mono';font-size:var(--f1);color:var(--primary);letter-spacing:.1em;margin-bottom:14px;display:block;}

/* problem / solution */
.ps{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid var(--line);border-radius:20px;overflow:hidden;}
.ps .col{padding:var(--s5) var(--s4);}
.ps .col.prob{background:linear-gradient(180deg,rgba(255,77,95,.06),transparent);}
.ps .col.sol{background:linear-gradient(180deg,rgba(30,209,132,.06),transparent);border-left:1px solid var(--line);}
.ps .col h3{display:flex;align-items:center;gap:11px;font-size:var(--f3);font-weight:700;margin-bottom:var(--s3);}
.ps .col h3 .tag{font-family:'JetBrains Mono';font-size:11px;letter-spacing:.14em;padding:4px 10px;border-radius:20px;}
.ps .prob h3 .tag{color:var(--bad);border:1px solid rgba(255,77,95,.4);background:rgba(255,77,95,.08);}
.ps .sol h3 .tag{color:var(--live);border:1px solid rgba(30,209,132,.4);background:rgba(30,209,132,.08);}
.ps ul{list-style:none;display:flex;flex-direction:column;gap:14px;}
.ps li{display:flex;gap:12px;font-size:var(--f2);color:var(--muted);line-height:1.5;}
.ps li i{flex:none;font-size:17px;margin-top:2px;}
.ps .prob li i{color:var(--bad);}
.ps .sol li i{color:var(--live);}
.ps .sol li b{color:var(--text);font-weight:600;}

/* ---------- DAEP nedir (split) ---------- */
.def{display:grid;grid-template-columns:1.05fr .95fr;gap:var(--s5);align-items:center;}
.def .lead{font-weight:500;font-size:var(--f4);line-height:1.32;letter-spacing:-.01em;}
.def .lead em{color:var(--primary-2);font-style:normal;}
.def-panel{
  border:1px solid var(--line-2);border-radius:20px;padding:var(--s4);
  background:var(--surface);
}
.core-diagram{display:flex;flex-direction:column;align-items:center;gap:16px;}
.core-node{
  text-align:center;border-radius:16px;padding:18px 22px;width:100%;
  background:var(--primary);color:var(--btn-fg);
}
.core-node b{font-size:var(--f3);font-weight:700;display:block;}
.core-node span{font-family:'JetBrains Mono';font-size:11px;letter-spacing:.12em;color:inherit;opacity:.7;}
.core-ring{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;width:100%;}
.core-ring .svc{
  font-family:'JetBrains Mono';font-size:11px;text-align:center;padding:11px 6px;border-radius:10px;
  border:1px solid var(--line-2);background:var(--bg-2);color:var(--muted);
}

/* ---------- brand ecosystem (bento) ---------- */
.brands{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.brand-card{
  position:relative;border:1px solid var(--line);border-radius:var(--r-card);overflow:hidden;
  min-height:380px;display:flex;flex-direction:column;justify-content:flex-end;
  transition:transform .25s,border-color .25s,box-shadow .25s;
}
.brand-card:hover{transform:translateY(-5px);border-color:var(--primary-line);box-shadow:0 22px 60px rgba(0,0,0,.5);}
.brand-card .media{position:absolute;inset:0;z-index:0;}
.brand-card .media image-slot{width:100%;height:100%;}
.brand-card .media::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(4,6,11,.97) 8%,rgba(4,6,11,.55) 48%,rgba(4,6,11,.15) 100%);}
.brand-card .body{position:relative;z-index:1;padding:var(--s4);}
.brand-card .model{
  display:inline-flex;align-items:center;gap:8px;font-family:'JetBrains Mono';font-size:11px;
  letter-spacing:.14em;padding:5px 12px;border-radius:20px;margin-bottom:14px;
  border:1px solid var(--line-2);background:rgba(8,11,18,.7);
}
.brand-card h3{font-size:var(--f4);font-weight:700;letter-spacing:-.02em;}
.brand-card .dom{font-family:'JetBrains Mono';font-size:var(--f0);color:var(--primary-2);margin-top:6px;}
.brand-card p{color:var(--muted);font-size:var(--f2);line-height:1.5;margin-top:12px;}
.status{display:inline-flex;align-items:center;gap:8px;font-size:var(--f1);font-weight:600;margin-top:16px;}
.status .gd{width:9px;height:9px;border-radius:50%;}
.status.live{color:var(--live);} .status.prep{color:var(--warn);}

/* ---------- modules grid ---------- */
.modules{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.mod{
  border:1px solid var(--line);border-radius:var(--r-card);padding:var(--s3);background:var(--surface);
  transition:transform .2s,border-color .2s,background .2s;
}
.mod:hover{transform:translateY(-3px);border-color:var(--primary-line);background:var(--surface-2);}
.mod .top{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;}
.mod .num{font-family:'JetBrains Mono';font-size:var(--f0);color:var(--faint);}
.mod i{font-size:24px;color:var(--primary-2);}
.mod h4{font-size:var(--f3);font-weight:600;margin-bottom:7px;}
.mod p{color:var(--muted);font-size:var(--f1);line-height:1.45;}

/* ---------- flow / lifecycle ---------- */
.flow{display:flex;align-items:stretch;gap:0;flex-wrap:wrap;}
.flow .step{
  flex:1 1 0;min-width:120px;position:relative;padding:var(--s3) var(--s2);text-align:center;
}
.flow .step:not(:last-child)::after{
  content:"";position:absolute;top:33px;right:-9px;width:18px;height:18px;z-index:2;
  border-right:1.5px solid var(--primary-line);border-top:1.5px solid var(--primary-line);
  transform:rotate(45deg);
}
.flow .node{
  width:54px;height:54px;margin:0 auto 14px;border-radius:14px;display:flex;align-items:center;justify-content:center;
  background:var(--surface);border:1px solid var(--line-2);color:var(--primary-2);font-size:23px;
}
.flow .step h5{font-size:var(--f2);font-weight:600;}
.flow .step span{font-family:'JetBrains Mono';font-size:10px;letter-spacing:.1em;color:var(--faint);display:block;margin-top:6px;text-transform:uppercase;}
.flow-rail{position:relative;}
.flow-rail::before{content:"";position:absolute;top:33px;left:7%;right:7%;height:1px;background:var(--line);}

/* ---------- node-graph (source → core → destinations) ---------- */
.pflow{position:relative;width:100%;max-width:none;margin:0 auto;aspect-ratio:920/440;}
.pwires{position:absolute;inset:0;width:100%;height:100%;overflow:visible;}
.pwires path{fill:none;stroke-width:3;stroke-linecap:round;}
.pw-base{stroke:var(--line-2);}
.pw{stroke-width:3.5;}
.pw-b{stroke:#3B82F6;filter:drop-shadow(0 0 6px rgba(59,130,246,.5));}
.pw-r{stroke:#FF4D5F;filter:drop-shadow(0 0 6px rgba(255,77,95,.5));}
.pw-a{stroke:#FFB020;filter:drop-shadow(0 0 6px rgba(255,176,32,.5));}
.pw-t{stroke:#2DD4BF;filter:drop-shadow(0 0 6px rgba(45,212,191,.5));}
.pnode{position:absolute;left:calc(var(--x)/920*100%);top:calc(var(--y)/440*100%);transform:translate(-50%,-50%);}
.pnode.anchor-l{transform:translate(0,-50%);}
.pstack{display:flex;flex-direction:column;gap:10px;padding:14px 13px;border:1px solid var(--line-2);border-radius:16px;background:var(--surface);}
.pstack .pm{width:44px;height:44px;border-radius:13px;display:flex;align-items:center;justify-content:center;background:var(--bg-2);border:1px solid var(--line);color:var(--primary-2);font-size:20px;}
.pcore{width:108px;height:108px;border-radius:28px;background:#000;border:1px solid var(--line-2);display:flex;align-items:center;justify-content:center;color:#fff;font-size:40px;box-shadow:0 18px 50px rgba(0,0,0,.55);}
.pdest{display:flex;align-items:center;gap:13px;padding:12px 18px 12px 14px;border:1px solid var(--line-2);border-radius:16px;background:var(--surface);white-space:nowrap;}
.pdest .pic{width:42px;height:42px;border-radius:12px;flex:none;display:flex;align-items:center;justify-content:center;font-size:20px;color:#fff;background:var(--c);border:none;}
.pdest b{display:block;font-size:var(--f2);font-weight:600;}
.pdest span{display:block;font-size:12px;color:var(--muted);}
@media (max-width:760px){
  .pflow{max-width:560px;}
  .pdest{padding:10px 12px;}
  .pdest span{display:none;}
}

/* lifecycle pills */
.life{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:var(--s4);}
.life .pill{font-family:'JetBrains Mono';font-size:var(--f0);padding:9px 15px;border-radius:var(--r-pill);border:1px solid var(--line-2);background:var(--surface);color:var(--muted);}
.life .arrow{color:var(--faint);font-size:13px;}
.life .ex{border-color:rgba(255,176,32,.4);color:var(--warn);background:rgba(255,176,32,.06);}

/* ---------- API / architecture ---------- */
.arch{border:1px solid var(--line-2);border-radius:20px;overflow:hidden;background:var(--surface);}
.arch .layer{padding:var(--s4);border-bottom:1px solid var(--line);}
.arch .layer:last-child{border-bottom:none;}
.arch .layer .lab{font-family:'JetBrains Mono';font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--primary-2);margin-bottom:16px;display:block;}
.arch .row{display:flex;flex-wrap:wrap;gap:10px;}
.arch .node2{
  font-size:var(--f1);padding:11px 17px;border-radius:12px;border:1px solid var(--line-2);
  background:var(--bg-2);display:flex;align-items:center;gap:9px;
}
.arch .node2 i{color:var(--primary-2);font-size:16px;}
.arch .layer.core{background:rgba(47,107,255,.05);}
.arch .layer.core .node2{border-color:var(--primary-line);background:rgba(47,107,255,.08);}

/* ---------- security / fraud ---------- */
.sec-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:stretch;}
.gauge-card{
  border:1px solid var(--line-2);border-radius:20px;padding:var(--s4);
  background:var(--surface);
}
.gauge{position:relative;width:200px;height:110px;margin:10px auto 0;}
.gauge svg{width:100%;height:100%;overflow:visible;}
.gauge .val{position:absolute;bottom:0;left:0;right:0;text-align:center;}
.gauge .val b{font-size:var(--f5);font-weight:700;line-height:1;color:var(--warn);}
.gauge .val span{font-family:'Google Sans',-apple-system,sans-serif;font-size:11px;letter-spacing:.08em;color:var(--faint);display:block;text-transform:uppercase;}
.signals{display:flex;flex-direction:column;gap:12px;margin-top:var(--s3);}
.signal{display:flex;align-items:center;justify-content:space-between;font-size:var(--f1);padding:10px 14px;border-radius:11px;border:1px solid var(--line);background:var(--bg-2);}
.signal .mono{color:var(--muted);font-family:inherit;}
.signal .lvl{font-family:inherit;font-size:12px;font-weight:600;padding:4px 11px;border-radius:14px;}
.lvl.ok{color:#06241a;background:var(--live);} .lvl.mid{color:#241803;background:var(--warn);} .lvl.hi{color:#fff;background:var(--bad);}
.layers{display:flex;flex-direction:column;gap:10px;}
.layer-row{display:flex;align-items:center;gap:14px;padding:13px 16px;border-radius:12px;border:1px solid var(--line);background:var(--bg-2);}
.layer-row .lx{font-family:'JetBrains Mono';font-size:11px;color:var(--primary);width:28px;flex:none;}
.layer-row b{font-weight:600;font-size:var(--f2);}
.layer-row span{color:var(--faint);font-size:var(--f1);margin-left:auto;font-family:'JetBrains Mono';}

/* ---------- infra logos ---------- */
.infra{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.infra .item{display:flex;flex-direction:column;gap:8px;align-items:center;text-align:center;padding:var(--s3);border:1px solid var(--line);border-radius:14px;background:var(--surface);}
.infra .item i{font-size:26px;color:var(--primary-2);}
.infra .item b{font-size:var(--f2);font-weight:600;}
.infra .item span{font-family:'JetBrains Mono';font-size:11px;color:var(--faint);}

/* ---------- marquee (single-line auto-scroll partners strip) ---------- */
.marquee{position:relative;overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);}
.marquee-track{display:flex;align-items:center;gap:14px;width:max-content;
  animation:mqRight 42s linear infinite;will-change:transform;}
.marquee:hover .marquee-track{animation-play-state:paused;}
@keyframes mqRight{from{transform:translateX(-50%);}to{transform:translateX(0);}}
.mq-item{display:inline-flex;align-items:center;gap:11px;white-space:nowrap;
  padding:15px 24px;border:1px solid var(--line);border-radius:14px;background:var(--surface);
  font-size:var(--f3);font-weight:600;letter-spacing:-.01em;}
.mq-item i{font-size:24px;color:var(--primary-2);}
.mq-logo{width:26px;height:26px;object-fit:contain;display:block;flex:none;}
.mq-item span{font-family:'JetBrains Mono';font-size:11px;font-weight:400;letter-spacing:.12em;color:var(--faint);}
@media (prefers-reduced-motion:reduce){.marquee-track{animation:none;}}

/* ---------- AI automation ---------- */
.ai{display:grid;grid-template-columns:1fr auto 1fr;gap:var(--s4);align-items:center;}
.ai .colhead{font-family:'JetBrains Mono';font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);margin-bottom:14px;}
.ai .ilist{display:flex;flex-direction:column;gap:10px;}
.ai .ilist .it{font-size:var(--f1);padding:10px 14px;border-radius:11px;border:1px solid var(--line);background:var(--bg-2);color:var(--muted);}
.ai-core{
  width:130px;height:130px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:var(--primary);color:var(--btn-fg);text-align:center;
}
.ai-core b{font-size:var(--f3);font-weight:700;}
.ai-core span{font-family:'JetBrains Mono';font-size:10px;letter-spacing:.12em;color:inherit;opacity:.85;}
.ai .out .it{border-color:var(--primary-line);background:rgba(47,107,255,.07);color:var(--text);}

/* ---------- business model tabs ---------- */
.bm{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.bm .card .badge{font-family:'JetBrains Mono';font-size:11px;letter-spacing:.14em;color:var(--primary-2);}
.bm .card ul{list-style:none;margin-top:16px;display:flex;flex-direction:column;gap:10px;}
.bm .card li{display:flex;gap:10px;font-size:var(--f1);color:var(--muted);}
.bm .card li i{color:var(--primary-2);font-size:14px;margin-top:3px;}

/* ---------- roadmap ---------- */
.road{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:var(--s4);}
.road::before{content:"";position:absolute;top:7px;left:5%;right:5%;height:1px;background:linear-gradient(90deg,var(--primary),var(--line));}
.road .pt{position:relative;padding-top:30px;}
.road .pt .d{position:absolute;top:0;left:0;width:16px;height:16px;border-radius:50%;background:var(--bg);border:2px solid var(--primary);}
.road .pt.done .d{background:var(--live);border-color:var(--live);}
.road .pt.soon .d{border-color:var(--warn);}
.road .pt .when{font-family:'JetBrains Mono';font-size:11px;letter-spacing:.1em;color:var(--primary-2);}
.road .pt h4{font-size:var(--f3);font-weight:600;margin:8px 0 6px;}
.road .pt p{color:var(--muted);font-size:var(--f1);line-height:1.45;}
.road .pt .st{font-family:'JetBrains Mono';font-size:10px;letter-spacing:.1em;margin-top:10px;display:inline-block;}
.road .pt.done .st{color:var(--live);} .road .pt.soon .st{color:var(--warn);} .road .pt.wip .st{color:var(--primary-2);}

/* ---------- contact / final CTA ---------- */
.contact{position:relative;overflow:hidden;}
.contact-card{
  border:1px solid var(--primary-line);border-radius:26px;overflow:hidden;
  background:var(--surface);
  display:grid;grid-template-columns:.92fr 1.08fr;
}
.contact-left{padding:var(--s5);border-right:1px solid var(--line);}
.contact-left h2{font-size:clamp(28px,3.4vw,var(--f5));font-weight:700;line-height:1.06;letter-spacing:-.02em;}
.contact-left p{color:var(--muted);font-size:var(--f2);line-height:1.55;margin-top:18px;}
.contact-points{list-style:none;margin-top:var(--s4);display:flex;flex-direction:column;gap:14px;}
.contact-points li{display:flex;gap:12px;font-size:var(--f2);}
.contact-points li i{color:var(--primary-2);font-size:17px;margin-top:3px;}
.contact-meta{margin-top:var(--s5);font-family:'JetBrains Mono';font-size:var(--f0);color:var(--faint);line-height:1.8;}
.contact-meta a{color:var(--primary-2);}

.form{padding:var(--s5);}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.field{display:flex;flex-direction:column;gap:7px;}
.field.full{grid-column:1/-1;}
.field label{font-size:var(--f1);color:var(--muted);font-weight:600;}
.field label .req{color:var(--primary-2);}
.field input,.field select,.field textarea{
  font-family:inherit;font-size:var(--f2);color:var(--text);
  background:var(--bg-2);border:1px solid var(--line-2);border-radius:11px;padding:12px 14px;
  transition:border-color .2s,box-shadow .2s;width:100%;
}
.field textarea{resize:vertical;min-height:90px;line-height:1.5;}
.field input::placeholder,.field textarea::placeholder{color:var(--faint);}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px rgba(47,107,255,.18);}
.field select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%239AA6BB' d='M6 8 0 0h12z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;padding-right:38px;}
.consent{display:flex;gap:11px;align-items:flex-start;margin-top:4px;grid-column:1/-1;}
.consent input{width:18px;height:18px;margin-top:3px;accent-color:var(--primary);flex:none;}
.consent label{font-size:var(--f1);color:var(--muted);line-height:1.5;}
.consent a{color:var(--primary-2);}
.form .btn{width:100%;margin-top:6px;}
.form-note{font-family:'JetBrains Mono';font-size:11px;color:var(--faint);text-align:center;margin-top:14px;}
.err{border-color:var(--bad)!important;box-shadow:0 0 0 3px rgba(255,77,95,.15)!important;}
.form-success{
  display:none;flex-direction:column;align-items:center;justify-content:center;text-align:center;
  padding:var(--s6) var(--s4);min-height:100%;
}
.form-success .ok{width:72px;height:72px;border-radius:50%;background:rgba(30,209,132,.12);border:1px solid var(--live);
  display:flex;align-items:center;justify-content:center;color:var(--live);font-size:34px;margin-bottom:var(--s3);}
.form-success h3{font-size:var(--f4);font-weight:700;}
.form-success p{color:var(--muted);font-size:var(--f2);margin-top:12px;max-width:360px;line-height:1.55;}
.form.sent .fgrid,.form.sent .btn,.form.sent .form-note,.form.sent .consent,.form.sent>h3,.form.sent>p{display:none;}
.form.sent .form-success{display:flex;}

/* ---------- footer (rounded card) ---------- */
.footer{padding:var(--s4) 0 var(--s4);margin-top:0;position:relative;}
.footer::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;display:none;
  background:url(assets/footer-bg.png) center bottom / cover no-repeat;opacity:.55;
  -webkit-mask:linear-gradient(180deg,transparent 0%,#000 45%);mask:linear-gradient(180deg,transparent 0%,#000 45%);}
.footer .wrap{position:relative;z-index:1;}
.footer-card{
  position:relative;
  padding:var(--s5) 0 var(--s3);
  display:grid;grid-template-columns:1.5fr 1fr;gap:var(--s5);
}
.footer-card::after{content:none;}
.footer-card > *{position:relative;z-index:1;}
.f-left .brand{display:inline-flex;}
.f-left .brand-logo{height:22px;}
.f-desc{color:var(--muted);max-width:380px;margin-top:20px;line-height:1.65;font-size:var(--f2);}
.f-social{display:flex;gap:12px;margin-top:24px;}
.f-social a{width:40px;height:40px;border-radius:11px;border:1px solid var(--line-2);display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:18px;transition:color .2s,background .2s,border-color .2s;}
.f-social a:hover{color:var(--text);background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.22);}
.f-right{display:flex;flex-direction:column;align-items:flex-start;}
.f-cols{display:flex;gap:var(--s5);width:100%;justify-content:flex-end;}
.f-col h5{font-family:'JetBrains Mono';font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--faint);margin-bottom:16px;}
.f-col a{display:block;color:var(--muted);font-size:var(--f2);padding:7px 0;transition:color .2s;}
.f-col a:hover{color:var(--text);}
.f-status{display:flex;align-items:center;gap:10px;margin-top:var(--s4);margin-left:auto;font-size:var(--f1);color:var(--text);}
.f-dot{width:16px;height:16px;border-radius:50%;background:rgba(30,209,132,.18);border:1px solid var(--live);position:relative;flex:none;}
.f-dot::after{content:"";position:absolute;inset:4px;border-radius:50%;background:var(--live);}
.f-bottom{text-align:center;margin-top:var(--s4);font-family:'JetBrains Mono';font-size:11px;letter-spacing:.14em;color:var(--faint);}

/* section label number */
.sec-no{font-family:'JetBrains Mono';font-size:var(--f0);color:var(--faint);letter-spacing:.1em;}

/* ---------- atmosphere levers ---------- */
body[data-atmos="calm"]{--atmos-grid:0;}
body[data-atmos="charged"]{--atmos-grid:.7;}
body[data-atmos="charged"]::after{background-size:48px 48px;}
body[data-atmos="calm"] .card:hover{box-shadow:0 10px 28px rgba(0,0,0,.4);border-color:var(--line-2);}

/* ---------- management console mock ---------- */
.console{border:1px solid var(--line-2);border-radius:16px;overflow:hidden;background:var(--bg-2);}
.console-bar{display:flex;align-items:center;gap:7px;padding:11px 14px;border-bottom:1px solid var(--line);background:var(--surface);}
.console-bar .cd{width:10px;height:10px;border-radius:50%;background:var(--line-2);}
.console-bar .ct{margin-left:10px;font-family:'JetBrains Mono';font-size:12px;color:var(--faint);}
.console-body{display:grid;grid-template-columns:158px 1fr;min-height:248px;}
.console-side{border-right:1px solid var(--line);padding:12px;display:flex;flex-direction:column;gap:3px;}
.console-side .it{font-size:14px;color:var(--muted);padding:8px 11px;border-radius:8px;display:flex;align-items:center;gap:8px;}
.console-side .it i{font-size:15px;}
.console-side .it.on{background:var(--primary-soft);color:var(--primary-2);border:1px solid var(--primary-line);}
.console-main{padding:15px;display:flex;flex-direction:column;gap:9px;}
.console-row{display:flex;align-items:center;justify-content:space-between;padding:11px 13px;border:1px solid var(--line);border-radius:10px;background:var(--surface);font-size:14px;}
.console-row .mono{color:var(--muted);font-family:'JetBrains Mono';font-size:12px;}
.console-row .pill2{font-family:'JetBrains Mono';font-size:11px;padding:3px 9px;border-radius:14px;}
.console-health{display:flex;gap:8px;margin-top:auto;flex-wrap:wrap;}
.console-health .hp{font-family:'JetBrains Mono';font-size:11px;padding:6px 11px;border-radius:20px;border:1px solid var(--line-2);color:var(--muted);display:flex;align-items:center;gap:7px;}
.console-health .hp .gd{width:7px;height:7px;border-radius:50%;}
.caps{display:flex;flex-direction:column;gap:14px;}
.caps .cap{display:flex;gap:14px;padding:18px;border:1px solid var(--line);border-radius:14px;background:var(--surface);}
.caps .cap i{font-size:22px;color:var(--primary-2);flex:none;}
.caps .cap h4{font-size:var(--f3);font-weight:600;margin-bottom:5px;}
.caps .cap p{color:var(--muted);font-size:var(--f1);line-height:1.5;}
/* outcome chips */
.outcomes{display:flex;flex-wrap:wrap;gap:10px;margin-top:var(--s3);}
.outcomes .oc{display:flex;align-items:center;gap:9px;font-size:var(--f1);padding:10px 15px;border-radius:var(--r-pill);border:1px solid var(--line-2);background:var(--surface);}
.outcomes .oc i{font-size:15px;}

/* ---------- platform overview steps (hover-interactive) ---------- */
.steps{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);border-radius:22px;overflow:hidden;background:var(--bg-2);box-shadow:0 12px 32px -22px rgba(0,0,0,.10),0 2px 8px rgba(0,0,0,.03);}
.step-col{padding:var(--s4);display:flex;flex-direction:column;position:relative;transition:background .3s;}
.step-col>*{position:relative;z-index:1;}
.step-col::after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:0;transition:opacity .3s;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='nz2'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23nz2)'/%3E%3C/svg%3E");}
.step-col:hover{background:rgba(255,255,255,.025);}
.step-col:hover::after{opacity:.06;}
.step-col + .step-col{border-left:1px solid var(--line);}
.step-mock{min-height:236px;display:flex;flex-direction:column;justify-content:center;gap:10px;margin-bottom:var(--s4);transition:transform .3s cubic-bezier(.2,.7,.2,1);}
.steps-dots{display:none;}
.step-col:hover .step-mock{transform:translateY(-4px);}
.step-no{font-family:'JetBrains Mono';font-size:var(--f3);color:var(--faint);}
.step-col h3{font-size:var(--f4);font-weight:700;margin:6px 0 8px;letter-spacing:-.01em;}
.step-col > p{color:var(--muted);font-size:var(--f2);line-height:1.5;}
/* source rows */
.src-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 13px;border:1px solid var(--line-2);border-radius:12px;background:var(--surface);font-size:var(--f1);transition:border-color .25s,background .25s;}
.src-row.connected{border-color:var(--cc,var(--primary));}
.src-l{display:flex;align-items:center;gap:10px;color:var(--text);font-weight:500;}
.src-ic{display:flex;align-items:center;justify-content:center;color:#fff;flex:none;}
.src-ic i{font-size:18px;}
.src-st{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--muted);}
.src-st.on,.src-row.connected .s-on{color:#fff;font-weight:600;}
.src-st .s-on{display:none;}
.src-row.connected{background:var(--cc,var(--primary));border-color:transparent;}
.src-row.connected .src-l,.src-row.connected .src-ic{color:#fff;}
@media (prefers-reduced-motion:reduce){
  .step-col:hover .src-row{background:var(--cc,var(--primary));border-color:transparent;}
  .step-col:hover .src-row .src-l,.step-col:hover .src-row .src-ic{color:#fff;}
  .step-col:hover .src-row .s-off{display:none;}
  .step-col:hover .src-row .s-on{display:inline-flex;align-items:center;gap:6px;color:#fff;font-weight:600;}
}
/* token card */
.token-card{border:1px solid var(--line-2);border-radius:14px;background:var(--surface);padding:16px;}
.tk-h{display:flex;gap:11px;align-items:flex-start;margin-bottom:14px;}
.tk-ic{width:30px;height:30px;border-radius:8px;background:var(--surface-3);display:flex;align-items:center;justify-content:center;color:var(--primary-2);font-size:16px;flex:none;}
.tk-h b{display:block;font-size:var(--f2);font-weight:600;}
.tk-h span{font-size:13px;color:var(--muted);}
.tk-btn{width:100%;display:flex;align-items:center;justify-content:center;gap:8px;padding:11px;border-radius:10px;border:1px solid var(--line-2);background:var(--bg-2);color:var(--text);font-family:inherit;font-size:var(--f1);font-weight:600;cursor:pointer;transition:background .25s,border-color .25s,color .25s;}
.step-col:hover .tk-btn{background:var(--primary);color:var(--btn-fg);border-color:transparent;}
/* access card */
.access-card{border:1px solid var(--line-2);border-radius:14px;background:var(--surface);padding:16px;}
.ac-h{display:block;font-size:var(--f2);font-weight:600;margin-bottom:10px;}
.ac-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 0;}
.ac-row b{font-size:14px;font-weight:600;display:block;}
.ac-row span{font-size:12px;color:var(--faint);}
.ac-save{display:block;margin-left:auto;margin-top:10px;padding:6px 16px;border-radius:8px;border:1px solid var(--line-2);background:var(--surface-3);color:var(--text);font-family:inherit;font-size:13px;font-weight:600;cursor:pointer;}
.tgl{width:38px;height:22px;border-radius:20px;background:var(--surface-3);border:1px solid var(--line-2);position:relative;flex:none;transition:background .25s;}
.tgl::after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;transition:transform .25s,background .25s;}
.tgl.on{background:var(--primary);}
.tgl.on::after{transform:translateX(16px);background:var(--btn-fg);}
/* animated demo cursor */
.ac-cursor{position:absolute;left:0;top:0;width:24px;height:24px;z-index:6;pointer-events:none;opacity:0;
  transition:opacity .25s ease,left .55s cubic-bezier(.45,.55,.2,1),top .55s cubic-bezier(.45,.55,.2,1),transform .14s ease;
  filter:drop-shadow(0 2px 5px rgba(0,0,0,.7));}
.step-col:hover .ac-cursor{opacity:1;}
.ac-cursor i{font-size:24px;line-height:1;color:var(--cur,#fff);display:block;}
#overview .step-col:nth-child(1){--cur:#3B82F6;}
#overview .step-col:nth-child(2){--cur:#8B5CF6;}
#overview .step-col:nth-child(3){--cur:#2DD4BF;}
.ac-cursor svg{width:100%;height:100%;display:block;}
.ac-cursor.click{transform:scale(.78);}
.src-row.connected{background:var(--cc,var(--primary));border-color:transparent;}
.src-row.connected .s-off{display:none;}
.src-row.connected .s-on{display:inline-flex;align-items:center;gap:6px;color:#fff;}
.tk-btn.press{background:var(--primary);color:var(--btn-fg);border-color:transparent;}
/* generated key reveal + copy */
.tk-key{display:flex;align-items:center;gap:8px;overflow:hidden;max-height:0;opacity:0;margin-top:0;padding:0 11px;
  border:1px solid transparent;border-radius:10px;background:var(--bg-2);
  transition:max-height .35s ease,opacity .3s ease,margin-top .35s ease,padding .35s ease,border-color .3s ease;}
.tk-key.show{max-height:56px;opacity:1;margin-top:12px;padding:9px 11px;border-color:var(--line-2);}
.tk-key code{flex:1;min-width:0;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:13px;letter-spacing:.06em;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.tk-copy{flex:none;width:30px;height:30px;border-radius:8px;border:1px solid var(--line-2);background:var(--surface-3);color:var(--muted);display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:15px;transition:color .2s,border-color .2s,background .2s;}
.tk-copy:hover{color:var(--text);}
.tk-copy.copied{color:var(--primary-2);border-color:rgba(255,255,255,.45);background:rgba(255,255,255,.08);}

/* ---------- closing CTA band ---------- */
.cta-band{position:relative;text-align:center;border-top:1px solid var(--line);}
.cta-inner{max-width:680px;margin:0 auto;display:flex;flex-direction:column;align-items:center;}
.cta-inner .h-sec{margin-top:0;}
.cta-band{padding-bottom:0;}
.cta-outro{margin:var(--s3) auto 0;width:100%;max-width:560px;border-radius:0;overflow:hidden;
  -webkit-mask:linear-gradient(180deg,transparent,#000 14%,#000 78%,transparent);
          mask:linear-gradient(180deg,transparent,#000 14%,#000 78%,transparent);}
.cta-outro video{width:100%;height:auto;display:block;}
.cta-video{max-width:420px;margin:0 auto var(--s5);border-radius:18px;overflow:hidden;background:#000;}
.cta-video .cta-vid{width:100%;height:auto;display:block;}

/* ---------- features bento ---------- */
.bento{
  display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:168px;gap:14px;
  grid-template-areas:
    "cat cat stk ord"
    "cat cat pay inv"
    "api api del del"
    "api api fra fra";
}
.bento-card{
  position:relative;border:1px solid var(--line);border-radius:18px;overflow:hidden;
  display:flex;flex-direction:column;background:#06070c;
  transition:transform .25s,border-color .25s,box-shadow .25s;
}
.bento-card:hover{transform:translateY(-4px);border-color:var(--primary-line);box-shadow:0 14px 40px rgba(0,0,0,.45);}
.bento-card .bmedia{flex:1;min-height:0;overflow:hidden;}
.bento-card .bmedia img{width:100%;height:100%;object-fit:contain;object-position:center;display:block;}
.bento-card .bc{padding:16px 18px 18px;}
.bento-card .bnum{font-family:'JetBrains Mono';font-size:11px;letter-spacing:.1em;color:var(--muted);}
.bento-card h4{font-size:var(--f3);font-weight:600;margin-top:6px;letter-spacing:-.01em;}
.bento-card p{color:var(--muted);font-size:var(--f1);line-height:1.45;margin-top:6px;}
.bento-card.sm h4{font-size:var(--f2);}
.bento-card.sm .bc{padding:12px 14px 14px;}
/* wide cards: text left, render right */
.bento-card.wide{flex-direction:row-reverse;align-items:stretch;}
.bento-card.wide .bmedia{flex:0 0 44%;}
.bento-card.wide .bc{flex:1;display:flex;flex-direction:column;justify-content:center;}
.b-cat{grid-area:cat;} .b-stk{grid-area:stk;} .b-ord{grid-area:ord;}
.b-pay{grid-area:pay;} .b-inv{grid-area:inv;} .b-api{grid-area:api;}
.b-del{grid-area:del;} .b-fra{grid-area:fra;}
@media (max-width:860px){
  .bento{grid-template-columns:1fr 1fr;grid-auto-rows:180px;grid-template-areas:none;}
  .bento-card{grid-area:auto !important;}
  .b-cat,.b-api,.b-del,.b-fra{grid-column:span 2;}
}
@media (max-width:520px){
  .bento{grid-template-columns:1fr;}
  .b-cat,.b-api,.b-del,.b-fra{grid-column:auto;}
  .bento-card.wide{flex-direction:column;}
  .bento-card.wide .bmedia{flex:1;}
}

/* ---------- features bento (large product cards w/ embedded mockups) ---------- */
.fbento{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:stretch;}
.fcol{display:flex;flex-direction:column;gap:18px;}
.fcard{
  position:relative;overflow:hidden;display:flex;flex-direction:column;
  border:1px solid var(--line);border-radius:26px;
  background:linear-gradient(180deg,#0d0d10,#070708);
  transition:border-color .3s,box-shadow .3s;
}
.fcard:hover{border-color:rgba(255,255,255,.16);box-shadow:0 24px 70px rgba(0,0,0,.45);}
.fcard-tall{flex:1;}
.fc-head{position:relative;z-index:3;padding:40px 40px 0;}
.fc-mods{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px;}
.fc-mods span{
  font-family:'JetBrains Mono';font-size:11px;letter-spacing:.04em;color:var(--muted);
  border:1px solid var(--line-2);border-radius:var(--r-pill);padding:5px 12px;background:rgba(255,255,255,.02);
}
.fcard h3{font-size:clamp(23px,2.4vw,29px);font-weight:600;letter-spacing:-.02em;line-height:1.1;}
.fc-head p{color:var(--muted);font-size:clamp(16px,1.5vw,19px);line-height:1.45;margin-top:13px;max-width:430px;text-wrap:pretty;}
.fc-more{display:inline-flex;align-items:center;gap:7px;margin-top:22px;font-size:16px;font-weight:500;color:var(--text);transition:gap .2s;}
.fc-more:hover{gap:12px;}
.fc-more i{font-size:14px;color:var(--muted);}
.fc-mock{position:relative;flex:1;min-height:0;margin-top:34px;}
.fcard .fc-mock{min-height:240px;}
.fcard-tall .fc-mock{min-height:430px;}
.fc-vid{position:absolute;left:40px;right:0;top:0;bottom:0;overflow:hidden;
  border-top-left-radius:16px;border:1px solid var(--line);border-right:none;border-bottom:none;background:#000;}
.fc-vid video{width:100%;height:100%;object-fit:cover;
  filter:grayscale(1) brightness(.82) contrast(1.04);transition:filter .45s ease,transform .6s ease;transform:scale(1.02);}
.fcard:hover .fc-vid video{filter:grayscale(0) brightness(1) contrast(1);transform:scale(1.06);}
@media (max-width:860px){
  .fc-vid{left:28px;}
  .fcard .fc-mock,.fcard-tall .fc-mock{min-height:300px;}
}

/* shared mockup chrome */
.mk{position:absolute;border-radius:16px 0 0 0;overflow:hidden;}
.mk-mono,.mk .mk-mono{font-family:'JetBrains Mono';}

/* --- Overview analytics mockup --- */
.mk-ov{left:40px;right:-44px;top:0;bottom:-1px;padding:30px 34px 0;
  background:#060608;border:1px solid var(--line);border-right:none;border-bottom:none;}
.mk-ov-title{font-family:var(--font-display);font-size:30px;font-weight:700;letter-spacing:-.02em;margin-bottom:26px;}
.mk-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:8px;}
.mk-lab{display:flex;align-items:center;gap:7px;font-size:14px;color:var(--muted);}
.mk-lab .lvdot{width:9px;height:9px;border-radius:50%;background:#3B82F6;box-shadow:0 0 0 4px rgba(59,130,246,.18);}
.mk-stat b{display:block;font-size:30px;font-weight:600;letter-spacing:-.01em;margin-top:8px;}
.mk-chart{position:relative;height:150px;margin:18px 0 6px;}
.mk-yax{position:absolute;left:0;top:-2px;font-family:'JetBrains Mono';font-size:12px;color:var(--faint);}
.mk-svg{width:100%;height:100%;display:block;}
.mk-tip{position:absolute;left:0;bottom:8px;padding:13px 16px;border-radius:12px;min-width:180px;
  background:rgba(10,10,13,.86);border:1px solid var(--line-2);backdrop-filter:blur(6px);}
.mk-tip-d{font-size:13px;color:var(--muted);margin-bottom:9px;}
.mk-tip-r{display:flex;align-items:center;justify-content:space-between;gap:24px;font-size:14px;margin-top:5px;}
.mk-tip-r span{display:flex;align-items:center;gap:8px;color:var(--muted);}
.mk-tip-r b{font-weight:600;}
.mk-tip-r .d{width:9px;height:9px;border-radius:50%;}
.mk-tip-r .d.blue{background:#3B82F6;} .mk-tip-r .d.purp{background:#A78BFA;}
.mk-src{margin-top:14px;border-top:1px solid var(--line);padding-top:18px;padding-right:54px;}
.mk-src-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;}
.mk-src-h b{font-size:17px;font-weight:600;}
.mk-src-h span{display:flex;align-items:center;gap:5px;font-size:14px;color:var(--muted);}
.mk-src-row{position:relative;display:flex;align-items:center;gap:11px;padding:11px 14px;font-size:15px;color:var(--text);
  border-radius:9px;overflow:hidden;}
.mk-src-row::before{content:"";position:absolute;left:0;top:0;bottom:0;width:var(--w,0);
  background:color-mix(in srgb,var(--cc,#fff) 13%,transparent);
  border-right:1px solid color-mix(in srgb,var(--cc,#fff) 34%,transparent);z-index:0;}
.mk-src-row>*{position:relative;z-index:1;}
.mk-src-row b{margin-left:auto;font-weight:600;font-family:'JetBrains Mono';font-size:14px;}
.mk-mg{width:24px;height:24px;border-radius:6px;flex:none;display:flex;align-items:center;justify-content:center;
  font-family:'JetBrains Mono';font-size:10px;font-style:normal;
  color:var(--cc,var(--muted));
  background:color-mix(in srgb,var(--cc,#888) 16%,transparent);
  border:1px solid color-mix(in srgb,var(--cc,#888) 36%,transparent);}

/* --- Payments console mockup --- */
.fc-mock-pay{margin-top:30px;min-height:300px;}
.mk-pay{left:40px;right:-44px;top:0;bottom:-1px;display:grid;grid-template-columns:1fr 1fr;
  background:#060608;border:1px solid var(--line);border-right:none;border-bottom:none;}
.mk-pane{padding:16px 16px 0;border-right:1px solid var(--line);}
.mk-tool{display:flex;gap:8px;margin-bottom:16px;}
.mk-tb{width:34px;height:30px;border-radius:8px;display:flex;align-items:center;justify-content:center;gap:3px;
  background:rgba(255,255,255,.04);border:1px solid var(--line-2);color:var(--muted);font-size:15px;}
.mk-tb-lead{width:auto;padding:0 10px;}
.mk-tabs{display:flex;gap:4px;padding:4px;border-radius:10px;background:rgba(255,255,255,.03);border:1px solid var(--line-2);margin-bottom:18px;}
.mk-tabs span{flex:1;text-align:center;padding:7px 0;font-size:13px;color:var(--muted);border-radius:7px;}
.mk-tabs span.on{background:rgba(255,255,255,.07);color:var(--text);font-weight:600;}
.mk-grp{display:flex;align-items:center;justify-content:space-between;font-size:15px;font-weight:600;padding:6px 4px;}
.mk-grp i{color:var(--muted);font-size:13px;}
.mk-leaf{display:flex;align-items:center;gap:7px;font-size:14px;color:var(--muted);padding:9px 4px;}
.mk-leaf i{font-size:13px;}
.mk-row{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--text);padding:9px 12px;margin-left:14px;border-radius:9px;}
.mk-row.on{background:rgba(255,255,255,.07);}
.mk-av{width:20px;height:20px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;
  font-family:'JetBrains Mono';font-size:10px;background:rgba(255,255,255,.08);border:1px solid var(--line-2);color:var(--muted);}
.mk-leaf2{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--muted);padding:11px 4px;margin-top:6px;}
.mk-ab{margin-left:auto;display:flex;gap:5px;}
.mk-ab b{width:18px;height:18px;border-radius:5px;display:flex;align-items:center;justify-content:center;
  font-family:'JetBrains Mono';font-size:10px;font-weight:400;background:rgba(255,255,255,.05);border:1px solid var(--line-2);}
.mk-prev{display:flex;flex-direction:column;background:#0a0a0d;}
.mk-prev-bar{display:flex;align-items:center;gap:8px;padding:13px 16px;font-size:13px;color:var(--muted);border-bottom:1px solid var(--line);}
.mk-pp{width:22px;height:22px;border-radius:6px;flex:none;display:flex;align-items:center;justify-content:center;background:#2F6BFF;color:#fff;font-size:11px;}
.mk-prev-bar .mk-mono{color:var(--text);}
.mk-prev-body{flex:1;padding:22px 20px;display:flex;flex-direction:column;}
.mk-bal{font-size:13px;color:var(--muted);}
.mk-bal b{display:block;font-family:'JetBrains Mono';font-size:22px;color:var(--text);margin-top:6px;}
.mk-eq{display:flex;align-items:flex-end;gap:5px;height:90px;margin-top:auto;}
.mk-eq span{flex:1;height:var(--h);border-radius:3px 3px 0 0;
  background:linear-gradient(180deg,#60A5FA,#8B5CF6);opacity:.85;}

/* --- Risk gauges mockup --- */
.fc-mock-gauge{margin-top:24px;min-height:230px;}
.mk-gauge{left:40px;right:-44px;top:0;bottom:-1px;padding:26px 30px;border-radius:16px 0 0 0;
  background:#060608;border:1px solid var(--line);border-right:none;border-bottom:none;
  display:flex;flex-direction:column;align-items:center;}
.mk-gauge-h{display:flex;align-items:center;gap:9px;font-size:17px;font-weight:600;margin-bottom:24px;}
.mk-gauge-h i{color:#3B82F6;font-size:19px;}
.mk-gauges{display:flex;gap:clamp(14px,3vw,40px);justify-content:center;}
.mk-gring{position:relative;width:108px;height:108px;}
.mk-gring svg{width:100%;height:100%;transform:rotate(-90deg);}
.mk-gring circle{fill:none;stroke-width:7;stroke-linecap:round;}
.mk-gring circle.bg{stroke:rgba(255,255,255,.07);}
.mk-gring circle.fg{stroke:#3B82F6;stroke-dasharray:327;stroke-dashoffset:calc(327 * (1 - var(--p)));
  filter:drop-shadow(0 0 5px rgba(59,130,246,.55));}
.mk-gv{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:30px;font-weight:600;}
.mk-glabs{display:flex;gap:clamp(14px,3vw,40px);justify-content:center;margin-top:14px;}
.mk-glabs span{width:108px;text-align:center;font-size:14px;color:var(--muted);}

/* --- features: module video grid (grayscale, plays on hover) --- */
.feat-black{background:#000;}
.vgrid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:215px;gap:12px;
  grid-template-areas:
    "cat cat stk ord"
    "cat cat pay inv"
    "api api del del"
    "api api fra fra";}
.vtile{position:relative;overflow:hidden;border-radius:16px;border:1px solid var(--line-2);background:#000;}
.vtile video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  filter:grayscale(1) brightness(.8) contrast(1.04);transition:filter .45s ease,transform .55s ease;transform:scale(1.02);}
.vtile::after{content:"";position:absolute;left:0;right:0;bottom:0;height:75%;z-index:1;pointer-events:none;
  background:linear-gradient(0deg,rgba(0,0,0,.94) 12%,rgba(0,0,0,.5) 50%,transparent);}
.vtile:hover{border-color:rgba(255,255,255,.22);}
.vtile:hover video{filter:grayscale(0) brightness(1) contrast(1);transform:scale(1.06);}
.vlab{position:absolute;left:18px;right:18px;bottom:16px;z-index:2;}
.vlab .vn{font-family:'JetBrains Mono';font-size:11px;letter-spacing:.1em;color:var(--muted);}
.vlab h4{font-size:var(--f3);font-weight:600;margin-top:5px;letter-spacing:-.01em;}
.vlab p{color:var(--muted);font-size:var(--f1);line-height:1.45;margin-top:7px;text-wrap:pretty;}
.a-cat{grid-area:cat;} .a-stk{grid-area:stk;} .a-ord{grid-area:ord;}
.a-pay{grid-area:pay;} .a-inv{grid-area:inv;} .a-api{grid-area:api;}
.a-del{grid-area:del;} .a-fra{grid-area:fra;}
@media (max-width:860px){
  .vgrid{grid-template-columns:1fr 1fr;grid-auto-rows:170px;grid-template-areas:none;}
  .vtile{grid-area:auto !important;}
  .a-cat,.a-api{grid-column:span 2;}
}
@media (max-width:520px){
  .vgrid{grid-template-columns:1fr;}
  .a-cat,.a-api{grid-column:auto;}
}

/* --- module video strip (grayscale, plays on hover) --- */
.mvids{display:grid;grid-template-columns:repeat(7,1fr);gap:12px;margin-top:18px;}
.mvid{position:relative;aspect-ratio:4/5;border-radius:14px;overflow:hidden;border:1px solid var(--line);background:#000;}
.mvid video{width:100%;height:100%;object-fit:cover;display:block;
  filter:grayscale(1) brightness(.78) contrast(1.05);transition:filter .4s ease,transform .4s ease;transform:scale(1.02);}
.mvid::after{content:"";position:absolute;left:0;right:0;bottom:0;height:55%;z-index:1;pointer-events:none;
  background:linear-gradient(0deg,rgba(0,0,0,.82),transparent);}
.mvid .lab{position:absolute;left:12px;bottom:11px;z-index:2;font-size:13px;font-weight:600;letter-spacing:-.01em;color:#fff;}
.mvid:hover{border-color:rgba(255,255,255,.2);}
.mvid:hover video{filter:grayscale(0) brightness(1) contrast(1);transform:scale(1.06);}
@media (max-width:860px){.mvids{grid-template-columns:repeat(4,1fr);}}
@media (max-width:520px){.mvids{grid-template-columns:repeat(2,1fr);}}

@media (max-width:860px){
  .fbento{grid-template-columns:1fr;}
  .fc-head{padding:30px 28px 0;}
  .mk-ov,.mk-pay,.mk-gauge{left:28px;right:-30px;}
}

/* ---------- demo modal ---------- */
.modal{position:fixed;inset:0;z-index:300;display:none;align-items:center;justify-content:center;padding:24px;}
.modal.open{display:flex;}
.modal-backdrop{position:absolute;inset:0;background:rgba(4,5,8,.55);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);}
.modal-dialog{
  position:relative;z-index:1;width:min(900px,100%);max-height:90vh;overflow:auto;
  border:1px solid var(--primary-line);border-radius:22px;background:var(--surface);
  box-shadow:0 30px 80px rgba(0,0,0,.6);
}
.modal.open .modal-dialog{animation:modalIn .28s cubic-bezier(.2,.7,.2,1);}
@keyframes modalIn{from{opacity:0;transform:translateY(14px) scale(.98);}to{opacity:1;transform:none;}}
@media (prefers-reduced-motion:reduce){.modal.open .modal-dialog{animation:none;}}
.modal-close{
  position:absolute;top:14px;right:14px;z-index:3;width:38px;height:38px;border-radius:50%;
  border:1px solid var(--line-2);background:rgba(255,255,255,.06);color:var(--text);font-size:18px;
  cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s;
}
.modal-close:hover{background:rgba(255,255,255,.12);}
.modal-grid{display:grid;grid-template-columns:.9fr 1.1fr;}
.modal-grid .contact-left{padding:var(--s5);border-right:1px solid var(--line);display:flex;flex-direction:column;justify-content:center;}
.modal-grid .form{padding:var(--s4);}
body.modal-open{overflow:hidden;}

/* reveal animation */
@media (prefers-reduced-motion:no-preference){
  main > section{transition:transform .35s cubic-bezier(.2,.7,.2,1),opacity .35s ease-out;transform-origin:center center;will-change:transform,opacity;}
}
.reveal{opacity:0;transform:translateY(24px);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;transition:none;}}

/* ---------- responsive ---------- */
@media (max-width:920px){
  /* mobile: floating pill header (like desktop scrolled), consistent — no hamburger, no menu, no scroll change */
  .nav-toggle{display:none;}
  .nav-links{display:none;}
  .nav,.nav.scrolled{
    position:fixed;top:12px;left:50%;transform:translateX(-50%);
    width:calc(100% - 24px);max-width:calc(100% - 24px);height:60px;
    gap:10px;border-radius:18px;border:1px solid rgba(255,255,255,.08);
    padding:8px 8px 8px 18px;
    background:rgba(12,13,18,.62);backdrop-filter:blur(40px) saturate(180%);-webkit-backdrop-filter:blur(40px) saturate(180%);
    box-shadow:0 14px 40px rgba(0,0,0,.45);
  }
  [data-theme="light"] .nav,
  [data-theme="light"] .nav.scrolled{
    background:rgba(255,255,255,.78);border-color:rgba(0,0,0,.06);
    box-shadow:0 14px 40px rgba(0,0,0,.12);
  }
  .nav .brand{flex:0 1 auto;}
  .nav-cta{flex:0 0 auto;gap:8px;}
  .nav-cta .btn-primary{display:inline-flex;}
  .nav .brand-logo{width:88px;}
  .nav-cta .btn{padding:10px 16px;font-size:14px;}
  .lang-btn{padding:7px 10px;font-size:12px;}
  .grid-3,.grid-4,.modules,.brands,.infra,.bm,.road{grid-template-columns:1fr 1fr;}
  .def,.sec-grid,.contact-card{grid-template-columns:1fr;}
  .steps{grid-template-columns:1fr;}
  .step-col + .step-col{border-left:none;border-top:1px solid var(--line);}
  .modal-grid{grid-template-columns:1fr;}
  .modal-grid .contact-left{border-right:none;border-bottom:1px solid var(--line);}
  .console-body{grid-template-columns:1fr;}
  .console-side{flex-direction:row;flex-wrap:wrap;border-right:none;border-bottom:1px solid var(--line);}
  .contact-left{border-right:none;border-bottom:1px solid var(--line);}
  .ai{grid-template-columns:1fr;}
  .ai-core{margin:8px auto;}
  .flow .step{flex:1 1 40%;}
  .flow .step::after{display:none;}
  .flow-rail::before{display:none;}
}
@media (max-width:600px){
  .wrap{padding:0 18px;}
  .grid-3,.grid-4,.modules,.brands,.infra,.bm,.road,.grid-2,.ps{grid-template-columns:1fr;}
  .ps{border:none;}
  .ps .col{border:1px solid var(--line);border-radius:16px;margin-bottom:14px;}
  .ps .col.sol{border-left:1px solid var(--line);}
  .fgrid{grid-template-columns:1fr;}
  .road::before{display:none;}
  .band{padding:var(--s5) 0;}
  .hero{padding:120px 0 70px;}
  /* mobile: video fills full width as background (no right-shift gap, no box) */
  .hero-bg video{transform:none;object-position:center;}
  .footer-card{grid-template-columns:1fr;}
  .f-cols{justify-content:flex-start;}
  .f-status{margin-left:0;}
}

/* ====== intro statement (scroll-lit text, Apple-Music style) ====== */
.statement{padding-top:var(--s6);padding-bottom:var(--s6);}
.kicker-lbl{font-family:'JetBrains Mono';font-size:var(--f0);letter-spacing:.22em;text-transform:uppercase;color:var(--faint);margin-bottom:var(--s4);}
.rt{font-family:var(--font-display);font-weight:600;font-size:clamp(26px,3.6vw,46px);line-height:1.32;letter-spacing:-.02em;max-width:1000px;}
.rt p{margin:0;}
.rt p + p{margin-top:.7em;}
.rt .w{display:inline-block;color:#fff;opacity:.26;transition:opacity .12s linear;}
@media (prefers-reduced-motion:reduce){.rt .w{opacity:1;}}

/* ====== ecosystem tabs + interface panel ====== */
.ecos{display:grid;grid-template-columns:1fr 1.08fr;gap:var(--s5);align-items:center;}
.ecos-left .sec-head{margin-bottom:var(--s4);}
.tabs2{display:flex;flex-direction:column;}
.tab2{position:relative;display:block;width:100%;text-align:left;cursor:pointer;
  background:none;border:none;border-top:1px solid var(--line);padding:22px 0;font:inherit;color:inherit;}
.tab2:last-child{border-bottom:1px solid var(--line);}
.tab2-h{display:block;font-family:var(--font-display);font-size:var(--f4);font-weight:600;
  letter-spacing:-.01em;color:var(--faint);transition:color .3s;}
.tab2:hover .tab2-h{color:var(--muted);}
.tab2.on .tab2-h{color:var(--text);}
.tab2-d{color:var(--muted);font-size:var(--f2);line-height:1.55;max-width:440px;
  max-height:0;opacity:0;margin-top:0;overflow:hidden;
  transition:max-height .45s ease,opacity .35s ease,margin-top .45s ease;}
.tab2.on .tab2-d{max-height:200px;opacity:1;margin-top:12px;}
.ecos-right{position:relative;min-height:330px;}
.epanel{position:absolute;inset:0;opacity:0;transform:translateY(10px);pointer-events:none;
  transition:opacity .4s ease,transform .4s ease;
  border:1px solid var(--line);border-radius:18px;overflow:hidden;
  background:linear-gradient(180deg,#0d0d10,#070708);display:flex;flex-direction:column;}
.epanel.on{opacity:1;transform:none;pointer-events:auto;position:relative;}
.epanel-bar{display:flex;align-items:center;gap:7px;padding:14px 18px;border-bottom:1px solid var(--line);}
.epanel-bar .ecd{width:10px;height:10px;border-radius:50%;background:var(--surface-3);}
.epanel-bar .ect{font-family:'JetBrains Mono';font-size:12px;color:var(--faint);margin-left:8px;}
.epanel-tag{margin-left:auto;font-family:'JetBrains Mono';font-size:11px;letter-spacing:.1em;color:var(--muted);
  border:1px solid var(--line-2);border-radius:20px;padding:4px 11px;}
.epanel-body{padding:24px 26px;}
.epanel-hero{display:flex;align-items:center;gap:14px;padding-bottom:18px;margin-bottom:6px;border-bottom:1px solid var(--line);}
.epanel-ic{width:46px;height:46px;border-radius:12px;flex:none;display:flex;align-items:center;justify-content:center;
  background:var(--primary-soft);border:1px solid var(--primary-line);color:var(--primary-2);font-size:22px;}
.epanel-hero b{display:block;font-family:var(--font-display);font-size:var(--f3);font-weight:600;letter-spacing:-.01em;}
.epanel-hero span{color:var(--muted);font-size:var(--f1);}
.ecap{display:flex;gap:13px;align-items:flex-start;padding:15px 0;border-bottom:1px solid var(--line);}
.ecap:last-child{border-bottom:none;}
.ecap > i{color:var(--primary-2);font-size:17px;margin-top:2px;flex:none;}
.ecap b{display:block;font-weight:600;font-size:var(--f2);}
.ecap span{color:var(--muted);font-size:var(--f1);line-height:1.5;}
@media (max-width:860px){
  .ecos{grid-template-columns:1fr;gap:var(--s4);}
  .ecos-right{min-height:0;}
}

/* ====== noxtica carousel ====== */
.nox{position:relative;}
.nox-vp{overflow:hidden;}
.nox-track{display:flex;gap:20px;transition:transform .55s cubic-bezier(.2,.7,.2,1);will-change:transform;}
.nox-slide{flex:0 0 86%;opacity:.3;transition:opacity .45s ease;
  border:1px solid var(--line);border-radius:22px;overflow:hidden;
  background:linear-gradient(180deg,#0d0d10,#070708);}
.nox-slide.active{opacity:1;}
.nox-in{display:grid;grid-template-columns:1fr 1fr;min-height:380px;}
.nox-left{padding:42px;display:flex;flex-direction:column;position:relative;
  background:linear-gradient(135deg,#17171c 0%,#0e0e12 52%,#08080a 100%);}
.nox-left>*{position:relative;z-index:1;}
.nox-left::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='nz'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23nz)'/%3E%3C/svg%3E");}
.nox-ic{flex:none;align-self:flex-start;display:inline-flex;align-items:center;justify-content:flex-start;
  background:none;border:none;color:var(--primary-2);font-size:30px;margin-bottom:auto;}
.nox-q{font-family:var(--font-display);font-size:clamp(22px,2.3vw,30px);font-weight:600;line-height:1.3;
  letter-spacing:-.02em;margin:30px 0;text-wrap:pretty;}
.nox-by{margin-top:auto;}
.nox-by b{display:block;font-weight:600;font-size:var(--f3);letter-spacing:-.01em;}
.nox-by span{color:var(--muted);font-size:var(--f1);}
.nox-title{font-family:var(--font-display);font-size:clamp(26px,3vw,40px);font-weight:600;letter-spacing:-.02em;line-height:1.05;margin:28px 0 14px;}
.nox-desc{color:var(--muted);font-size:clamp(16px,1.6vw,20px);line-height:1.5;text-wrap:pretty;max-width:440px;}
.nox-right-vid{padding:0;overflow:hidden;background:#000;}
.nox-right-vid video{width:100%;height:100%;object-fit:cover;
  filter:grayscale(1) brightness(.85) contrast(1.04);transition:filter .55s ease;}
.nox-slide.active .nox-right-vid video{filter:grayscale(0) brightness(1) contrast(1);}
.nox-right{position:relative;border-left:1px solid var(--line);padding:36px;
  display:flex;flex-direction:column;justify-content:center;background:#060608;}
.nox-foot{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:26px;flex-wrap:wrap;}
.nox-tabs{display:flex;gap:4px;flex-wrap:wrap;}
.nox-tabs button{background:none;border:none;font:inherit;cursor:pointer;
  color:var(--faint);font-size:var(--f2);font-weight:600;padding:8px 14px;border-radius:9px;transition:color .2s,background .2s;}
.nox-tabs button:hover{color:var(--muted);}
.nox-tabs button.on{color:var(--btn-fg);background:var(--primary);}
.nox-arrows{display:flex;gap:10px;}
.nox-arrows button{width:46px;height:46px;border-radius:50%;cursor:pointer;
  border:1px solid var(--line-2);background:rgba(255,255,255,.03);color:var(--text);
  display:flex;align-items:center;justify-content:center;font-size:18px;transition:background .2s,border-color .2s;}
.nox-arrows button:hover{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.25);}
@media (max-width:760px){
  .nox-slide{flex:0 0 92%;}
  .nox-in{grid-template-columns:1fr;}
  .nox-right{border-left:none;border-top:1px solid var(--line);}
  .nox-left{padding:30px;}
}

/* ====== noxtica accordion (HORIZONTAL expanding cards w/ animated content) ====== */
.nx{display:flex;gap:12px;height:440px;}
.nx-item{position:relative;flex:1 1 0;min-width:78px;overflow:hidden;
  border:1px solid var(--line);border-radius:20px;background:#000;
  transition:flex-grow .6s cubic-bezier(.2,.7,.2,1),border-color .3s;}
.nx-item.open{flex-grow:6;border-color:rgba(255,255,255,.16);}

/* collapsed rail (vertical) */
.nx-tab{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;
  padding:26px 0;gap:16px;cursor:pointer;}
.nx-tab .nx-ic{font-size:24px;color:var(--primary-2);flex:none;}
.nx-vtitle{writing-mode:vertical-rl;transform:rotate(180deg);margin-bottom:auto;white-space:nowrap;
  font-family:var(--font-display);font-size:var(--f3);font-weight:600;letter-spacing:-.01em;color:var(--text);}
.nx-tab .nx-idx{font-family:'JetBrains Mono';font-size:12px;color:var(--faint);}
.nx-item.open .nx-tab{opacity:0;pointer-events:none;transition:opacity .25s;}

/* open panel */
.nx-panel{position:absolute;inset:0;display:flex;align-items:center;padding:36px;opacity:0;transition:opacity .25s ease;}
.nx-item.open .nx-panel{opacity:1;transition:opacity .5s ease .2s;}
.nx-grid{display:grid;grid-template-columns:1fr 1fr;gap:38px;align-items:center;width:100%;}
.nx-ic{display:flex;}
.nx-phead{display:flex;align-items:center;gap:14px;margin-bottom:22px;}
.nx-phead .nx-ic{font-size:26px;color:var(--primary-2);flex:none;}
.nx-phead h3{font-family:var(--font-display);font-size:var(--f4);font-weight:600;letter-spacing:-.01em;}
.nx-phead span{color:var(--muted);font-size:var(--f1);display:block;}
.nx-q{font-family:var(--font-display);font-size:clamp(19px,1.8vw,26px);font-weight:600;line-height:1.32;letter-spacing:-.02em;text-wrap:pretty;}
.nx-right{position:relative;}
.nx-right .gauge{margin:0 auto;}
.nx-right .mk-gauges{display:flex;gap:clamp(12px,2.4vw,34px);justify-content:center;}
/* entrance animations gated on .open */
@keyframes nxArc{from{stroke-dashoffset:283;}}
@keyframes nxRing{from{stroke-dashoffset:327;}}
@keyframes nxRow{from{opacity:0;transform:translateY(10px);}}
@keyframes nxPop{from{opacity:0;transform:scale(.9);}}
.nx-item.open .nx-arc{animation:nxArc 1.1s cubic-bezier(.3,.8,.3,1) both .15s;}
.nx-item.open .mk-gring circle.fg{animation:nxRing 1.1s cubic-bezier(.3,.8,.3,1) both .15s;}
.nx-item.open .mk-gring{animation:nxPop .5s ease both .2s;}
.nx-item.open .signal,.nx-item.open .oc{animation:nxRow .5s ease both;}
.nx-item.open .signal:nth-child(1),.nx-item.open .oc:nth-child(1){animation-delay:.25s;}
.nx-item.open .signal:nth-child(2),.nx-item.open .oc:nth-child(2){animation-delay:.33s;}
.nx-item.open .signal:nth-child(3),.nx-item.open .oc:nth-child(3){animation-delay:.41s;}
.nx-item.open .signal:nth-child(4){animation-delay:.49s;}
.nx-item.open .gauge .val b{animation:nxPop .6s ease both .3s;}
@media (max-width:760px){
  .nx{flex-direction:column;height:auto;}
  .nx-item{flex:none;min-width:0;}
  .nx-tab{display:none;}
  .nx-panel{position:relative;opacity:1;padding:26px;}
  .nx-grid{grid-template-columns:1fr;gap:22px;}
}
@media (prefers-reduced-motion:reduce){
  .nx-item.open .nx-arc,.nx-item.open .mk-gring circle.fg,.nx-item.open .signal,.nx-item.open .oc,.nx-item.open .mk-gring,.nx-item.open .gauge .val b{animation:none;}
}

/* ecosystem right — clean themed card */
.ecos-right .epanel{padding:34px;}
.ep-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px;}
.ep-ic{width:54px;height:54px;border-radius:14px;flex:none;display:flex;align-items:center;justify-content:center;background:var(--primary-soft);border:1px solid var(--primary-line);color:var(--primary-2);font-size:26px;}
.ep-badge{font-family:'JetBrains Mono';font-size:11px;letter-spacing:.12em;color:var(--muted);border:1px solid var(--line-2);border-radius:20px;padding:6px 13px;}
.ep-title{font-family:var(--font-display);font-size:var(--f4);font-weight:600;letter-spacing:-.01em;}
.ep-sub{color:var(--muted);font-size:var(--f2);margin-top:9px;line-height:1.5;}
.ep-feats{margin-top:24px;border-top:1px solid var(--line);}
.ep-feat{display:flex;gap:13px;align-items:flex-start;padding:16px 0;border-bottom:1px solid var(--line);}
.ep-feat:last-child{border-bottom:none;}
.ep-feat>i{color:var(--primary-2);font-size:17px;margin-top:2px;flex:none;}
.ep-feat b{display:block;font-weight:600;font-size:var(--f2);}
.ep-feat span{color:var(--muted);font-size:var(--f1);line-height:1.5;margin-top:2px;}

/* ecosystem: chart-supported 2×2 bento */
.eco-bento{display:flex;flex-direction:column;gap:18px;}
.eco-row{display:grid;gap:18px;}
.eco-row.r1{grid-template-columns:1fr 1fr;}
.eco-row.r2{grid-template-columns:1.55fr 1fr;}
.eco-card{position:relative;border:1px solid var(--line);border-radius:20px;background:linear-gradient(180deg,#0d0d10,#080809);overflow:hidden;}
.eco-txt h3{font-family:var(--font-display);font-size:var(--f4);font-weight:600;letter-spacing:-.01em;}
.eco-txt p{color:var(--muted);font-size:var(--f2);line-height:1.5;margin-top:10px;}
.eco-h{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:32px;min-height:206px;}
.eco-h .eco-txt{max-width:55%;}
.eco-h .eco-art{flex:none;}
.eco-v{display:flex;flex-direction:column;padding:32px;min-height:330px;}
.eco-v .eco-txt p{max-width:46ch;}
.eco-v .eco-art{margin-top:auto;}

/* 1 · supplier icon cluster */
.eco-cluster{display:flex;align-items:center;}
.eco-cluster .cl{width:58px;height:58px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:25px;color:#fff;border:1px solid var(--line-2);margin-left:-15px;box-shadow:0 6px 18px rgba(0,0,0,.45);}
.eco-cluster .cl:first-child{margin-left:0;}
.eco-cluster .b1{background:#1f2a4d;color:#7aa2ff;}
.eco-cluster .b2{background:#2a1f4d;color:#b69cff;}
.eco-cluster .b3{background:#10302b;color:#5fe3c6;}
.eco-cluster .b4{background:#2c2333;color:#d3a8ff;}
.eco-cluster .more{font-family:var(--font-display);font-size:15px;font-weight:600;color:var(--muted);background:var(--surface);}

/* 2 · bar chart */
.eco-bars{display:flex;align-items:flex-end;gap:11px;height:120px;border-bottom:1px dashed var(--line-2);}
.eco-bars span{width:26px;height:var(--h);border-radius:7px 7px 3px 3px;background:var(--surface-3);}
.eco-bars span.hl{background:linear-gradient(180deg,#a78bfa,#7c3aed);}

/* 3 · line chart */
.eco-chart{position:relative;height:170px;}
.eco-line{width:100%;height:100%;display:block;overflow:visible;}
.eco-line .ln{fill:none;stroke-width:2.5;stroke-linecap:round;}
.eco-line .muted{stroke:rgba(255,255,255,.22);}
.eco-line .accent{stroke:#8B5CF6;filter:drop-shadow(0 0 10px rgba(139,92,246,.5));}
.eco-node{position:absolute;left:79%;top:33%;width:13px;height:13px;border-radius:50%;background:#fff;border:3px solid #8B5CF6;transform:translate(-50%,-50%);box-shadow:0 0 0 4px rgba(139,92,246,.18);}
.eco-tip{position:absolute;left:58%;top:0;display:flex;flex-direction:column;gap:1px;background:var(--surface-2);border:1px solid var(--line-2);border-radius:11px;padding:8px 13px;z-index:2;}
.eco-tip b{font-size:13px;}
.eco-tip span{font-size:11px;color:var(--muted);}

/* 4 · channel-model list */
.eco-rows{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:14px;background:var(--bg-2);overflow:hidden;}
.eco-li{display:flex;align-items:center;gap:13px;padding:15px 16px;border-top:1px solid var(--line);}
.eco-li:first-child{border-top:none;}
.eco-dot{width:9px;height:9px;border-radius:50%;flex:none;}
.eco-dot.b2b{background:#3B82F6;} .eco-dot.b2c{background:#8B5CF6;} .eco-dot.c2c{background:#2DD4BF;}
.eco-lt{flex:1;}
.eco-lt b{display:block;font-size:var(--f2);font-weight:600;}
.eco-lt span{font-size:var(--f1);color:var(--muted);}
.eco-tag{font-family:'JetBrains Mono';font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);border:1px solid var(--line-2);border-radius:20px;padding:5px 11px;}

@media (max-width:860px){
  .eco-row.r1,.eco-row.r2{grid-template-columns:1fr;}
  .eco-h{min-height:0;flex-direction:column;align-items:flex-start;gap:24px;}
  .eco-h .eco-txt{max-width:none;}
  .eco-h .eco-art{align-self:flex-start;}
  .eco-v{min-height:0;}
  .eco-cluster{flex-wrap:wrap;}
}

/* node-graph: DAEP mark + flowing lines */
.pcore-logo{width:46px;height:auto;display:block;}
.pw{stroke-dasharray:16 12;animation:pwflow 1.1s linear infinite;}
@keyframes pwflow{to{stroke-dashoffset:-28;}}
@media (prefers-reduced-motion:reduce){.pw{animation:none;stroke-dasharray:none;}}

/* top-categories spacing + fill icons */
.mk-src-row + .mk-src-row{margin-top:7px;}
.mk-mg i{font-size:13px;line-height:1;}

/* noxtica carousel: animate active slide right-side info */
.nox-slide .gauge path[stroke^="url"],.nox-slide .mk-gring circle.fg,.nox-slide .signal,.nox-slide .oc,.nox-slide .mk-gring,.nox-slide .gauge .val b{opacity:0;}
.nox-slide.active .gauge path[stroke^="url"]{opacity:1;animation:nxArc 1.2s cubic-bezier(.3,.8,.3,1) both .1s;}
.nox-slide.active .mk-gring circle.fg{opacity:1;animation:nxRing 1.2s cubic-bezier(.3,.8,.3,1) both .1s;}
.nox-slide.active .mk-gring{opacity:1;animation:nxPop .5s ease both .15s;}
.nox-slide.active .signal,.nox-slide.active .oc{opacity:1;animation:nxRow .5s ease both;}
.nox-slide.active .signal:nth-child(1),.nox-slide.active .oc:nth-child(1){animation-delay:.15s;}
.nox-slide.active .signal:nth-child(2),.nox-slide.active .oc:nth-child(2){animation-delay:.24s;}
.nox-slide.active .signal:nth-child(3),.nox-slide.active .oc:nth-child(3){animation-delay:.33s;}
.nox-slide.active .signal:nth-child(4){animation-delay:.42s;}
.nox-slide.active .gauge .val b{opacity:1;animation:nxPop .6s ease both .2s;}
@media (prefers-reduced-motion:reduce){
  .nox-slide .gauge path[stroke^="url"],.nox-slide .mk-gring circle.fg,.nox-slide .signal,.nox-slide .oc,.nox-slide .mk-gring,.nox-slide .gauge .val b{opacity:1;animation:none;}
}

/* features carousel variant: full-width slides, pure-black cards, tabs on top */
.nox-full{display:flex;flex-direction:column;}
.nox-full .nox-foot{order:-1;margin-top:0;margin-bottom:26px;}
.nox-full .nox-slide{flex:0 0 100%;opacity:1;background:#000;}
.nox-full .nox-right{background:#000;}

/* features 2-top + 1 full-width-bottom */
.f-fra{grid-column:1 / -1;}
.fbento-2 .fcard{display:flex;flex-direction:column;}
.f-cat .fc-mock,.f-pay .fc-mock{min-height:380px;}
.f-fra .fc-mock{min-height:230px;}

/* ecosystem accordion: panel as centered block; collapsed labels horizontal */
#ecosAcc .nx-panel{align-items:center;}
#ecosAcc .ep-wrap{width:100%;}
.nx-vtitle{writing-mode:horizontal-tb;transform:none;text-align:center;}

/* node-graph destination cards: no fill */
.pdest{background:transparent;border-radius:var(--r-pill);}

/* header language dropdown */
.lang{position:relative;}
.lang-btn{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.04);border:1px solid var(--line-2);color:var(--text);font:inherit;font-size:13px;font-weight:600;padding:8px 12px;border-radius:11px;cursor:pointer;}
.lang-btn i{font-size:12px;color:var(--muted);transition:transform .2s;}
.lang.open .lang-btn i{transform:rotate(180deg);}
.lang-menu{position:absolute;top:calc(100% + 8px);right:0;min-width:158px;background:rgba(12,13,18,.94);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid var(--line-2);border-radius:14px;padding:6px;display:none;flex-direction:column;gap:2px;z-index:200;box-shadow:0 18px 50px rgba(0,0,0,.5);}
.lang.open .lang-menu{display:flex;}
.lang-menu button{background:none;border:none;text-align:left;font:inherit;font-size:14px;color:var(--muted);padding:9px 12px;border-radius:9px;cursor:pointer;}
.lang-menu button:hover{background:rgba(255,255,255,.06);color:var(--text);}
.lang-menu button.on{color:var(--text);background:rgba(255,255,255,.05);}

/* infra: extension cards */
.ext-top{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;margin-bottom:var(--s5);flex-wrap:wrap;}
.ext-tabs{display:inline-flex;gap:2px;padding:4px;border:1px solid var(--line-2);border-radius:var(--r-pill);background:rgba(255,255,255,.03);}
.ext-tabs button{background:none;border:none;font:inherit;cursor:pointer;color:var(--muted);font-size:var(--f1);font-weight:500;padding:8px 16px;border-radius:24px;transition:color .2s,background .2s;}
.ext-tabs button:hover{color:var(--text);}
.ext-tabs button.on{background:rgba(255,255,255,.08);color:var(--text);}
.ext-vp{overflow:hidden;}
.ext-cards{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 42px)/4);gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-ms-overflow-style:none;padding:14px 0 12px;}
.ext-cards::-webkit-scrollbar{display:none;}
.ext-card{scroll-snap-align:start;}
.ext-arrows{display:flex;gap:10px;flex:none;}
.ext-arrows button{width:46px;height:46px;border-radius:50%;cursor:pointer;border:1px solid var(--line-2);background:rgba(255,255,255,.03);color:var(--text);display:flex;align-items:center;justify-content:center;font-size:18px;transition:background .2s,border-color .2s;}
.ext-arrows button:hover{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.25);}
.ec-orange::before{background:radial-gradient(closest-side,#FF8A3D,transparent);}
.ec-amber::before{background:radial-gradient(closest-side,#FFB020,transparent);}
.ec-red::before{background:radial-gradient(closest-side,#FF4D5F,transparent);}
.ext-diamond{width:96px;height:96px;margin:0 auto;align-self:center;border-radius:14px;transform:rotate(45deg);background:linear-gradient(135deg,#1a2740,#0a0d16);box-shadow:0 0 50px rgba(47,107,255,.5),inset 0 0 0 1px rgba(120,160,255,.5);}
.ext-card{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:22px;background:#0a0a0d;padding:26px;min-height:380px;display:flex;flex-direction:column;transition:transform .25s,border-color .25s;}
.ext-card:hover{transform:translateY(-4px);border-color:rgba(255,255,255,.16);}
.ext-card::after{content:"";position:absolute;inset:0;border-radius:22px;padding:1px;z-index:2;pointer-events:none;opacity:0;transition:opacity .3s;
  background:radial-gradient(200px circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.7),rgba(255,255,255,.08) 45%,transparent 70%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;
  mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;}
.ext-card:hover::after{opacity:1;}
.ext-card::before{content:"";position:absolute;left:50%;bottom:-34%;width:170%;height:86%;transform:translateX(-50%);border-radius:50%;pointer-events:none;z-index:0;filter:blur(44px);opacity:.55;}
.ec-blue::before{background:radial-gradient(closest-side,#2F6BFF,transparent);}
.ec-purple::before{background:radial-gradient(closest-side,#8B5CF6,transparent);}
.ec-green::before{background:radial-gradient(closest-side,#1ED184,transparent);}
.ec-violet::before{background:radial-gradient(closest-side,#A855F7,transparent);}
.ext-card>*{position:relative;z-index:1;}
.ext-h{display:flex;align-items:center;gap:12px;}
.ext-ic{width:42px;height:42px;border-radius:12px;flex:none;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.06);border:1px solid var(--line-2);}
.ext-ic .mq-logo{width:24px;height:24px;}
.ext-ic i{font-size:22px;color:var(--primary-2);}
.ext-h b{font-size:var(--f3);font-weight:600;letter-spacing:-.01em;}
.ext-go{margin-left:auto;flex:none;width:30px;height:30px;border-radius:9px;display:flex;align-items:center;justify-content:center;border:1px solid var(--line-2);background:rgba(255,255,255,.04);color:var(--muted);font-size:14px;}
.ext-d{color:var(--muted);font-size:var(--f2);line-height:1.5;margin-top:18px;}
.ext-vis{margin-top:auto;height:150px;position:relative;display:flex;align-items:flex-end;justify-content:center;}
.ext-arcs{width:100%;height:100%;}
.ext-layers{display:flex;flex-direction:column;gap:10px;width:100%;align-self:center;}
.ext-layers span{height:26px;border-radius:8px;background:rgba(255,255,255,.08);border:1px solid var(--line-2);}
.ext-layers span:nth-child(2){margin:0 14px;background:rgba(255,255,255,.12);}
.ext-layers span:nth-child(3){margin:0 28px;}
.ext-chart{width:100%;height:110px;}
.ext-bars{display:flex;align-items:flex-end;gap:8px;height:110px;width:100%;}
.ext-bars span{flex:1;height:var(--h);border-radius:4px 4px 0 0;background:linear-gradient(180deg,rgba(255,255,255,.5),rgba(255,255,255,.08));}
@media (max-width:860px){.ext-cards{grid-auto-columns:calc((100% - 14px)/2);}}
@media (max-width:520px){.ext-cards{grid-auto-columns:88%;}}

/* features: modules — image coverflow carousel */
.mcar{position:relative;margin-top:var(--s5);}
.mcar-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;
  scrollbar-width:none;-ms-overflow-style:none;border-top:1px solid var(--line);
  -webkit-mask-image:linear-gradient(to right,transparent 0,#000 7%,#000 93%,transparent 100%);
  mask-image:linear-gradient(to right,transparent 0,#000 7%,#000 93%,transparent 100%);}
.mcar-track::-webkit-scrollbar{display:none;}
.mcard{position:relative;flex:0 0 calc((100% - 2px)/3.15);min-width:0;scroll-snap-align:start;
  display:flex;flex-direction:column;padding:34px 32px 6px;border-left:1px solid var(--line);transition:background .3s ease;}
.mcard:first-child{border-left:none;}
.mcard>*{position:relative;z-index:1;}
/* hover: subtle background + grayscale noise */
.mcard:hover{background:rgba(255,255,255,.03);}
.mcard::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:0;transition:opacity .3s ease;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='nm'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23nm)'/%3E%3C/svg%3E");}
.mcard:hover::before{opacity:.06;}
/* hover: border lights up where the cursor is */
.mcard::after{content:"";position:absolute;inset:0;border-radius:14px;padding:1px;z-index:4;pointer-events:none;opacity:0;transition:opacity .3s;
  background:radial-gradient(190px circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.75),rgba(255,255,255,.08) 45%,transparent 70%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;
  mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;}
.mcard:hover::after{opacity:1;}
.mcard-fig{font-family:'JetBrains Mono';font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--faint);}
.mcard-img{height:240px;display:flex;align-items:center;justify-content:center;margin:6px 0 30px;}
.mcard-img img{max-width:64%;max-height:100%;width:auto;height:auto;object-fit:contain;mix-blend-mode:screen;}
.mcard-svg{position:relative;display:block;height:100%;aspect-ratio:1/1;margin:0 auto;}
.mcard-svg .msvg-base,.mcard-svg .msvg-glow{position:absolute;inset:0;}
.mcard-svg svg{width:100%;height:100%;display:block;overflow:visible;}
.mcard-svg svg path{stroke-width:8;}
/* dim base */
.mcard-svg .msvg-base svg path{stroke:#212227;}
.mcard-svg .msvg-base svg path[fill]:not([fill="none"]){fill:#212227;}
/* bright layer revealed only around the cursor (50% dimmer than before) */
.mcard-svg .msvg-glow svg path{stroke:#676970;}
.mcard-svg .msvg-glow svg path[fill]:not([fill="none"]){fill:#676970;}
/* keep the primary-coloured accent paths from being flattened to the base/glow tone */
.mcard-svg svg path[fill="var(--primary)"]{fill:var(--primary)!important;stroke:var(--primary)!important;}
.mcard-svg .msvg-glow{opacity:0;transition:opacity .3s ease;
  -webkit-mask:radial-gradient(circle 95px at var(--mx,50%) var(--my,50%),#000 0%,rgba(0,0,0,.45) 52%,transparent 74%);
  mask:radial-gradient(circle 95px at var(--mx,50%) var(--my,50%),#000 0%,rgba(0,0,0,.45) 52%,transparent 74%);}
.mcard:hover .mcard-svg .msvg-glow{opacity:1;}
.mcard h4{font-family:var(--font-display);font-size:var(--f3);font-weight:600;letter-spacing:-.01em;}
.mcard p{color:var(--muted);font-size:var(--f2);line-height:1.55;margin-top:10px;max-width:34ch;}

.mcar-nav{position:absolute;top:170px;transform:translateY(-50%);z-index:5;
  width:46px;height:46px;border-radius:50%;border:1px solid var(--line-2);background:rgba(10,11,16,.6);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  color:var(--text);font-size:18px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s,border-color .2s;}
.mcar-nav:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.28);}
.mcar-nav.prev{left:8px;}
.mcar-nav.next{right:8px;}

@media (max-width:860px){
  .mcard{flex-basis:calc((100% - 1px)/1.55);padding:26px 22px 6px;}
  .mcard-img{height:180px;margin-bottom:22px;}
  .mcar-nav{top:140px;}
}

/* features: editorial bento */
.ebento{display:grid;grid-template-columns:1.5fr 1fr;gap:14px;align-items:stretch;}
.eb-left{display:flex;flex-direction:column;gap:14px;}
.eb{border:1px solid var(--line);border-radius:24px;background:linear-gradient(180deg,#0d0d10,#070708);padding:34px;}
.eb-hero{flex:1;display:flex;flex-direction:column;justify-content:center;}
.eb-h{font-family:var(--font-display);font-size:clamp(30px,4vw,50px);font-weight:700;letter-spacing:-.03em;line-height:1.02;}
.eb-h em{color:var(--primary-2);font-style:normal;}
.eb-sub{color:var(--muted);font-size:var(--f2);margin-top:18px;max-width:440px;line-height:1.5;}
.eb-cta{align-self:flex-start;margin-top:26px;}
.eb-bottom{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.eb-quote{display:flex;flex-direction:column;min-height:210px;}
.eb-quote .qm{font-size:26px;color:var(--faint);}
.eb-quote p{font-family:var(--font-display);font-size:var(--f3);font-weight:600;line-height:1.3;margin-top:14px;}
.eb-quote .eb-tag{margin-top:auto;font-family:'JetBrains Mono';font-size:12px;letter-spacing:.1em;color:var(--faint);padding-top:18px;}
.eb-channels{display:flex;flex-direction:column;min-height:210px;}
.eb-channels h3{font-family:var(--font-display);font-size:var(--f3);font-weight:600;line-height:1.25;}
.eb-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:16px;}
.eb-chips span{font-family:'JetBrains Mono';font-size:11px;color:var(--muted);border:1px solid var(--line-2);border-radius:20px;padding:5px 10px;}
.eb-link{display:inline-flex;align-items:center;gap:7px;margin-top:auto;padding-top:18px;color:var(--text);font-size:var(--f2);font-weight:500;}
.eb-link i{font-size:14px;color:var(--muted);transition:transform .2s;}
.eb-link:hover i{transform:translateX(3px);}
.eb-img{padding:0;overflow:hidden;position:relative;min-height:470px;}
.eb-img img{width:100%;height:100%;object-fit:cover;display:block;}
@media (max-width:860px){.ebento{grid-template-columns:1fr;}.eb-img{min-height:280px;}.eb-bottom{grid-template-columns:1fr;}}
.fgrid8{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.fmod{border:1px solid var(--line);border-radius:18px;background:linear-gradient(180deg,#0d0d10,#070708);padding:22px;display:flex;flex-direction:column;min-height:188px;transition:border-color .25s,transform .25s;}
.fmod:hover{border-color:rgba(255,255,255,.18);transform:translateY(-3px);}
.fmod-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:auto;}
.fmod-ic{width:46px;height:46px;border-radius:13px;display:flex;align-items:center;justify-content:center;background:var(--primary-soft);border:1px solid var(--primary-line);color:var(--primary-2);font-size:22px;}
.fmod-n{font-family:'JetBrains Mono';font-size:12px;color:var(--faint);}
.fmod h4{font-family:var(--font-display);font-size:var(--f3);font-weight:600;letter-spacing:-.01em;margin-top:20px;}
.fmod p{color:var(--muted);font-size:var(--f1);line-height:1.45;margin-top:7px;text-wrap:pretty;}
@media (max-width:860px){.fgrid8{grid-template-columns:repeat(2,1fr);}}
@media (max-width:520px){.fgrid8{grid-template-columns:1fr;}}

/* ===== mobile (≤768) section reworks ===== */
@media (max-width:768px){
  /* 1) Steps — horizontal swipe carousel; the in-view card auto-plays its demo */
  #overview .steps{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
    scrollbar-width:none;border:none;background:none;border-radius:0;gap:14px;scroll-padding-left:0;}
  #overview .steps::-webkit-scrollbar{display:none;}
  #overview .step-col{flex:0 0 78%;scroll-snap-align:start;border:1px solid var(--line);border-radius:18px;background:var(--bg-2);padding:24px 22px;}
  #overview .step-mock{min-height:150px;margin-bottom:18px;}
  #overview .steps-dots{display:flex;justify-content:flex-start;gap:8px;margin:0 0 18px;}
  #overview .steps-dot{width:22px;height:3px;padding:0;border:none;border-radius:2px;cursor:pointer;
    background:rgba(255,255,255,.18);transition:background .25s,width .25s;}
  #overview .steps-dot.on{background:var(--text);width:34px;}

  /* 2) Modules — 2-up card grid, no carousel/arrows/drag */
  #features .mcar-nav{display:none;}
  #features .mcar-track{display:grid;grid-template-columns:1fr 1fr;gap:12px;overflow:visible;border-top:none;
    -webkit-mask-image:none;mask-image:none;}
  #features .mcard{border:1px solid var(--line);border-radius:16px;padding:18px 15px;scroll-snap-align:none;min-width:0;}
  #features .mcard-img{height:108px;margin:4px 0 14px;}
  #features .mcard-img img{max-width:82%;}
  #features .mcard h4{font-size:var(--f3);}
  #features .mcard p{font-size:12.5px;max-width:none;}
  #features .mcard-fig{font-size:10px;}

  /* 3) Ecosystem — single column, low-height compact cards */
  #ecosystem .eco-row.r1,#ecosystem .eco-row.r2{grid-template-columns:1fr;gap:12px;}
  #ecosystem .eco-h{flex-direction:row;align-items:center;justify-content:space-between;min-height:0;padding:18px;gap:16px;}
  #ecosystem .eco-h .eco-txt{max-width:60%;}
  #ecosystem .eco-v{min-height:0;padding:18px;gap:14px;}
  #ecosystem .eco-v .eco-txt p{max-width:none;}
  #ecosystem .eco-txt h3{font-size:var(--f3);}
  #ecosystem .eco-txt p{font-size:12.5px;line-height:1.45;}
  #ecosystem .eco-cluster .cl{width:40px;height:40px;font-size:17px;margin-left:-12px;}
  #ecosystem .eco-cluster .more{font-size:11px;}
  #ecosystem .eco-bars{height:58px;gap:8px;}
  #ecosystem .eco-bars span{width:16px;}
  #ecosystem .eco-chart{height:84px;}
  #ecosystem .eco-tip{display:none;}
  #ecosystem .eco-li{padding:9px 11px;}

  /* 4) Noxtica — drop the tab buttons; navigate by dragging (arrows kept) */
  #fraud .nox-tabs{display:none;}
  #fraud .nox-foot{justify-content:flex-end;}

  /* 5) Infra — 2-up card grid, no carousel/arrows */
  #infra .ext-arrows{display:none;}
  #infra .ext-cards{display:grid;grid-auto-flow:row;grid-template-columns:1fr 1fr;grid-auto-columns:auto;
    gap:12px;overflow:visible;padding:0;}
  #infra .ext-card{min-height:0;padding:16px 14px;scroll-snap-align:none;}
  #infra .ext-card .ext-vis{display:none;}
  #infra .ext-card .ext-d{font-size:12.5px;margin-top:12px;}
  #infra .ext-ic{width:36px;height:36px;}
  #infra .ext-h b{font-size:var(--f2);}
  #infra .ext-go{display:none;}

  /* trim card heights across mobile sections */
  #features .mcard{padding:16px 14px;}
  #features .mcard-img{height:108px;margin:2px 0 12px;}
  #ecosystem .eco-h,#ecosystem .eco-v{padding:16px;}
  .card,.brand-card,.eb,.fmod{padding:22px;}
}


/* ============================================================
   LIGHT THEME  (toggled via <html data-theme="light">)
   ============================================================ */
[data-theme="light"]{
  --bg:#f3f4f7; --bg-2:#ffffff;
  --surface:#ffffff; --surface-2:#f1f2f5; --surface-3:#e7e9ef;
  --line:rgba(0,0,0,.10); --line-2:rgba(0,0,0,.16);
  --text:#0c0e14; --muted:#55607a; --faint:#8b94a6;
  --primary:#FFA800; --primary-2:#FFBE3D; --primary-soft:rgba(255,168,0,.12); --primary-line:rgba(255,168,0,.34);
  --btn-fg:#ffffff;
}
/* hardcoded dark surfaces → light */
[data-theme="light"] .feat-black{background:#ffffff;}
[data-theme="light"] #fraud{background:#ffffff;}
[data-theme="light"] .eco-card,
[data-theme="light"] .ext-card,
[data-theme="light"] .nox-slide,
[data-theme="light"] .eb{background:linear-gradient(180deg,#ffffff,#f3f4f7);}
[data-theme="light"] .ext-card{background:#ffffff;}
[data-theme="light"] .nox-right,
[data-theme="light"] .nox-full .nox-slide,
[data-theme="light"] .nox-full .nox-right{background:#ffffff;}
[data-theme="light"] .nox-left{background:linear-gradient(135deg,#ffffff,#eef0f4);}
[data-theme="light"] .nav.scrolled,
[data-theme="light"] .nav.open{background:rgba(255,255,255,.72);border-color:rgba(0,0,0,.06);box-shadow:0 14px 40px rgba(0,0,0,.12);}
[data-theme="light"] .modal-dialog{background:#ffffff;}
[data-theme="light"] .modal-backdrop{background:rgba(18,20,26,.42);}
[data-theme="light"] .lang-menu{background:rgba(255,255,255,.97);box-shadow:0 18px 50px rgba(0,0,0,.18);}
[data-theme="light"] .cta-video{background:#e7e9ef;}
/* light theme: slightly smaller CTA video, fade on all four edges (incl. left/right) */
[data-theme="light"] .cta-outro{
  max-width:680px;
  -webkit-mask:linear-gradient(180deg,transparent,#000 14%,#000 78%,transparent),
               linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent);
  -webkit-mask-composite:source-in;
          mask:linear-gradient(180deg,transparent,#000 14%,#000 78%,transparent),
               linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent);
          mask-composite:intersect;
}
/* the light CTA video isn't square — crop it to a 1:1 frame so there's no black area */
[data-theme="light"] .cta-outro video{aspect-ratio:1/1;height:100%;object-fit:cover;}
/* white "btn-light" buttons are invisible on the light theme — turn them into the primary blue */
[data-theme="light"] .btn-light{
  background:var(--primary);color:#fff;
  border-color:rgba(255,255,255,.22);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35);
}
[data-theme="light"] .btn-light:hover{background:var(--primary);filter:brightness(1.06);}
[data-theme="light"] .rt .w{color:#0c0e14;}                 /* scroll-lit intro words */
[data-theme="light"] .eco-line .muted{stroke:rgba(0,0,0,.20);}
[data-theme="light"] .mcard:hover{background:rgba(0,0,0,.03);}
/* carousel arrows: light surface + dark glyph on the light theme */
[data-theme="light"] .mcar-nav{background:rgba(255,255,255,.72);border-color:rgba(0,0,0,.12);color:#0c0e14;box-shadow:0 6px 18px rgba(0,0,0,.10);}
[data-theme="light"] .mcar-nav:hover{background:#ffffff;border-color:var(--primary-line);}
/* light hero overlay so dark text stays legible over the (inverted) video */
[data-theme="light"] .hero-bg::after{
  background:
    radial-gradient(82% 78% at 60% 45%,transparent 28%,rgba(255,255,255,.55) 64%,#fff 100%),
    linear-gradient(90deg,#fff 0%,rgba(255,255,255,.55) 26%,transparent 56%),
    linear-gradient(0deg,#fff 0%,rgba(255,255,255,.45) 10%,transparent 32%);
}
/* lift the black video backdrop to white for the light theme (invert), then hue-rotate +
   re-saturate so the gold/colour stays rich instead of looking washed out */
[data-theme="light"] video{filter:invert(1) hue-rotate(180deg) saturate(1.55) contrast(.96) brightness(1.03) !important;}
/* hero & CTA use purpose-shot light videos, so they need no inversion */
[data-theme="light"] #heroVideo,
[data-theme="light"] #ctaVideo{filter:none !important;}
/* light theme swaps to a dark-lettered logo (keeps the amber accent intact) via JS, no invert filter */
[data-theme="light"] #cta,
[data-theme="light"] .footer{background:#ffffff;}
/* supplier avatar circles: light tinted backgrounds in the light theme */
[data-theme="light"] .eco-cluster .b1{background:#e7eeff;color:#4f74e0;}
[data-theme="light"] .eco-cluster .b2{background:#efe9ff;color:#7c5ce0;}
[data-theme="light"] .eco-cluster .b3{background:#e1f6ef;color:#1ba07f;}
[data-theme="light"] .eco-cluster .b4{background:#f4eafe;color:#a45fe0;}
[data-theme="light"] .eco-cluster .more{background:#ffffff;color:var(--muted);box-shadow:inset 0 0 0 1px var(--line-2);}
