:root{--bg:#f3f5ff;--ink:#0c1233;--bl:#2447ff;--li:#c9f23f;--or:#ff7a2f;--pap:#fff;--mut:#46507a;--bd:3px solid var(--ink);--sh:6px 6px 0 var(--ink)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font:18px/1.75 'Karla',system-ui,sans-serif;color:var(--ink);background:var(--bg);overflow-x:hidden}
h1,h2,h3{font-family:'Outfit',sans-serif;font-weight:800;line-height:1.05;margin:0 0 .5em;letter-spacing:-.03em}h1{font-size:clamp(2.5rem,6.4vw,5rem)}h2{font-size:clamp(1.8rem,3.6vw,2.8rem);margin-top:1.4em}h3{font-size:1.3rem;margin-top:1.1em}
a{color:var(--bl);text-underline-offset:3px;font-weight:700}p{margin:0 0 1.05em;color:var(--mut)}
.wrap{max-width:1180px;margin:auto;padding:0 24px}.narrow{max-width:790px}.skip{position:absolute;left:-999px}.skip:focus{left:10px;top:10px;background:#fff;padding:8px;z-index:99}
#pg{position:fixed;left:0;top:0;height:6px;width:0;background:var(--or);border-right:3px solid var(--ink);z-index:100}
.hd{position:sticky;top:0;z-index:60;background:var(--pap);border-bottom:var(--bd)}.hdi{display:flex;align-items:center;justify-content:space-between;height:74px}
.logo{display:flex;align-items:center;gap:10px;font:800 1.4rem 'Outfit',sans-serif;color:var(--ink);text-decoration:none;letter-spacing:-.04em}.logo img{transition:transform .4s cubic-bezier(.3,1.8,.5,1)}.logo:hover img{transform:rotate(-14deg) scale(1.15)}
.nv{display:flex;gap:4px;align-items:center}.nv a{color:var(--ink);text-decoration:none;padding:8px 14px;font-weight:800;font-size:.95rem;border-radius:10px;transition:background .2s,transform .2s}.nv a:not(.btn):hover{background:var(--li);transform:rotate(-2deg)}
.bg{display:none;background:var(--li);border:var(--bd);border-radius:10px;color:var(--ink);cursor:pointer;padding:4px}
.btn{display:inline-block;background:var(--li);color:var(--ink)!important;font:800 1rem 'Outfit',sans-serif;padding:14px 26px;border:var(--bd);border-radius:14px;text-decoration:none;box-shadow:var(--sh);transition:transform .15s,box-shadow .15s}.btn:hover{transform:translate(4px,4px);box-shadow:2px 2px 0 var(--ink)}.btn:active{transform:translate(6px,6px);box-shadow:0 0 0 var(--ink)}.nv a.btn{padding:9px 18px;margin-left:8px;box-shadow:3px 3px 0 var(--ink)}.nv a.btn:hover{background:var(--li);transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ink)}.btn.blue{background:var(--bl);color:#fff!important}.btn.white{background:#fff}
.hero{padding:64px 0 50px;position:relative;overflow:hidden}.hg{display:grid;grid-template-columns:1.05fr .95fr;gap:46px;align-items:center}
.chip{display:inline-block;background:var(--or);color:var(--ink);font:800 .85rem 'Outfit',sans-serif;letter-spacing:.06em;text-transform:uppercase;padding:6px 14px;border:var(--bd);border-radius:99px;transform:rotate(-2deg);margin-bottom:20px;animation:wig 3s ease-in-out infinite}@keyframes wig{50%{transform:rotate(2deg) translateY(-3px)}}
.hl{background:var(--li);padding:0 .14em;border:var(--bd);border-radius:.18em;display:inline-block;transform:rotate(-2deg);box-shadow:5px 5px 0 var(--ink)}
.lead{font-size:1.22rem;max-width:600px}.bt{display:flex;gap:16px;flex-wrap:wrap;margin-top:28px}
.pop{opacity:0;transform:translateY(30px) rotate(-1.5deg);animation:pop .8s cubic-bezier(.2,1.2,.4,1) forwards}.d1{animation-delay:.1s}.d2{animation-delay:.25s}.d3{animation-delay:.4s}@keyframes pop{to{opacity:1;transform:none}}
.mach{position:relative;background:var(--pap);border:var(--bd);border-radius:28px;padding:28px;box-shadow:10px 10px 0 var(--ink)}
.badge{position:absolute;right:-22px;top:-34px;width:104px;height:104px;animation:rot 16s linear infinite}.badge svg{width:100%;height:100%}.badge text{font:800 11.5px 'Outfit';letter-spacing:.14em;fill:var(--ink)}@keyframes rot{to{transform:rotate(360deg)}}
.mach h3{margin:0 0 4px;font-size:1.15rem}.mach small{color:var(--mut);font-weight:700}
.sl{margin-top:20px}.sl label{display:flex;justify-content:space-between;font:800 .95rem 'Outfit';margin:0}.sl label b{color:var(--bl)}
input[type=range]{-webkit-appearance:none;width:100%;height:12px;border:var(--bd);border-radius:99px;background:#fff;margin:10px 0 4px;outline:0}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:30px;height:30px;border-radius:50%;background:var(--li);border:var(--bd);cursor:grab;box-shadow:2px 2px 0 var(--ink);transition:transform .15s}input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.2)}input[type=range]::-moz-range-thumb{width:24px;height:24px;border-radius:50%;background:var(--li);border:3px solid var(--ink)}
.out{margin-top:22px;background:var(--bl);color:#fff;border:var(--bd);border-radius:20px;padding:20px 22px}.out small{color:#cbd6ff;font-weight:800;text-transform:uppercase;letter-spacing:.1em;font-size:.72rem}.out b{display:block;font:800 3rem 'Outfit',sans-serif;line-height:1.05;color:var(--li)}
.bar{display:flex;height:22px;border:var(--bd);border-radius:99px;overflow:hidden;background:#fff;margin-top:14px}.bar i{display:block;height:100%;transition:width .6s cubic-bezier(.2,1,.3,1)}.bar .p{background:var(--li)}.bar .t{background:var(--or)}
.lg{display:flex;justify-content:space-between;font-size:.82rem;font-weight:800;margin-top:6px;color:#e5ebff}
.str{background:var(--li);border-top:var(--bd);border-bottom:var(--bd);overflow:hidden;transform:rotate(-1.4deg);margin:14px -20px;padding:14px 0;white-space:nowrap}.str div{display:inline-flex;gap:34px;animation:mq 34s linear infinite}.str span{font:800 1.25rem 'Outfit'}.str span:after{content:"✱";margin-left:34px;color:var(--bl)}@keyframes mq{to{transform:translateX(-50%)}}
.sec{padding:84px 0}.alt{background:#e6eaff;border-top:var(--bd);border-bottom:var(--bd)}.tit{display:flex;justify-content:space-between;align-items:end;gap:20px;flex-wrap:wrap}
.tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:34px}.tile{display:flex;flex-direction:column;min-height:230px;padding:24px;border:var(--bd);border-radius:22px;box-shadow:var(--sh);text-decoration:none;color:var(--ink);transition:transform .15s,box-shadow .15s;position:relative}
.tile:hover{transform:translate(5px,5px);box-shadow:1px 1px 0 var(--ink)}.tile.b{background:var(--bl);color:#fff}.tile.l{background:var(--li)}.tile.w{background:#fff}.tile.o{background:var(--or)}
.tile .tg{align-self:flex-start;font:800 .75rem 'Outfit';letter-spacing:.08em;text-transform:uppercase;border:3px solid currentColor;border-radius:99px;padding:2px 12px;margin-bottom:auto}.tile h3{margin:18px 0 8px;font-size:1.35rem}.tile p{margin:0;color:inherit;font-size:.97rem;opacity:.9}.tile .go{margin-top:14px;font:800 1rem 'Outfit';display:flex;justify-content:space-between}.tile .go i{font-style:normal;transition:transform .2s}.tile:hover .go i{transform:translateX(8px)}
.tabs{margin-top:30px}.tb{display:flex;gap:10px;flex-wrap:wrap}.tb button{font:800 1rem 'Outfit';background:#fff;border:var(--bd);border-radius:99px;padding:9px 20px;cursor:pointer;color:var(--ink);transition:transform .15s}.tb button:hover{transform:translateY(-3px)}.tb button.on{background:var(--ink);color:var(--li)}
.tp{display:none;margin-top:22px;background:#fff;border:var(--bd);border-radius:24px;padding:30px;box-shadow:var(--sh);animation:pop .5s forwards}.tp.on{display:grid;grid-template-columns:1.4fr 1fr;gap:26px;align-items:center}.tp h3{margin-top:0}.tp .big{font:800 clamp(2.2rem,5vw,3.4rem) 'Outfit';color:var(--bl);line-height:1}
.stk{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:30px}.sk{background:#fff;border:var(--bd);border-radius:22px;padding:26px;box-shadow:var(--sh);transition:transform .3s}.sk:nth-child(1){transform:rotate(-1.4deg)}.sk:nth-child(2){transform:rotate(1deg);background:var(--li)}.sk:nth-child(3){transform:rotate(-.6deg)}.sk:hover{transform:rotate(0) translateY(-6px)}.sk b{display:block;font:800 clamp(2.4rem,5vw,3.6rem) 'Outfit';line-height:1;color:var(--bl)}.sk:nth-child(2) b{color:var(--ink)}.sk span{font-weight:800}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:24px;margin-top:30px}
.card{display:block;background:#fff;border:var(--bd);border-radius:22px;padding:24px;box-shadow:var(--sh);text-decoration:none;color:var(--ink);transition:transform .15s,box-shadow .15s}a.card:hover{transform:translate(5px,5px);box-shadow:1px 1px 0 var(--ink)}.card .ct{display:inline-block;background:var(--li);border:3px solid var(--ink);border-radius:99px;font:800 .75rem 'Outfit';letter-spacing:.08em;text-transform:uppercase;padding:2px 12px}.card h3{margin:14px 0 8px;font-size:1.3rem}.card p{margin:0;font-size:.98rem}.card em{display:block;margin-top:12px;font-style:normal;font-weight:800;color:var(--bl)}
.rv{opacity:0;transform:translateY(34px) rotate(-1deg);transition:opacity .7s,transform .7s cubic-bezier(.2,1.1,.4,1)}.rv.in{opacity:1;transform:none}
.cta{background:var(--bl);color:#fff;border:var(--bd);border-radius:30px;padding:64px 28px;text-align:center;box-shadow:10px 10px 0 var(--ink);position:relative;overflow:hidden}.cta h2{color:#fff;margin-top:0}.cta p{color:#d7e0ff;max-width:540px;margin:0 auto 26px}.cta>*{position:relative}
.cta:before,.cta:after{content:"";position:absolute;border:var(--bd);background:var(--li);animation:fl 7s ease-in-out infinite}.cta:before{width:90px;height:90px;border-radius:50%;left:6%;top:18%}.cta:after{width:70px;height:70px;border-radius:16px;right:8%;bottom:16%;background:var(--or);animation-delay:-3s}@keyframes fl{50%{transform:translateY(-22px) rotate(20deg)}}
.ph{padding:66px 0 10px}.crumb{font-size:.92rem;margin-bottom:12px;color:var(--mut);font-weight:700}
.art h2{display:inline-block;background:var(--li);border:var(--bd);border-radius:12px;padding:2px 14px;transform:rotate(-.8deg);margin-top:1.6em}.art p,.art li{color:#2a3466}
.meta{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}.meta span{background:#fff;border:3px solid var(--ink);border-radius:99px;padding:2px 14px;font-weight:800;font-size:.88rem}
details{background:#fff;border:var(--bd);border-radius:16px;padding:2px 22px;margin:12px 0;box-shadow:4px 4px 0 var(--ink)}summary{cursor:pointer;font:800 1.05rem 'Outfit';padding:15px 0;list-style:none;display:flex;justify-content:space-between}summary:after{content:"+";font:800 1.6rem/1 'Outfit';color:var(--bl);transition:transform .3s}details[open] summary:after{transform:rotate(45deg)}
.by{display:flex;gap:14px;align-items:center;background:var(--li);border:var(--bd);border-radius:18px;padding:16px 22px;margin-top:34px;color:var(--ink);box-shadow:var(--sh)}.by:before{content:"SL";display:grid;place-items:center;width:48px;height:48px;border:var(--bd);border-radius:50%;background:#fff;font:800 1rem 'Outfit';flex:none}
.dis{font-size:.9rem;background:#fff;border:3px dashed var(--ink);padding:10px 14px;border-radius:12px}
#tool{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin:28px 0;align-items:start}#tool>div:first-child{display:grid;gap:14px;background:#fff;border:var(--bd);border-radius:22px;padding:24px;box-shadow:var(--sh)}
label{display:grid;gap:6px;font:800 .95rem 'Outfit'}input:not([type=range]),select{width:100%;padding:12px 14px;border-radius:12px;border:var(--bd);background:#fff;font:700 1rem 'Karla';color:var(--ink);transition:box-shadow .2s,transform .2s}input:focus,select:focus{outline:0;box-shadow:4px 4px 0 var(--bl);transform:translate(-2px,-2px)}
.res{background:var(--ink);color:#fff;border:var(--bd);border-radius:22px;padding:28px;position:sticky;top:96px;box-shadow:8px 8px 0 var(--bl)}.res small{color:#a9b6e8;font:800 .72rem 'Outfit';text-transform:uppercase;letter-spacing:.12em}.res .big{display:block;font:800 3rem 'Outfit';color:var(--li);line-height:1.1;margin-bottom:12px;animation:pp .4s cubic-bezier(.2,1.5,.4,1)}@keyframes pp{from{transform:scale(.9);opacity:.3}}
.r{display:flex;justify-content:space-between;gap:10px;padding:10px 0;border-top:2px solid rgba(255,255,255,.2)}.r span{color:#c3cdf5}.note{margin:14px 0 0;background:var(--or);color:var(--ink);font-weight:800;border-radius:10px;padding:8px 12px;font-size:.92rem}
.ft{background:var(--ink);color:#c3cdf5;padding:64px 0 26px;margin-top:50px;border-top:var(--bd)}.ft p{color:#97a4d8;font-size:.97rem}.ft a{color:#fff;text-decoration:none;display:block;padding:4px 0;font-weight:700}.ft a:hover{color:var(--li)}.ft .logo{color:#fff}.ft h3{color:var(--li);font:800 .85rem 'Outfit';letter-spacing:.14em;text-transform:uppercase;margin-top:0}
.fg{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:34px}.cp{border-top:2px solid rgba(255,255,255,.18);margin-top:34px;padding-top:18px;font-size:.86rem;color:#8391c9}
@media(max-width:900px){.hg,#tool,.tp.on,.stk{grid-template-columns:1fr}.tiles{grid-template-columns:1fr 1fr}.fg{grid-template-columns:1fr 1fr}.res{position:static}.bg{display:block}.nv{display:none;position:absolute;top:74px;left:0;right:0;background:#fff;border-bottom:var(--bd);flex-direction:column;padding:14px;align-items:stretch}.nv.open{display:flex}.badge{right:-6px;width:84px;height:84px}}
@media(max-width:560px){.tiles{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.rv,.pop{opacity:1;transform:none}}
