/* ══════════════════════════════════════
   LIQUID GLASS — Global Design System
   FrenchHosting
══════════════════════════════════════ */
:root {
  --c1: #6C2BD9;
  --c2: #E8392A;
  --c3: #0EA5E9;
  --c4: #10B981;
  --c5: #F59E0B;
  --c6: #EC4899;
  --glass-bg:     rgba(255,255,255,0.07);
  --glass-bg2:    rgba(255,255,255,0.04);
  --glass-bg3:    rgba(255,255,255,0.11);
  --glass-border: rgba(255,255,255,0.18);
  --glass-border2:rgba(255,255,255,0.28);
  --glass-shine:  rgba(255,255,255,0.06);
  --text:   #FFFFFF;
  --text2:  rgba(255,255,255,0.75);
  --text3:  rgba(255,255,255,0.45);
  --blur:   blur(24px);
  --blur2:  blur(40px);
  --blur3:  blur(60px);
}
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0 }
html { scroll-behavior:smooth }
body {
  font-family:'Urbanist',sans-serif;
  background:#07030F;
  color:var(--text);
  overflow-x:hidden;
  min-height:100vh;
}
/* ── ANIMATED BLOBS ── */
.scene { position:fixed; inset:0; z-index:0; overflow:hidden; }
.blob { position:absolute; border-radius:50%; filter:blur(80px); opacity:.65; will-change:transform; }
.b1 { width:700px;height:700px; background:radial-gradient(circle,#6C2BD9,#4318A3 60%,transparent); top:-200px;left:-200px; animation:blob1 20s ease-in-out infinite; }
.b2 { width:600px;height:600px; background:radial-gradient(circle,#E8392A,#C0251A 60%,transparent); top:-100px;right:-150px; animation:blob2 24s 3s ease-in-out infinite; }
.b3 { width:500px;height:500px; background:radial-gradient(circle,#0EA5E9,#0369A1 60%,transparent); bottom:-100px;left:10%; animation:blob3 18s 6s ease-in-out infinite; }
.b4 { width:450px;height:450px; background:radial-gradient(circle,#10B981,#065F46 60%,transparent); bottom:-150px;right:5%; animation:blob4 22s 9s ease-in-out infinite; }
.b5 { width:350px;height:350px; background:radial-gradient(circle,#F59E0B,#B45309 60%,transparent); top:40%;left:40%; animation:blob5 16s 2s ease-in-out infinite; }
.b6 { width:300px;height:300px; background:radial-gradient(circle,#EC4899,#9D174D 60%,transparent); top:30%;right:20%; animation:blob6 19s 5s ease-in-out infinite; }
@keyframes blob1{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(80px,60px) scale(1.1)}66%{transform:translate(-40px,100px) scale(.95)}}
@keyframes blob2{0%,100%{transform:translate(0,0) scale(1)}40%{transform:translate(-100px,50px) scale(1.08)}70%{transform:translate(-50px,120px) scale(.92)}}
@keyframes blob3{0%,100%{transform:translate(0,0) scale(1)}30%{transform:translate(100px,-60px) scale(1.12)}70%{transform:translate(50px,-120px) scale(.98)}}
@keyframes blob4{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-80px,-80px) scale(1.06)}}
@keyframes blob5{0%,100%{transform:translate(0,0) scale(1) rotate(0deg)}50%{transform:translate(-60px,-80px) scale(1.15) rotate(20deg)}}
@keyframes blob6{0%,100%{transform:translate(0,0) scale(1)}40%{transform:translate(-70px,60px) scale(1.1)}80%{transform:translate(40px,-50px) scale(.9)}}
.scene::after { content:''; position:absolute;inset:0; background:linear-gradient(135deg,rgba(7,3,15,.5) 0%,rgba(7,3,15,.3) 50%,rgba(7,3,15,.5) 100%); pointer-events:none; }
/* ── GLASS ── */
.glass { background:var(--glass-bg); backdrop-filter:var(--blur); -webkit-backdrop-filter:var(--blur); border:1px solid var(--glass-border); position:relative; }
.glass::before { content:''; position:absolute;top:0;left:10%;right:10%; height:1px; background:linear-gradient(90deg,transparent,rgba(255,255,255,.5),transparent); border-radius:50%; }
.glass::after { content:''; position:absolute;inset:0; background:linear-gradient(135deg,rgba(255,255,255,.04) 0%,transparent 50%,rgba(255,255,255,.02) 100%); border-radius:inherit; pointer-events:none; }
/* ── TOPBAR ── */
.topbar { position:relative;z-index:200; background:linear-gradient(90deg,rgba(108,43,217,.6),rgba(232,57,42,.5)); backdrop-filter:blur(10px); border-bottom:1px solid rgba(255,255,255,.1); padding:.5rem 2rem;text-align:center; font-size:.8rem;font-weight:600;color:#fff;letter-spacing:.02em; }
.topbar a{color:#fff;text-decoration:underline;text-underline-offset:2px;font-weight:700}
.tbx{position:absolute;right:1.5rem;top:50%;transform:translateY(-50%);background:none;border:none;color:rgba(255,255,255,.6);cursor:pointer;font-size:1rem}
.tbx:hover{color:#fff}
/* ── FLOATING NAV ── */
.nav-float-wrap { position:fixed; top:20px; left:50%; transform:translateX(-50%); z-index:999; width:calc(100% - 48px); max-width:1100px; transition:top .3s ease; }
nav { display:flex; align-items:center; height:58px; padding:0 1.2rem 0 1rem; background:rgba(12,6,28,0.55); backdrop-filter:blur(28px) saturate(180%); -webkit-backdrop-filter:blur(28px) saturate(180%); border:1px solid rgba(255,255,255,.18); border-radius:100px; box-shadow:0 8px 32px rgba(0,0,0,.45),0 2px 8px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.18),inset 0 -1px 0 rgba(0,0,0,.25),0 0 0 1px rgba(255,255,255,.04); transition:box-shadow .3s,background .3s; position:relative; }
nav.scrolled { background:rgba(12,6,28,0.75); box-shadow:0 16px 48px rgba(0,0,0,.55),0 4px 16px rgba(108,43,217,.15),inset 0 1px 0 rgba(255,255,255,.2),inset 0 -1px 0 rgba(0,0,0,.3),0 0 0 1px rgba(255,255,255,.06); }
nav::before { content:''; position:absolute; top:0;left:12%;right:12%; height:1px; background:linear-gradient(90deg,transparent,rgba(196,181,253,.6),rgba(252,165,165,.5),rgba(196,181,253,.6),transparent); border-radius:50%; pointer-events:none; }
nav::after { content:''; position:absolute; inset:0; border-radius:100px; background:linear-gradient(135deg,rgba(255,255,255,.06) 0%,transparent 40%,rgba(255,255,255,.02) 100%); pointer-events:none; }
.nl-wrap { display:flex;align-items:center;gap:.55rem; text-decoration:none;margin-right:1.5rem;flex-shrink:0; }
.nl-ico { width:32px;height:32px;border-radius:9px; background:linear-gradient(135deg,var(--c1),var(--c2)); display:grid;place-items:center;font-size:.95rem; box-shadow:0 0 14px rgba(108,43,217,.5),inset 0 1px 0 rgba(255,255,255,.3); }
.nl-name { font-size:1rem;font-weight:800;color:var(--text);letter-spacing:-.02em; }
.nl-name span { color:rgba(255,255,255,.45);font-weight:500; }
.nlinks{display:flex;align-items:center;gap:.05rem;list-style:none;flex:1}
.ni{position:relative}
.nla{ display:flex;align-items:center;gap:.28rem; padding:.38rem .78rem; color:rgba(255,255,255,.6);text-decoration:none; font-size:.83rem;font-weight:600;border-radius:100px; transition:all .15s;white-space:nowrap;cursor:pointer;user-select:none; }
.nla:hover{ color:#fff; background:rgba(255,255,255,.1); }
.ni.open>.nla{ color:#fff; background:rgba(255,255,255,.1); }
.nla svg{width:9px;height:9px;opacity:.5;transition:transform .2s,opacity .2s}
.ni.open .nla svg{transform:rotate(180deg);opacity:1}
/* ── GLASS DROPDOWNS (click-based) ── */
.gdrop { position:absolute;top:calc(100% + 12px);left:50%; transform:translateX(-50%) translateY(8px); opacity:0;pointer-events:none; background:rgba(10,5,25,.85); backdrop-filter:var(--blur2); -webkit-backdrop-filter:var(--blur2); border:1px solid var(--glass-border); border-radius:18px;padding:.8rem; min-width:480px; box-shadow:0 32px 80px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.12),0 0 0 1px rgba(255,255,255,.04); transition:opacity .25s ease,transform .25s ease; z-index:1000; }
.ni.open .gdrop{opacity:1;pointer-events:all;transform:translateX(-50%) translateY(0)}
.dd-grid{display:grid;grid-template-columns:1fr 1fr;gap:.4rem}
.ddi{ display:flex;align-items:center;gap:.85rem; padding:.75rem 1rem;border-radius:12px; text-decoration:none;color:var(--text); border:1px solid transparent;transition:all .15s; }
.ddi:hover{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.12)}
.ddi-ico{ width:42px;height:42px;border-radius:10px; display:grid;place-items:center;font-size:1.2rem;flex-shrink:0; box-shadow:inset 0 1px 0 rgba(255,255,255,0.25); overflow:hidden; }
.gi1{background:linear-gradient(135deg,#E55D1F,#7C2D12)}.gi2{background:linear-gradient(135deg,#2563EB,#1E3A8A)}.gi3{background:linear-gradient(135deg,#16A34A,#14532D)}.gi4{background:linear-gradient(135deg,#7C3AED,#4C1D95)}.gi5{background:linear-gradient(135deg,#B91C1C,#7F1D1D)}.gi6{background:linear-gradient(135deg,#065F46,#022C22)}.gi7{background:linear-gradient(135deg,var(--c1),var(--c2))}
.ddi-n{font-size:.875rem;font-weight:700}
.ddi-s{font-size:.72rem;color:rgba(255,255,255,.45);margin-top:.1rem}
.dd-foot{margin-top:.5rem;padding-top:.6rem;border-top:1px solid rgba(255,255,255,.08)}
.sdrop{ position:absolute;top:calc(100% + 12px);left:0; opacity:0;pointer-events:none; background:rgba(10,5,25,.85); backdrop-filter:var(--blur2); -webkit-backdrop-filter:var(--blur2); border:1px solid var(--glass-border); border-radius:16px;padding:.6rem;min-width:290px; box-shadow:0 24px 60px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.1); transition:opacity .25s ease,transform .25s ease;transform:translateY(8px); z-index:1000; }
.ni.open .sdrop{opacity:1;pointer-events:all;transform:translateY(0)}
.sdi{ display:flex;align-items:center;gap:.8rem; padding:.75rem 1rem;border-radius:10px; text-decoration:none;color:var(--text); font-size:.875rem;font-weight:600;transition:background .15s; }
.sdi:hover{background:rgba(255,255,255,.07)}
.sdi-ico{ width:34px;height:34px;border-radius:8px;display:grid;place-items:center;font-size:1rem;flex-shrink:0; overflow:hidden; }
.sdi-sub{font-size:.72rem;color:rgba(255,255,255,.45);font-weight:400;margin-top:.1rem}
.nr{display:flex;align-items:center;gap:.6rem;margin-left:auto}
.online-pill{ display:flex;align-items:center;gap:.38rem; background:rgba(16,185,129,.1); border:1px solid rgba(16,185,129,.25); backdrop-filter:blur(8px); padding:.3rem .75rem;border-radius:100px; font-family:'Fira Code',monospace;font-size:.67rem;font-weight:500; color:#6EE7B7; }
.op-dot{width:5px;height:5px;background:#10B981;border-radius:50%;box-shadow:0 0 6px #10B981;animation:pulse 2s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}
.btn-login { padding:.38rem .9rem; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.14); backdrop-filter:blur(8px); border-radius:100px;color:rgba(255,255,255,.7); text-decoration:none;font-size:.8rem;font-weight:600; transition:all .15s; }
.btn-login:hover{background:rgba(255,255,255,.13);color:#fff;border-color:rgba(255,255,255,.25)}
.btn-cta { padding:.44rem 1.1rem; background:linear-gradient(135deg,rgba(108,43,217,.85),rgba(232,57,42,.75)); border:1px solid rgba(255,255,255,.2); backdrop-filter:blur(8px); border-radius:100px;color:#fff; text-decoration:none;font-size:.82rem;font-weight:700; box-shadow:0 3px 14px rgba(108,43,217,.4),inset 0 1px 0 rgba(255,255,255,.25); transition:all .2s;letter-spacing:.01em; }
.btn-cta:hover{transform:translateY(-1px);box-shadow:0 6px 22px rgba(108,43,217,.55),inset 0 1px 0 rgba(255,255,255,.3)}
/* ── HERO ── */
.hero-outer{position:relative;z-index:1;min-height:calc(100vh - 90px);display:flex;align-items:center;padding:7rem 2.5rem 3rem}
.hero-inner{max-width:1400px;margin:0 auto;width:100%;display:grid;grid-template-columns:1.1fr 1fr;gap:3rem;align-items:center}
.h-kicker{ display:inline-flex;align-items:center;gap:.5rem; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.15); backdrop-filter:blur(12px); padding:.38rem 1rem;border-radius:100px; font-family:'Fira Code',monospace;font-size:.72rem; color:rgba(255,255,255,.75);letter-spacing:.1em; margin-bottom:1.8rem; animation:fadeUp .7s ease both; box-shadow:inset 0 1px 0 rgba(255,255,255,.15); }
.hk-dot{width:6px;height:6px;background:#10B981;border-radius:50%;box-shadow:0 0 8px #10B981;animation:pulse 2s infinite}
.hero h1{ font-size:clamp(3rem,5.5vw,5.2rem);font-weight:900;line-height:1.04;letter-spacing:-.03em; animation:fadeUp .85s .07s ease both;opacity:0; }
.h1g{ background:linear-gradient(135deg,#fff 0%,rgba(255,255,255,.85) 40%,#C4B5FD 70%,#FDA4AF 100%); -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; }
.h1w{display:block}
.h1s{display:block;font-size:.42em;font-weight:500;color:rgba(255,255,255,.45);letter-spacing:-.01em;margin-top:.5rem}
.hero-desc{ font-size:1.08rem;color:rgba(255,255,255,.65);line-height:1.8; margin:2rem 0 2.2rem;max-width:530px;font-weight:400; animation:fadeUp .95s .14s ease both;opacity:0; }
.hpills{ display:flex;flex-wrap:wrap;gap:.55rem;margin-bottom:2.5rem; animation:fadeUp 1.05s .2s ease both;opacity:0; }
.hp{ display:flex;align-items:center;gap:.4rem; padding:.38rem .9rem; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.14); backdrop-filter:blur(10px); border-radius:100px;font-size:.82rem;font-weight:600; color:rgba(255,255,255,.85); box-shadow:inset 0 1px 0 rgba(255,255,255,.12); transition:all .2s; }
.hp:hover{background:rgba(255,255,255,.13);border-color:rgba(255,255,255,.25);color:#fff}
.hpd{width:7px;height:7px;border-radius:50%;box-shadow:0 0 6px currentColor}
.hpd.cv{background:#C4B5FD;color:#C4B5FD}.hpd.ct{background:#6EE7B7;color:#6EE7B7}.hpd.co{background:#FCA5A5;color:#FCA5A5}.hpd.cg{background:#FDE68A;color:#FDE68A}
.h-btns{display:flex;gap:.9rem;align-items:center;animation:fadeUp 1.1s .26s ease both;opacity:0}
.btn-main{ display:inline-flex;align-items:center;gap:.55rem; background:linear-gradient(135deg,rgba(108,43,217,.9),rgba(232,57,42,.8)); border:1px solid rgba(255,255,255,.22); color:#fff;padding:.85rem 2rem;border-radius:14px; text-decoration:none;font-size:.95rem;font-weight:700; box-shadow:0 6px 30px rgba(108,43,217,.45),inset 0 1px 0 rgba(255,255,255,.25); backdrop-filter:blur(8px);transition:all .25s; }
.btn-main:hover{transform:translateY(-3px);box-shadow:0 12px 40px rgba(108,43,217,.6),inset 0 1px 0 rgba(255,255,255,.3)}
.btn-ghost{ display:inline-flex;align-items:center;gap:.5rem; background:rgba(255,255,255,.08); border:1px solid var(--glass-border); backdrop-filter:blur(12px); color:rgba(255,255,255,.8);padding:.85rem 1.7rem;border-radius:14px; text-decoration:none;font-size:.95rem;font-weight:600; box-shadow:inset 0 1px 0 rgba(255,255,255,.12); transition:all .2s; }
.btn-ghost:hover{background:rgba(255,255,255,.14);color:#fff;border-color:rgba(255,255,255,.28)}
.hero-panel{animation:fadeUp .95s .23s ease both;opacity:0}
.glass-panel{ background:rgba(255,255,255,.07); backdrop-filter:var(--blur2); -webkit-backdrop-filter:var(--blur2); border:1px solid var(--glass-border); border-radius:22px;overflow:hidden; box-shadow:0 40px 100px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.2),inset 0 -1px 0 rgba(0,0,0,.2),0 0 0 1px rgba(255,255,255,.03); }
.gp-bar{ background:rgba(255,255,255,.05); border-bottom:1px solid rgba(255,255,255,.1); padding:.9rem 1.3rem; display:flex;align-items:center;justify-content:space-between; box-shadow:inset 0 1px 0 rgba(255,255,255,.1); }
.gp-dots{display:flex;gap:.4rem}
.gp-dot{width:11px;height:11px;border-radius:50%;box-shadow:0 1px 3px rgba(0,0,0,.3)}
.dr{background:#FF5F57}.dy{background:#FEBC2E}.dg{background:#28C840}
.gp-title{ font-family:'Fira Code',monospace;font-size:.7rem; color:rgba(255,255,255,.4);letter-spacing:.08em; }
.gp-body{padding:1.3rem;display:flex;flex-direction:column;gap:.9rem}
.gp-uptime{ background:linear-gradient(135deg,rgba(108,43,217,.2),rgba(232,57,42,.15)); border:1px solid rgba(255,255,255,.12); border-radius:14px;padding:1.1rem 1.3rem; display:flex;align-items:center;justify-content:space-between; box-shadow:inset 0 1px 0 rgba(255,255,255,.1); backdrop-filter:blur(8px); }
.gp-up-tag{ font-family:'Fira Code',monospace;font-size:.62rem; color:rgba(255,255,255,.5);letter-spacing:.12em;text-transform:uppercase;margin-bottom:.3rem; }
.gp-up-val{ font-size:2.4rem;font-weight:900;letter-spacing:-.04em;line-height:1; background:linear-gradient(135deg,#fff,#C4B5FD,#FCA5A5); -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; }
.gp-badge{ font-family:'Fira Code',monospace;font-size:.65rem; background:rgba(16,185,129,.15);color:#6EE7B7; border:1px solid rgba(16,185,129,.25);padding:.3rem .7rem; border-radius:7px;backdrop-filter:blur(4px); }
.gp-srvs{display:flex;flex-direction:column;gap:.5rem}
.gp-srv{ display:flex;align-items:center;gap:.85rem; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.09); border-radius:11px;padding:.75rem 1rem; backdrop-filter:blur(6px);transition:border-color .2s; box-shadow:inset 0 1px 0 rgba(255,255,255,.07); }
.gp-srv:hover{border-color:rgba(255,255,255,.18)}
.srv-led{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.l1{background:#6EE7B7;box-shadow:0 0 10px #10B981;animation:pulse 2.5s infinite}.l2{background:#C4B5FD;box-shadow:0 0 10px #7C3AED;animation:pulse 3s .6s infinite}.l3{background:#FCA5A5;box-shadow:0 0 10px #E8392A;animation:pulse 2s 1.2s infinite}
.srv-nm{font-size:.82rem;font-weight:600;flex:1;color:rgba(255,255,255,.85)}
.srv-ms{ font-family:'Fira Code',monospace;font-size:.7rem; background:rgba(110,231,183,.1);color:#6EE7B7; padding:.15rem .55rem;border-radius:5px; }
.srv-cpu{font-family:'Fira Code',monospace;font-size:.7rem;color:rgba(255,255,255,.35)}
.gp-chart{ background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08); border-radius:11px;padding:1rem; backdrop-filter:blur(6px); }
.gpc-h{ display:flex;justify-content:space-between;align-items:center; font-family:'Fira Code',monospace;font-size:.62rem; color:rgba(255,255,255,.4);letter-spacing:.08em;text-transform:uppercase;margin-bottom:.8rem; }
.gpc-v{color:#C4B5FD}
.cbars{display:flex;align-items:flex-end;gap:4px;height:46px}
.cbar{ flex:1;border-radius:3px 3px 0 0; background:rgba(255,255,255,.08);transition:background .2s; }
.cbar:hover{background:rgba(196,181,253,.5)}
.cbar.hi{background:rgba(196,181,253,.25)}
.cbar.top{ background:linear-gradient(180deg,rgba(196,181,253,.8),rgba(252,165,165,.5)); box-shadow:0 0 12px rgba(196,181,253,.4); }
/* ── STATS BAND ── */
.stats-band{ position:relative;z-index:1; background:rgba(255,255,255,.04); backdrop-filter:var(--blur); -webkit-backdrop-filter:var(--blur); border-top:1px solid var(--glass-border); border-bottom:1px solid var(--glass-border); display:grid;grid-template-columns:repeat(4,1fr); box-shadow:inset 0 1px 0 rgba(255,255,255,.08); }
.sb{ padding:2.2rem 1.5rem;text-align:center; border-right:1px solid rgba(255,255,255,.06); transition:background .2s;position:relative;overflow:hidden; }
.sb:last-child{border-right:none}
.sb:hover{background:rgba(255,255,255,.04)}
.sb::after{ content:'';position:absolute;bottom:0;left:50%;transform:translateX(-50%); width:0;height:2px; background:linear-gradient(90deg,var(--c1),var(--c2)); transition:width .4s;box-shadow:0 0 12px rgba(108,43,217,.6); }
.sb:hover::after{width:50%}
.sb-n{ font-size:2.2rem;font-weight:900;letter-spacing:-.03em; background:linear-gradient(135deg,#fff,#C4B5FD); -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; }
.sb-l{font-size:.78rem;color:rgba(255,255,255,.45);margin-top:.25rem;font-weight:500}
/* ── LAYOUT ── */
.section{position:relative;z-index:1;padding:5.5rem 2.5rem}
.section.alt{ background:rgba(255,255,255,.02); border-top:1px solid rgba(255,255,255,.05); border-bottom:1px solid rgba(255,255,255,.05); }
.mx{max-width:1400px;margin:0 auto}
.kicker{ display:inline-flex;align-items:center;gap:.5rem; font-family:'Fira Code',monospace;font-size:.68rem;font-weight:400; color:rgba(255,255,255,.55);letter-spacing:.15em;text-transform:uppercase;margin-bottom:.9rem; }
.kicker::before{content:'//';color:rgba(196,181,253,.7);margin-right:.1rem}
.sh2{ font-size:clamp(2rem,3.5vw,3rem);font-weight:900;letter-spacing:-.03em;line-height:1.1; }
.sh2 .g{ background:linear-gradient(135deg,#C4B5FD,#FDA4AF); -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; }
.sp{color:rgba(255,255,255,.55);font-size:.98rem;line-height:1.8;margin-top:.8rem;max-width:510px}
/* ── SERVICES GRID ── */
.sv-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:2.5rem}
.lm{ color:#C4B5FD;text-decoration:none;font-size:.85rem;font-weight:700; display:flex;align-items:center;gap:.4rem;transition:gap .2s; }
.lm:hover{gap:.8rem}
.sv-grid{ display:grid;grid-template-columns:repeat(4,1fr); gap:1px; background:rgba(255,255,255,.05); border-radius:18px;overflow:hidden; box-shadow:0 0 0 1px rgba(255,255,255,.05); }
.svc{ background:rgba(255,255,255,.04); backdrop-filter:blur(12px); padding:1.8rem 1.5rem; text-decoration:none;color:var(--text); display:flex;flex-direction:column;gap:.9rem; transition:all .25s;position:relative;overflow:hidden; }
.svc::before{ content:'';position:absolute;inset:0; background:linear-gradient(135deg,rgba(255,255,255,.06) 0%,transparent 60%); opacity:0;transition:opacity .3s; }
.svc::after{ content:'';position:absolute;top:0;left:0;right:0;height:1px; background:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent); transform:scaleX(0);transform-origin:left;transition:transform .4s; }
.svc:hover{background:rgba(255,255,255,.09)}
.svc:hover::before{opacity:1}
.svc:hover::after{transform:scaleX(1)}
.sv-ico{ width:50px;height:50px;border-radius:13px; display:grid;place-items:center;font-size:1.4rem; box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 4px 12px rgba(0,0,0,.3); overflow:hidden; }
.sv-n{font-size:1rem;font-weight:800;letter-spacing:-.01em}
.sv-d{font-size:.8rem;color:rgba(255,255,255,.5);line-height:1.55;flex:1}
.sv-p{font-family:'Fira Code',monospace;font-size:.8rem;color:rgba(196,181,253,.8)}
/* ── WHY + ACCORDION ── */
.why-grid{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:start}
.feat-stack{display:flex;flex-direction:column;gap:.65rem;margin-top:2rem}
.feat-g{ display:flex;align-items:flex-start;gap:1.1rem; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1); backdrop-filter:blur(14px); border-radius:14px;padding:1.1rem 1.2rem; box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 4px 20px rgba(0,0,0,.2); transition:all .22s; }
.feat-g:hover{ background:rgba(255,255,255,.09); border-color:rgba(255,255,255,.18); transform:translateX(5px); box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 8px 30px rgba(0,0,0,.25); }
.fg-ico{ width:44px;height:44px;border-radius:11px; display:grid;place-items:center;font-size:1.15rem;flex-shrink:0; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.12); box-shadow:inset 0 1px 0 rgba(255,255,255,.15); }
.fg-title{font-size:.92rem;font-weight:700;margin-bottom:.2rem}
.fg-desc{font-size:.8rem;color:rgba(255,255,255,.5);line-height:1.6}
.acc-stack{display:flex;flex-direction:column;gap:.55rem;margin-top:2rem}
.a-it{ background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); border-radius:14px;overflow:hidden; box-shadow:inset 0 1px 0 rgba(255,255,255,.08); transition:all .2s; }
.a-it.on{ background:rgba(255,255,255,.09); border-color:rgba(196,181,253,.3); box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 0 20px rgba(108,43,217,.15); }
.a-btn{ width:100%;background:none;border:none;color:rgba(255,255,255,.85); display:flex;justify-content:space-between;align-items:center; padding:1.1rem 1.3rem;cursor:pointer;text-align:left; font-family:'Urbanist',sans-serif;font-size:.92rem;font-weight:700;transition:color .15s; }
.a-btn:hover{color:#fff}
.a-it.on .a-btn{color:#fff}
.a-arr{ width:28px;height:28px;border-radius:8px; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.12); display:grid;place-items:center;font-size:.7rem; color:rgba(255,255,255,.5);flex-shrink:0;transition:all .25s; }
.a-it.on .a-arr{ background:linear-gradient(135deg,rgba(108,43,217,.8),rgba(232,57,42,.7)); border-color:rgba(255,255,255,.2);color:#fff;transform:rotate(45deg); box-shadow:inset 0 1px 0 rgba(255,255,255,.2); }
.a-body{max-height:0;overflow:hidden;transition:max-height .35s ease}
.a-it.on .a-body{max-height:200px}
.a-body p{padding:0 1.3rem 1.2rem;font-size:.87rem;color:rgba(255,255,255,.55);line-height:1.75}
/* ── PRICING ── */
.price-top{text-align:center;margin-bottom:3rem}
.price-top .kicker{justify-content:center}
.price-top .sp{margin:0 auto;text-align:center}
.plans-grid{ display:grid;grid-template-columns:repeat(3,1fr); gap:1.3rem;max-width:900px;margin:0 auto; }
.plan-g{ background:rgba(255,255,255,.06); backdrop-filter:var(--blur); -webkit-backdrop-filter:var(--blur); border:1px solid var(--glass-border); border-radius:20px;padding:2.2rem 2rem; position:relative;overflow:hidden; box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 20px 60px rgba(0,0,0,.3); transition:all .28s; }
.plan-g::before{ content:'';position:absolute;top:0;left:0;right:0;height:1px; background:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent); }
.plan-g:hover{ background:rgba(255,255,255,.1); border-color:rgba(255,255,255,.22); transform:translateY(-7px); box-shadow:inset 0 1px 0 rgba(255,255,255,.15),0 30px 70px rgba(0,0,0,.4); }
.plan-g.hot{ background:linear-gradient(155deg,rgba(108,43,217,.2),rgba(232,57,42,.1),rgba(255,255,255,.06)); border-color:rgba(196,181,253,.3); box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 0 0 1px rgba(196,181,253,.1),0 20px 60px rgba(108,43,217,.2); }
.plan-badge{ position:absolute;top:-1px;left:50%;transform:translateX(-50%); background:linear-gradient(135deg,rgba(108,43,217,.9),rgba(232,57,42,.8)); border:1px solid rgba(255,255,255,.2); color:#fff;font-size:.62rem;font-weight:800;letter-spacing:.1em; padding:.32rem 1rem;border-radius:0 0 10px 10px;white-space:nowrap; box-shadow:0 4px 12px rgba(108,43,217,.4),inset 0 1px 0 rgba(255,255,255,.2); }
.p-tier{ font-family:'Fira Code',monospace;font-size:.64rem;letter-spacing:.18em; text-transform:uppercase;color:rgba(196,181,253,.7);margin-bottom:.4rem; }
.p-name{font-size:1.5rem;font-weight:900;letter-spacing:-.025em;margin-bottom:1rem}
.p-price{display:flex;align-items:baseline;gap:.1rem;margin-bottom:.25rem}
.p-cur{font-size:1rem;font-weight:600;color:rgba(255,255,255,.45)}
.p-val{ font-size:3.2rem;font-weight:900;letter-spacing:-.04em;line-height:1; background:linear-gradient(135deg,#fff,#C4B5FD); -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; }
.p-per{font-size:.85rem;color:rgba(255,255,255,.45)}
.p-note{font-family:'Fira Code',monospace;font-size:.7rem;color:rgba(255,255,255,.35);margin-bottom:1.3rem}
.p-sep{height:1px;background:rgba(255,255,255,.08);margin:1.2rem 0}
.p-feats{list-style:none;display:flex;flex-direction:column;gap:.55rem;margin-bottom:1.8rem}
.p-feats li{display:flex;align-items:center;gap:.65rem;font-size:.85rem;color:rgba(255,255,255,.8)}
.p-feats li::before{ content:'✓'; background:linear-gradient(135deg,#C4B5FD,#FDA4AF); -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; font-weight:800;font-size:.78rem;flex-shrink:0; }
.p-feats li.no::before{content:'✕';background:none;-webkit-text-fill-color:rgba(255,255,255,.2)}
.p-feats li.no{color:rgba(255,255,255,.3)}
.btn-pg{ display:block;text-align:center;padding:.82rem;border-radius:12px; text-decoration:none;font-size:.9rem;font-weight:700;transition:all .22s; box-shadow:inset 0 1px 0 rgba(255,255,255,.15); }
.bpg{ background:linear-gradient(135deg,rgba(108,43,217,.85),rgba(232,57,42,.75)); color:#fff;border:1px solid rgba(255,255,255,.18); }
.bpg:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(108,43,217,.45),inset 0 1px 0 rgba(255,255,255,.2)}
.bpo{ background:rgba(255,255,255,.07);color:rgba(255,255,255,.8); border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(8px); }
.bpo:hover{background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.22)}
/* ── TESTIMONIALS ── */
.tgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.3rem;margin-top:2.5rem}
.tcard{ background:rgba(255,255,255,.05); backdrop-filter:var(--blur); -webkit-backdrop-filter:var(--blur); border:1px solid var(--glass-border); border-radius:18px;padding:1.8rem; box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 8px 30px rgba(0,0,0,.2); position:relative;overflow:hidden; transition:all .25s; }
.tcard::before{ content:'';position:absolute;top:0;left:0;right:0;height:1px; background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent); }
.tcard:hover{ background:rgba(255,255,255,.09); border-color:rgba(255,255,255,.2); transform:translateY(-5px); box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 20px 50px rgba(0,0,0,.3); }
.tq{ position:absolute;top:.4rem;right:1.2rem; font-size:7rem;font-weight:900;line-height:1; background:linear-gradient(135deg,#C4B5FD,#FDA4AF); -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; opacity:.1;pointer-events:none; }
.tst{color:#FDE68A;font-size:.8rem;margin-bottom:1rem;letter-spacing:.05em}
.tt{font-size:.9rem;color:rgba(255,255,255,.6);line-height:1.78;margin-bottom:1.4rem}
.tau{display:flex;align-items:center;gap:.75rem}
.tav{ width:38px;height:38px;border-radius:50%; background:linear-gradient(135deg,rgba(108,43,217,.8),rgba(232,57,42,.7)); border:1px solid rgba(255,255,255,.15); display:grid;place-items:center;font-weight:800;font-size:.85rem;color:#fff; box-shadow:inset 0 1px 0 rgba(255,255,255,.2);flex-shrink:0; }
.tn{font-size:.875rem;font-weight:700}
.tr{font-family:'Fira Code',monospace;font-size:.68rem;color:rgba(255,255,255,.4);margin-top:.05rem}
/* ── CTA ── */
.cta-wrap{ background:rgba(255,255,255,.05); backdrop-filter:var(--blur2); -webkit-backdrop-filter:var(--blur2); border:1px solid var(--glass-border); border-radius:28px;padding:5rem 3rem;text-align:center; position:relative;overflow:hidden; box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 40px 100px rgba(0,0,0,.3); }
.cta-wrap::before{ content:'';position:absolute;top:0;left:0;right:0;height:2px; background:linear-gradient(90deg,transparent,var(--c1),var(--c2),var(--c3),var(--c1),transparent); background-size:200%;animation:iris 5s linear infinite; }
@keyframes iris{0%{background-position:0%}100%{background-position:200%}}
.cta-wrap::after{ content:'';position:absolute;top:50%;left:50%; transform:translate(-50%,-50%); width:600px;height:300px; background:radial-gradient(ellipse,rgba(108,43,217,.12) 0%,rgba(232,57,42,.07) 50%,transparent 70%); pointer-events:none; }
.cta-h{font-size:clamp(2rem,4vw,3.2rem);font-weight:900;letter-spacing:-.03em;line-height:1.1;margin-bottom:1rem}
.cta-h .g{ background:linear-gradient(135deg,#C4B5FD,#FDA4AF); -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; }
.cta-sub{color:rgba(255,255,255,.55);font-size:1rem;margin-bottom:2.5rem}
.cta-acts{display:flex;gap:.9rem;justify-content:center}
/* ── FOOTER ── */
footer{ position:relative;z-index:1; background:rgba(7,3,15,.7); backdrop-filter:var(--blur); border-top:1px solid rgba(255,255,255,.08); padding:4rem 2.5rem 2rem; }
.f-wrap{max-width:1400px;margin:0 auto}
.f-grid{display:grid;grid-template-columns:2.2fr 1fr 1fr 1fr;gap:3rem;margin-bottom:3rem}
.f-desc{font-size:.85rem;color:rgba(255,255,255,.4);line-height:1.75;margin:1rem 0 1.5rem}
.f-rgpd{ display:flex;align-items:center;gap:.45rem; font-family:'Fira Code',monospace;font-size:.7rem;color:rgba(255,255,255,.3); }
.frd{width:6px;height:6px;background:#10B981;border-radius:50%;box-shadow:0 0 6px #10B981}
.f-col h5{font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.6);margin-bottom:1.1rem}
.f-col ul{list-style:none;display:flex;flex-direction:column;gap:.5rem}
.f-col a{color:rgba(255,255,255,.4);text-decoration:none;font-size:.85rem;transition:color .15s}
.f-col a:hover{color:rgba(255,255,255,.8)}
.f-bot{ border-top:1px solid rgba(255,255,255,.07);padding-top:1.8rem; display:flex;justify-content:space-between;align-items:center; font-size:.78rem;color:rgba(255,255,255,.3); }
.f-bgs{display:flex;gap:.5rem}
.f-bg{ background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08); border-radius:5px;padding:.25rem .65rem; font-family:'Fira Code',monospace;font-size:.62rem;letter-spacing:.08em; color:rgba(255,255,255,.35); }
/* ── ANIMATIONS ── */
@keyframes fadeUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
.rv{opacity:0;transform:translateY(24px);transition:opacity .65s ease,transform .65s ease}
.rv.vis{opacity:1;transform:none}
.d1{transition-delay:.08s}.d2{transition-delay:.16s}.d3{transition-delay:.24s}.d4{transition-delay:.32s}
/* ── SCROLLBAR ── */
::-webkit-scrollbar{width:5px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:rgba(108,43,217,.3);border-radius:10px}
::-webkit-scrollbar-thumb:hover{background:rgba(108,43,217,.5)}
/* ── RESPONSIVE ── */
@media(max-width:1100px){.sv-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){
  .nav-float-wrap{width:calc(100% - 24px);top:12px}
  nav{padding:0 .8rem;border-radius:100px}
  .hero-inner{grid-template-columns:1fr;padding-top:1rem}
  .hero-panel{display:none}
  .why-grid,.plans-grid,.tgrid{grid-template-columns:1fr}
  .stats-band{grid-template-columns:repeat(2,1fr)}
  .sv-grid{grid-template-columns:1fr}
  .f-grid{grid-template-columns:1fr 1fr}
  .section{padding:4rem 1.5rem}
  .nlinks{display:none}
  .online-pill{display:none}
  .cta-acts{flex-direction:column;align-items:center}
  .cta-wrap{padding:3rem 1.5rem}
  .hero-outer{padding:3.5rem 1.5rem 2.5rem}
}