:root{--beige:#E5D5CA;--cream:#FDF0D0;--mint:#D0E9E6;--blue:#D0E3F2;--lilac:#E0D7F5;--pink:#FACDD0;
--ink:#4A2C2A;--p:#E8547A;--t:#2FA89A;--v:#8B6BC9;--bg:#FFFAF2;--r:28px;--ease:cubic-bezier(.2,.7,.2,1)}
*{box-sizing:border-box;margin:0}html{scroll-behavior:smooth}
body{font:400 1rem/1.6 Nunito,sans-serif;color:var(--ink);background:var(--bg);overflow-x:hidden}
h1,h2{font-family:Anton,Impact,sans-serif;font-weight:400;line-height:1;letter-spacing:.5px}
em{font-family:Caveat,cursive;font-style:normal;color:var(--p);font-size:1.25em}
.btn{display:inline-block;border:0;cursor:pointer;background:var(--p);color:#fff;font:800 1rem Nunito;padding:.9rem 1.8rem;border-radius:99px;text-decoration:none;transition:transform .3s var(--ease),box-shadow .3s}
.btn:hover{transform:translateY(-2px) scale(1.03);box-shadow:0 10px 24px #e8547a55}.btn.sm{padding:.6rem 1.2rem}.btn.light{background:#fff;color:var(--t)}.btn.wa{background:#25a86b;width:100%}
:focus-visible{outline:3px solid var(--v);outline-offset:3px}
.nav{position:fixed;inset:0 0 auto;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.7rem 4vw;background:#fffaf2cc;backdrop-filter:blur(14px)}
.nav nav{display:flex;gap:1.6rem}.nav nav a{color:var(--ink);text-decoration:none;font-weight:700}
.brand{display:flex;align-items:center;gap:.5rem;font:400 1.7rem Anton;color:var(--t);text-decoration:none}.brand svg,.brand img{width:40px;height:40px}
.hero{position:relative;min-height:100vh;padding:7rem 5vw 3rem;display:grid;grid-template-columns:1fr 1fr;align-items:center;background:radial-gradient(circle at 75% 55%,var(--pink),transparent 55%),radial-gradient(circle at 20% 90%,var(--mint),transparent 45%),var(--bg);overflow:hidden}
.drip{position:absolute;top:0;left:0;width:100%;height:50px}
.hero h1{font-size:clamp(3.5rem,9vw,7.5rem)}.hero h1 span{display:block;transform:translateY(60%);opacity:0;animation:up .9s var(--ease) forwards}
.hero h1 .c2{color:var(--p);animation-delay:.15s}.hero h1 .c3{color:var(--t);animation-delay:.3s}
@keyframes up{to{transform:none;opacity:1}}
.hero p{margin:1.4rem 0 2rem;max-width:30ch;font-size:1.15rem}
.hero-art{transform:translateY(calc(var(--p0,0)*-60px)) scale(calc(1 + var(--p0,0)*.35)) rotate(calc(var(--p0,0)*-8deg));will-change:transform;animation:fl 5s ease-in-out infinite}
@keyframes fl{50%{translate:0 -12px}}
.hero-art svg,.hero-art img{width:100%;filter:drop-shadow(0 30px 30px #4a2c2a30)}
.rating{position:absolute;top:8rem;right:6vw;background:#fff;border-radius:20px;padding:.8rem 1.4rem;box-shadow:0 12px 30px #0001;text-align:center}
.rating b{font:400 2rem Anton;display:block}.rating span{color:#f5b301}.rating small{display:block;color:#8a6a66}
.sec{padding:6rem 5vw}.head{display:flex;justify-content:space-between;align-items:end;gap:2rem;flex-wrap:wrap;margin-bottom:2.5rem}
.head h2{font-size:clamp(2rem,4.5vw,3.4rem)}
.reveal{opacity:0;transform:translateY(50px) scale(.97);transition:opacity 1s var(--ease),transform 1s var(--ease)}.reveal.in{opacity:1;transform:none}
.car{display:flex;align-items:center;gap:.8rem}.track{display:flex;gap:1.6rem;overflow-x:auto;scroll-snap-type:x mandatory;padding:1rem .5rem;scrollbar-width:none;flex:1}
.arr{flex:none;width:44px;height:44px;border-radius:50%;border:0;background:#fff;box-shadow:0 4px 14px #0002;font-size:1.6rem;cursor:pointer}
.item{flex:none;width:150px;text-align:center;scroll-snap-align:center;cursor:pointer;background:none;border:0;font:800 .95rem Nunito;color:var(--ink)}
.item .c{width:150px;height:150px;border-radius:50%;display:grid;place-items:center;margin-bottom:.7rem;transition:transform .5s var(--ease)}.item:hover .c,.item.on .c{transform:scale(1.12) rotate(-4deg)}
.item img{width:100%;height:100%;border-radius:50%;object-fit:cover}
.tip{max-width:520px;margin:1.5rem auto 0;text-align:center;font-size:1.1rem;min-height:3.2rem;transition:opacity .3s}
.scrolly{height:420vh;position:relative}.sticky{position:sticky;top:0;height:100vh;display:grid;grid-template-columns:1fr 1fr;align-items:center;padding:0 6vw;background:linear-gradient(135deg,var(--mint),var(--blue) 60%,var(--lilac))}
.sc-art svg{width:100%;max-height:70vh;overflow:visible}.sc-art g{transition:opacity .5s,transform .7s var(--ease)}
.sc-text h2{font-size:clamp(2.4rem,6vw,5rem);transition:opacity .4s}.sc-text p{font-size:1.2rem;max-width:32ch;margin-top:1rem}
.dots{display:flex;gap:.5rem;margin-top:2rem}.dots i{width:12px;height:12px;border-radius:9px;background:#fff;transition:.4s}.dots i.on{width:40px;background:var(--p)}
.builder{display:grid;grid-template-columns:1.1fr .9fr;gap:2.5rem;max-width:1100px;margin:auto}
.tipos{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem;margin-bottom:1.5rem}
.tipo{border:3px solid transparent;border-radius:var(--r);padding:1rem;cursor:pointer;text-align:left;font:inherit;color:inherit;transition:.3s var(--ease)}
.tipo:nth-child(1){background:var(--lilac)}.tipo:nth-child(2){background:var(--mint)}.tipo:nth-child(3){background:var(--pink)}
.tipo b{font:400 1.5rem Anton;display:block}.tipo small{display:block;line-height:1.3;margin-top:.3rem}.tipo.on{border-color:var(--ink);transform:translateY(-4px)}
.chips{display:flex;flex-wrap:wrap;gap:.6rem}.chip{display:flex;align-items:center;gap:.5rem;border:2px solid var(--beige);background:#fff;border-radius:99px;padding:.5rem 1rem;font:700 .95rem Nunito;color:var(--ink);cursor:pointer;transition:.25s}
.chip i{width:18px;height:18px;border-radius:50%;border:1px solid #0002}.chip.on{background:var(--cream);border-color:var(--p);transform:scale(1.05)}.chip:disabled{opacity:.7;cursor:default}
.b-right{background:var(--cream);border-radius:var(--r);padding:1.5rem;display:flex;flex-direction:column;gap:1rem;position:sticky;top:5rem;align-self:start}
.prev svg{width:100%;max-height:220px}.note{text-align:center;font-weight:700}
.cart{font-size:.95rem}.cart div{display:flex;justify-content:space-between;gap:.5rem;padding:.4rem 0;border-bottom:1px dashed var(--beige)}.cart button{border:0;background:none;color:var(--p);cursor:pointer;font-weight:800}
.form{display:grid;gap:.6rem}.form input{padding:.8rem 1rem;border-radius:14px;border:2px solid var(--beige);font:inherit;background:#fff}
.seg{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}.seg span{display:block;text-align:center;padding:.6rem;border-radius:14px;background:#fff;border:2px solid var(--beige);font-weight:700;cursor:pointer}.seg input{position:absolute;opacity:0}.seg input:checked+span{background:var(--t);color:#fff;border-color:var(--t)}
.promo{padding:0 5vw 5rem}.pbox{display:grid;grid-template-columns:1.3fr 1fr;align-items:center;background:var(--t);color:#fff;border-radius:40px;padding:3rem;gap:2rem;overflow:hidden}
.pbox h2{font-size:clamp(2.6rem,6vw,5rem);color:var(--cream)}.pbox p{margin:1rem 0 1.5rem;font-size:1.2rem}.pbox svg{width:100%}
.perks{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-top:3rem;text-align:center;font-size:2rem}.perks b{display:block;font-size:.95rem}
.sbox{display:grid;grid-template-columns:1fr 1fr;background:var(--pink);border-radius:40px;overflow:hidden;align-items:center}.sbox>div:first-child{padding:3rem}.sbox h2{font-size:clamp(2rem,4vw,3rem)}.sbox p{margin-top:1rem;max-width:40ch}
.ph{background:var(--lilac);height:100%;min-height:320px;display:grid;place-items:center}.ph svg,.ph img{width:70%}.ph img{width:100%;height:100%;object-fit:cover}
.tests{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}.test{background:#fff;border-radius:var(--r);padding:1.5rem;box-shadow:0 8px 24px #0000000d}.test b{display:block;margin-top:.6rem}.test span{color:#f5b301}
.gal{display:grid;grid-template-columns:repeat(5,1fr);gap:.8rem;margin-top:2rem;padding:1.5rem;background:var(--t);border-radius:var(--r)}
.gal>div{aspect-ratio:1;border-radius:18px;overflow:hidden;display:grid;place-items:center;transition:transform .4s var(--ease)}.gal>div:hover{transform:scale(1.06) rotate(2deg)}.gal img{width:100%;height:100%;object-fit:cover}.gal svg{width:80%}
footer{display:flex;justify-content:space-between;flex-wrap:wrap;gap:1rem;padding:2rem 5vw;background:var(--cream);font-weight:700}#fbrand{font:400 1.6rem Anton;color:var(--t)}
.toast{position:fixed;bottom:24px;left:50%;translate:-50% 120px;background:var(--ink);color:#fff;padding:.8rem 1.4rem;border-radius:99px;transition:translate .5s var(--ease);z-index:30}.toast.on{translate:-50% 0}
.conf{position:fixed;width:9px;height:9px;border-radius:50%;pointer-events:none;z-index:40;animation:cf .9s var(--ease) forwards}
@keyframes cf{to{transform:translate(var(--x),var(--y)) scale(.3);opacity:0}}
@media(max-width:820px){.nav nav{display:none}.hero,.sticky,.builder,.pbox,.sbox{grid-template-columns:1fr}.hero{padding-top:6rem}.rating{display:none}.sticky{padding-top:4rem;align-content:center;gap:1rem}.sc-art svg{max-height:34vh}.tests,.perks{grid-template-columns:1fr 1fr}.tests{grid-template-columns:1fr}.gal{grid-template-columns:repeat(2,1fr)}.b-right{position:static}.tipos{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}html{scroll-behavior:auto}}

.tipo img{width:100%;aspect-ratio:1;object-fit:contain;margin-bottom:.4rem}
.chips{display:block}.cw{display:flex;flex-wrap:wrap;gap:.6rem}.grp{font:400 1.3rem Anton;letter-spacing:.5px;margin:1.2rem 0 .6rem}.grp small{font:700 .85rem Nunito;color:#8a6a66;margin-left:.6rem}.chip img{width:26px;height:26px;border-radius:50%;object-fit:cover}

:root{--r:36px}
.nav{inset:14px auto auto 50%;translate:-50% 0;width:min(980px,calc(100% - 24px));padding:.4rem .5rem .4rem 1.1rem;border-radius:99px;background:rgba(255,250,242,.7);-webkit-backdrop-filter:blur(20px) saturate(1.6);backdrop-filter:blur(20px) saturate(1.6);border:1px solid #ffffffb0;box-shadow:0 12px 40px #4a2c2a24;transition:width .6s var(--ease),background .4s}
.nav.sm{width:min(740px,calc(100% - 24px));background:rgba(255,250,242,.9)}
.brand{font-size:1.45rem}.brand svg,.brand img{width:34px;height:34px}
.nav nav{position:relative;gap:.1rem;padding:.2rem}.nav nav a{position:relative;z-index:1;padding:.5rem 1rem;border-radius:99px;font-size:.92rem;transition:color .3s}.nav nav a.on{color:var(--p)}
.ind{position:absolute;top:.2rem;bottom:.2rem;left:0;width:0;border-radius:99px;background:var(--pink);opacity:0;transition:left .5s var(--ease),width .5s var(--ease),opacity .3s}
.nav-r{display:flex;align-items:center;gap:.5rem}
.cartbtn{position:relative;width:42px;height:42px;border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 2px 8px #0001;transition:transform .3s var(--ease)}.cartbtn:hover{transform:scale(1.1)}
.cartbtn b{position:absolute;top:-4px;right:-4px;min-width:20px;height:20px;border-radius:99px;background:var(--p);color:#fff;font:800 .72rem/20px Nunito;text-align:center;padding:0 5px}.cartbtn b[hidden]{display:none}
.pop{animation:pop .5s var(--ease)}@keyframes pop{40%{transform:scale(1.5)}}
.btn{display:inline-flex;align-items:center;gap:.8rem}
.btn:not(.sm)::after{content:"→";display:grid;place-items:center;width:30px;height:30px;margin:-.35rem -1.1rem -.35rem 0;border-radius:50%;background:#fff;color:var(--p);transition:transform .35s var(--ease)}
.btn:hover::after{transform:translateX(4px)}.btn.light::after{color:var(--t)}.btn.wa{justify-content:center}.btn.wa::after{color:#25a86b}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:80px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath fill='%23FFFAF2' d='M0 40C240 90 480 0 720 30s480 50 720-10V80H0z'/%3E%3C/svg%3E") center/100% 100% no-repeat}
.dec{position:absolute;z-index:1;pointer-events:none;transform:translateY(calc(var(--p0,0)*var(--s)*1px)) rotate(calc(var(--p0,0)*80deg))}
.hero h1 span{filter:blur(14px)}@keyframes up{to{transform:none;opacity:1;filter:blur(0)}}
.hero p,.hero .btn{animation:up2 .9s .5s var(--ease) backwards}@keyframes up2{from{opacity:0;transform:translateY(30px);filter:blur(8px)}}
.w{display:inline-block;opacity:0;transform:translateY(.6em);filter:blur(8px);transition:opacity .8s var(--ease),transform .8s var(--ease),filter .8s var(--ease);transition-delay:calc(var(--i)*70ms)}.split.in .w{opacity:1;transform:none;filter:none}
.manifesto{text-align:center;padding:6rem 8vw 3rem}.fill{font:400 clamp(1.8rem,4.6vw,3.6rem)/1.2 Anton,sans-serif;max-width:900px;margin:auto;letter-spacing:.5px}.fill .f{opacity:.16;transition:opacity .4s}.fill .f.on{opacity:1}
.sw{animation:sw .8s var(--ease)}@keyframes sw{from{opacity:0;transform:translateY(24px);filter:blur(10px)}}
.tabs{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1.2rem}.tabs button{border:0;border-radius:99px;padding:.55rem 1.2rem;background:#fff;font:800 .9rem Nunito;color:var(--ink);cursor:pointer;box-shadow:0 2px 8px #0001;transition:.3s var(--ease)}.tabs .on{background:var(--ink);color:#fff}
.pgrid{display:grid;grid-template-columns:1.6fr 1fr;gap:1.2rem}.pbox{position:relative;border-radius:56px}.pbox::before{content:"";position:absolute;width:260px;height:260px;border-radius:50%;background:#ffffff1f;right:-60px;top:-80px}
.dcard{background:#fff;border-radius:48px;padding:1.8rem;box-shadow:0 12px 40px #4a2c2a14;border:2px solid var(--pink);display:flex;flex-direction:column;gap:1rem;justify-content:center}.dcard h3{font:400 2rem/1 Anton}
.pr{display:flex;align-items:center;gap:.8rem;padding:.6rem;border-radius:22px;background:var(--bg)}.pr i{width:56px;flex:none}.pr svg,.pr img{width:100%}.pr span{flex:1;font-weight:800;line-height:1.2}.pr small{display:block;font-weight:600;color:var(--t)}.pr b{font:400 1.2rem Anton}
.sbox{border-radius:56px}.b-right{border-radius:44px}.gal{border-radius:44px}.test{border-radius:36px}
@media(max-width:820px){.pgrid{grid-template-columns:1fr}.nav{padding-left:.8rem}.nav-r .btn{padding:.6rem 1rem}}
@media(prefers-reduced-motion:reduce){.w,.fill .f,.hero h1 span{opacity:1!important;transform:none!important;filter:none!important}}
.brand img{width:42px;height:42px}
