/* ============================================================
   LEONOR'S — sistema de la web
   Tokens del manual de marca. Todo espaciado sale de --s1..--s10.
   Dirección visual: hueso + grafito. Cochinilla solo en enlaces e insignia.
   ============================================================ */

:root{
  /* paleta — hueso · grafito · cochinilla */
  --noche:#161C26;          /* texto sobre claro */
  --grafito-alto:#161C26;
  --grafito-bajo:#10151D;
  --grafito-medio:#1C2430;
  --plata:#9EA29D;          /* nunca texto sobre claro: 2.24:1 */
  --plata-viva:#C6C9C4;     /* texto secundario sobre oscuro */
  --hueso:#F2EEE6;
  --cochinilla:#7A1220;     /* acento: enlaces sobre claro e insignia */
  --surface:#FAF7F1;
  --rule:#E4DDD2;
  --soft:#3A403C;
  --faint:#5C635E;
  --halo:rgba(122,18,32,.12);
  --jade:#7A1220;
  --jade-vivo:#C6C9C4;      /* acento sobre oscuro: plata viva, no cochinilla */

  /* radios — un poco más generosos en medios */
  --r-sm:4px; --r:8px; --r-lg:16px; --r-xl:24px;

  /* escala de espacio */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px;
  --s6:32px; --s7:48px; --s8:64px; --s9:96px; --s10:128px;

  /* Fraunces en titulares, nombres y precios. Karla en el resto. */
  --serif:'Fraunces','Iowan Old Style',Georgia,serif;
  --sans:'Karla','Segoe UI',system-ui,sans-serif;
  --disp:'opsz' 144,'SOFT' 100,'WONK' 1;

  --cab-h:88px;
  /* Centrado con aire: más abierto que 1160, sin ir a borde */
  --ancho:1320px;
  --gutter:clamp(20px, 4vw, 48px);
  --estudio:linear-gradient(180deg,var(--grafito-alto) 0%,var(--grafito-bajo) 100%);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
}

body{
  margin:0;
  background:var(--hueso);
  color:var(--noche);
  font-family:var(--sans);
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
::selection{background:color-mix(in srgb,var(--cochinilla) 22%,var(--hueso));color:var(--noche)}

/* height:auto neutraliza el atributo height del HTML: sin él, aspect-ratio no manda
   y las fotos del empaque salían estiradas (350 de ancho por 800 de alto). */
img{max-width:100%;height:auto;display:block}
a{color:inherit}

:focus-visible{outline:2px solid var(--cochinilla);outline-offset:3px}
.sobre-oscuro :focus-visible{outline-color:var(--plata-viva)}

.visualmente-oculto{
  position:absolute;width:1px;height:1px;margin:-1px;padding:0;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;
}

/* ---- tipografia ---- */
h1,h2,h3{
  font-family:var(--serif);
  font-variation-settings:var(--disp);
  font-weight:500;
  letter-spacing:-.03em;
  text-wrap:balance;
  margin:0;
}
h1{font-size:clamp(2.85rem,7vw,5.6rem);line-height:.94}
h2{font-size:clamp(2.05rem,4.6vw,3.35rem);line-height:1.04}
h3{font-size:clamp(1.4rem,2.6vw,1.85rem);line-height:1.18}

.etiqueta{
  font-size:13px;font-weight:500;letter-spacing:.01em;
  text-transform:none;color:var(--soft);
}
.sobre-oscuro .etiqueta{color:var(--plata-viva)}

.firma{
  font-size:11px;font-weight:500;letter-spacing:.38em;
  text-transform:uppercase;
}

p{max-width:62ch;margin:0 0 var(--s4)}
.gris{color:var(--soft)}
.precio{font-variant-numeric:tabular-nums;font-family:var(--serif);
  font-variation-settings:var(--disp);font-weight:400}
.precio .sol{font-size:.62em;vertical-align:.28em;letter-spacing:.02em}

/* ---- estructura ---- */
.contenedor{
  max-width:var(--ancho);
  width:100%;
  margin-inline:auto;
  padding-inline:var(--gutter);
  box-sizing:border-box;
}

.sobre-oscuro{
  background:var(--estudio);
  color:var(--hueso);
}
.sobre-oscuro .gris{color:var(--plata-viva)}

/* ---- cabecera ---- */
/* Sobre héroe oscuro: transparente + hueso.
   Al bajar (.cabecera-clara): azul rey + letras hueso / jade. */
.cabecera{
  position:sticky;top:0;z-index:50;
  background:var(--hueso);
  border-bottom:1px solid transparent;
  color:var(--noche);
  transition:border-color .3s ease-out,background .35s ease-out,color .3s ease-out,
    box-shadow .35s ease-out;
}
.cabecera.con-borde{
  border-bottom-color:transparent;
  box-shadow:none;
}
.cabecera-fila{
  display:flex;align-items:center;justify-content:space-between;
  min-height:var(--cab-h);gap:var(--s5);
}
.logo-lockup{display:block;color:var(--noche);width:min(88px,22vw);flex:none;
  transition:opacity .2s ease-out;filter:none}
.logo-lockup:hover{opacity:.78}
.logo-lockup svg{width:100%;height:auto;display:block;max-height:80px}
.logo-mono{display:none;color:var(--noche);width:44px;flex:none;filter:none}
.logo-mono svg{width:100%;height:auto;display:block;max-height:52px}
@media (max-width:719px){
  .logo-lockup{display:none}
  .logo-mono{display:block}
}

.nav-principal{display:flex;gap:var(--s7);align-items:center}
.nav-principal a{
  text-decoration:none;font-size:15px;font-weight:500;
  letter-spacing:.01em;color:var(--noche);
  padding:var(--s2) 0;position:relative;
  opacity:.7;
  transition:color .18s ease-out,opacity .18s ease-out;
}
.nav-principal a:hover,.nav-principal a[aria-current="page"]{opacity:1;color:var(--noche)}
.nav-principal a[aria-current="page"]::after{
  content:"";position:absolute;left:0;right:0;bottom:0;
  height:2px;background:var(--cochinilla);
}
@media (max-width:860px){.nav-principal{display:none}}

.nav-movil-boton{
  display:none;background:none;border:0;padding:var(--s3);
  cursor:pointer;color:var(--noche);min-height:44px;min-width:44px;
}
@media (max-width:860px){.nav-movil-boton{display:grid;place-items:center}}
.nav-movil{display:none;border-top:1px solid var(--rule);padding:var(--s4) 0 var(--s5)}
.nav-movil.abierta{display:block}
.nav-movil a{
  display:block;padding:var(--s3) 0;text-decoration:none;
  font-size:16px;font-weight:500;letter-spacing:.01em;
  color:var(--noche);
}

.cabecera-acciones{display:flex;align-items:center;gap:var(--s1);flex:none;margin-left:auto}
.bolsa-boton{
  position:relative;display:grid;place-items:center;
  background:none;border:0;padding:var(--s3);cursor:pointer;
  color:var(--noche);min-height:44px;min-width:44px;
}
.bolsa-cuenta{
  position:absolute;top:6px;right:4px;
  min-width:18px;height:18px;padding:0 5px;
  border-radius:99px;background:var(--noche);color:var(--hueso);
  font-size:10px;font-weight:700;line-height:18px;text-align:center;
  font-variant-numeric:tabular-nums;
}

/* Modo cine: transparente sobre el héroe. */
.cabecera.cabecera-sobre-oscuro:not(.cabecera-clara){
  background:linear-gradient(180deg,rgba(16,21,29,.5) 0%,rgba(16,21,29,.12) 58%,transparent);
  border-bottom-color:transparent;
  box-shadow:none;
  color:var(--hueso);
}
/* La foto / intro oscura pasa debajo de la barra sticky. Sin esto el chrome
   crema se lee contra el body crema: logo invisible y solo se ve el «1». */
main > .heroe-crystal:first-child,
main > .heroe-scroll:first-child,
main > .heroe-maqueta:first-child,
main > .heroe-tienda:first-child{
  margin-top:calc(-1 * var(--cab-h));
}
main > .azulejo-oscuro:first-child{
  margin-top:calc(-1 * var(--cab-h));
  padding-top:calc(var(--s10) + var(--cab-h));
}
.cabecera.cabecera-sobre-oscuro:not(.cabecera-clara) .logo-lockup,
.cabecera.cabecera-sobre-oscuro:not(.cabecera-clara) .logo-mono{
  color:var(--hueso);
  filter:drop-shadow(0 1px 14px rgba(7,9,12,.55));
}
.cabecera.cabecera-sobre-oscuro:not(.cabecera-clara) .nav-principal a{
  color:var(--hueso);opacity:.85;
}
.cabecera.cabecera-sobre-oscuro:not(.cabecera-clara) .nav-principal a:hover,
.cabecera.cabecera-sobre-oscuro:not(.cabecera-clara) .nav-principal a[aria-current="page"]{
  color:var(--hueso);opacity:1;
}
.cabecera.cabecera-sobre-oscuro:not(.cabecera-clara) .nav-principal a[aria-current="page"]::after{
  background:var(--plata-viva);
}
.cabecera.cabecera-sobre-oscuro:not(.cabecera-clara) .bolsa-boton,
.cabecera.cabecera-sobre-oscuro:not(.cabecera-clara) .nav-movil-boton{
  color:var(--hueso);
  filter:drop-shadow(0 1px 10px rgba(7,9,12,.55));
}
.cabecera.cabecera-sobre-oscuro:not(.cabecera-clara) .bolsa-cuenta{
  background:var(--hueso);color:var(--noche);
}
.cabecera.cabecera-sobre-oscuro:not(.cabecera-clara) .nav-movil{
  border-top-color:color-mix(in srgb,var(--plata) 22%,transparent);
  background:color-mix(in srgb,var(--grafito-bajo) 94%,transparent);
}
.cabecera.cabecera-sobre-oscuro:not(.cabecera-clara) .nav-movil a{color:var(--hueso)}

/* Al scrollear sobre claro: hueso, texto noche, filete. */
.cabecera.cabecera-clara{
  background:var(--surface);
  color:var(--noche);
  border-bottom:1px solid var(--rule);
  box-shadow:none;
}
.cabecera.cabecera-clara .logo-lockup,
.cabecera.cabecera-clara .logo-mono,
.cabecera.cabecera-clara .bolsa-boton,
.cabecera.cabecera-clara .nav-movil-boton,
.cabecera.cabecera-clara .nav-movil a{color:var(--noche);filter:none}
.cabecera.cabecera-clara .nav-principal a{color:var(--noche);opacity:.72}
.cabecera.cabecera-clara .nav-principal a:hover,
.cabecera.cabecera-clara .nav-principal a[aria-current="page"]{
  color:var(--noche);opacity:1;
}
.cabecera.cabecera-clara .nav-principal a[aria-current="page"]::after{background:var(--cochinilla)}
.cabecera.cabecera-clara .bolsa-cuenta{background:var(--noche);color:var(--hueso)}
.cabecera.cabecera-clara .nav-movil{
  border-top-color:var(--rule);
  background:var(--surface);
}

/* ---- bolsa (panel) ---- */
body.bolsa-abierta{overflow:hidden}
.bolsa-velo[hidden],
.bolsa-panel[hidden],
.bolsa-pie[hidden],
.bolsa-tarjeta[hidden],
[data-bolsa-wa][hidden],
[data-bolsa-culqi][hidden],
[data-bolsa-nota-wa][hidden],
[data-bolsa-email-error][hidden],
[data-filtro-vacio][hidden],
[data-pedido-resumen][hidden],
[data-pedido-vacio][hidden],
[data-linea-bloque][hidden],
.pieza[hidden],
[data-leer-mas-btn][hidden],
[data-linea-bloque][hidden] + .banda,
.banda:has(+ [data-linea-bloque][hidden]){display:none!important}
.bolsa-velo{
  position:fixed;inset:0;z-index:90;
  background:rgba(16,21,29,.46);
}
.bolsa-panel{
  position:fixed;top:0;right:0;z-index:91;
  width:min(100%,32rem);height:100%;
  background:var(--surface);color:var(--noche);
  display:flex;flex-direction:column;
  border-left:1px solid var(--rule);
}
.bolsa-cabeza{
  display:flex;align-items:center;justify-content:space-between;
  gap:var(--s4);padding:var(--s5);
  border-bottom:1px solid var(--rule);flex:none;
}
.bolsa-cabeza h2{
  font-size:clamp(1.35rem,3vw,1.7rem);margin:0;
}
.bolsa-cerrar{
  display:grid;place-items:center;
  background:none;border:0;padding:var(--s3);cursor:pointer;
  color:var(--noche);min-height:44px;min-width:44px;
}
.bolsa-cuerpo{
  flex:0 1 34%;overflow:auto;padding:var(--s5);
  display:flex;flex-direction:column;gap:var(--s5);
  min-height:7rem;
}
.bolsa-vacia{
  margin:auto 0;text-align:center;display:flex;flex-direction:column;
  align-items:center;gap:var(--s4);padding-block:var(--s8);
}
.bolsa-vacia p{margin:0;color:var(--soft)}
.bolsa-linea{
  display:grid;gap:var(--s3);
  padding-bottom:var(--s5);border-bottom:1px solid var(--rule);
}
.bolsa-linea-con-foto{
  grid-template-columns:4.5rem 1fr;column-gap:var(--s4);
}
.bolsa-foto{
  width:4.5rem;aspect-ratio:4/5;object-fit:contain;
  background:#C4C5C2;border-radius:var(--r);grid-row:1 / span 2;
}
.bolsa-linea-con-foto .bolsa-linea-acciones{grid-column:2}
.bolsa-linea:last-child{border-bottom:0;padding-bottom:0}
.bolsa-nombre{
  font-family:var(--serif);font-variation-settings:var(--disp);
  font-size:1.2rem;text-decoration:none;color:var(--noche);
}
.bolsa-meta{
  font-size:14px;letter-spacing:0;text-transform:none;
  color:var(--soft);margin:var(--s1) 0 var(--s2);line-height:1.4;
}
.bolsa-linea .precio{font-size:1.15rem}
.bolsa-linea-acciones{
  display:flex;align-items:center;justify-content:space-between;gap:var(--s4);
}
.bolsa-qty{
  display:inline-flex;align-items:center;gap:0;
  border:1px solid var(--rule);border-radius:999px;overflow:hidden;
}
.bolsa-qty button{
  background:none;border:0;cursor:pointer;color:var(--noche);
  width:44px;height:44px;font-size:1.1rem;line-height:1;
}
.bolsa-qty button:disabled{opacity:.35;cursor:default}
.bolsa-qty span{
  min-width:1.5ch;text-align:center;font-variant-numeric:tabular-nums;
  font-weight:600;font-size:14px;
}
.bolsa-quitar{
  background:none;border:0;cursor:pointer;padding:var(--s2);
  font-size:14px;font-weight:500;letter-spacing:0;text-transform:none;
  color:var(--soft);text-decoration:underline;text-underline-offset:3px;
  min-height:44px;
}
.bolsa-quitar:hover{color:var(--cochinilla)}
.bolsa-pie{
  flex:1 1 auto;min-height:0;overflow:auto;padding:var(--s5);
  border-top:1px solid var(--rule);
  display:flex;flex-direction:column;gap:0;
  padding-bottom:max(var(--s5),env(safe-area-inset-bottom));
}
.bolsa-total{
  display:flex;flex-direction:column;align-items:flex-start;gap:var(--s1);
  margin:0 0 var(--s5);padding:var(--s4) var(--s5);
  background:var(--hueso);border-radius:var(--r-lg);
}
.bolsa-total span:first-child{
  font-size:14px;font-weight:500;letter-spacing:0;text-transform:none;
  color:var(--soft);
}
.bolsa-total .precio{font-size:clamp(2.4rem,6vw,3.25rem);line-height:1}
.bolsa-envio{display:grid;gap:var(--s3);margin:0 0 var(--s5)}
.bolsa-envio-linea{display:grid;grid-template-columns:1fr 1fr;gap:var(--s3)}
.bolsa-campo{display:flex;flex-direction:column;gap:var(--s1);min-width:0}
.bolsa-campo span{font-size:13px;font-weight:600;color:var(--noche)}
.bolsa-campo input{
  font:inherit;font-size:15px;color:var(--noche);
  background:var(--hueso);border:1px solid var(--rule);
  border-radius:var(--r);min-height:44px;padding:0 var(--s3);width:100%;
}
.bolsa-campo input:focus-visible{outline:2px solid var(--cochinilla);outline-offset:2px}
.bolsa-campo input[aria-invalid="true"]{border-color:var(--cochinilla)}
.aviso-datos{
  position:fixed;left:var(--s4);right:var(--s4);bottom:var(--s4);z-index:80;
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:var(--s4);
  max-width:var(--ancho);margin-inline:auto;
  padding:var(--s4) var(--s5);
  background:var(--surface);color:var(--noche);
  border:1px solid var(--rule);border-radius:var(--r-lg);
}
.aviso-datos[hidden]{display:none}
.aviso-datos p{margin:0;max-width:62ch;font-size:14px;line-height:1.45}
.aviso-datos-acciones{display:flex;flex-wrap:wrap;gap:var(--s3)}
.aviso-datos-no{
  min-height:48px;padding:0 var(--s5);
  border:1px solid var(--rule);border-radius:999px;
  background:transparent;color:var(--noche);
  font:inherit;font-size:15px;font-weight:600;cursor:pointer;
}
.aviso-datos-no:hover{border-color:var(--noche)}
.aviso-datos-no:focus-visible,
.aviso-datos .pastilla:focus-visible{outline:2px solid var(--cochinilla);outline-offset:3px}
.bolsa-nota{
  margin:0 0 var(--s3);font-size:14px;color:var(--soft);text-align:left;max-width:none;
  line-height:1.45;
}
.bolsa-pie .medios{display:none}
.bolsa-pago{
  padding:var(--s4);border-radius:var(--r-lg);
  background:color-mix(in srgb,var(--hueso) 70%,var(--surface));
  border:1px solid var(--rule);
  margin:0 0 var(--s5);min-width:0;
}
.bolsa-pago-titulo{
  margin:0 0 var(--s3);padding:0;font-size:15px;font-weight:600;
  letter-spacing:0;text-transform:none;color:var(--noche);
  float:none;width:100%;
}
.bolsa-medio{
  display:flex;align-items:flex-start;gap:var(--s3);
  padding:var(--s3);margin:0 0 var(--s2);border-radius:var(--r);
  border:1px solid transparent;cursor:pointer;
  transition:border-color .2s ease-out,background-color .2s ease-out;
}
.bolsa-medio:last-of-type{margin-bottom:0}
.bolsa-medio:hover{background:color-mix(in srgb,var(--surface) 80%,transparent)}
.bolsa-medio:has(input:checked){
  border-color:color-mix(in srgb,var(--noche) 22%,transparent);
  background:var(--surface);
}
.bolsa-medio input{
  margin:3px 0 0;flex:none;accent-color:var(--noche);
  width:18px;height:18px;
}
.bolsa-medio-txt{display:flex;flex-direction:column;gap:2px;min-width:0}
.bolsa-medio-txt strong{
  font-size:14px;font-weight:600;color:var(--noche);letter-spacing:0;
  text-transform:none;
}
.bolsa-medio-txt em{
  font-style:normal;font-size:12.5px;color:var(--soft);line-height:1.35;
}
.bolsa-medio-muted,.bolsa-medio-bloqueado{opacity:.48;cursor:not-allowed}
.bolsa-medio-muted:hover,.bolsa-medio-bloqueado:hover{background:transparent}
.bolsa-medio-muted:has(input:checked){border-color:transparent;background:transparent}
.bolsa-limite{margin:0 0 var(--s3);padding:var(--s3);border-radius:var(--r);
  background:var(--surface);color:var(--noche)}
.bolsa-tarjeta{display:flex;flex-direction:column;gap:var(--s3);margin-bottom:0}
.bolsa-email-label{
  font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--faint);
  margin:0 0 var(--s3);
}
.bolsa-email{
  font-family:var(--sans);font-size:15px;color:var(--noche);
  padding:var(--s3) var(--s4);min-height:48px;border-radius:var(--r);
  border:1px solid var(--rule);background:var(--surface);
  width:100%;box-sizing:border-box;
}
.bolsa-email:focus-visible{outline:2px solid var(--noche);outline-offset:2px}
.bolsa-email[aria-invalid="true"]{border-color:var(--cochinilla)}
.bolsa-campo-error{
  margin:0;font-size:13px;font-weight:600;color:var(--cochinilla);
}
.bolsa-acciones{margin-top:var(--s6);display:flex;flex-direction:column;gap:var(--s3)}
.bolsa-tarjeta .pastilla,
.bolsa-acciones .pastilla{width:100%}
.bolsa-unica{
  display:inline-block;margin-top:var(--s1);
  font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--cochinilla);
}

.contacto-directo{
  text-align:center;padding-block:var(--s8) var(--s6);
  display:flex;flex-direction:column;align-items:center;
}
.contacto-directo h2{margin:0}
.contacto-directo .gris{margin:var(--s3) 0 0}
.contacto-directo .pastilla{margin-top:var(--s6)}
.contacto-ayuda{
  display:grid;gap:var(--s5);padding-bottom:var(--s9);
  grid-template-columns:1fr;
}
@media (min-width:860px){.contacto-ayuda{grid-template-columns:repeat(2,1fr)}}
.condiciones{margin:var(--s4) 0 0}
.condiciones div{
  display:grid;grid-template-columns:minmax(96px,30%) 1fr;gap:var(--s3);
  padding:var(--s3) 0;border-bottom:1px solid var(--rule);
}
.condiciones div:last-child{border-bottom:0}
.condiciones dt{font-size:14px;font-weight:600;color:var(--noche)}
.condiciones dd{margin:0;font-size:15px;line-height:1.5;color:var(--soft)}
.contacto-card{
  padding:var(--s5);border:1px solid var(--rule);border-radius:var(--r-lg);
  background:var(--surface);
}
.contacto-card h3{margin:0}
.contacto-p{margin-top:var(--s3);margin-bottom:0}
.contacto-fino{margin-top:var(--s4);font-size:14px;max-width:none}
.contacto-pedido{padding-block:var(--s8)}
.contacto-pedido-grid{display:grid;gap:var(--s7);align-items:start}
@media (min-width:860px){
  .contacto-pedido-grid{grid-template-columns:.85fr 1.15fr;gap:var(--s8)}
}
.contacto-pedido .seccion-titulo{margin-top:var(--s3)}
.contacto-pedido .enlace-apple{margin-top:var(--s5)}
.contacto-form{display:grid;gap:var(--s4)}
.contacto-linea{display:grid;gap:var(--s4)}
@media (min-width:700px){
  .contacto-linea-2{grid-template-columns:1fr 1fr}
  .contacto-linea-3{grid-template-columns:1fr 1fr 1fr}
}
.contacto-campo{display:flex;flex-direction:column;gap:var(--s2);min-width:0}
.contacto-campo span{font-size:14px;font-weight:600;color:var(--noche)}
.contacto-campo input,
.contacto-campo textarea{
  font:inherit;font-size:15px;color:var(--noche);
  background:var(--surface);border:1px solid var(--rule);
  border-radius:var(--r);min-height:48px;padding:var(--s3) var(--s4);width:100%;
}
.contacto-campo textarea{min-height:6.5rem;resize:vertical}
.contacto-campo input:focus-visible,
.contacto-campo textarea:focus-visible{outline:2px solid var(--cochinilla);outline-offset:2px}
.contacto-error{
  margin:0;font-size:14px;font-weight:600;color:var(--cochinilla);
}
.contacto-error[hidden]{display:none}
.tema-boton{
  min-height:44px;min-width:44px;padding:0 var(--s3);
  border:1px solid var(--rule);border-radius:999px;
  background:transparent;color:inherit;cursor:pointer;
  font:inherit;font-size:14px;font-weight:600;
}
.tema-boton:hover{background:color-mix(in srgb,currentColor 8%,transparent)}
.pasos-pago{
  list-style:none;margin:var(--s4) 0 0;padding:0;
  display:flex;flex-direction:column;gap:var(--s3);
}
.pasos-pago li{
  font-size:14.5px;color:var(--soft);line-height:1.4;
  padding:var(--s3);border-radius:var(--r);
  background:color-mix(in srgb,var(--hueso) 65%,var(--surface));
  border:1px solid color-mix(in srgb,var(--rule) 80%,transparent);
}
.pasos-pago strong{color:var(--noche);font-weight:600}
.lista-pago{
  list-style:none;margin:var(--s4) 0;padding:0;
  display:flex;flex-direction:column;gap:var(--s3);
}
.lista-pago li{
  font-size:15px;color:var(--soft);padding-bottom:var(--s3);
  border-bottom:1px solid var(--rule);line-height:1.45;
}
.lista-pago li:last-child{border-bottom:0;padding-bottom:0}
.lista-pago strong{color:var(--noche);font-weight:600}
.pie-firma{margin-top:var(--s5);color:var(--plata-viva)}

@media (max-width:899px){
  body.bolsa-abierta:has(.pdp-barra){padding-bottom:0}
  body.bolsa-abierta .pdp-barra{display:none}
}

/* ---- heroe nocturno ---- */
.heroe{position:relative}
.heroe-int{
  display:grid;gap:var(--s7);
  padding-block:var(--s8);
  align-items:center;
  min-height:min(82vh,860px);
}
@media (min-width:900px){
  .heroe-int{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
}
.heroe h1{font-size:clamp(2.4rem,5.4vw,4.2rem)}
.heroe h1 em{font-style:italic}
.heroe .entrada{max-width:44ch;font-size:clamp(1.05rem,1.8vw,1.25rem);line-height:1.55}

/* el monograma se dibuja solo, como el hilo al tejerse */
.heroe-dibujo{
  color:var(--plata-viva);
  width:min(64vw,380px);
  justify-self:center;
}
.heroe-dibujo svg{width:100%;height:auto;display:block}
.heroe-dibujo path{
  stroke-dasharray:1;
  stroke-dashoffset:1;
  animation:dibujar 3.2s cubic-bezier(.45,0,.2,1) .4s forwards;
}
@keyframes dibujar{to{stroke-dashoffset:0}}
@media (prefers-reduced-motion:reduce){
  .heroe-dibujo path{stroke-dashoffset:0;animation:none}
}
@media (max-width:899px){.heroe-dibujo{display:none}}

/* ---- heroe: foto a sangre + zoom/giro leve + texto que cambia de poste ---- */
.heroe-scroll{height:360vh}
.heroe-fijo{
  position:sticky;top:0;min-height:100vh;
  display:block;overflow:hidden;
  background:#07090C;
}
.heroe.sobre-oscuro{background:#07090C}
.heroe-fijo::after{content:none}
.heroe-lienzo{
  position:absolute;inset:0;
  transform-origin:62% 48%;
  will-change:transform;
  transform-style:preserve-3d;
}
.heroe-foto-full{
  width:100%;height:100%;
  object-fit:cover;
  /* Tela a la izquierda (zona de texto); joya libre al centro-derecha */
  object-position:58% 42%;
  display:block;
  user-select:none;-webkit-user-drag:none;
  filter:contrast(1.06) saturate(1.03) brightness(1.02);
}
/* Velo: protege el copy; deja ver la filigrana */
.heroe-velo{
  position:absolute;inset:0;z-index:1;pointer-events:none;
  transition:opacity .55s ease-out;
  background:
    linear-gradient(180deg, rgba(7,9,12,.22) 0%, transparent 28%, transparent 76%, rgba(7,9,12,.38) 100%);
}
.heroe[data-poste="izq"] .heroe-velo{
  background:
    linear-gradient(95deg,
      rgba(7,9,12,.92) 0%,
      rgba(7,9,12,.72) 22%,
      rgba(7,9,12,.28) 38%,
      transparent 52%),
    linear-gradient(180deg, rgba(7,9,12,.18) 0%, transparent 30%, transparent 80%, rgba(7,9,12,.35) 100%);
}
.heroe[data-poste="der"] .heroe-velo{
  background:
    linear-gradient(200deg,
      rgba(7,9,12,.88) 0%,
      rgba(7,9,12,.55) 28%,
      transparent 48%),
    linear-gradient(260deg,
      rgba(7,9,12,.35) 0%,
      transparent 40%),
    linear-gradient(180deg, rgba(7,9,12,.18) 0%, transparent 30%, transparent 80%, rgba(7,9,12,.35) 100%);
}
.heroe[data-poste="centro"] .heroe-velo{
  background:
    linear-gradient(180deg,
      rgba(7,9,12,.15) 0%,
      transparent 22%,
      transparent 55%,
      rgba(7,9,12,.58) 80%,
      rgba(7,9,12,.82) 100%);
}
.heroe-relato{
  position:absolute;inset:0;z-index:2;
  pointer-events:none;
}
.heroe-relato .escena{
  position:absolute;
  display:flex;flex-direction:column;justify-content:center;
  max-width:34ch;
  opacity:0;visibility:hidden;
  transition:opacity .55s ease-out,translate .55s cubic-bezier(.22,1,.36,1),visibility 0s .55s;
  pointer-events:none;
}
.heroe-relato .escena.escena-viva{
  opacity:1;visibility:visible;
  transition:opacity .55s ease-out,translate .55s cubic-bezier(.22,1,.36,1),visibility 0s;
  pointer-events:auto;
}
/* Placa local detrás del copy: separa tipografía de la plata */
.heroe-relato .escena::before{
  content:"";position:absolute;z-index:-1;pointer-events:none;
  inset:-var(--s5) -var(--s6);border-radius:var(--r-lg);
  background:radial-gradient(ellipse at center,
    rgba(7,9,12,.55) 0%, rgba(7,9,12,.22) 55%, transparent 78%);
  opacity:0;transition:opacity .55s ease-out;
}
.heroe-relato .escena.escena-viva::before{opacity:1}
.heroe-relato .escena h1{
  font-size:clamp(2.35rem,4.4vw,3.75rem);letter-spacing:-.035em;line-height:1.02;
  color:var(--hueso);
  text-shadow:0 2px 28px rgba(7,9,12,.55);
}
.heroe-relato .escena h2{
  font-size:clamp(1.7rem,2.8vw,2.4rem);letter-spacing:-.028em;line-height:1.08;
  color:var(--hueso);
  text-shadow:0 2px 22px rgba(7,9,12,.5);
}
.heroe-relato .escena p{
  margin-top:var(--s3);font-size:15.5px;max-width:30ch;color:var(--plata-viva);
  line-height:1.55;
}
.heroe-relato .escena .etiqueta{
  max-width:none;white-space:nowrap;margin:0 0 var(--s3);color:var(--plata);
  letter-spacing:.14em;
}
/* Posturas: la joya queda en el centro óptico; el copy no se monta encima */
.escena-poste-izq{
  left:max(var(--s5), calc((100% - var(--ancho)) / 2 + var(--s5)));
  top:50%;width:min(36ch,38vw);
  translate:0 calc(-50% + 18px);text-align:left;
}
.escena-poste-izq.escena-viva{translate:0 -50%}
.escena-poste-der{
  right:max(var(--s5), calc((100% - var(--ancho)) / 2 + var(--s5)));
  left:auto;top:50%;width:min(36ch,38vw);
  translate:0 calc(-50% + 18px);text-align:right;align-items:flex-end;
}
.escena-poste-der.escena-viva{translate:0 -50%}
.escena-poste-der p{margin-left:auto}
/* Derecha pero arriba: no compite con la filigrana del centro */
.escena-poste-alto.escena-poste-der{
  top:18%;translate:0 14px;justify-content:flex-start;
}
.escena-poste-alto.escena-poste-der.escena-viva{translate:0 0}
.escena-poste-centro{
  left:50%;top:auto;bottom:14%;
  width:min(42ch,90vw);
  translate:-50% 18px;text-align:center;align-items:center;
}
.escena-poste-centro.escena-viva{translate:-50% 0}
.escena-poste-centro p{margin-inline:auto}
.heroe-pista-scroll{
  position:absolute;left:50%;bottom:var(--s5);translate:-50% 0;z-index:3;
  margin:0;font-size:10px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;
  color:color-mix(in srgb,var(--plata-viva) 78%,transparent);
  transition:opacity .35s ease-out;
  text-shadow:0 1px 12px rgba(7,9,12,.7);
}
.heroe-pista-scroll::before,.heroe-pista-scroll::after{
  content:"";display:inline-block;width:18px;height:1px;
  background:color-mix(in srgb,var(--plata) 70%,transparent);
  vertical-align:middle;margin:0 var(--s2);
}
.heroe-ctas{
  display:flex;flex-wrap:wrap;gap:var(--s4) var(--s6);
  align-items:center;justify-content:center;margin-top:var(--s5);
}
.heroe.sobre-oscuro .pastilla{background:var(--hueso);color:var(--noche)}
.heroe.sobre-oscuro .pastilla:hover{background:var(--plata-viva);color:var(--noche)}
.heroe.sobre-oscuro .enlace-apple{color:var(--plata-viva)}
.escena-cifra{
  display:block;font-family:var(--serif);font-variation-settings:var(--disp);
  font-weight:400;font-size:clamp(3.6rem,7vw,6rem);line-height:1;
  color:var(--hueso);margin-bottom:var(--s3);font-variant-numeric:tabular-nums;
}
@media (max-width:899px){
  .heroe[data-poste="izq"] .heroe-velo,
  .heroe[data-poste="der"] .heroe-velo{
    background:
      linear-gradient(180deg,
        rgba(7,9,12,.9) 0%,
        rgba(7,9,12,.7) 20%,
        rgba(7,9,12,.25) 38%,
        transparent 52%,
        transparent 78%,
        rgba(7,9,12,.5) 100%);
  }
  .heroe[data-poste="centro"] .heroe-velo{
    background:
      linear-gradient(180deg,
        rgba(7,9,12,.35) 0%,
        transparent 28%,
        transparent 48%,
        rgba(7,9,12,.62) 72%,
        rgba(7,9,12,.88) 100%);
  }
  .escena-poste-izq,.escena-poste-der{
    left:var(--s5);right:var(--s5);width:auto;top:var(--s5);
    translate:0 14px;max-width:min(100%,28ch);
  }
  .escena-poste-izq.escena-viva,.escena-poste-der.escena-viva{translate:0 0}
  .escena-poste-alto.escena-poste-der{top:var(--s5)}
  .escena-poste-izq{text-align:left;align-items:flex-start}
  .escena-poste-der{text-align:right;align-items:flex-end;left:var(--s5);right:var(--s5)}
  .escena-poste-centro{
    bottom:12%;width:auto;left:var(--s5);right:var(--s5);
    translate:0 14px;
  }
  .escena-poste-centro.escena-viva{translate:0 0}
  /* Joya más abajo: el titular no invade la filigrana */
  .heroe-foto-full{object-position:52% 58%}
  .heroe-lienzo{transform-origin:55% 62%}
  .heroe-relato .escena h1{font-size:clamp(1.85rem,7vw,2.35rem)}
  .heroe-pista-scroll{bottom:var(--s4)}
  .escena-cifra{font-size:3rem;display:inline;margin-right:var(--s3)}
}
@media (prefers-reduced-motion:reduce){
  .heroe-scroll{height:auto}
  .heroe-fijo{
    position:relative;min-height:0;
    display:grid;grid-template-rows:min(62vh,520px) auto;
  }
  .heroe-reducido .heroe-lienzo{
    position:relative;inset:auto;height:min(62vh,520px);
    transform:none!important;
  }
  .heroe-reducido .heroe-velo{
    position:absolute;top:0;left:0;right:0;height:min(62vh,520px);
  }
  .heroe-reducido .heroe-relato{
    position:relative;inset:auto;
    max-width:var(--ancho);margin:0 auto;
    padding:var(--s8) var(--s5);min-height:0;
    display:flex;flex-direction:column;gap:var(--s7);
  }
  .heroe-reducido .heroe-relato .escena{
    position:static;opacity:1;translate:0;visibility:visible;
    max-width:none;width:auto;pointer-events:auto;
    text-align:left;align-items:flex-start;
  }
  .heroe-pista-scroll{display:none}
}

/* ---- respiración: aire tipográfico entre hero y azulejos ---- */
.respiracion{
  padding:var(--s10) var(--s5);
  text-align:center;
  background:var(--hueso);
}
.respiracion-marca{
  font-family:var(--serif);font-variation-settings:var(--disp);
  font-weight:400;font-size:clamp(2rem,4.2vw,3.1rem);
  letter-spacing:-.03em;line-height:1.1;margin:0;
  color:var(--noche);text-wrap:balance;
}
.respiracion-texto{
  margin:var(--s5) auto 0;max-width:34ch;
  font-size:clamp(1.05rem,1.8vw,1.2rem);line-height:1.55;
  color:var(--soft);
}

/* reflejo espejo de la pieza, desvaneciendose */
.giro-reflejo{
  position:absolute;top:98%;left:0;
  width:100%;height:auto;display:block;pointer-events:none;
  transform:scaleY(-1);
  opacity:.22;filter:blur(1.2px);
  -webkit-mask-image:linear-gradient(to bottom, transparent 45%, rgba(0,0,0,.8) 100%);
  mask-image:linear-gradient(to bottom, transparent 45%, rgba(0,0,0,.8) 100%);
}

/* ---- visor de giro (secuencia fotografica) ---- */
.heroe-centrado{grid-template-columns:1fr!important;justify-items:center;
  text-align:center;gap:var(--s4);padding-block:var(--s5) var(--s6);min-height:0}
.heroe-texto h1{text-align:center}
.heroe-abajo{display:flex;flex-direction:column;align-items:center;gap:var(--s4);
  margin-top:var(--s6)}
.heroe-abajo .entrada{font-size:1rem;margin-bottom:0}
.heroe-abajo .entrada{text-align:center;max-width:52ch}
.giro{
  position:relative;width:min(56vw,min(38vh,300px));
  cursor:grab;touch-action:pan-y;user-select:none;
  opacity:.4;transition:opacity .4s ease-out;
}
.giro.giro-listo{opacity:1}
.giro.giro-activo{cursor:grabbing}
.giro-cuadro{width:100%;height:auto;display:block;pointer-events:none}
.giro-pista{
  position:absolute;left:50%;bottom:calc(-1 * var(--s6));translate:-50% 0;
  display:flex;align-items:center;gap:var(--s2);
  font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:var(--faint);white-space:nowrap;margin:0;
  transition:opacity .3s ease-out;
}
.giro-pista::before,.giro-pista::after{
  content:"";width:26px;height:1px;background:var(--faint);
}
.giro-pista-oculta{opacity:0}
.giro:focus-visible{outline:2px solid var(--plata-viva);outline-offset:8px;border-radius:var(--r)}

/* ---- cifras gigantes (capitulo de especificaciones) ---- */
.cifras{padding-block:var(--s9)}
.cifras-rejilla{
  display:grid;gap:var(--s7) var(--s5);grid-template-columns:1fr 1fr;
  text-align:center;
}
@media (min-width:900px){.cifras-rejilla{grid-template-columns:repeat(4,1fr)}}
.cifras-rejilla div{display:flex;flex-direction:column;gap:var(--s2)}
.cifras-rejilla strong{
  font-family:var(--serif);font-variation-settings:var(--disp);font-weight:400;
  font-size:clamp(3.4rem,7vw,5.6rem);line-height:1;color:var(--hueso);
  font-variant-numeric:tabular-nums;
}
.cifras-rejilla span{
  font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:var(--faint);
}

/* ---- capitulos cinematograficos ---- */
.capitulo-cine{position:relative;padding-block:var(--s9);overflow:hidden}
.capitulo-cine + .capitulo-cine{padding-top:0}
.capitulo-cine-int{
  position:relative;display:grid;gap:var(--s7);align-items:center;
}
@media (min-width:880px){
  .capitulo-cine-int{grid-template-columns:minmax(0,6fr) minmax(0,5fr)}
  .cine-invertido>figure{order:2}
}
.capitulo-cine figure{margin:0}
.cine-imagen{
  aspect-ratio:4/3;border-radius:var(--r-lg);overflow:hidden;
  background:var(--grafito-medio);border:1px solid color-mix(in srgb,var(--plata) 18%,transparent);
  display:grid;place-items:center;
}
.capitulo-cine h2{font-size:clamp(2.2rem,4.6vw,3.6rem)}
.capitulo-cine p{margin-top:var(--s4);max-width:44ch}
.cine-num{
  position:absolute;top:calc(-1 * var(--s5));right:0;z-index:0;
  font-family:var(--serif);font-variation-settings:var(--disp);font-weight:400;
  font-size:clamp(6rem,16vw,12rem);line-height:1;
  color:color-mix(in srgb,var(--plata) 22%,transparent);
  pointer-events:none;user-select:none;
}
.capitulo-cine-int>*{position:relative;z-index:1}
.capitulo-cine-int>.cine-num{z-index:0}

/* ---- azulejos estilo apple: bloques centrados apilados ---- */
.azulejo{
  padding:var(--s10) var(--s5) var(--s9);
  text-align:center;background:var(--hueso);
}
.azulejo-aire{padding-block:var(--s10) var(--s10)}
.azulejo-aire .azulejo-titulo{font-size:clamp(2.85rem,6.2vw,4.85rem)}
.azulejo-aire .azulejo-visual{margin-top:var(--s9);max-width:min(920px,92vw)}
.azulejo-oscuro{
  background:var(--estudio);
  color:var(--hueso);
  position:relative;
  overflow:hidden;
}
.azulejo-blanco{background:var(--surface)}
.azulejo-nombre{
  font-size:11px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;
  color:var(--faint);margin:0 auto var(--s4);max-width:none;
}
.azulejo-oscuro .azulejo-nombre{color:var(--plata)}
.azulejo-titulo{
  font-family:var(--serif);font-variation-settings:var(--disp);font-weight:400;
  font-size:clamp(2.6rem,5.8vw,4.4rem);line-height:1;letter-spacing:-.03em;
  margin:0;text-wrap:balance;
}
.azulejo-titulo-m{
  font-family:var(--serif);font-variation-settings:var(--disp);font-weight:400;
  font-size:clamp(2rem,3.6vw,2.85rem);line-height:1.04;letter-spacing:-.02em;
  margin:0;text-wrap:balance;
}
.azulejo-sub{
  max-width:40ch;margin:var(--s5) auto 0;
  font-size:clamp(1.08rem,1.9vw,1.3rem);line-height:1.5;color:var(--soft);
}
.azulejo-oscuro .azulejo-sub{color:var(--plata-viva)}
.azulejo-enlaces{
  display:flex;gap:var(--s5) var(--s7);justify-content:center;align-items:center;
  flex-wrap:wrap;margin-top:var(--s6);
}
.pastilla{
  display:inline-flex;align-items:center;justify-content:center;
  text-decoration:none;border:0;cursor:pointer;
  font-family:var(--sans);background:var(--noche);color:var(--hueso);
  font-size:15px;font-weight:600;letter-spacing:.03em;
  padding:var(--s3) var(--s7);border-radius:999px;min-height:48px;
  transition:background-color .22s ease-out,color .22s ease-out,
    transform .22s ease-out,letter-spacing .22s ease-out,box-shadow .22s ease-out;
}
.pastilla:hover{
  background:var(--grafito-medio);
}
.pastilla:active{transform:translateY(0) scale(.98);box-shadow:none}
.azulejo-oscuro .pastilla{background:var(--hueso);color:var(--noche)}
.azulejo-oscuro .pastilla:hover{background:#fff}
.pastilla-bloque{width:100%}
.pastilla-bloque:hover{transform:none;box-shadow:none;letter-spacing:.03em}
.pastilla-bloque:active{transform:scale(.99)}
.enlace-apple{
  display:inline-flex;align-items:center;gap:var(--s1);
  font-size:15px;font-weight:600;color:var(--cochinilla);text-decoration:none;
  transition:opacity .2s ease-out,transform .2s ease-out;
}
.enlace-apple::after{content:"›";font-size:1.25em;translate:0 -1px;
  transition:translate .22s cubic-bezier(.22,1,.36,1)}
.enlace-apple:hover{opacity:.78;transform:translateX(2px)}
.enlace-apple:hover::after{translate:5px -1px}
.azulejo-oscuro .enlace-apple{color:var(--plata-viva)}
.azulejo.como-comprar{padding-block:var(--s9)}
.como-comprar-pasos{
  list-style:none;margin:var(--s7) auto 0;padding:0;max-width:1040px;
  display:grid;gap:var(--s5);grid-template-columns:1fr;text-align:left;
}
@media (min-width:760px){.como-comprar-pasos{grid-template-columns:repeat(3,1fr)}}
.como-comprar-pasos li{
  padding:var(--s5);border:1px solid color-mix(in srgb,var(--plata) 22%,transparent);
  border-radius:var(--r-lg);
}
.como-comprar-num{
  display:inline-flex;align-items:center;justify-content:center;
  width:36px;height:36px;border-radius:50%;
  border:1px solid var(--plata-viva);color:var(--hueso);
  font-size:14px;font-weight:600;font-variant-numeric:tabular-nums;
}
.como-comprar-pasos h3{margin:var(--s4) 0 var(--s2);font-family:var(--sans);font-size:17px;font-weight:600;color:var(--hueso)}
.como-comprar-pasos p{margin:0;font-size:15px;line-height:1.55;color:var(--plata-viva)}
.como-comprar .azulejo-enlaces{margin-top:var(--s6)}
.como-comprar-ayuda{
  margin:var(--s7) auto 0;max-width:46ch;
  font-size:16px;line-height:1.55;
}
.azulejo-oscuro .como-comprar-ayuda{color:var(--plata-viva)}
.azulejo .giro{margin:var(--s8) auto 0}
.heroe-pieza{
  margin:var(--s8) auto 0;
  width:min(62vw,min(46vh,360px));
  position:relative;
  filter:drop-shadow(0 28px 48px rgba(0,0,0,.35));
}
.heroe-pieza img{
  width:100%;height:auto;display:block;
  transition:transform .7s cubic-bezier(.22,1,.36,1);
}
.heroe-pieza:hover img{transform:scale(1.045)}
.heroe-pieza::before{
  content:"";position:absolute;left:50%;bottom:-8%;translate:-50% 0;
  width:130%;height:18%;border-radius:50%;
  background:radial-gradient(ellipse at center, var(--halo), transparent 70%);
  filter:blur(8px);pointer-events:none;
  transition:opacity .5s ease-out,transform .5s ease-out;
}
.heroe-pieza:hover::before{opacity:.85;transform:scaleX(1.06)}
.azulejo-visual{
  max-width:980px;margin:var(--s8) auto 0;aspect-ratio:16/9;
  border-radius:var(--r-xl);overflow:hidden;
  background:var(--surface);
  border:1px solid color-mix(in srgb,var(--rule) 70%,transparent);
  display:grid;place-items:center;
  position:relative;
  box-shadow:0 24px 48px rgba(20,24,31,.06);
}
.azulejo-visual::after,
.azulejo-visual-m::after,
.pieza-imagen::after,
.pdp-escena::after,
.empaque-foto::after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:1;
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--noche) 4%,transparent);
  background:radial-gradient(ellipse 80% 70% at 50% 40%, transparent 55%, rgba(14,18,24,.12) 100%);
}
.azulejo-visual img,
.azulejo-visual-m img{
  width:100%;height:100%;object-fit:cover;object-position:50% 42%;
  filter:contrast(1.04) saturate(1.05);
  transition:transform .75s cubic-bezier(.22,1,.36,1),filter .4s ease-out;
}
.azulejo-visual:hover img,
.azulejo-medio:hover .azulejo-visual-m img{transform:scale(1.035);filter:contrast(1.06) saturate(1.06)}
.azulejos-2{display:grid;gap:var(--s4);padding:var(--s4);background:var(--hueso)}
@media (min-width:860px){.azulejos-2{grid-template-columns:1fr 1fr;gap:var(--s5);padding:var(--s5)}}
.azulejo-medio{
  border-radius:var(--r-xl);padding:var(--s9) var(--s5) var(--s8);
  display:flex;flex-direction:column;align-items:center;
  transition:transform .4s cubic-bezier(.22,1,.36,1);
}
.azulejo-medio:hover{transform:translateY(-2px)}
.azulejo-medio .azulejo-visual-m{
  width:min(100%,520px);aspect-ratio:4/3;margin-top:var(--s7);
  border-radius:var(--r-lg);overflow:hidden;
  display:grid;place-items:center;
  background:color-mix(in srgb,currentColor 5%,transparent);
}
.azulejo-blanco.azulejo-medio .azulejo-visual-m{border:1px solid var(--rule);background:var(--hueso)}
.azulejo-oscuro.azulejo-medio .azulejo-visual-m{background:var(--grafito-medio)}
.azulejo .reticula{padding-block:var(--s8) 0;text-align:left}

/* ---- cenefa separadora en marquesina infinita ---- */
.banda{
  color:var(--plata);
  padding-block:var(--s5);
  overflow:hidden;
}
.banda-pista{
  display:flex;width:max-content;
  animation:telar 36s linear infinite;
  will-change:transform;
}
.banda svg{height:22px;width:auto;flex:none;margin-right:0;display:block}
@keyframes telar{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}
@media (prefers-reduced-motion:reduce){
  .banda-pista{animation:none;will-change:auto}
}

/* ---- reticula de piezas ---- */
.reticula{
  display:grid;gap:var(--s8) var(--s6);
  grid-template-columns:1fr;
  padding-block:var(--s7);
  text-align:left;
}
@media (min-width:560px){.reticula{grid-template-columns:1fr 1fr}}
@media (min-width:900px){.reticula{grid-template-columns:repeat(3,1fr);gap:var(--s8) var(--s6)}}
@media (min-width:1200px){.reticula{grid-template-columns:repeat(4,1fr);gap:var(--s8) var(--s6)}}

/* Destacadas: primera pieza protagoniza (editorial) */
.reticula-destacadas{padding-top:var(--s8)}
@media (min-width:900px){
  .reticula-destacadas{
    grid-template-columns:1.35fr 1fr;
    grid-template-rows:auto auto;
    gap:var(--s7) var(--s6);
  }
  .reticula-destacadas .pieza:first-child{
    grid-row:1 / span 2;
  }
  .reticula-destacadas .pieza:first-child .pieza-imagen{aspect-ratio:3/4}
  .reticula-destacadas .pieza:first-child .pieza-nombre{
    font-size:clamp(1.45rem,2.2vw,1.85rem);
  }
  .reticula-destacadas .pieza:not(:first-child) .pieza-imagen{aspect-ratio:4/5}
}

.pieza{display:flex;flex-direction:column;text-decoration:none;color:inherit;
  transition:transform .4s cubic-bezier(.22,1,.36,1);position:relative}
.pieza:hover{transform:translateY(-3px)}
.pieza-imagen{
  aspect-ratio:4/5;border-radius:var(--r-lg);overflow:hidden;
  background:
    radial-gradient(ellipse 70% 55% at 50% 42%, color-mix(in srgb,var(--plata) 10%,var(--surface)), var(--surface));
  border:1px solid color-mix(in srgb,var(--rule) 40%,transparent);
  display:block;position:relative;
  transition:border-color .3s ease-out,box-shadow .4s ease-out;
}
.pieza-link{display:block;width:100%;height:100%;text-decoration:none;color:inherit;position:relative}
.pieza-rapido{
  position:absolute;left:50%;top:50%;z-index:4;
  transform:translate(-50%,-42%);
  display:inline-flex;align-items:center;justify-content:center;
  min-height:44px;padding:0 var(--s5);
  background:color-mix(in srgb,var(--hueso) 84%,transparent);
  color:var(--noche);border:1px solid color-mix(in srgb,var(--noche) 14%,transparent);
  border-radius:999px;font-size:14px;font-weight:500;letter-spacing:0;
  text-transform:none;cursor:pointer;opacity:0;
  font-family:var(--sans);
  transition:opacity .25s ease-out,transform .25s ease-out,background .2s ease-out;
}
.pieza:hover .pieza-rapido,
.pieza:focus-within .pieza-rapido{
  opacity:1;transform:translate(-50%,-50%);
}
.pieza-rapido:hover{background:var(--hueso);border-color:var(--noche)}
.pieza-rapido:focus-visible{outline:2px solid var(--cochinilla);outline-offset:3px}
@media (hover:none){
  .pieza-rapido{opacity:1;transform:translate(-50%,-50%)}
}
.pieza:hover .pieza-imagen{
  border-color:color-mix(in srgb,var(--rule) 85%,transparent);
  box-shadow:0 22px 44px rgba(20,24,31,.1);
}
.pieza-imagen img{width:100%;height:100%;object-fit:cover;object-position:50% 38%;
  filter:contrast(1.05) saturate(1.04);
  transition:transform .75s cubic-bezier(.22,1,.36,1),filter .4s ease-out}
.pieza:hover .pieza-imagen img:first-child,
.pieza:hover .pieza-imagen .pieza-foto{transform:scale(1.04);filter:contrast(1.07) saturate(1.05)}
/* segunda toma (puesta en mano / oreja / cuello / muñeca): crossfade al hover o foco */
.pieza-imagen-b{
  position:absolute;inset:0;background:var(--surface);
  opacity:0;transition:opacity .4s ease-out;
  pointer-events:none;
}
.pieza-imagen-b img{
  width:100%;height:100%;object-fit:cover;object-position:50% 40%;
  transform:scale(1.05);transition:transform .75s cubic-bezier(.22,1,.36,1),opacity .4s ease-out;
}
.pieza:hover .pieza-imagen-b,
.pieza:focus-visible .pieza-imagen-b,
.pieza:focus-within .pieza-imagen-b,
.pieza.ver-uso .pieza-imagen-b{
  opacity:1;
}
.pieza:hover .pieza-imagen-b img,
.pieza:focus-within .pieza-imagen-b img,
.pieza.ver-uso .pieza-imagen-b img{
  transform:scale(1);
}
.pieza-badge-uso{
  position:absolute;bottom:var(--s3);right:var(--s3);z-index:2;
  font-family:var(--sans);font-size:10px;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;
  color:var(--noche);background:rgba(255,255,255,.94);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  padding:3px 9px;border-radius:99px;
  box-shadow:0 2px 8px rgba(20,24,31,.12);
  opacity:0;transform:translateY(4px);
  transition:opacity .3s ease-out,transform .3s ease-out;
  pointer-events:none;
}
.pieza:hover .pieza-badge-uso,
.pieza:focus-within .pieza-badge-uso,
.pieza.ver-uso .pieza-badge-uso{
  opacity:1;transform:translateY(0);
}
@media (hover:none){
  .pieza:hover{transform:none}
  .pieza.ver-uso .pieza-imagen-b{opacity:1;display:block}
  .pieza:hover .pieza-imagen img{transform:none}
  .pieza:hover .pieza-imagen{box-shadow:none}
}
.pieza-datos{padding-top:var(--s4);text-align:left;flex:1;display:flex;flex-direction:column}
.pieza-nombre{font-family:var(--serif);font-variation-settings:var(--disp);
  font-weight:500;font-size:clamp(1.3rem,2.2vw,1.55rem);line-height:1.18;margin:0;
  letter-spacing:-.02em;color:var(--noche);transition:letter-spacing .3s ease-out}
.pieza-nombre a{text-decoration:none;color:inherit}
.pieza-nombre a:hover{text-decoration:underline;text-underline-offset:3px}
.pieza:hover .pieza-nombre{letter-spacing:-.01em}
.pieza-meta{font-size:14px;letter-spacing:0;text-transform:none;
  color:var(--soft);margin:var(--s2) 0 0;font-weight:400;line-height:1.4}
.pieza-pie-fila{
  display:flex;align-items:baseline;justify-content:space-between;
  margin-top:auto;padding-top:var(--s3);gap:var(--s3);
}
.pieza .precio{font-size:1.2rem;
  font-variant-numeric:tabular-nums;letter-spacing:-.015em;color:var(--noche);font-weight:500}

/* reserva de imagen: hasta que exista la foto real */
.reserva{
  width:100%;height:100%;display:grid;place-items:center;
  color:var(--faint);text-align:center;padding:var(--s5);
  background:
    radial-gradient(ellipse 60% 50% at 50% 45%, color-mix(in srgb,var(--plata) 8%,transparent), transparent 70%);
}
.reserva span{font-size:10px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--soft);opacity:.7}
.reserva .mono-agua{width:48px;margin-inline:auto;margin-bottom:var(--s4);opacity:.12}
.reserva .mono-agua svg{width:100%;height:auto}

/* ---- botones ---- */
.boton{
  display:inline-block;border:0;cursor:pointer;text-decoration:none;
  font-family:var(--sans);font-size:14px;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;
  padding:var(--s4) var(--s6);border-radius:var(--r);
  min-height:44px;
  transition:background-color .16s ease-out,color .16s ease-out;
}
.boton-primario{background:var(--noche);color:var(--hueso)}
.boton-primario:hover{background:var(--grafito-medio)}
.sobre-oscuro .boton-primario{background:var(--hueso);color:var(--noche)}
.sobre-oscuro .boton-primario:hover{background:#fff}
.boton-secundario{
  background:transparent;color:var(--noche);
  box-shadow:inset 0 0 0 1.5px var(--noche);
}
.boton-secundario:hover{background:var(--noche);color:var(--hueso)}
.sobre-oscuro .boton-secundario{color:var(--hueso);box-shadow:inset 0 0 0 1.5px var(--hueso)}
.sobre-oscuro .boton-secundario:hover{background:var(--hueso);color:var(--noche)}

.enlace-flecha{
  display:inline-flex;align-items:center;gap:var(--s2);
  font-size:14px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  text-decoration:none;color:var(--cochinilla);
}
.enlace-flecha::after{content:"\2192";transition:transform .16s ease-out}
.enlace-flecha:hover::after{transform:translateX(4px)}
.sobre-oscuro .enlace-flecha{color:var(--plata-viva)}

.enlace-volver{
  display:inline-flex;align-items:center;gap:var(--s2);
  font-size:14px;font-weight:500;letter-spacing:0;text-transform:none;
  text-decoration:none;color:var(--soft);
}
.enlace-volver::before{content:"\2190";transition:transform .16s ease-out}
.enlace-volver:hover{color:var(--noche)}
.enlace-volver:hover::before{transform:translateX(-4px)}

/* ---- seccion oficio (home) ---- */
.oficio{padding-block:var(--s9)}
.oficio-int{display:grid;gap:var(--s7);align-items:center}
@media (min-width:900px){.oficio-int{grid-template-columns:1fr 1fr}}
.oficio-imagen{aspect-ratio:4/5;border-radius:var(--r-lg);overflow:hidden;
  background:var(--grafito-medio);border:1px solid color-mix(in srgb,var(--plata) 18%,transparent);
  display:grid;place-items:center}

.pasos{list-style:none;margin:var(--s6) 0 0;padding:0;
  counter-reset:paso;display:flex;flex-direction:column;gap:var(--s4)}
.pasos li{
  counter-increment:paso;display:flex;gap:var(--s4);align-items:baseline;
  padding-bottom:var(--s4);border-bottom:1px solid color-mix(in srgb,var(--plata) 18%,transparent);
  max-width:52ch;
}
.pasos li:last-child{border-bottom:0}
.pasos li::before{
  content:counter(paso,decimal-leading-zero);
  font-family:var(--serif);font-variation-settings:var(--disp);
  font-size:1.3rem;color:var(--plata);flex:none;
}

/* ---- franja editorial ---- */
.franja{padding-block:var(--s9);text-align:center}
.franja .mono{width:64px;margin-inline:auto;margin-bottom:var(--s5);color:var(--noche)}
.franja .mono svg{width:100%;height:auto}
.franja blockquote{
  margin:0 auto;max-width:26ch;
  font-family:var(--serif);font-variation-settings:var(--disp);
  font-size:clamp(1.5rem,3.4vw,2.4rem);line-height:1.25;font-style:italic;
}
.franja figcaption{margin-top:var(--s5)}

/* ---- pie ---- */
.pie{
  padding-block:var(--s9) var(--s6);
  border-top:1px solid var(--rule);
}
.pie-cenefa{color:color-mix(in srgb,var(--jade) 40%,var(--plata));margin-bottom:var(--s7);
  display:flex;justify-content:center;overflow:hidden}
.pie-cenefa svg{height:18px;width:auto;flex:none}
.pie-int{display:grid;gap:var(--s7) var(--s6);align-items:start}
@media (min-width:800px){.pie-int{grid-template-columns:minmax(0,1.6fr) repeat(3,minmax(0,1fr));gap:var(--s8) var(--s7)}}
.pie-marca{max-width:36ch}
.pie .logo-lockup{color:var(--hueso);width:min(160px,44vw)}
.pie-marca .pie-firma{margin:var(--s4) 0 var(--s3);color:var(--jade-vivo);letter-spacing:.28em}
.pie-marca .pie-blurb{
  margin:0 0 var(--s5);font-size:15px;line-height:1.55;color:var(--plata-viva);max-width:34ch;
}
.pie-marca .pie-wa{
  display:inline-flex;align-items:center;gap:var(--s2);
  font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--hueso);text-decoration:none;
  border-bottom:1px solid var(--jade);padding-bottom:2px;
  transition:color .18s ease-out,border-color .18s ease-out;
}
.pie-marca .pie-wa:hover{color:var(--jade-vivo);border-bottom-color:var(--jade-vivo)}
.pie h4{font-size:11px;font-weight:700;letter-spacing:.22em;
  text-transform:uppercase;color:var(--jade-vivo);margin:0 0 var(--s4)}
.pie ul{list-style:none;margin:0;padding:0;display:flex;
  flex-direction:column;gap:var(--s3)}
.pie a{text-decoration:none;color:var(--plata-viva);font-size:14.5px;
  transition:color .18s ease-out}
.pie a:hover{color:var(--hueso)}
.pie-medios{
  margin-top:var(--s8);padding-top:var(--s5);
  border-top:1px solid color-mix(in srgb,var(--jade) 28%,transparent);
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:var(--s4) var(--s6);
}
.pie-medios-etiq{
  margin:0;font-size:11px;font-weight:700;letter-spacing:.18em;
  text-transform:uppercase;color:var(--faint);
}
.pie-legal{
  margin-top:var(--s6);padding-top:var(--s5);
  border-top:1px solid color-mix(in srgb,var(--plata) 18%,transparent);
  display:flex;flex-wrap:wrap;gap:var(--s4);justify-content:space-between;
  font-size:12px;letter-spacing:.04em;color:var(--faint);
}

/* ---- PLP ---- */
.plp-cabeza{padding-block:var(--s8) var(--s5);
  display:flex;flex-wrap:wrap;align-items:end;gap:var(--s5);
  justify-content:space-between}

/* ---- escaparate por lineas ---- */
.escaparate{padding-block:var(--s7) var(--s5)}
.escaparate-cabeza{
  display:flex;flex-wrap:wrap;align-items:end;gap:var(--s4) var(--s7);
  justify-content:space-between;margin-bottom:var(--s2);
}
.escaparate-cabeza p{max-width:44ch;margin:0}
.reticula-autor{grid-template-columns:1fr}
@media (min-width:760px){
  .reticula-autor{grid-template-columns:1.25fr 1fr 1fr;gap:var(--s8) var(--s6)}
  .reticula-autor .pieza:first-child .pieza-nombre{
    font-size:clamp(1.4rem,2.2vw,1.7rem);
  }
  .reticula-autor .pieza:first-child .pieza-imagen{aspect-ratio:3/4}
}
.azulejo .azulejo-enlaces + .contenedor .reticula{padding-top:var(--s5)}
.azulejo-tienda-intro{padding-block:var(--s10) var(--s9)}
.azulejo-tienda-intro .azulejo-titulo{font-size:clamp(2.7rem,5.5vw,4.2rem)}

/* ---- hero tienda (foto + copy) ---- */
.heroe-tienda{
  position:relative;isolation:isolate;
  min-height:min(78vh,720px);
  display:grid;align-items:end;
  color:var(--hueso);background:#07090C;
  overflow:hidden;
}
.heroe-tienda-foto{
  position:absolute;inset:0;z-index:0;pointer-events:none;
}
.heroe-tienda-foto .heroe-carrusel-pista{position:absolute;inset:0}
.heroe-tienda-foto .heroe-carrusel-slide{
  width:100%;height:100%;object-fit:cover;object-position:78% 45%;
  display:block;
}
.heroe-tienda-velo{
  position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    linear-gradient(90deg, rgba(7,9,12,.82) 0%, rgba(7,9,12,.45) 42%, rgba(7,9,12,.12) 72%, rgba(7,9,12,.35) 100%),
    linear-gradient(180deg, rgba(7,9,12,.4) 0%, transparent 32%, rgba(7,9,12,.7) 100%);
}
.heroe-tienda-copy{
  position:relative;z-index:2;
  padding:calc(var(--cab-h) + var(--s8)) var(--s6) var(--s9);
  max-width:min(42rem,100%);
}
.heroe-tienda-copy .azulejo-nombre{color:var(--plata-viva)}
.heroe-tienda-copy .azulejo-titulo{
  font-size:clamp(2.7rem,5.5vw,4.2rem);
  color:var(--hueso);margin:0 0 var(--s4);
}
.heroe-tienda-copy .azulejo-sub{
  color:color-mix(in srgb,var(--hueso) 82%,transparent);
  max-width:36ch;margin:0 0 var(--s6);
}
.heroe-tienda-copy .enlace-apple{color:var(--hueso)}
.heroe-tienda-copy .enlace-apple:hover{opacity:.8}
.heroe-tienda .heroe-carrusel-nav{z-index:3}
@media (min-width:900px){
  .heroe-tienda{min-height:min(86vh,820px)}
  .heroe-tienda-copy{padding-inline:var(--s9);padding-bottom:var(--s10)}
}
@media (max-width:767px){
  .heroe-tienda{
    display:grid;
    grid-template-columns:1fr;
    grid-template-rows:minmax(44vh,360px) auto;
    min-height:0;
    align-items:stretch;
    background:linear-gradient(180deg,var(--grafito-alto) 0%,var(--grafito-bajo) 100%);
  }
  .heroe-tienda-foto{
    grid-row:1;grid-column:1;
    position:relative;inset:auto;
    height:100%;min-height:0;overflow:hidden;
  }
  .heroe-tienda-foto .heroe-carrusel-slide{
    object-position:68% 18%;height:100%;
  }
  .heroe-tienda-velo{
    grid-row:1;grid-column:1;
    position:relative;inset:auto;z-index:1;
    align-self:stretch;justify-self:stretch;
    width:100%;height:100%;
    background:
      linear-gradient(180deg, rgba(7,9,12,.22) 0%, transparent 42%, rgba(16,21,29,.5) 100%);
  }
  .heroe-tienda-copy{
    grid-row:2;grid-column:1;
    position:relative;z-index:2;
    padding:var(--s5) var(--s5) var(--s6);
    max-width:100%;
  }
  .heroe-tienda-copy .azulejo-nombre{margin-bottom:var(--s2)}
  .heroe-tienda-copy .azulejo-titulo{
    font-size:clamp(1.7rem,6.5vw,2.15rem);
    line-height:1.08;margin-bottom:var(--s3);
  }
  .heroe-tienda-copy .azulejo-sub{
    font-size:14px;line-height:1.4;
    max-width:34ch;margin-bottom:var(--s4);
  }
  .heroe-tienda-copy .azulejo-enlaces{
    flex-direction:column;align-items:flex-start;
    justify-content:flex-start;gap:var(--s2);
    margin-top:0;
  }
  .heroe-tienda .heroe-carrusel-nav{
    grid-row:1;grid-column:1;
    align-self:end;justify-self:center;
    position:relative;left:auto;bottom:var(--s4);
    transform:none;z-index:3;
  }
}

/* ---- tienda: tipología estandarizada ---- */
.tienda-tipo{margin-top:var(--s8)}
.tienda-tipo:first-child{margin-top:var(--s5)}
.tienda-tipo-titulo{
  font-family:var(--sans);font-size:11px;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;
  color:var(--faint);margin:0 0 var(--s4);
  padding-bottom:var(--s3);
  border-bottom:1px solid color-mix(in srgb,var(--rule) 70%,transparent);
}
.reticula-tienda{
  grid-template-columns:1fr;
  gap:var(--s7) var(--s5);
}
@media (min-width:560px){
  .reticula-tienda{grid-template-columns:1fr 1fr}
}
@media (min-width:900px){
  .reticula-tienda{grid-template-columns:repeat(3,1fr);gap:var(--s7) var(--s5)}
}
@media (min-width:1200px){
  .reticula-tienda{grid-template-columns:repeat(4,1fr);gap:var(--s7) var(--s5)}
}
.reticula-tienda .pieza-imagen{
  aspect-ratio:3/4;
  border-radius:var(--r);
}
.reticula-tienda .pieza-imagen img{
  object-fit:cover;object-position:50% 40%;
}
.azulejo .contenedor > .tienda-tipo .reticula{padding-block:0}

.insignia{
  position:absolute;top:var(--s4);left:var(--s4);z-index:2;
  font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--hueso);background:var(--jade);
  border-radius:99px;padding:.55em 1.1em;
  box-shadow:0 2px 8px rgba(5,14,41,.18);
}
.enlace-quieto{
  display:inline-block;margin-top:var(--s3);
  font-size:14px;font-weight:500;letter-spacing:0;text-transform:none;
  color:var(--noche);text-decoration:underline;text-underline-offset:3px;
  transition:color .2s ease-out;
}
.pieza:hover .enlace-quieto{color:var(--cochinilla);opacity:1}

.filtros{display:flex;gap:var(--s2);flex-wrap:wrap;justify-content:center}
.tienda-filtros{
  padding:var(--s5) 0 var(--s6);
  background:var(--hueso);
  border-bottom:1px solid var(--rule);
}
.tienda-filtros-int{
  display:flex;flex-direction:column;align-items:center;gap:var(--s3);
}
@media (max-width:767px){
  .tienda-filtros{padding-inline:0}
  .tienda-filtros-int{align-items:stretch;padding-inline:var(--s5)}
  .tienda-filtros .filtros{
    flex-wrap:nowrap;justify-content:flex-start;
    overflow-x:auto;-webkit-overflow-scrolling:touch;
    scrollbar-width:none;gap:var(--s2);
    margin-inline:calc(var(--s5) * -1);
    padding-inline:var(--s5);
    padding-right:var(--s8);
  }
  .tienda-filtros .filtros::-webkit-scrollbar{display:none}
  .tienda-filtros .filtro{flex:none;padding-inline:var(--s4)}
}
.tienda-filtros-label{
  margin:0;font-size:11px;font-weight:700;letter-spacing:.18em;
  text-transform:uppercase;color:var(--faint);
}
.tienda-filtros-vacio{
  margin:var(--s4) auto 0;text-align:center;color:var(--soft);
}
.filtro{
  font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  border:1px solid color-mix(in srgb,var(--rule) 90%,transparent);border-radius:99px;
  background:transparent;color:var(--soft);cursor:pointer;
  padding:var(--s3) var(--s5);min-height:44px;
  transition:border-color .2s ease-out,color .2s ease-out,background-color .2s ease-out;
}
.filtro[aria-pressed="true"]{background:var(--noche);color:var(--hueso);border-color:var(--noche)}
.filtro:hover:not([aria-pressed="true"]){border-color:var(--noche);color:var(--noche)}

.garantias{
  display:grid;gap:var(--s5);grid-template-columns:1fr 1fr;
  text-align:center;
}
@media (min-width:760px){.garantias{grid-template-columns:repeat(4,1fr)}}
.garantias div{display:flex;flex-direction:column;gap:var(--s1);
  padding-top:var(--s4);border-top:1px solid color-mix(in srgb,var(--plata) 18%,transparent)}
.garantias strong{font-family:var(--serif);font-variation-settings:var(--disp);
  font-weight:400;font-size:1.2rem}
.garantias span{font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--faint)}

/* ---- empaque / papelería ---- */
.empaque .azulejo-sub{max-width:42ch;margin-inline:auto}
.empaque-duo{
  display:grid;gap:var(--s5);
  grid-template-columns:1fr;
  padding-block:var(--s8) var(--s5);
  align-items:stretch;
}
@media (min-width:860px){
  .empaque-duo{
    grid-template-columns:1.15fr .85fr;
    gap:var(--s6);
  }
}
.empaque-foto{
  margin:0;position:relative;overflow:hidden;
  border-radius:var(--r-xl);
  background:var(--surface);
  border:1px solid color-mix(in srgb,var(--rule) 55%,transparent);
  box-shadow:0 20px 40px rgba(20,24,31,.07);
  aspect-ratio:4/3;
}
.empaque-foto-alta{aspect-ratio:3/4}
.empaque-foto img{
  width:100%;height:100%;object-fit:cover;object-position:50% 45%;
  filter:contrast(1.04) saturate(1.04);
  transition:transform .8s cubic-bezier(.22,1,.36,1);
}
.empaque-foto:hover img{transform:scale(1.03)}
.empaque-foto figcaption{
  position:absolute;left:var(--s4);bottom:var(--s4);z-index:2;
  font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:var(--hueso);
  text-shadow:0 1px 12px rgba(14,18,24,.55);
}
.empaque-aviso{
  text-align:center;font-size:13px;margin:0 auto var(--s2);
  max-width:46ch;
}

/* ---- PDP: producto primero + capa de decisión ---- */
.pdp-migas{padding-top:var(--s5)}
.pdp{display:grid;gap:var(--s7);padding-block:var(--s7) var(--s10)}
@media (min-width:900px){.pdp{grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--s9) var(--s8)}}
.pdp-galeria{display:grid;gap:var(--s4)}
.pdp-escena{
  position:relative;
  aspect-ratio:4/5;border-radius:var(--r-xl);overflow:hidden;
  background:var(--estudio);
  display:grid;place-items:center;padding:0;
  box-shadow:0 24px 48px rgba(20,24,31,.12);
}
.pdp-hero-foto{
  width:100%;height:100%;object-fit:cover;
  object-position:50% 38%;
  filter:contrast(1.05) saturate(1.04);
  transition:transform .8s cubic-bezier(.22,1,.36,1),filter .4s ease-out,opacity .2s ease-out;
}
.pdp-escena:hover .pdp-hero-foto{filter:contrast(1.07) saturate(1.05)}
.pdp-lente{
  width:100%;height:100%;grid-area:1/1;
  transform-origin:0 0;
}
.pdp-escena{cursor:zoom-in;touch-action:pan-y;user-select:none}
.pdp-escena-cerca{cursor:grab;touch-action:none}
.pdp-escena-arrastra{cursor:grabbing}
.pdp-mando{
  position:absolute;z-index:3;left:var(--s3);bottom:var(--s3);
  display:grid;grid-template-columns:44px 44px 44px;gap:var(--s1);
  grid-template-areas:". arriba ." "izq abajo der";
}
.pdp-mando[hidden]{display:none}
.pdp-mando button{
  width:44px;height:44px;border:0;border-radius:50%;
  background:rgba(246,242,234,.94);color:var(--noche);
  box-shadow:0 6px 18px rgba(14,18,24,.18);
  cursor:pointer;font-size:1.15rem;
}
.pdp-mando button:focus-visible{outline:2px solid var(--cochinilla);outline-offset:2px}
.pdp-mando [data-pdp-mover="0,-1"]{grid-area:arriba}
.pdp-mando [data-pdp-mover="-1,0"]{grid-area:izq}
.pdp-mando [data-pdp-mover="0,1"]{grid-area:abajo}
.pdp-mando [data-pdp-mover="1,0"]{grid-area:der}
.pdp-lente-ayuda{
  margin:var(--s3) 0 0;font-size:14px;line-height:1.45;color:var(--soft);
}
.pdp-visor-controles{
  position:absolute;inset:0;z-index:2;
  pointer-events:none;
}
.pdp-visor-flecha,
.pdp-visor-zoom{
  pointer-events:auto;
  position:absolute;
  width:44px;height:44px;border:0;border-radius:50%;
  background:rgba(246,242,234,.92);color:var(--noche);
  box-shadow:0 6px 18px rgba(14,18,24,.18);
  cursor:pointer;display:grid;place-items:center;
  transition:background-color .2s ease,transform .2s ease;
}
.pdp-visor-flecha{font-size:1.5rem;line-height:1;top:50%;transform:translateY(-50%)}
.pdp-visor-flecha[data-pdp-prev]{left:var(--s3)}
.pdp-visor-flecha[data-pdp-next]{right:var(--s3)}
.pdp-visor-zoom{right:var(--s3);bottom:var(--s3)}
.pdp-visor-flecha:hover,
.pdp-visor-zoom:hover{background:#fff;transform:translateY(-50%) scale(1.06)}
.pdp-visor-zoom:hover{transform:scale(1.06)}
.pdp-visor-flecha:focus-visible,
.pdp-visor-zoom:focus-visible{
  outline:2px solid var(--cochinilla);outline-offset:2px;
}
.pdp-lupa{
  border:0;padding:0;max-width:min(96vw,1100px);max-height:94vh;
  width:100%;background:transparent;
}
.pdp-lupa::backdrop{background:rgba(10,12,16,.82)}
.pdp-lupa[open]{
  display:grid;place-items:center;
  position:fixed;inset:0;margin:auto;
}
.pdp-lupa-foto{
  max-width:min(92vw,1000px);max-height:88vh;
  width:auto;height:auto;object-fit:contain;
  border-radius:var(--r);background:var(--estudio);
  box-shadow:0 24px 60px rgba(0,0,0,.35);
}
.pdp-lupa-cerrar,
.pdp-lupa-flecha{
  position:fixed;z-index:2;
  width:44px;height:44px;border:0;border-radius:50%;
  background:rgba(246,242,234,.94);color:var(--noche);
  cursor:pointer;display:grid;place-items:center;
  font-size:1.4rem;line-height:1;
  box-shadow:0 8px 20px rgba(0,0,0,.25);
}
.pdp-lupa-cerrar{top:var(--s5);right:var(--s5);font-size:1.6rem}
.pdp-lupa-prev{left:var(--s5);top:50%;transform:translateY(-50%)}
.pdp-lupa-next{right:var(--s5);top:50%;transform:translateY(-50%)}
.pdp-lupa-cerrar:focus-visible,
.pdp-lupa-flecha:focus-visible{
  outline:2px solid var(--plata-viva);outline-offset:2px;
}
@media (max-width:767px){
  .pdp-visor-flecha[data-pdp-prev]{left:var(--s2)}
  .pdp-visor-flecha[data-pdp-next]{right:var(--s2)}
  .pdp-visor-zoom{right:var(--s2);bottom:var(--s2)}
  .pdp-lupa-prev{left:var(--s3)}
  .pdp-lupa-next{right:var(--s3)}
}
@media (prefers-reduced-motion:reduce){
  .pdp-hero-foto{transition:opacity .15s ease}
  .pdp-escena:hover .pdp-hero-foto{transform:none}
}
.pdp-escena .giro{
  width:min(74%,300px);opacity:.4;margin:var(--s7);
}
.pdp-escena .giro.giro-listo{opacity:1}
.pdp-escena .giro-pista{color:var(--plata);bottom:calc(-1 * var(--s5))}
.pdp-escena .giro-pista::before,
.pdp-escena .giro-pista::after{background:var(--plata)}
.pdp-escena .giro:focus-visible{outline-color:var(--plata-viva)}
.pdp-foto{aspect-ratio:1;border-radius:var(--r-lg);overflow:hidden;
  background:var(--surface);border:1px solid var(--rule);display:grid;place-items:center}
.pdp-foto img{
  width:100%;height:100%;object-fit:cover;
  transition:transform .65s cubic-bezier(.22,1,.36,1);
}
.pdp-foto:hover img{transform:scale(1.06)}
.pdp-miniaturas{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(5.5rem,1fr));
  gap:var(--s3);
  margin-top:var(--s4);
  max-width:32rem;
}
.pdp-miniaturas .pdp-foto{aspect-ratio:1}
.pdp-miniatura-btn{
  aspect-ratio:1;border-radius:var(--r);overflow:hidden;
  background:var(--surface);border:1.5px solid color-mix(in srgb,var(--rule) 80%,transparent);
  padding:0;cursor:pointer;position:relative;
  transition:border-color .2s ease-out,transform .2s ease-out,box-shadow .2s ease-out;
}
.pdp-miniatura-btn:hover{
  border-color:var(--plata);transform:translateY(-2px);
  box-shadow:0 6px 14px rgba(20,24,31,.08);
}
.pdp-miniatura-btn.pdp-miniatura-activa{
  border-color:var(--noche);box-shadow:0 0 0 1px var(--noche);
}
.pdp-miniatura-btn img{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .4s ease-out;
}
.pdp-miniatura-btn:hover img{transform:scale(1.06)}
.pdp-miniatura-btn span{
  position:absolute;bottom:3px;left:50%;transform:translateX(-50%);
  font-family:var(--sans);font-size:9px;font-weight:700;
  letter-spacing:.08em;text-transform:uppercase;
  color:var(--noche);background:rgba(255,255,255,.94);
  padding:1px 6px;border-radius:99px;white-space:nowrap;
  box-shadow:0 1px 4px rgba(0,0,0,.1);line-height:1.4;
}
.pdp-datos{align-self:start}
@media (min-width:900px){.pdp-datos{position:sticky;top:96px}}
.pdp-decision{display:flex;flex-direction:column;align-items:stretch;gap:0}
.pdp-nombre{
  font-size:clamp(2.1rem,4.2vw,3rem);margin-top:var(--s3);line-height:1.02;
  letter-spacing:-.03em;
}
.pdp-datos .precio{
  font-family:var(--serif);font-variation-settings:var(--disp);
  font-weight:400;font-size:clamp(1.75rem,3vw,2.2rem);
  display:block;margin:var(--s4) 0 0;
  font-variant-numeric:tabular-nums;letter-spacing:-.02em;
}
.pdp-lead{
  margin:var(--s4) 0 var(--s5);max-width:34ch;color:var(--soft);
  font-size:1.08rem;line-height:1.55;
}
.pdp-whatsapp{margin-top:var(--s4);align-self:flex-start}
.pdp-talla{margin:0 0 var(--s5);display:grid;gap:var(--s2);max-width:20rem}
.pdp-talla-label{
  font-size:15px;font-weight:600;letter-spacing:0;text-transform:none;
  color:var(--noche);
}
.pdp-talla-select{
  font-family:var(--sans);font-size:15px;color:var(--noche);
  min-height:48px;padding:var(--s3) var(--s4);border-radius:var(--r);
  border:1px solid var(--rule);background:var(--surface);cursor:pointer;
}
.pdp-talla-select[aria-invalid="true"]{border-color:var(--cochinilla)}
.pdp-talla-ayuda{margin:0;font-size:13px;color:var(--soft)}
.pdp-guia{margin-top:var(--s2)}
.pdp-guia summary{cursor:pointer;font-weight:600;font-size:14px;min-height:44px;display:flex;align-items:center}
.pdp-guia p{margin:0 0 var(--s3);font-size:14px;line-height:1.5;color:var(--soft)}
.pdp-qty{
  display:flex;align-items:center;gap:var(--s2);margin:0 0 var(--s4);
}
.pdp-qty button{
  width:44px;height:44px;border:1px solid var(--rule);border-radius:var(--r);
  background:var(--surface);color:var(--noche);font-size:1.25rem;cursor:pointer;
}
.pdp-qty button:disabled{opacity:.4;cursor:default}
.pdp-qty button:focus-visible{outline:2px solid var(--cochinilla);outline-offset:2px}
.pdp-qty [data-pdp-qty]{
  min-width:2ch;text-align:center;font-weight:600;font-variant-numeric:tabular-nums;
}
.pdp-qty-nota{margin:calc(var(--s2) * -1) 0 var(--s4);font-size:14px;color:var(--soft)}
.pdp-notas{margin-top:var(--s4);border-top:1px solid var(--rule)}
.pdp-notas details{border-bottom:1px solid var(--rule)}
.pdp-notas summary{
  min-height:44px;display:flex;align-items:center;cursor:pointer;
  font-weight:600;font-size:15px;
}
.pdp-notas summary:focus-visible{outline:2px solid var(--cochinilla);outline-offset:2px}
.pdp-notas p{margin:0 0 var(--s4);font-size:15px;line-height:1.5;color:var(--soft)}
.pdp-notas .enlace-apple{margin-bottom:var(--s4)}
.medios-pdp{margin:0 0 var(--s4);padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:var(--s2) var(--s4)}
.medios-pdp li{font-size:13px;color:var(--faint)}
.pastilla[disabled]{opacity:.55;cursor:not-allowed}
.insignia.insignia-vendida{background:var(--noche)}
.pdp-talla{scroll-margin-top:calc(var(--cab-h) + var(--s6))}
.pdp-confianza{
  list-style:none;margin:var(--s5) 0 0;padding:var(--s4) 0 0;
  border-top:1px solid var(--rule);
  display:flex;flex-wrap:wrap;gap:var(--s2) var(--s5);
}
.pdp-confianza li{
  font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--soft);
}
.pdp-specs{width:100%;border-collapse:collapse;margin-block:var(--s6) 0;font-size:15px}
.pdp-specs th{text-align:left;font-weight:600;color:var(--soft);
  padding:var(--s3) 0;width:45%;border-bottom:1px solid var(--rule);
  font-size:12px;letter-spacing:.12em;text-transform:uppercase}
.pdp-specs td{padding:var(--s3) 0;border-bottom:1px solid var(--rule)}
.pdp-oficio{margin-top:var(--s6);padding-top:var(--s5);border-top:1px solid var(--rule)}
.pdp-oficio-titulo{
  font-size:clamp(1.2rem,2vw,1.5rem);margin:0 0 var(--s3);
}
.pdp-oficio .gris{max-width:62ch;font-size:15px;margin:0 0 var(--s3)}
.pdp-oficio .enlace-apple{margin-top:var(--s2)}
[data-leer-mas]:not(.abierto) .texto-largo-resto{display:none}
[data-leer-mas] .enlace-apple{
  margin-top:var(--s3);background:none;border:0;padding:0;cursor:pointer;
  font-family:var(--sans);
}

.pdp-info{margin-top:var(--s6);border-top:1px solid var(--rule)}
.pdp-info-item{border-bottom:1px solid var(--rule)}
.pdp-info-item summary{
  display:flex;align-items:center;justify-content:space-between;gap:var(--s3);
  min-height:48px;padding:var(--s3) 0;cursor:pointer;list-style:none;
  font-size:15px;font-weight:600;color:var(--noche);
}
.pdp-info-item summary::-webkit-details-marker{display:none}
.pdp-info-item summary::after{
  content:'+';font-size:20px;line-height:1;color:var(--soft);
  transition:transform .2s ease;
}
.pdp-info-item[open] summary::after{transform:rotate(45deg)}
.pdp-info-item summary:focus-visible{outline:2px solid var(--cochinilla);outline-offset:2px}
.pdp-info-item p{margin:0 0 var(--s4);font-size:15px;line-height:1.6;color:var(--soft)}
@media (prefers-reduced-motion:reduce){.pdp-info-item summary::after{transition:none}}

.pdp-barra-datos{display:flex;flex-direction:column;gap:2px;min-width:0}
.pdp-barra-nombre{
  font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  max-width:42vw;
}

/* barra fija de compra: siempre a mano en móvil (factor Mejuri) */
.pdp-barra{
  display:none;position:fixed;z-index:70;
  left:0;right:0;bottom:0;
  padding:var(--s3) var(--s5);
  padding-bottom:max(var(--s3),env(safe-area-inset-bottom));
  background:color-mix(in srgb,var(--hueso) 92%,transparent);
  backdrop-filter:blur(12px);
  border-top:1px solid var(--rule);
  align-items:center;justify-content:space-between;gap:var(--s4);
}
.pdp-barra .precio{
  font-family:var(--serif);font-variation-settings:var(--disp);
  font-weight:400;font-size:1.35rem;font-variant-numeric:tabular-nums;
}
.pdp-barra .pastilla{flex:none;padding-inline:var(--s5)}
@media (max-width:899px){
  .pdp-barra{display:flex}
  body:has(.pdp-barra){padding-bottom:calc(var(--s8) + env(safe-area-inset-bottom))}
  body:has(.pdp-barra) .toast{bottom:calc(var(--s8) + var(--s5))}
}

/* ---- taller ---- */
.taller-heroe{padding-block:var(--s10) var(--s9)}
.taller-heroe h1{max-width:12ch;letter-spacing:-.03em}
.capitulo{padding-block:var(--s8)}
.capitulo-int{display:grid;gap:var(--s7);align-items:center}
@media (min-width:860px){
  .capitulo-int{grid-template-columns:1fr 1fr}
  .capitulo:nth-of-type(even) .capitulo-int>figure{order:2}
}
.capitulo h2{margin-top:var(--s3)}
.capitulo-lead{margin-top:var(--s4)}
.capitulo .enlace-apple{margin-top:var(--s3)}
.capitulo figure{margin:0}
.capitulo .oficio-imagen{background:var(--surface);border-color:var(--rule)}

.pedido-ok{padding-block:var(--s10) var(--s9)}
.pedido-resumen{
  margin-top:var(--s6);max-width:28rem;text-align:left;
  padding:var(--s5);border:1px solid var(--rule);border-radius:var(--r-lg);
  background:var(--surface);
}
.pedido-estado{
  margin:0 0 var(--s4);font-size:12px;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;color:var(--soft);
}
.pedido-lista{list-style:none;margin:0;padding:0}
.pedido-lista li{
  display:flex;justify-content:space-between;gap:var(--s4);
  padding:var(--s3) 0;border-bottom:1px solid var(--rule);font-size:15px;
}
.pedido-lista li:last-child{border-bottom:0}
.pedido-total{
  display:flex;justify-content:space-between;align-items:baseline;
  margin:var(--s4) 0 0;font-weight:600;
}
.pedido-vacio{margin:var(--s5) auto 0}

/* ---- estampado de fondo ---- */
.fondo-estampado{position:relative}
.fondo-estampado::before{
  content:"";position:absolute;inset:0;
  background-image:var(--estampado-url);
  background-size:340px;opacity:.05;pointer-events:none;
}
.fondo-estampado>*{position:relative}

/* ---- toast ---- */
.toast{
  position:fixed;bottom:var(--s6);left:50%;translate:-50% 0;
  background:var(--noche);color:var(--hueso);
  padding:var(--s3) var(--s5);border-radius:var(--r);
  font-size:14px;font-weight:600;letter-spacing:.04em;
  opacity:0;pointer-events:none;transition:opacity .2s ease-out;
  z-index:95;
}
.toast.visible{opacity:1}
.bolsa-aviso{
  margin:0;padding:var(--s3) var(--s5);
  background:var(--noche);color:var(--hueso);
  font-size:14px;font-weight:600;
}
.bolsa-aviso[hidden]{display:none}

/* ---- reveal sobrio: solo opacity/transform, una vez ---- */
.aparece{opacity:0;translate:0 18px;transition:opacity .65s cubic-bezier(.22,1,.36,1),translate .65s cubic-bezier(.22,1,.36,1)}
.aparece.visto{opacity:1;translate:0 0}
.aparece-atras{transition-delay:.08s}
.aparece-mas{transition-delay:.16s}
@media (prefers-reduced-motion:reduce){
  .aparece{opacity:1;translate:0 0}
  .pastilla:hover,.pieza:hover,.azulejo-medio:hover,.heroe-pieza:hover img,
  .pieza:hover .pieza-imagen img,.enlace-apple:hover,.puerta:hover{transform:none;box-shadow:none}
}

/* ---- home: puertas, escaparate, taller estudio, envío ---- */
#escaparate,
.puertas,
.envio-franja{scroll-margin-top:var(--cab-h)}

.pagina-maqueta{padding-bottom:var(--s10)}
.heroe-maqueta{height:auto}
.heroe-maqueta .heroe-fijo{
  position:relative;
  min-height:100vh;
  height:100svh;
}
.heroe-maqueta .heroe-relato .escena{pointer-events:auto}
.heroe-maqueta .escena-poste-centro{bottom:18%}
@media (max-width:899px){
  .heroe-maqueta .escena-poste-centro{bottom:22%}
}
.puertas{
  display:grid;gap:var(--s4);
  padding:var(--s4);
  background:var(--hueso);
}
@media (min-width:860px){
  .puertas{grid-template-columns:repeat(3,1fr);gap:var(--s5);padding:var(--s5)}
}
.puerta{
  display:flex;flex-direction:column;align-items:flex-start;text-align:left;
  text-decoration:none;color:var(--noche);
  padding:var(--s7) var(--s5) var(--s5);
  background:var(--surface);
  border-radius:var(--r-lg);
  border:1px solid color-mix(in srgb,var(--rule) 70%,transparent);
  min-height:44px;
  transition:border-color .22s ease-out,transform .22s ease-out;
}
.puerta:hover{
  border-color:color-mix(in srgb,var(--rule) 100%,transparent);
  transform:translateY(-2px);
}
.puerta .azulejo-nombre{margin:0 0 var(--s3);text-align:left}
.puerta .azulejo-titulo-m{text-align:left}
.puerta .enlace-apple{margin-top:var(--s6)}
.puerta-foto{
  margin-top:var(--s5);width:100%;aspect-ratio:4/5;overflow:hidden;
  border-radius:var(--r);background:var(--hueso);
}
.puerta-foto img{width:100%;height:100%;object-fit:cover;display:block}

.escaparate-home,
.escaparate-maqueta{
  padding-block:var(--s9) var(--s8);
  text-align:center;
  background:var(--surface);
}
.escaparate-int{
  max-width:var(--ancho);
  margin-inline:auto;
  padding-inline:var(--s5);
}
.escaparate-home .respiracion-marca,
.escaparate-maqueta .respiracion-marca{margin-inline:auto}
.escaparate-home .respiracion-texto,
.escaparate-maqueta .respiracion-texto{margin-top:var(--s3)}
.escaparate-home .reticula-igual,
.escaparate-maqueta .reticula-igual{
  padding-block:var(--s7) 0;
  padding-inline:0;
  max-width:none;
  margin-inline:0;
  gap:var(--s6);
}
@media (min-width:720px){
  .escaparate-home .reticula-igual,
  .escaparate-maqueta .reticula-igual{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:var(--s6);
  }
}
.escaparate-maqueta .pieza:hover{transform:none}
.escaparate-maqueta .pieza-imagen{
  aspect-ratio:3/4;
  box-shadow:none;
  border-radius:var(--r-lg);
}
.escaparate-maqueta .pieza:hover .pieza-imagen{box-shadow:none}
.escaparate-home .pieza-datos,
.escaparate-maqueta .pieza-datos{
  text-align:center;
  padding-top:var(--s4);
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:0;
}
.escaparate-home .pieza-meta,
.escaparate-maqueta .pieza-meta{
  display:block;
  margin-top:var(--s2);
}
.escaparate-home .insignia,
.escaparate-maqueta .insignia{left:var(--s3);top:var(--s3)}
.escaparate-home .pieza .precio,
.escaparate-maqueta .pieza .precio{margin-top:var(--s3)}
.escaparate-home .pieza .enlace-quieto,
.escaparate-maqueta .pieza .enlace-quieto{
  margin-top:var(--s3);
  color:var(--noche);
  font-size:14px;
  font-weight:500;
  letter-spacing:0;
}
.escaparate-home .azulejo-enlaces,
.escaparate-maqueta .azulejo-enlaces{
  margin-top:var(--s6);
  padding-bottom:0;
}
.estudio-aviso{
  margin:var(--s5) auto 0;max-width:42ch;
  font-size:13px;color:var(--plata);
}
.taller-estudio{
  display:grid;gap:var(--s4);
  max-width:min(920px,92vw);
  margin:var(--s8) auto 0;
  padding-inline:var(--s5);
}
@media (min-width:800px){
  .taller-estudio{grid-template-columns:1.15fr .85fr;gap:var(--s5);padding-inline:0}
}
.taller-estudio img{
  width:100%;height:100%;object-fit:cover;display:block;
  border-radius:var(--r-lg);
  aspect-ratio:4/3;
}
.taller-estudio img:last-child{aspect-ratio:3/4}
.envio-franja{
  padding:var(--s7) var(--s5);
  background:var(--surface);
  border-top:1px solid var(--rule);
}
.envio-franja-int{
  display:grid;gap:var(--s6);align-items:center;
  max-width:var(--ancho);margin-inline:auto;
}
@media (min-width:800px){
  .envio-franja-int{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s7)}
}
.envio-franja .azulejo-nombre{text-align:left;margin:0 0 var(--s3)}
.envio-franja .azulejo-titulo-m{text-align:left}
.envio-franja .envio-copy{margin:var(--s3) 0 0;max-width:36ch;color:var(--soft);text-align:left}
.envio-minis{display:grid;grid-template-columns:1fr 1fr;gap:var(--s4)}
.envio-minis .empaque-foto{aspect-ratio:4/3}
.maqueta-cinta{
  position:fixed;left:0;right:0;bottom:0;z-index:60;
  display:flex;flex-wrap:wrap;align-items:center;justify-content:center;
  gap:var(--s3) var(--s5);
  min-height:44px;padding:var(--s3) var(--s5);
  background:var(--noche);color:var(--hueso);
  font-size:13px;font-weight:600;
}
.maqueta-cinta a{color:var(--plata-viva)}
.maqueta-cinta a:hover{color:var(--hueso)}
.pagina-maqueta .toast{bottom:calc(var(--s8) + var(--s3))}

/* ============================================================
   NUEVA PORTADA D'LEONOR — SECCIONES DE ALTA JOYERÍA
   Inspiración: Crystal, Maison Élysée, Novatek, SunVera Jolie, Makao
   ============================================================ */

/* ---- Hero Crystal / Maison Élysée ---- */
.heroe-crystal{
  position:relative;overflow:hidden;
  min-height:100svh;
  display:flex;align-items:flex-end;
  background:var(--grafito-bajo);
  padding-block:calc(var(--cab-h) + var(--s8)) var(--s9);
}
.heroe-crystal-bg{
  position:absolute;inset:0;pointer-events:none;z-index:1;
}
.heroe-carrusel-pista{position:absolute;inset:0}
.heroe-carrusel-slide{
  position:absolute;inset:0;
  opacity:0;
  transition:opacity 1.1s ease;
  pointer-events:none;
}
.heroe-carrusel-slide.is-activa{opacity:1;z-index:1}
.heroe-crystal-foto{
  width:100%;height:100%;object-fit:cover;
  object-position:68% 82%;
  filter:contrast(1.04) saturate(1.06) brightness(1.02);
}
.heroe-crystal-velo{
  position:absolute;inset:0;z-index:2;pointer-events:none;
  background:
    linear-gradient(90deg, rgba(16,21,29,.62) 0%, rgba(16,21,29,.22) 34%, rgba(16,21,29,0) 62%),
    linear-gradient(180deg, rgba(16,21,29,.22) 0%, transparent 32%, rgba(16,21,29,.45) 100%);
}
.heroe-carrusel-nav{
  position:absolute;z-index:3;
  left:50%;bottom:var(--s5);transform:translateX(-50%);
  display:flex;gap:var(--s2);align-items:center;
  pointer-events:auto;
}
.heroe-carrusel-punto{
  width:44px;height:44px;padding:0;border:0;border-radius:50%;
  background:transparent;cursor:pointer;position:relative;
}
.heroe-carrusel-punto::after{
  content:'';position:absolute;left:50%;top:50%;
  width:var(--s3);height:var(--s3);border-radius:50%;
  transform:translate(-50%,-50%);
  background:rgba(246,242,234,.38);
  transition:background-color .25s ease, transform .25s ease, width .25s ease, height .25s ease;
}
.heroe-carrusel-punto.is-activa::after{
  background:var(--hueso);
  width:var(--s4);height:var(--s4);
}
.heroe-carrusel-punto:focus-visible{
  outline:2px solid var(--plata-viva);
  outline-offset:2px;
}
.heroe-crystal-contenido{
  position:relative;z-index:2;width:100%;
}
.heroe-crystal-cuerpo{
  max-width:28rem;
}
.heroe-crystal-etiqueta{
  color:var(--plata-viva);
  letter-spacing:.02em;
  margin-bottom:var(--s4);
}
.heroe-crystal-titulo{
  font-size:clamp(2.7rem,6.8vw,5.2rem);
  line-height:.96;
  color:var(--hueso);
  margin-bottom:var(--s5);
  text-wrap:balance;
  text-shadow:0 2px 20px rgba(0,0,0,.35);
}
.heroe-crystal-lead{
  font-size:clamp(1.08rem,1.9vw,1.26rem);
  line-height:1.6;
  color:var(--plata-viva);
  max-width:54ch;
  margin-bottom:var(--s6);
}
.heroe-crystal-ctas{
  display:flex;flex-wrap:wrap;align-items:center;gap:var(--s5);
  margin-bottom:var(--s7);
}
.heroe-crystal-ctas .pastilla{
  background:var(--hueso);color:var(--noche);
  padding:14px 28px;font-size:16px;
}
.heroe-crystal-ctas .pastilla:hover{background:#fff}
.heroe-crystal-ctas .enlace-apple{
  color:var(--hueso);font-size:16px;
}
.heroe-crystal-ctas .enlace-apple:hover{
  color:var(--plata-viva);
}
.heroe-crystal-sellos{
  display:flex;flex-wrap:wrap;gap:var(--s3);
}
.heroe-sello{
  display:inline-flex;align-items:center;gap:8px;
  background:rgba(255,255,255,.06);backdrop-filter:blur(10px);
  border:1px solid rgba(201,204,199,.22);
  border-radius:24px;padding:6px 14px;
  font-size:12px;font-weight:600;letter-spacing:.04em;
  color:var(--plata-viva);
}
.heroe-sello svg{color:var(--hueso)}
@media (max-width:767px){
  .heroe-crystal{
    display:grid;
    grid-template-columns:1fr;
    grid-template-rows:minmax(52vh,420px) auto;
    min-height:0;
    align-items:stretch;
    padding:0;
    background:linear-gradient(180deg,var(--grafito-alto) 0%,var(--grafito-bajo) 100%);
  }
  .heroe-crystal-bg{
    position:relative;inset:auto;
    grid-row:1;grid-column:1;
    height:100%;min-height:0;overflow:hidden;
  }
  .heroe-crystal-foto{
    object-position:62% 74%;
  }
  .heroe-crystal-velo{
    background:
      linear-gradient(180deg, rgba(8,10,15,.2) 0%, transparent 35%, rgba(16,21,29,.55) 100%);
  }
  .heroe-crystal-contenido{
    grid-row:2;grid-column:1;
    padding:var(--s6) 0 var(--s7);
  }
  .heroe-crystal-cuerpo{max-width:100%}
  .heroe-crystal-etiqueta{
    letter-spacing:.02em;font-size:13px;margin-bottom:var(--s3);
  }
  .heroe-crystal-titulo{
    font-size:clamp(1.85rem,7vw,2.35rem);
    line-height:1.08;margin-bottom:var(--s4);
    text-shadow:none;
  }
  .heroe-crystal-lead{
    display:block;
    font-size:15px;line-height:1.5;
    max-width:34ch;margin-bottom:var(--s5);
    color:var(--plata-viva);
  }
  .heroe-crystal-ctas{
    flex-direction:column;align-items:stretch;
    gap:var(--s3);margin-bottom:0;
  }
  .heroe-crystal-ctas .pastilla{
    width:100%;justify-content:center;
    padding:var(--s3) var(--s5);font-size:15px;
  }
  .heroe-crystal-ctas .enlace-apple{font-size:15px}
  .heroe-crystal-sellos{display:none}
  .heroe-crystal .heroe-carrusel-nav{
    grid-row:1;grid-column:1;
    align-self:end;justify-self:center;
    position:relative;left:auto;bottom:var(--s4);
    transform:none;z-index:3;
  }
}
@media (prefers-reduced-motion:reduce){
  .heroe-carrusel-slide{transition:none}
}

/* ---- Barra de Confianza (adelgazada, iconos unificados) ---- */
.barra-confianza{
  background:var(--surface);
  border-block:1px solid var(--rule);
  padding-block:var(--s5);
}
.barra-confianza-grid{
  display:grid;grid-template-columns:1fr;gap:var(--s4);
}
@media (min-width:640px){
  .barra-confianza-grid{grid-template-columns:repeat(2,1fr);gap:var(--s5)}
}
@media (min-width:1024px){
  .barra-confianza-grid{grid-template-columns:repeat(4,1fr);gap:0}
  .pilar-confianza{
    padding:var(--s2) var(--s5);
    border-left:1px solid var(--rule);
    border-radius:0;
  }
  .barra-confianza-grid .pilar-confianza:first-child{border-left:0;padding-left:0}
}
.pilar-confianza{
  display:flex;align-items:flex-start;gap:var(--s3);
  text-decoration:none;color:inherit;
  border-radius:var(--r);padding:var(--s2);
  transition:background-color .2s ease-out;
}
a.pilar-confianza:hover{background:transparent}
a.pilar-confianza:focus-visible{
  outline:2px solid var(--cochinilla);outline-offset:2px;
}
.pilar-icono{
  display:grid;place-items:center;flex:none;
  width:44px;height:44px;border-radius:50%;
  color:var(--noche);background:var(--hueso);
  border:1px solid var(--rule);
}
.pilar-texto h3{
  font-family:var(--sans);font-weight:600;font-size:16px;
  letter-spacing:0;margin:0 0 var(--s1);color:var(--noche);
  text-transform:none;
}
.pilar-texto p{
  font-size:14px;line-height:1.4;color:var(--noche);
  margin:0;max-width:30ch;
}
.heroe-crystal-sellos .heroe-sello svg{width:15px;height:15px}

/* ---- Acceso Rápido por Categorías (Aurelie / Lumière) ---- */
.seccion-categorias{
  padding-block:var(--s8) var(--s6);
  background:var(--hueso);
}
.seccion-cabecera-centro{
  text-align:center;max-width:36rem;margin:0 auto var(--s8);
}
.seccion-cabecera-centro .etiqueta{
  display:inline-block;
  letter-spacing:.2em;
}
.seccion-titulo{
  font-size:clamp(2.15rem,4.6vw,3.1rem);margin-top:var(--s3);
  letter-spacing:-.03em;
}
.seccion-sub{
  font-size:17px;line-height:1.55;color:var(--soft);margin:var(--s3) auto 0;
  max-width:36ch;
}
.categorias-grid{
  display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s4);
}
@media (min-width:768px){
  .categorias-grid{grid-template-columns:repeat(5,1fr);gap:var(--s5)}
}
.categoria-card{
  display:flex;flex-direction:column;align-items:center;text-align:center;
  text-decoration:none;color:inherit;
  padding:var(--s5) var(--s4);border-radius:var(--r-lg);
  background:var(--surface);border:1px solid color-mix(in srgb,var(--rule) 60%,transparent);
  transition:transform .35s cubic-bezier(.2,1,.3,1),border-color .3s ease-out,box-shadow .35s ease-out;
}
.categoria-card:hover{
  transform:translateY(-4px);border-color:var(--rule);
  box-shadow:0 16px 32px rgba(20,24,31,.08);
}
.categoria-foto-wrap{
  width:110px;height:110px;border-radius:50%;overflow:hidden;
  position:relative;background:radial-gradient(circle, color-mix(in srgb,var(--plata) 18%,var(--surface)), var(--surface));
  margin-bottom:var(--s4);border:1px solid color-mix(in srgb,var(--rule) 50%,transparent);
}
@media (min-width:1024px){
  .categoria-foto-wrap{width:130px;height:130px}
}
.categoria-foto-wrap img{
  width:100%;height:100%;object-fit:cover;object-position:50% 40%;
  transition:transform .5s cubic-bezier(.2,1,.3,1);
}
.categoria-card:hover .categoria-foto-wrap img{
  transform:scale(1.08);
}
.categoria-info h3{
  font-family:var(--serif);font-size:1.15rem;margin:0 0 4px;
}
.categoria-info span{
  font-size:12px;color:var(--faint);display:block;
}
.categoria-card-especial .insignia{
  position:absolute;top:auto;bottom:6px;left:50%;transform:translateX(-50%);
  font-size:9px;padding:3px 8px;white-space:nowrap;line-height:1;
}

/* ---- Carrusel Horizontal de Esenciales (Featured Products) ---- */
.seccion-carrusel{
  padding-block:var(--s8);
  background:var(--surface);
  border-block:1px solid color-mix(in srgb,var(--rule) 70%,transparent);
}
.carrusel-cabecera{
  display:flex;align-items:flex-end;justify-content:space-between;
  gap:var(--s5);margin-bottom:var(--s6);
}
.carrusel-controles{
  display:flex;gap:var(--s2);
}
.carrusel-btn{
  width:44px;height:44px;border-radius:50%;
  background:var(--hueso);border:1px solid var(--rule);
  color:var(--noche);cursor:pointer;
  display:grid;place-items:center;
  transition:background .2s ease-out,border-color .2s ease-out,transform .2s ease-out;
}
.carrusel-btn:hover{
  background:var(--noche);color:var(--hueso);border-color:var(--noche);
  transform:scale(1.06);
}
.carrusel-pista{
  display:flex;gap:var(--s5);overflow-x:auto;scroll-snap-type:x mandatory;
  padding-bottom:var(--s5);padding-inline:2px;
  scrollbar-width:none;-webkit-overflow-scrolling:touch;
}
.carrusel-pista::-webkit-scrollbar{display:none}
.carrusel-pista .pieza{
  flex:0 0 270px;scroll-snap-align:start;
}
@media (min-width:768px){
  .carrusel-pista .pieza{flex:0 0 300px}
}
@media (min-width:1100px){
  .carrusel-pista .pieza{flex:0 0 320px}
}

/* ---- Escaparate de Obras Maestras (Makao / Resin) ---- */
.reticula-maestras{
  display:grid;grid-template-columns:1fr;gap:var(--s6);
}
@media (min-width:768px){
  .reticula-maestras{grid-template-columns:repeat(2,1fr);gap:var(--s6)}
}
@media (min-width:1100px){
  .reticula-maestras{grid-template-columns:repeat(4,1fr);gap:var(--s5)}
}
.reticula-maestras .pieza-imagen{
  aspect-ratio:3/4;
}
.pieza-imagen img[src*="assets/reales/"]{
  object-position:50% 50%;
}

/* ---- Sección Empaque & Certificado de Autenticidad (SunVera Jolie) ---- */
.seccion-empaque{
  padding-block:var(--s9);
  background:var(--surface);
  border-block:1px solid var(--rule);
}
.seccion-empaque-grid{
  display:grid;grid-template-columns:1fr;gap:var(--s7);align-items:center;
}
@media (min-width:960px){
  .seccion-empaque-grid{grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:var(--s8)}
}
.empaque-galeria{
  display:grid;gap:var(--s4);
}
.empaque-foto-principal{
  margin:0;border-radius:var(--r-lg);overflow:hidden;
  border:1px solid color-mix(in srgb,var(--rule) 70%,transparent);
  background:var(--hueso);box-shadow:0 18px 38px rgba(20,24,31,.07);
}
/* La foto es vertical (768x1024): con 4/3 y contain quedaban barras de fondo a los lados. */
.empaque-foto-principal img{
  width:100%;aspect-ratio:3/4;object-fit:cover;object-position:center;
  display:block;background:var(--hueso);
  transition:transform .55s cubic-bezier(.33,1,.32,1);
}
.empaque-foto-principal:hover img{
  transform:scale(1.02);
}
.empaque-subfotos{
  display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s4);
}
.empaque-miniatura{
  margin:0;border-radius:var(--r);overflow:hidden;
  border:1px solid color-mix(in srgb,var(--rule) 70%,transparent);
  background:#fff;
}
.empaque-miniatura img{
  width:100%;aspect-ratio:4/3;object-fit:cover;display:block;
  transition:transform .6s cubic-bezier(.2,1,.3,1);
}
.empaque-miniatura:hover img{
  transform:scale(1.03);
}
.empaque-caption{
  padding:var(--s2) var(--s3);font-size:12px;color:var(--soft);
  text-align:center;background:var(--surface);
}
.empaque-detalle{
  max-width:520px;
}
.empaque-pilares{
  display:grid;gap:var(--s4);margin-top:var(--s6);
}
.empaque-pilar{
  border-left:1px solid var(--plata);
  padding-left:var(--s4);
}
.empaque-pilar strong{
  display:block;font-size:15px;color:var(--noche);margin-bottom:2px;
}
.empaque-pilar p{
  font-size:14px;color:var(--soft);margin:0;line-height:1.5;
}

/* ---- Sección Oficio y Taller ---- */
.seccion-oficio{
  padding-block:var(--s9);
}
.taller-foto-card{
  margin:0;border-radius:var(--r-lg);overflow:hidden;
  border:1px solid rgba(201,204,199,.15);
  background:rgba(255,255,255,.03);
}
.taller-foto-card img{width:100%;height:auto;display:block}
.taller-foto-caption{
  padding:var(--s3);font-size:13px;color:var(--plata-viva);
  text-align:center;background:rgba(14,18,24,.8);
}

/* ---- Sección Cierre WhatsApp ---- */
.seccion-cierre-wa{
  padding-block:var(--s8);
  background:var(--hueso);
}
.cierre-wa-box{
  max-width:680px;margin:0 auto;text-align:center;
  padding:var(--s7) var(--s5);
  background:var(--surface);
  border-radius:var(--r-xl);
  border:1px solid var(--rule);
  box-shadow:0 14px 34px rgba(20,24,31,.05);
}
.cierre-wa-box .azulejo-enlaces{
  justify-content:center;margin-top:var(--s6);
}

/* ---- Dos líneas (filigrana | convencionales) ---- */
.seccion-dos-lineas{
  padding-block:var(--s6) var(--s7);
  background:var(--hueso);
}
.puertas-dos{
  display:grid;grid-template-columns:1fr;gap:var(--s5);
}
@media (min-width:800px){
  .puertas-dos{grid-template-columns:1fr 1fr;gap:var(--s6)}
}
.puerta-linea{
  min-height:0;
  display:flex;flex-direction:column;
  padding:var(--s6);
  background:var(--surface);
  border:1px solid color-mix(in srgb,var(--rule) 70%,transparent);
  border-radius:var(--r-xl);
  text-decoration:none;color:inherit;
  transition:transform .35s cubic-bezier(.2,1,.3,1),box-shadow .35s ease-out;
}
.puerta-linea:hover{
  transform:translateY(-3px);
  box-shadow:0 18px 40px rgba(20,24,31,.08);
}
.puerta-linea .puerta-foto{
  margin-top:var(--s5);border-radius:var(--r-lg);overflow:hidden;
  aspect-ratio:4/5;background:var(--estudio);
}
.puerta-linea .puerta-foto img{
  width:100%;height:100%;object-fit:cover;object-position:50% 40%;
  transition:transform .7s cubic-bezier(.2,1,.3,1);
}
.puerta-linea:hover .puerta-foto img{transform:scale(1.04)}
.puerta-linea .azulejo-titulo-m{text-wrap:balance;margin-block:var(--s3)}

/* ---- Catálogo en home ---- */
.seccion-catalogo{
  padding-block:var(--s8);
  background:var(--surface);
  border-block:1px solid color-mix(in srgb,var(--rule) 60%,transparent);
}
.seccion-catalogo-clara{background:var(--hueso)}
.catalogo-cabecera{
  display:flex;flex-wrap:wrap;align-items:flex-end;
  justify-content:space-between;gap:var(--s4);
  margin-bottom:var(--s6);
}
.catalogo-cabecera .azulejo-titulo-m{margin-top:var(--s2);text-wrap:balance}
.reticula-catalogo{
  display:grid;grid-template-columns:1fr 1fr;gap:var(--s5) var(--s4);
  padding-block:0;
}
@media (min-width:900px){
  .reticula-catalogo{grid-template-columns:repeat(4,1fr);gap:var(--s6) var(--s5)}
}
.reticula-catalogo .pieza-imagen{aspect-ratio:4/5}

/* ---- Premium / autor en home ---- */
.seccion-premium{
  padding-block:var(--s8);
  background:var(--surface);
}
.seccion-premium .seccion-titulo{text-wrap:balance}
#premium,#filigrana,#convencional,#catalogo-filigrana,#catalogo-convencional,#t-empaque,#t-taller-home{
  scroll-margin-top:calc(var(--cab-h) + var(--s4));
}

/* ---- Galería taller 2×2 ---- */
.taller-galeria{
  display:grid;grid-template-columns:1fr 1fr;gap:var(--s4);
}
@media (min-width:900px){
  .taller-galeria{gap:var(--s5)}
  .taller-galeria .taller-foto-card:nth-child(1){grid-row:span 2}
  .taller-galeria .taller-foto-card:nth-child(1) img{height:100%;object-fit:cover;aspect-ratio:3/4}
}
.taller-galeria .taller-foto-card img{
  width:100%;aspect-ratio:4/3;object-fit:cover;display:block;
}
.pdp-escena .giro,
.giro{
  opacity:.55;
}
.giro.giro-listo{opacity:1}
.pdp-escena{
  background:color-mix(in srgb,var(--estudio) 70%,#fff);
}

/* ---- Wireframe home: hero flechas ---- */
.heroe-carrusel-nav{
  gap:var(--s2);
}
.heroe-carrusel-flecha{
  width:44px;height:44px;border:0;border-radius:50%;
  background:rgba(246,242,234,.14);color:var(--hueso);
  font-size:1.4rem;line-height:1;cursor:pointer;
  display:grid;place-items:center;
}
.heroe-carrusel-flecha:hover{background:rgba(246,242,234,.28)}
.heroe-carrusel-flecha:focus-visible{
  outline:2px solid var(--plata-viva);outline-offset:2px;
}
.heroe-crystal > .heroe-carrusel-lado{
  position:absolute;top:50%;z-index:4;
  transform:translateY(-50%);
  background:#F2EEE6;color:#161C26;
}
.heroe-crystal > .heroe-carrusel-prev{left:var(--s5)}
.heroe-crystal > .heroe-carrusel-next{right:var(--s5)}
.heroe-crystal > .heroe-carrusel-lado:hover{background:#fff;color:#161C26}
@media (max-width:767px){
  .heroe-crystal > .heroe-carrusel-lado{
    top:calc(min(52vh, 420px) / 2);
  }
}

/* ---- Wireframe home: cabecera fila ---- */
.seccion-cabecera-fila{
  display:flex;flex-wrap:wrap;align-items:flex-end;
  justify-content:space-between;gap:var(--s4);margin-bottom:var(--s7);
}
.seccion-cabecera-fila .seccion-titulo{margin-top:var(--s2)}
.seccion-cabecera-fila .seccion-sub{margin:var(--s3) 0 0;text-align:left}

/* ---- Wireframe home: escenario productos ---- */
.seccion-destacados{
  padding-block:var(--s8);
  background:var(--hueso);
}
.cinta-piezas{padding-block:var(--s8)}
.cinta-piezas .seccion-cabecera-centro{margin-bottom:var(--s7)}
.cinta-piezas .seccion-titulo{color:var(--hueso)}
.cinta-piezas .seccion-sub{color:var(--plata-viva)}
.cinta-piezas .pieza-nombre{color:var(--hueso)}
.cinta-piezas .pieza-meta,
.cinta-piezas .enlace-quieto{color:var(--plata-viva)}
.cinta-piezas .pieza:hover .enlace-quieto{color:var(--hueso)}
.cinta-piezas .tipos-enlaces{
  border-top-color:color-mix(in srgb,var(--plata) 28%,transparent);
}
.cinta-piezas .tipos-enlaces a{color:var(--hueso)}
.cinta-piezas .tipos-enlaces .enlace-apple{color:var(--plata-viva)}
.cinta-piezas .tipos-enlaces a:focus-visible{outline-color:var(--plata-viva)}
.home-carrusel{
  display:grid;grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;gap:var(--s6);
  padding-inline:var(--s5);
}
.home-carrusel-ventana{overflow:hidden;min-width:0;padding-block:var(--s2)}
.home-carrusel-pista{
  display:flex;gap:var(--s5);width:max-content;
  will-change:transform;
}
.home-carrusel-pista .pieza{
  flex:0 0 min(16rem,62vw);width:min(16rem,62vw);margin:0;
}
.home-carrusel-flecha{
  width:44px;height:44px;border-radius:50%;
  border:1px solid transparent;background:var(--hueso);
  color:var(--noche);font-size:1.35rem;cursor:pointer;
  display:grid;place-items:center;flex:none;
}
.home-carrusel-flecha:hover{background:var(--plata-viva)}
.home-carrusel-flecha:focus-visible{outline:2px solid var(--plata-viva);outline-offset:2px}

.historias{background:var(--hueso)}
.historia{
  display:grid;grid-template-columns:1fr;
  border-top:1px solid var(--rule);
}
.historia-foto{
  position:relative;display:block;margin:0;
  overflow:hidden;background:#C4C5C2;text-decoration:none;color:var(--hueso);
}
.historia-foto img{
  width:100%;height:100%;object-fit:cover;object-position:center;
  aspect-ratio:3/2;display:block;
}
.historia-mosaico{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  width:100%;aspect-ratio:3/2;
}
.historia-mosaico img{aspect-ratio:auto;height:100%;object-position:center 40%}
.historia-foto .reserva{min-height:16rem}
.historia-ir{
  position:absolute;left:var(--s5);bottom:var(--s5);
  min-height:44px;display:inline-flex;align-items:center;
  padding:0 var(--s4);border-radius:999px;
  background:color-mix(in srgb,var(--hueso) 88%,transparent);
  color:var(--noche);font-size:14px;font-weight:500;
}
.historia-logo{
  color:var(--noche);width:min(18rem,82%);
  aspect-ratio:863 / 150;overflow:hidden;position:relative;
}
.historia-logo svg{
  position:absolute;left:0;top:0;display:block;
  width:100%;height:auto;
  transform:translateY(calc(-540 / 894 * 100%));
}
.historia-texto{
  display:flex;flex-direction:column;justify-content:center;
  padding:var(--s7) var(--gutter);gap:var(--s4);
}
.historia-titulo{
  font-size:clamp(1.8rem,3.2vw,2.6rem);margin:0;max-width:16ch;
}
.historia-texto .gris{margin:0;max-width:38ch}
@media (min-width:860px){
  .historia{
    grid-template-columns:1.05fr .95fr;align-items:stretch;
    height:calc(var(--s10) * 4);
  }
  .historia-inv .historia-foto{order:2}
  .historia-foto{height:100%;min-height:0}
  .historia-foto > img,
  .historia-foto .reserva{
    position:absolute;inset:0;width:100%;height:100%;
    aspect-ratio:auto;object-fit:cover;min-height:0;
  }
  .historia-mosaico{position:absolute;inset:0;aspect-ratio:auto;height:100%}
  .historia-texto{padding:var(--s7) clamp(var(--s6),4vw,var(--s8))}
  .historia-ave .historia-foto > img{object-position:50% 58%}
  .historia-ellos .historia-foto > img{object-position:46% 62%}
  .historia-anillos .historia-foto > img{object-position:50% 46%}
}
@media (prefers-reduced-motion:reduce){
  .pieza-rapido{transition:none}
}
.escenario-productos{position:relative}
/* Computador: retícula quieta. Celular: carrusel de una pieza (ver abajo). */
.escenario-pista{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--s6) var(--s5);
}
@media (min-width:900px){
  .escenario-pista{grid-template-columns:repeat(3,minmax(0,1fr))}
}
.escenario-item{margin:0;min-width:0}
.escenario-item .pieza{margin:0}
.escenario-controles{display:none}
@media (max-width:767px){
  .escenario-pista{
    display:block;position:relative;
    height:clamp(420px,116vw,540px);
    overflow:hidden;
  }
  .escenario-item{
    position:absolute;left:50%;bottom:0;
    width:min(78%,320px);
    transform:translate3d(-50%,0,0);
    opacity:0;z-index:1;
    transition:
      transform 1.05s cubic-bezier(.33,1,.32,1),
      opacity .95s cubic-bezier(.33,1,.32,1);
    backface-visibility:hidden;
  }
  .escenario-item.sin-transicion{transition:none !important}
  .escenario-item[data-pos="0"],
  .escenario-item.es-centro{
    transform:translate3d(-50%,0,0);
    opacity:1;z-index:4;
  }
  .escenario-controles{
    display:flex;align-items:center;justify-content:center;
    gap:var(--s4);margin-top:var(--s5);
  }
  .escenario-flecha{
    width:44px;height:44px;border-radius:50%;
    border:1px solid var(--rule);background:var(--surface);
    color:var(--noche);font-size:1.35rem;cursor:pointer;
    display:grid;place-items:center;
  }
  .escenario-flecha:hover{background:var(--noche);color:var(--hueso);border-color:var(--noche)}
  .escenario-flecha:focus-visible{outline:2px solid var(--cochinilla);outline-offset:2px}
  .escenario-cuenta{
    font-size:13px;font-weight:600;color:var(--soft);
    min-width:14ch;text-align:center;transition:opacity .35s ease;
  }
  .escenario-cuenta.es-cambiando{opacity:0}
}
@media (prefers-reduced-motion:reduce){
  .escenario-item,
  .escenario-cuenta{transition:none}
}

/* ---- Portada: la pieza insignia, contada ---- */
/* Baldosa plana: la fotografía es el bloque y el texto va sobre el aire que
   la toma ya trae a la izquierda. En celular la foto va arriba y el texto
   debajo, porque encima no hay ancho para leer. */
.insignia-pieza{
  background:linear-gradient(180deg,var(--grafito-alto) 0%,var(--grafito-bajo) 100%);
  padding-block:0;
}
.insignia-grid{display:grid;grid-template-columns:1fr}
.insignia-foto{
  margin:0;overflow:hidden;background:var(--grafito-medio);
}
.insignia-foto img{
  display:block;width:100%;height:100%;object-fit:cover;
  object-position:68% center;aspect-ratio:1;
}
.insignia-cuerpo{
  display:flex;flex-direction:column;justify-content:center;
  padding-block:var(--s8);
}
@media (min-width:760px){
  .insignia-grid{grid-template-columns:1fr;position:relative;isolation:isolate}
  .insignia-foto,
  .insignia-cuerpo{grid-area:1/1}
  .insignia-foto{position:relative}
  .insignia-foto img{height:100%;aspect-ratio:auto;object-position:76% center}
  .insignia-foto::after{
    content:"";position:absolute;inset:0;
    background:linear-gradient(to right,
      rgba(16,21,29,.9) 0%,
      rgba(16,21,29,.74) 34%,
      rgba(16,21,29,.28) 58%,
      rgba(16,21,29,0) 76%);
  }
  .insignia-cuerpo{
    position:relative;z-index:1;
    min-height:clamp(520px,42vw,640px);
    padding-block:var(--s9);
  }
  .insignia-cuerpo > *{max-width:40ch}
}
.insignia-cuerpo .seccion-titulo{color:var(--hueso);margin-top:var(--s2)}
.insignia-lead{
  margin:var(--s4) 0 var(--s3);color:var(--hueso);
  font-size:clamp(1.08rem,1.9vw,1.26rem);line-height:1.55;max-width:38ch;
}
.insignia-texto{
  margin:0 0 var(--s5);color:var(--plata-viva);line-height:1.6;max-width:44ch;
}
.insignia-datos{
  list-style:none;margin:0 0 var(--s6);padding:0;
  display:flex;flex-wrap:wrap;gap:var(--s2) var(--s5);
  color:var(--plata-viva);font-size:15px;font-variant-numeric:tabular-nums;
}
.insignia-datos li{display:flex;align-items:center;gap:var(--s3)}
.insignia-datos li + li::before{
  content:"";width:4px;height:4px;border-radius:50%;
  background:color-mix(in srgb,var(--plata) 60%,transparent);
}
.insignia-enlaces{margin-top:0;justify-content:flex-start}
.insignia-enlaces .pastilla{background:var(--hueso);color:var(--noche)}
.insignia-enlaces .pastilla:hover{background:#fff}
.insignia-enlaces .enlace-apple{color:var(--hueso)}
.insignia-enlaces .enlace-apple:hover{color:var(--plata-viva)}

/* ---- Portada: acceso por tipo, en texto (la vitrina ya está arriba) ---- */
.tipos-enlaces{
  display:flex;flex-wrap:wrap;align-items:center;
  gap:var(--s3) var(--s6);margin-top:var(--s7);
  padding-top:var(--s5);border-top:1px solid var(--rule);
}
.tipos-enlaces a{
  color:var(--noche);text-decoration:none;font-size:16px;
  min-height:44px;display:inline-flex;align-items:center;
}
.tipos-enlaces a:hover{text-decoration:underline;text-underline-offset:4px}
.tipos-enlaces a:focus-visible{outline:2px solid var(--cochinilla);outline-offset:3px}
.tipos-todo{margin-left:auto}

/* ---- Portada: cómo se ve puesta ----
   Celular: tira que se corta en el borde para avisar que hay más.
   Computador: tres vistas iguales, a sangre. */
.puesta{
  background:var(--estudio);
  padding-block:var(--s9) 0;
}
.puesta .seccion-cabecera-centro{margin-bottom:var(--s7)}
.puesta .seccion-titulo{color:var(--hueso)}
.puesta .seccion-sub{color:var(--plata-viva)}
.puesta-tira{
  display:grid;grid-auto-flow:column;grid-auto-columns:82%;
  gap:2px;overflow-x:auto;overscroll-behavior-x:contain;
  scroll-snap-type:x mandatory;scrollbar-width:none;
}
.puesta-tira::-webkit-scrollbar{display:none}
.puesta-vista{
  position:relative;display:block;overflow:hidden;
  scroll-snap-align:start;text-decoration:none;color:var(--hueso);
  background:var(--grafito-medio);
}
.puesta-vista img{
  display:block;width:100%;height:100%;aspect-ratio:4/5;
  object-fit:cover;object-position:center;
  transition:transform .8s cubic-bezier(.33,1,.32,1);
}
.puesta-vista:hover img{transform:scale(1.04)}
.puesta-vista:focus-visible{outline:2px solid var(--plata-viva);outline-offset:-4px}
.puesta-pie{
  position:absolute;left:0;right:0;bottom:0;
  display:flex;flex-direction:column;gap:var(--s1);
  padding:var(--s8) var(--s5) var(--s5);
  background:linear-gradient(to top,rgba(16,21,29,.82) 0%,rgba(16,21,29,0) 100%);
}
.puesta-etiqueta{
  font-size:12px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--plata-viva);
}
.puesta-nombre{
  font-family:var(--serif);font-variation-settings:var(--disp);
  font-size:clamp(1.3rem,2vw,1.7rem);font-weight:400;
}
@media (min-width:760px){
  .puesta-tira{
    grid-auto-flow:row;grid-auto-columns:auto;
    grid-template-columns:repeat(3,minmax(0,1fr));
    overflow:visible;
  }
}
@media (prefers-reduced-motion:reduce){
  .puesta-vista img{transition:none}
  .puesta-vista:hover img{transform:none}
}

.empaque-enlaces{margin-top:var(--s7);justify-content:center}

/* ---- Wireframe home: categorías con foto ---- */
.categoria-puerta{
  position:relative;display:block;text-decoration:none;color:var(--hueso);
  border-radius:var(--r);overflow:hidden;
  border:0;background:var(--grafito-bajo);
}
.categoria-puerta:hover{transform:none;box-shadow:none}
.categoria-puerta:focus-visible{outline:2px solid var(--cochinilla);outline-offset:3px}
.categoria-puerta-foto{
  display:block;aspect-ratio:3/4;overflow:hidden;background:var(--grafito-bajo);
}
.categoria-puerta-foto img{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .6s ease;
}
.categoria-puerta:hover .categoria-puerta-foto img{transform:scale(1.04)}
.categoria-puerta-nombre{
  position:absolute;left:0;right:0;bottom:0;
  padding:var(--s8) var(--s4) var(--s4);
  font-family:var(--serif);font-variation-settings:var(--disp);
  font-size:clamp(1.35rem,2vw,1.75rem);font-weight:400;text-align:left;
  background:linear-gradient(to top, rgba(16,21,29,.78) 0%, rgba(16,21,29,0) 100%);
}
@media (min-width:768px){
  .categorias-grid{grid-template-columns:repeat(4,1fr)}
}

/* ---- Wireframe home: empaque 3 cuadros iguales ---- */
.empaque-lista{
  margin:var(--s5) 0;padding-left:var(--s5);
  color:var(--soft);max-width:36ch;
}
.empaque-lista li{margin-bottom:var(--s2)}
.empaque-tres{
  display:grid;grid-template-columns:1fr;gap:var(--s4);
  margin-top:var(--s7);
}
@media (min-width:760px){
  .empaque-tres{grid-template-columns:repeat(3,1fr);gap:var(--s5)}
}
.empaque-cuadro{
  margin:0;display:flex;flex-direction:column;gap:var(--s3);
}
.empaque-cuadro .reserva,
.empaque-cuadro img{
  aspect-ratio:1;width:100%;
  max-height:none;
  border-radius:var(--r);overflow:hidden;
  border:0;
  object-fit:cover;object-position:center;
  display:block;background:var(--hueso);
  margin-inline:auto;
  transition:transform .45s cubic-bezier(.33,1,.32,1);
}
.empaque-cuadro:hover img{
  transform:scale(1.06);
}
.empaque-cuadro .reserva{min-height:0;height:auto}
.empaque-cuadro .reserva > div{min-height:100%}
@media (min-width:760px){
  .empaque-cuadro .reserva,
  .empaque-cuadro img{max-height:none}
}
/* Las tomas de estuche son verticales: en cuadrado se corta el monograma.
   En celular van en tira que se corta al borde, no apiladas: tres fotos
   verticales una debajo de otra son dos mil píxeles de scroll. */
.seccion-empaque .empaque-cuadro a{display:block;border-radius:var(--r);overflow:hidden}
.seccion-empaque .empaque-cuadro img{aspect-ratio:3/4;border-radius:0}
@media (max-width:759px){
  .seccion-empaque .empaque-tres{
    display:grid;grid-template-columns:none;
    grid-auto-flow:column;grid-auto-columns:76%;
    gap:var(--s4);overflow-x:auto;overscroll-behavior-x:contain;
    scroll-snap-type:x mandatory;scrollbar-width:none;
    margin-inline:calc(var(--gutter) * -1);
    padding-inline:var(--gutter);
    /* Sin esto el ajuste pega el primer estuche al borde de la pantalla. */
    scroll-padding-inline:var(--gutter);
  }
  .seccion-empaque .empaque-tres::-webkit-scrollbar{display:none}
  .seccion-empaque .empaque-cuadro{scroll-snap-align:start}
}

/* ---- Wireframe home: craft rows taller ---- */
.craft-heading{
  text-align:center;margin:0 auto var(--s8);max-width:18ch;
}
.craft-row{
  display:grid;grid-template-columns:1fr;gap:var(--s5);
  align-items:center;margin-bottom:var(--s8);
}
@media (min-width:800px){
  .craft-row{grid-template-columns:1fr 1fr;gap:var(--s7)}
  .craft-row-inv .craft-copy{order:1}
  .craft-row-inv .craft-media{order:2}
}
.craft-media .reserva{
  aspect-ratio:4/3;min-height:0;border-radius:var(--r);
}
.craft-sub{
  font-family:var(--serif);font-variation-settings:var(--disp);
  font-size:clamp(1.35rem,2.5vw,1.75rem);
  font-weight:400;margin:0 0 var(--s3);color:var(--hueso);
}
.craft-copy p{color:var(--plata-viva);margin:0 0 var(--s4)}
.seccion-oficio .enlace-apple{color:var(--hueso)}
.seccion-oficio .enlace-apple:hover{color:var(--plata-viva)}
#insignia,#destacados,#catalogo,#empaque,#taller-home,#premium{
  scroll-margin-top:calc(var(--cab-h) + var(--s4));
}



/* ---- Barra superior (informativa, sin enlace) ---- */
.aviso-superior{
  background:linear-gradient(180deg,var(--grafito-alto),var(--grafito-bajo));
  color:var(--plata-viva);text-align:center;
  font-size:12px;font-weight:600;letter-spacing:.06em;
  padding:var(--s3) var(--s4);
  border-bottom:1px solid color-mix(in srgb,var(--plata) 35%,transparent);
}
.aviso-superior p{margin:0 auto;max-width:none}

/* ---- Distintivos de pago y envío ---- */
.medios{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:var(--s2)}
.medios li{
  font-size:11px;font-weight:700;letter-spacing:.04em;line-height:1;
  padding:var(--s2) var(--s3);border-radius:var(--r-sm);
  border:1px solid var(--rule);background:#fff;color:var(--noche);
}
.medios-bolsa{margin-top:var(--s3);justify-content:center}
.medios-pie li{
  background:transparent;color:var(--plata-viva);
  border-color:color-mix(in srgb,var(--plata) 34%,transparent);
}

/* ---- Tienda: riel de filtros a la izquierda, orden arriba a la derecha ---- */
.tienda-marco{
  display:grid;
  grid-template-areas:"barra" "filtros" "lista";
  gap:var(--s5);
  padding-block:var(--s6) var(--s9);
}
.tienda-barra{grid-area:barra;min-width:0}
.tienda-filtros{
  grid-area:filtros;
  display:none;flex-direction:column;gap:var(--s3);align-items:stretch;
  padding:0;background:transparent;border:0;
}
.tienda-filtros.abierto{display:flex}
.tienda-lista{grid-area:lista;min-width:0}
.tienda-barra-ajustes{
  display:flex;align-items:center;flex-wrap:wrap;gap:var(--s3);
}
.tienda-cuenta{
  margin:0 var(--s3) 0 0;font-size:13px;color:var(--soft);
  font-variant-numeric:tabular-nums;
}
.tienda-abrir-filtros{
  min-height:44px;padding:0 var(--s4);
  border:1px solid var(--rule);border-radius:var(--r);
  background:#fff;color:var(--noche);font:inherit;font-size:13px;cursor:pointer;
}
.tienda-abrir-filtros:hover{border-color:var(--noche)}
.tienda-abrir-filtros:focus-visible{outline:2px solid var(--cochinilla);outline-offset:3px}
.tienda-select{
  display:inline-flex;align-items:center;gap:var(--s2);
  font-size:13px;color:var(--soft);
}
@media (max-width:899px){
  .tienda-barra-ajustes{display:grid;grid-template-columns:1fr auto;align-items:center}
  .tienda-cuenta{margin:0}
  .tienda-select{grid-column:1 / -1;justify-content:space-between}
  .tienda-select select{flex:1;max-width:16rem}
}
.tienda-select select{
  min-height:44px;padding:0 var(--s5) 0 var(--s3);
  border:1px solid var(--rule);border-radius:var(--r);
  background:#fff;color:#161C26;font:inherit;font-size:15px;font-weight:600;
  cursor:pointer;color-scheme:light;
}
.tienda-select select option{background:#fff;color:#161C26}
.tienda-select select:focus-visible{outline:2px solid var(--cochinilla);outline-offset:2px}
.tienda-filtros-titulo{
  margin:0;font-size:15px;font-weight:600;color:var(--noche);
}
.filtro-grupo{border-top:1px solid var(--rule);padding-top:var(--s2)}
.filtro-grupo summary{
  display:flex;align-items:center;justify-content:space-between;
  min-height:44px;cursor:pointer;font-weight:600;font-size:15px;
  list-style:none;
}
.filtro-grupo summary::-webkit-details-marker{display:none}
.filtro-grupo summary::after{
  content:"›";font-size:1.25em;line-height:1;color:var(--soft);
  transform:rotate(90deg);
}
.filtro-grupo:not([open]) summary::after{transform:none}
.filtro-grupo summary:focus-visible{outline:2px solid var(--cochinilla);outline-offset:3px}
.filtro-opciones{display:flex;flex-direction:column;padding-bottom:var(--s2)}
.filtro-opcion{
  display:flex;align-items:center;gap:var(--s3);
  min-height:44px;cursor:pointer;font-size:15px;
}
.filtro-opcion input{
  width:18px;height:18px;margin:0;flex:none;accent-color:var(--noche);
}
.filtro-opcion input:focus-visible{outline:2px solid var(--cochinilla);outline-offset:3px}
.filtro-opcion:has(input:checked) > span:first-of-type{font-weight:600}
.filtro-n{
  margin-left:auto;font-variant-numeric:tabular-nums;
  font-size:13px;color:var(--soft);font-weight:400;
}
.filtro-foto{border-top:1px solid var(--rule);margin-top:var(--s2)}
.tienda-chips{
  display:flex;flex-wrap:wrap;align-items:center;
  gap:var(--s2);margin-top:var(--s4);
}
.tienda-chips[hidden]{display:none}
.tienda-chips .enlace-apple,
.tienda-filtros-vacio .enlace-apple{
  min-height:44px;padding:0;border:0;background:none;
  font:inherit;font-weight:600;cursor:pointer;
}
.tienda-chip{
  display:inline-flex;align-items:center;gap:var(--s2);
  min-height:44px;padding:0 var(--s4);
  border:1px solid var(--rule);border-radius:99px;
  background:#fff;color:var(--noche);font:inherit;font-size:14px;cursor:pointer;
}
.tienda-chip:hover{border-color:var(--noche)}
.tienda-chip:focus-visible{outline:2px solid var(--cochinilla);outline-offset:3px}
@media (min-width:900px){
  .tienda-marco{
    grid-template-columns:16rem 1fr;
    grid-template-areas:"filtros barra" "filtros lista";
    align-items:start;
  }
  .tienda-abrir-filtros{display:none}
  .tienda-select{margin-left:auto}
  .tienda-filtros{
    display:flex;position:sticky;
    top:calc(var(--cab-h) + var(--s4));
    max-height:calc(100vh - var(--cab-h) - var(--s6));
    overflow:auto;
  }
}
.tienda .reticula-catalogo{padding-block:0}
.tienda .tienda-filtros-vacio{padding-bottom:var(--s6)}
#tienda{scroll-margin-top:var(--cab-h)}

/* Marco uniforme: mismo gris que las fotos reales de estudio, sin borde ni sombra */
.reticula-tienda-unica .pieza-imagen{
  aspect-ratio:4/5;border:0;border-radius:var(--r);background:#C4C5C2;
}
.reticula-tienda-unica .pieza:hover{transform:none}
.reticula-tienda-unica .pieza:hover .pieza-imagen{box-shadow:none}

/* ---- Ficha compacta: foto entera + miniaturas debajo, todo en una pantalla ---- */
.pdp{padding-block:var(--s5) var(--s7);gap:var(--s6)}
.pdp-galeria{gap:0}
.pdp-escena{border-radius:var(--r);box-shadow:none;background:#C4C5C2}
.pdp-hero-foto{object-fit:contain;object-position:50% 50%;filter:none}
.pdp-escena:hover .pdp-hero-foto{transform:none;filter:none}
.pdp-miniaturas{
  display:flex;flex-wrap:wrap;gap:var(--s3);margin-top:var(--s3);max-width:none;
}
.pdp-miniatura-btn{width:4.5rem;height:4.5rem;flex:none;background:#C4C5C2}
.pdp-miniatura-btn:hover{transform:none}
.pdp-miniatura-btn span{display:none}
.pdp-lead{margin-bottom:var(--s4)}
.pdp-medida{
  margin:0 0 var(--s5);font-size:15px;color:var(--soft);
  font-variant-numeric:tabular-nums;
}
.pdp-hechos{
  list-style:none;margin:var(--s5) 0 0;padding:0;
  display:grid;gap:var(--s2);
}
.pdp-hechos li{font-size:15px;color:var(--soft);line-height:1.45}
.pdp-hechos a{color:var(--cochinilla)}
.pdp-specs{margin-block:var(--s5) 0;font-size:14px}
.pdp-specs td,.pdp-specs th{padding-block:var(--s2)}
.pdp-envio{margin:var(--s4) 0 0;font-size:13px;color:var(--soft)}
.pdp-envio a{color:var(--cochinilla)}
@media (min-width:900px){
  .contenedor.pdp{
    max-width:var(--ancho);grid-template-columns:minmax(0,1fr) minmax(0,28rem);
    gap:var(--s8);align-items:start;
  }
  .pdp-escena{
    aspect-ratio:auto;
    height:clamp(22rem,calc(100svh - var(--cab-h) - 12rem),40rem);
  }
  .pdp-datos{position:sticky;top:calc(var(--cab-h) + var(--s5))}
  .pdp-nombre{font-size:clamp(1.9rem,3vw,2.5rem)}
  .pdp-datos .precio{margin-top:var(--s3)}
}

.pdp-parecidas{padding-block:var(--s6) var(--s9);border-top:1px solid var(--rule)}
.pdp-parecidas-cab{
  display:flex;align-items:baseline;justify-content:space-between;gap:var(--s4);
  margin-bottom:var(--s5);
}
.pdp-parecidas-titulo{font-size:1.5rem;margin:0}
.pdp-parecidas-reticula{
  padding-block:0;gap:var(--s5) var(--s4);
  grid-template-columns:repeat(2,minmax(0,1fr));
}
@media (min-width:900px){
  .pdp-parecidas-reticula{grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s5)}
}
.pdp-parecidas-reticula .pieza-imagen{aspect-ratio:4/5;border:0;background:#C4C5C2}
.pdp-parecidas-reticula .pieza-nombre{font-size:1.15rem}

.lineas{padding-block:var(--s9);background:var(--hueso)}
.lineas-grid{
  display:grid;gap:var(--s4);margin-top:var(--s7);
}
@media (min-width:760px){
  .lineas-grid{grid-template-columns:repeat(3,1fr);gap:var(--s5)}
}
.linea-carta{
  display:flex;flex-direction:column;gap:var(--s4);
  padding:0;background:transparent;border:0;border-radius:0;
  text-decoration:none;color:inherit;min-width:0;
}
.linea-foto{
  display:block;aspect-ratio:4/5;overflow:hidden;border-radius:var(--r);
  background:#C4C5C2;
}
.linea-foto img{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .55s ease;
}
.linea-carta:hover .linea-foto img{transform:scale(1.03)}
.linea-carta:focus-visible{outline:2px solid var(--cochinilla);outline-offset:3px}
.linea-cuerpo{display:block}
.linea-carta h3{
  font-family:var(--serif);font-variation-settings:var(--disp);
  font-weight:400;font-size:1.5rem;margin:0 0 var(--s2);
}
.linea-carta p{margin:0 0 var(--s3);color:var(--soft);line-height:1.5}

/* Portada: una pantalla por capítulo (azulejo), dúo y familias */
.azulejo-pantalla{
  min-height:100svh;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;
  padding:calc(var(--cab-h) + var(--s6)) var(--s5) var(--s7);
  background:var(--hueso);
}
.azulejo-pantalla-foto{
  width:min(70vw,380px);height:auto;margin-top:var(--s6);display:block;
}
.azulejo-oscuro.azulejo-pantalla{background:var(--estudio)}
.duo{display:grid;grid-template-columns:1fr}
.duo-lado{
  position:relative;min-height:72svh;display:flex;align-items:flex-end;
  color:var(--hueso);text-decoration:none;overflow:hidden;
}
.duo-lado img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.duo-lado::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(to top, rgba(16,21,29,.78) 0%, rgba(16,21,29,.05) 48%);
}
.duo-texto{position:relative;z-index:1;padding:var(--s7)}
.duo-texto h2{color:var(--hueso);margin:0}
.duo-texto p{
  margin:var(--s3) 0 0;max-width:28ch;color:var(--plata-viva);font-size:1.05rem;
}
.duo-texto .enlace-apple{color:var(--plata-viva);margin-top:var(--s4)}
.duo-lado:focus-visible{outline:2px solid var(--plata-viva);outline-offset:-3px}
@media (min-width:860px){
  .duo{grid-template-columns:1fr 1fr}
  .duo-lado{min-height:100svh}
}
.serie{
  min-height:100svh;display:flex;flex-direction:column;justify-content:center;
  padding:var(--s8) var(--s5);background:var(--surface);
}
.serie-cab{text-align:center;margin-bottom:var(--s6)}
.serie-cab .azulejo-sub{margin-inline:auto}
.serie-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:var(--s4);
  max-width:var(--ancho);margin-inline:auto;width:100%;
}
@media (min-width:860px){
  .serie-grid{grid-template-columns:repeat(4,1fr);gap:var(--s5)}
}
.serie .categoria-puerta-foto{aspect-ratio:3/4}

/* Ficha: barra fija de capítulos + una pantalla por toma */
.ficha-local{display:none}
.capitulo-ficha{
  min-height:100svh;display:flex;flex-direction:column;background:var(--hueso);
  scroll-margin-top:calc(var(--cab-h) + var(--s8));
}
#pieza{scroll-margin-top:calc(var(--cab-h) + var(--s8))}
.capitulo-ficha-texto{text-align:center;padding:var(--s8) var(--s5) var(--s5)}
.capitulo-ficha figure{margin:0;flex:1;min-height:50vh;background:#C4C5C2}
.capitulo-ficha img{width:100%;height:100%;object-fit:cover;display:block}
@media (min-width:900px){
  .ficha-local{
    display:flex;align-items:center;gap:var(--s5);
    position:sticky;top:var(--cab-h);z-index:45;
    min-height:var(--s7);padding:var(--s2) var(--gutter);
    background:color-mix(in srgb, var(--hueso) 92%, transparent);
    backdrop-filter:blur(16px);
    border-bottom:1px solid var(--rule);
  }
  .ficha-local-nombre{
    font-family:var(--serif);font-variation-settings:var(--disp);
    font-size:1.25rem;text-decoration:none;color:var(--noche);margin-right:auto;
  }
  .ficha-local-caps{display:flex;gap:var(--s5)}
  .ficha-local-caps a{
    font-size:15px;font-weight:500;color:var(--soft);text-decoration:none;
  }
  .ficha-local-caps a:hover{color:var(--cochinilla)}
  .ficha-local a:focus-visible{outline:2px solid var(--cochinilla);outline-offset:3px}
  .ficha-local .pastilla{margin-left:var(--s4);flex:none}
  body:has(.ficha-local) .pdp-datos{top:calc(var(--cab-h) + var(--s8))}
}
@media (prefers-reduced-motion:reduce){
  .duo-lado img,.serie .categoria-puerta-foto img{transition:none}
}

/* Versión nocturna: invierte superficies y texto. Las fotografías quedan. */
html[data-tema="noche"]{
  --noche:#F2EEE6;
  --hueso:#10151D;
  --surface:#1C2430;
  --rule:#2A3340;
  --soft:#C6C9C4;
  --faint:#C6C9C4;
  --grafito-alto:#F4F0E8;
  --grafito-bajo:#E6E0D6;
  --grafito-medio:#EFEAE2;
  --plata-viva:#3A403C;
}
html[data-tema="noche"] :focus-visible{outline-color:#C6C9C4}
html[data-tema="noche"] .sobre-oscuro :focus-visible{outline-color:#7A1220}
html[data-tema="noche"] .enlace-apple{color:#C6C9C4}
html[data-tema="noche"] .contacto-error,
html[data-tema="noche"] .bolsa-campo-error{color:#E4B4BA}
html[data-tema="noche"] .sobre-oscuro .enlace-apple{color:#7A1220}
html[data-tema="noche"] .pieza-rapido{
  background:color-mix(in srgb,#F2EEE6 84%,transparent);
  color:#161C26;
  border-color:color-mix(in srgb,#161C26 14%,transparent);
}
html[data-tema="noche"] .sobre-oscuro .pastilla,
html[data-tema="noche"] .azulejo-oscuro .pastilla{
  background:#161C26;color:#F2EEE6;
}
html[data-tema="noche"] .sobre-oscuro .pastilla:hover,
html[data-tema="noche"] .azulejo-oscuro .pastilla:hover{
  background:#2A3340;color:#F2EEE6;
}
html[data-tema="noche"] .heroe-crystal,
html[data-tema="noche"] .heroe-tienda,
html[data-tema="noche"] .heroe-crystal-titulo,
html[data-tema="noche"] .heroe-crystal-ctas .enlace-apple,
html[data-tema="noche"] .heroe-tienda-copy .enlace-apple,
html[data-tema="noche"] body:has(.heroe-crystal, .heroe-tienda) .cabecera.cabecera-sobre-oscuro:not(.cabecera-clara),
html[data-tema="noche"] body:has(.heroe-crystal, .heroe-tienda) .cabecera.cabecera-sobre-oscuro:not(.cabecera-clara) .logo-lockup,
html[data-tema="noche"] body:has(.heroe-crystal, .heroe-tienda) .cabecera.cabecera-sobre-oscuro:not(.cabecera-clara) .logo-mono,
html[data-tema="noche"] body:has(.heroe-crystal, .heroe-tienda) .cabecera.cabecera-sobre-oscuro:not(.cabecera-clara) .nav-principal a,
html[data-tema="noche"] body:has(.heroe-crystal, .heroe-tienda) .cabecera.cabecera-sobre-oscuro:not(.cabecera-clara) .bolsa-boton,
html[data-tema="noche"] body:has(.heroe-crystal, .heroe-tienda) .cabecera.cabecera-sobre-oscuro:not(.cabecera-clara) .nav-movil-boton,
html[data-tema="noche"] body:has(.heroe-crystal, .heroe-tienda) .cabecera.cabecera-sobre-oscuro:not(.cabecera-clara) .tema-boton,
html[data-tema="noche"] body:has(.heroe-crystal, .heroe-tienda) .cabecera.cabecera-sobre-oscuro:not(.cabecera-clara) .nav-movil a{
  color:#F2EEE6;
}
html[data-tema="noche"] .heroe-crystal-lead,
html[data-tema="noche"] .heroe-crystal-etiqueta,
html[data-tema="noche"] .heroe-tienda .azulejo-sub{
  color:#C6C9C4;
}
html[data-tema="noche"] .heroe-crystal-ctas .pastilla,
html[data-tema="noche"] .heroe-crystal-ctas .pastilla:hover{
  background:#F2EEE6;color:#161C26;
}
html[data-tema="noche"] body:has(.heroe-crystal, .heroe-tienda) .cabecera.cabecera-sobre-oscuro:not(.cabecera-clara) .nav-movil{
  background:color-mix(in srgb,#10151D 94%,transparent);
}
html[data-tema="noche"] body:has(.heroe-crystal, .heroe-tienda) .cabecera.cabecera-sobre-oscuro:not(.cabecera-clara) .bolsa-cuenta{
  background:#F2EEE6;color:#161C26;
}
html[data-tema="noche"] body:has(.heroe-crystal, .heroe-tienda) .cabecera.cabecera-sobre-oscuro:not(.cabecera-clara) .tema-boton{
  border-color:color-mix(in srgb,#F2EEE6 35%,transparent);
}
html[data-tema="noche"] body:not(:has(.heroe-crystal, .heroe-tienda)) .cabecera.cabecera-sobre-oscuro:not(.cabecera-clara){
  background:linear-gradient(180deg,rgba(244,240,232,.94),rgba(244,240,232,.78) 72%,transparent);
  color:#161C26;
}
/* El texto que va sobre una fotografía no sigue la inversión del tema. */
html[data-tema="noche"] .heroe-tienda-copy .azulejo-titulo{
  color:#F2EEE6;
}
html[data-tema="noche"] .heroe-tienda-copy .azulejo-nombre{
  color:#C6C9C4;
}
html[data-tema="noche"] .heroe-carrusel-punto.is-activa::after{
  background:#F2EEE6;
}
html[data-tema="noche"] .puesta-vista{color:#F2EEE6}
html[data-tema="noche"] .puesta-etiqueta{color:#C6C9C4}
@media (max-width:767px){
  html[data-tema="noche"] .heroe-tienda,
  html[data-tema="noche"] .heroe-crystal{
    background:linear-gradient(180deg,#161C26 0%,#10151D 100%);
  }
}