:root{--bg:#f6f8fc;--bg2:#eaeffa;--fg:#0e1530;--mut:#4a5578;--card:rgba(255,255,255,.75);--bd:rgba(14,21,48,.1);--a:#0891b2;--b:#7c3aed;--sh:0 10px 40px rgba(30,40,90,.12)}
:root[data-theme=dark]{--bg:#0b1020;--bg2:#10172e;--fg:#eef2ff;--mut:#a5b0d6;--card:rgba(24,32,64,.6);--bd:rgba(255,255,255,.1);--a:#22d3ee;--b:#a78bfa;--sh:0 10px 40px rgba(0,0,0,.4)}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#0b1020;--bg2:#10172e;--fg:#eef2ff;--mut:#a5b0d6;--card:rgba(24,32,64,.6);--bd:rgba(255,255,255,.1);--a:#22d3ee;--b:#a78bfa;--sh:0 10px 40px rgba(0,0,0,.4)}}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:76px}
body{margin:0;background:var(--bg);color:var(--fg);font:400 1.05rem/1.65 Inter,system-ui,sans-serif;overflow-x:hidden}
h1,h2,h3,.brand,.num,.stats b,.sdg b{font-family:"Space Grotesk",Inter,sans-serif}
a{color:inherit}.wrap{width:min(1120px,100% - 2rem);margin-inline:auto}
.skip{position:absolute;left:-999px;top:0;background:var(--a);color:#000;padding:.6rem 1rem;z-index:100}.skip:focus{left:0}
:focus-visible{outline:3px solid var(--a);outline-offset:3px;border-radius:6px}
#net{position:fixed;inset:0;width:100%;height:100%;z-index:0;opacity:.55;pointer-events:none}
.glow{position:fixed;width:520px;height:520px;border-radius:50%;left:0;top:0;z-index:0;pointer-events:none;background:radial-gradient(circle,color-mix(in srgb,var(--b) 28%,transparent),transparent 65%);transform:translate(-50%,-50%);transition:opacity .3s}
main,.shot{margin:0}.shot img{width:100%;height:auto;display:block;border-radius:22px;border:1px solid var(--bd);box-shadow:var(--sh);background:#fff;transition:transform .4s}.shot a:hover img{transform:scale(1.01)}.shot figcaption{color:var(--mut);font-size:.9rem;margin-top:.8rem;text-align:center}
.foot{position:relative;z-index:1}
.progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:60}.progress span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--a),var(--b))}
.nav{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.7rem max(1rem,calc((100% - 1120px)/2));background:color-mix(in srgb,var(--bg) 70%,transparent);backdrop-filter:blur(14px);border-bottom:1px solid transparent;transition:border-color .3s}
.nav.stuck{border-color:var(--bd)}
.brand{display:flex;align-items:center;gap:.5rem;text-decoration:none;font-size:1.3rem;font-weight:500}.brand b{background:linear-gradient(90deg,var(--a),var(--b));-webkit-background-clip:text;background-clip:text;color:transparent}.brand.sm{font-size:1.1rem}
#menu{display:flex;gap:.25rem;list-style:none;margin:0;padding:0}
#menu a{display:block;padding:.45rem .9rem;border-radius:99px;text-decoration:none;color:var(--mut);font-weight:500;font-size:.95rem;transition:.25s}
#menu a:hover{color:var(--fg)}#menu a.on{color:var(--fg);background:var(--card);box-shadow:inset 0 0 0 1px var(--bd)}
.tools{display:flex;align-items:center;gap:.5rem}
.lang{display:flex;border:1px solid var(--bd);border-radius:99px;padding:2px;background:var(--card)}
.lang button{border:0;background:none;color:var(--mut);font:600 .8rem Inter;padding:.35rem .7rem;border-radius:99px;cursor:pointer}
.lang button[aria-pressed=true]{background:linear-gradient(135deg,var(--a),var(--b));color:#fff}
.icon{width:40px;height:40px;border-radius:50%;border:1px solid var(--bd);background:var(--card);color:var(--fg);cursor:pointer;display:grid;place-items:center;font-size:1.1rem;transition:.25s}.icon:hover{transform:translateY(-2px)}
.burger{display:none;gap:4px;align-content:center}.burger span{display:block;width:18px;height:2px;background:currentColor;margin:2px auto;transition:.3s}
.top{position:fixed;right:1rem;bottom:1rem;z-index:40}
.hero{min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding:7rem 0 3rem;position:relative}
.hero-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:2rem;align-items:center}
.eyebrow{text-transform:uppercase;letter-spacing:.18em;font-size:.8rem;font-weight:600;color:var(--a);margin:0 0 .8rem}
h1{font-size:clamp(3.5rem,11vw,8rem);line-height:1;margin:0 0 1rem;letter-spacing:-.03em}
.grad{background:linear-gradient(100deg,var(--a),var(--b),#f472b6,var(--a));background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:flow 8s linear infinite}
@keyframes flow{to{background-position:300% 0}}
.lema{font:500 clamp(1.25rem,2.6vw,1.75rem)/1.4 "Space Grotesk";margin:0 0 .8rem;max-width:30ch}
.lead{color:var(--mut);max-width:48ch;margin:0 0 2rem}
.cta{display:flex;gap:.8rem;flex-wrap:wrap}
.btn{padding:.85rem 1.5rem;border-radius:99px;font-weight:600;text-decoration:none;transition:.25s;border:1px solid var(--bd)}
.btn.primary{background:linear-gradient(135deg,var(--a),var(--b));color:#fff;border:0;box-shadow:0 8px 30px color-mix(in srgb,var(--b) 45%,transparent)}
.btn:hover{transform:translateY(-3px)}.btn.ghost{background:var(--card)}
.orb{position:relative;aspect-ratio:1;max-width:420px;width:100%;justify-self:center}
.ring{position:absolute;inset:0;border-radius:50%;border:1px dashed var(--bd);animation:spin 30s linear infinite}
.r2{inset:12%;animation-duration:20s;animation-direction:reverse;border-color:color-mix(in srgb,var(--a) 40%,transparent)}
.r3{inset:26%;animation-duration:14s;border-style:solid;border-color:color-mix(in srgb,var(--b) 40%,transparent)}
@keyframes spin{to{transform:rotate(360deg)}}
.core{position:absolute;inset:38%;display:grid;place-items:center;border-radius:28%;background:var(--card);box-shadow:var(--sh),0 0 80px color-mix(in srgb,var(--b) 50%,transparent);animation:float 5s ease-in-out infinite}
@keyframes float{50%{transform:translateY(-12px)}}
.dot{position:absolute;width:14px;height:14px;border-radius:50%;background:var(--a);box-shadow:0 0 18px var(--a);animation:pulse 3s ease-in-out infinite}
.d1{top:4%;left:50%}.d2{top:30%;right:2%;background:var(--b);box-shadow:0 0 18px var(--b);animation-delay:.6s}.d3{bottom:8%;right:22%;animation-delay:1.2s}.d4{bottom:20%;left:4%;background:var(--b);box-shadow:0 0 18px var(--b);animation-delay:1.8s}.d5{top:22%;left:12%;animation-delay:2.4s}
@keyframes pulse{50%{transform:scale(1.7);opacity:.5}}
.stats{display:flex;gap:2.5rem;list-style:none;padding:0;margin-top:3rem}
.stats b{display:block;font-size:2.4rem;line-height:1}.stats span{color:var(--mut);font-size:.9rem}
.scroll{position:absolute;bottom:1.2rem;left:50%;width:26px;height:42px;border:2px solid var(--mut);border-radius:14px;transform:translateX(-50%)}
.scroll span{position:absolute;left:50%;top:7px;width:4px;height:8px;margin-left:-2px;border-radius:2px;background:var(--a);animation:wheel 1.6s infinite}
@keyframes wheel{to{transform:translateY(14px);opacity:0}}
.sec{padding:clamp(4rem,9vw,8rem) 0}.sec.alt{background:linear-gradient(var(--bg2),var(--bg2));background:color-mix(in srgb,var(--bg2) 80%,transparent)}
h2{font-size:clamp(2rem,5vw,3.4rem);line-height:1.1;margin:0 0 2.5rem;letter-spacing:-.02em}
.note{color:var(--mut);margin:-1.5rem 0 2rem;font-size:.9rem}
.card{background:var(--card);border:1px solid var(--bd);border-radius:22px;padding:1.6rem;backdrop-filter:blur(10px);box-shadow:var(--sh);transition:box-shadow .3s,border-color .3s}
.card:hover{border-color:color-mix(in srgb,var(--a) 50%,transparent)}
.cards{display:grid;gap:1.2rem}.team{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}.ideas{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.person{text-align:center}.ph{width:110px;height:110px;margin:0 auto 1rem;border-radius:50%;display:grid;place-items:center;color:var(--mut);background:var(--bg2);border:2px dashed var(--bd)}.ph svg{width:56px}
.person h3{margin:.2rem 0;font-size:1.1rem;color:var(--mut);font-weight:500}.role{margin:0 0 .6rem;font:700 1rem "Space Grotesk";background:linear-gradient(90deg,var(--a),var(--b));-webkit-background-clip:text;background-clip:text;color:transparent}
.link{font-size:.85rem;color:var(--mut);text-decoration:underline dotted}
.qa{display:grid;gap:1rem;max-width:860px}.arrow{text-align:center;color:var(--a);animation:float 2.5s ease-in-out infinite}
.tag{display:inline-block;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.12em;padding:.25rem .7rem;border-radius:99px;background:var(--bg2);color:var(--mut);margin-bottom:.8rem}.tag.hot{background:linear-gradient(135deg,var(--a),var(--b));color:#fff}
.qtext{font:500 clamp(1.1rem,2.2vw,1.4rem)/1.5 "Space Grotesk";margin:0}.q.new{border-color:color-mix(in srgb,var(--b) 50%,transparent)}
.idea{position:relative;overflow:hidden;padding-top:3.2rem}.idea p{margin:0}.num{position:absolute;top:.8rem;left:1.4rem;font-size:1.6rem;font-weight:700;opacity:.9;background:linear-gradient(90deg,var(--a),var(--b));-webkit-background-clip:text;background-clip:text;color:transparent}
.why{color:var(--mut);margin:-1.5rem 0 1.5rem;font-weight:600}
.reasons{list-style:none;counter-reset:r;display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.2rem;padding:0;margin:0 0 3rem}
.reasons li{counter-increment:r;position:relative;padding-top:3rem}.reasons li::before{content:counter(r);position:absolute;top:1rem;left:1.4rem;width:2rem;height:2rem;border-radius:50%;display:grid;place-items:center;font:700 .9rem "Space Grotesk";color:#fff;background:linear-gradient(135deg,var(--a),var(--b))}
.reasons h3{margin:0 0 .4rem;font-size:1.15rem}.reasons p{margin:0;color:var(--mut)}
.sdgs{display:flex;flex-wrap:wrap;gap:1rem}
.sdg{display:flex;align-items:center;gap:.9rem;padding:.8rem 1.2rem .8rem .8rem;border-radius:18px;color:#fff;max-width:320px;transition:.3s;box-shadow:var(--sh)}.sdg:hover{transform:translateY(-4px) rotate(-1deg)}
.sdg b{font-size:2.6rem;line-height:1;min-width:3.2rem;text-align:center}.sdg span{font-weight:600;font-size:.95rem;line-height:1.3}
.s8{background:#a21942}.s9{background:#c2410c}.s11{background:#b45309}
.foot{padding:2rem 0;border-top:1px solid var(--bd);color:var(--mut);font-size:.9rem}.foot .wrap{display:flex;gap:1rem;flex-wrap:wrap;justify-content:space-between;align-items:center}
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1);transition-delay:var(--d,0s)}.reveal.in{opacity:1;transform:none}
.tilt{transform-style:preserve-3d}
@media(max-width:900px){
 .hero-grid{grid-template-columns:1fr}.orb{max-width:280px;order:-1}
 .burger{display:grid}
 nav{position:fixed;inset:60px 0 auto 0;background:var(--bg);border-bottom:1px solid var(--bd);transform:translateY(-130%);transition:transform .35s;padding:1rem}
 nav.open{transform:none}#menu{flex-direction:column}
 .scroll{display:none}.stats{gap:1.5rem}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}html{scroll-behavior:auto}#net,.glow{display:none}}
