/* Camisetas Saira Lagos. Misma identidad que la tienda de bolsos (lino, vino, rosa, oro; Bodoni Moda + Jost). Móvil primero. */
@font-face{font-family:"Bodoni Moda";src:url("/fuentes/BodoniModa.woff2") format("woff2");font-weight:400 900;font-display:swap}
@font-face{font-family:"Jost";src:url("/fuentes/Jost.woff2") format("woff2");font-weight:100 900;font-display:swap}
:root{--lino:#FAF5F2;--blanco:#fff;--linea:#E8DAD6;--ink:#2A171E;--muted:#6E5A61;--vino:#6E1F3A;--vino-2:#561830;--rosa:#F3D9D8;--oro:#B8913A;--oro-texto:#7A5A17;--oliva:#3F5F36;--error:#A3321F;
--display:"Bodoni Moda",Didot,"Bodoni 72",Georgia,serif;--sans:Jost,"Futura PT",Futura,"Century Gothic",system-ui,sans-serif;--r:2px;--ancho:72rem;--g:1rem}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:5rem}
img{max-width:100%;height:auto;display:block}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--vino);outline-offset:2px}

body.sitio{margin:0;background:var(--lino);color:var(--ink);font:400 1rem/1.55 var(--sans);overflow-x:hidden}
.sitio h1,.sitio h2,.sitio h3{margin:0 0 .5em;font-family:var(--display);font-weight:400;line-height:1.12;text-wrap:balance}
.sitio h1{font-size:clamp(2.1rem,8vw,3.6rem)}
.sitio h2{font-size:clamp(1.6rem,5.5vw,2.4rem)}
.sitio h3{font-size:1.125rem}
.sitio h1 em,.sitio h2 em{font-style:italic;color:var(--vino)}
.sitio p{margin:0 0 1em;max-width:62ch}
.sitio a{color:var(--vino)}
.skip{position:absolute;left:-999px;top:0;background:var(--vino);color:#fff;padding:12px 16px;z-index:100}
.skip:focus{left:0}
.banda-pruebas{background:var(--ink);color:#fff;text-align:center;padding:8px var(--g);font-size:.875rem}
.barra-envio{background:var(--vino);color:#fff;text-align:center;padding:8px var(--g);text-transform:uppercase;letter-spacing:.18em;font-size:.75rem}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* etiquetas y botones */
.etiqueta{display:block;font:500 .8125rem var(--sans);text-transform:uppercase;letter-spacing:.18em;color:var(--oro-texto);margin:0 0 .75rem}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:3rem;padding:0 1.75rem;background:var(--vino);color:#fff!important;border:1px solid var(--vino);border-radius:var(--r);text-decoration:none!important;cursor:pointer;font:500 .8125rem var(--sans);text-transform:uppercase;letter-spacing:.18em}
.btn:hover{background:var(--vino-2);border-color:var(--vino-2)}
.btn:disabled{background:var(--linea);border-color:var(--linea);color:var(--muted)!important;cursor:not-allowed}
.btn-grande{min-height:3.25rem;padding:0 2rem}
.btn-sec{background:transparent;color:var(--vino)!important}
.btn-sec:hover{background:var(--rosa);border-color:var(--vino)}
.enlace{color:var(--vino)!important;text-underline-offset:3px}

/* cabecera */
.cab{position:sticky;top:0;z-index:50;background:var(--lino);border-bottom:1px solid var(--linea)}
.cab-in{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:3.5rem;max-width:var(--ancho);margin-inline:auto;padding-inline:var(--g)}
.cab-logo{display:flex;align-items:center;gap:.75rem;text-decoration:none;min-height:44px}
.cab-logo img{width:130px;height:auto}
.cab-sub{font:500 .75rem var(--sans);text-transform:uppercase;letter-spacing:.18em;color:var(--oro-texto);padding-left:.75rem;border-left:1px solid var(--linea)}
.cab-nav{display:flex;align-items:center;gap:.25rem}
.cab-nav a{display:inline-flex;align-items:center;gap:.4rem;min-height:44px;padding:0 .6rem;text-decoration:none;color:var(--ink);font:500 .8125rem var(--sans);text-transform:uppercase;letter-spacing:.18em}
.cab-nav a:hover{color:var(--vino)}
.cab-solo-pc{display:none!important}
.cab-n{display:inline-block;min-width:1.25rem;line-height:1.25rem;padding:0 .35rem;border-radius:999px;background:var(--vino);color:#fff;font-size:.75rem;text-align:center;letter-spacing:0}
.cab-carrito-t{display:none}
@media (min-width:40rem){.cab-solo-pc{display:inline-flex!important}.cab-carrito-t{display:inline}}
@media (max-width:30rem){.cab-sub{display:none}}

/* portada */
.portada{background:var(--rosa);padding:2rem var(--g) 2.5rem}
.portada-in{max-width:var(--ancho);margin-inline:auto;display:grid;gap:1.8rem}
.p-h1{margin:0 0 .4em!important}
.p-guia{font-size:1.125rem;color:var(--ink);max-width:40ch}
.p-botones{display:flex;flex-direction:column;gap:.7rem;margin-top:1.4rem}
.p-botones .btn{width:100%}
.p-datos{list-style:none;margin:1.4rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.5rem}
.p-datos li{padding:.35rem .8rem;border:1px solid var(--vino);border-radius:999px;font-size:.875rem;background:rgba(255,255,255,.5)}
.p-datos b{font-family:var(--display);font-weight:600;color:var(--vino)}
.portada-foto{position:relative;max-width:26rem;width:100%;margin-inline:auto;border-radius:var(--r);overflow:hidden;background:var(--lino)}
.portada-foto img{width:100%;aspect-ratio:4/5;object-fit:cover}
@media (min-width:52rem){
  .portada{padding:3.5rem var(--g)}
  .portada-in{grid-template-columns:1.1fr 1fr;align-items:center;gap:3rem}
  .p-botones{flex-direction:row}.p-botones .btn{width:auto}
  .portada-foto{margin-inline:0 auto}
}
.etq-maqueta{position:absolute;z-index:3;left:.6rem;bottom:.6rem;padding:.2rem .6rem;background:rgba(255,255,255,.88);color:var(--muted);font:500 .6875rem var(--sans);text-transform:uppercase;letter-spacing:.18em;border-radius:var(--r)}

/* catálogo y tarjetas */
.catalogo{padding-block:clamp(2.5rem,7vw,4.5rem)}
.catalogo-in{max-width:var(--ancho);margin-inline:auto;padding-inline:var(--g)}
.catalogo-cab{margin-bottom:1.8rem}
.rejilla{display:grid;gap:2rem 1rem;grid-template-columns:repeat(2,1fr)}
@media (min-width:52rem){.rejilla{grid-template-columns:repeat(3,1fr);gap:2.4rem 1.4rem}}
.cf{display:block;color:var(--ink)!important;text-decoration:none!important;min-width:0}
.cf-foto{display:block;position:relative;overflow:hidden;aspect-ratio:4/5;background:var(--rosa);border-radius:var(--r)}
.cf-foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .35s ease,transform .6s cubic-bezier(.2,.8,.2,1)}
.cf-foto .cf-b{opacity:0}
a.cf:hover .cf-b,a.cf:focus-visible .cf-b,a.cf.ver2 .cf-b{opacity:1}
.cf-pie{display:block;padding-top:.7rem}
.sitio .cf-nombre{font:400 1.125rem/1.2 var(--display);margin:0 0 .25rem}
.cf-lema{display:block;font-size:.9375rem;color:var(--muted);margin:0 0 .4rem}
.cf-precio{display:flex;align-items:center;justify-content:space-between;gap:.5rem;font-weight:500;font-size:.9375rem}
.cf-precio small{color:var(--muted);font-weight:400;font-size:.75rem}
.puntos{display:inline-flex;align-items:center;gap:.4rem}
.punto{display:inline-block;width:1rem;height:1rem;border-radius:50%;border:1px solid var(--ink)}

/* pasos */
.pasos{background:var(--vino);color:#fff;padding-block:clamp(2.5rem,7vw,4.5rem)}
.pasos .etiqueta{color:#f3d9d8}
.sitio .pasos h2 em{color:var(--rosa)}
.pasos-in{max-width:var(--ancho);margin-inline:auto;padding-inline:var(--g)}
.pasos ol{list-style:none;margin:0;padding:0;display:grid}
.pasos li{display:grid;grid-template-columns:3.5rem 1fr;gap:1rem;align-items:start;padding-block:1rem;border-top:1px solid rgba(255,255,255,.35)}
.pasos li:last-child{border-bottom:1px solid rgba(255,255,255,.35)}
.pasos b{font:400 2.6rem/1 var(--display);color:var(--rosa)}
.sitio .pasos h3{margin:0 0 .15em;font-size:1.3rem}
.sitio .pasos p{margin:0;color:#fff}
@media (min-width:52rem){.pasos ol{grid-template-columns:repeat(3,1fr);gap:2rem}.pasos li{grid-template-columns:1fr;border:0!important;border-top:1px solid rgba(255,255,255,.35)!important}}

/* preguntas */
.preguntas{padding-block:clamp(2.5rem,7vw,4.5rem)}
.preguntas-in{max-width:50rem;margin-inline:auto;padding-inline:var(--g)}
.faq details{border-top:1px solid var(--linea);padding:.4rem 0}
.faq details:last-child{border-bottom:1px solid var(--linea)}
.faq summary{cursor:pointer;font:500 1.0625rem var(--sans);list-style:none;display:flex;justify-content:space-between;gap:1rem;min-height:2.75rem;align-items:center}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font:400 1.6rem/1 var(--display);color:var(--vino)}
.faq details[open] summary::after{content:"–"}
.faq details p{margin:.2rem 0 .8rem}

/* aviso a la tienda de bolsos */
.bolsos-aviso{background:var(--rosa);padding:2.5rem var(--g);text-align:center}
.bolsos-aviso-in{max-width:36rem;margin-inline:auto}
.bolsos-aviso p{margin-inline:auto}

/* ficha */
.migas{max-width:var(--ancho);margin-inline:auto;padding:1rem var(--g) 0;font-size:.875rem;color:var(--muted)}
.migas a{color:inherit}
.ficha{max-width:var(--ancho);margin-inline:auto;padding:1rem var(--g) 3rem;display:grid;gap:1.6rem}
.escena{position:relative;background:var(--rosa);border-radius:var(--r);overflow:hidden}
.giro{position:relative;aspect-ratio:4/5;perspective:1200px}
.giro-in{position:absolute;inset:0;transform-style:preserve-3d;transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.giro-in.volteada{transform:rotateY(180deg)}
.giro .cara{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;backface-visibility:hidden;-webkit-backface-visibility:hidden;background:var(--rosa)}
.giro .cara-espalda{transform:rotateY(180deg)}
.giro .cara.cambia{animation:cambia .45s ease}
@keyframes cambia{from{opacity:.15}}
.girable{cursor:pointer}
.giro-pista{position:absolute;z-index:3;right:.7rem;bottom:.7rem;padding:.35rem .8rem;border-radius:999px;background:rgba(42,23,30,.82);color:#fff;font:500 .75rem var(--sans);border:0}
.miniaturas{display:flex;gap:.6rem;margin-top:.7rem}
.mini{width:4.2rem;aspect-ratio:4/5;padding:0;border:2px solid transparent;border-radius:var(--r);background:var(--rosa);overflow:hidden;cursor:pointer;opacity:.75}
.mini img{width:100%;height:100%;object-fit:cover}
.mini[aria-pressed="true"]{border-color:var(--vino);opacity:1}
.info .linea-chip{display:inline-block;margin-bottom:.9rem;font:500 .75rem var(--sans);text-transform:uppercase;letter-spacing:.18em;color:var(--oro-texto)}
.info h1{font-size:clamp(2rem,7vw,3rem)!important;margin-bottom:.2em}
.info .lema{font:italic 400 1.25rem/1.3 var(--display);color:var(--vino);margin:0 0 1rem}
.precio-grande{display:flex;align-items:baseline;gap:.6rem;margin:0 0 1.4rem!important;font:500 1.6rem var(--sans)}
.precio-grande small{font-size:.8125rem;color:var(--muted);font-weight:400}
.grupo{border:0;padding:0;margin:0 0 1.3rem}
.grupo legend{padding:0;margin-bottom:.6rem;font:500 .8125rem var(--sans);text-transform:uppercase;letter-spacing:.18em}
.grupo legend span{color:var(--vino);letter-spacing:.06em;text-transform:none}
.colores,.tallas{display:flex;flex-wrap:wrap;gap:.6rem}
.color{display:inline-flex;align-items:center;gap:.6rem;min-height:2.75rem;padding:.3rem 1rem .3rem .5rem;border:1px solid var(--ink);border-radius:999px;font:400 .9375rem var(--sans)}
.color .punto{width:1.6rem;height:1.6rem}
.talla{min-width:3.4rem;min-height:2.9rem;padding:0 .8rem;border:1px solid var(--ink);border-radius:var(--r);background:transparent;font:500 .9375rem var(--sans);letter-spacing:.06em;cursor:pointer;color:var(--ink)}
.talla:hover{border-color:var(--vino);color:var(--vino)}
.talla[aria-pressed="true"]{background:var(--vino);border-color:var(--vino);color:#fff}
.grupo.falta .tallas{animation:sacude .4s}
.grupo.falta legend{color:var(--error)}
@keyframes sacude{25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}
.guia{margin:0 0 1.4rem;border-top:1px solid var(--linea);border-bottom:1px solid var(--linea)}
.guia summary{cursor:pointer;min-height:3rem;display:flex;align-items:center;justify-content:space-between;font:500 .9375rem var(--sans);list-style:none}
.guia summary::-webkit-details-marker{display:none}
.guia summary::after{content:"+";font:400 1.5rem/1 var(--display);color:var(--vino)}
.guia[open] summary::after{content:"–"}
.tabla-tallas{width:100%;border-collapse:collapse;margin:.4rem 0 .6rem}
.tabla-tallas th,.tabla-tallas td{padding:.55rem .5rem;text-align:center;border-bottom:1px solid var(--linea)}
.tabla-tallas thead th{font:500 .75rem var(--sans);text-transform:uppercase;letter-spacing:.12em;color:var(--muted)}
.tabla-tallas tbody th{font:500 1rem var(--sans)}
.guia-nota{font-size:.875rem;color:var(--muted);margin:0 0 .8rem!important}
.btn-add{width:100%}
.msg{min-height:1.5rem;margin:.7rem 0 0!important;font-weight:500}
.msg.ok{color:var(--oliva)}.msg.err{color:var(--error)}
.promesas{list-style:none;margin:1.2rem 0 0;padding:0;display:grid;gap:.8rem}
.promesas li{display:grid;grid-template-columns:2rem 1fr;gap:.7rem;align-items:start;font-size:.9375rem}
.promesas svg{width:1.7rem;height:1.7rem;color:var(--vino)}
.promesas b{display:block;font-weight:500}
.mas{background:var(--rosa)}
.mas .rejilla{grid-template-columns:repeat(2,1fr)}
@media (min-width:52rem){.mas .rejilla{grid-template-columns:repeat(5,1fr)}}
@media (min-width:56rem){
  .ficha{grid-template-columns:1fr 1fr;gap:3rem;align-items:start;padding-top:1.6rem}
  .ficha-fotos{position:sticky;top:5rem}
}

/* carrito y gracias */
.pagina{max-width:var(--ancho);margin-inline:auto;padding:clamp(2rem,6vw,3.5rem) var(--g) clamp(3rem,8vw,5rem)}
.pagina.estrecha{max-width:50rem}
.carrito-vacio{padding:2rem;border:1px dashed var(--vino);border-radius:var(--r);text-align:center}
.carrito-vacio p{margin-inline:auto}
.carrito-cuerpo{display:grid;gap:2rem}
.lineas{display:grid;gap:1rem}
.linea{display:grid;grid-template-columns:5.5rem 1fr;gap:1rem;padding:.8rem;background:var(--blanco);border:1px solid var(--linea);border-radius:var(--r)}
.linea-foto{width:5.5rem;aspect-ratio:4/5;overflow:hidden;background:var(--rosa);border-radius:var(--r)}
.linea-foto img{width:100%;height:100%;object-fit:cover}
.sitio .linea h3{font-size:1.125rem;margin:0 0 .2rem}
.linea h3 a{text-decoration:none;color:var(--ink)}
.linea p{margin:0 0 .4rem;font-size:.9375rem;color:var(--muted)}
.linea .precio{font-weight:500;color:var(--ink);margin:0}
.linea-acc{display:flex;align-items:center;justify-content:space-between;gap:.6rem;flex-wrap:wrap;margin-top:.3rem}
.cant{display:inline-flex;align-items:center;border:1px solid var(--ink);border-radius:var(--r)}
.cant button{width:2.75rem;height:2.75rem;border:0;background:transparent;font:500 1.2rem var(--sans);cursor:pointer;color:var(--ink)}
.cant span{min-width:1.8rem;text-align:center;font-weight:500}
.quitar{background:none;border:0;padding:.7rem .2rem;font:400 .9rem var(--sans);text-decoration:underline;text-underline-offset:3px;cursor:pointer;color:var(--muted)}
.resumen{align-self:start;background:var(--blanco);border:1px solid var(--linea);border-radius:var(--r);padding:1.5rem}
.sitio .resumen h2{font-size:1.5rem}
.fila{display:flex;justify-content:space-between;gap:1rem;margin:0 0 .6rem!important;max-width:none!important}
.fila.total{padding-top:.8rem;margin-top:.8rem!important;border-top:1px solid var(--linea);font:500 1.25rem var(--sans)}
.resumen .nota{font-size:.875rem;color:var(--muted)}
.resumen .btn{width:100%;margin-top:.6rem}
.resumen .msg{color:var(--error)}
@media (min-width:56rem){.carrito-cuerpo{grid-template-columns:1.5fr 1fr;gap:3rem}.resumen{position:sticky;top:5rem}}
.gracias{text-align:center}
.gracias .cf{max-width:14rem;margin:1.6rem auto;text-align:left}
.gracias .numero{font:400 2.4rem/1 var(--display);margin:.2rem 0 1rem;color:var(--vino)}
.gracias p{margin-inline:auto}
.texto h2{margin-top:1.6rem}
.texto h3{margin-top:1.2rem}
.texto ul{padding-left:1.2rem}
.nf{text-align:center}
.nf p{margin-inline:auto}

/* pie */
.pie{margin-top:2rem;background:var(--lino);border-top:1px solid var(--linea);padding:2rem var(--g) 2rem}
.pie-in{max-width:var(--ancho);margin-inline:auto;display:grid;gap:1.4rem;text-align:center}
.pie-marca img{margin:0 auto 1rem}
.pie-nota{color:var(--muted);max-width:38ch;margin-inline:auto!important;font-size:.9375rem}
.pie-links{display:flex;flex-wrap:wrap;justify-content:center;gap:0 1.2rem}
.pie-links a,.pie-cookies{display:inline-flex;align-items:center;min-height:44px;color:var(--ink);font-size:.9375rem}
.pie-cookies{background:none;border:0;font-family:inherit;text-decoration:underline;cursor:pointer;padding:0}
.pie-credito{margin:0!important;color:var(--muted);font-size:.8125rem;max-width:none!important}
.pie-credito a{color:inherit}
@media (min-width:52rem){.pie-in{grid-template-columns:1fr 1.4fr;align-items:start;text-align:left}.pie-marca img{margin-left:0}.pie-nota{margin-inline:0!important}.pie-links{justify-content:flex-start}.pie-credito{grid-column:1/-1;text-align:center}}

/* medición y avisos */
.consent{position:fixed;left:12px;right:12px;bottom:12px;max-width:560px;background:var(--ink);color:#fff;padding:1.3rem;border-radius:var(--r);z-index:60;box-shadow:0 8px 40px rgba(0,0,0,.45);border:1px solid rgba(255,255,255,.14)}
.consent h2{font:400 1.4rem var(--display)!important;margin:0 0 .4rem}
.consent p{margin:0 0 .8rem;font-size:.95rem}
.consent a{color:#F3D9D8}
.consent-botones,.consent-config{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.consent-config{flex-direction:column;align-items:flex-start;margin-bottom:.8rem}
.consent-config label{display:flex;gap:.5rem;align-items:center;min-height:2.75rem}
.consent .btn{min-height:2.75rem;padding:.3rem 1.1rem;font-size:.95rem}
.consent .btn-sec{color:#fff!important}
.consent .btn-sec:hover{background:#fff;color:var(--ink)!important}
@media (min-width:48rem){.consent{left:auto;right:24px;bottom:24px}}
.aviso-cookies{position:fixed;left:0;right:0;bottom:0;background:var(--ink);color:#fff;padding:.8rem var(--g);display:flex;gap:1rem;align-items:center;justify-content:space-between;z-index:50}
.aviso-cookies p{margin:0;font-size:.92rem}
.aviso-cookies a{color:#F3D9D8}
.aviso-cookies button{min-height:2.75rem;padding:0 1.2rem;background:#fff;color:var(--ink);border:0;border-radius:var(--r);font:800 .95rem var(--sans);cursor:pointer;flex:none}
.tabla-cookies{width:100%;border-collapse:collapse;font-size:.95rem;margin:1em 0}
.tabla-cookies th,.tabla-cookies td{border:1px solid var(--linea);padding:.5rem;text-align:left;vertical-align:top}

/* entrada al hacer scroll (la clase .rev la pone el JS; sin JS todo se ve) */
.fx .rev{opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.8,.2,1);transition-delay:var(--d,0ms)}
.fx .rev.vis{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .fx .rev{opacity:1;transform:none}
}

/* panel (comparte esta hoja: variables propias y base mínima) */
body.pn{--lino:#FAF5F2;--ink:#2A171E;--vino:#6E1F3A;--linea:#E8DAD6;--muted:#6E5A61;--blanco:#fff;--rosa:#F3D9D8;--oro-texto:#7A5A17;--oliva:#3F5F36;--error:#A3321F;--display:"Bodoni Moda",Georgia,serif;--sans:Jost,system-ui,sans-serif;--r:2px;--gut:16px;margin:0;background:var(--lino);color:var(--ink);font:400 16px/1.55 var(--sans)}
body.pn h1,body.pn h2,body.pn h3{font-family:var(--display);font-weight:400;line-height:1.15;margin:0 0 .5em}
body.pn h1{font-size:2rem}body.pn h2{font-size:1.5rem}body.pn h3{font-size:1.125rem}
body.pn p{margin:0 0 1em}body.pn a{color:var(--vino)}
