/* ============================================================
   MOXO Technology — SaaS showcase, dark hi-tech
   ============================================================ */

:root{
  --bg:#07080C; --surface:#0E1017; --surface-2:#151824;
  --glass:rgba(255,255,255,.045); --glass-strong:rgba(255,255,255,.08);
  --ink:#F2F4F9; --ink-soft:#A6AEBF; --ink-faint:#666E7E;
  --line:rgba(255,255,255,.09); --line-strong:rgba(255,255,255,.16);
  --brand:#FF6A33; --brand-2:#FF9A5C;
  --verified:#2BE3A6; --verified-soft:rgba(43,227,166,.14);
  --pending:#F2B94E; --pending-soft:rgba(242,185,78,.14);
  --r:26px; --r-sm:18px;
}

.showcase.c-sentinel{--accent:#5B6FFF; --accent-2:#8D9AFF;}
.showcase.c-guanina{--accent:#FF3D93; --accent-2:#FF7FB8;}
.showcase.c-smartdrive{--accent:#FF8A2E; --accent-2:#FFB169;}
.showcase.c-dealhunter{--accent:#1FE0A0; --accent-2:#6BF0C0;}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);font-family:"Satoshi","IBM Plex Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; -webkit-font-smoothing:antialiased; overflow-x:hidden; max-width:100vw;}
a{color:inherit; text-decoration:none}
img{max-width:100%}
button{font:inherit}
::selection{background:var(--brand); color:#0B0A08;}
:focus-visible{outline:2px solid var(--brand); outline-offset:2px;}
@media (prefers-reduced-motion: reduce){*{scroll-behavior:auto !important; animation:none !important; transition:none !important;}}

.wrap{max-width:1180px; margin:0 auto; padding:0 24px; width:100%; position:relative; z-index:1;}
@media(max-width:560px){.wrap{padding:0 18px;}}

.eyebrow{font-family:ui-monospace,"IBM Plex Mono",monospace; font-size:11px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-faint); display:inline-flex; align-items:center; gap:9px; margin-bottom:14px;}
.eyebrow::before{content:""; width:7px; height:7px; border-radius:50%; background:var(--brand); box-shadow:0 0 10px 2px color-mix(in srgb, var(--brand) 65%, transparent);}
.showcase .eyebrow::before{background:var(--accent); box-shadow:0 0 10px 2px color-mix(in srgb, var(--accent) 65%, transparent);}

/* ---------- nav ---------- */
nav.topnav{position:sticky; top:0; z-index:50; background:color-mix(in srgb, var(--bg) 78%, transparent); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); border-bottom:1px solid var(--line);}
.topnav-row{display:flex; align-items:center; justify-content:space-between; padding:15px 0; gap:16px;}
.brand{display:flex; align-items:center; gap:10px; font-weight:700; font-size:16px; flex-shrink:0;}
.brand .mark{width:30px; height:30px; border-radius:9px; background:linear-gradient(140deg, var(--brand-2), var(--brand)); display:flex; align-items:center; justify-content:center; font-weight:800; color:#0B0A08; font-size:14px; flex-shrink:0;}
.navlinks{display:none; gap:26px; font-size:13.5px; font-weight:500; color:var(--ink-soft);}
.navlinks a:hover{color:var(--ink);}
@media(min-width:760px){.navlinks{display:flex;}}
.topnav .btn{flex-shrink:0;}
.langswitch{display:flex; gap:2px; background:var(--glass); border:1px solid var(--line); border-radius:99px; padding:2px; flex-shrink:0;}
.langbtn{font-family:ui-monospace,"IBM Plex Mono",monospace; font-size:11px; font-weight:600; letter-spacing:.03em; padding:5px 10px; border-radius:99px; border:none; background:transparent; color:var(--ink-faint); cursor:pointer; transition:background .12s ease, color .12s ease;}
.langbtn[aria-pressed="true"]{background:linear-gradient(100deg, var(--brand), var(--brand-2)); color:#100A06;}
.langbtn:not([aria-pressed="true"]):hover{color:var(--ink);}

/* ---------- buttons ---------- */
.btn{font-weight:600; font-size:13.5px; padding:11px 20px; border-radius:99px; display:inline-flex; align-items:center; gap:8px; border:1.4px solid var(--line-strong); cursor:pointer; background:transparent; color:var(--ink); transition:all .15s ease; white-space:nowrap;}
.btn.primary{background:linear-gradient(100deg, var(--brand), var(--brand-2)); color:#100A06; border-color:transparent; box-shadow:0 8px 22px -6px color-mix(in srgb, var(--brand) 65%, transparent);}
.btn.primary:hover{transform:translateY(-1px); box-shadow:0 12px 28px -6px color-mix(in srgb, var(--brand) 75%, transparent);}
.btn.ghost:hover{background:var(--glass-strong); border-color:var(--ink-faint);}
.btn svg{width:13px; height:13px;}

/* ---------- hero ---------- */
.hero{padding:56px 0 60px; position:relative; overflow:hidden;}
@media(min-width:760px){.hero{padding:96px 0 84px;}}
/* organic gradient mesh - blob-uri mari, moi, multicolore */
.hero-glow{position:absolute; z-index:0; border-radius:50%; filter:blur(90px); pointer-events:none; mix-blend-mode:screen;}
.hero-glow.g1{width:440px; height:440px; top:-160px; right:-60px; background:radial-gradient(circle, #8B5CF6, transparent 70%); opacity:.55; animation:float1 16s ease-in-out infinite;}
.hero-glow.g2{width:380px; height:380px; top:80px; left:-120px; background:radial-gradient(circle, #FF6A33, transparent 70%); opacity:.4; animation:float1 19s ease-in-out infinite reverse;}
.hero-glow.g3{width:320px; height:320px; top:260px; right:120px; background:radial-gradient(circle, #EC4899, transparent 70%); opacity:.35; animation:float1 21s ease-in-out infinite; animation-delay:-6s;}
@keyframes float1{0%,100%{transform:translate(0,0) scale(1);} 50%{transform:translate(-24px,28px) scale(1.06);}}
@media(min-width:760px){
  .hero-glow.g1{width:640px; height:640px; top:-260px; right:-120px;}
  .hero-glow.g2{width:520px; height:520px; top:100px; left:-180px;}
  .hero-glow.g3{width:420px; height:420px; top:340px; right:160px;}
}
@media(max-width:640px){.hero-glow.g3{display:none;}}

.hero-grid{position:absolute; inset:0; z-index:-1; opacity:.5; pointer-events:none; background:var(--bg);}

.hero-inner{position:relative; z-index:1; max-width:680px;}
h1.hero-title{font-weight:800; font-size:clamp(32px,6.6vw,58px); line-height:1.05; letter-spacing:-.02em; margin:0 0 20px; text-wrap:balance;}
h1.hero-title em{font-style:normal; background:linear-gradient(100deg, var(--brand), var(--brand-2)); -webkit-background-clip:text; background-clip:text; color:transparent;}
.hero-lead{font-size:16.5px; line-height:1.65; color:var(--ink-soft); max-width:58ch; margin:0 0 32px;}
.hero-lead strong{color:var(--ink); font-weight:600;}
@media(min-width:1024px){.hero-lead{font-size:18.5px; line-height:1.7; max-width:62ch;}}
.hero-cta{display:flex; gap:12px; flex-wrap:wrap; margin-bottom:48px;}

/* live status panel - vizual central al hero-ului */
.statuspanel{position:relative; z-index:1; background:linear-gradient(180deg, var(--glass-strong), var(--glass)); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); border:1px solid var(--line); border-radius:var(--r); overflow:hidden; box-shadow:0 30px 60px -30px rgba(0,0,0,.6);}
.statuspanel-head{display:flex; align-items:center; justify-content:space-between; padding:14px 20px; border-bottom:1px solid var(--line); font-family:ui-monospace,"IBM Plex Mono",monospace; font-size:11px; color:var(--ink-faint); letter-spacing:.06em; text-transform:uppercase;}
.statuspanel-head .live-pulse{display:flex; align-items:center; gap:6px; color:var(--verified);}
.statuspanel-head .live-pulse i{width:6px; height:6px; border-radius:50%; background:currentColor; animation:blip 1.8s ease-in-out infinite;}
@keyframes blip{0%,100%{opacity:1; box-shadow:0 0 0 0 currentColor;} 50%{opacity:.5; box-shadow:0 0 0 5px transparent;}}
.statusrow{display:grid; grid-template-columns:auto 1fr auto auto; align-items:center; gap:14px; padding:14px 20px; border-bottom:1px solid var(--line); transition:background .12s ease;}
.statusrow:last-child{border-bottom:none;}
.statusrow:hover{background:var(--glass);}
.statusrow .dot{width:9px; height:9px; border-radius:50%; flex-shrink:0; background:var(--accent);}
.statusrow.c-sentinel .dot{--accent:#5B6FFF; background:var(--accent);}
.statusrow.c-guanina .dot{--accent:#FF3D93; background:var(--accent);}
.statusrow.c-smartdrive .dot{--accent:#FF8A2E; background:var(--accent);}
.statusrow.c-dealhunter .dot{--accent:#1FE0A0; background:var(--accent);}
.statusrow .name{font-weight:600; font-size:14px;}
.statusrow .domain{font-size:12px; color:var(--ink-faint); display:none;}
@media(min-width:480px){.statusrow .domain{display:block;}}
.statusrow .pill{font-family:ui-monospace,"IBM Plex Mono",monospace; font-size:10px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; padding:3px 9px; border-radius:99px; white-space:nowrap;}
.pill.live{color:var(--verified); background:var(--verified-soft); border:1px solid color-mix(in srgb, var(--verified) 40%, transparent);}
.pill.dev{color:var(--pending); background:var(--pending-soft); border:1px solid color-mix(in srgb, var(--pending) 40%, transparent);}

/* stat strip */
.statstrip{display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--r-sm); overflow:hidden; margin-top:40px;}
@media(min-width:640px){.statstrip{grid-template-columns:repeat(4,1fr);}}
.stat{background:var(--surface); padding:16px 18px;}
.stat .n{font-family:ui-monospace,"IBM Plex Mono",monospace; font-weight:700; font-size:22px; background:linear-gradient(100deg,var(--brand),var(--brand-2)); -webkit-background-clip:text; background-clip:text; color:transparent; font-variant-numeric:tabular-nums;}
.stat .l{font-size:11.5px; color:var(--ink-faint); margin-top:3px;}
@media(min-width:1024px){.stat{padding:22px 24px;} .stat .n{font-size:28px;} .stat .l{font-size:12.5px;}}

/* ---------- tech marquee band ---------- */
.marquee{border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--surface); overflow:hidden; padding:18px 0; position:relative;}
.marquee::before, .marquee::after{content:""; position:absolute; top:0; bottom:0; width:80px; z-index:2; pointer-events:none;}
.marquee::before{left:0; background:linear-gradient(90deg, var(--bg), transparent);}
.marquee::after{right:0; background:linear-gradient(270deg, var(--bg), transparent);}
.marquee-track{display:flex; gap:48px; width:max-content; animation:marquee 32s linear infinite;}
.marquee-track span{font-family:ui-monospace,"IBM Plex Mono",monospace; font-size:13px; color:var(--ink-faint); white-space:nowrap; display:flex; align-items:center; gap:10px;}
.marquee-track span::before{content:""; width:5px; height:5px; border-radius:50%; background:var(--brand); opacity:.6;}
@keyframes marquee{from{transform:translateX(0);} to{transform:translateX(-50%);}}
@media(min-width:1024px){.marquee{padding:24px 0;} .marquee-track{gap:64px;} .marquee-track span{font-size:14.5px;}}

/* ---------- generic section ---------- */
.section{padding:60px 0;}
@media(min-width:760px){.section{padding:88px 0;}}
.section-head{max-width:620px; margin-bottom:36px;}
.section-head h2{font-weight:800; font-size:clamp(26px,4vw,38px); margin:0 0 12px; letter-spacing:-.02em; line-height:1.1;}
.section-head p{color:var(--ink-soft); font-size:15px; line-height:1.65; margin:0;}
@media(min-width:1024px){.section-head p{font-size:16.5px; line-height:1.7;}}
.section.tint{position:relative;}
.section.tint::before{content:""; position:absolute; inset:0; z-index:-1; background:radial-gradient(600px 340px at 15% 0%, color-mix(in srgb, var(--tint,#5B6FFF) 8%, transparent), transparent 70%);}

/* ---------- product showcase ---------- */
.showcase{padding:28px 0; position:relative;}
@media(min-width:760px){.showcase{padding:20px 0;}}

.pcard{
  background:var(--bg); border:1px solid var(--line); border-radius:28px;
  padding:20px; position:relative; overflow:hidden;
}
@media(min-width:640px){.pcard{padding:28px;}}
@media(min-width:1024px){.pcard{padding:40px;}}
.pcard::before{
  content:""; position:absolute; z-index:0; pointer-events:none; border-radius:50%; filter:blur(90px);
  width:360px; height:360px; top:-140px; right:-100px;
  background:radial-gradient(circle, var(--accent), transparent 68%); opacity:.22; mix-blend-mode:screen;
}
.showcase.rev .pcard::before{right:auto; left:-100px;}

.showcase-grid{display:grid; grid-template-columns:1fr; gap:28px; align-items:stretch; position:relative; z-index:1;}
@media(min-width:900px){
  .showcase-grid{grid-template-columns:1fr 1fr; gap:44px;}
  .showcase.rev .showcase-grid{direction:rtl;}
  .showcase.rev .showcase-grid > *{direction:ltr;}
}

/* left: glow-border visual frame, stretched to match the info column's height */
.pcard-visual{position:relative; display:flex; flex-direction:column;}
.pcard-glow{
  position:absolute; inset:-6px; border-radius:26px; z-index:0;
  background:linear-gradient(120deg, var(--accent), var(--accent-2));
  filter:blur(22px); opacity:.35; transition:opacity .5s ease;
}
.pcard-visual:hover .pcard-glow{opacity:.55;}
.pcard-frame{
  position:relative; z-index:1; flex:1; display:flex; flex-direction:column;
  background:var(--surface); border:1px solid var(--line); border-radius:22px; padding:22px; overflow:hidden;
}
.pcard-frame > *:last-child{margin-top:auto; padding-top:4px;}
.pcard-frame .sc-proof{padding-top:20px;}
@media(min-width:1024px){.pcard-frame{padding:26px;}}

.sc-kicker{font-family:ui-monospace,"IBM Plex Mono",monospace; font-size:11px; font-weight:600; color:var(--accent); letter-spacing:.1em; text-transform:uppercase; margin-bottom:12px;}
@media(min-width:1024px){.sc-kicker{font-size:12.5px; margin-bottom:16px;}}
.sc-title{display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-bottom:6px;}
.sc-title h3{
  font-weight:900; font-size:clamp(28px,4.4vw,38px); margin:0; letter-spacing:-.025em; line-height:1.05;
  text-shadow:0 0 32px color-mix(in srgb, var(--accent) 45%, transparent);
}
@media(min-width:1024px){.sc-title h3{font-size:46px;}}
.sc-status{font-family:ui-monospace,"IBM Plex Mono",monospace; font-size:10.5px; font-weight:600; letter-spacing:.05em; text-transform:uppercase; padding:4px 10px; border-radius:99px; border:1px solid; display:inline-flex; align-items:center; gap:6px;}
.sc-status.live{color:var(--verified); border-color:color-mix(in srgb, var(--verified) 45%, transparent); background:var(--verified-soft);}
.sc-status.dev{color:var(--pending); border-color:color-mix(in srgb, var(--pending) 45%, transparent); background:var(--pending-soft);}
.sc-status .dot{width:5px; height:5px; border-radius:50%; background:currentColor;}
.sc-status.live .dot{animation:blip 1.8s ease-in-out infinite;}
.sc-tagline{font-size:14px; color:var(--ink-faint); margin:0 0 18px;}
@media(min-width:1024px){.sc-tagline{font-size:16px; margin-bottom:22px;}}
.sc-pitch{font-size:15.5px; line-height:1.7; color:var(--ink-soft); margin:0 0 22px; max-width:52ch;}
.sc-pitch strong{color:var(--ink); font-weight:600;}
@media(min-width:1024px){.sc-pitch{font-size:17px; line-height:1.72; max-width:56ch;}}

.sc-callouts{display:flex; flex-direction:column; gap:10px; margin-bottom:24px;}
.sc-callout{display:flex; gap:10px; padding:12px 14px; background:var(--glass); border:1px solid var(--line); border-radius:var(--r-sm); font-size:13px; line-height:1.55; color:var(--ink-soft);}
@media(min-width:1024px){.sc-callout{padding:16px 18px; font-size:14.5px; line-height:1.6;}}
.sc-callout .tag{flex-shrink:0; font-family:ui-monospace,"IBM Plex Mono",monospace; font-size:9.5px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; padding:2px 8px; border-radius:99px; height:fit-content; white-space:nowrap;}
.sc-callout.problem .tag{color:#FF7A7A; background:rgba(255,122,122,.12);}
.sc-callout.solution .tag{color:var(--accent); background:color-mix(in srgb, var(--accent) 16%, transparent);}

/* colored category/stack pills */
.ptags{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:18px;}
.ptag{font-size:11px; font-weight:700; letter-spacing:.02em; padding:5px 13px; border-radius:99px; border:1px solid; white-space:nowrap;}
.ptag.cat{color:var(--accent); background:color-mix(in srgb, var(--accent) 12%, transparent); border-color:color-mix(in srgb, var(--accent) 30%, transparent);}
.ptag.stack{color:var(--ink-soft); background:var(--glass); border-color:var(--line);}

/* bento grid: 4 flagship features */
.pbento{display:grid; grid-template-columns:1fr; gap:12px; margin:22px 0;}
@media(min-width:480px){.pbento{grid-template-columns:1fr 1fr;}}
.pbento-item{padding:16px 18px; background:var(--glass); border:1px solid var(--line); border-radius:var(--r-sm); transition:border-color .15s ease, transform .15s ease, background .15s ease;}
.pbento-item:hover{border-color:color-mix(in srgb, var(--accent) 45%, transparent); background:color-mix(in srgb, var(--accent) 5%, var(--glass)); transform:translateY(-2px);}
.pbento-item .pi-t{display:flex; align-items:center; gap:9px; font-weight:700; font-size:14px; color:var(--ink); margin-bottom:5px;}
.pbento-item .pi-icon{font-size:16px; line-height:1;}
.pbento-item p{font-size:12.5px; color:var(--ink-soft); margin:0; line-height:1.5;}
@media(min-width:1024px){
  .pbento{gap:14px;}
  .pbento-item{padding:20px 22px;}
  .pbento-item .pi-t{font-size:15.5px;}
  .pbento-item p{font-size:13.5px; line-height:1.55;}
}

/* additional capabilities, compact chips */
.pmore-label{font-family:ui-monospace,"IBM Plex Mono",monospace; font-size:10.5px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-faint); margin-bottom:10px;}
.pmore{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:26px;}
.pmore span{font-size:12px; font-weight:500; color:var(--ink-soft); background:var(--glass); border:1px solid var(--line); border-radius:99px; padding:6px 13px; transition:border-color .15s ease, color .15s ease;}
.pmore span:hover{border-color:color-mix(in srgb, var(--accent) 45%, transparent); color:var(--ink);}

.sc-tags{display:flex; flex-wrap:wrap; gap:7px; margin-bottom:22px;}
.sc-tag{font-family:ui-monospace,"IBM Plex Mono",monospace; font-size:10.5px; color:var(--ink-faint); border:1px solid var(--line); border-radius:99px; padding:4px 11px;}
.sc-link{font-weight:600; font-size:13.5px; color:var(--accent); display:inline-flex; align-items:center; gap:7px; border-bottom:1px solid var(--accent); padding-bottom:2px;}
.sc-link:hover{opacity:.75;}
.sc-link svg{width:12px; height:12px;}

.tilt{transition:transform .15s ease-out; transform-style:preserve-3d; will-change:transform;}

/* scroll reveal (JS-driven via main.js, IntersectionObserver) */
.reveal{opacity:0; transform:translateY(26px); transition:opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1);}
.reveal.in{opacity:1; transform:translateY(0);}
.reveal-stagger > *{opacity:0; transform:translateY(18px); transition:opacity .55s ease, transform .55s ease;}
.reveal-stagger.in > *{opacity:1; transform:translateY(0);}
.reveal-stagger.in > *:nth-child(1){transition-delay:.03s;} .reveal-stagger.in > *:nth-child(2){transition-delay:.09s;}
.reveal-stagger.in > *:nth-child(3){transition-delay:.15s;} .reveal-stagger.in > *:nth-child(4){transition-delay:.21s;}
.reveal-stagger.in > *:nth-child(5){transition-delay:.27s;} .reveal-stagger.in > *:nth-child(6){transition-delay:.33s;}
.sc-visual-label{font-family:ui-monospace,"IBM Plex Mono",monospace; font-size:10px; text-transform:uppercase; letter-spacing:.08em; color:var(--ink-faint); margin-bottom:6px;}
.sc-visual-value{font-weight:700; font-size:17px; margin-bottom:20px;}

/* animated widgets */
.w-bars{display:flex; align-items:center; gap:5px; height:64px;}
.w-bars i{display:block; width:7px; background:linear-gradient(180deg,var(--accent-2),var(--accent)); border-radius:2px; animation:barwave 1.1s ease-in-out infinite;}
.w-bars i:nth-child(1){height:32%; animation-delay:-1.0s;} .w-bars i:nth-child(2){height:68%; animation-delay:-0.8s;}
.w-bars i:nth-child(3){height:46%; animation-delay:-0.6s;} .w-bars i:nth-child(4){height:98%; animation-delay:-0.4s;}
.w-bars i:nth-child(5){height:58%; animation-delay:-0.2s;} .w-bars i:nth-child(6){height:88%; animation-delay:0s;}
.w-bars i:nth-child(7){height:40%; animation-delay:-0.5s;} .w-bars i:nth-child(8){height:70%; animation-delay:-0.3s;}
.w-bars i:nth-child(9){height:26%; animation-delay:-0.9s;} .w-bars i:nth-child(10){height:60%; animation-delay:-0.15s;}
.w-bars i:nth-child(11){height:44%; animation-delay:-0.65s;} .w-bars i:nth-child(12){height:80%; animation-delay:-0.05s;}
@keyframes barwave{0%,100%{transform:scaleY(.3); opacity:.5;} 50%{transform:scaleY(1); opacity:1;}}

.w-scan{position:relative; border:1px solid var(--line); border-radius:var(--r-sm); background:var(--bg); padding:14px 16px; overflow:hidden; font-family:ui-monospace,"IBM Plex Mono",monospace; font-size:11px; color:var(--ink-faint); line-height:2;}
.w-scan div{white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.w-scan::after{content:""; position:absolute; left:0; right:0; height:26px; top:0; background:linear-gradient(180deg, transparent, color-mix(in srgb, var(--accent) 25%, transparent) 45%, color-mix(in srgb, var(--accent) 48%, transparent) 50%, color-mix(in srgb, var(--accent) 25%, transparent) 55%, transparent); animation:scandown 2.6s ease-in-out infinite;}
@keyframes scandown{0%{top:-26px;} 100%{top:100%;}}

.w-stock{display:flex; align-items:center; gap:10px; flex-wrap:wrap;}
.w-stock i{display:block; width:26px; height:26px; border:1.6px solid var(--accent); border-radius:50%; animation:stockpop 4.5s ease-in-out infinite;}
.w-stock i:nth-child(1){animation-delay:0s;} .w-stock i:nth-child(2){animation-delay:.5s;} .w-stock i:nth-child(3){animation-delay:1s;}
.w-stock i:nth-child(4){animation-delay:1.5s;} .w-stock i:nth-child(5){animation-delay:2s;} .w-stock i:nth-child(6){animation-delay:2.5s;}
.w-stock i:nth-child(7){animation-delay:3s;} .w-stock i:nth-child(8){animation-delay:3.5s;}
@keyframes stockpop{0%,60%,100%{opacity:1; background:transparent;} 66%,94%{opacity:.25; background:var(--accent);}}

.w-spark svg{width:100%; height:74px; display:block; overflow:visible;}
.w-spark-line{fill:none; stroke:url(#sparkgrad); stroke-width:2.5; stroke-linecap:round; stroke-dasharray:220; animation:sparkdraw 3.2s ease-in-out infinite;}
.sg-stop1{stop-color:var(--accent-2);}
.sg-stop2{stop-color:var(--accent);}
@keyframes sparkdraw{0%{stroke-dashoffset:220;} 55%{stroke-dashoffset:0;} 100%{stroke-dashoffset:0;}}
.w-spark-dot{fill:var(--accent); animation:sparkpulse 3.2s ease-in-out infinite;}
@keyframes sparkpulse{0%,50%{opacity:0; r:2;} 60%{opacity:1; r:6;} 75%{opacity:1; r:3.5;} 100%{opacity:1; r:3.5;}}

.sc-flow{display:flex; gap:8px; margin-top:22px; overflow-x:auto; padding-bottom:2px;}
.sc-flow-step{flex:1; min-width:96px; background:var(--glass); border:1px solid var(--line); border-radius:var(--r-sm); padding:10px 12px;}
.sc-flow-step b{display:block; font-size:11.5px; font-weight:700; margin-bottom:2px;}
.sc-flow-step span{font-size:10px; color:var(--ink-faint); line-height:1.4;}
.sc-flow-n{font-family:ui-monospace,"IBM Plex Mono",monospace; font-size:9px; color:var(--accent); font-weight:700; margin-bottom:4px; display:block;}

.sc-proof{margin-top:20px; padding-top:16px; border-top:1px dashed var(--line); display:flex; flex-direction:column; gap:8px;}
.sc-proof-row{display:flex; gap:9px; font-size:11.5px; color:var(--ink-faint); line-height:1.5;}
.sc-proof-row time{font-family:ui-monospace,"IBM Plex Mono",monospace; color:var(--accent); flex-shrink:0; font-size:10.5px;}

/* ---------- why us grid ---------- */
.whygrid{display:grid; grid-template-columns:1fr; gap:16px;}
@media(min-width:640px){.whygrid{grid-template-columns:1fr 1fr;}}
@media(min-width:960px){.whygrid{grid-template-columns:repeat(3,1fr);}}
.whycard{background:var(--glass); border:1px solid var(--line); border-radius:var(--r); padding:24px; transition:border-color .15s ease, transform .15s ease;}
.whycard:hover{border-color:color-mix(in srgb, var(--brand) 45%, transparent); transform:translateY(-2px);}
.whycard .ico{width:38px; height:38px; border-radius:10px; background:linear-gradient(140deg, var(--brand-2), var(--brand)); display:flex; align-items:center; justify-content:center; margin-bottom:16px;}
.whycard .ico svg{width:19px; height:19px; color:#100A06;}
.whycard h4{font-weight:700; font-size:15.5px; margin:0 0 8px;}
.whycard p{font-size:13px; color:var(--ink-soft); line-height:1.6; margin:0;}
.whycard p b{color:var(--ink); font-weight:600;}

/* ---------- FAQ ---------- */
.faqlist{display:flex; flex-direction:column; gap:10px;}
.faqlist details{background:var(--glass); border:1px solid var(--line); border-radius:var(--r-sm); padding:18px 20px; transition:border-color .12s ease;}
.faqlist details[open]{border-color:color-mix(in srgb, var(--brand) 40%, transparent);}
.faqlist summary{font-weight:700; font-size:15px; cursor:pointer; list-style:none; display:flex; justify-content:space-between; align-items:center; gap:16px;}
.faqlist summary::-webkit-details-marker{display:none;}
.faqlist summary .qm{color:var(--brand); font-size:18px; flex-shrink:0; transition:transform .15s ease; font-weight:400;}
.faqlist details[open] summary .qm{transform:rotate(45deg);}
.faqlist p{margin:14px 0 0; font-size:13.5px; line-height:1.65; color:var(--ink-soft);}

/* ---------- closing ---------- */
.closing{padding:64px 0 72px;}
.closing-panel{position:relative; background:linear-gradient(165deg, var(--glass-strong), var(--glass)); border:1px solid var(--line); border-radius:24px; padding:48px 32px; text-align:center; overflow:hidden;}
@media(min-width:640px){.closing-panel{padding:64px 48px;}}
.closing-panel::before{content:""; position:absolute; inset:0; z-index:0; background:radial-gradient(500px 300px at 50% 0%, color-mix(in srgb, var(--brand) 14%, transparent), transparent 70%);}
.closing-panel > *{position:relative; z-index:1;}
.closing-panel h2{font-weight:800; font-size:clamp(24px,4vw,34px); margin:0 0 14px; letter-spacing:-.02em;}
.closing-panel p{color:var(--ink-soft); font-size:14.5px; margin:0 0 26px; max-width:52ch; margin-left:auto; margin-right:auto;}

footer.sitefoot{border-top:1px solid var(--line); padding:26px 0 40px;}
.footrow{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; font-size:11.5px; color:var(--ink-faint);}
.footrow a:hover{color:var(--brand);}
.flinks{display:flex; gap:18px; flex-wrap:wrap;}