:root{
  --crema:#FBF4EC; --arena:#F1DFD0; --tinta:#3B2A22; --texto:#5E4B40; --suave:#6B5A50;
  --terra:#A8482A; --terra-osc:#7E3319; --salvia:#6F7F5E; --salvia-claro:#E6EBDD; --blanco:#fff;
  --serif:"DM Serif Display",Georgia,"Times New Roman",serif;
  --sans:"DM Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;font-family:var(--sans);color:var(--tinta);background:var(--crema);line-height:1.5;
  padding-bottom:env(safe-area-inset-bottom,0)}
img{max-width:100%;height:auto;display:block}
a{color:var(--terra)}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--salvia);outline-offset:3px;border-radius:6px}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.12;margin:0}
.wrap{max-width:1120px;margin:0 auto;padding:0 22px}

/* barra y header */
.oferta{background:var(--tinta);color:var(--crema);font-size:14px;font-weight:500;overflow:hidden;white-space:nowrap;padding:10px 0;padding-top:calc(10px + env(safe-area-inset-top,0))}
.cinta{display:inline-flex;animation:cinta 90s linear infinite}
.cinta span{padding:0 28px;position:relative}
.cinta span::after{content:"";position:absolute;right:-3px;top:50%;width:6px;height:6px;border-radius:50%;background:#E7B89E;transform:translateY(-50%)}
@keyframes cinta{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.cinta{animation:none}}
.header{border-bottom:1px solid #EAD7C6}
.header .wrap{display:flex;justify-content:center;align-items:center;height:62px}
.logo{font-family:var(--serif);font-weight:400;font-size:24px;letter-spacing:.3px;color:var(--terra);text-decoration:none}

/* botones */
.btn{display:inline-flex;justify-content:center;align-items:center;min-height:52px;padding:0 28px;border-radius:999px;
  background:var(--terra);color:#fff;font-weight:700;font-size:16px;text-decoration:none;border:0;cursor:pointer}
.btn:hover{background:var(--terra-osc)}
.btn.claro{background:var(--crema);color:var(--tinta)}
.btn.claro:hover{background:#fff}

/* hero */
.hero{padding:34px 0 30px}
.hero .wrap{display:grid;gap:26px}
.hero-sub{font-size:14px;font-weight:700;color:var(--salvia);margin:0 0 10px}
.hero h1{font-size:clamp(34px,6vw,58px)}
.hero p{font-size:17px;color:var(--texto);max-width:34em;margin:16px 0 22px}
.hero-foto{border-radius:22px;overflow:hidden;aspect-ratio:10/11;background:var(--arena)}
.hero-foto img{width:100%;height:100%;object-fit:cover}
@media(min-width:860px){
  .hero{padding:64px 0 56px}
  .hero .wrap{grid-template-columns:1.05fr .95fr;align-items:center;gap:56px}
}

/* beneficios */
.beneficios{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding-bottom:40px}
.benef{background:#fff;border-radius:14px;padding:16px}
.benef svg{width:24px;height:24px;stroke:var(--salvia)}
.benef b{display:block;font-size:15px;margin-top:8px}
.benef span{font-size:13.5px;color:var(--suave)}
@media(min-width:860px){.beneficios{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}}

/* secciones */
section{padding:44px 0}
.titulo{font-size:clamp(28px,4vw,40px);margin-bottom:10px}
.bajada{color:var(--texto);font-size:16px;max-width:38em;margin:0 0 26px}

/* productos */
.productos{display:grid;gap:20px}
@media(min-width:860px){.productos{grid-template-columns:repeat(3,minmax(0,1fr))}}
.prod{background:#fff;border-radius:20px;overflow:hidden;display:flex;flex-direction:column}
.prod img{aspect-ratio:45/32;object-fit:cover;width:100%}
.prod-cuerpo{padding:20px;display:flex;flex-direction:column;gap:10px;flex:1}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chip{font-size:12.5px;font-weight:700;padding:4px 11px;border-radius:999px;background:var(--arena);color:var(--terra-osc)}
.chip.v{background:var(--salvia-claro);color:#4F5C40}
.prod h3{font-size:24px}
.prod p{margin:0;font-size:15px;color:var(--texto);flex:1}
.precio{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:6px}
.precio s{display:block;font-size:13.5px;color:var(--suave)}
.precio strong{font-size:23px}

.pack{margin-top:22px;background:var(--tinta);color:var(--crema);border-radius:22px;padding:28px 24px;display:grid;gap:14px}
.pack small{color:#E7B89E;font-weight:700;font-size:14px}
.pack h3{font-size:28px}
.pack p{margin:0;color:#EADCCF}
.pack .monto{font-size:28px;font-weight:700}
.pack-antes{display:block;color:#E7B89E;font-size:15px}
.pack .monto > span{font-size:15px;font-weight:500;color:#E7B89E;margin-left:10px}
.pack .acciones .btn{margin-top:14px}
@media(min-width:860px){.pack{grid-template-columns:1.4fr 1fr;align-items:center;padding:36px 40px}.pack .acciones{justify-self:end;text-align:right}}

/* qué trae */
.trae{background:#fff}
.trae .wrap{display:grid;gap:28px}
.trae img{border-radius:18px}
.lista{display:grid;gap:14px;margin:0;padding:0;list-style:none}
.lista li{display:flex;gap:12px}
.lista svg{flex-shrink:0;width:22px;height:22px;stroke:var(--salvia);margin-top:2px}
.lista b{display:block}
.lista span{color:var(--suave);font-size:15px}
@media(min-width:860px){.trae .wrap{grid-template-columns:1.1fr 1fr;align-items:center;gap:56px}}

/* comparación */
.compara{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.col{border-radius:16px;padding:18px;display:grid;gap:10px;align-content:start;font-size:15px}
.col.gratis{background:#EFE6DC;color:var(--texto)}
.col.nuestro{background:#fff;border:2px solid var(--terra)}
.col h3{font-family:var(--sans);font-size:16px}
.col.nuestro h3{color:var(--terra)}
@media(min-width:860px){.compara{max-width:760px}}

/* pasos */
.pasos{list-style:none;margin:0;padding:0;display:grid;gap:16px;counter-reset:p}
.pasos li{display:flex;gap:14px;align-items:center;font-size:16px}
.pasos li::before{counter-increment:p;content:counter(p);width:40px;height:40px;flex-shrink:0;border-radius:50%;background:var(--terra);color:#fff;font-weight:700;display:flex;align-items:center;justify-content:center}
@media(min-width:860px){.pasos{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* faq */
.faq{display:grid;gap:10px;max-width:760px}
details{background:#fff;border-radius:14px;padding:0 18px}
summary{cursor:pointer;font-weight:700;padding:18px 28px 18px 0;list-style:none;position:relative}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";position:absolute;right:0;top:14px;font-size:22px;color:var(--terra)}
details[open] summary::after{content:"–"}
details p{margin:0 0 18px;color:var(--texto)}

/* cierre */
.cierre{background:var(--terra);color:#fff;border-radius:24px;padding:34px 24px;text-align:center;display:grid;gap:14px;justify-items:center}
.cierre h2{font-size:clamp(28px,4vw,38px)}
.cierre p{margin:0;color:#FBE9DF}
.cierre .btn{background:#fff;color:var(--terra)}
.cierre .btn:hover{background:var(--crema)}

footer{padding:40px 0 48px;text-align:center;font-size:14px;color:var(--suave)}
footer .logo{font-size:18px;display:inline-block;margin-bottom:8px}

/* ---------- páginas de producto ---------- */
.volver{display:inline-flex;align-items:center;gap:6px;font-size:15px;font-weight:500;text-decoration:none;color:var(--suave);padding:14px 0 0}
.volver:hover{color:var(--terra)}
.producto{padding:18px 0 34px}
.producto .wrap{display:grid;gap:26px}
@media(min-width:900px){.producto .wrap{grid-template-columns:1.1fr .9fr;gap:52px;align-items:start}.galeria{position:sticky;top:20px}}
.galeria-main{border-radius:20px;overflow:hidden;background:var(--arena);aspect-ratio:1/1}
.galeria-main img{width:100%;height:100%;object-fit:cover}
.miniaturas{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:8px;margin-top:10px}
.miniaturas button{padding:0;border:2px solid transparent;border-radius:12px;overflow:hidden;cursor:pointer;background:none;aspect-ratio:1/1}
.miniaturas button[aria-pressed="true"]{border-color:var(--terra)}
.miniaturas img{width:100%;height:100%;object-fit:cover}
.info h1{font-size:clamp(34px,5vw,48px);margin:10px 0 10px}
.info .desc{color:var(--texto);font-size:16.5px;margin:0 0 18px}
.info .precio-grande s{display:block;color:var(--suave);font-size:16px}
.info .precio-grande strong{font-size:34px}
.info .btn{width:100%;margin-top:14px}
.seguro{display:flex;gap:18px;flex-wrap:wrap;font-size:14px;color:var(--suave);margin-top:12px}
.seguro span{display:inline-flex;align-items:center;gap:6px}
.seguro svg{width:18px;height:18px;stroke:var(--salvia)}
.oferta-pack{margin-top:22px;border:2px solid var(--terra);border-radius:18px;padding:18px;background:#fff;display:grid;gap:12px}
.oferta-pack .fotos{display:flex}
.oferta-pack .fotos img{width:58px;height:58px;border-radius:50%;object-fit:cover;border:3px solid #fff;margin-left:-10px}
.oferta-pack .fotos img:first-child{margin-left:0}
.oferta-pack b{font-size:17px}
.oferta-pack p{margin:0;color:var(--texto);font-size:15px}
.oferta-pack .fila{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.oferta-pack .fila s{color:var(--suave);font-size:14px;display:block}
.oferta-pack .fila strong{font-size:24px}
.oferta-pack .btn{width:auto;margin:0}
.detalle{padding:34px 0;border-top:1px solid #EAD7C6}
.detalle h2{font-size:clamp(26px,3.5vw,34px);margin-bottom:16px}
.tabla-wrap{overflow-x:auto}
table{border-collapse:collapse;width:100%;min-width:460px;background:#fff;border-radius:14px;overflow:hidden;font-size:15px}
th,td{padding:12px 14px;text-align:left;border-bottom:1px solid #F1E4D8}
th{background:var(--arena);font-weight:700}
.dos-col{display:grid;gap:22px}
@media(min-width:860px){.dos-col{grid-template-columns:1fr 1fr;gap:40px}}
.dato{background:#fff;border-radius:14px;padding:18px}
.dato h3{font-family:var(--sans);font-size:17px;font-weight:700;margin-bottom:8px}
.dato ul{margin:0;padding-left:18px;color:var(--texto)}
.dato p{margin:0;color:var(--texto)}
.paginas{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.paginas img{border-radius:8px;box-shadow:0 6px 18px rgba(59,42,34,.15);background:#fff}
.otros{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.otros a{text-decoration:none;color:var(--tinta);background:#fff;border-radius:16px;overflow:hidden}
.otros img{aspect-ratio:1/1;object-fit:cover;width:100%}
.otros div{padding:12px 14px;font-family:var(--serif);font-size:19px}
.barra-compra{position:fixed;left:0;right:0;bottom:0;background:#fff;border-top:1px solid #EAD7C6;padding:10px 16px calc(10px + env(safe-area-inset-bottom,0));display:flex;align-items:center;justify-content:space-between;gap:12px;z-index:10}
.barra-compra strong{font-size:20px;display:block}
.barra-compra s{font-size:13px;color:var(--suave)}
.barra-compra .btn{min-height:48px}
body.con-barra{padding-bottom:80px}
@media(min-width:900px){.barra-compra{display:none}body.con-barra{padding-bottom:0}}
.prod a.ver{color:inherit;text-decoration:none}

/* ---------- selector de opciones ---------- */
.elegir{border:0;margin:6px 0 0;padding:0;display:grid;gap:12px}
.elegir legend{font-weight:700;font-size:15px;margin-bottom:10px;color:var(--suave)}
.opcion{position:relative;display:block;background:#fff;border:2px solid #E6D6C8;border-radius:16px;padding:16px 16px 16px 50px;cursor:pointer}
.opcion:has(input:checked){border-color:var(--terra);box-shadow:0 0 0 1px var(--terra)}
.opcion input{position:absolute;left:16px;top:20px;width:20px;height:20px;accent-color:var(--terra);margin:0}
.op-top{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.op-nombre{font-weight:700;font-size:17px}
.op-nombre small{display:block;font-weight:500;font-size:13.5px;color:var(--salvia)}
.op-precio{text-align:right;white-space:nowrap}
.op-precio strong{display:block;font-size:20px}
.op-precio s{font-size:13px;color:var(--suave)}
.insignia{position:absolute;top:-12px;right:14px;background:var(--salvia);color:#fff;font-size:12.5px;font-weight:700;padding:3px 11px;border-radius:999px}
.incluye{list-style:none;margin:14px 0 0 -34px;padding:0;border:1px solid #EFE2D6;border-radius:12px;overflow:hidden}
.incluye li{display:grid;grid-template-columns:44px 1fr auto;gap:12px;align-items:center;padding:10px 12px;font-size:14.5px}
.incluye li+li{border-top:1px solid #EFE2D6}
.incluye img{width:44px;height:44px;border-radius:8px;object-fit:cover}
.c-u{text-align:right;font-weight:700;font-size:14px}
.c-u s{display:block;font-weight:400;font-size:12px;color:var(--suave)}
.incluye li.regalo{background:var(--salvia-claro)}
.ic-regalo{width:44px;height:44px;border-radius:8px;background:var(--salvia);display:flex;align-items:center;justify-content:center}
.ic-regalo svg{width:24px;height:24px}
.regalo .c-u{color:#4F5C40}

.pack-fotos{list-style:none;margin:18px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:10px;max-width:520px}
.pack-fotos li{position:relative;text-align:center}
.pack-fotos a{color:inherit;text-decoration:none;display:block}
.pack-fotos img{width:100%;aspect-ratio:1;object-fit:cover;display:block;border-radius:14px;border:2px solid rgba(234,220,207,.18);background:#4a3a31}
.pack-fotos a:hover img,.pack-fotos a:focus-visible img{border-color:#EADCCF}
.pack-fotos span{display:block;margin-top:6px;font-size:12.5px;line-height:1.25;color:#EADCCF}
.pack-fotos .regalo img{border-color:#E7B89E}
.pack-fotos .regalo b{position:absolute;top:-9px;left:50%;transform:translateX(-50%) rotate(-4deg);background:#E7B89E;color:#3a2a22;font-size:11.5px;font-weight:700;padding:3px 9px;border-radius:99px;white-space:nowrap;box-shadow:0 2px 6px rgba(0,0,0,.25)}
@media(max-width:380px){.pack-fotos{gap:7px}.pack-fotos span{font-size:11.5px}}

/* comparador puesta / sola */
.comparar{position:relative;--x:78%;touch-action:pan-y;user-select:none;-webkit-user-select:none;cursor:ew-resize}
.comparar>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;-webkit-user-drag:none}
.comparar .capa{clip-path:inset(0 0 0 var(--x));background:#fff}
.comparar .manija{position:absolute;top:0;bottom:0;left:var(--x);width:3px;margin-left:-1.5px;background:#fff;box-shadow:0 0 8px rgba(0,0,0,.25);pointer-events:none}
.comparar .manija span{position:absolute;top:50%;left:50%;width:46px;height:46px;margin:-23px 0 0 -23px;border-radius:50%;background:#fff;box-shadow:0 3px 12px rgba(0,0,0,.25)}
.comparar .manija span::before,.comparar .manija span::after{content:"";position:absolute;top:50%;width:0;height:0;margin-top:-6px;border:6px solid transparent}
.comparar .manija span::before{left:8px;border-right:7px solid #A5472A}
.comparar .manija span::after{right:8px;border-left:7px solid #A5472A}
.comparar .rango{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.comparar .rango:focus-visible~.manija span{outline:3px solid #A5472A;outline-offset:3px}
.comparar .lado{position:absolute;top:12px;padding:4px 10px;border-radius:99px;font-size:12.5px;font-weight:700;background:rgba(255,255,255,.88);color:#3a2a22;pointer-events:none}
.comparar .lado-izq{left:12px}.comparar .lado-der{right:12px}
.comparar .pista{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);white-space:nowrap;background:rgba(58,42,34,.8);color:#fff;font-size:13px;font-weight:500;padding:7px 14px;border-radius:99px;pointer-events:none;transition:opacity .4s}
.comparar.usado .pista{opacity:0}
.comparar.off{cursor:default}
.comparar.off .capa,.comparar.off .manija,.comparar.off .lado,.comparar.off .pista,.comparar.off .rango{display:none}
.prod .foto-prod{aspect-ratio:45/32}
.prod .comparar .pista{font-size:12px;padding:6px 12px;bottom:10px}
.prod .comparar .manija span{width:40px;height:40px;margin:-20px 0 0 -20px}

/* reseñas */
.estrellas{display:inline-flex;gap:2px;vertical-align:-3px}
.estrellas svg{width:17px;height:17px;fill:#D39A2C}
.resenas .bajada .estrellas{margin-right:6px}
.res-grid{display:grid;gap:14px}
@media(min-width:700px){.res-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1000px){.resenas:not(.detalle) .res-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.detalle .res-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.resena{margin:0;background:#fff;border-radius:16px;padding:20px 20px 18px;display:flex;flex-direction:column;gap:12px}
.resena blockquote{margin:0;flex:1}
.resena p{margin:0;font-size:15.5px;color:var(--texto);max-width:none}
.resena figcaption{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px;font-size:14.5px;padding-top:12px;border-top:1px solid #F0E3D6}
.resena figcaption b{color:var(--tinta)}
.resena figcaption span{color:var(--suave)}
.res-prod{flex-basis:100%;font-size:13.5px;font-weight:500;color:var(--salvia);text-decoration:none}
.res-prod:hover{text-decoration:underline}
.res-resumen{display:inline-flex;align-items:center;gap:8px;margin-top:10px;font-size:14.5px;color:var(--suave);text-decoration:none}
.res-resumen:hover span{text-decoration:underline}
@media(min-width:1000px){.resena.ancha{grid-column:1/-1;background:var(--salvia-claro)}.resena.ancha p{font-size:17px;max-width:52em}}