/* Nidamor Kids · estilos generales (compartidos por todas las páginas) */
/* Layout: nido. Columna central de 1120px; cada sección repite la misma cabecera (etiqueta, título, bajada) y una sola grilla de contenido. Parallax en portada y franja intermedia. */
:root{
  --salvia-oscuro:#626950;
  --salvia-claro:#8E9676;
  --durazno:#E2AD96;
  --marfil:#FEFBF4;
  --tinta:#3B3F2F;
  --tinta-suave:#5E6352;
  --linea:#E4E0D2;
  --papel:#F6F1E6;
  --durazno-suave:#F7E3D9;
  --salvia-velo:#EEF0E6;
  --pantalla:#2F3227;
  --font-display:"Fraunces", "Iowan Old Style", Georgia, serif;
  --font-body:"Nunito", "Segoe UI", system-ui, sans-serif;
  --radio:18px;
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--marfil);color:var(--tinta);font-family:var(--font-body);font-size:17px;line-height:1.65;margin:0;overflow-x:hidden}
.wrap{max-width:1120px;margin:0 auto;padding-left:max(20px, env(safe-area-inset-left, 0px));padding-right:max(20px, env(safe-area-inset-right, 0px))}
h1,h2,h3{font-family:var(--font-display);font-weight:400;font-variation-settings:"SOFT" 100;color:var(--salvia-oscuro);text-wrap:balance;margin:0;line-height:1.12}
h1{font-size:clamp(2.5rem, 5.6vw, 4.2rem);letter-spacing:-.01em}
h2{font-size:clamp(1.9rem, 3.6vw, 2.7rem)}
h3{font-size:1.3rem}
em{font-style:italic;color:var(--salvia-claro)}
p{margin:0}
a{color:inherit}
button{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--durazno);outline-offset:3px;border-radius:6px}
.eyebrow{font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--salvia-claro)}
.lead{font-size:1.1rem;color:var(--tinta-suave);max-width:56ch}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font:700 1rem var(--font-body);padding:.95rem 1.6rem;border-radius:999px;border:0;cursor:pointer;text-decoration:none;transition:transform .2s ease, background .2s ease, box-shadow .2s ease}
.btn-main{background:var(--durazno);color:var(--tinta)}
.btn-main:hover{background:#D99C82;transform:translateY(-2px);box-shadow:0 10px 20px -12px rgba(150,90,60,.6)}
.btn-ghost{background:transparent;color:var(--salvia-oscuro);box-shadow:inset 0 0 0 1.5px var(--salvia-claro)}
.btn-ghost:hover{background:var(--salvia-velo)}

/* Sección estándar: misma cabecera y mismo ritmo en todas */
.sec{padding-block:clamp(72px, 9vw, 112px)}
.sec-head{display:grid;gap:12px;margin-bottom:clamp(36px, 5vw, 52px);max-width:640px}
.alt{background:var(--papel)}
.velo{background:var(--salvia-velo)}

/* Cabecera */
.top{position:sticky;top:env(safe-area-inset-top, 0px);z-index:20;background:color-mix(in srgb, var(--marfil) 92%, transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--linea)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:8px}
.top img{height:60px;width:auto;display:block}
.top nav{display:flex;align-items:center;gap:24px;font-weight:600;font-size:.94rem}
.top nav a{text-decoration:none;color:var(--tinta-suave);position:relative}
.top nav a:not(.btn)::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:2px;background:var(--durazno);transform:scaleX(0);transition:transform .25s}
.top nav a:not(.btn):hover::after,.top nav a.on::after{transform:scaleX(1)}
.top nav a.on{color:var(--salvia-oscuro)}
.top .btn{padding:.6rem 1.15rem;font-size:.9rem}
.progreso{position:absolute;left:0;bottom:-1px;height:2px;width:100%;background:var(--durazno);transform-origin:0 50%;transform:scaleX(0)}
.menu-btn{display:none;width:44px;height:44px;border:0;border-radius:12px;background:var(--salvia-velo);cursor:pointer;place-items:center}
.menu-btn span,.menu-btn span::before,.menu-btn span::after{display:block;width:18px;height:2px;border-radius:2px;background:var(--salvia-oscuro);position:relative;transition:transform .25s, background .25s}
.menu-btn span::before,.menu-btn span::after{content:"";position:absolute;left:0}
.menu-btn span::before{top:-6px}.menu-btn span::after{top:6px}
.menu-btn[aria-expanded="true"] span{background:transparent}
.menu-btn[aria-expanded="true"] span::before{transform:translateY(6px) rotate(45deg)}
.menu-btn[aria-expanded="true"] span::after{transform:translateY(-6px) rotate(-45deg)}
@media (max-width:860px){
  .top img{height:48px}
  .menu-btn{display:grid}
  .top nav{position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;gap:0;background:var(--marfil);border-bottom:1px solid var(--linea);padding:8px max(20px, env(safe-area-inset-right, 0px)) 18px max(20px, env(safe-area-inset-left, 0px));box-shadow:0 20px 30px -24px rgba(70,74,50,.5)}
  .top nav[data-open="false"]{display:none}
  .top nav a:not(.btn){padding:14px 2px;border-bottom:1px solid var(--linea);font-size:1.05rem}
  .top nav a:not(.btn)::after{display:none}
  .top nav .btn{margin-top:14px;padding:.9rem;font-size:1rem}
}
/* Botón flotante de WhatsApp */
.wa-flotante{position:fixed;z-index:30;right:calc(18px + env(safe-area-inset-right, 0px));bottom:calc(18px + env(safe-area-inset-bottom, 0px));width:56px;height:56px;border-radius:50%;background:var(--salvia-oscuro);display:grid;place-items:center;box-shadow:0 12px 24px -10px rgba(50,54,36,.6);transition:transform .2s}
.wa-flotante:hover{transform:scale(1.07)}
.wa-flotante svg{width:28px;height:28px}

/* Parallax */
[data-parallax]{position:relative;overflow:hidden}
.capa{position:absolute;pointer-events:none;will-change:transform}
.capa svg{display:block;width:100%;height:auto}

/* Portada: arco de habitación con móvil de cuna sobre el marco */
.hero{padding-block:clamp(28px, 5vw, 64px) clamp(64px, 8vw, 104px);background:linear-gradient(180deg, var(--marfil) 0%, #FBF4EE 100%)}
.hero .wrap{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(28px, 5vw, 64px);align-items:center}
.hero-text{display:grid;gap:22px;min-width:0}
.hero h1 em{position:relative;white-space:nowrap}
.hero h1 em svg{position:absolute;left:-2%;bottom:-.14em;width:104%;height:.32em;overflow:visible}
.trazo{fill:none;stroke:var(--durazno);stroke-width:5;stroke-linecap:round;stroke-dasharray:320;stroke-dashoffset:0;animation:trazo 1.4s .3s ease-out backwards}
@keyframes trazo{from{stroke-dashoffset:320}}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px}
.sellos{list-style:none;margin:6px 0 0;padding:16px 0 0;border-top:1px solid var(--linea);display:flex;flex-wrap:wrap;gap:10px 22px;font-size:.9rem;color:var(--tinta-suave)}
.sellos li{display:flex;align-items:center;gap:8px}
.sellos svg{width:16px;height:16px;flex:none}
.escena{position:relative;margin:0;width:100%;max-width:560px;justify-self:center;aspect-ratio:1/1.08;perspective:1200px}
.arco{position:absolute;inset:0 3%;border-radius:1000px 1000px 28px 28px;background:linear-gradient(176deg, #EEF0E6 0%, #F5EBE2 62%, #F7E3D9 100%);overflow:hidden}
.arco::after{content:"";position:absolute;inset:0;background-image:radial-gradient(circle, rgba(142,150,118,.22) 1.2px, transparent 1.6px);background-size:26px 26px;mask-image:linear-gradient(180deg,#000 0%,transparent 70%);-webkit-mask-image:linear-gradient(180deg,#000 0%,transparent 70%)}
.barra{position:absolute;left:26%;right:26%;top:13%;height:7px;border-radius:7px;background:#D8C2A6;box-shadow:0 2px 0 #C9B08F}
.barra::before{content:"";position:absolute;left:50%;bottom:7px;width:1px;height:60px;background:var(--salvia-claro);opacity:.5}
.colgante{position:absolute;top:calc(13% + 6px);width:0;transform-origin:50% 0;animation:mece 4.8s ease-in-out infinite alternate}
.colgante::before{content:"";position:absolute;left:0;top:0;width:1px;height:calc(var(--l) * var(--k, 1));background:var(--salvia-claro);opacity:.55}
.colgante svg{position:absolute;top:calc(var(--l) * var(--k, 1));left:0;width:calc(var(--w) * var(--k2, 1));transform:translateX(-50%);display:block}
@keyframes mece{from{transform:rotate(-5deg)}to{transform:rotate(5deg)}}
.escena{aspect-ratio:auto;max-width:460px;padding:18px 0 30px}
.escena .arco{inset:0 -7% 8% 14%;border-radius:1000px 1000px 28px 28px}
.escena .colgante{top:0}
.foto-wrap{position:relative;z-index:1;border-radius:26px;overflow:hidden;box-shadow:0 0 0 8px var(--marfil), 0 44px 70px -34px rgba(70,48,24,.6)}
.foto-in{position:relative}
.foto-wrap img{display:block;width:100%;height:auto}
.glow{position:absolute;left:31%;top:38.2%;width:36.1%;height:15.9%;border-radius:4px;pointer-events:none;opacity:0}
.latiendo .glow{animation:glow .4286s ease-out infinite}
@keyframes glow{0%{opacity:1;box-shadow:0 0 0 2px rgba(226,173,150,.95), 0 0 30px 8px rgba(226,173,150,.55)}100%{opacity:0;box-shadow:0 0 0 14px rgba(226,173,150,0), 0 0 40px 18px rgba(226,173,150,0)}}
.chip-foto{position:absolute;left:16px;top:16px;background:rgba(254,251,244,.92);color:var(--salvia-oscuro);font-size:.78rem;font-weight:700;letter-spacing:.02em;padding:.38rem .8rem;border-radius:999px}
.btn-latido{position:absolute;left:50%;bottom:6px;transform:translateX(-50%);z-index:3;background:#fff;color:var(--salvia-oscuro);padding:.7rem 1.2rem;font-size:.92rem;box-shadow:0 12px 24px -14px rgba(70,74,50,.55), inset 0 0 0 1px var(--linea);white-space:nowrap}
.btn-latido:hover{transform:translateX(-50%) translateY(-2px)}
.btn-latido svg{width:18px;height:18px;color:var(--durazno)}
.btn-latido[aria-pressed="true"]{background:var(--salvia-oscuro);color:var(--marfil)}
.btn-latido[aria-pressed="true"] svg{animation:pulso .4286s ease-out infinite}
@media (max-width:880px){.hero .wrap{grid-template-columns:1fr}.escena{max-width:480px}}
@media (max-width:520px){.escena{--k:.5;--k2:.8}.barra{top:12%}.barra::before{height:30px}}
.tilt{transition:transform .35s ease-out;transform-style:preserve-3d}

/* Marco (componente): vertical como el producto real; nombre arriba, ecografía al centro, botones y nubes abajo */
.frame{--f-fondo:#EFE3D2;--f-madera:#B98A5C;--f-madera2:#9C7148;--f-acento:#3F5C8C;--f-luna:#F3E5A2;--f-nube:#F6EBD8;--f-nube2:#E9DCC6;--f-estrella:#8FB3CF;--f-estrella2:#E2AD96;
  container-type:inline-size;position:relative;aspect-ratio:4/5;width:calc(100% - 32px);max-width:340px;margin:20px auto;background:var(--f-fondo);border-radius:4px;overflow:hidden;
  box-shadow:0 0 0 12px var(--f-madera), 0 0 0 16px var(--f-madera2), inset 0 6px 14px rgba(80,55,30,.18), 0 34px 60px -26px rgba(70,54,30,.55);transition:background .4s}
.frame[data-paleta="salvia"]{--f-fondo:#E6E9DC;--f-acento:#626950;--f-luna:#F1E9D2;--f-nube:#F4F5EE;--f-nube2:#D6DBC8;--f-estrella:#8E9676;--f-estrella2:#E2AD96}
.frame[data-paleta="durazno"]{--f-fondo:#F5E2D6;--f-acento:#B76E57;--f-luna:#FBEFE0;--f-nube:#FDF5EE;--f-nube2:#EFCDBB;--f-estrella:#E2AD96;--f-estrella2:#8E9676}
.fig{position:absolute;transition:opacity .35s, transform .35s}
.fig[hidden]{display:block!important;opacity:0;transform:scale(.6)}
.fig svg{display:block;width:100%;height:auto}
.pl-nombre{position:absolute;left:0;right:0;top:5%;text-align:center;font-family:"Dancing Script", "Brush Script MT", cursive;font-weight:600;font-size:14cqw;line-height:1;color:var(--f-acento);text-shadow:0 2px 0 rgba(0,0,0,.12);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-inline:6%}
.pl-msg{position:absolute;left:50%;top:63.5%;transform:translateX(-50%);white-space:nowrap;font:600 3.3cqw var(--font-body);letter-spacing:.02em;color:#fff;background:#D9A48C;padding:1.4cqw 3.6cqw;border-radius:1.4cqw;box-shadow:0 1px 0 rgba(0,0,0,.12)}
.botones{position:absolute;left:50%;top:54%;transform:translateX(-50%);display:flex;gap:6cqw}
.botones i{width:6.2cqw;height:6.2cqw;border-radius:50%;background:#2B2A27;box-shadow:0 0 0 1cqw rgba(255,255,255,.35)}
.f-luna{left:3%;top:25%;width:16%}
.f-oso{right:3%;top:25%;width:16%}
.f-nube1{left:-1%;bottom:-2%;width:47%}
.f-nube2{right:-1%;bottom:-2%;width:47%;transform:scaleX(-1)}
.f-nube2[hidden]{transform:scaleX(-1) scale(.6)}
.leds{animation:led 3.2s ease-in-out infinite alternate}
.f-nube2 .leds{animation-delay:-1.6s}
@keyframes led{from{opacity:.55}to{opacity:1}}
.f-osito{right:2%;top:23%;width:19%}
.f-conejo{left:3%;top:42%;width:15%}
.f-conejo-cara{left:4%;top:43%;width:14%}
.f-perrito{right:2%;top:42%;width:18%}
.f-perrito-cara{right:2%;top:44%;width:19%}
.f-chupete{left:5%;top:58%;width:14%}
.f-body{right:4%;top:58%;width:15%}
.f-mamadera{left:3%;top:3%;width:8%}
.fig img{display:block;width:100%;height:auto;filter:drop-shadow(0 1.5px 1px rgba(90,70,40,.3));user-select:none}
.fig > svg{filter:drop-shadow(0 2px 2px rgba(90,70,40,.22))}
.f-est{width:6%}
.e5{left:47%;bottom:4%;width:6%}
.e1{left:15%;top:7%}.e4{left:81%;top:5%}.e3{left:21%;top:18%;width:5%}.e2{left:83%;top:18%;width:5%}
.screen{position:absolute;left:23%;top:24%;width:54%;height:25%;background:#0E0E0D;border-radius:2cqw;box-shadow:0 0 0 1.4cqw #1E1D1B, 0 3px 8px rgba(0,0,0,.25);overflow:hidden}
.scr{position:absolute;inset:0;transition:opacity .4s}
.scr[hidden]{display:block!important;opacity:0}
.scr svg{position:absolute;inset:0;width:100%;height:100%}
.beat{fill:none;stroke:var(--durazno);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:420;stroke-dashoffset:420;animation:beat 2.6s ease-in-out infinite}
@keyframes beat{0%{stroke-dashoffset:420}55%{stroke-dashoffset:0}100%{stroke-dashoffset:-420}}
.bpm{position:absolute;right:8%;top:9%;font:600 .62rem var(--font-body);letter-spacing:.08em;color:rgba(255,255,255,.65)}
.bar{position:absolute;left:8%;right:8%;bottom:10%;height:3px;border-radius:3px;background:rgba(255,255,255,.18);overflow:hidden}
.bar::after{content:"";position:absolute;inset:0;background:rgba(255,255,255,.75);transform-origin:0 50%;animation:bar 8s linear infinite}
@keyframes bar{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.eco-baby{animation:respira 3s ease-in-out infinite;transform-origin:50% 60%}
@keyframes respira{50%{transform:scale(1.04)}}
.foto{position:absolute;inset:0;opacity:0;animation:fotos 9s infinite;display:grid;place-items:center}
.foto:nth-child(1){background:linear-gradient(135deg,#F7E3D9,#E2AD96)}
.foto:nth-child(2){background:linear-gradient(135deg,#EEF0E6,#8E9676);animation-delay:3s}
.foto:nth-child(3){background:linear-gradient(135deg,#FEFBF4,#E9CBB9);animation-delay:6s}
.foto svg{position:static;width:30%;height:auto;opacity:.75}
@keyframes fotos{0%{opacity:0}5%,33%{opacity:1}38%,100%{opacity:0}}
.slide{position:absolute;inset:0;opacity:0;animation:fotos 9s infinite}
.slide:nth-child(2){animation-delay:3s}.slide:nth-child(3){animation-delay:6s}
.onda{position:absolute;left:0;right:0;bottom:16%;height:34%}
.onda .beat{stroke-width:2.6}
.scr .sonido{position:absolute;left:7%;top:8%;width:11%;opacity:.85}
.scr .sonido svg{position:static;width:100%;height:auto}
.scr .bpm{color:rgba(255,255,255,.8)}
.latiendo .sonido{animation:pulso .4286s ease-out infinite}
@keyframes pulso{0%{transform:scale(1.25)}100%{transform:scale(1)}}
/* Colores de filamento */
.col-head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.col-head > span{font-size:.85rem;font-weight:700;color:var(--salvia-oscuro)}
.tabs{display:flex;gap:6px}
.tab{border:0;background:var(--salvia-velo);color:var(--salvia-oscuro);font-size:.8rem;font-weight:700;padding:.35rem .8rem;border-radius:999px;cursor:pointer}
.tab[aria-selected="true"]{background:var(--salvia-oscuro);color:var(--marfil)}
#d-colores{display:grid;gap:14px}
.parte{display:grid;gap:8px}
.parte-top{display:flex;justify-content:space-between;gap:10px;font-size:.88rem;color:var(--tinta-suave)}
.parte-top b{color:var(--tinta);font-weight:700}
.swatches{display:flex;flex-wrap:wrap;gap:8px}
.sw{width:30px;height:30px;border-radius:50%;border:0;cursor:pointer;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12);transition:transform .15s, box-shadow .15s}
.sw:hover{transform:scale(1.1)}
.sw[aria-checked="true"]{box-shadow:inset 0 0 0 1px rgba(0,0,0,.12), 0 0 0 2px var(--marfil), 0 0 0 4px var(--salvia-oscuro)}
.colores small.nota{font-size:.78rem;color:var(--tinta-suave)}
/* Opciones de pantalla */
.otra-pant{font-size:.88rem;color:var(--tinta-suave);background:var(--durazno-suave);border-radius:10px;padding:10px 14px}
.otra-pant a{color:var(--salvia-oscuro);font-weight:700}
.opciones{display:grid;gap:8px}
.opcion{text-align:left;border:1.5px solid var(--linea);background:#fff;border-radius:12px;padding:.75rem .95rem;cursor:pointer;display:grid;grid-template-columns:20px 1fr;gap:2px 10px;align-items:center;transition:border-color .2s, background .2s}
.opcion::before{content:"";width:16px;height:16px;border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--salvia-claro);grid-row:span 2;transition:box-shadow .2s}
.opcion b{font-weight:700;color:var(--salvia-oscuro);font-size:.95rem}
.opcion small{grid-column:2;color:var(--tinta-suave);font-size:.82rem}
.opcion:hover{border-color:var(--salvia-claro)}
.opcion[aria-pressed="true"]{border-color:var(--salvia-oscuro);background:var(--salvia-velo)}
.opcion[aria-pressed="true"]::before{box-shadow:inset 0 0 0 5px var(--salvia-oscuro)}
.escuchar{justify-self:start;padding:.6rem 1.1rem;font-size:.9rem}
.escuchar svg{width:18px;height:18px}
.escuchar[aria-pressed="true"]{background:var(--durazno-suave);box-shadow:inset 0 0 0 1.5px var(--durazno)}
.art-caption{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:32px 15px 0;font-size:.85rem;color:var(--tinta-suave)}
.art-caption b{color:var(--salvia-oscuro)}

/* Diseñador */
.disenador{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(28px, 5vw, 64px);align-items:start}
@media (max-width:900px){.disenador{grid-template-columns:1fr}.dis-vista{order:-1}}
.dis-vista{position:sticky;top:96px;display:grid;gap:4px}
@media (max-width:900px){
  .dis-vista{top:calc(66px + env(safe-area-inset-top, 0px));z-index:5;background:var(--papel);padding-block:4px 10px;margin-inline:-4px}
  .dis-vista .frame{width:min(54%, 240px);margin:16px auto}
  .dis-vista .art-caption{display:none}
}
@media (max-width:520px){
  body{font-size:16px}
  .sec{padding-block:64px}
  .hero-actions .btn{flex:1 1 100%}
  .frame{box-shadow:0 0 0 8px var(--f-madera), 0 0 0 10px var(--f-madera2), inset 0 4px 10px rgba(80,55,30,.18), 0 24px 40px -24px rgba(70,54,30,.5)}
  .art-caption{margin:22px 10px 0}
  .conjunto{padding:18px}
  .conjunto .btn{width:100%}
  .controles{padding:18px}
}
.controles{display:grid;gap:22px;background:var(--marfil);border:1px solid var(--linea);border-radius:var(--radio);padding:clamp(20px, 3vw, 30px)}
.ctrl{display:grid;gap:10px}
.ctrl > span,.ctrl > label{font-size:.85rem;font-weight:700;color:var(--salvia-oscuro)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{border:1.5px solid var(--linea);background:#fff;border-radius:999px;padding:.45rem .95rem;font-size:.9rem;font-weight:600;color:var(--tinta-suave);cursor:pointer;display:inline-flex;align-items:center;gap:8px;transition:all .2s}
.chip:hover{border-color:var(--salvia-claro)}
.chip[aria-pressed="true"]{background:var(--salvia-oscuro);border-color:var(--salvia-oscuro);color:var(--marfil)}
.dot{width:14px;height:14px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
input,select,textarea{font:inherit;font-size:1rem;color:var(--tinta);background:#fff;border:1.5px solid var(--linea);border-radius:10px;padding:.75rem .9rem;width:100%}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--salvia-claro);box-shadow:0 0 0 3px var(--salvia-velo)}
.resumen{font-size:.9rem;color:var(--tinta-suave);padding-top:16px;border-top:1px dashed var(--linea)}
.resumen b{color:var(--salvia-oscuro)}

/* Colección */
.productos{display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:24px}
@media (max-width:820px){.productos{grid-template-columns:1fr}}
.producto{background:var(--marfil);border-radius:var(--radio);padding:clamp(22px, 3vw, 32px);display:grid;gap:16px;align-content:start;border:1px solid var(--linea);transition:transform .3s, box-shadow .3s}
.producto:hover{transform:translateY(-4px);box-shadow:0 24px 40px -30px rgba(70,74,50,.5)}
.tag{justify-self:start;font-size:.74rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;background:var(--salvia-velo);color:var(--salvia-oscuro);padding:.3rem .7rem;border-radius:999px}
.producto ul{list-style:none;margin:0;padding:0;display:grid;gap:10px;align-content:start}
.producto li{display:grid;grid-template-columns:16px 1fr;gap:10px;color:var(--tinta-suave)}
.producto li::before{content:"";width:8px;height:8px;margin-top:.62em;border-radius:50%;background:var(--durazno)}
.specs{display:flex;flex-wrap:wrap;gap:6px 18px;padding-top:14px;border-top:1px dashed var(--linea);font-size:.85rem;color:var(--tinta-suave)}
.specs b{color:var(--salvia-oscuro)}
.mini-foto{padding:0!important}
.mini-foto{aspect-ratio:4/5!important;padding:0!important;position:relative;overflow:hidden;border-radius:12px;background:var(--papel)!important}
.mini-foto .fondo{position:absolute;inset:-20px;width:calc(100% + 40px);height:calc(100% + 40px);object-fit:cover;filter:blur(18px) saturate(1.1);opacity:.75}
.mini-foto img:not(.fondo){position:relative;width:100%;height:100%;object-fit:contain;display:block}
.mini{background:var(--salvia-velo);border-radius:12px;aspect-ratio:900/1125;max-width:100%;display:grid;place-items:center;overflow:hidden;padding:12px}
.caja{width:min(84%, 320px);aspect-ratio:1;background:#fff;border-radius:10px;padding:8px;box-shadow:0 0 0 6px #EFE6D6, 0 18px 30px -18px rgba(70,74,50,.5);
  display:grid;gap:6px;grid-template-columns:1fr 1.2fr 1fr;grid-template-rows:1fr 1fr .8fr;grid-template-areas:"prueba chupete dientes" "prueba manilla mechon" "otros otros otros"}
.comp{border:0;border-radius:6px;background:var(--papel);display:grid;place-items:center;text-align:center;font-size:.64rem;font-weight:700;color:var(--salvia-oscuro);padding:4px;line-height:1.2;cursor:pointer;transition:background .2s, transform .2s}
.comp:hover{transform:scale(1.04)}
.comp[aria-pressed="true"]{background:var(--durazno);color:var(--tinta)}
.comp[data-k="prueba"]{grid-area:prueba}.comp[data-k="chupete"]{grid-area:chupete}.comp[data-k="dientes"]{grid-area:dientes}
.comp[data-k="manilla"]{grid-area:manilla}.comp[data-k="mechon"]{grid-area:mechon}.comp[data-k="otros"]{grid-area:otros;font-family:var(--font-display);font-style:italic;font-weight:400;font-size:.95rem}
.comps{display:flex;flex-wrap:wrap;gap:8px}
.comps .comp{font-size:.82rem;padding:.4rem .8rem;border-radius:999px;border:1.5px solid var(--linea);background:#fff;font-weight:700;color:var(--salvia-oscuro);cursor:pointer;display:inline-block}
.comps .comp[aria-pressed="true"]{background:#E9B9B5;border-color:#E9B9B5;color:var(--tinta)}
.comp-info{align-self:start;min-height:3.3em;font-size:.92rem;color:var(--tinta-suave);background:var(--papel);border-radius:10px;padding:10px 14px}
.comp-info b{color:var(--salvia-oscuro)}
.conjunto{margin-top:24px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;padding:20px 26px;border-radius:var(--radio);background:var(--salvia-oscuro);color:var(--marfil)}
.conjunto strong{font-family:var(--font-display);font-weight:400;font-size:1.25rem}

/* Franja parallax */
.banda{background:var(--salvia-oscuro);color:var(--marfil);padding-block:clamp(96px, 14vw, 170px);text-align:center}
.banda .wrap{position:relative;z-index:1;display:grid;gap:18px;justify-items:center}
.banda h2{color:var(--marfil);font-size:clamp(2.1rem, 5vw, 3.6rem)}
.banda h2 em{color:var(--durazno)}
.banda p{max-width:52ch;opacity:.85;font-size:1.08rem}

/* Cómo funciona */
.pasos{--p:0;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5, minmax(0,1fr));gap:20px;counter-reset:paso;position:relative}
.pasos::before,.pasos::after{content:"";position:absolute;left:24px;right:calc(20% - 24px);top:23px;height:2px;border-radius:2px}
.pasos::before{background:var(--linea)}
.pasos::after{background:var(--durazno);transform-origin:0 50%;transform:scaleX(var(--p))}
.paso{display:grid;gap:10px;align-content:start;counter-increment:paso;position:relative;z-index:1;min-width:0}
.paso::before{content:counter(paso);width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--marfil);border:1.5px solid var(--salvia-claro);font-family:var(--font-display);font-size:1.3rem;color:var(--salvia-oscuro);transition:background .3s, border-color .3s, transform .3s}
.paso.activo::before{background:var(--durazno);border-color:var(--durazno);transform:scale(1.08)}
.paso h3{font-size:1.15rem}
.paso p{font-size:.95rem;color:var(--tinta-suave)}
@media (max-width:900px){
  .pasos{grid-template-columns:1fr;gap:26px}
  .pasos::before,.pasos::after{left:23px;right:auto;top:24px;bottom:24px;width:2px;height:auto}
  .pasos::after{transform-origin:50% 0;transform:scaleY(var(--p))}
  .paso{grid-template-columns:48px 1fr;column-gap:18px}.paso::before{grid-row:span 2}}

/* Historias */
.hist-grid{display:grid;grid-template-columns:repeat(4, minmax(0,1fr));gap:18px}
@media (max-width:900px){.hist-grid{grid-template-columns:repeat(2, minmax(0,1fr))}}
@media (max-width:520px){.hist-grid{grid-template-columns:1fr}}
.hist{padding:24px;border-radius:var(--radio);background:var(--marfil);display:grid;gap:10px;align-content:start;transition:transform .3s, box-shadow .3s}
.hist:hover{transform:translateY(-6px);box-shadow:0 22px 36px -28px rgba(70,74,50,.6)}
.hist svg{width:34px;height:34px;transition:transform .4s}
.hist:hover svg{transform:rotate(-12deg) scale(1.1)}
.hist p{font-size:.95rem;color:var(--tinta-suave)}

/* Dos columnas estándar: cabecera a la izquierda, contenido a la derecha */
.dos{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(28px, 6vw, 80px);align-items:start}
.dos .sec-head{margin-bottom:0}
@media (max-width:860px){.dos{grid-template-columns:1fr}}

/* Nuestra historia */
.origen-foto{aspect-ratio:4/5;max-width:100%;border-radius:200px 200px var(--radio) var(--radio);background:linear-gradient(170deg, var(--durazno-suave), var(--papel));display:grid;place-items:end center;padding:28px;color:var(--tinta-suave);font-size:.85rem;position:relative;overflow:hidden}
.origen-foto .capa{left:50%;top:20%;width:44%;margin-left:-22%}
.origen-text{display:grid;gap:18px;min-width:0}
.origen-text blockquote{margin:0;font-family:var(--font-display);font-style:italic;font-variation-settings:"SOFT" 100;font-size:clamp(1.3rem, 2.4vw, 1.6rem);line-height:1.4;color:var(--salvia-oscuro);padding-left:20px;border-left:3px solid var(--durazno)}
.firma{font-weight:700;color:var(--salvia-oscuro)}
.firma span{display:block;font-weight:400;font-size:.9rem;color:var(--tinta-suave)}

/* Preguntas */
.faq-list{display:grid;gap:12px;min-width:0}
details{background:var(--marfil);border-radius:14px;border:1px solid var(--linea);transition:border-color .2s}
details[open]{border-color:var(--salvia-claro)}
summary{list-style:none;cursor:pointer;padding:18px 22px;font-weight:700;color:var(--salvia-oscuro);display:flex;justify-content:space-between;gap:16px;align-items:center}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font-family:var(--font-display);font-size:1.5rem;line-height:1;color:var(--salvia-claro);transition:transform .25s}
details[open] summary::after{transform:rotate(45deg)}
details p{padding:0 22px 20px;color:var(--tinta-suave)}

/* Formulario */
.pedido-info{display:grid;gap:18px;min-width:0}
.cupos{display:flex;gap:14px;align-items:center;padding:16px 18px;border-radius:14px;background:var(--durazno-suave);font-size:.95rem}
.cupos b{font-family:var(--font-display);font-weight:500;font-size:1.8rem;color:var(--salvia-oscuro);line-height:1}
form{background:#fff;border-radius:var(--radio);padding:clamp(22px, 3.5vw, 34px);border:1px solid var(--linea);display:grid;gap:16px;grid-template-columns:1fr 1fr;min-width:0}
.campo{display:grid;gap:6px;min-width:0}
.campo.full{grid-column:1 / -1}
@media (max-width:520px){form{grid-template-columns:1fr}}
label{font-size:.85rem;font-weight:700;color:var(--salvia-oscuro)}
form input,form select,form textarea{background:var(--marfil)}
textarea{min-height:110px;resize:vertical}
.form-foot{grid-column:1 / -1;display:grid;gap:10px}
.form-foot small{color:var(--tinta-suave);font-size:.82rem;text-align:center}
.aviso{grid-column:1 / -1;font-size:.9rem;background:var(--salvia-velo);color:var(--salvia-oscuro);border-radius:10px;padding:10px 14px}
.listo{grid-column:1 / -1;background:var(--salvia-velo);border-radius:12px;padding:18px;display:grid;gap:12px}
.listo pre{margin:0;white-space:pre-wrap;font:inherit;font-size:.9rem;color:var(--tinta-suave);background:var(--marfil);padding:12px;border-radius:8px}
.listo .acciones{display:flex;flex-wrap:wrap;gap:10px}

/* Pie */
.pie{background:var(--salvia-oscuro);color:var(--marfil);padding-block:56px 36px}
.pie .wrap{display:grid;gap:32px}
.pie-top{display:flex;flex-wrap:wrap;justify-content:space-between;gap:28px;align-items:flex-start}
.pie img{height:54px;width:auto}
.pie-cols{display:flex;flex-wrap:wrap;gap:40px}
.pie-cols div{display:grid;gap:6px;font-size:.95rem}
.pie-cols span{font-size:.74rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;opacity:.65}
.pie a{text-decoration:none}
.pie a:hover{text-decoration:underline}
.pie-bottom{border-top:1px solid rgba(254,251,244,.2);padding-top:20px;font-size:.85rem;opacity:.75;display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px}

@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.beat{stroke-dashoffset:0}.foto:nth-child(1),.slide:nth-child(1){opacity:1}}
