/* Ficha de venta por producto — molde aprobado (Web-Alma-PHN/producto/colageno.html).
   Lo escribe automatizacion/genera-ficha-producto.py: no se edita a mano. */
:root{--verde:#70B62F;--verde-boton:#70B62F;--verde-osc:#4a8a1e;--tinta:#2b2b2b;--gris:#6b6b6b;--linea:#e6e6e6;--tinte:#f4faec;--wa:#157a3f}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Quicksand',system-ui,sans-serif;background:#eef1ec;color:var(--tinta);display:flex;justify-content:center;padding:24px 12px;-webkit-font-smoothing:antialiased}
@media (max-width:520px){body{padding:0;background:#fff}}
.marco{width:100%;max-width:480px;background:#fff;border-radius:22px;overflow:clip;box-shadow:0 18px 50px rgba(0,0,0,.12)}
@media (max-width:520px){.marco{border-radius:0;box-shadow:none}}
img{display:block;width:100%;height:auto}
a{color:var(--verde-osc)}
.anuncio{background:var(--verde-boton);color:#1f2a1c;font-size:12px;font-weight:700;letter-spacing:.04em;text-align:center;padding:9px 12px;text-transform:uppercase}
.header{position:sticky;top:0;z-index:40;background:#fff;display:grid;grid-template-columns:48px 1fr 48px;align-items:center;padding:4px 8px;border-bottom:1px solid var(--linea)}
.header .logo{justify-self:center;display:flex}
.header .logo img{height:40px;width:auto;max-width:min(200px,52vw);object-fit:contain}
.header img{width:auto;height:46px;max-width:170px;object-fit:contain}
.btn-ic{position:relative;width:44px;height:44px;display:grid;place-items:center;background:none;border:0;border-radius:50%;color:var(--verde-osc);cursor:pointer;text-decoration:none;-webkit-tap-highlight-color:transparent}
.btn-ic:active{background:var(--tinte)}
.btn-ic svg{width:24px;height:24px}
.bolsa{background:var(--tinte);justify-self:end}
.insignia{position:absolute;top:-3px;right:-3px;min-width:19px;height:19px;padding:0 5px;border-radius:10px;background:var(--verde-boton);color:#1f2a1c;border:2px solid #fff;font-size:11px;font-weight:700;display:grid;place-items:center;line-height:1}
.insignia[hidden]{display:none}
.bolsa.salta{animation:salta .5s ease}
@keyframes salta{30%{transform:scale(1.18) rotate(-6deg)}60%{transform:scale(.95) rotate(4deg)}}
/* ── Menú pro: buscador, promo, accesos con foto, enlaces y pie ── */
.cajon-buscar{display:flex;align-items:center;gap:8px;margin:2px 0 10px;background:#f3f6ef;border:1.5px solid var(--linea);border-radius:999px;padding:0 6px 0 14px}
.cajon-buscar input{flex:1;min-width:0;border:0;background:none;padding:12px 0;font:500 14.5px 'Quicksand',system-ui,sans-serif;color:var(--tinta);outline:none}
.cajon-buscar button{width:36px;height:36px;border:0;border-radius:50%;background:var(--verde-boton);color:#1f2a1c;display:grid;place-items:center;cursor:pointer}
.cajon-buscar button svg{width:18px;height:18px}
.cajon-promo{display:flex;align-items:center;gap:10px;margin-bottom:12px;padding:10px 12px;border-radius:12px;background:linear-gradient(135deg,#4a8a1e,#3f7a17);color:#fff;font-size:12.5px;font-weight:700;line-height:1.3}
.cajon-promo svg{width:22px;height:22px;flex:0 0 22px}
.cajon-tiles{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}
.cajon-tiles a{position:relative;display:block;aspect-ratio:1/1.05;border-radius:16px;overflow:hidden;background:#f4faec;border:1px solid #dcebc8;text-decoration:none;color:var(--tinta)}
.cajon-tiles img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:8px 8px 34px}
.cajon-tiles span{position:absolute;left:0;right:0;bottom:0;padding:8px 10px;font-size:13.5px;font-weight:800;background:linear-gradient(transparent,rgba(244,250,236,.96) 40%)}
.cajon-sep{margin:6px 6px 2px;font-size:11px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--gris)}
.cajon-pie{margin-top:auto;display:grid;gap:8px;padding-top:12px}
.cajon-pie .carro{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px;border-radius:12px;border:1.5px solid var(--verde);color:var(--verde-osc);font-weight:700;text-decoration:none}
.cajon-pie .carro svg{width:20px;height:20px}
.cajon-pie .wa{margin-top:0}
.fondo-cajon{position:fixed;inset:0;background:rgba(20,30,15,.45);opacity:0;pointer-events:none;transition:opacity .22s;z-index:90}
.cajon{position:fixed;top:0;bottom:0;left:0;width:min(84vw,320px);background:#fff;z-index:100;transform:translateX(-102%);transition:transform .26s cubic-bezier(.3,.8,.3,1);padding:10px 14px calc(22px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:4px;box-shadow:10px 0 34px rgba(0,0,0,.2);overflow:auto}
.cajon-cab{display:flex;align-items:center;justify-content:space-between;padding:4px 4px 10px;margin-bottom:6px;border-bottom:1px solid var(--linea);font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gris)}
.cajon .enlace{display:flex;align-items:center;gap:14px;padding:13px 10px;border-radius:12px;font-size:16px;font-weight:600;text-decoration:none;color:var(--tinta)}
.cajon .enlace:active,.cajon .enlace:hover{background:var(--tinte);color:var(--verde-osc)}
.cajon .enlace .ic{width:22px;height:22px;flex:0 0 22px;color:var(--verde)}
.cajon .wa{margin-top:auto;display:flex;align-items:center;justify-content:center;gap:9px;padding:14px;border-radius:12px;background:#25d366;color:#fff;font-weight:700;text-decoration:none}
.cajon .wa svg{width:20px;height:20px}
body.menu-abierto{overflow:hidden}
body.menu-abierto .cajon{transform:none}
body.menu-abierto .fondo-cajon{opacity:1;pointer-events:auto}
.migas a{display:inline-block;padding:10px 2px}
.migas{display:flex;flex-wrap:wrap;align-items:center;gap:4px;padding:0 18px;font-size:12px;color:var(--gris)}
.migas a{color:var(--gris);text-decoration:none}
.galeria .principal{padding:0;position:relative}
.pista-g{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.pista-g::-webkit-scrollbar{display:none}
.pista-g img{flex:0 0 100%;width:100%;scroll-snap-align:center;object-fit:contain;height:min(58vh,480px);background:#f4f4f2}
.pista-g:focus-visible{outline:3px solid var(--verde-osc);outline-offset:-3px}
.galeria .minis{display:none}
.puntos-g{display:flex;justify-content:center;gap:6px;padding:9px 0 2px}
.puntos-g i{width:7px;height:7px;border-radius:50%;background:#d5dccd;transition:width .2s,background .2s}
.puntos-g i.on{width:20px;border-radius:4px;background:var(--verde)}
.galeria.vertical .minis{gap:8px;padding:8px 16px 10px}
.galeria.vertical .minis img{width:56px;height:75px;object-fit:cover;padding:0;border-radius:8px}
.minis{display:flex;gap:8px;padding:0 16px 14px;overflow-x:auto}
.minis img{width:62px;height:62px;object-fit:cover;flex:0 0 auto;border:1.5px solid var(--linea);border-radius:8px;padding:3px;background:#fff;cursor:pointer}
.minis img.activa{border-color:var(--verde)}
.compra{display:block;padding:0 18px 16px}
.urgencia{display:flex;align-items:flex-start;gap:7px;color:var(--verde-osc);font-size:13.5px;font-weight:600;margin-bottom:8px;line-height:1.45}
.urgencia svg{width:16px;height:16px;flex:0 0 16px}
h1{font-size:21px;line-height:1.25;font-weight:700;margin-bottom:4px}
.marca-linea{font-size:12.5px;color:var(--gris);margin-bottom:8px}
.precio{display:flex;align-items:baseline;gap:7px;margin-bottom:4px}
.precio .ahora{font-size:28px;font-weight:700}
.precio .moneda{font-size:13px;font-weight:600;color:var(--gris)}
.precio-nota{font-size:12.5px;color:var(--gris);margin-bottom:11px}
.puntos{list-style:none;display:grid;gap:8px;margin-bottom:17px}
.puntos li{display:flex;align-items:flex-start;gap:10px;font-size:14.5px;font-weight:500;line-height:1.45}
.puntos svg{width:17px;height:17px;flex:0 0 17px;margin-top:2px;color:var(--verde)}
.ben-ic{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:10px}
.ben-ic li{display:flex;align-items:center;gap:9px;background:var(--tinte);border:1px solid #e3efd3;border-radius:12px;padding:7px 8px;font-size:12px;font-weight:600;line-height:1.3}
.ben-ic .chip{flex:0 0 28px;width:28px;height:28px;border-radius:50%;background:#fff;color:var(--verde-osc);display:grid;place-items:center;box-shadow:0 1px 4px rgba(112,182,47,.25)}
.ben-ic .chip svg{width:15px;height:15px}
.compra-fila{display:flex;gap:10px;align-items:stretch}
.compra-fila .btn{flex:1}
.cantidad{display:flex;align-items:center;border:1.5px solid var(--linea);border-radius:10px;overflow:hidden;flex:0 0 auto}
.cantidad button{width:46px;min-height:48px;border:0;background:#fff;font-size:20px;font-weight:700;color:var(--verde-osc);cursor:pointer}
.cantidad button:active{background:var(--tinte)}
.cantidad output{min-width:26px;text-align:center;font-weight:700;font-size:16px}
.envio-mini{margin:9px 0 2px;font-size:12.5px;font-weight:600;color:var(--gris);text-align:center}
.envio-mini.ok{color:var(--verde-osc)}
.promo-envio .ic-promo{width:30px;height:30px;flex:0 0 30px;color:var(--verde-osc)}
.enlace-dist{display:inline-block;margin-top:8px;font-weight:700}
.btn{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;border:0;cursor:pointer;background:var(--verde-boton);color:#1f2a1c;font-family:inherit;font-size:16.5px;font-weight:700;padding:16px;border-radius:10px;box-shadow:0 6px 16px rgba(63,122,23,.32);text-decoration:none}
.btn svg{width:20px;height:20px}
.btn:active{transform:translateY(1px)}
.btn-wa{margin-top:10px;background:#fff;color:var(--wa);border:2px solid var(--wa);box-shadow:none}
.btn-nota{text-align:center;font-size:12px;color:var(--gris);margin:9px 0 6px}
.videos{padding:16px 0 4px}
.videos h2{display:flex;align-items:center;gap:9px;font-size:19px;padding:0 18px;margin-bottom:10px}
.videos .ic-tit{width:22px;height:22px;color:var(--verde)}
.vid-lista{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;padding:2px 18px 10px;scrollbar-width:none}
.vid-lista::-webkit-scrollbar{display:none}
.vid,.vid-frame{flex:0 0 84%;scroll-snap-align:center;aspect-ratio:16/10;border-radius:14px;overflow:hidden;position:relative;border:0;padding:0;background:#1f2a1c;cursor:pointer}
.vid img{width:100%;height:100%;object-fit:cover;opacity:.85}
.vid-play{position:absolute;left:50%;top:44%;width:58px;height:58px;margin:-29px 0 0 -29px;border-radius:50%;background:rgba(255,255,255,.95);display:grid;place-items:center;color:var(--verde-osc);box-shadow:0 4px 18px rgba(0,0,0,.3)}
.vid-play svg{width:24px;height:24px;fill:currentColor;margin-left:3px}
.vid-t{position:absolute;left:0;right:0;bottom:0;padding:22px 12px 10px;background:linear-gradient(transparent,rgba(0,0,0,.75));color:#fff;text-align:left;font-size:13px;font-weight:700;line-height:1.3}
.vid-t small{display:block;font-weight:500;opacity:.8;margin-top:2px}
.prueba{padding:16px 0 4px}
.prueba h2{display:flex;align-items:center;gap:9px;font-size:19px;padding:0 18px;margin-bottom:4px}
.prueba .ic-tit{width:22px;height:22px;color:var(--verde)}
.prueba .sub{font-size:13px;color:var(--gris);padding:0 18px;margin-bottom:12px}
.carrusel{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;padding:2px 18px 10px;scrollbar-width:none}
.carrusel::-webkit-scrollbar{display:none}
.tira{flex:0 0 auto;scroll-snap-align:center;border:0;padding:0;background:none;cursor:zoom-in}
.tira img{height:270px;width:auto;border-radius:12px;border:1px solid var(--linea)}
.opiniones{padding:16px 0 6px;background:var(--tinte)}
.opiniones h2{display:flex;align-items:center;gap:9px;font-size:19px;padding:0 18px;margin-bottom:10px}
.opiniones .ic-tit{width:22px;height:22px;color:var(--verde)}
.op-lista{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;padding:2px 18px 10px;scrollbar-width:none}
.op-lista::-webkit-scrollbar{display:none}
.op{flex:0 0 82%;scroll-snap-align:center;background:#fff;border:1px solid #dcebc8;border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:8px}
.op .estrellas{display:flex;gap:2px;color:#f5a623}
.op .estrellas svg{width:15px;height:15px;fill:currentColor}
.op blockquote{font-size:13.5px;line-height:1.55;color:#3d3d3d;flex:1}
.op figcaption{font-size:13px;font-weight:700;color:var(--verde-osc)}
.opiniones .nota{font-size:11px;color:var(--gris);padding:0 18px;line-height:1.5}
.vistazo{padding:16px 18px 8px}
.vistazo h2{font-size:19px;margin-bottom:10px}
.vistazo h3{font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--gris);margin:14px 0 8px}
.datos{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.dato{background:linear-gradient(160deg,#f4faec,#e6f3d2);border:1px solid #d3e8bb;border-radius:14px;padding:12px;display:flex;flex-direction:column;gap:3px}
.dato svg{width:24px;height:24px;color:var(--verde-osc);margin-bottom:3px}
.dato small{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--gris)}
.dato b{font-size:13.5px;line-height:1.35}
.ingr{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.ingr li{background:#fff;border:1px solid var(--linea);border-radius:12px;padding:10px 6px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:2px}
.ingr svg{width:22px;height:22px;color:var(--verde);margin-bottom:3px}
.ingr img{width:58px;height:58px;border-radius:50%;object-fit:cover;margin-bottom:5px;border:2px solid #e3efd3}
.cred{margin-top:10px;font-size:11px;color:var(--gris);line-height:1.5}
.cred summary{cursor:pointer;font-weight:600}
.cred a{color:var(--gris)}
.ingr b{font-size:12px;line-height:1.25}
.ingr small{font-size:10.5px;color:var(--gris)}
.prueba .nota{font-size:11px;color:var(--gris);padding:0 18px;line-height:1.5}
.visor{position:fixed;inset:0;z-index:120;background:rgba(0,0,0,.88);display:grid;place-items:center;padding:14px}
.visor[hidden]{display:none}
.visor img{max-width:100%;max-height:92vh;width:auto;height:auto;border-radius:10px}
.visor-x{position:absolute;top:12px;right:12px;width:44px;height:44px;border-radius:50%;border:0;background:#fff;display:grid;place-items:center;cursor:pointer}
.visor-x svg{width:22px;height:22px}
.fija{position:fixed;left:0;right:0;bottom:0;z-index:50;display:flex;justify-content:center;padding:0 0 env(safe-area-inset-bottom);pointer-events:none}
.fija[hidden]{display:none}
.fija-in{pointer-events:auto;width:100%;max-width:480px;background:#fff;border-top:1px solid var(--linea);box-shadow:0 -6px 20px rgba(0,0,0,.1);display:flex;align-items:center;gap:12px;padding:9px 14px}
.fija-precio{flex:1;min-width:0}
.fija-precio b{display:block;font-size:18px}
.fija-precio small{display:block;font-size:11.5px;color:var(--gris);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fija .btn{width:auto;flex:0 0 auto;padding:13px 22px;font-size:15px}
.aviso{position:fixed;left:50%;bottom:78px;transform:translate(-50%,24px);opacity:0;pointer-events:none;background:#1f2a1c;color:#fff;padding:12px 18px;border-radius:999px;font-size:13.5px;font-weight:600;z-index:130;transition:opacity .2s,transform .2s;display:flex;gap:12px;white-space:nowrap}
.aviso.ver{opacity:1;transform:translate(-50%,0);pointer-events:auto}
.aviso a{color:#b5e36f;text-decoration:none}
details.fila{border:1px solid var(--linea);border-radius:14px;margin-bottom:10px;background:#fff;overflow:hidden;transition:border-color .2s,box-shadow .2s,background .2s}
details.fila[open]{border-color:#cfe5b5;background:#fbfdf8;box-shadow:0 4px 14px rgba(112,182,47,.10)}
details.fila summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:12px;min-height:50px;padding:9px 14px;font-size:14.5px;font-weight:600;line-height:1.3;-webkit-tap-highlight-color:transparent}
details.fila summary::-webkit-details-marker{display:none}
details.fila summary:focus-visible{outline:2px solid var(--verde);outline-offset:-2px;border-radius:14px}
details.fila .ic{box-sizing:content-box;width:19px;height:19px;flex:0 0 19px;padding:7px;border-radius:50%;background:var(--tinte);color:var(--verde-osc)}
details.fila .flecha{position:relative;margin-left:auto;flex:0 0 28px;width:28px;height:28px;border-radius:50%;background:#f1f3ee;transition:background .2s}
details.fila .flecha::before,details.fila .flecha::after{content:"";position:absolute;left:50%;top:50%;width:11px;height:2px;margin:-1px 0 0 -5.5px;border-radius:2px;background:var(--gris);transition:transform .22s ease,opacity .22s}
details.fila .flecha::after{transform:rotate(90deg)}
details.fila[open] .flecha{background:var(--verde)}
details.fila[open] .flecha::before,details.fila[open] .flecha::after{background:#fff}
details.fila[open] .flecha::after{transform:rotate(0);opacity:0}
details.fila .cuerpo{padding:0 16px 16px;font-size:14px;line-height:1.65;color:#444;animation:abre .24s ease}
.compra details.fila .cuerpo{padding-left:62px}
@keyframes abre{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){details.fila .cuerpo{animation:none}}
.faq details.fila,.ficha details.fila{margin-bottom:9px}
.ticker{background:var(--verde-boton);color:#1f2a1c;overflow:hidden;padding:11px 0}
.ticker .pista{display:flex;width:max-content;animation:corre 26s linear infinite}
.ticker .pista>div{display:flex}
.ticker .item{display:inline-flex;align-items:center;gap:14px;padding:0 18px;font-size:12.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap}
.ticker .punto{width:5px;height:5px;border-radius:50%;background:#fff;opacity:.6}
@keyframes corre{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.ticker .pista{animation:none}}
.pas{padding:16px 18px 2px}
.pas h2{display:flex;align-items:center;gap:9px;font-size:19px;line-height:1.3;margin-bottom:8px}
.pas .ic-tit{width:22px;height:22px;flex:0 0 22px;color:var(--verde)}
.pas p{font-size:14.5px;line-height:1.58;color:#3d3d3d;margin-bottom:12px}
.pas .foto-bloque{border-radius:12px;border:1px solid #e3efd3;background:var(--tinte);margin-bottom:8px}
.ficha,.faq{padding:16px 18px}
.ficha h2,.faq h2{font-size:19px;margin-bottom:4px}
.ficha .sub{font-size:13px;color:var(--gris);margin-bottom:12px}
.faq h2{margin-bottom:8px}
.beneficios{list-style:none;display:grid;gap:9px;margin-bottom:20px}
.beneficios li{display:flex;gap:10px;align-items:flex-start;font-size:14.5px;line-height:1.5}
.beneficios svg{width:17px;height:17px;flex:0 0 17px;margin-top:2px;color:var(--verde)}
.comparativa{padding:16px 18px;background:var(--tinte)}
.comparativa h2{font-size:19px;text-align:center;margin-bottom:16px}
.comparativa table{width:100%;border-collapse:collapse;table-layout:fixed}
.comparativa th,.comparativa td{padding:11px 5px;text-align:center;font-size:12.5px;border-bottom:1px solid #dfe9d2}
.comparativa thead th img{width:84px;height:84px;object-fit:contain;margin:0 auto 6px;border-radius:12px;background:#fff}
.comparativa thead th span{display:block}
.comparativa thead th.otros{color:var(--gris)}
.comparativa thead th.otros img{opacity:.92}
.comparativa th:first-child,.comparativa td:first-child{text-align:left;width:52%;font-weight:600}
.comparativa thead th{font-size:13px;border-bottom:2px solid #cfe0bb}
.comparativa .yo{color:var(--verde-osc);font-weight:700}
.comparativa svg{width:19px;height:19px;margin:0 auto}
.comparativa .si{color:var(--verde)}
.comparativa .no{color:#c2c2c2}
.comparativa .nota{font-size:11px;color:var(--gris);text-align:center;margin-top:13px;line-height:1.5}
.relacionados{padding:16px 18px}
.relacionados h2{font-size:19px;margin-bottom:14px}
.rejilla{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.rejilla a{display:flex;flex-direction:column;gap:4px;text-decoration:none;color:var(--tinta);border:1px solid var(--linea);border-radius:12px;padding:10px}
.rejilla img{border-radius:8px;aspect-ratio:1;object-fit:cover}
.r-nombre{font-size:13.5px;font-weight:600;line-height:1.3}
.r-precio{font-size:13px;color:var(--verde-osc);font-weight:700}
.te-atiende{padding:22px 18px;border-top:1px solid var(--linea)}
.te-atiende h2{font-size:17px;margin-bottom:6px}
.te-atiende a{display:inline-block;padding:10px 0}
.btn:focus-visible,.cantidad button:focus-visible,.vid:focus-visible,.tira:focus-visible,.btn-ic:focus-visible{outline:3px solid #1f2a1c;outline-offset:2px}
#phn-leyenda-cofepris{display:none!important}/* la ficha ya lleva su propio pie legal; el tracker la inyectaba como hermana del marco y ensanchaba la pagina */
/* ── Cuenta (inicio de sesión con Google; solo se ve si hay ID de cliente configurado) ── */.cajon-cuenta{margin:0 0 12px}.cajon-cuenta[hidden]{display:none}.cuenta-google{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:48px;border:1.5px solid #c9d3bf;border-radius:12px;background:#fff;color:#1f2a1c;font:600 14.5px 'Quicksand',system-ui,sans-serif;cursor:pointer}.cuenta-google:focus-visible,.cuenta-ok button:focus-visible{outline:3px solid #1f2a1c;outline-offset:2px}.cuenta-ok{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;background:#f4faec;border:1px solid #dcebc8}.cuenta-ok img{border-radius:50%}.cuenta-ok b{display:block;font-size:14px}.cuenta-ok small{color:#5b665a;font-size:11.5px}.cuenta-ok button{margin-left:auto;border:0;background:none;color:#3f7a17;font:700 13px 'Quicksand',system-ui,sans-serif;cursor:pointer;min-height:44px;padding:0 6px}
.legal a,.legal button{color:var(--gris);margin:0 6px}.legal button{background:none;border:0;font:inherit;text-decoration:underline;cursor:pointer;min-height:44px}
.btn-ver{background:#fff;color:var(--verde-osc);border:2px solid var(--verde-boton);box-shadow:none}
.btn-ver[hidden]{display:none}
.te-atiende p{font-size:14px;line-height:1.55;color:#444;margin-bottom:6px}
.promo{display:flex;gap:10px;align-items:center;background:var(--tinte);border:1px solid #dcebc8;border-radius:12px;padding:8px 10px;margin-bottom:8px}
.promo-fotos{position:relative;display:flex;align-items:center;flex:0 0 108px}
.promo-fotos img{width:46px;height:46px;object-fit:contain;background:#fff;border-radius:8px}
.promo-fotos .mas{font-weight:700;color:var(--verde-osc);padding:0 4px}
.promo-fotos .sello{position:absolute;right:-4px;top:-8px;background:var(--verde-boton);color:#1f2a1c;font-size:10px;font-weight:700;border-radius:20px;padding:2px 7px;text-transform:uppercase}
.promo-texto strong{display:block;font-size:14px}
.promo-texto small{display:block;font-size:11.5px;color:var(--gris);line-height:1.4;margin-top:3px}
.franja{background:var(--verde-boton);color:#1f2a1c;text-align:center;padding:15px;font-size:14px;font-weight:700;font-style:italic}
.legal{display:block;padding:20px 18px 26px;background:#f7f7f5;font-size:11.5px;line-height:1.6;color:var(--gris);text-align:center}
/* ── Escritorio (>=1000 px): galeria fija a la izquierda y compra a la derecha. El celular no cambia. ── */
.cima{display:contents}
.wa-flota{display:none}
@media (min-width:1000px){
body{padding:28px 24px}
.marco{max-width:1180px}
.cima{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:44px;align-items:start}
.cima>.galeria{position:sticky;top:76px}
.cima>.compra{padding:12px 36px 28px 0}
.galeria .principal{border-radius:18px;overflow:hidden;margin:8px 0 0 24px}
.pista-g img{height:min(72vh,640px)}
.minis,.galeria.vertical .minis{padding:12px 0 18px 24px;gap:10px}
.minis img{width:72px;height:72px}
.galeria.vertical .minis img{width:64px;height:84px}
.header{padding:6px 24px}
.migas{padding:0 24px}
.compra h1{font-size:30px;line-height:1.2}
.compra .precio .ahora{font-size:34px}
.pas,.videos,.prueba,.opiniones,.vistazo,.ficha,.faq,.comparativa,.relacionados,.te-atiende{width:100%;max-width:880px;margin-left:auto;margin-right:auto;padding-left:24px;padding-right:24px}
.foto-bloque{max-height:520px;object-fit:contain}
.rejilla{grid-template-columns:repeat(4,1fr)}
.ingr{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.vid-lista{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.carrusel{padding-left:0;padding-right:0}
.fija{display:none!important}
.wa-flota{display:flex;position:fixed;right:24px;bottom:24px;width:56px;height:56px;border-radius:50%;background:#25d366;align-items:center;justify-content:center;box-shadow:0 4px 16px rgba(37,211,102,.5);z-index:60;transition:transform .15s}
.wa-flota:hover{transform:scale(1.08)}
.wa-flota svg{width:30px;height:30px;stroke:#fff;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
}
