:root{--bg:#f7f6ff;--c:#ffffffd9;--bd:#1b164226;--tx:#1a1640;--mu:#5b5780;--p:#6d4aff;--g:#0f9e7b}
*{box-sizing:border-box;margin:0}html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--tx);font:17px/1.7 Inter,system-ui,sans-serif;overflow-x:hidden}
h1,h2,h3,.logo,.btn{font-family:Outfit,sans-serif}a{color:inherit;text-decoration:none}
.wrap{max-width:1140px;margin:auto;padding:0 22px}.nar{max-width:760px}
.glow{position:fixed;mix-blend-mode:multiply;width:520px;height:520px;border-radius:50%;background:radial-gradient(#7c5cff33,transparent 65%);pointer-events:none;transform:translate(-50%,-50%);z-index:0;left:50%;top:30%}
#pg{position:fixed;top:0;left:0;height:3px;width:0;background:linear-gradient(90deg,var(--p),var(--g));z-index:99}
.skip{position:absolute;left:-999px}.hd{position:sticky;top:0;z-index:50;backdrop-filter:blur(16px);background:#ffffffcc;border-bottom:1px solid var(--bd)}
.hd{box-shadow:0 4px 24px #6d4aff12}.tc,.glass,.tool{box-shadow:0 10px 36px #6d4aff14}.ft{background:#fff}.hdi{display:flex;align-items:center;justify-content:space-between;height:68px}.logo{display:flex;align-items:center;gap:10px;font-weight:800;font-size:1.3rem}
.nv{display:flex;gap:26px;align-items:center}.nv a:hover{color:var(--g)}.bg{display:none;background:0;border:0;color:#fff}
.btn{display:inline-block;padding:13px 26px;border-radius:99px;background:linear-gradient(135deg,var(--p),#a78bfa);color:#fff!important;font-weight:700;box-shadow:0 8px 30px #7c5cff55;transition:.3s}
.btn:hover{transform:translateY(-3px);box-shadow:0 14px 40px #7c5cff88}.btn.alt{background:#fff;color:var(--tx)!important;border:1px solid var(--bd);box-shadow:none}
main{position:relative;z-index:1}.sec{padding:70px 0}
.gt{font-size:clamp(2.2rem,5vw,3.6rem);line-height:1.1;font-weight:800;background:linear-gradient(120deg,#1a1640 15%,#6d4aff 60%,#0f9e7b);-webkit-background-clip:text;background-clip:text;color:transparent;margin:10px 0 16px}
h2{font-size:1.9rem;margin:36px 0 14px;font-weight:700}.lead{color:var(--mu);font-size:1.15rem;max-width:640px;margin-bottom:24px}
.pill,.tag{display:inline-block;font-size:.78rem;padding:4px 12px;border-radius:99px;border:1px solid var(--bd);color:var(--g);background:var(--c)}
.hero{position:relative;padding:90px 0 60px;overflow:hidden}.hg{display:grid;grid-template-columns:1.1fr .9fr;gap:50px;align-items:center}
.au{position:absolute;border-radius:50%;filter:blur(90px);opacity:.28;animation:fl 12s ease-in-out infinite alternate}.a1{width:420px;height:420px;background:#7c5cff;top:-120px;left:-80px}.a2{width:380px;height:380px;background:#22d3a6;right:-60px;bottom:-120px;animation-delay:-5s}
@keyframes fl{to{transform:translate(60px,40px) scale(1.15)}}
.row{display:flex;gap:14px;flex-wrap:wrap}.glass,.tool,.tc{background:var(--c);border:1px solid var(--bd);border-radius:24px;backdrop-filter:blur(14px)}
.glass,.tool{padding:26px}.ring{position:relative;width:210px;margin:10px auto}.ring svg{transform:rotate(-90deg)}
.ring circle{fill:none;stroke-width:14;stroke-linecap:round}.ring .t{stroke:#1b164214}.ring .f{stroke:url(#rg);stroke-dasharray:565;stroke-dashoffset:565;transition:stroke-dashoffset 1.2s cubic-bezier(.2,.8,.2,1)}
.ring .c{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.ring b{font:800 3rem Outfit}.ring span{font-size:.85rem;color:var(--mu)}
.sl{margin-top:14px}.sl label{display:flex;justify-content:space-between;font-size:.9rem;color:var(--mu)}.sl b{color:var(--tx)}input[type=range]{width:100%;accent-color:var(--g)}
.cur{display:flex;gap:6px;justify-content:center}.cur button{background:#fff;border:1px solid var(--bd);color:var(--tx);border-radius:99px;padding:3px 12px;cursor:pointer}.cur button.on{background:var(--p);color:#fff}
.tl{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:20px}.tc{padding:24px;display:block;transition:.35s}
.tc:hover{transform:translateY(-8px) rotateX(3deg);border-color:var(--p);box-shadow:0 20px 50px #7c5cff33}.tc h3{margin:12px 0 6px;font-size:1.25rem}.tc p{color:var(--mu);font-size:.95rem}.tc em{color:var(--g);font-style:normal;font-weight:600;display:block;margin-top:12px}
.stg{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:20px;text-align:center}.stt b{font:800 3rem Outfit;color:var(--g);display:block}.stt span{color:var(--mu)}
.tool{margin:20px 0}.tg{display:grid;grid-template-columns:1fr 1fr;gap:30px}.fld{margin-bottom:14px}.fld label{display:block;font-size:.9rem;color:var(--mu)}
.fld input[type=number],.fld select{width:100%;padding:11px;border-radius:12px;border:1px solid var(--bd);background:#fff;color:var(--tx);font-size:1rem}
.big{text-align:center}.big small{color:var(--mu)}.big b{display:block;font:800 2.8rem Outfit;color:var(--g)}
.rows div{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px solid var(--bd);font-size:.95rem}.note{margin-top:14px;color:var(--mu);font-size:.95rem}
.dis{font-size:.82rem;color:var(--mu)}.art h2{margin-top:34px}.art p{color:#3b3763;margin-bottom:14px}.art a{color:var(--g);text-decoration:underline}
.tldr{background:var(--c);border-left:4px solid var(--g);padding:16px 18px;border-radius:12px;margin-bottom:10px}
details{border:1px solid var(--bd);border-radius:14px;padding:14px 18px;margin-bottom:10px}summary{cursor:pointer;font-weight:600}
.by{display:flex;gap:14px;margin-top:30px;padding:18px;border:1px solid var(--bd);border-radius:16px;font-size:.92rem;color:var(--mu)}.by i{width:46px;height:46px;flex:none;border-radius:50%;background:linear-gradient(135deg,var(--p),var(--g));display:grid;place-items:center;font:700 1rem Outfit;color:#fff;font-style:normal}
.crumb{font-size:.85rem;color:var(--mu)}.ft{border-top:1px solid var(--bd);margin-top:60px;padding:50px 0 24px;position:relative;z-index:1;color:var(--mu);font-size:.93rem}
.fg{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:30px}.fg h3{color:var(--tx);margin-bottom:10px;font-size:1rem}.fg a{display:block;padding:3px 0}.fg a:hover{color:var(--g)}.cp{margin-top:30px;text-align:center;font-size:.82rem}
.rv{opacity:0;transform:translateY(30px);transition:.8s cubic-bezier(.2,.8,.2,1)}.rv.in{opacity:1;transform:none}
@media(max-width:820px){.hg,.tg,.fg{grid-template-columns:1fr}.bg{display:block}.nv{display:none;position:absolute;top:68px;left:0;right:0;flex-direction:column;padding:20px;background:#fffffff5}.nv.open{display:flex}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.rv{opacity:1;transform:none}}