:root{--bg:#fffaf0;--fg:#2b2540;--muted:#6b6485;--accent:#b84d3f;--card:#fff;--line:#eadfce}
@media(prefers-color-scheme:dark){:root{--bg:#191529;--fg:#f3eefc;--muted:#b4abd0;--accent:#ee8a7a;--card:#241e3a;--line:#3a3258}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font:18px/1.6 Nunito,system-ui,sans-serif}
main,header,footer{max-width:760px;margin:0 auto;padding:16px}
header{display:flex;justify-content:space-between;align-items:center}
header a{color:var(--fg);text-decoration:none;font-weight:800;display:flex;align-items:center;gap:10px}
header img{width:36px;height:36px;border-radius:9px}
h1{font-size:2.2rem;line-height:1.2}h2{margin-top:2em}
a{color:var(--accent)}
.hero{text-align:center;padding:32px 0}
.hero img{max-width:260px;width:60%}
.btn{display:inline-block;background:var(--accent);color:#fff;padding:12px 24px;border-radius:999px;text-decoration:none;font-weight:800}
.cards{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));margin:32px 0}
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:16px}
footer{color:var(--muted);font-size:.9rem;border-top:1px solid var(--line);margin-top:48px}
footer a{color:var(--muted)}

/* landing */
.home main{max-width:1080px}.home header{max-width:1080px}.home footer{max-width:1080px}
.home h1{font-size:clamp(2rem,5vw,3.4rem);font-weight:800}.home h1 em{font-style:normal;color:var(--accent)}
.home h2{text-align:center;font-size:clamp(1.6rem,3.5vw,2.3rem);margin:0}.home h3{margin:.4em 0 .2em}
.lead{text-align:center;color:var(--muted);margin:.4em 0 1.6em}
.hero{display:grid;grid-template-columns:1.1fr 1fr;gap:24px;align-items:center;text-align:left;position:relative;padding:32px 0 48px}
.hero-art{position:relative;display:grid;place-items:center}
.hero .mascot{width:70%;max-width:320px;position:relative;z-index:1;animation:bob 4s ease-in-out infinite}
.blob{position:absolute;width:85%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#ffd98a66,#ffb59a33 60%,transparent 70%);animation:pulse 6s ease-in-out infinite}
.orb{position:absolute;width:22%;z-index:2;animation:bob 5s ease-in-out infinite}
.o1{left:2%;top:8%}.o2{right:2%;top:2%;animation-delay:-1.5s}.o3{right:6%;bottom:6%;animation-delay:-3s}
.stars img{position:absolute;width:28px;opacity:.8;animation:twinkle 3s ease-in-out infinite}
.stars img:nth-child(1){left:2%;top:6%}.stars img:nth-child(2){left:46%;top:2%;animation-delay:-1s}.stars img:nth-child(3){left:40%;bottom:6%;animation-delay:-2s;width:20px}
.badges{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.badges span{background:var(--card);border:1px solid var(--line);border-radius:999px;padding:4px 14px;font-size:.85rem;font-weight:700}
.btn{box-shadow:0 6px 16px #b84d3f40;transition:transform .2s}.btn:hover{transform:translateY(-2px) scale(1.03)}
.btn.ghost{background:transparent;color:var(--accent);border:2px solid var(--accent);box-shadow:none;padding:10px 22px}
.sec{padding:56px 0}.band{background:var(--card);border-block:1px solid var(--line);margin-inline:calc(50% - 50vw);padding-inline:calc(50vw - 50%)}
.narrow{max-width:720px;margin:0 auto}
.steps,.cards,.vals{display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.step,.home .card{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:24px;text-align:center;transition:transform .25s,box-shadow .25s}
.band .step,.band .card{background:var(--bg)}
.step:hover,.home .card:hover{transform:translateY(-6px) rotate(-1deg);box-shadow:0 12px 28px #2b254020}
.step img,.card img{width:96px;height:96px;object-fit:contain;animation:bob 4s ease-in-out infinite}
.step{position:relative}.num{position:absolute;top:12px;left:14px;width:30px;height:30px;border-radius:50%;background:var(--accent);color:#fff;font-weight:800;display:grid;place-items:center}
.step p,.card p{margin:0;color:var(--muted);font-size:.95rem}
.marquee{overflow:hidden;mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.track{display:flex;gap:24px;width:max-content;animation:scroll 50s linear infinite}.marquee:hover .track{animation-play-state:paused}
.ing{width:110px;height:110px;object-fit:contain;transition:transform .2s}.ing:hover{transform:scale(1.2) rotate(6deg)}
.phones{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;padding:20px 8px;justify-content:safe center}
.phones img{width:230px;height:auto;flex:none;scroll-snap-align:center;border-radius:28px;border:6px solid var(--fg);box-shadow:0 16px 32px #2b254030;transition:transform .3s}
.phones img:nth-child(odd){transform:rotate(-2deg)}.phones img:nth-child(even){transform:rotate(2deg) translateY(16px)}.phones img:hover{transform:scale(1.05)}
.vals{grid-template-columns:repeat(auto-fit,minmax(130px,1fr))}
.val{text-align:center;font-weight:800}.val img{width:100px;height:100px;object-fit:contain;display:block;margin:0 auto 4px;transition:transform .3s}.val:hover img{transform:translateY(-8px) scale(1.1)}
details{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px 18px;margin:10px 0}
summary{cursor:pointer;font-weight:800}details p{margin:.6em 0 0;color:var(--muted)}
.fin{text-align:center;padding:48px 24px;border-radius:32px;background:linear-gradient(135deg,#ffe3b3,#ffc9b8);color:#2b2540;margin-top:32px}
.fin img{width:160px;animation:bob 4s ease-in-out infinite}.fin h2{margin:.2em 0 .6em}
.reveal{opacity:0;transform:translateY(32px);transition:opacity .8s,transform .8s}.reveal.in{opacity:1;transform:none}
@keyframes bob{50%{transform:translateY(-12px) rotate(2deg)}}
@keyframes pulse{50%{transform:scale(1.1);opacity:.7}}
@keyframes twinkle{50%{transform:scale(.5) rotate(40deg);opacity:.2}}
@keyframes scroll{to{transform:translateX(-50%)}}
@media(max-width:760px){.hero{grid-template-columns:1fr;text-align:center}.badges{justify-content:center}.hero-art{order:-1}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}
.stars{position:absolute;inset:0;pointer-events:none}
body.home{overflow-x:clip}
html{overflow-x:clip}.stars img:nth-child(1){left:48%;top:-2%}
@media(max-width:760px){.hero-art{max-width:280px;margin:0 auto}.hero .mascot{width:80%}.orb{width:24%}}
.hero .mascot{width:85%;max-width:380px}
.orb{width:15%}.o1{left:-2%;top:2%}.o2{right:-2%;top:-2%}.o3{right:-2%;bottom:2%}
.stars img{width:40px;filter:drop-shadow(0 0 8px #ffd98a)}.stars img:nth-child(3){width:28px}
@media(max-width:760px){.orb{width:18%}}
@media(max-width:760px){.hero{padding-top:8px;gap:12px}.hero-art{max-width:220px}.hero .mascot{width:90%}.orb{width:20%}.stars img{width:24px}}
.orb{display:none}.hero .mascot{width:80%;max-width:300px}@media(max-width:760px){.hero-art{max-width:240px}.hero .mascot{width:100%}}
.hero .mascot,.fin img{height:auto}