@font-face{font-family:"Bricolage Grotesque";src:url(fonts/bricolage-grotesque-latin-opsz-normal.woff2) format("woff2");font-weight:200 800;font-display:swap}
@font-face{font-family:"Hanken Grotesk";src:url(fonts/hanken-grotesk-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Hanken Grotesk";src:url(fonts/hanken-grotesk-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Hanken Grotesk";src:url(fonts/hanken-grotesk-latin-700-normal.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Martian Mono";src:url(fonts/martian-mono-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
:root{--page:#07090E;--bg:#0C0F16;--surface:#131824;--surface-2:#1A2030;--line:rgba(196,206,234,.10);--line-2:rgba(196,206,234,.18);--fg:#ECEEF4;--muted:#8E95A8;--faint:#555D71;--fog:#6E7EA4;--dusk:#A594C8;--dawn:#F4B183;--dawn-ink:#1A120C;--ok:#7CC6A4;--alert:#E8766E;--gold:#E9C46A;--f-d:"Bricolage Grotesque","Avenir Next",system-ui,sans-serif;--f-b:"Hanken Grotesk","Helvetica Neue",system-ui,sans-serif;--f-m:"Martian Mono",ui-monospace,monospace;--ease:cubic-bezier(.2,.8,.2,1)}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth}
body{font-family:var(--f-b);background:var(--page);color:var(--fg);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:var(--dawn)}
.wrap{width:min(1120px,100% - 40px);margin-inline:auto}
.narrow{width:min(780px,100% - 40px)}
.narrow-p{max-width:620px;margin:0 auto}
.center{text-align:center}.muted{color:var(--muted)}
.mono{font-family:var(--f-m);letter-spacing:.02em}.xs{font-size:.62rem}
h1,h2,h3{font-family:var(--f-d);line-height:1.08;letter-spacing:-.025em}
h1{font-size:clamp(2.4rem,7vw,4.3rem);font-weight:700}
h2{font-size:clamp(1.8rem,4.6vw,2.8rem);font-weight:700;margin-bottom:16px}
h3{font-size:1.15rem;font-weight:600}
.lead{font-size:1.1rem;color:var(--muted);margin:18px 0 26px}
.grad{background:linear-gradient(90deg,var(--fog),var(--dusk) 45%,var(--dawn));-webkit-background-clip:text;background-clip:text;color:transparent}
.eyebrow{display:block;font-family:var(--f-m);font-size:.72rem;text-transform:uppercase;letter-spacing:.12em;color:var(--dawn);margin-bottom:12px}
.pill{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:99px;border:1px solid var(--line-2);background:var(--surface);color:var(--fg);font-size:.82rem;margin-bottom:18px}
.dot{width:7px;height:7px;border-radius:50%;background:var(--dawn);box-shadow:0 0 10px var(--dawn)}
.btn{display:inline-block;border:0;cursor:pointer;background:var(--dawn);color:var(--dawn-ink);font-weight:700;padding:14px 24px;border-radius:14px;text-decoration:none;font-size:1rem;font-family:inherit;transition:transform .2s var(--ease)}
.btn:hover{transform:translateY(-2px)}
.btn-sm{padding:8px 16px;font-size:.9rem;border-radius:10px}
.nav{position:sticky;top:0;z-index:20;background:rgba(7,9,14,.78);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav-in{display:flex;align-items:center;justify-content:space-between;height:60px;gap:16px}
.brand{display:flex;align-items:center;gap:10px;color:var(--fg);text-decoration:none;font-family:var(--f-d);font-weight:600}
.brand img{border-radius:8px}
.links{display:none;gap:26px}.links a{color:var(--muted);text-decoration:none;font-size:.95rem}.links a:hover{color:var(--fg)}
/* hero */
.hero{padding:44px 0 72px;background:radial-gradient(ellipse 60% 50% at 75% 30%,rgba(165,148,200,.20),transparent),radial-gradient(ellipse 40% 40% at 85% 70%,rgba(244,177,131,.12),transparent)}
.hero-in{display:grid;gap:56px;align-items:center}
.stores{display:flex;flex-wrap:wrap;gap:12px}
.store{display:flex;align-items:center;gap:10px;padding:10px 18px;border:1px solid var(--line-2);background:#000;border-radius:12px;color:#fff;text-decoration:none;font-weight:700;font-size:1.05rem;line-height:1.1}
.store svg{width:24px;height:24px;fill:#fff}.store small{display:block;font-weight:400;font-size:.68rem;color:#aaa}
.trust{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:22px;color:var(--muted);font-size:.9rem}
.trust li::before{content:"✓ ";color:var(--ok)}
.hero-phone{position:relative;display:flex;justify-content:center;padding:20px 0}
.phone{position:relative;z-index:2;width:min(290px,76vw);aspect-ratio:9/19;border-radius:44px;padding:10px;background:var(--bezel,#1C2029);border:1px solid var(--line-2);box-shadow:0 40px 90px rgba(0,0,0,.65),inset 0 0 0 2px #0c0f16}
.scr{height:100%;border-radius:35px;background:radial-gradient(ellipse at 50% 0,rgba(165,148,200,.18),transparent 60%),var(--bg);padding:22px 16px;display:flex;flex-direction:column;align-items:center;gap:12px;overflow:hidden}
.scr-top{width:100%;display:flex;justify-content:space-between;align-items:center}
.sos-mini{font-family:var(--f-m);font-size:.6rem;font-weight:700;background:var(--alert);color:#fff;border-radius:50%;width:36px;height:36px;display:grid;place-items:center;animation:pulse 2s infinite}
.dial{position:relative;width:78%;aspect-ratio:1}
.ticks{width:100%;height:100%}
.tk{stroke:rgba(196,206,234,.16);stroke-width:1.6;stroke-linecap:round}
.hero-phone.in .tk.on{animation:tick .5s var(--ease) both;animation-delay:calc(var(--i)*35ms)}
@keyframes tick{from{stroke:rgba(196,206,234,.16)}}
.dial-c{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.dial-c b{font-family:var(--f-d);font-weight:300;font-size:3.6rem;line-height:1}
.chip-ph{display:inline-flex;align-items:center;gap:6px;font-family:var(--f-m);font-size:.6rem;color:var(--dusk);border:1px solid var(--line-2);padding:5px 10px;border-radius:99px}
.chip-ph .dot{background:var(--dusk);box-shadow:0 0 8px var(--dusk)}
.card-s{width:100%;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:10px;font-size:.78rem}
.card-s small{display:block;color:var(--muted);font-size:.68rem}
.row{display:flex;gap:10px;align-items:center}
.num{flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--dawn);color:var(--dawn-ink);font-weight:700;font-size:.75rem}
.card-s.row .num{background:transparent;border:1px solid var(--line-2);color:var(--muted)}
.cta-s{margin-top:8px;background:var(--dawn);color:var(--dawn-ink);text-align:center;border-radius:10px;padding:7px;font-weight:700}
.float{position:absolute;z-index:3;background:rgba(19,24,36,.85);backdrop-filter:blur(10px);border:1px solid var(--line-2);border-radius:16px;padding:10px 14px;display:flex;flex-direction:column;font-size:.85rem;box-shadow:0 20px 40px rgba(0,0,0,.4);animation:float 6s ease-in-out infinite}
.float .mono{font-size:.58rem;color:var(--muted)}
.f1{left:0;top:18%}.f2{right:0;bottom:16%;animation-delay:-3s}.f2 b{color:var(--ok)}
@keyframes float{50%{transform:translateY(-10px)}}
.glow{position:absolute;inset:15%;background:radial-gradient(circle,rgba(244,177,131,.28),transparent 70%);filter:blur(50px);z-index:1}
/* sections */
.sec{padding:84px 0}.alt{background:var(--bg)}
.chips{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.chips span{padding:8px 16px;border-radius:99px;border:1px solid var(--line-2);background:var(--surface);font-size:.95rem}
.pillars{display:grid;gap:14px;margin-top:48px}
.pillar,.panel,.feat,.priv div,.steps li,details{background:var(--surface);border:1px solid var(--line);border-radius:22px}
.pillar{padding:22px}.pillar i,.feat i{font-style:normal;font-size:1.5rem;display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:var(--surface-2);border:1px solid var(--line-2);margin-bottom:12px;flex:none}
.pillar p,.steps p,.priv p,.feat p{color:var(--muted);margin-top:6px;font-size:.96rem}
.duo{display:grid;gap:36px;align-items:center}
.panel{padding:24px}
.phases{display:flex;flex-direction:column;gap:18px}
.ph-h{display:flex;justify-content:space-between;gap:10px;align-items:baseline}.ph-h b{color:var(--c)}
.ph p{color:var(--muted);font-size:.92rem;margin-top:8px}
.ph.dim{opacity:.6}
.bar{height:6px;border-radius:6px;background:rgba(196,206,234,.1);margin-top:8px;overflow:hidden}
.bar i{display:block;height:100%;width:0;background:var(--c);border-radius:6px;transition:width 1.6s var(--ease) .3s}
.in .bar i{width:var(--w)}
.plan{margin-top:40px;background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:22px}
.plan-h{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-bottom:16px;font-family:var(--f-d)}
.dots{display:grid;grid-template-columns:repeat(15,1fr);gap:6px}
.dots i{aspect-ratio:1;border-radius:50%;background:rgba(196,206,234,.10)}
.dots i.ms{box-shadow:0 0 0 1.5px var(--c)}
.in .dots i.on{background:var(--c);animation:pop .4s var(--ease) both;animation-delay:calc(var(--i)*40ms)}
.dots i.now{animation:pop .4s var(--ease) both,pulse 2s 1.5s infinite!important;animation-delay:calc(var(--i)*40ms),1.5s!important}
@keyframes pop{from{transform:scale(0);opacity:0}}
.steps{list-style:none;padding:0;display:grid;gap:16px;margin-top:36px}
.steps li{padding:26px}
.steps b{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--dawn);color:var(--dawn-ink);margin-bottom:14px;font-family:var(--f-m)}
.two{display:grid;gap:18px;margin-top:36px}
.two h3{margin:22px 0 4px}
.sos-demo{display:flex;align-items:center;justify-content:center;gap:28px;padding:16px 0;flex-wrap:wrap}
.ring{position:relative;width:170px;height:170px}
.ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.ring circle{fill:none;stroke-width:6}.trk{stroke:rgba(196,206,234,.1)}
.prg{stroke:var(--dawn);stroke-linecap:round;stroke-dasharray:327;stroke-dashoffset:0;animation:drain 18s linear infinite}
@keyframes drain{to{stroke-dashoffset:327}}
.ring-c{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.timer{font-size:1.6rem}
.sos-btn{width:88px;height:88px;border-radius:50%;border:0;background:var(--alert);color:#fff;font-family:var(--f-m);font-weight:700;font-size:1.05rem;animation:pulse 2s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(232,118,110,.55)}70%{box-shadow:0 0 0 22px rgba(232,118,110,0)}100%{box-shadow:0 0 0 0 rgba(232,118,110,0)}}
.dots i.now{--pc:var(--c)}
.chat{display:flex;flex-direction:column;gap:10px;min-height:250px;padding:6px 0}
.msg{max-width:85%;padding:10px 14px;border-radius:18px;font-size:.9rem;line-height:1.45}
.msg.me{align-self:flex-end;background:var(--fg);color:#0C0F16;border-bottom-right-radius:6px}
.msg.ai{align-self:flex-start;background:var(--surface-2);border:1px solid var(--line-2);border-bottom-left-radius:6px}
.typing{align-self:flex-start;display:flex;gap:5px;padding:12px 14px;background:var(--surface-2);border-radius:18px;border:1px solid var(--line-2)}
.typing i{width:7px;height:7px;border-radius:50%;background:var(--dusk);animation:blink 1.2s infinite}
.typing i:nth-child(2){animation-delay:.2s}.typing i:nth-child(3){animation-delay:.4s}
@keyframes blink{0%,80%,100%{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}
.panel.in .msg{animation:rise .5s var(--ease) both}
.panel.in .msg[data-delay="1"]{animation-delay:1.2s}.panel.in .msg[data-delay="2"]{animation-delay:2.6s}
.panel:not(.in) .msg{opacity:0}
@keyframes rise{from{opacity:0;transform:translateY(10px)}}
.feats{display:grid;gap:14px;margin-top:40px}
.feat{display:flex;gap:16px;padding:22px}
.feat i{margin:0}
.trophies{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:28px}
.tro{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:14px;text-align:center;opacity:.4;filter:grayscale(1)}
.tro span{font-size:1.6rem;display:block}.tro b{font-family:var(--f-m);font-size:.7rem;font-weight:400}
.tro.on{opacity:1;filter:none;border-color:rgba(233,196,106,.45);background:linear-gradient(180deg,rgba(233,196,106,.10),var(--surface))}
.priv{display:grid;gap:14px;margin-top:24px}.priv div{padding:22px}
details{padding:16px 20px;margin-top:12px}
summary{cursor:pointer;font-weight:600}details p{color:var(--muted);margin-top:10px}
.cta{padding:90px 0;background:radial-gradient(ellipse at 50% 0,rgba(165,148,200,.22),transparent 65%),var(--bg)}
.cta-ico{margin:0 auto 18px;border-radius:18px}
.wait{display:flex;flex-direction:column;gap:10px;max-width:460px;margin:0 auto}
.wait input{padding:14px 16px;border-radius:14px;border:1px solid var(--line-2);background:var(--surface);color:var(--fg);font-size:1rem;font-family:inherit}
.ok{color:var(--ok);font-weight:600}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.fine{font-size:.82rem;color:var(--muted);margin-top:12px}
.foot{padding:40px 0;border-top:1px solid var(--line)}
.foot-top{display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;align-items:center}
.foot nav{display:flex;flex-wrap:wrap;gap:16px}.foot nav a{color:var(--muted);text-decoration:none;font-size:.9rem}
/* reveal */
.js .reveal{opacity:0;transform:translateY(24px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.js .reveal.in{opacity:1;transform:none}
@media(min-width:640px){.pillars,.priv,.feats,.two{grid-template-columns:repeat(2,1fr)}.wait{flex-direction:row}.wait input{flex:1}.trophies{grid-template-columns:repeat(6,1fr)}}
@media(min-width:900px){.links{display:flex}.hero{padding:80px 0 100px}.hero-in{grid-template-columns:1.1fr .9fr}.pillars{grid-template-columns:repeat(4,1fr)}.steps{grid-template-columns:repeat(3,1fr)}.duo{grid-template-columns:.9fr 1.1fr}.feats{grid-template-columns:repeat(3,1fr)}.priv{grid-template-columns:repeat(3,1fr)}.feat{flex-direction:column;gap:0}.feat i{margin-bottom:14px}}
@media(max-width:420px){.f1{left:-4px}.f2{right:-4px}.dots{gap:4px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.js .reveal{opacity:1;transform:none}.panel .msg{opacity:1!important}.bar i{width:var(--w)}.dots i.on{background:var(--c)}}
.tk.on{stroke-width:2.6}
@media(min-width:900px){.dots{grid-template-columns:repeat(30,1fr);gap:8px}}
/* ===== v3: animaciones avanzadas ===== */
.progress{position:fixed;top:0;left:0;right:0;height:2px;z-index:30;background:linear-gradient(90deg,var(--fog),var(--dusk),var(--dawn));transform-origin:0 50%;transform:scaleX(0)}
.hero{position:relative;overflow:hidden}.hero-in{position:relative;z-index:1}
.particles{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.hero-phone{perspective:1100px}
.tilt{position:relative;z-index:2;transform-style:preserve-3d;will-change:transform}
.tilt::after{content:"";position:absolute;inset:0;border-radius:44px;pointer-events:none;background:radial-gradient(circle at var(--sx,50%) var(--sy,30%),rgba(255,255,255,.09),transparent 45%)}
.float{will-change:transform}
.count{position:relative;display:inline-block}
.count.bump{animation:bump .6s var(--ease)}
@keyframes bump{40%{transform:scale(1.18);color:var(--dawn)}}
.spark{position:absolute;left:50%;top:50%;width:5px;height:5px;border-radius:50%;pointer-events:none;animation:spark .9s var(--ease) forwards}
@keyframes spark{from{transform:translate(-50%,-50%) scale(1);opacity:1}to{transform:translate(calc(-50% + var(--x)),calc(-50% + var(--y))) scale(0);opacity:0}}
/* transiciones de sección */
.js .reveal{opacity:0;transform:translateY(34px) scale(.98);filter:blur(6px);transition:opacity .9s var(--ease) var(--d,0ms),transform .9s var(--ease) var(--d,0ms),filter .9s var(--ease) var(--d,0ms)}
.js .reveal.in{opacity:1;transform:none;filter:none}
.sec{position:relative}
.sec.alt::before{content:"";position:absolute;left:0;right:0;top:-60px;height:60px;background:linear-gradient(transparent,var(--bg));pointer-events:none}
/* storytelling cerebro */
.story{padding-top:0}
.story-track{height:260vh}
.story-stick{position:sticky;top:60px;overflow:hidden;min-height:calc(100vh - 60px);display:flex;align-items:center;padding:40px 0}
.story .duo{grid-template-columns:1fr;gap:28px}
.brain-wrap{position:relative;max-width:440px;margin:0 auto;width:100%}
.brain{width:100%;overflow:visible}
.b-halo{opacity:calc(.25 + var(--glow,0)*.75);transition:opacity .3s}
.b-out{fill:rgba(26,32,48,.6);stroke:rgba(196,206,234,.28);stroke-width:1.5}
.b-mid,.b-fold{fill:none;stroke:rgba(196,206,234,.14);stroke-width:1.2;stroke-linecap:round}
.net line{stroke:rgba(196,206,234,.07);stroke-width:1;transition:stroke .5s,stroke-width .5s}
.net circle{fill:rgba(196,206,234,.18);transition:fill .5s,r .5s;transform-box:fill-box;transform-origin:center}
.net line.lit{stroke:var(--c);stroke-opacity:.55;stroke-width:1.3}
.net circle.lit{fill:var(--c);filter:drop-shadow(0 0 4px var(--c));animation:node 3s ease-in-out infinite}
@keyframes node{50%{transform:scale(1.35)}}
.brain-day{position:absolute;left:50%;bottom:-6px;transform:translateX(-50%);font-size:.8rem;color:var(--muted);background:var(--surface);border:1px solid var(--line-2);border-radius:99px;padding:6px 14px;white-space:nowrap}
.brain-day b{color:var(--fg);font-weight:400;display:inline-block;min-width:2ch;text-align:right}
.story .phases{margin-top:22px;gap:12px}
.story .ph{padding:14px 16px;border-radius:16px;border:1px solid var(--line);background:var(--surface);opacity:.55;transition:opacity .4s,border-color .4s,transform .4s var(--ease)}
.story .ph p{display:none}
.story .ph.active{opacity:1;border-color:var(--c);transform:translateX(6px)}
.story .ph.active p{display:block}
.story .ph.done{opacity:.85}
.story .bar i{transition:width .25s linear}
.lang{font-family:var(--f-m);font-size:.75rem;color:var(--muted);text-decoration:none;border:1px solid var(--line-2);border-radius:8px;padding:6px 8px}
.lang:hover{color:var(--fg)}
.nav-r{display:flex;align-items:center;gap:10px}
@media(min-width:900px){.story .duo{grid-template-columns:1fr 1fr;gap:56px}.story-track{height:300vh}}
@media(max-width:899px){.story-stick{padding:20px 0}.brain-wrap{max-width:240px}.story .phases{margin-top:16px}.story h2{font-size:1.7rem}.story-stick .muted{font-size:.92rem}}
@media(prefers-reduced-motion:reduce){.story-track{height:auto}.story-stick{position:static;min-height:0}.story .ph p{display:block}.story .ph{opacity:1}.particles{display:none}.js .reveal{filter:none}}
/* ===== v4: cerebro en canvas ===== */
.brain-wrap{perspective:900px;max-width:480px}
.brain-3d{transform:rotateX(10deg);transform-style:preserve-3d;will-change:transform}
.brain-cv{display:block;width:100%;height:auto}
.brain-day{bottom:-14px;transition:border-color .6s var(--ease)}
.brain-day b{color:var(--bc,var(--fg))}
.bp{color:var(--bc,var(--muted))}
.story .bar i{width:100%!important;transform-origin:0 50%;transform:scaleX(0);transition:none;will-change:transform}
.story .ph{transition:opacity .6s var(--ease),border-color .6s var(--ease),transform .6s var(--ease),background .6s var(--ease)}
.story .ph.active{background:linear-gradient(180deg,color-mix(in srgb,var(--c) 10%,transparent),var(--surface))}
.story .ph p{display:block;max-height:0;overflow:hidden;opacity:0;transition:max-height .6s var(--ease),opacity .5s var(--ease)}
.story .ph.active p{max-height:120px;opacity:1}
.story-stick::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 50% 60% at 25% 50%,color-mix(in srgb,var(--bc,#A594C8) 14%,transparent),transparent 70%)}
.story-stick{position:sticky}
/* hero más pulido */
.hero::before,.hero::after{content:"";position:absolute;width:60vmax;height:60vmax;border-radius:50%;filter:blur(80px);opacity:.35;pointer-events:none;z-index:0;will-change:transform}
.hero::before{background:radial-gradient(circle,rgba(165,148,200,.55),transparent 60%);top:-25vmax;right:-15vmax;animation:aur 22s var(--ease) infinite alternate}
.hero::after{background:radial-gradient(circle,rgba(244,177,131,.35),transparent 60%);bottom:-35vmax;left:-20vmax;animation:aur 28s var(--ease) infinite alternate-reverse}
@keyframes aur{to{transform:translate3d(-8vmax,6vmax,0) scale(1.15)}}
.js .hero-txt.reveal{opacity:1;transform:none;filter:none}
.js .hero-txt>*{opacity:0;transform:translateY(18px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.js .hero-txt.in>*{opacity:1;transform:none}
.hero-txt>*:nth-child(2){transition-delay:.08s!important}.hero-txt>*:nth-child(3){transition-delay:.16s!important}.hero-txt>*:nth-child(4){transition-delay:.24s!important}.hero-txt>*:nth-child(5){transition-delay:.32s!important}
.grad{background-size:200% 100%;animation:shine 8s ease-in-out infinite alternate}
@keyframes shine{to{background-position:100% 0}}
@media(max-width:899px){.brain-wrap{max-width:300px}.story .ph.active p{max-height:150px}}
@media(prefers-reduced-motion:reduce){.hero::before,.hero::after{animation:none}.js .hero-txt>*{opacity:1;transform:none}.story .ph p{max-height:none;opacity:1}}
.story-stick{display:grid;align-content:center}
.story-stick>.wrap{width:min(1120px,100% - 40px)}
@media(max-width:899px){.story-stick>.wrap>div:last-child>p.muted{display:none}.brain-day{bottom:-8px;font-size:.72rem}.story .phases{gap:8px}.story .ph{padding:10px 14px}}
.note-lang{font-family:var(--f-m);font-size:.68rem;color:var(--faint);margin-top:14px;letter-spacing:.02em}
/* ===== v5: burbujas + aviso médico ===== */
.bub-sec{--c-porn:#F4B183;--c-subst:#A594C8;--c-food:#E9C46A;--c-digital:#86B6DA;--c-behav:#7CC6A4;--c-custom:#8E95A8}
.bubbles{list-style:none;padding:0;margin:36px 0 0;display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.bub{--c:var(--c-custom);display:grid;place-items:center;text-align:center;border-radius:50%;color:var(--fg);font-weight:600;line-height:1.1;user-select:none;cursor:pointer;
 background:radial-gradient(circle at 32% 28%,color-mix(in srgb,var(--c) 42%,transparent),color-mix(in srgb,var(--c) 14%,transparent) 62%,color-mix(in srgb,var(--c) 6%,transparent));
 border:1px solid color-mix(in srgb,var(--c) 55%,transparent);box-shadow:0 10px 30px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.08);transition:opacity .35s var(--ease),filter .35s var(--ease),box-shadow .35s var(--ease)}
.bub span{padding:0 8px;transition:transform .35s var(--ease)}
.bub[data-cat=porn]{--c:var(--c-porn)}.bub[data-cat=subst]{--c:var(--c-subst)}.bub[data-cat=food]{--c:var(--c-food)}.bub[data-cat=digital]{--c:var(--c-digital)}.bub[data-cat=behav]{--c:var(--c-behav)}
.bubbles:not(.sim) .bub{padding:10px 16px;border-radius:99px;font-size:.9rem}
.bubbles.sim{display:block;position:relative;margin-top:28px}
.bubbles.sim .bub{position:absolute;left:0;top:0;will-change:transform}
.bub.sm{font-weight:600;letter-spacing:-.01em}
.bub:hover span,.bub.on span{transform:scale(1.08)}
.bub.on{box-shadow:0 0 0 1px var(--c),0 0 34px color-mix(in srgb,var(--c) 45%,transparent)}
.bubbles.has-hl .bub:not(.on){opacity:.55}
.b-legend{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:22px}
.b-legend button{display:inline-flex;align-items:center;gap:8px;font:inherit;font-size:.85rem;color:var(--muted);background:var(--surface);border:1px solid var(--line-2);border-radius:99px;padding:6px 12px;cursor:pointer;transition:color .3s,border-color .3s}
.b-legend button i{width:9px;height:9px;border-radius:50%;background:var(--c-custom)}
.b-legend [data-cat=porn] i{background:var(--c-porn)}.b-legend [data-cat=subst] i{background:var(--c-subst)}.b-legend [data-cat=food] i{background:var(--c-food)}.b-legend [data-cat=digital] i{background:var(--c-digital)}.b-legend [data-cat=behav] i{background:var(--c-behav)}
.b-legend button[aria-pressed=true],.b-legend button:hover{color:var(--fg);border-color:var(--line-2);background:var(--surface-2)}
.med-note{display:flex;gap:14px;align-items:flex-start;max-width:820px;margin:40px auto 0;padding:16px 20px;border-radius:18px;background:linear-gradient(180deg,rgba(134,182,218,.08),rgba(134,182,218,.03));border:1px solid rgba(134,182,218,.28);font-size:.92rem;color:var(--muted);text-align:left}
.med-note b{color:var(--fg)}.med-ico{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:rgba(134,182,218,.15);color:#86B6DA;font-size:1rem}
@media(max-width:639px){.med-note{font-size:.86rem;padding:14px 16px}}
/* ===== v6: plan de 90 días por fases ===== */
.plan-h{align-items:baseline}.plan-h .muted{font-family:var(--f-b);font-size:.9rem}
.plan-legend{display:flex;flex-wrap:wrap;gap:8px 18px;margin:4px 0 18px;font-size:.82rem;color:var(--muted)}
.lg{display:inline-flex;align-items:center;gap:7px}.lg i{width:12px;height:12px;border-radius:50%;display:inline-block}
.lg0 i{background:var(--dusk)}.lg1 i{background:var(--dawn);box-shadow:0 0 0 3px rgba(244,177,131,.25)}.lg2 i{background:rgba(196,206,234,.12)}.lg3 i{border:2px solid var(--dawn)}
.plan-phases{display:grid;gap:14px}
.pp{border:1px solid color-mix(in srgb,var(--c) 35%,transparent);background:linear-gradient(180deg,color-mix(in srgb,var(--c) 9%,transparent),transparent);border-radius:16px;padding:14px 14px 12px}
.pp-h{display:flex;justify-content:space-between;gap:8px;align-items:baseline;margin-bottom:10px}.pp-h b{color:var(--c);font-size:.95rem}
.pp p{color:var(--muted);font-size:.86rem;margin-top:8px;line-height:1.45}
.pp-ends{display:flex;justify-content:space-between;color:var(--faint);margin-top:6px}
.plan .dots{display:grid;grid-template-columns:repeat(auto-fill,minmax(16px,1fr));gap:6px}
.plan .dots i{position:relative;aspect-ratio:1;border-radius:50%;background:rgba(196,206,234,.10);box-shadow:none}
.plan .dots i.on{background:var(--c)}
.in .plan .dots i.on,.plan.in .dots i.on{animation:pop .4s var(--ease) both;animation-delay:calc(var(--i)*25ms)}
.plan .dots i.now{background:var(--dawn);box-shadow:0 0 0 3px rgba(244,177,131,.3)}
.plan .dots i.goal{background:transparent;box-shadow:inset 0 0 0 2px var(--dawn)}
.plan .tag{position:absolute;bottom:calc(100% + 6px);left:50%;transform:translateX(-50%);white-space:nowrap;font:500 .62rem var(--f-m);color:var(--dawn-ink);background:var(--dawn);padding:2px 6px;border-radius:6px;pointer-events:none}
.plan .goal .tag{left:auto;right:-4px;transform:none}
.pp:has(.tag) .dots{padding-top:20px}
.plan-after{color:var(--faint);margin-top:14px;text-align:center}
@media(min-width:900px){.plan-phases{grid-template-columns:14fr 31fr 45fr}.pp p{font-size:.84rem}}
.bubbles.sim{touch-action:pan-y}
.bubbles.sim .bub{transform-origin:50% 50%}
.bubbles.has-hl .bub:not(.on){opacity:.7}
.plan .goal .tag{bottom:auto;top:calc(100% + 6px);right:-2px}
.pp:has(.goal) .pp-ends{margin-top:28px}
@media(min-width:900px){.pp-h{flex-direction:column;gap:2px}}
.plan .goal .tag{left:0;right:auto;transform:none}
.pp:has(.tag) .dots{padding-top:0}.pp:has(.now) .dots{padding-top:20px}