:root{--bg:#0b1220;--fg:#e6eefb;--muted:#9fb3d1;--glass:rgba(255,255,255,0.08);--glass-stroke:rgba(255,255,255,0.35);--accent:#7cc4ff;--accent-2:#9b8cff;--success:#6ee7b7;--warning:#fbbf24}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
html,body{height:100%}
body{margin:0;font-family:ui-sans-serif,system-ui,Segoe UI,Roboto,Helvetica,Arial,Apple Color Emoji,Segoe UI Emoji;background:radial-gradient(1200px 900px at 10% 10%,#19233a 0%,transparent 60%),radial-gradient(1000px 800px at 90% 20%,#1a2a4a 0%,transparent 60%),linear-gradient(180deg,#0b1220 0%,#0b1220 100%);color:var(--fg);-webkit-font-smoothing:antialiased;line-height:1.6;opacity:0}
.container{max-width:1100px;margin:0 auto;padding:24px}
.header{position:sticky;top:0;z-index:50;backdrop-filter:saturate(130%) blur(14px);background:linear-gradient(180deg,rgba(11,18,32,0.65),rgba(11,18,32,0.35));border-bottom:1px solid rgba(255,255,255,0.08)}
.nav{display:flex;gap:12px;align-items:center;justify-content:space-between}
.brand{display:flex;flex-direction:column}
.brand a{color:var(--fg);text-decoration:none;font-weight:700;letter-spacing:.2px}
.tagline{color:var(--muted);font-size:12px}
.menu{display:flex;gap:8px}
.menu a{display:inline-flex;align-items:center;gap:8px;color:var(--fg);text-decoration:none;padding:10px 14px;border-radius:16px;background:var(--glass);border:1px solid var(--glass-stroke);box-shadow:inset 0 1px 0 rgba(255,255,255,0.15),0 8px 24px rgba(0,0,0,0.24);transition:all .3s cubic-bezier(0.4,0,0.2,1)}
.menu a:hover{transform:translateY(-2px);background:rgba(255,255,255,0.12);box-shadow:inset 0 1px 0 rgba(255,255,255,0.25),0 16px 32px rgba(0,0,0,0.35)}
.menu a:active{transform:translateY(0)}
.hero{display:grid;grid-template-columns:1.15fr .85fr;gap:28px;align-items:center;padding:54px 0}
@media (max-width:900px){.hero{grid-template-columns:1fr;padding:36px 0}}
.glass{background:var(--glass);backdrop-filter:saturate(140%) blur(18px);border:1px solid var(--glass-stroke);border-radius:20px;box-shadow:inset 0 1px 0 rgba(255,255,255,0.16),0 30px 60px rgba(0,0,0,0.45);transition:all .4s cubic-bezier(0.4,0,0.2,1)}
.glass:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,0.2),0 35px 70px rgba(0,0,0,0.5)}
.p-hero{padding:28px}
.h1{font-size:44px;line-height:1.15;margin:0 0 12px}
.h1 em{font-style:normal;background:linear-gradient(90deg,var(--accent),var(--accent-2));-webkit-background-clip:text;background-clip:text;color:transparent}
.lead{color:var(--muted);font-size:18px;margin:0 0 18px}
.badge{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:9999px;background:rgba(124,196,255,0.12);border:1px solid rgba(124,196,255,0.45);color:#cfe8ff;font-weight:600;font-size:12px;letter-spacing:.4px}
.cta-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:14px}
.btn{display:inline-flex;align-items:center;gap:10px;padding:12px 20px;border-radius:18px;text-decoration:none;border:1px solid var(--glass-stroke);background:linear-gradient(180deg,rgba(255,255,255,0.10),rgba(255,255,255,0.02));color:var(--fg);box-shadow:inset 0 1px 0 rgba(255,255,255,0.2),0 16px 40px rgba(0,0,0,0.45);transition:all .3s cubic-bezier(0.4,0,0.2,1);font-weight:500}
.btn:hover{transform:translateY(-2px) scale(1.02);box-shadow:inset 0 1px 0 rgba(255,255,255,0.3),0 24px 60px rgba(0,0,0,0.55)}
.btn:active{transform:translateY(0) scale(1)}
.btn.secondary{background:rgba(255,255,255,0.06)}
.figure{position:relative;min-height:280px;display:grid;place-items:center;padding:24px}
.blob{position:absolute;inset:-20px;background:radial-gradient(400px 300px at 30% 30%,rgba(124,196,255,0.25),transparent 60%),radial-gradient(380px 320px at 70% 60%,rgba(155,140,255,0.22),transparent 60%);filter:blur(20px);border-radius:24px;opacity:.9}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:14px}
@media (max-width:700px){.kpis{grid-template-columns:1fr}}
.kpi{padding:16px;border-radius:20px;background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.25)}
.kpi b{font-size:22px}
.section{padding:32px 0}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media (max-width:900px){.grid{grid-template-columns:1fr}}
.card{padding:18px;border-radius:20px;background:var(--glass);border:1px solid var(--glass-stroke);transition:all .3s cubic-bezier(0.4,0,0.2,1)}
.card:hover{transform:translateY(-4px);background:rgba(255,255,255,0.1);box-shadow:inset 0 1px 0 rgba(255,255,255,0.2),0 20px 40px rgba(0,0,0,0.4)}
.footer{margin-top:40px;padding:28px 0;border-top:1px solid rgba(255,255,255,0.08);background:linear-gradient(0deg,rgba(11,18,32,0.65),rgba(11,18,32,0.35))}
.footer .container{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between}
.small{font-size:12px;color:var(--muted)}
.list{display:grid;gap:10px}
.link-card{display:flex;justify-content:space-between;align-items:center;padding:16px;border-radius:20px;background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.25);transition:all .3s cubic-bezier(0.4,0,0.2,1);cursor:pointer}
.link-card:hover{transform:translateX(8px);background:rgba(255,255,255,0.1);box-shadow:0 12px 28px rgba(0,0,0,0.3)}
.link-card a{color:#d7e7ff;text-decoration:none;font-weight:500}
.link-card .hint{color:var(--muted);font-size:12px}
.logo{width:32px;height:32px;border-radius:9999px;background:linear-gradient(45deg,var(--accent),var(--accent-2));box-shadow:0 6px 18px rgba(124,196,255,0.5);animation:pulse 3s ease-in-out infinite}
@keyframes pulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.05);opacity:.9}}
.fade-in{animation:fadeIn .6s ease-out}
@keyframes fadeIn{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}