/* ═══════════════════════════════════════════
   VIROBIT — Shared Stylesheet
   Inter Display + JetBrains Mono · Terminal aesthetic, premium polish
═══════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&family=JetBrains+Mono:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,400&display=swap');

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#06080a;
  --bg2:#0a0e12;
  --bg3:#0e151a;
  --bg4:#131c23;
  --bg5:#172028;
  --border:#1a2b38;
  --border2:#243a4d;
  --accent:#00e07a;
  --accent-hot:#19e98c;
  --accent2:#00d4ff;
  --accent3:#7b61ff;
  --red:#ff5063;
  --amber:#ffbd2e;
  --adim:rgba(0,224,122,.07);
  --adim2:rgba(0,224,122,.035);
  --glow:0 0 32px rgba(0,224,122,.2);
  --glow-sm:0 0 12px rgba(0,224,122,.15);
  --glow-lg:0 0 60px rgba(0,224,122,.18);
  --gtext:0 0 20px rgba(0,224,122,.5);
  --text:#c9dccf;
  --text2:#8aab97;
  --text3:#6b8a79;
  --white:#eef6f1;
  --font:'JetBrains Mono',ui-monospace,SFMono-Regular,monospace;
  --font-display:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --max:1180px;
  --rad:10px;
  --rad-lg:14px;
  --rad-xl:18px;
  --ease:cubic-bezier(.16,1,.3,1);
  --shadow-card:0 12px 36px rgba(0,0,0,.45),0 1px 0 rgba(255,255,255,.02) inset;
  --shadow-elev:0 24px 80px rgba(0,0,0,.65),0 0 0 1px rgba(0,224,122,.04),inset 0 1px 0 rgba(255,255,255,.025);
}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--text);font-family:var(--font);font-size:14px;line-height:1.68;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden;text-rendering:optimizeLegibility}
a{color:inherit;text-decoration:none}
img{max-width:100%}

::selection{background:rgba(0,224,122,.25);color:var(--white)}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:rgba(0,224,122,.12);border-radius:10px;border:2px solid var(--bg)}
::-webkit-scrollbar-thumb:hover{background:rgba(0,224,122,.22)}

/* NOISE — much quieter */
body::after{content:'';position:fixed;inset:0;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");opacity:.012;pointer-events:none;z-index:9999;mix-blend-mode:overlay}

/* SCANLINES — barely there for texture */
body::before{content:'';position:fixed;inset:0;background:repeating-linear-gradient(0deg,transparent,transparent 3px,rgba(0,0,0,.015) 3px,rgba(0,0,0,.015) 4px);pointer-events:none;z-index:9998}

/* ── STATUS BAR ── */
.sb{background:var(--bg2);border-bottom:1px solid var(--border);height:28px;display:flex;align-items:center;justify-content:space-between;padding:0 1.5rem;font-size:.62rem;color:var(--text2);letter-spacing:.05em}
.sb-l,.sb-r{display:flex;align-items:center;gap:1.25rem}
.sb-dot{width:6px;height:6px;border-radius:50%;background:var(--accent);display:inline-block;margin-right:.4rem;animation:sbpulse 2s infinite;box-shadow:0 0 8px var(--accent)}
.sb-sep{color:var(--border2);opacity:.7}
@keyframes sbpulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.85)}}

/* ── NAV ── */
nav{position:sticky;top:0;z-index:100;background:rgba(6,8,9,.95);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--border)}
.nav-inner{max-width:var(--max);margin:0 auto;display:flex;align-items:center;height:56px;padding:0 1.5rem;gap:1.5rem}
.logo{font-size:1.05rem;font-weight:800;color:var(--white);letter-spacing:-.025em;flex-shrink:0;display:flex;align-items:center;gap:.2rem}
.logo-pr{color:var(--accent);font-weight:400;font-size:.95rem}
.logo .hi{color:var(--accent);text-shadow:var(--gtext);animation:vb-glow 2.6s ease-in-out infinite}
.logo-cur{width:8px;height:14px;background:var(--accent);display:inline-block;vertical-align:middle;margin-left:1px;animation:blink 1s step-end infinite;box-shadow:var(--glow-sm)}
@keyframes blink{0%,100%{opacity:1}50%{opacity:0}}
.logo-txt{display:inline-block;transition:color .1s;animation:vb-auto 7.5s steps(1,end) infinite}
.logo:hover .logo-txt{animation:glitch .3s steps(2) forwards}
.logo:hover .hi{animation-duration:1.1s}
@keyframes vb-glow{
  0%,100%{text-shadow:0 0 9px rgba(0,224,122,.30)}
  50%{text-shadow:0 0 18px rgba(0,224,122,.65),0 0 5px rgba(0,224,122,.45)}
}
@keyframes vb-auto{
  0%,90%,100%{transform:none;text-shadow:none;opacity:1}
  91%{transform:translateX(-1.5px);text-shadow:1.5px 0 var(--accent2),-1.5px 0 var(--red);opacity:.92}
  93%{transform:translateX(1.5px);text-shadow:-1.5px 0 var(--accent2),1.5px 0 var(--red)}
  95%{transform:translateX(-1px);text-shadow:1px 0 var(--accent),-1px 0 var(--accent2)}
  97%{transform:none;text-shadow:none}
}
@keyframes glitch{
  0%{text-shadow:none;transform:none}
  20%{text-shadow:-2px 0 var(--accent2),2px 0 var(--accent);transform:translateX(-1px)}
  40%{text-shadow:2px 0 var(--accent2),-2px 0 #ff0066;transform:translateX(1px)}
  60%{text-shadow:none;transform:none}
  80%{text-shadow:1px 0 #7b61ff,-1px 0 var(--accent);transform:translateX(-.5px)}
  100%{text-shadow:none;transform:none}
}
.skip{position:absolute;left:-999px;top:0;z-index:200;background:var(--accent);color:#04140c;padding:10px 16px;border-radius:0 0 8px 0;font-family:var(--font);font-weight:700;font-size:13px;text-decoration:none}
.skip:focus{left:0}
.doc-links .doc-soon{display:flex;align-items:center;gap:.5rem;font-size:.72rem;color:var(--text2);padding:.22rem 0;cursor:default}
.doc-links .doc-soon::after{content:'soon';font-size:.55rem;letter-spacing:.08em;text-transform:uppercase;color:var(--text3);border:1px solid var(--border);border-radius:10px;padding:.05rem .42rem;line-height:1.4}
.nav-links{display:flex;align-items:center;gap:.05rem;flex:1}
.nav-item{position:relative}
.nav-item.dd-open .dd{opacity:1;pointer-events:all;transform:translateY(0)}
.nav-a{font-size:.76rem;color:var(--text);padding:.45rem .8rem;border-radius:7px;cursor:pointer;transition:color .15s,background .15s;display:flex;align-items:center;gap:.3rem;white-space:nowrap;font-weight:500}
.nav-a::before{content:'./';color:var(--text3);font-size:.66rem;opacity:.7}
.nav-a:hover,.nav-a.active{color:var(--accent);background:var(--adim2)}
.nav-a:hover::before,.nav-a.active::before{color:var(--accent);opacity:1}
.nav-a svg{width:10px;height:10px;stroke:currentColor;fill:none;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
/* Dropdown — flush to the nav button, no hover gap at all. */
.dd{position:absolute;top:100%;left:-4px;padding:.4rem;min-width:205px;opacity:0;pointer-events:none;transform:translateY(-4px);transition:opacity .18s var(--ease),transform .18s var(--ease);background:var(--bg3);border:1px solid var(--border2);border-radius:0 0 var(--rad-lg) var(--rad-lg);box-shadow:0 20px 56px rgba(0,0,0,.7),0 0 0 1px rgba(0,224,122,.06)}
.nav-item:hover .dd,.nav-item:focus-within .dd,.nav-item.dd-open .dd{opacity:1;pointer-events:all;transform:translateY(0)}
.dd a{display:flex;align-items:center;gap:.5rem;font-size:.74rem;color:var(--text);padding:.5rem .75rem;border-radius:7px;transition:color .12s,background .12s,transform .12s var(--ease)}
.dd a::before{content:'→';color:var(--text3);font-size:.64rem;transition:transform .15s var(--ease)}
.dd a:hover,.dd a.active{color:var(--accent);background:var(--adim2)}
.dd a:hover::before{transform:translateX(2px);color:var(--accent)}
.nav-actions{margin-left:auto;display:flex;align-items:center;gap:.5rem;flex-shrink:0}

/* ── BUTTONS ── */
.btn{display:inline-flex;align-items:center;gap:.4rem;padding:.5rem 1.1rem;border-radius:8px;font-size:.74rem;font-weight:700;cursor:pointer;transition:transform .2s var(--ease),box-shadow .2s var(--ease),background .2s,color .2s,border-color .2s;border:none;font-family:var(--font);line-height:1;letter-spacing:.025em;white-space:nowrap}
.btn-ghost{background:transparent;color:var(--text);border:1px solid var(--border2)}
.btn-ghost:hover{color:var(--accent);border-color:rgba(0,224,122,.45);background:var(--adim2);box-shadow:var(--glow-sm);transform:translateY(-1px)}
.btn-green{background:linear-gradient(180deg,#00e07a 0%,#00e87a 100%);color:#031912;box-shadow:0 0 28px rgba(0,224,122,.32),0 2px 10px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.18)}
.btn-green:hover{background:linear-gradient(180deg,#1cff97 0%,#00f586 100%);box-shadow:0 0 44px rgba(0,224,122,.55),0 4px 18px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.22);transform:translateY(-1px)}
.btn-lg{padding:.72rem 1.55rem;font-size:.82rem;border-radius:10px}
.btn-xl{padding:.92rem 1.95rem;font-size:.92rem;border-radius:11px;letter-spacing:.02em}

/* ── TERMINAL WINDOW ── */
.tw{background:var(--bg3);border:1px solid var(--border);border-radius:var(--rad-lg);overflow:hidden;box-shadow:0 24px 80px rgba(0,0,0,.65),inset 0 1px 0 rgba(255,255,255,.02)}
.tw-bar{display:flex;align-items:center;padding:.55rem 1rem;background:var(--bg4);border-bottom:1px solid var(--border);gap:.45rem}
.tw-dots{display:flex;gap:5px}
.td{width:11px;height:11px;border-radius:50%}
.td-r{background:#ff5f57}.td-y{background:#ffbd2e}.td-g{background:#28ca41}
.tw-title{margin:0 auto;font-size:.62rem;color:var(--text3);letter-spacing:.06em}
.tw-body{padding:1.15rem;font-size:.7rem;line-height:1.9;color:var(--text)}
.tl{display:block}.tp{color:var(--accent);font-weight:700}.tcmd{color:var(--white);font-weight:600}
.tout{color:var(--text2);padding-left:1.1rem}
.tout.g{color:var(--accent)}.tout.r{color:var(--red)}.tout.d{color:var(--text3)}
.tcomment{color:var(--text3);font-style:italic}
.tlbl{color:var(--text3);display:inline-block;width:17ch}
.tval{color:var(--text)}.tval.g{color:var(--accent);font-weight:700}.tval.r{color:var(--red)}
.tcur{display:inline-block;width:7px;height:11px;background:var(--accent);vertical-align:middle;margin-left:1px;animation:blink 1s step-end infinite;box-shadow:var(--glow-sm)}
.tw[tabindex]{cursor:text;outline:none;position:relative;transition:border-color .25s,box-shadow .25s}
.tw[tabindex].iterm-on{border-color:rgba(0,224,122,.55)!important;box-shadow:0 0 28px rgba(0,224,122,.18),0 0 0 1px rgba(0,224,122,.1),0 24px 60px rgba(0,0,0,.5)!important}
.iterm-hint{margin-left:auto;font-size:.58rem;color:rgba(0,224,122,.45);letter-spacing:.06em;transition:opacity .3s;pointer-events:none}
.tw.iterm-used .iterm-hint{opacity:0}

/* ── SECTION COMMONS ── */
.page-main{padding-top:0}
section{padding:5.5rem 1.5rem}
.inner{max-width:var(--max);margin:0 auto}
.sec-lbl{font-size:.66rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--text2);margin-bottom:.85rem;display:flex;align-items:center;gap:.45rem;font-family:var(--font)}
.sec-lbl::before{content:'//';color:var(--accent);font-weight:400}
.sec-title{font-family:var(--font-display);font-size:clamp(1.85rem,2.8vw,2.65rem);font-weight:700;letter-spacing:-.035em;color:var(--white);margin-bottom:.85rem;line-height:1.08}
.sec-sub{font-size:.92rem;color:var(--text);max-width:560px;line-height:1.7;font-family:var(--font-display);font-weight:400}
.sec-head{margin-bottom:2.75rem}
.sec-head.center{text-align:center}
.sec-head.center .sec-lbl{justify-content:center}
.sec-head.center .sec-sub{margin:0 auto}
.grad{background:linear-gradient(90deg,var(--accent),var(--accent2));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.gdiv{height:1px;background:linear-gradient(90deg,transparent 0%,rgba(0,224,122,.28) 35%,rgba(0,212,255,.18) 50%,rgba(123,97,255,.12) 65%,transparent 100%);position:relative}
.gdiv::after{content:'';position:absolute;left:50%;top:-2px;transform:translateX(-50%);width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 12px var(--accent),0 0 0 1px rgba(0,224,122,.2);opacity:.65}
.alt-bg{background:var(--bg2);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}

/* ── FEATURE CARDS ── */
.cards-3{display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem}
.cards-2{display:grid;grid-template-columns:repeat(2,1fr);gap:.7rem}
.f-card{background:var(--bg3);border:1px solid var(--border);border-radius:var(--rad-lg);overflow:hidden;transition:all .2s;position:relative}
.f-card::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 80% 60% at 50% -10%,rgba(0,224,122,.05),transparent);opacity:0;transition:opacity .3s}
.f-card:hover{border-color:rgba(0,224,122,.2);transform:translateY(-2px);box-shadow:0 12px 40px rgba(0,0,0,.35),var(--glow-sm)}
.f-card:hover::before{opacity:1}
.f-card-chrome{display:flex;align-items:center;gap:5px;padding:.48rem .85rem;background:var(--bg4);border-bottom:1px solid var(--border)}
.f-card-chrome span{font-size:.58rem;color:var(--text3);margin-left:.45rem;letter-spacing:.05em}
.f-card-body{padding:1.15rem}
.f-ico{width:32px;height:32px;border-radius:8px;background:var(--adim);display:flex;align-items:center;justify-content:center;margin-bottom:.75rem;border:1px solid rgba(0,224,122,.1)}
.f-ico svg{width:15px;height:15px;stroke:var(--accent);fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.f-card h3{font-family:var(--font-display);font-size:1.02rem;font-weight:600;color:var(--white);margin-bottom:.4rem;letter-spacing:-.02em}
.f-card p{font-family:var(--font-display);font-size:.86rem;color:var(--text);line-height:1.65}

/* ── HERO (inner pages) ── */
.page-hero{position:relative;padding:5rem 1.5rem 4rem;overflow:hidden}
.page-hero::before{content:'';position:absolute;inset:0;background-image:radial-gradient(circle,rgba(0,224,122,.1) 1px,transparent 1px);background-size:32px 32px;mask-image:radial-gradient(ellipse 80% 80% at 50% 0%,black,transparent);-webkit-mask-image:radial-gradient(ellipse 80% 80% at 50% 0%,black,transparent);pointer-events:none}
.page-hero-orb{position:absolute;top:-80px;left:50%;transform:translateX(-50%);width:800px;height:500px;background:radial-gradient(ellipse at 50% 40%,rgba(0,224,122,.1) 0%,rgba(0,212,255,.05) 40%,transparent 68%);pointer-events:none;filter:blur(40px)}
.page-hero-inner{max-width:var(--max);margin:0 auto;position:relative;display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}
.page-hero-badge{display:inline-flex;align-items:center;gap:.55rem;border:1px solid rgba(0,224,122,.28);background:rgba(0,224,122,.07);padding:.32rem .85rem;border-radius:100px;font-size:.66rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin-bottom:1.4rem;backdrop-filter:blur(8px)}
.page-hero-badge-dot{width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 8px var(--accent);animation:sbpulse 2s infinite}
.page-hero h1{font-family:var(--font-display);font-size:clamp(2.2rem,4vw,3.4rem);font-weight:700;line-height:1.04;letter-spacing:-.045em;color:var(--white);margin-bottom:1.15rem}
.page-hero-desc{font-family:var(--font-display);font-size:.98rem;font-weight:400;color:var(--text);line-height:1.65;margin-bottom:1.6rem;border-left:2px solid rgba(0,224,122,.35);padding-left:1rem;max-width:520px}
.page-hero-cta{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap;margin-bottom:.9rem}
.page-hero-note{font-size:.62rem;color:var(--text3)}
.page-hero-note::before{content:'// ';color:var(--text3)}
.page-hero-tw{position:relative}
.page-hero-tw::before{content:'';position:absolute;inset:-1px;border-radius:15px;background:linear-gradient(135deg,rgba(0,224,122,.22),rgba(0,212,255,.12),rgba(123,97,255,.08));-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}

/* ── STATS ROW ── */
.stats-row{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--border);border-radius:var(--rad-lg);overflow:hidden;background:var(--bg3)}
.sr-stat{padding:2rem 1.4rem;text-align:center;border-right:1px solid var(--border);transition:background .2s;position:relative}
.sr-stat:last-child{border-right:none}
.sr-stat::after{content:'';position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:0;height:1px;background:linear-gradient(90deg,transparent,var(--accent),transparent);transition:width .3s var(--ease)}
.sr-stat:hover::after{width:70%}
.sr-stat:hover{background:rgba(0,224,122,.018)}
.sr-pre{font-size:.62rem;color:var(--text3);margin-bottom:.4rem;letter-spacing:.08em;text-transform:uppercase;font-weight:600}
.sr-num{font-family:var(--font-display);font-size:2.4rem;font-weight:700;color:var(--accent);letter-spacing:-.04em;line-height:1;margin-bottom:.35rem;text-shadow:var(--gtext)}
.sr-desc{font-size:.74rem;color:var(--text);line-height:1.5}

/* ── PRICING CARDS (shared) ── */
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem}
.pc{background:var(--bg3);border:1px solid var(--border);border-radius:var(--rad-lg);overflow:hidden;transition:border-color .2s,box-shadow .2s}
.pc:hover{border-color:var(--border2)}
.pc.feat{position:relative;border-color:transparent}
.pc.feat::before{content:'';position:absolute;inset:-1px;border-radius:15px;background:linear-gradient(135deg,rgba(0,224,122,.35),rgba(0,212,255,.18),rgba(123,97,255,.12),rgba(0,224,122,.35));background-size:300% 300%;animation:gborder 4s linear infinite;z-index:-1}
@keyframes gborder{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
.pc-chrome{display:flex;align-items:center;padding:.52rem 1rem;background:var(--bg4);border-bottom:1px solid var(--border);gap:5px}
.pc-ctitle{font-size:.6rem;color:var(--text3);margin-left:.45rem;letter-spacing:.05em}
.pc-badge{margin-left:auto;background:var(--accent);color:#000;font-size:.56rem;font-weight:800;padding:.13rem .55rem;border-radius:3px;letter-spacing:.07em;text-transform:uppercase}
.pc-body{padding:1.5rem}
.pc-tier{font-size:.66rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--text2);margin-bottom:.85rem}
.pc-price{font-family:var(--font-display);font-size:2.5rem;font-weight:700;letter-spacing:-.045em;line-height:1;margin-bottom:.25rem;color:var(--white)}
.pc-price span{font-size:.82rem;font-weight:400;color:var(--text2);font-family:var(--font)}
.pc.feat .pc-price{background:linear-gradient(90deg,var(--accent),var(--accent2));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.pc-desc{font-family:var(--font-display);font-size:.82rem;color:var(--text);margin-bottom:1.15rem;padding-bottom:1.15rem;border-bottom:1px solid var(--border);line-height:1.6}
.pc-list{list-style:none;display:flex;flex-direction:column;gap:.6rem;margin-bottom:1.4rem}
.pc-list li{display:flex;align-items:flex-start;gap:.55rem;font-size:.8rem;color:var(--text);line-height:1.5;font-family:var(--font-display)}
.pc-list li::before{content:'✓';color:var(--accent);font-weight:800;flex-shrink:0;font-size:.7rem;margin-top:.15rem}
.pc-btn{display:block;width:100%;padding:.78rem;border-radius:8px;text-align:center;font-weight:700;font-size:.78rem;cursor:pointer;transition:transform .18s var(--ease),box-shadow .18s,border-color .18s,background .18s,color .18s;border:1px solid var(--border2);background:transparent;color:var(--text);font-family:var(--font);letter-spacing:.04em}
.pc-btn::before{content:'$ ';color:var(--text3);font-weight:400}
.pc-btn:hover{border-color:rgba(0,224,122,.5);color:var(--accent);background:var(--adim2);transform:translateY(-1px)}
.pc-btn.filled{background:linear-gradient(180deg,#00e07a,#00e87a);color:#031912;border-color:transparent;box-shadow:0 0 22px rgba(0,224,122,.3),inset 0 1px 0 rgba(255,255,255,.18)}
.pc-btn.filled::before{content:'$ ';color:rgba(0,0,0,.4)}
.pc-btn.filled:hover{background:linear-gradient(180deg,#1cff97,#00f586);box-shadow:0 0 38px rgba(0,224,122,.5),inset 0 1px 0 rgba(255,255,255,.22);transform:translateY(-1px)}

/* ── FAQ ACCORDION ── */
.faq-list{display:flex;flex-direction:column;gap:.55rem}
.faq-item{background:var(--bg3);border:1px solid var(--border);border-radius:var(--rad);overflow:hidden;transition:border-color .25s,box-shadow .25s}
.faq-item.open{border-color:rgba(0,224,122,.28);box-shadow:0 8px 28px rgba(0,0,0,.35),var(--glow-sm)}
.faq-q{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.1rem 1.25rem;cursor:pointer;font-size:.88rem;font-weight:600;color:var(--white);transition:color .15s;user-select:none;font-family:var(--font-display);letter-spacing:-.005em}
.faq-q:hover{color:var(--accent)}
.faq-q::before{content:'> ';color:var(--text3);font-weight:400;flex-shrink:0;font-family:var(--font)}
.faq-item.open .faq-q{color:var(--accent)}
.faq-arrow{font-size:.75rem;color:var(--text3);transition:transform .25s var(--ease),color .2s;flex-shrink:0}
.faq-item.open .faq-arrow{transform:rotate(45deg);color:var(--accent)}
.faq-a{font-size:.84rem;color:var(--text);line-height:1.75;padding:0 1.25rem 1.1rem 1.25rem;display:none;border-top:1px solid var(--border);padding-top:1rem;margin-top:0;font-family:var(--font-display)}
.faq-a code{color:var(--accent);background:var(--adim);padding:.12rem .4rem;border-radius:3px;font-size:.78rem;font-family:var(--font)}

/* ── FORM ── */
.form-group{margin-bottom:1.2rem}
.form-label{display:block;font-size:.7rem;color:var(--text);margin-bottom:.5rem;letter-spacing:.04em;font-weight:600}
.form-label::before{content:'// ';color:var(--accent);opacity:.6}
.form-input,.form-select,.form-textarea{width:100%;background:var(--bg4);border:1px solid var(--border);border-radius:8px;padding:.78rem 1rem;font-family:var(--font);font-size:.82rem;color:var(--white);outline:none;transition:border-color .18s,box-shadow .18s,background .18s;-webkit-appearance:none}
.form-input:hover,.form-select:hover,.form-textarea:hover{border-color:var(--border2)}
.form-input:focus,.form-select:focus,.form-textarea:focus{border-color:rgba(0,224,122,.5);box-shadow:0 0 0 3px rgba(0,224,122,.08);background:var(--bg3)}
.form-input::placeholder,.form-textarea::placeholder{color:var(--text3)}
.form-textarea{resize:vertical;min-height:130px;line-height:1.6}
.form-select{cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%238aab97'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1rem center}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}

/* ── TABLE ── */
.vt{width:100%;border-collapse:collapse}
.vt th{font-size:.66rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--text2);text-align:left;padding:.8rem 1.1rem;border-bottom:1px solid var(--border);background:var(--bg4)}
.vt td{font-size:.8rem;color:var(--text);padding:.85rem 1.1rem;border-bottom:1px solid rgba(26,43,56,.5);font-family:var(--font-display)}
.vt tr:last-child td{border-bottom:none}
.vt tr:hover td{background:var(--adim2)}
.vt td:first-child{color:var(--white);font-weight:500}
.vt .tag{display:inline-flex;align-items:center;font-size:.58rem;font-weight:700;padding:.1rem .45rem;border-radius:3px;letter-spacing:.05em}
.vt .tag-green{background:rgba(0,224,122,.1);color:var(--accent);border:1px solid rgba(0,224,122,.2)}
.vt .tag-yellow{background:rgba(255,189,46,.1);color:#ffbd2e;border:1px solid rgba(255,189,46,.2)}
.vt .tag-red{background:rgba(255,80,99,.1);color:var(--red);border:1px solid rgba(255,80,99,.2)}

/* ── BREADCRUMB ── */
.breadcrumb{display:flex;align-items:center;gap:.4rem;font-size:.62rem;color:var(--text3);padding:1rem 1.5rem;max-width:var(--max);margin:0 auto}
.breadcrumb a:hover{color:var(--accent)}
.breadcrumb-sep{color:var(--text3)}

/* ── BADGE ── */
.badge{display:inline-flex;align-items:center;gap:.3rem;font-size:.62rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:.2rem .6rem;border-radius:4px}
.badge-green{background:var(--adim);color:var(--accent);border:1px solid rgba(0,224,122,.15)}
.badge-blue{background:rgba(0,212,255,.07);color:var(--accent2);border:1px solid rgba(0,212,255,.15)}
.badge-purple{background:rgba(123,97,255,.07);color:var(--accent3);border:1px solid rgba(123,97,255,.15)}

/* ── FOOTER ── */
footer{background:linear-gradient(180deg,var(--bg2) 0%,var(--bg) 100%);border-top:1px solid var(--border);padding:4rem 1.5rem 2rem;position:relative;overflow:hidden}
footer::before{content:'';position:absolute;top:0;left:50%;transform:translateX(-50%);width:90%;max-width:1000px;height:1px;background:linear-gradient(90deg,transparent,rgba(0,224,122,.35),transparent)}
.footer-inner{max-width:var(--max);margin:0 auto;position:relative}
.footer-top{display:grid;grid-template-columns:2.3fr 1fr 1fr 1fr 1fr;gap:3rem;margin-bottom:2.5rem}
.fbrand .logo{margin-bottom:.85rem;display:flex;align-items:center}
.fbrand p{font-size:.8rem;color:var(--text2);line-height:1.7;max-width:240px;font-family:var(--font-display)}
.fcol h4{font-size:.62rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--text2);margin-bottom:1rem}
.fcol h4::before{content:'# ';color:var(--accent)}
.fcol a{display:block;font-size:.78rem;color:var(--text);margin-bottom:.55rem;transition:color .15s,transform .15s var(--ease);font-family:var(--font-display)}
.fcol a::before{content:'';color:var(--accent);opacity:0;display:inline-block;width:0;transition:opacity .15s,width .15s var(--ease);margin-right:0}
.fcol a:hover{color:var(--accent)}
.fcol a:hover::before{content:'→ ';opacity:1;width:auto;margin-right:.1em}
.footer-btm{display:flex;align-items:center;justify-content:space-between;padding-top:1.8rem;border-top:1px solid var(--border);font-size:.7rem;color:var(--text2);gap:1rem;flex-wrap:wrap}
.socials{display:flex;gap:.45rem}
.soc{width:32px;height:32px;border-radius:8px;border:1px solid var(--border);display:flex;align-items:center;justify-content:center;transition:all .2s var(--ease);color:var(--text2);background:var(--bg3)}
.soc svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.soc:hover{border-color:var(--accent);color:var(--accent);box-shadow:var(--glow-sm);transform:translateY(-2px);background:var(--adim)}

/* ── SCROLL REVEAL ── */
.reveal{opacity:0;transform:translateY(16px);transition:opacity .5s ease,transform .5s ease}
.reveal.in{opacity:1;transform:none}

/* ── RESPONSIVE ── */
@media(max-width:900px){
  .page-hero-inner{grid-template-columns:1fr;gap:2rem}
  .page-hero-tw{display:none}
  .cards-3{grid-template-columns:repeat(2,1fr)}
  .price-grid{grid-template-columns:1fr}
  .stats-row{grid-template-columns:repeat(2,1fr)}
  .sr-stat:nth-child(2){border-right:none}
  .sr-stat:nth-child(3){border-right:1px solid var(--border);border-top:1px solid var(--border)}
  .sr-stat:nth-child(4){border-top:1px solid var(--border)}
  .footer-top{grid-template-columns:1fr 1fr}
  .form-row{grid-template-columns:1fr}
}
@media(max-width:600px){
  .cards-3,.cards-2{grid-template-columns:1fr}
  .stats-row{grid-template-columns:1fr}
  .sr-stat{border-right:none!important;border-top:none!important;border-bottom:1px solid var(--border)}
  .nav-links{display:none}
  .footer-top{grid-template-columns:1fr}
  .sb .sb-r{display:none}
}

/* ── MATRIX CANVAS ── */
#mtx{position:fixed;inset:0;pointer-events:none;z-index:0}
body>*:not(#mtx){position:relative;z-index:1}

/* ── STATUS PAGE ── */
.status-indicator{display:flex;align-items:center;gap:.6rem;font-size:.75rem}
.sdot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.sdot.green{background:var(--accent);box-shadow:0 0 8px var(--accent);animation:sbpulse 2s infinite}
.sdot.yellow{background:#ffbd2e;box-shadow:0 0 8px #ffbd2e}
.sdot.red{background:var(--red);box-shadow:0 0 8px var(--red)}
.uptime-bar{display:flex;gap:2px;height:28px;align-items:stretch}
.ub-cell{flex:1;border-radius:2px;min-width:0}
.ub-cell.up{background:rgba(0,224,122,.45)}
.ub-cell.down{background:rgba(255,80,99,.45)}
.ub-cell.partial{background:rgba(255,189,46,.4)}
.status-comp{display:flex;align-items:center;justify-content:space-between;padding:.85rem 1rem;border-bottom:1px solid var(--border)}
.status-comp:last-child{border-bottom:none}
.sc-name{font-size:.75rem;color:var(--white);font-weight:600}
.sc-sub{font-size:.65rem;color:var(--text3);margin-top:.1rem}
.sc-tag{font-size:.62rem;font-weight:700;padding:.15rem .55rem;border-radius:4px;letter-spacing:.05em;text-transform:uppercase}
.sc-tag.green{background:rgba(0,224,122,.1);color:var(--accent);border:1px solid rgba(0,224,122,.2)}
.sc-tag.yellow{background:rgba(255,189,46,.1);color:#ffbd2e;border:1px solid rgba(255,189,46,.2)}

/* ── DOCS PAGE ── */
.docs-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.7rem}
.doc-cat{background:var(--bg3);border:1px solid var(--border);border-radius:var(--rad-lg);overflow:hidden;transition:all .2s}
.doc-cat:hover{border-color:rgba(0,224,122,.2);transform:translateY(-2px);box-shadow:0 8px 32px rgba(0,0,0,.3)}
.doc-cat-hd{display:flex;align-items:center;gap:.5rem;padding:.7rem 1rem;background:var(--bg4);border-bottom:1px solid var(--border)}
.doc-cat-hd span{font-size:.62rem;color:var(--text3);letter-spacing:.05em}
.doc-cat-body{padding:1.15rem}
.doc-cat h3{font-family:var(--font-display);font-size:1rem;font-weight:600;color:var(--white);margin-bottom:.4rem;letter-spacing:-.015em}
.doc-cat p{font-family:var(--font-display);font-size:.84rem;color:var(--text);line-height:1.6;margin-bottom:1rem}
.doc-links{display:flex;flex-direction:column;gap:.35rem}
.doc-links a{font-size:.78rem;color:var(--text);transition:color .12s,transform .12s var(--ease);display:flex;align-items:center;gap:.35rem}
.doc-links a::before{content:'→';color:var(--accent);font-size:.7rem;opacity:.7;transition:transform .15s var(--ease)}
.doc-links a:hover{color:var(--accent)}
.doc-links a:hover::before{transform:translateX(2px);opacity:1}
@media(max-width:700px){.docs-grid{grid-template-columns:1fr}}

/* ── CASE STUDIES ── */
.cs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem}
.cs-card{background:var(--bg3);border:1px solid var(--border);border-radius:var(--rad-lg);overflow:hidden;transition:all .2s;display:flex;flex-direction:column}
.cs-card:hover{border-color:rgba(0,224,122,.2);transform:translateY(-2px);box-shadow:0 12px 40px rgba(0,0,0,.3)}
.cs-chrome{display:flex;align-items:center;gap:5px;padding:.48rem .85rem;background:var(--bg4);border-bottom:1px solid var(--border)}
.cs-chrome span{font-size:.58rem;color:var(--text3);margin-left:.45rem;letter-spacing:.05em}
.cs-body{padding:1.15rem;flex:1;display:flex;flex-direction:column}
.cs-tag{display:inline-flex;margin-bottom:.7rem}
.cs-title{font-family:var(--font-display);font-size:1.02rem;font-weight:600;color:var(--white);margin-bottom:.5rem;line-height:1.25;letter-spacing:-.015em}
.cs-excerpt{font-family:var(--font-display);font-size:.86rem;color:var(--text);line-height:1.6;flex:1;margin-bottom:1rem}
.cs-stat{font-size:.72rem;color:var(--accent);font-weight:700;border-top:1px solid var(--border);padding-top:.7rem;display:flex;align-items:center;gap:.35rem}
.cs-stat::before{content:'→';color:var(--text3)}
@media(max-width:900px){.cs-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.cs-grid{grid-template-columns:1fr}}

/* ── BLOG ── */
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem}
.blog-card{background:var(--bg3);border:1px solid var(--border);border-radius:var(--rad-lg);overflow:hidden;transition:all .2s;display:flex;flex-direction:column}
.blog-card:hover{border-color:rgba(0,224,122,.2);transform:translateY(-2px);box-shadow:0 12px 40px rgba(0,0,0,.3)}
.blog-chrome{display:flex;align-items:center;gap:5px;padding:.48rem .85rem;background:var(--bg4);border-bottom:1px solid var(--border)}
.blog-chrome span{font-size:.58rem;color:var(--text3);margin-left:.45rem;letter-spacing:.05em}
.blog-body{padding:1.15rem;flex:1;display:flex;flex-direction:column}
.blog-meta{font-size:.62rem;color:var(--text3);margin-bottom:.55rem;display:flex;gap:.6rem;align-items:center}
.blog-title{font-family:var(--font-display);font-size:1.05rem;font-weight:600;color:var(--white);margin-bottom:.55rem;line-height:1.3;transition:color .15s;letter-spacing:-.015em}
.blog-card:hover .blog-title{color:var(--accent)}
.blog-excerpt{font-family:var(--font-display);font-size:.88rem;color:var(--text);line-height:1.6;flex:1;margin-bottom:1rem}
.blog-read{font-size:.68rem;color:var(--accent);font-weight:600}
.blog-read::before{content:'→ ';color:var(--text3)}
@media(max-width:900px){.blog-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.blog-grid{grid-template-columns:1fr}}

/* ── ABOUT ── */
.team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.7rem}
.team-card{background:var(--bg3);border:1px solid var(--border);border-radius:var(--rad-lg);padding:1.35rem;text-align:center;transition:all .2s}
.team-card:hover{border-color:rgba(0,224,122,.15);transform:translateY(-2px)}
.team-avatar{width:56px;height:56px;border-radius:50%;background:var(--bg4);border:2px solid var(--border);margin:0 auto .75rem;display:flex;align-items:center;justify-content:center;font-size:1.2rem;font-weight:800;color:var(--accent)}
.team-name{font-family:var(--font-display);font-size:.92rem;font-weight:600;color:var(--white);margin-bottom:.25rem;letter-spacing:-.01em}
.team-role{font-size:.7rem;color:var(--accent);margin-bottom:.55rem;letter-spacing:.04em;font-weight:600}
.team-bio{font-family:var(--font-display);font-size:.8rem;color:var(--text);line-height:1.55}
@media(max-width:800px){.team-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:500px){.team-grid{grid-template-columns:1fr}}

/* ── LOGIN / AUTH ── */
.auth-wrap{min-height:calc(100vh - 83px);display:flex;align-items:center;justify-content:center;padding:3rem 1.5rem}
.auth-box{width:100%;max-width:400px}
.auth-logo{text-align:center;margin-bottom:2rem}
.auth-title{font-size:1rem;font-weight:800;color:var(--white);text-align:center;margin-bottom:.35rem}
.auth-sub{font-size:.72rem;color:var(--text3);text-align:center;margin-bottom:1.75rem}
.auth-sub::before{content:'// '}
.auth-footer{text-align:center;margin-top:1.25rem;font-size:.68rem;color:var(--text3)}
.auth-footer a{color:var(--accent)}
.auth-divider{text-align:center;font-size:.65rem;color:var(--text3);margin:.9rem 0;position:relative}
.auth-divider::before{content:'';position:absolute;top:50%;left:0;right:0;height:1px;background:var(--border)}
.auth-divider span{background:var(--bg3);padding:0 .6rem;position:relative}

/* ── OWN IT / PERPETUAL ── */
.own-wrap{margin-top:1.5rem}
.own-body{padding:1.4rem 1.5rem 1.5rem}
.own-top{display:grid;grid-template-columns:1fr auto;gap:2.5rem;align-items:start;margin-bottom:1.25rem}
.own-eyebrow{font-size:.6rem;color:var(--text3);letter-spacing:.1em;text-transform:uppercase;margin-bottom:.4rem}
.own-eyebrow::before{content:'// '}
.own-h{font-size:1.3rem;font-weight:800;letter-spacing:-.03em;color:var(--white);margin:.15rem 0 .5rem;line-height:1.1}
.own-desc{font-size:.76rem;color:var(--text2);line-height:1.8;max-width:520px}
.own-pricing{text-align:right;flex-shrink:0;padding-top:.25rem}
.own-amt{display:block;font-size:2rem;font-weight:800;letter-spacing:-.04em;background:linear-gradient(90deg,#a78bfa,#7b61ff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.own-per{display:block;font-size:.7rem;color:var(--text2);margin-top:.1rem}
.own-maint{display:block;font-size:.62rem;color:var(--text3);margin-top:.12rem}
.own-opts{display:grid;grid-template-columns:repeat(3,1fr);gap:.65rem;margin-bottom:1.25rem}
.own-opt{background:var(--bg2);border:1px solid var(--border);border-radius:var(--rad);padding:.95rem 1.05rem;font-size:.67rem;line-height:1.95;color:var(--text2)}
.own-opt-hi{border-color:rgba(123,97,255,.4);background:rgba(123,97,255,.07)}
.own-opt-hd{display:flex;align-items:center;gap:.45rem;margin-bottom:.55rem;padding-bottom:.55rem;border-bottom:1px solid var(--border)}
.own-opt-ic{font-size:.85rem;width:26px;height:26px;display:flex;align-items:center;justify-content:center;background:var(--bg3);border:1px solid var(--border);border-radius:6px;flex-shrink:0}
.own-opt-hi .own-opt-ic{border-color:rgba(123,97,255,.3);background:rgba(123,97,255,.12)}
.own-opt-nm{font-size:.72rem;font-weight:700;color:var(--white)}
.own-opt-line{display:block}
.own-divider{height:1px;background:var(--border);margin-bottom:1.1rem}
.own-footer{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.own-perks{display:flex;flex-wrap:wrap;gap:.3rem .9rem;font-size:.68rem;color:var(--accent)}
@media(max-width:860px){.own-top{grid-template-columns:1fr}.own-pricing{text-align:left}.own-opts{grid-template-columns:1fr}.own-footer{flex-direction:column;align-items:flex-start}}

/* ── CUSTOMER LOGO STRIP ── */
.logos-sec{padding:2.75rem 0;overflow:hidden;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.logos-lbl{text-align:center;font-size:.6rem;color:var(--text3);letter-spacing:.1em;text-transform:uppercase;margin-bottom:1.3rem}
.logos-lbl::before{content:'// '}
.logos-outer{overflow:hidden;-webkit-mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.logos-track{display:flex;width:max-content;animation:logoScroll 36s linear infinite}
.logos-track:hover{animation-play-state:paused}
.logos-item{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem 1.25rem;border:1px solid rgba(255,255,255,.07);border-radius:8px;margin:0 .35rem;white-space:nowrap;font-size:.67rem;color:var(--text2);flex-shrink:0;transition:all .2s;cursor:default}
.logos-item:hover{border-color:rgba(0,224,122,.25);color:var(--accent)}
.logos-dot{width:5px;height:5px;border-radius:50%;background:var(--accent);opacity:.45;flex-shrink:0}
@keyframes logoScroll{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

/* ── VIROBIT ICONS (terminal-themed stroke set) ── */
.vico{width:1.05em;height:1.05em;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;vertical-align:-.15em;color:currentColor}
.vico svg{width:100%;height:100%;stroke:currentColor;fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;display:block}
.vico-lg{width:1.3em;height:1.3em}
.vico-tile{width:36px;height:36px;border-radius:9px;background:var(--adim);border:1px solid rgba(0,224,122,.22);display:inline-flex;align-items:center;justify-content:center;color:var(--accent);transition:border-color .2s,box-shadow .2s;flex-shrink:0}
.vico-tile svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.vico-tile-lg{width:44px;height:44px;border-radius:11px}
.vico-tile-lg svg{width:22px;height:22px}

/* ── INTEGRATIONS ── */
.integ-sec{padding:4.5rem 0}
.integ-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:.6rem;margin-top:2rem}
.integ-badge{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:.55rem;padding:1.1rem .55rem .85rem;background:linear-gradient(180deg,var(--bg3),var(--bg2));border:1px solid var(--border);border-radius:12px;text-align:center;transition:transform .25s var(--ease),border-color .25s,box-shadow .25s,background .25s;cursor:default;user-select:none;overflow:hidden}
.integ-badge::before{content:'';position:absolute;top:-1px;left:50%;transform:translateX(-50%);width:0;height:2px;background:linear-gradient(90deg,transparent,var(--ic,var(--accent)),transparent);transition:width .35s var(--ease);box-shadow:0 0 10px var(--ic,var(--accent))}
.integ-badge:hover{border-color:rgba(0,224,122,.35);background:linear-gradient(180deg,var(--bg3),rgba(0,224,122,.03));transform:translateY(-3px);box-shadow:0 12px 30px rgba(0,0,0,.45),0 0 18px rgba(0,224,122,.1)}
.integ-badge:hover::before{width:78%}
.integ-mono{width:38px;height:38px;border-radius:50%;background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.08),transparent 65%),var(--bg4);border:1px solid var(--border2);display:flex;align-items:center;justify-content:center;font-family:var(--font);font-size:.78rem;font-weight:800;color:var(--ic,var(--accent));letter-spacing:-.02em;line-height:1;transition:border-color .25s,box-shadow .25s,color .25s;text-shadow:0 0 12px rgba(0,224,122,.15);position:relative}
.integ-mono::after{content:'';position:absolute;inset:-1px;border-radius:50%;background:radial-gradient(circle,var(--ic,var(--accent)),transparent 70%);opacity:0;transition:opacity .25s;filter:blur(8px);z-index:-1}
.integ-badge:hover .integ-mono{border-color:var(--ic,var(--accent));color:var(--ic-bright,var(--accent-hot));box-shadow:inset 0 0 10px rgba(0,0,0,.4),0 0 0 1px rgba(255,255,255,.04)}
.integ-badge:hover .integ-mono::after{opacity:.35}
.integ-name{font-size:.66rem;color:var(--text);letter-spacing:.01em;line-height:1.25;font-weight:500;font-family:var(--font);min-height:1.6em;display:flex;align-items:center;justify-content:center;text-align:center}
.integ-status{position:absolute;top:.5rem;right:.5rem;width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 6px var(--accent);opacity:.55}
@media(max-width:1100px){.integ-grid{grid-template-columns:repeat(6,1fr)}}
@media(max-width:800px){.integ-grid{grid-template-columns:repeat(4,1fr)}}
@media(max-width:520px){.integ-grid{grid-template-columns:repeat(3,1fr)}}

/* ── COMPLIANCE BADGES ── */
.comp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:.55rem;margin-top:1.5rem}
.comp-badge{padding:.9rem 1rem;background:var(--bg3);border:1px solid var(--border);border-radius:var(--rad);transition:all .2s;cursor:default}
.comp-badge:hover{border-color:rgba(0,224,122,.25);transform:translateY(-2px);box-shadow:0 4px 18px rgba(0,0,0,.3)}
.comp-hd{display:flex;align-items:center;gap:.45rem;margin-bottom:.3rem}
.comp-ic{font-size:.85rem;flex-shrink:0}
.comp-nm{font-size:.72rem;font-weight:700;color:var(--white)}
.comp-desc{font-size:.62rem;color:var(--text3);line-height:1.65;margin-bottom:.4rem}
.comp-tag{display:inline-block;font-size:.54rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;padding:.1rem .42rem;border-radius:3px}
.comp-tag.live{background:rgba(0,224,122,.12);color:var(--accent);border:1px solid rgba(0,224,122,.2)}
.comp-tag.ready{background:rgba(0,212,255,.1);color:var(--accent2);border:1px solid rgba(0,212,255,.2)}
.comp-tag.soon{background:rgba(255,189,46,.1);color:#ffbd2e;border:1px solid rgba(255,189,46,.2)}
@media(max-width:600px){.comp-grid{grid-template-columns:repeat(2,1fr)}}

/* ── DEMO PAGE ── */
.demo-hero{padding:3.5rem 1.5rem 2rem}
.demo-hero .inner{display:flex;flex-direction:column;align-items:flex-start;gap:1rem;max-width:780px}
.demo-vertical-tabs{display:flex;gap:.5rem;flex-wrap:wrap}
.dvt{padding:.4rem .9rem;border:1px solid var(--border);border-radius:20px;font-size:.7rem;font-weight:600;color:var(--text2);cursor:pointer;transition:all .2s;background:transparent;letter-spacing:.03em}
.dvt.active,.dvt:hover{border-color:var(--accent);color:var(--accent);background:var(--adim)}

.demo-browser{width:100%;border:1px solid var(--border2);border-radius:10px;overflow:hidden;background:#0e1214;box-shadow:0 24px 80px rgba(0,0,0,.6)}
.db-chrome{display:flex;align-items:center;gap:.75rem;padding:.6rem 1rem;background:#141a1d;border-bottom:1px solid var(--border)}
.db-dots{display:flex;gap:.4rem}
.db-dot{width:11px;height:11px;border-radius:50%}
.db-dot.r{background:#ff5f57}.db-dot.y{background:#febc2e}.db-dot.g{background:#28c840}
.db-bar{flex:1;background:#0e1214;border:1px solid var(--border);border-radius:5px;padding:.28rem .75rem;font-size:.65rem;color:var(--text3);display:flex;align-items:center;gap:.4rem;max-width:340px}
.db-lock{width:10px;height:10px;stroke:var(--accent);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

.dapp{display:flex;height:560px}

.dapp-sidebar{width:190px;flex-shrink:0;background:#0a0d0f;border-right:1px solid var(--border);display:flex;flex-direction:column;padding:.75rem 0}
.dapp-logo{padding:.5rem 1rem .9rem;border-bottom:1px solid var(--border);margin-bottom:.5rem;font-size:.8rem;font-weight:800;color:var(--white);letter-spacing:-.02em}
.dapp-logo span{color:var(--accent)}
.dapp-nav-section{font-size:.55rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--text3);padding:.6rem 1rem .3rem}
.dapp-nav-item{display:flex;align-items:center;gap:.55rem;padding:.5rem 1rem;font-size:.7rem;color:var(--text2);cursor:pointer;transition:all .15s;border-left:2px solid transparent;margin:0 0 .1rem}
.dapp-nav-item:hover{color:var(--text);background:rgba(255,255,255,.03)}
.dapp-nav-item.active{color:var(--accent);background:var(--adim);border-left-color:var(--accent)}
.dapp-nav-item svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.dapp-sidebar-bottom{margin-top:auto;padding:.75rem 1rem;border-top:1px solid var(--border)}
.dapp-user{display:flex;align-items:center;gap:.5rem}
.dapp-avatar{width:28px;height:28px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent2));display:flex;align-items:center;justify-content:center;font-size:.6rem;font-weight:800;color:#000}
.dapp-user-info{flex:1;min-width:0}
.dapp-user-name{font-size:.65rem;font-weight:600;color:var(--white);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dapp-user-role{font-size:.55rem;color:var(--text3)}

.dapp-main{flex:1;overflow-y:auto;background:#0c1013;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.06) transparent}
.dapp-topbar{display:flex;align-items:center;gap:1rem;padding:.65rem 1.25rem;background:#0a0d0f;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:10}
.dapp-page-title{font-size:.8rem;font-weight:700;color:var(--white);flex:1}
.dapp-search{display:flex;align-items:center;gap:.4rem;background:#0e1214;border:1px solid var(--border);border-radius:5px;padding:.3rem .65rem;font-size:.65rem;color:var(--text3)}
.dapp-search svg{width:11px;height:11px;stroke:var(--text3);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.dapp-topbar-actions{display:flex;align-items:center;gap:.65rem}
.dapp-notif{position:relative;cursor:pointer}
.dapp-notif svg{width:16px;height:16px;stroke:var(--text2);fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.dapp-notif-dot{position:absolute;top:-2px;right:-2px;width:7px;height:7px;border-radius:50%;background:var(--accent);border:1.5px solid #0a0d0f}

.dapp-screen{display:none;padding:1.25rem}
.dapp-screen.active{display:block}

.dapp-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:.75rem;margin-bottom:1.25rem}
.dapp-kpi{background:#0e1214;border:1px solid var(--border);border-radius:8px;padding:.9rem 1rem}
.dapp-kpi-lbl{font-size:.6rem;color:var(--text3);margin-bottom:.3rem;text-transform:uppercase;letter-spacing:.07em}
.dapp-kpi-val{font-size:1.25rem;font-weight:800;color:var(--white);line-height:1}
.dapp-kpi-sub{font-size:.6rem;margin-top:.25rem}
.dapp-kpi-sub.up{color:var(--accent)}
.dapp-kpi-sub.dn{color:#ff5063}

.dapp-two-col{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin-bottom:1.25rem}
.dapp-card{background:#0e1214;border:1px solid var(--border);border-radius:8px;padding:1rem}
.dapp-card-hd{font-size:.7rem;font-weight:700;color:var(--white);margin-bottom:.85rem;display:flex;align-items:center;justify-content:space-between}
.dapp-card-hd span{font-size:.6rem;font-weight:400;color:var(--text3)}

.dapp-chart{display:flex;align-items:flex-end;gap:6px;height:100px;padding-top:.5rem}
.dapp-bar-wrap{flex:1;display:flex;flex-direction:column;align-items:center;gap:.3rem}
.dapp-bar{width:100%;border-radius:3px 3px 0 0;transition:height .5s ease;background:linear-gradient(to top,var(--accent),var(--accent2));opacity:.8;min-height:4px}
.dapp-bar:hover{opacity:1}
.dapp-bar-lbl{font-size:.5rem;color:var(--text3)}

.dapp-activity{display:flex;flex-direction:column;gap:.5rem;max-height:138px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.05) transparent}
.dapp-activity-item{display:flex;align-items:flex-start;gap:.5rem;padding-bottom:.5rem;border-bottom:1px solid var(--border)}
.dapp-activity-item:last-child{border-bottom:none;padding-bottom:0}
.dapp-act-dot{width:7px;height:7px;border-radius:50%;margin-top:.28rem;flex-shrink:0}
.dapp-act-txt{font-size:.63rem;color:var(--text2);line-height:1.5}
.dapp-act-time{font-size:.56rem;color:var(--text3);margin-left:auto;white-space:nowrap;padding-left:.3rem}

.dapp-table-wrap{background:#0e1214;border:1px solid var(--border);border-radius:8px;overflow:hidden;margin-bottom:1.25rem}
.dapp-table{width:100%;border-collapse:collapse;font-size:.65rem}
.dapp-table th{padding:.55rem .9rem;text-align:left;font-size:.58rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--text3);background:#090c0e;border-bottom:1px solid var(--border)}
.dapp-table td{padding:.55rem .9rem;color:var(--text2);border-bottom:1px solid rgba(255,255,255,.04)}
.dapp-table tr:last-child td{border-bottom:none}
.dapp-table tr:hover td{background:rgba(255,255,255,.02);color:var(--text)}
.dapp-badge{display:inline-flex;align-items:center;gap:.25rem;font-size:.56rem;font-weight:700;padding:.15rem .45rem;border-radius:3px}
.dapp-badge.green{background:rgba(0,224,122,.1);color:var(--accent)}
.dapp-badge.blue{background:rgba(0,212,255,.1);color:var(--accent2)}
.dapp-badge.yellow{background:rgba(255,189,46,.1);color:#ffbd2e}
.dapp-badge.red{background:rgba(255,80,99,.1);color:#ff5063}
.dapp-badge.gray{background:rgba(255,255,255,.06);color:var(--text3)}

.dapp-table-toolbar{display:flex;align-items:center;gap:.65rem;padding:.65rem .9rem;border-bottom:1px solid var(--border);background:#090c0e}
.dapp-filter-btn{padding:.3rem .7rem;font-size:.6rem;border:1px solid var(--border);border-radius:4px;color:var(--text2);background:transparent;cursor:pointer;transition:all .15s;font-family:inherit}
.dapp-filter-btn:hover,.dapp-filter-btn.active{border-color:var(--accent);color:var(--accent);background:var(--adim)}

.dapp-billing-card{background:#0e1214;border:1px solid var(--border);border-radius:8px;padding:1.25rem;margin-bottom:1.25rem}
.dapp-billing-hd{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}
.dapp-run-btn{padding:.45rem 1rem;background:var(--accent);color:#000;border:none;border-radius:5px;font-size:.7rem;font-weight:700;cursor:pointer;font-family:inherit;transition:all .2s}
.dapp-run-btn:hover{background:#00e07a;transform:translateY(-1px)}
.dapp-run-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}
.dapp-progress-wrap{margin:.75rem 0}
.dapp-progress-track{height:6px;background:rgba(255,255,255,.06);border-radius:3px;overflow:hidden}
.dapp-progress-bar{height:100%;width:0%;background:linear-gradient(90deg,var(--accent),var(--accent2));border-radius:3px;transition:width .3s ease}
.dapp-progress-lbl{display:flex;justify-content:space-between;font-size:.58rem;color:var(--text3);margin-top:.3rem}
.dapp-billing-log{height:160px;overflow-y:auto;background:#060809;border:1px solid var(--border);border-radius:5px;padding:.6rem .8rem;font-size:.62rem;line-height:1.7;color:var(--text2);scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.06) transparent}
.dapp-log-line{opacity:0;animation:logFadeIn .2s ease forwards}
@keyframes logFadeIn{to{opacity:1}}
.dapp-log-line.g{color:var(--accent)}
.dapp-log-line.d{color:var(--text3)}
.dapp-log-line.e{color:#ff5063}
.dapp-billing-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;margin-top:1rem}
.dapp-bsum{background:#090c0e;border:1px solid var(--border);border-radius:6px;padding:.75rem}
.dapp-bsum-lbl{font-size:.58rem;color:var(--text3);margin-bottom:.25rem;text-transform:uppercase;letter-spacing:.07em}
.dapp-bsum-val{font-size:1rem;font-weight:800;color:var(--white)}

.dapp-reports-grid{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}
.dapp-report-card{background:#0e1214;border:1px solid var(--border);border-radius:8px;padding:1rem}
.dapp-report-bars{display:flex;align-items:flex-end;gap:5px;height:90px;padding-top:.35rem}
.dapp-rb-wrap{flex:1;display:flex;flex-direction:column;align-items:center;gap:.3rem}
.dapp-rb{width:100%;border-radius:2px 2px 0 0;background:linear-gradient(to top,var(--accent2),rgba(0,212,255,.4));transition:height .6s ease;min-height:4px}
.dapp-rb-lbl{font-size:.48rem;color:var(--text3);text-align:center}

.demo-actions{display:flex;gap:.75rem;margin-top:1rem;justify-content:center;flex-wrap:wrap}

@media(max-width:900px){.dapp-kpis{grid-template-columns:repeat(2,1fr)}.dapp-two-col{grid-template-columns:1fr}.dapp-reports-grid{grid-template-columns:1fr}}
@media(max-width:640px){.dapp{flex-direction:column;height:auto}.dapp-sidebar{width:100%;flex-direction:row;flex-wrap:wrap;padding:.5rem}.dapp-nav-section{display:none}.dapp-nav-item{padding:.4rem .65rem;border-left:none;border-bottom:2px solid transparent;margin:0}.dapp-nav-item.active{border-left-color:transparent;border-bottom-color:var(--accent)}.dapp-sidebar-bottom{display:none}}

/* ── CONTACT ── */
.contact-grid{display:grid;grid-template-columns:1fr 1.5fr;gap:2.5rem;align-items:start}
.contact-info{display:flex;flex-direction:column;gap:.6rem}
.ci-item{display:flex;align-items:flex-start;gap:.9rem;padding:1.15rem;background:var(--bg3);border:1px solid var(--border);border-radius:var(--rad-lg);transition:border-color .2s,transform .2s var(--ease),box-shadow .2s}
.ci-item:hover{border-color:rgba(0,224,122,.25);transform:translateY(-1px);box-shadow:var(--glow-sm)}
.ci-ico{width:38px;height:38px;border-radius:9px;background:var(--adim);border:1px solid rgba(0,224,122,.18);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.ci-ico svg{width:16px;height:16px;stroke:var(--accent);fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.ci-lbl{font-size:.66rem;color:var(--text2);margin-bottom:.28rem;letter-spacing:.05em;text-transform:uppercase;font-weight:600}
.ci-val{font-size:.86rem;color:var(--white);font-weight:500;font-family:var(--font-display);line-height:1.4}
@media(max-width:800px){.contact-grid{grid-template-columns:1fr;gap:1.5rem}}