:root{
 --ink:#17151d;--muted:#6d6d78;--purple:#5d3bc9;--purple2:#7b62dd;
 --lav:#f4f0ff;--line:#e8e4ef;--paper:#fbfafc;--white:#fff;
 --shadow:0 22px 70px rgba(47,35,72,.09);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--paper)}
a{color:inherit}
.wrap{width:min(1160px,calc(100% - 32px));margin:auto}
.top{position:sticky;top:0;z-index:20;background:rgba(251,250,252,.86);backdrop-filter:blur(18px);border-bottom:1px solid rgba(232,228,239,.8)}
.nav{height:72px;display:flex;align-items:center;justify-content:space-between;gap:18px}
.brand{text-decoration:none;font-weight:900;letter-spacing:-.04em}.brand b{color:var(--purple)}
.navlinks{display:flex;gap:20px;align-items:center}.navlinks a{text-decoration:none;color:#555463;font-size:14px;font-weight:750}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;border-radius:14px;padding:13px 18px;font-weight:850;border:1px solid var(--line);background:#fff}
.btn.primary{background:linear-gradient(135deg,var(--purple),var(--purple2));color:#fff;border-color:transparent;box-shadow:0 14px 32px rgba(93,59,201,.18)}
.hero{padding:88px 0 60px}.eyebrow{font-size:12px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;color:var(--purple)}
h1{font-size:clamp(44px,7vw,82px);line-height:.98;letter-spacing:-.06em;margin:16px 0 22px;max-width:1000px}
.lead{font-size:clamp(18px,2vw,23px);line-height:1.55;color:var(--muted);max-width:780px}
.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.hero-grid{display:grid;grid-template-columns:1.3fr .7fr;gap:20px;margin-top:56px}
.panel{background:#fff;border:1px solid var(--line);border-radius:28px;padding:28px;box-shadow:var(--shadow)}
.panel.dark{background:#191622;color:#fff;border-color:#191622}
.metric{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.metric div{padding:18px;border-radius:18px;background:#f7f5fb}.metric b{display:block;font-size:26px;color:var(--purple)}.metric span{font-size:12px;color:#797582}
.section{padding:70px 0}.section h2{font-size:clamp(34px,5vw,58px);letter-spacing:-.045em;line-height:1.04;margin:0 0 18px}.section p.intro{max-width:760px;color:var(--muted);font-size:18px;line-height:1.65}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:30px}.card{background:#fff;border:1px solid var(--line);border-radius:22px;padding:22px}.card h3{font-size:19px;margin:7px 0}.card p{color:var(--muted);line-height:1.55;font-size:14px}
.kicker{font-size:11px;text-transform:uppercase;letter-spacing:.09em;font-weight:900;color:var(--purple)}
.article-list{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.article{background:#fff;border:1px solid var(--line);border-radius:22px;overflow:hidden}.article .body{padding:22px}.article h2,.article h3{font-size:22px;margin:8px 0 10px;letter-spacing:-.03em}.article p{color:var(--muted);line-height:1.55}.article a{text-decoration:none}
.article-page{width:min(820px,calc(100% - 32px));margin:60px auto 100px}.article-page h1{font-size:clamp(40px,7vw,68px);max-width:none}.article-page .meta{color:#8a8791;font-size:13px}.article-page .content{font-size:18px;line-height:1.78;color:#35323b}.article-page .content h2{font-size:32px;letter-spacing:-.035em;margin-top:48px}.article-page .cta{margin-top:50px;background:var(--lav);border:1px solid #ded5fa;border-radius:24px;padding:26px}
.footer{border-top:1px solid var(--line);padding:28px 0 50px;color:#777481;font-size:13px}.footer-in{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap}
.error{min-height:78vh;display:grid;place-items:center}.error-card{text-align:center;max-width:680px}.error-code{font-size:120px;line-height:.8;font-weight:950;letter-spacing:-.08em;color:var(--purple);opacity:.16}
@media(max-width:820px){.hero-grid,.grid3,.article-list{grid-template-columns:1fr}.metric{grid-template-columns:1fr 1fr 1fr}.navlinks a:not(.btn){display:none}}
@media(max-width:520px){.wrap{width:min(100% - 22px,1160px)}.hero{padding-top:60px}.metric{grid-template-columns:1fr}.panel{padding:20px}}