/* PLANTILLA «PANADERÍA Y PASTELERÍA» del SaaS HCODE (App\Support\Panaderia). Diseño: Mockups/panaderia/diseno
   (Claude Design, la web de Roman's). Los colores de la marca llegan en variables desde la vista (--p, --a…), ya
   ajustados para que siempre se lean (WCAG AA). Las fechas especiales traen su propio tema (--th-*).
   Nada se mueve con «Detener animaciones» (html[data-quieto]) ni con «reducir movimiento». */

:root{
  --vino:var(--p,#8B1A1A);--vino-osc:color-mix(in srgb,var(--vino) 78%,#000);
  --dorado:var(--a,#D4A017);--dorado-claro:#F2C94C;--dorado-txt:var(--a-txt,#8C690F);
  --cafe:var(--osc,#2A1300);--cafe-pie:#1F1611;--cafe-nos:#3D2414;
  --crema:var(--fondo,#FBF8F2);--crema-sec:#F3EBDD;--borde:#E0D9CC;--borde2:#EDE5D6;--borde-input:#C9C0AF;
  --tinta:#1F1611;--tinta2:#6E5A47;--tinta3:#5A4634;--ok:#2F6B40;--ok-bg:#EAF2EA;--aviso:#FFF6DD;--aviso-borde:#E9CF83;
  --titulo:'Playfair Display',Georgia,serif;--letra:'DM Sans',system-ui,-apple-system,sans-serif;--mono:'JetBrains Mono',ui-monospace,monospace;
  --pad-x:clamp(16px,3.5vw,64px);--pad-y:clamp(56px,7vw,110px);--hueco:clamp(14px,1.6vw,24px);
  --curva:cubic-bezier(.22,1,.36,1);--sombra:0 4px 14px rgba(61,26,0,.06);--sombra-alta:0 18px 40px rgba(61,26,0,.16);
  --cab:84px;--barra:38px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--crema);color:var(--tinta);font:400 16px/1.6 var(--letra);-webkit-font-smoothing:antialiased;overflow-x:hidden}
body.con-tema{background:var(--th-bg)}
img,video{display:block;max-width:100%}
a{color:var(--p-txt,var(--vino))}
a:hover{color:var(--vino-osc)}
button{font:inherit;color:inherit;cursor:pointer}
:focus-visible{outline:3px solid #D4A017;outline-offset:3px}
[hidden]{display:none!important}
.solo-lectores{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;padding:0;margin:-1px}
.saltar{position:absolute;left:12px;top:-60px;z-index:100;padding:10px 16px;border-radius:12px;background:var(--cafe);color:#fff;font-weight:700}
.saltar:focus{top:12px}
.envoltura{max-width:1560px;margin:0 auto;padding:0 var(--pad-x)}
.envoltura--angosta{max-width:1400px}
.seccion{padding:var(--pad-y) 0}
.seccion--crema{background:var(--crema-sec)}
main{overflow-x:clip}

/* ---------- Tipografía ---------- */
.antetitulo{display:block;font:700 12px/1.3 var(--letra);letter-spacing:.2em;text-transform:uppercase;color:var(--p-txt,var(--vino))}
.h1,.h2{margin:10px 0 0;font-family:var(--titulo);font-weight:800;color:var(--cafe);text-wrap:balance;letter-spacing:-.005em}
.h1{font-size:clamp(40px,5vw,80px);line-height:1}
.h2{font-size:clamp(34px,4.2vw,64px);line-height:1.02}
.h1 em,.h2 em,.tit em{font-style:italic;color:var(--p-txt,var(--vino))}
.lead{margin:12px 0 0;font-size:17px;line-height:1.6;color:var(--tinta2);max-width:640px}
.cab-sec{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px 32px;margin-bottom:32px}
.cab-sec > div{max-width:760px}

/* ---------- Botones ---------- */
.boton{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 24px;border-radius:999px;border:1.5px solid transparent;font:700 15px/1.2 var(--letra);text-decoration:none;white-space:nowrap;transition:background .2s,color .2s,transform .2s,box-shadow .2s;cursor:pointer}
.boton--p{background:var(--vino);color:var(--p-tinta,#fff)}
.boton--p:hover{background:var(--vino-osc);color:var(--p-tinta,#fff)}
.boton--dorado{background:var(--dorado);color:var(--a-tinta,#2A1300);box-shadow:0 10px 24px rgba(0,0,0,.18)}
.boton--dorado:hover{filter:brightness(1.06);color:var(--a-tinta,#2A1300)}
.boton--linea{background:transparent;border-color:var(--cafe);color:var(--cafe)}
.boton--linea:hover{background:var(--cafe);color:#FBF8F2}
.boton--claro{background:rgba(255,248,236,.08);border-color:rgba(255,248,236,.75);color:#FFF8EC}
.boton--claro:hover{background:rgba(255,248,236,.18);color:#FFF8EC}
.boton--grande{min-height:56px;padding:0 30px;font-size:16px}
.boton--ancho{width:100%}
.boton--chico{min-height:44px;padding:0 16px;font-size:14px}
.boton--tema{background:var(--th-acc);color:#1F1611}
.boton--tema:hover{filter:brightness(1.08);color:#1F1611}
.boton[disabled]{opacity:.55;cursor:not-allowed}
.boton--wa{background:#25D366;color:#07210F}
.chip-fil{flex:none;min-height:46px;padding:0 18px;border-radius:999px;border:1.5px solid var(--borde);background:#fff;color:#3A2C1F;font:600 14.5px var(--letra);white-space:nowrap;display:inline-flex;align-items:center;gap:8px;transition:background .2s,border-color .2s,color .2s}
.chip-fil[aria-pressed="true"],.chip-fil[aria-selected="true"]{background:var(--vino);border-color:var(--vino);color:var(--p-tinta,#fff)}
.chip-fil__n{min-width:24px;height:22px;padding:0 6px;border-radius:11px;background:var(--crema-sec);font-size:12px;line-height:22px;text-align:center}
.chip-fil[aria-pressed="true"] .chip-fil__n,.chip-fil[aria-selected="true"] .chip-fil__n{background:rgba(255,255,255,.22)}
.fila-chips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:2px}
.fila-chips::-webkit-scrollbar{display:none}

/* ---------- Barra de arriba (frases que corren) ---------- */
.barra{display:flex;align-items:center;height:var(--barra);background:#2A1300;color:#F6E3A8;overflow:hidden;position:relative}
body.con-tema .barra{background:#000}
.barra__pista{flex:1;min-width:0;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.barra__cinta{display:flex;width:max-content;animation:correr var(--dur,40s) linear infinite}
.barra__item{display:flex;align-items:center;gap:14px;padding:0 22px;font:600 12.5px/1 var(--letra);letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.barra__item::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--barra-punto,var(--dorado))}
.barra__pausa{flex:none;height:var(--barra);padding:0 14px;border:0;border-left:1px solid rgba(255,255,255,.12);background:transparent;color:#FBF8F2;font:600 12px var(--letra);display:flex;align-items:center;gap:8px;white-space:nowrap}
.barra__pausa i{width:20px;height:20px;border-radius:50%;background:var(--barra-punto,var(--dorado));color:#1F1611;display:grid;place-items:center;font:800 9px/1 var(--letra);font-style:normal}
@keyframes correr{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes correr-rev{from{transform:translateX(-50%)}to{transform:translateX(0)}}

/* ---------- Cabecera ---------- */
.cab{position:sticky;top:0;z-index:30;background:rgba(251,248,242,.94);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid #E7DFD0;transition:background .5s}
body.con-tema .cab{background:color-mix(in srgb,var(--th-bg) 90%,transparent);border-bottom-color:rgba(255,255,255,.1)}
.cab__fila{height:var(--cab);display:flex;align-items:center;gap:clamp(12px,2vw,28px)}
.marca{flex:none;display:flex;align-items:center;gap:12px;text-decoration:none;min-height:44px}
.marca__circulo{width:54px;height:54px;border-radius:50%;background:#fff;display:grid;place-items:center;overflow:hidden;box-shadow:0 2px 10px rgba(61,26,0,.14)}
html[data-logo="s"] .marca__circulo{width:46px;height:46px}
html[data-logo="l"] .marca__circulo{width:64px;height:64px}
.marca__circulo img{width:92%;height:92%;object-fit:contain}
.marca__textos{display:flex;flex-direction:column;align-items:flex-start;line-height:1;white-space:nowrap}
.marca__nombre{font:800 24px/1 var(--titulo);color:var(--p-txt,var(--vino))}
.marca__sub{margin-top:5px;font:700 9.5px/1 var(--letra);letter-spacing:.22em;text-transform:uppercase;color:var(--dorado-txt)}
body.con-tema .marca__nombre{color:#FFF8EC}
body.con-tema .marca__sub{color:var(--th-acc)}
.nav{flex:1;display:flex;justify-content:center;gap:4px}
.nav a{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border-radius:999px;color:#3A2C1F;font:600 14.5px var(--letra);text-decoration:none;white-space:nowrap;transition:background .2s,color .2s}
.nav a:hover{background:#F3E4DA;color:#3A2C1F}
.nav a[aria-current="page"]{background:var(--vino);color:var(--p-tinta,#fff)}
body.con-tema .nav a{color:#F2EADF}
body.con-tema .nav a:hover{background:rgba(255,255,255,.1)}
body.con-tema .nav a[aria-current="page"]{background:var(--th-acc);color:#1F1611}
.cab__der{flex:none;display:flex;align-items:center;gap:10px;margin-left:auto}
.bolsa{position:relative;height:46px;min-width:46px;padding:0 12px 0 14px;border-radius:999px;border:1px solid #E7DFD0;background:#fff;display:flex;align-items:center;justify-content:center;gap:8px;color:#2A1300;font:600 14px var(--letra);text-decoration:none}
body.con-tema .bolsa{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.1);color:#FFF8EC}
.bolsa__n{min-width:22px;height:22px;padding:0 6px;border-radius:11px;background:var(--dorado);color:var(--a-tinta,#2A1300);font:700 12px/22px var(--letra);text-align:center}
body.con-tema .bolsa__n{background:var(--th-acc);color:#1F1611}
.bolsa.salta{animation:salta .5s var(--curva)}
@keyframes salta{40%{transform:scale(1.14)}}
.cab__cta{height:46px;padding:0 22px;border-radius:999px;background:var(--vino);color:var(--p-tinta,#fff);font:700 14px var(--letra);display:inline-flex;align-items:center;text-decoration:none;white-space:nowrap;box-shadow:0 8px 20px rgba(139,26,26,.28)}
.cab__cta:hover{background:var(--vino-osc);color:var(--p-tinta,#fff)}
body.con-tema .cab__cta{background:var(--th-acc);color:#1F1611;box-shadow:none}
.hamburguesa{display:none;width:46px;height:46px;border-radius:50%;border:1px solid #E7DFD0;background:#fff;place-items:center;color:#2A1300}
body.con-tema .hamburguesa{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.1);color:#FFF8EC}
@media (max-width:1239px){
  .nav,.cab__cta{display:none}
  .hamburguesa{display:grid}
}
@media (max-width:719px){
  :root{--cab:64px}
  .marca__circulo{width:44px!important;height:44px!important}
  .marca__nombre{font-size:21px}
  .marca__sub,.bolsa__txt{display:none}
  .bolsa{padding:0}
  .bolsa__n{position:absolute;top:-4px;right:-4px}
}
/* Menú lateral */
.menu-lateral{position:fixed;inset:0;z-index:50}
.menu-lateral__velo{position:absolute;inset:0;background:rgba(31,22,17,.55);border:0;width:100%;cursor:pointer}
.menu-lateral__panel{position:absolute;top:0;right:0;bottom:0;width:min(360px,88%);background:#FBF8F2;padding:20px;display:flex;flex-direction:column;gap:4px;box-shadow:-14px 0 40px rgba(61,26,0,.25);overflow:auto;animation:entra-der .3s var(--curva)}
@keyframes entra-der{from{transform:translateX(30px);opacity:0}}
.menu-lateral__cab{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.menu-lateral__cab strong{font:800 24px var(--titulo);color:var(--p-txt,var(--vino))}
.menu-lateral__cerrar{width:44px;height:44px;border-radius:50%;border:1px solid var(--borde);background:#fff;font-size:22px;color:#3D1A00;line-height:1}
.menu-lateral a{min-height:54px;display:flex;align-items:center;padding:0 16px;border-radius:14px;color:#2A1300;font:600 17px var(--letra);text-decoration:none}
.menu-lateral a[aria-current="page"],.menu-lateral a:hover{background:#F3E4DA;color:var(--p-txt,var(--vino))}

/* Barra de abajo (celular) */
.nav-abajo{display:none}
@media (max-width:719px){
  .nav-abajo{position:fixed;left:0;right:0;bottom:0;z-index:40;height:70px;background:rgba(255,255,255,.97);backdrop-filter:blur(10px);border-top:1px solid var(--borde);display:grid;grid-template-columns:repeat(5,1fr);padding-bottom:env(safe-area-inset-bottom,0)}
  .nav-abajo a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;color:#3A2C1F;font:700 11px var(--letra);text-decoration:none}
  .nav-abajo span{width:48px;height:30px;border-radius:999px;display:grid;place-items:center;transition:background .2s}
  .nav-abajo a[aria-current="page"]{color:var(--p-txt,var(--vino))}
  .nav-abajo a[aria-current="page"] span{background:var(--vino);color:var(--p-tinta,#fff)}
  body{padding-bottom:70px}
}

/* ---------- Fotos y videos (enteros: el encuadre lo decide App\Support\Encuadre) ---------- */
.medio{position:relative;display:block;width:100%;height:100%;overflow:hidden;background:#fff}
.medio--vacio{background:linear-gradient(160deg,#F3E4CF,#E9D4B4)}
.medio__archivo{position:relative;z-index:1;display:block;width:100%;height:100%;object-fit:cover}
.medio > picture{display:block;width:100%;height:100%}
/* Entera (afiches de producto): lo que sobra a los lados, la misma foto difuminada y CLARA (los afiches son blancos). */
.medio.encuadre--completa > .encuadre__fondo{filter:blur(30px) brightness(1.04) saturate(1.05);opacity:.6}
.foto-espacio{display:grid;place-items:center;height:100%;padding:16px;text-align:center;font:600 14px/1.4 var(--letra);color:rgba(255,248,236,.7);border:2px dashed rgba(255,255,255,.25);border-radius:inherit}

/* ---------- Animaciones al bajar ---------- */
.js [data-rv]{opacity:0;transform:translateY(32px);transition:opacity .85s var(--curva),transform .85s var(--curva);transition-delay:var(--rv,0ms)}
.js [data-rv].visto{opacity:1;transform:none}
[data-flota]{animation:flotar var(--dur,6s) ease-in-out infinite}
@keyframes flotar{50%{transform:translateY(-16px)}}
[data-gira]{animation:girar var(--dur,40s) linear infinite}
@keyframes girar{to{transform:rotate(360deg)}}
.particula{position:absolute;top:-30px;left:var(--x);width:var(--s);height:var(--h);border-radius:var(--r);background:var(--c);opacity:var(--o);animation:caer var(--dur) linear infinite;animation-delay:calc(var(--del) * -1)}
@keyframes caer{0%{transform:translate(0,0) rotate(0)}50%{transform:translate(30px,calc(var(--caida,800px) / 2)) rotate(180deg)}100%{transform:translate(-10px,var(--caida,800px)) rotate(360deg)}}
.cinta-v{display:flex;flex-direction:column;gap:16px;animation:subir var(--dur,34s) linear infinite}
.cinta-v--rev{animation-name:bajar}
@keyframes subir{from{transform:translateY(0)}to{transform:translateY(-50%)}}
@keyframes bajar{from{transform:translateY(-50%)}to{transform:translateY(0)}}
.cinta-h{display:flex;gap:18px;width:max-content;animation:correr var(--dur,46s) linear infinite}
.cinta-h--rev{animation-name:correr-rev}
.cinta-h:hover,.cinta-v:hover{animation-play-state:paused}
/* Con JS (15-oct, Kevin: «todos los carruseles deben dejar movernos con el dedo»): la cinta es una pista que se desplaza
   sola y que se arrastra con el dedo o el mouse; se para al tocarla y sigue sola después. */
.cinta-ventana{overflow-x:auto!important;scrollbar-width:none;overscroll-behavior-x:contain;cursor:grab}
.cinta-ventana::-webkit-scrollbar{display:none}
.cinta-ventana.arrastrando{cursor:grabbing;user-select:none}
.cinta-ventana > .cinta-h{animation:none!important;transform:none}
html[data-quieto] *,html[data-quieto] *::before,html[data-quieto] *::after{animation-play-state:paused!important}
html[data-quieto] .js [data-rv],html[data-quieto] [data-rv]{opacity:1!important;transform:none!important;transition:none!important}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-play-state:paused!important;transition-duration:.01ms!important}
  .js [data-rv]{opacity:1;transform:none}
  html{scroll-behavior:auto}
}

/* ---------- PORTADA ---------- */
.portada{position:relative;overflow:hidden;min-height:clamp(660px,52vw,940px);display:flex;align-items:center;background:#2A1300;color:#FFF8EC}
/* Detrás de todo, el cuadro del video difuminado y oscuro (el video se ve entero en su marco). */
.portada__ambiente{position:absolute;inset:-40px;background:center/cover no-repeat;filter:blur(36px) saturate(1.15);opacity:.32}
.portada__brillo{position:absolute;inset:0;background:radial-gradient(55% 70% at 78% 45%,rgba(212,160,23,.22),transparent 70%),radial-gradient(40% 60% at 8% 92%,rgba(139,26,26,.4),transparent 70%),linear-gradient(90deg,rgba(42,19,0,.85),rgba(42,19,0,.35))}
.portada__rejilla{position:relative;width:100%;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(32px,4vw,64px);align-items:center;padding-top:clamp(36px,4vw,64px);padding-bottom:clamp(36px,4vw,64px)}
.portada__texto{display:flex;flex-direction:column;align-items:flex-start;gap:22px;max-width:700px}
.pildora{display:inline-flex;max-width:max-content;align-items:center;gap:10px;padding:8px 16px;border-radius:999px;font:700 12.5px/1.2 var(--letra);letter-spacing:.14em;text-transform:uppercase}
.pildora::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:currentColor}
.portada .pildora{background:rgba(42,19,0,.55);border:1px solid rgba(212,160,23,.6);color:#F6E3A8}
.portada .pildora::before{background:#7BD88F}
.portada__titulo{margin:0;font:800 clamp(46px,6.6vw,108px)/.98 var(--titulo);color:#FFF8EC;letter-spacing:-.01em;text-wrap:balance}
.portada__titulo em{font-style:italic;color:#F2C94C}
.portada__lead{margin:0;font-size:clamp(17px,1.3vw,21px);line-height:1.6;color:#F5EDE0;max-width:560px}
.portada__botones{display:flex;flex-wrap:wrap;gap:12px;margin-top:4px}
.marco-34{display:block;aspect-ratio:3/4;overflow:hidden;background:#fff}
.portada__pausa{position:absolute;right:clamp(16px,3vw,40px);bottom:clamp(16px,3vw,40px);z-index:2;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.55);background:rgba(20,10,4,.45);color:#fff;display:grid;place-items:center}
/* EL VIDEO EN SU MARCO GRANDE y los productos colgando de su borde de abajo (14-oct, Kevin: «que no tapen el video»):
   las tarjetas apenas tocan el borde del marco; todo el video, donde pasa la animación, queda a la vista. */
.escena-video{position:relative}
.escena-video__marco{position:relative;width:100%;aspect-ratio:16/9;border-radius:28px;overflow:hidden;background:#3D1A00;box-shadow:0 0 0 1px rgba(255,255,255,.14),0 0 90px rgba(212,160,23,.18),0 40px 80px rgba(0,0,0,.5)}
.escena-video__marco .medio{background:#3D1A00}
.escena-video__marco--tema{background:var(--th-surf);box-shadow:0 0 0 1px rgba(255,255,255,.12),0 0 90px color-mix(in srgb,var(--th-acc) 25%,transparent),0 40px 80px rgba(0,0,0,.5)}
.escena-video__marco--tema .medio{background:var(--th-surf)}
.flotantes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.6vw,26px);align-items:start;width:80%;margin:-28px auto 0}
.flotantes--2{grid-template-columns:repeat(2,minmax(0,1fr));width:58%;margin-right:7%}
.flotantes--1{grid-template-columns:minmax(0,1fr);width:29%;margin-right:18%}
.flotante{position:relative;z-index:2}
.flotantes > .flotante:nth-child(3){margin-top:16px}
/* La primera, al lado izquierdo del video (sobre la parte que no tiene nada). */
.flotante--lado{position:absolute;left:-5%;top:9%;width:27%}
.flotante a{display:block;padding:8px 8px 14px;background:#fff;border-radius:20px;transform:rotate(var(--rot,0deg));box-shadow:0 30px 60px rgba(0,0,0,.45);text-decoration:none;transition:transform .35s var(--curva)}
.flotante a:hover,.flotante a:focus-visible{transform:rotate(0) scale(1.03)}
.flotante .marco-34{border-radius:14px}
.flotante__nombre{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;padding:12px 8px 0;font:700 clamp(16px,1.2vw,20px)/1.25 var(--titulo);color:#2A1300}
/* 27-oct, Kevin: «en escritorio hay un espacio vacío entre las tarjetas». Las 3 dejan de estar desperdigadas (una
   arriba-izquierda y dos abajo-derecha) y cuelgan juntas del borde de abajo del video, como una bandeja: a lo ancho,
   escalonadas en un arco suave y sin tapar la dona (que va arriba). Solo escritorio y solo la portada (la fecha
   especial y el celular no cambian: en celular es una fila que se desliza, más abajo). */
/* Sellito decorativo en el cielo vacío de arriba-izquierda del video (27-oct, Kevin: «en ese espacio vacío pon algo,
   una tarjetita»). Solo escritorio: en el celular el video va de fondo y no hay sitio. */
.escena-sello{display:none;position:absolute;left:2.5%;top:5%;z-index:4;width:clamp(120px,9.6vw,160px);height:auto;rotate:-8deg;filter:drop-shadow(0 18px 26px rgba(40,12,0,.5));animation:flotar 7s ease-in-out infinite}
.escena-sello .sello-arco{fill:#2A1300;font:700 12px/1 var(--letra);letter-spacing:2.4px}
.escena-sello .sello-chico{fill:#2A1300;font:800 15px/1 var(--letra);letter-spacing:3px}
.escena-sello .sello-script{fill:#2A1300;font:800 italic 41px/1 var(--titulo)}
@media (min-width:1240px){
  /* Las 3 tarjetas cuelgan del borde de abajo en fila pareja y BAJAS, para no tapar a los soldaditos haciendo la dona. */
  .portada .flotantes,.portada .flotantes--1,.portada .flotantes--2{grid-template-columns:repeat(3,minmax(0,1fr));width:100%;max-width:none;gap:clamp(14px,1.5vw,26px);align-items:end;margin:clamp(-54px,-3.4vw,-34px) 0 0}
  .portada .flotante--lado{position:static;left:auto;top:auto;width:auto}
  .portada .flotantes>.flotante:nth-child(1){translate:0 -7%}
  .portada .flotantes>.flotante:nth-child(2){translate:0 3%;margin-top:0}
  .portada .flotantes>.flotante:nth-child(3){translate:0 -2%;margin-top:0}
  .portada .escena-sello{display:block}
}
@media (max-width:1239px){
  /* 15-oct, Kevin: «en el celular el video debe estar de fondo, no el video solo afuera»: el video llena la portada,
     detrás del texto, con un velo que deja leer; los productos van en fila debajo de los botones. */
  .portada{min-height:min(92svh,980px);align-items:flex-end}
  .portada__rejilla{position:static;grid-template-columns:1fr;gap:28px;padding-top:clamp(120px,22vw,220px)}
  .portada .escena-video{display:contents}
  .portada .escena-video__marco{position:absolute;inset:0;z-index:0;width:100%;height:100%;aspect-ratio:auto;margin:0;border-radius:0;box-shadow:none}
  .portada__brillo{z-index:1;background:linear-gradient(180deg,rgba(42,19,0,.1) 0%,rgba(42,19,0,.45) 26%,rgba(42,19,0,.86) 48%,rgba(42,19,0,.94) 100%)}
  .portada__titulo,.portada__lead{text-shadow:0 2px 18px rgba(0,0,0,.5)}
  .portada__texto,.portada .flotantes{position:relative;z-index:2}
  /* 15-oct, Kevin: «se ven enanas»: tarjetas GRANDES en una fila que se desliza con el dedo; pueden tapar el video. */
  .portada .flotantes{display:flex;width:auto;max-width:none;margin:0 calc(-1 * var(--pad-x));padding:4px var(--pad-x) 10px;scroll-padding:0 var(--pad-x);gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
  .portada .flotantes::-webkit-scrollbar{display:none}
  .portada .flotante{flex:0 0 min(31%,300px);scroll-snap-align:start}
  .portada .flotante--lado{position:relative;left:auto;top:auto;width:auto}
  .portada .flotantes > .flotante:nth-child(3){margin-top:0}
  .portada .flotante a{transform:none;padding:8px 8px 12px;border-radius:18px}

  .portada__pausa{z-index:3;top:clamp(16px,3vw,28px);bottom:auto}
  .portada .flotantes{align-items:stretch}
  .portada .flotante a{height:100%}
}
@media (max-width:719px){
  /* 15-oct (2.ª vuelta), Kevin: «me dejas espacios vacíos arriba; el video ponlo ahí»: en el celular el video va
     ARRIBA, entero y sin velo (se ve la escena), y debajo el texto y los productos (no lo tapan). */
  .portada{min-height:0;display:block}
  .portada__brillo{display:none}
  .portada__rejilla{padding-top:0;padding-bottom:28px;gap:20px}
  .portada .escena-video__marco{position:relative;inset:auto;order:-1;width:auto;height:auto;aspect-ratio:1/1;margin:0 calc(-1 * var(--pad-x))}
  .portada .escena-video__marco::after{content:"";position:absolute;left:0;right:0;bottom:0;height:28%;z-index:2;pointer-events:none;background:linear-gradient(rgba(42,19,0,0),#2A1300)}
  .portada__titulo,.portada__lead{text-shadow:none}
  .portada__texto{gap:16px}
  .portada__titulo{font-size:clamp(40px,11vw,56px)}
  .portada__lead{font-size:16px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  .portada .flotante{flex-basis:58%}
  .portada .flotante__nombre{font-size:16px;padding:8px 4px 0}
  .flotantes{width:100%;margin:-40px 0 0;grid-template-columns:repeat(2,minmax(0,1fr))}
  /* La fecha especial del Inicio: sus productos GRANDES en una fila que se desliza (antes 2 + 1 sola abajo). */
  .temporada .flotantes{display:flex;gap:14px;margin:16px calc(-1 * var(--pad-x)) 0;padding:4px var(--pad-x) 12px;scroll-padding:0 var(--pad-x);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
  .temporada .flotantes::-webkit-scrollbar{display:none}
  .temporada .flotante{flex:0 0 64%;scroll-snap-align:start}

  .flotantes > .flotante:nth-child(3){margin-top:0}
  .flotante--lado{position:relative;left:auto;top:auto;width:auto}
  .flotante a{transform:none}
}

/* ---------- NUESTRAS DONAS (3 tarjetas iguales) ---------- */
.tres{display:grid;gap:var(--hueco);grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:719px){.tres{grid-template-columns:1fr}}
.tarjeta-dona{display:flex;flex-direction:column;border:1px solid var(--borde2);border-radius:24px;overflow:hidden;background:#fff;text-decoration:none;color:inherit;transition:transform .35s cubic-bezier(.25,1,.5,1),box-shadow .35s}
.tarjeta-dona:hover{transform:translateY(-6px);box-shadow:0 22px 46px rgba(61,26,0,.16);color:inherit}
.tarjeta-dona__foto{position:relative;aspect-ratio:3/4;background:#fff;overflow:hidden}
.tarjeta-dona__foto--gira{background:radial-gradient(circle at 50% 45%,#FFF6E8,#F3E4CF)}
/* La dona que se arma sola (partes/dona-viva): la base se queda; las capas caen una tras otra y la píldora dice cuál. */
.dona-viva{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:8%}
.dona-viva__escena{position:relative;width:100%;max-width:440px;aspect-ratio:1/1;flex:none}
.dona-viva__escena img{position:absolute;inset:6%;width:88%;height:88%;object-fit:contain}
.dona-viva__escena img.dona-viva__base{filter:drop-shadow(0 18px 24px rgba(61,26,0,.28))}
.dona-viva__escena img.dona-viva__extra{inset:auto;height:auto;z-index:2;filter:drop-shadow(0 10px 12px rgba(61,26,0,.35))}
.dona-viva__escena img.sale{opacity:0;scale:1.08;transition:opacity .45s ease,scale .45s ease}
.dona-viva__escena img.entra{animation:dv-cae .7s var(--curva) both;animation-delay:var(--dl,0s)}
.dona-viva__escena img.dona-viva__extra.entra{animation-name:dv-pop}
@keyframes dv-cae{from{opacity:0;translate:0 -9%;scale:1.05}}
@keyframes dv-pop{0%{opacity:0;scale:.2}70%{opacity:1;scale:1.15}100%{scale:1}}
.dona-viva__nombre{flex:none;max-width:100%;padding:9px 18px;border-radius:999px;background:#fff;color:#2A1300;font:700 15px/1.25 var(--letra);text-align:center;box-shadow:0 10px 24px rgba(61,26,0,.16);transition:opacity .3s}
.dona-viva__nombre.cambia{opacity:0}
.dona-viva__nombre b{color:var(--vino,#8B1A1A)}
.tarjeta-dona__txt{flex:1;padding:clamp(18px,2vw,28px);display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.etiqueta-suave{padding:6px 12px;border-radius:999px;background:var(--crema-sec);color:#5A4634;font:700 11.5px/1.2 var(--letra);letter-spacing:.1em;text-transform:uppercase}
.etiqueta-suave--rosa{background:#FBE6E1;color:#8B1A1A}
.tarjeta-dona__titulo{font:800 clamp(24px,2.2vw,34px)/1.05 var(--titulo);color:#2A1300}
.tarjeta-dona__texto{font-size:15.5px;line-height:1.5;color:var(--tinta2)}
.tarjeta-dona .boton{margin-top:auto}

/* ---------- FECHA ESPECIAL (en el Inicio) ---------- */
.tema{--th-bg:#160B20;--th-surf:#24123A;--th-acc:#FF8A3D;--th-acc2:#C9A7FF;--th-line:#3A2156;background:var(--th-bg);color:#FFF8EC}
.temporada{position:relative;overflow:hidden;padding:clamp(64px,8vw,130px) 0 clamp(48px,5vw,80px)}
.temporada__brillo{position:absolute;inset:0;background:radial-gradient(60% 70% at 78% 45%,color-mix(in srgb,var(--th-acc) 25%,transparent),transparent 70%)}
.particulas{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.temporada__rejilla{position:relative;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(32px,4vw,64px);align-items:center}
.fechas-tabs{display:flex;flex-wrap:wrap;gap:8px}
.fechas-tabs__b{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:8px 16px;border-radius:999px;border:1px solid rgba(255,255,255,.28);background:rgba(0,0,0,.25);color:#FFF8EC;font:700 13.5px/1.2 var(--letra);cursor:pointer}
.fechas-tabs__b::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--dot)}
.fechas-tabs__b[aria-pressed="true"]{background:#FFF8EC;color:#2A1300;border-color:#FFF8EC}
.fechas-tabs__b:focus-visible{outline:3px solid var(--th-acc);outline-offset:2px}
.temporada__texto{display:flex;flex-direction:column;align-items:flex-start;gap:18px}
.tema .pildora{background:rgba(0,0,0,.35);border:1px solid var(--th-acc);color:var(--th-acc)}
.temporada__titulo{margin:0;font:800 clamp(44px,5.6vw,96px)/.98 var(--titulo);color:#FFF8EC;text-wrap:balance}
.temporada__titulo em,.fechas__titulo em{font-style:italic;color:var(--th-acc)}
.temporada__sub{margin:0;font:italic 600 clamp(20px,1.9vw,30px)/1.3 var(--titulo);color:var(--th-acc2)}
.temporada__corto{margin:0;font-size:17px;line-height:1.65;color:#F2EADF;max-width:580px}
.cuenta{display:flex;gap:10px;flex-wrap:wrap}
.cuenta div{min-width:84px;padding:12px 14px;border-radius:16px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);text-align:center}
.cuenta b{display:block;font:600 30px/1.2 var(--mono);color:#FFF8EC}
.cuenta span{font:700 11.5px/1.3 var(--letra);letter-spacing:.12em;text-transform:uppercase;color:var(--th-acc2)}
.tira{position:relative;margin-top:clamp(40px,5vw,72px);overflow:hidden}
.tira .cinta-h{padding:6px 9px}
.tira__fila{display:flex;flex-wrap:wrap;gap:18px}
@media (max-width:1239px){.temporada__rejilla{grid-template-columns:1fr}}
@media (max-width:719px){.tira__fila{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.tira__fila .combina__item{width:auto}}

/* ---------- PRODUCTOS (rejilla y tarjeta) ---------- */
.rejilla{display:grid;gap:var(--hueco);grid-template-columns:repeat(var(--cols,5),minmax(0,1fr))}
.rejilla{--cols:5}
@media (max-width:1499px){.rejilla{--cols:4}}
@media (max-width:1099px){.rejilla{--cols:3}}
@media (max-width:719px){.rejilla{--cols:2}}
/* En el Inicio, dos filas (sin carruseles). */
.rejilla--dos > :nth-child(n+11){display:none}
@media (max-width:1499px){.rejilla--dos > :nth-child(n+9){display:none}}
@media (max-width:1099px){.rejilla--dos > :nth-child(n+7){display:none}}
@media (max-width:719px){.rejilla--dos > :nth-child(n+5){display:none}}
/* Una sola fila (en la ficha: «También te puede gustar»). */
.rejilla--una > :nth-child(n+6){display:none}
@media (max-width:1499px){.rejilla--una > :nth-child(n+5){display:none}}
@media (max-width:1099px){.rejilla--una > :nth-child(n+4){display:none}}
@media (max-width:719px){.rejilla--una > :nth-child(n+3){display:none}}
.prod{height:100%;display:flex;flex-direction:column;background:#fff;border:1px solid var(--borde2);border-radius:18px;overflow:hidden;box-shadow:var(--sombra);transition:transform .35s cubic-bezier(.25,1,.5,1),box-shadow .35s}
.prod:hover{transform:translateY(-6px);box-shadow:var(--sombra-alta)}
/* 15-oct, Kevin: «el tamaño está súper bien, pero que se vean COMPLETAS»: la foto con la forma del afiche (3:4), entera. */
.prod__foto{position:relative;display:block;aspect-ratio:3/4;overflow:hidden;background:#fff}
.prod__foto .medio__archivo{transition:transform .6s cubic-bezier(.25,1,.5,1)}
.prod:hover .prod__foto .medio__archivo{transform:scale(1.05)}
.etiqueta{position:absolute;top:12px;left:12px;z-index:2;padding:6px 11px;border-radius:999px;font:700 11px/1.2 var(--letra);letter-spacing:.06em;text-transform:uppercase;box-shadow:0 4px 10px rgba(0,0,0,.15)}
.prod__txt{flex:1;padding:12px 14px 14px;display:flex;flex-direction:column;align-items:flex-start;gap:5px;border-top:1px solid var(--borde2)}
.prod__txt > *{max-width:100%}
.prod__et{padding:3px 9px;border-radius:999px;font:700 10.5px/1.3 var(--letra);letter-spacing:.06em;text-transform:uppercase}
.prod__nombre{margin:0;font:700 17px/1.25 var(--titulo);color:#2A1300;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.prod__nombre a{color:inherit;text-decoration:none}
.prod__nombre a:hover{color:var(--p-txt,var(--vino))}
.prod__chips{display:flex;flex-wrap:wrap;gap:6px}
.prod__chips span{padding:4px 9px;border-radius:999px;font:600 11.5px/1.3 var(--letra);background:#FBE6E1;color:#8B1A1A}
.prod__chips .salado{background:#E3F0E6;color:#1F4A2B}
.prod__chips .para{background:var(--crema-sec);color:#5A4634}
.prod__nota{font-size:13px;color:var(--tinta2);display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.prod__pie{align-self:stretch;margin-top:auto;padding-top:6px;display:flex;align-items:center;justify-content:space-between;gap:8px}
.precio{font:700 20px/1.1 var(--titulo);color:var(--p-txt,var(--vino))}
.precio--chico{font-size:15px}
.prod__pie .boton{min-height:44px;padding:0 16px;font-size:14px;font-weight:600}
@media (max-width:719px){
  :root{--pad-x:12px;--hueco:10px}
  .prod{border-radius:14px}
  .prod__txt{padding:10px 10px 12px;gap:4px}
  .prod__nombre{font-size:15px}
  .prod__origen{font-size:11px;padding:2px 8px}
  .precio{font-size:17px}
  .prod__pie{flex-wrap:wrap;gap:6px}
  .prod__pie .boton{min-height:40px;padding:0 12px;font-size:13.5px;flex:1 1 auto}
  .prod:hover{transform:none}
}

/* ---------- HECHOS PARA TU FECHA (bento) ---------- */
.bento{display:grid;gap:var(--hueco);grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:clamp(300px,23vw,400px)}
/* El nombre y el botón van DEBAJO de la foto (14-oct: encima tapaban medio pastel; las fotos se ven enteras). */
.bento__item{position:relative;display:flex;flex-direction:column;border-radius:22px;overflow:hidden;background:#fff;box-shadow:0 6px 20px rgba(61,26,0,.08)}
.bento__item:first-child{grid-column:span 2;grid-row:span 2}
.bento__ver{position:relative;flex:1;min-height:0;display:block;width:100%;border:0;padding:0;background:#fff;cursor:zoom-in}
.bento__ver .medio{position:absolute;inset:0}
.bento__ver .medio__archivo{object-fit:contain;transition:transform .7s cubic-bezier(.25,1,.5,1)}
.bento__ver:hover .medio__archivo{transform:scale(1.04)}
.bento__pie{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 12px 12px 18px;border-top:1px solid var(--borde2);background:#fff}
.bento__pie > div{min-width:0}
.bento__ocasion{display:block;font:700 10.5px/1.3 var(--letra);letter-spacing:.14em;text-transform:uppercase;color:#8C690F}
.bento__nombre{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font:700 17px/1.25 var(--titulo);color:#2A1300}
.bento__pie .boton{flex:none;min-height:42px;padding:0 14px;font-size:13.5px;font-weight:600}
@media (max-width:719px){
  .bento{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:330px}
  .bento__item:first-child{grid-row:span 1}
  .bento__pie{flex-direction:column;align-items:stretch;gap:8px;padding:10px}
  .bento__nombre{font-size:15.5px;min-height:2.5em}
  .bento__pie .boton{width:100%;min-height:44px}
}

/* ---------- NOSOTROS ---------- */
.nosotros{position:relative;background:var(--cafe-nos);color:#FBF8F2;overflow:hidden}
/* 14-oct, Kevin: «el fondo con un poco más de vida»: luces cálidas (dorado, vino y rosa) y chispas que caen. */
.nosotros__luz{position:absolute;inset:0;background:radial-gradient(45% 55% at 88% 12%,rgba(242,201,76,.30),transparent 70%),radial-gradient(40% 60% at 6% 92%,rgba(192,57,43,.38),transparent 70%),radial-gradient(35% 45% at 50% 60%,rgba(246,165,181,.14),transparent 70%),linear-gradient(160deg,rgba(255,255,255,.05),transparent 45%)}
.nosotros .particulas{--caida:1400px}
.nosotros__rejilla{position:relative;display:flex;flex-direction:column;gap:clamp(36px,4vw,64px)}
.nosotros__cab{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(24px,4vw,64px);align-items:end}
.nosotros .antetitulo{color:var(--a-txt-osc,#D4A017)}
.nosotros__titulo{margin:0;font:800 clamp(38px,4.6vw,76px)/1 var(--titulo);color:#FFF8EC}
.nosotros__titulo em{font-style:italic;color:#F2C94C}
.nosotros__lineas{margin:0;padding:0;list-style:none}
.nosotros__lineas li{display:flex;gap:16px;align-items:baseline;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.14);font-size:clamp(17px,1.3vw,20px)}
.nosotros__lineas b{font:600 15px var(--mono);color:#F2C94C}
/* Las 4 fotos GRANDES, a todo el ancho y desfasadas. */
.mosaico{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,1.8vw,28px);align-items:start;padding-bottom:56px}
.mosaico > div{border-radius:24px;overflow:hidden;background:#fff;padding:8px;box-shadow:0 30px 60px rgba(0,0,0,.32)}
.mosaico > div .marco-34{border-radius:18px}
.mosaico > div:nth-child(2){margin-top:56px}.mosaico > div:nth-child(3){margin-top:16px}.mosaico > div:nth-child(4){margin-top:72px}
@media (max-width:1023px){.nosotros__cab{grid-template-columns:1fr;align-items:start}}
@media (max-width:719px){.mosaico{grid-template-columns:repeat(2,minmax(0,1fr));padding-bottom:28px}.mosaico > div{margin-top:0!important}.mosaico > div:nth-child(even){margin-top:28px!important}}

/* ---------- OPINIONES ---------- */
.opiniones{overflow:hidden}
.opiniones__fila{overflow:hidden;padding:10px 0}
.opiniones .cinta-h{gap:20px;padding:0 10px}
.opinion{margin:0;flex:none;width:540px;display:grid;grid-template-columns:210px 1fr;background:#fff;border-radius:24px;overflow:hidden;box-shadow:0 10px 30px rgba(61,26,0,.10)}
.opinion__foto{min-height:220px}
.opinion__txt{padding:22px 22px 20px;display:flex;flex-direction:column;gap:12px}
.estrellas{color:#B07D00;letter-spacing:3px;font-size:18px}
.opinion blockquote{margin:0;flex:1;font:italic 600 19px/1.4 var(--titulo);color:#2A1300}
.opinion figcaption{display:flex;align-items:center;gap:10px}
.opinion__ini{width:40px;height:40px;border-radius:50%;color:#fff;display:grid;place-items:center;font:700 15px var(--letra);flex:none}
.opinion figcaption strong{display:block;font-size:14.5px;color:var(--tinta)}
.opinion figcaption span span{font-size:13px;color:var(--tinta2)}
@media (max-width:719px){.opinion{width:300px;grid-template-columns:1fr}.opinion__foto{min-height:0;aspect-ratio:4/3}}

/* ---------- TU EVENTO EN 3 PASOS ---------- */
.evento{position:relative;overflow:hidden;background:var(--crema-sec)}
.evento__rejilla{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;min-height:640px}
.evento__texto{padding:clamp(56px,6vw,96px) 0;display:flex;flex-direction:column;gap:22px;align-items:flex-start}
.evento__titulo{margin:0;font:800 clamp(38px,4.6vw,76px)/1 var(--titulo);color:#2A1300}
.evento__titulo em{font-style:italic;color:var(--p-txt,var(--vino))}
.pasos{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:12px}
.pasos li{display:flex;align-items:center;gap:14px;font-size:18px;color:#3A2C1F}
.pasos b{width:38px;height:38px;border-radius:50%;background:var(--vino);color:var(--p-tinta,#fff);display:grid;place-items:center;font:700 15px var(--mono);flex:none}
.evento__cols{display:grid;grid-template-columns:1fr 1fr;gap:16px;height:640px;overflow:hidden;-webkit-mask-image:linear-gradient(180deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(180deg,transparent,#000 12%,#000 88%,transparent)}
.evento__cols > div{overflow:hidden}
.evento__cols .marco-45{border-radius:20px;background:#fff;box-shadow:0 10px 24px rgba(61,26,0,.10)}
.marco-45{display:block;aspect-ratio:4/5;overflow:hidden;background:#fff}
@media (max-width:1239px){.evento__rejilla{grid-template-columns:1fr;min-height:0}.evento__cols{display:none}}

/* ---------- CABECERA DE PÁGINA ---------- */
.cabecera-pag{padding:clamp(36px,5vw,72px) 0 0}
.ruta{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:14px;color:var(--tinta2);margin-bottom:24px}
.ruta a{color:var(--tinta2);text-decoration:none;min-height:36px;display:inline-flex;align-items:center}
.ruta a:hover{color:var(--p-txt,var(--vino))}
.ruta strong{color:var(--tinta)}

/* ---------- VITRINA ---------- */
.buscador{flex:1;min-width:240px;max-width:420px;display:flex;align-items:center;gap:10px;height:52px;padding:0 18px;border:1.5px solid var(--borde-input);border-radius:999px;background:#fff}
.buscador input{flex:1;min-width:0;border:0;outline:0;font:400 16px var(--letra);background:transparent;color:var(--tinta)}
.buscador:focus-within{outline:3px solid #D4A017;outline-offset:2px}
.vitrina__chips{position:sticky;top:var(--cab);z-index:5;background:var(--crema);padding:12px 0;margin:24px 0 28px}
.vacio{padding:60px 0;text-align:center;font-size:18px;color:var(--tinta2)}

/* ---------- FICHA DE PRODUCTO ---------- */
.ficha{display:grid;gap:clamp(28px,5vw,72px);grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start}
.ficha__foto{position:relative;border-radius:28px;background:#fff;overflow:hidden;box-shadow:0 20px 50px rgba(61,26,0,.12)}
.ficha__foto .marco-34{border-radius:0}
.ficha__mas{display:flex;gap:10px;margin-top:12px}
.ficha__mas button{width:76px;border:2px solid var(--borde);border-radius:14px;overflow:hidden;padding:0;background:#fff}
.ficha__mas button[aria-pressed="true"]{border-color:var(--vino)}
.ficha__info{display:flex;flex-direction:column;gap:20px;position:sticky;top:calc(var(--cab) + 26px)}
.ficha__datos{display:flex;flex-wrap:wrap;gap:8px}
.ficha__datos span{padding:8px 14px;border-radius:999px;background:var(--crema-sec);color:#3A2C1F;font-size:14px;font-weight:600}
.ficha__desc{margin:0;font-size:17px;line-height:1.65;color:var(--tinta3)}
.ficha__precio{font:800 clamp(34px,3.4vw,48px)/1 var(--titulo);color:var(--p-txt,var(--vino))}
.ficha__comprar{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.cantidad{display:flex;align-items:center;border:1.5px solid var(--borde-input);border-radius:999px;background:#fff;height:56px}
.cantidad button{width:54px;height:54px;border:0;background:none;font-size:22px;color:#3D1A00;display:grid;place-items:center}
.cantidad output{min-width:32px;text-align:center;font-weight:700;font-size:18px}
.cantidad--chica{height:46px}
.cantidad--chica button{width:42px;height:44px;font-size:18px}
.cantidad--chica output{min-width:22px;font-size:16px}
.entregas{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding-top:18px;border-top:1px solid var(--borde)}
.entregas div{padding:14px 16px;border-radius:16px;background:#fff;border:1px solid var(--borde2)}
.entregas strong{display:block;font-size:14.5px;color:var(--tinta)}
.entregas span{font-size:13.5px;color:var(--tinta2)}
@media (max-width:899px){.ficha{grid-template-columns:1fr}.ficha__info{position:static}}

/* ---------- FECHAS ESPECIALES (página con tema) ---------- */
.fechas__portada{position:relative;overflow:hidden;min-height:clamp(660px,52vw,880px);display:flex;align-items:flex-end;background:var(--th-bg)}
.fechas__fondo{position:absolute;inset:0}
.fechas__fondo .medio{background:var(--th-bg)}
.fechas__velo{position:absolute;inset:0}
/* En el celular y la tableta el texto va encima de TODO el video: un velo parejo del color de la fecha para que se lea. */
@media (max-width:979px){.fechas__velo::after{content:"";position:absolute;inset:0;background:var(--th-bg);opacity:.55}}
.fechas__cont{position:relative;width:100%;padding-top:clamp(56px,6vw,96px);padding-bottom:clamp(28px,3vw,48px);display:flex;flex-direction:column;gap:clamp(28px,4vw,56px)}
.fechas__texto{max-width:760px;display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.fechas__titulo{margin:0;font:800 clamp(46px,6.4vw,110px)/.96 var(--titulo);color:#FFF8EC;text-wrap:balance}
.fechas__sub{margin:0;font:italic 600 clamp(20px,2vw,30px)/1.3 var(--titulo);color:var(--th-acc2)}
.fechas__desc{margin:0;font-size:17px;line-height:1.65;color:#F2EADF;max-width:620px}
.selector-fechas{display:flex;gap:10px;overflow-x:auto;scrollbar-width:none;padding:6px;border-radius:999px;background:rgba(0,0,0,.4);backdrop-filter:blur(10px);align-self:flex-start;max-width:100%}
.selector-fechas::-webkit-scrollbar{display:none}
.selector-fechas a{flex:none;min-height:50px;padding:0 20px;border-radius:999px;color:#FFF8EC;font:700 14.5px var(--letra);white-space:nowrap;display:flex;align-items:center;gap:10px;text-decoration:none;transition:background .25s,color .25s}
.selector-fechas a::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--dot)}
.selector-fechas a small{font-weight:500;opacity:.75;font-size:13px}
.selector-fechas a[aria-current="true"]{background:var(--dot);color:#1F1611}
.selector-fechas a[aria-current="true"]::before{background:#1F1611}
.selector-fechas a[aria-current="true"] small{opacity:1}
/* Los productos de una fecha especial, sobre el fondo de su tema (las tarjetas son las de la vitrina). */
.rejilla--fecha .prod{background:#FFF8EC}
.combina .cinta-h{padding:6px 9px}
.combina__item{flex:none;width:230px;padding:8px 8px 14px;border-radius:20px;background:#fff;text-decoration:none;box-shadow:0 18px 40px rgba(0,0,0,.35)}
.combina__item .marco-34{border-radius:14px}
.combina__item > span:last-child{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;padding:8px 6px 0;font:700 16px/1.3 var(--titulo);color:#2A1300}
.banner-tema{border-radius:28px;padding:clamp(28px,4vw,56px);background:var(--th-surf);border:1px solid var(--th-line);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px}
.banner-tema h2{margin:0 0 8px;font:800 clamp(28px,3vw,46px)/1.1 var(--titulo);color:#FFF8EC}
.banner-tema p{margin:0;font-size:17px;color:#E8DCC8}
.h2--claro{color:#FFF8EC}
.h2--claro em{color:var(--th-acc)}
.antetitulo--tema{color:var(--th-acc)}
@media (max-width:719px){
  .combina__item{width:min(62vw,240px)}
  .fechas__portada{min-height:0}
  .fechas__cont{padding-top:clamp(170px,46vw,260px)}
  .fechas__titulo{font-size:clamp(38px,10.5vw,54px)}
  .fechas__sub{font-size:19px}
  .fechas__desc{font-size:15.5px;line-height:1.55;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  .fechas__texto{gap:12px}
  .temporada__corto{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
}

/* ---------- ARMA TU DONA ---------- */
.armador-seccion{background:#f6efe2}
.armador{display:grid;grid-template-columns:minmax(320px,400px) 1fr;gap:28px;align-items:start;font-family:var(--letra);color:#3c2a20}
/* La columna de la izquierda (la dona y «Tu caja») queda fija y, si la caja crece, se desliza sola. */
.armador__lado{position:sticky;top:calc(var(--cab) + 12px);z-index:5;max-height:calc(100vh - var(--cab) - 24px);overflow-y:auto;overscroll-behavior:contain;display:flex;flex-direction:column;gap:14px;padding-bottom:4px}
.armador__vista{background:#fffcf5;border:1px solid #eadfc9;border-radius:20px;padding:26px;box-shadow:0 10px 30px rgba(109,26,43,.07)}
/* En la computadora la dona se achica un poco para que «Tu caja» se vea debajo sin deslizar. */
@media (min-width:980px){
  .armador__vista{padding:20px 22px}
  .armador__escena{max-width:190px;margin:0 auto}
  .armador__nombre{font-size:23px;margin-top:12px}
  .armador__desc{margin-bottom:8px}
  .armador__total{margin:6px 0 2px}
  .armador__total--texto b{font-size:20px}
  .armador__cuantas{margin-top:8px}
  .armador__botones{flex-wrap:nowrap}
  .armador__botones .boton{flex:1 1 auto;min-height:48px;padding:0 16px;font-size:14px}
}
.armador__cuantas{display:flex;align-items:center;justify-content:center;gap:12px;margin:14px 0 2px;font-size:14px;font-weight:600;color:#6d1a2b}
.armador__cuantas .cantidad{height:44px;border-color:#e0cfb2}
.armador__cuantas .cantidad button{width:44px;height:42px;font-size:20px}
.armador__ir-caja{display:none}
/* Tu caja: cada estilo con su cantidad, «Cambiar» y «Quitar». */
.caja-dona{background:#fffcf5;border:1px solid #eadfc9;border-radius:20px;padding:20px;box-shadow:0 10px 30px rgba(109,26,43,.07)}
.caja-dona__cab{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:10px}
.caja-dona__cab b{font:700 22px/1.2 var(--titulo);color:#6d1a2b}
.caja-dona__cab span{font-size:13.5px;font-weight:700;color:#8a6a3f}
.caja-dona__vacia{margin:0 0 14px;font-size:14px;color:#75604A}
.caja-dona__lista{list-style:none;margin:0 0 14px;padding:0;display:flex;flex-direction:column;gap:10px}
.caja-dona__lista:empty{display:none}
.caja-dona__item{display:grid;grid-template-columns:52px minmax(0,1fr) auto;grid-template-areas:"f t q" "f a a";gap:4px 10px;align-items:center;padding:10px;border:1.5px solid #eadfc9;border-radius:14px;background:#fff}
.caja-dona__item--editando{border-color:#6d1a2b;background:#faf0eb}
.caja-dona__item .mini-dona{grid-area:f;width:52px}
.caja-dona__txt{grid-area:t;min-width:0}
.caja-dona__txt b{display:block;font-size:14px;line-height:1.25;color:#3c2a20}
.caja-dona__txt small{display:block;font-size:12px;line-height:1.3;color:#7a6248;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.caja-dona__item .cantidad{grid-area:q}
.caja-dona__acc{grid-area:a;display:flex;gap:14px}
.cantidad--chica{height:36px;border-color:#e0cfb2}
.cantidad--chica button{width:34px;height:34px;font-size:18px}
.cantidad--chica output{min-width:22px;font-size:15px}
.enlace-chico{background:none;border:0;padding:4px 0;font:700 13px/1.2 var(--letra);color:#6d1a2b;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.boton[disabled]{opacity:.45;cursor:not-allowed}
/* Una dona chiquita armada con sus capas (ideas y caja). */
.mini-dona{position:relative;display:block;aspect-ratio:1/1;border-radius:50%;background:radial-gradient(circle,#fdf8ec,#efe3cb)}
.mini-dona img{position:absolute;inset:4%;width:92%;height:92%;object-fit:contain}
.mini-dona img.mini-dona__extra{inset:auto;width:auto;height:auto}
/* Ideas para empezar. */
.ideas-dona{margin:0 0 26px}
.ideas-dona__tit{margin:0 0 12px;font:700 20px/1.2 var(--titulo);color:#6d1a2b}
.ideas-dona__tit small{display:block;margin-top:4px;font:500 14px/1.3 var(--letra);color:#7a6248}
.ideas-dona__fila{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
.idea-dona{display:flex;flex-direction:column;align-items:center;gap:8px;padding:12px 8px;border-radius:16px;border:2px solid #e6d9c3;background:#fffdf7;color:#3c2a20;cursor:pointer;transition:border-color .18s ease,transform .18s ease}
.idea-dona:hover{border-color:#6d1a2b;transform:translateY(-2px)}
.idea-dona:focus-visible{outline:3px solid #6d1a2b;outline-offset:2px}
.idea-dona .mini-dona{width:min(96px,100%)}
.idea-dona__n{font-size:13.5px;font-weight:700;line-height:1.25;text-align:center}
@media (max-width:1100px){.ideas-dona__fila{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:719px){.ideas-dona__fila{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px}.idea-dona{flex:0 0 132px;scroll-snap-align:start}}
.armador__escena{position:relative;width:100%;aspect-ratio:1/1;background:radial-gradient(circle at 50% 42%,#fdf8ec 0%,#f3e8d2 62%,#ecdec2 100%);border-radius:50%;box-shadow:inset 0 0 0 8px #fffdf8,inset 0 6px 24px rgba(60,42,32,.10)}
.capa{position:absolute;inset:6%;width:88%;height:88%;object-fit:contain}
.capa--base{filter:drop-shadow(0 14px 18px rgba(60,42,32,.28))}
.capa--nueva{animation:capa-entra .35s ease}
@keyframes capa-entra{from{opacity:0;transform:scale(.92)}}
.capa-extra{position:absolute;z-index:5;filter:drop-shadow(0 10px 12px rgba(60,42,32,.4))}
.armador__relleno{position:absolute;left:-4%;bottom:-2%;width:34%;aspect-ratio:1/1;border-radius:50%;overflow:hidden;border:4px solid #fffdf8;box-shadow:0 8px 18px rgba(60,42,32,.25);background:#fff}
.armador__relleno img{width:130%;height:130%;max-width:none;object-fit:cover;margin:-15%}
.armador__nombre{font:700 27px/1.2 var(--titulo);margin:22px 0 4px;text-align:center;color:#6d1a2b}
.armador__desc{margin:0 0 14px;text-align:center;color:#75604A;font-size:15px}
.armador__resumen{margin:0;padding:0;list-style:none}
.armador__resumen li{display:flex;justify-content:space-between;gap:12px;font-size:14px;padding:5px 2px;border-bottom:1px dashed #e8dcc3}
.armador__resumen span:last-child{color:#7a5a2f;font-weight:500}
.armador__total{display:flex;justify-content:center;align-items:baseline;gap:8px;margin:18px 0 6px}
.armador__total b{font:700 38px/1 var(--titulo);color:#3c2a20}
.armador__total--texto b{font-size:24px;line-height:1.2;text-align:center}
.armador__total small{letter-spacing:.18em;font-size:13px;font-weight:600;color:#8a6a3f}
.armador__botones{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:12px}
.armador__botones .boton{letter-spacing:.06em}
.boton--dona{background:#6d1a2b;color:#fffcf5;border-color:#6d1a2b}
.boton--dona:hover{background:#561421;color:#fffcf5}
.boton--dona-linea{background:transparent;color:#6d1a2b;border-color:#6d1a2b}
.armador__pasos{min-width:0;display:flex;flex-direction:column;gap:22px}
.paso-dona{background:#fffcf5;border:1px solid #eadfc9;border-radius:18px;padding:24px}
.paso-dona__cab{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.paso-dona__n{width:30px;height:30px;border-radius:50%;background:#8a6a3f;color:#fffcf5;display:grid;place-items:center;font-weight:600;font-size:15px;flex:none}
.paso-dona h2{font:700 25px/1.2 var(--titulo);margin:0;color:#6d1a2b}
.paso-dona__cuenta{background:#6d1a2b;color:#fffcf5;border-radius:999px;font-size:13px;font-weight:600;padding:3px 12px}
.paso-dona__ayuda{margin:8px 0 16px;color:#7a6248;font-size:14px}
.paso-dona__aviso{margin:-6px 0 14px;color:#a1452f;font-size:13.5px;font-weight:600}
.opciones-dona{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:10px}
.op-dona{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px 8px 12px;border-radius:14px;border:2px solid #e6d9c3;background:#fffdf7;color:#3c2a20;transition:all .18s ease;text-align:center}
.op-dona:hover:not([aria-disabled="true"]){border-color:#c9b48f}
.op-dona[aria-pressed="true"]{border-color:#6d1a2b;background:#faf0eb;box-shadow:0 6px 16px rgba(109,26,43,.20);transform:translateY(-2px)}
.op-dona[aria-disabled="true"]{opacity:.38;cursor:not-allowed}
.opiniones__prueba{display:inline-block;margin:10px 0 0;padding:5px 12px;border-radius:999px;background:#FFF1CC;color:#6B4A00;font-size:13px;font-weight:700}
/* Solo en la vista previa del panel: dónde saldría lo que todavía está vacío (se ve al tocar su campo). */
.ed-vacio{font-style:italic;opacity:.85;outline:1.5px dashed currentColor;outline-offset:2px;border-radius:4px;padding:0 4px}
.aviso-preview{position:sticky;top:0;z-index:60;margin:0;padding:10px 16px;background:#FFF4D6;color:#5A3A00;font:600 14px/1.4 system-ui,sans-serif;text-align:center;border-bottom:2px solid #E8B64C}
/* Solo en la vista previa del panel: lo que hoy no hay sale en gris, para ver dónde saldría si se vuelve a marcar. */
.op-dona--apagada{cursor:not-allowed;border-style:dashed}
.op-dona--apagada .op-dona__img{filter:grayscale(1);opacity:.5}
.op-dona__hoy{font-size:11.5px;font-weight:700;color:#9b2c2c}
.op-dona__img{width:64px;height:64px;border-radius:50%;background:radial-gradient(circle,#fdf8ec,#efe3cb);display:grid;place-items:center;overflow:hidden}
.op-dona__img img{width:86%;height:86%;object-fit:contain}
.op-dona__img--relleno img{width:96%;height:96%;object-fit:cover;border-radius:50%}
.op-dona__nombre{font-size:13px;font-weight:500;line-height:1.25}
.op-dona__precio{font-size:12px;color:#7a5a2f;font-weight:700}
.op-dona__check{position:absolute;top:6px;right:6px;width:22px;height:22px;border-radius:50%;background:#6d1a2b;color:#fff;font-size:12px;font-weight:700;display:none;place-items:center}
.op-dona[aria-pressed="true"] .op-dona__check{display:grid}
@media (max-width:979px){
  .armador{grid-template-columns:1fr}
  /* En el celular: la dona es una barra fija arriba y la caja va después de los pasos. */
  .armador__lado{display:contents}
  .caja-dona{order:3;scroll-margin-top:calc(var(--cab) + 200px)}
  .armador__vista{position:sticky;top:calc(var(--cab) + 8px);z-index:5;display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:18px;box-shadow:0 10px 28px rgba(60,42,32,.18)}
  .armador__cuantas{justify-content:flex-start;margin:0 0 8px;font-size:13px}
  .armador__cuantas .cantidad{height:38px}
  .armador__cuantas .cantidad button{width:36px;height:36px}
  .armador__ir-caja{display:inline-block;margin-top:8px;font-size:13px;font-weight:700;color:#6d1a2b}
  .armador__escena{width:118px;flex:none;box-shadow:inset 0 0 0 4px #fffdf8}
  .armador__info{flex:1;min-width:0}
  .armador__nombre{font-size:19px;margin:0 0 2px;text-align:left}
  .armador__desc{text-align:left;margin:0 0 6px;font-size:13px}
  .armador__resumen,.armador__reiniciar{display:none}
  .armador__total{justify-content:flex-start;margin:0 0 8px}
  .armador__total b{font-size:24px}
  .armador__total.armador__total--texto b{font-size:16px;text-align:left}
  .armador__botones{justify-content:flex-start;margin:0}
  .armador__botones .boton{min-height:44px;padding:0 16px;font-size:13px}
}

/* ---------- COTIZADOR ---------- */
.cotizador{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:clamp(20px,3vw,40px);align-items:start}
.cotizador__pasos{display:flex;flex-direction:column;gap:20px;min-width:0}
.caja{background:#fff;border:1px solid var(--borde);border-radius:24px;padding:clamp(20px,2.6vw,32px)}
.caja__titulo{margin:0 0 16px;display:flex;align-items:center;gap:12px;font:800 26px/1.2 var(--titulo);color:#2A1300}
.caja__titulo b{width:34px;height:34px;border-radius:50%;background:var(--vino);color:var(--p-tinta,#fff);display:grid;place-items:center;font:700 15px var(--letra);flex:none}
.caja__cab{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.caja__cab .caja__titulo{margin:0}
.ocasiones{display:grid;gap:12px;grid-template-columns:repeat(6,minmax(0,1fr))}
.ocasion{position:relative;cursor:pointer;display:flex}
.ocasion input{position:absolute;opacity:0;inset:0;cursor:pointer;margin:0}
.ocasion__caja{width:100%;display:flex;flex-direction:column;border:3px solid var(--borde2);border-radius:20px;overflow:hidden;background:#fff;transition:border-color .2s,transform .2s}
.ocasion__caja .marco-11{display:block;aspect-ratio:1/1;overflow:hidden;background:#fff}
.ocasion__caja .marco-11 .medio__archivo{object-fit:contain}
.ocasion__nombre{flex:1;padding:10px 14px 12px;font:800 19px/1.2 var(--titulo);color:#2A1300}
.ocasion__check{position:absolute;top:10px;right:10px;width:28px;height:28px;border-radius:50%;background:var(--vino);color:#fff;display:none;place-items:center;font-weight:700;font-size:14px}
.ocasion input:checked + .ocasion__caja{border-color:var(--vino);transform:scale(.97)}
.ocasion input:checked + .ocasion__caja .ocasion__nombre{background:var(--vino);color:var(--p-tinta,#fff)}
.ocasion input:checked ~ .ocasion__check{display:grid}
.ocasion input:focus-visible + .ocasion__caja{outline:3px solid #D4A017;outline-offset:3px}
@media (max-width:1299px){.ocasiones{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:719px){.ocasiones{grid-template-columns:repeat(2,minmax(0,1fr))}}
.elegir{display:grid;gap:12px;grid-template-columns:repeat(4,minmax(0,1fr))}
.elegir .elegible--fuera{display:none}
.elegir__mas{display:flex;margin:18px auto 0}
@media (max-width:1099px){.elegir{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:719px){.elegir{grid-template-columns:repeat(2,minmax(0,1fr))}}
.elegible{border-radius:16px;overflow:hidden;border:2px solid var(--borde2);background:#fff;display:flex;flex-direction:column;transition:border-color .2s}
.elegible.con{border-color:var(--vino)}
.elegible__foto{position:relative;border:0;padding:0;background:#fff;display:block;width:100%}
.elegible__n{position:absolute;top:8px;right:8px;min-width:30px;height:30px;padding:0 8px;border-radius:15px;background:var(--vino);color:#fff;font:700 14px/30px var(--letra)}
.elegible__txt{padding:10px 10px 12px;display:flex;flex-direction:column;gap:8px;flex:1}
.elegible__txt > span{font-size:14px;font-weight:600;line-height:1.3;color:var(--tinta);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.elegible .cantidad{margin-top:auto;justify-content:space-between;height:44px;border-color:var(--borde)}
.riel{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;padding:4px}
.caja__ayuda{margin:-4px 0 14px;font-size:14.5px;line-height:1.5;color:var(--tinta2)}
.oblig{display:inline-block;margin-left:6px;padding:1px 8px;border-radius:999px;background:#F6E6E0;color:#8B1A1A;font-size:11px;font-weight:700;letter-spacing:.04em;vertical-align:middle}
.ref__tipo{display:block;padding:0 10px 10px;font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#8a6a3f}
/* Carrito vacío: un carrusel de productos debajo. */
.antojos{width:100%;margin-top:28px;padding-top:24px;border-top:1px dashed var(--borde2)}
.antojos__tit{margin:0 0 14px;font:700 22px/1.2 var(--titulo);color:#2A1300}
.antojos__ventana{overflow:hidden;margin:0 -20px;padding:4px 0 14px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.antojos .cinta-h{gap:16px;padding:0 12px}
.antojos__item{width:190px;box-shadow:0 10px 24px rgba(60,42,32,.14);border:1px solid var(--borde2)}
.antojos__item span:last-child{font-size:14.5px;text-align:left}
.riel::-webkit-scrollbar{display:none}
.riel__flechas{display:flex;gap:8px}
.riel__flechas button{width:46px;height:46px;border-radius:50%;border:0;background:var(--vino);color:#fff;display:grid;place-items:center;box-shadow:0 6px 14px rgba(139,26,26,.3)}
.ref{flex:none;width:210px;aspect-ratio:4/5;scroll-snap-align:start;position:relative;cursor:pointer}
.ref input{position:absolute;opacity:0;inset:0;cursor:pointer;margin:0}
.ref__caja{display:block;height:100%;border:3px solid var(--borde2);border-radius:18px;overflow:hidden;background:#fff}
.ref__caja .medio__archivo{object-fit:contain}
.ref__nombre{position:absolute;left:8px;right:8px;bottom:8px;padding:6px 10px;border-radius:10px;background:rgba(255,255,255,.94);font:600 13px/1.3 var(--letra);color:#2A1300}
.ref__check{position:absolute;top:8px;right:8px;width:28px;height:28px;border-radius:50%;background:var(--vino);color:#fff;display:none;place-items:center;font-weight:700}
.ref input:checked + .ref__caja{border-color:var(--vino)}
.ref input:checked ~ .ref__check{display:grid}
.ref input:focus-visible + .ref__caja{outline:3px solid #D4A017;outline-offset:3px}
.subir-ref{flex:none;width:210px;aspect-ratio:4/5;scroll-snap-align:start;border:2px dashed var(--borde-input);border-radius:18px;background:var(--crema);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;cursor:pointer;position:relative;text-align:center;padding:14px;overflow:hidden}
.subir-ref input{position:absolute;inset:0;opacity:0;cursor:pointer}
.subir-ref:focus-within{outline:3px solid #D4A017;outline-offset:3px}
.subir-ref__ico{width:52px;height:52px;border-radius:50%;background:var(--vino);color:#fff;display:grid;place-items:center;font-size:24px}
.subir-ref img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#fff}
.subir-ref.con-foto{border-style:solid;border-color:var(--vino)}
@media (max-width:719px){.ref,.subir-ref{width:58%}}
.resumen{position:sticky;top:calc(var(--cab) + 20px);display:flex;flex-direction:column;gap:14px;background:#2A1300;color:#FBF8F2;border-radius:24px;padding:24px;box-shadow:0 20px 50px rgba(61,26,0,.25)}
.resumen h2,.resumen h3{margin:0;font:800 24px/1.2 var(--titulo);color:#FFF8EC}
.resumen__chips{display:flex;gap:8px;flex-wrap:wrap}
.resumen__chips span{padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.1);font-size:13px}
.resumen__chips span:first-child{background:#F2C94C;color:#2A1300;font-weight:700}
.resumen__lista{display:flex;flex-direction:column;gap:10px;max-height:300px;overflow:auto;margin:0;padding:0;list-style:none}
.resumen__lista li{display:flex;align-items:center;gap:10px;font-size:14.5px;line-height:1.3}
.resumen__lista img,.resumen__mini{width:44px;height:44px;border-radius:10px;object-fit:cover;background:#fff;flex:none}
.resumen__lista strong{color:#F2C94C;margin-left:auto;white-space:nowrap}
.resumen__vacio{margin:0;font-size:15px;color:#C9B79F}
.resumen__fila{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding-top:12px;border-top:1px solid #4A2A12;font-size:15px;color:#E0D2BE}
.resumen__fila strong{font:700 20px var(--titulo);color:#F2C94C}
.resumen__total strong{font-size:34px}
.resumen .boton{background:#F2C94C;color:#2A1300;min-height:56px;font-size:16px}
.resumen .boton:hover{background:#FFD866;color:#2A1300}
.resumen__nota{font-size:12.5px;color:#C9B79F;text-align:center}
@media (max-width:999px){.cotizador{grid-template-columns:1fr}.resumen{position:static}}

/* ---------- FORMULARIOS ---------- */
.campos{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr))}
.campo{display:flex;flex-direction:column;gap:6px}
.campo label,.campo legend{font:600 14px/1.3 var(--letra);color:#3A2C1F}
.campo input,.campo textarea,.campo select{min-height:50px;border:1.5px solid var(--borde-input);border-radius:14px;padding:0 14px;font:400 16px var(--letra);background:var(--crema);color:var(--tinta);width:100%}
.campo textarea{padding:12px 14px;line-height:1.5;resize:vertical;min-height:96px}
.campo input:focus,.campo textarea:focus,.campo select:focus{outline:3px solid #D4A017;outline-offset:1px;border-color:var(--cafe)}
.campo [aria-invalid="true"]{border-color:#B3261E;background:#FFF5F4}
.campo__ayuda{margin:0;font-size:13px;color:var(--tinta2)}
.error{margin:0;font:600 13.5px/1.4 var(--letra);color:#B3261E}
.error--resumen{padding:12px 14px;border-radius:12px;background:#FDE7E5;border:1px solid #F0B3AD;color:#8C1D16}
.casilla{display:flex;align-items:flex-start;gap:10px;font-size:14.5px;line-height:1.5;color:#3A2C1F;min-height:44px;cursor:pointer}
.casilla input{width:22px;height:22px;margin:1px 0 0;accent-color:var(--vino);flex:none}
.trampa{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.opcion-radio{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr))}
/* 15-oct, Kevin: «¿Cómo pagas?» se montaba en el borde de la caja: la leyenda va DENTRO, como un título. */
fieldset.caja > legend.caja__titulo{float:left;width:100%}
fieldset.caja > legend.caja__titulo + *{clear:both}
.radio-grande{position:relative;cursor:pointer}
.radio-grande input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.radio-grande__caja{display:flex;align-items:center;gap:14px;min-height:76px;padding:14px 16px;border-radius:18px;border:2px solid var(--borde);background:#fff;transition:border-color .2s,background .2s}
.radio-grande__punto{width:22px;height:22px;border-radius:50%;border:2px solid var(--borde-input);display:grid;place-items:center;flex:none}
.radio-grande__punto::after{content:"";width:10px;height:10px;border-radius:50%;background:transparent}
.radio-grande strong{display:block;font-size:16px;color:var(--tinta)}
.radio-grande span span{font-size:13.5px;color:var(--tinta2)}
.radio-grande input:checked + .radio-grande__caja{border-color:var(--vino);background:#FBF3EE}
.radio-grande input:checked + .radio-grande__caja .radio-grande__punto{border-color:var(--vino)}
.radio-grande input:checked + .radio-grande__caja .radio-grande__punto::after{background:var(--vino)}
.radio-grande input:focus-visible + .radio-grande__caja{outline:3px solid #D4A017;outline-offset:3px}
.zonas{display:flex;flex-wrap:wrap;gap:8px}
.zona{position:relative}
.zona input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.zona span{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border-radius:999px;border:1.5px solid var(--borde);background:#fff;color:#3A2C1F;font:600 14px var(--letra)}
.zona input:checked + span{background:var(--vino);border-color:var(--vino);color:var(--p-tinta,#fff)}
.zona input:focus-visible + span{outline:3px solid #D4A017;outline-offset:2px}

/* ---------- PREGUNTAS ---------- */
.preguntas{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:clamp(20px,3vw,40px);align-items:start}
.preguntas__lista{display:flex;flex-direction:column;gap:12px;min-width:0}
.pregunta{background:#fff;border:1.5px solid var(--borde);border-radius:20px;overflow:hidden;transition:border-color .2s}
.pregunta.abierta{border-color:var(--vino)}
.pregunta h3{margin:0}
.pregunta__boton{width:100%;min-height:64px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 22px;border:0;background:none;text-align:left;font:700 17px/1.4 var(--letra);color:var(--tinta)}
.pregunta__ico{flex:none;width:34px;height:34px;border-radius:50%;background:var(--crema-sec);color:var(--p-txt,var(--vino));display:grid;place-items:center;font-size:20px;transition:transform .25s,background .2s,color .2s}
.pregunta.abierta .pregunta__ico{transform:rotate(45deg);background:var(--vino);color:#fff}
.pregunta__resp{margin:0;padding:0 22px 20px;font-size:16px;line-height:1.65;color:var(--tinta3);white-space:pre-line}
.banner-video{position:relative;border-radius:24px;overflow:hidden;min-height:260px;display:flex;align-items:flex-end;background:#1F1611;margin-top:12px;text-decoration:none}
.banner-video .medio{position:absolute;inset:0;background:#1F1611}
.banner-video__velo{position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,10,4,.9),rgba(20,10,4,.3))}
.banner-video__txt{position:relative;padding:28px;display:flex;flex-direction:column;gap:10px;align-items:flex-start;max-width:520px}
.banner-video__txt small{font:700 12px/1.3 var(--letra);letter-spacing:.16em;text-transform:uppercase;color:var(--th-acc)}
.banner-video__txt strong{font:800 clamp(26px,2.6vw,38px)/1.05 var(--titulo);color:#FFF8EC}
.banner-video__txt strong em{color:var(--th-acc)}
.lado-dona{position:relative;border-radius:24px;overflow:hidden;background:radial-gradient(90% 60% at 50% 30%,#A82A2A,var(--vino) 70%);display:flex;flex-direction:column;text-decoration:none}
.lado-dona__dona{position:relative;display:block;aspect-ratio:1/1;width:100%}
.lado-dona .dona-viva{padding:8% 10% 0}
.lado-dona .dona-viva__escena img.dona-viva__base{filter:drop-shadow(0 18px 26px rgba(0,0,0,.4))}
.lado-dona__txt{position:relative;padding:24px;display:flex;flex-direction:column;gap:8px}
.lado-dona__txt small{font:700 12px/1.3 var(--letra);letter-spacing:.16em;text-transform:uppercase;color:#F2C94C}
.lado-dona__txt strong{font:800 30px/1.05 var(--titulo);color:#FFF8EC}
.lado-dona__txt span{align-self:flex-start;margin-top:6px;min-height:44px;padding:0 20px;border-radius:999px;background:#F2C94C;color:#2A1300;font:700 14px/44px var(--letra)}
.aside-pegado{position:sticky;top:calc(var(--cab) + 20px);display:flex;flex-direction:column;gap:16px}
@media (max-width:999px){.preguntas{grid-template-columns:1fr}.aside-pegado{position:static}}

/* ---------- MI PEDIDO ---------- */
.pestanas-pedido{display:flex;padding:5px;border-radius:999px;background:var(--crema-sec)}
.pestanas-pedido button{min-height:46px;padding:0 22px;border:0;border-radius:999px;background:transparent;color:#5A4634;font:700 14.5px var(--letra);display:flex;align-items:center;gap:8px}
.pestanas-pedido button[aria-selected="true"]{background:#fff;color:var(--p-txt,var(--vino));box-shadow:0 4px 12px rgba(61,26,0,.12)}
.pestanas-pedido b{min-width:22px;height:22px;padding:0 6px;border-radius:11px;background:var(--borde);color:#3A2C1F;font-size:12px;line-height:22px}
.pestanas-pedido button[aria-selected="true"] b{background:var(--vino);color:#fff}
.pedido{display:grid;gap:clamp(20px,3vw,36px);grid-template-columns:minmax(0,1fr) 380px;align-items:start}
.pedido__izq{display:flex;flex-direction:column;gap:18px;min-width:0}
.lineas{background:#fff;border:1px solid var(--borde);border-radius:24px;overflow:hidden}
.linea{display:flex;gap:16px;align-items:center;padding:16px 20px;border-bottom:1px solid var(--borde2)}
.linea__foto{width:84px;height:112px;border-radius:14px;overflow:hidden;flex:none;background:#fff}
.linea__foto--dona{background:radial-gradient(circle,#fdf8ec,#efe3cb);position:relative}
.linea__foto--dona img{position:absolute;inset:4%;width:92%;height:92%;object-fit:contain}
.linea__txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.linea__txt strong{font-size:16.5px;color:var(--tinta)}
.linea__txt span{font-size:13.5px;color:var(--tinta2)}
.linea__mas{width:100%;min-height:56px;border:0;background:var(--crema);color:var(--p-txt,var(--vino));font:700 15px var(--letra);display:flex;align-items:center;justify-content:center;text-decoration:none}
@media (max-width:719px){.linea{flex-wrap:wrap}.linea__foto{width:64px;height:86px}}
.vacio-pedido{padding:60px 20px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:14px;background:#fff;border-radius:24px;border:1px solid var(--borde)}
.vacio-pedido h2{margin:0;font:800 32px/1.2 var(--titulo);color:#2A1300}
@media (max-width:999px){.pedido{grid-template-columns:1fr}}
/* Seguimiento */
.seguir{display:flex;flex-direction:column;gap:24px}
.seguir__cab{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;align-items:baseline}
.seguir__codigo{font:600 22px var(--mono);color:#2A1300}
.pasos-pedido{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.pasos-pedido li{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;position:relative;font-size:14.5px;color:var(--tinta2)}
.pasos-pedido li::before{content:"";position:absolute;top:21px;left:-50%;right:50%;height:4px;border-radius:2px;background:var(--borde)}
.pasos-pedido li:first-child::before{display:none}
.pasos-pedido i{position:relative;width:46px;height:46px;border-radius:50%;background:#fff;color:#9A8A75;border:2px solid var(--borde);display:grid;place-items:center;font:700 16px var(--letra);font-style:normal}
.pasos-pedido .hecho::before{background:var(--ok)}
.pasos-pedido .hecho i{background:var(--ok);border-color:var(--ok);color:#fff}
.pasos-pedido .hecho{color:var(--ok)}
.pasos-pedido .ahora::before{background:var(--ok)}
.pasos-pedido .ahora i{background:var(--vino);border-color:var(--vino);color:#fff;box-shadow:0 0 0 6px rgba(139,26,26,.16)}
.pasos-pedido .ahora{color:var(--p-txt,var(--vino));font-weight:700}
@media (max-width:719px){.pasos-pedido li{font-size:12.5px}}
.aviso-listo{display:flex;gap:16px;align-items:center;padding:22px;border-radius:24px;background:var(--aviso);border:1px solid var(--aviso-borde)}
.aviso-listo__ico{flex:none;width:52px;height:52px;border-radius:50%;background:#D4A017;display:grid;place-items:center;color:#2A1300}
.aviso-listo strong{display:block;font-size:17px;color:#2A1300}
.aviso-listo span{font-size:15px;color:#5A4210}
/* Confirmado */
/* Una columna (15-oct, Kevin): el «¡Gracias!» y debajo «¿Le sumas algo?» en carrusel. */
.confirmado{display:flex;flex-direction:column;gap:clamp(20px,3vw,32px)}
.confirmado__caja{max-width:820px}
.confirmado__caja{background:#fff;border:1px solid var(--borde);border-radius:28px;padding:clamp(24px,3.6vw,48px);display:flex;flex-direction:column;gap:18px;box-shadow:0 20px 50px rgba(61,26,0,.08)}
.check-ok{width:76px;height:76px;border-radius:50%;background:var(--ok);display:grid;place-items:center;box-shadow:0 0 0 10px var(--ok-bg);animation:pop .7s cubic-bezier(.34,1.56,.64,1)}
@keyframes pop{0%{transform:scale(0)}70%{transform:scale(1.12)}100%{transform:scale(1)}}
.codigo-caja{padding:16px 18px;border-radius:18px;background:var(--crema-sec);display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.codigo-caja span{font-size:14px;color:var(--tinta2)}
.codigo-caja strong{font:600 24px var(--mono);color:#2A1300;letter-spacing:.04em}
.subir-comp{display:flex;align-items:center;gap:14px;padding:16px;border:2px dashed var(--borde-input);border-radius:18px;background:var(--crema);cursor:pointer;position:relative}
.subir-comp input{position:absolute;inset:0;opacity:0;cursor:pointer}
.subir-comp:focus-within{outline:3px solid #D4A017;outline-offset:3px}
.subir-comp i{width:48px;height:48px;border-radius:14px;background:var(--vino);color:#fff;display:grid;place-items:center;font-size:22px;font-style:normal;flex:none}
.cuentas-lista{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px}
/* La transferencia dentro del pedido: el monto, las cuentas (con «Copiar») y el comprobante. */
.transfer{display:flex;flex-direction:column;gap:12px;padding:16px;border-radius:18px;background:#FBF3EE;border:1.5px solid #EAD3C6}
.transfer__txt{margin:0;font-size:14.5px;line-height:1.5;color:var(--tinta)}
.transfer__monto{display:inline-block;margin-left:4px;padding:2px 10px;border-radius:999px;background:#fff;color:var(--vino);white-space:nowrap}
.transfer .cuentas-lista li{background:#fff}
.copiar{margin-left:6px;min-height:32px;padding:4px 12px;border-radius:999px;border:1.5px solid var(--borde2,#E6D9C6);background:#fff;color:var(--tinta);font:700 12.5px/1 var(--letra);cursor:pointer}
.copiar:hover{border-color:var(--vino)}
.copiar:focus-visible{outline:3px solid #D4A017;outline-offset:2px}
.aviso-pago{margin:0;padding:10px 14px;border-radius:12px;background:#FFF4D6;color:#5A3A00;font-size:14px;font-weight:600}
.subir-comp--listo{border-style:solid;border-color:#2F6B40;background:#EEF6EF}
.cuentas-lista li{padding:12px 14px;border-radius:14px;background:var(--crema);font-size:14.5px;line-height:1.5}
.cuentas-lista b{font-family:var(--mono);font-weight:600}
.sumas{background:#2A1300;border-radius:28px;padding:clamp(24px,3.6vw,44px);display:flex;flex-direction:column;gap:18px;color:#FBF8F2}
.sumas .antetitulo{color:#F2C94C}
.sumas h2{margin:8px 0 0;font:800 clamp(28px,3vw,44px)/1.05 var(--titulo);color:#FFF8EC}
.sumas h2 em{font-style:italic;color:#F2C94C}
/* Tarjeta HORIZONTAL: la foto entera a la izquierda (sobre blanco) y el nombre, el precio y «Agregar» al lado. */
.suma{flex:0 0 min(330px,84%);scroll-snap-align:start;display:grid;grid-template-columns:112px minmax(0,1fr);align-items:center;background:#fff;border-radius:18px;overflow:hidden}
.suma__foto{display:block;aspect-ratio:1;background:#fff;overflow:hidden}
.suma > div{padding:10px 14px 10px 10px;display:flex;flex-direction:column;align-items:flex-start;gap:6px;min-width:0}
.suma__n{font-size:14.5px;font-weight:600;color:var(--tinta);line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.suma__p{font:700 16px/1 var(--titulo);color:var(--vino)}
.suma .boton{min-height:40px;padding:0 16px;font-size:14px}
/* CARRUSEL que se mueve con el dedo (y con el mouse arrastrando), con flechas en la computadora. */
.carrusel{position:relative}
.carrusel__pista{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;padding:2px 2px 6px;cursor:grab;overscroll-behavior-x:contain}
.carrusel__pista::-webkit-scrollbar{display:none}
.carrusel__pista.arrastrando{cursor:grabbing;scroll-snap-type:none;scroll-behavior:auto;user-select:none}
.carrusel__pista:focus-visible{outline:3px solid #D4A017;outline-offset:3px;border-radius:12px}
.carrusel__flecha{position:absolute;top:50%;z-index:2;width:44px;height:44px;margin-top:-22px;border-radius:50%;border:0;background:#fff;color:var(--tinta);font:700 26px/1 var(--letra);box-shadow:0 6px 18px rgba(0,0,0,.25);cursor:pointer;display:grid;place-items:center}
.carrusel__flecha--izq{left:-10px}
.carrusel__flecha--der{right:-10px}
.carrusel__flecha:focus-visible{outline:3px solid #D4A017;outline-offset:2px}
@media (hover:none){.carrusel__flecha{display:none}}
.suma .boton.listo{background:var(--ok);color:#fff}
@media (max-width:899px){.confirmado{grid-template-columns:1fr}}
.dos-banners{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(20px,3vw,36px)}
@media (max-width:899px){.dos-banners{grid-template-columns:1fr}}

/* ---------- AVISO «AGREGADO» ---------- */
.aviso-agregado{position:fixed;left:50%;bottom:24px;z-index:55;transform:translateX(-50%);padding:12px 20px;border-radius:999px;background:var(--ok);color:#fff;font:700 14px var(--letra);box-shadow:0 10px 30px rgba(0,0,0,.25);white-space:nowrap;display:flex;align-items:center;gap:10px;animation:sube-aviso .35s var(--curva)}
.aviso-agregado a{background:rgba(255,255,255,.2);color:#fff;border-radius:999px;min-height:32px;padding:0 12px;display:inline-flex;align-items:center;text-decoration:none;font-size:13px}
@keyframes sube-aviso{from{transform:translate(-50%,16px);opacity:0}}
@media (max-width:719px){.aviso-agregado{bottom:84px}}

/* ---------- VISOR (lightbox) ---------- */
.visor{border:0;padding:0;background:transparent;max-width:min(1040px,94vw);width:100%;max-height:92vh}
.visor::backdrop{background:rgba(20,10,4,.86)}
.visor__caja{background:#FBF8F2;border-radius:24px;overflow:auto;max-height:92vh;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr))}
.visor__medio{background:#fff;display:flex;align-items:center;justify-content:center;min-height:300px}
.visor__medio img,.visor__medio video{width:100%;max-height:74vh;object-fit:contain}
.visor__info{padding:clamp(22px,3vw,36px);display:flex;flex-direction:column;gap:14px;justify-content:center}
.visor__info h2{margin:0;font:800 32px/1.08 var(--titulo);color:#2A1300}

/* ---------- PIE ---------- */
.pie{background:var(--cafe-pie);color:#E8DCC8;padding:clamp(48px,6vw,80px) 0 28px}
.pie__rejilla{display:grid;gap:36px;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr))}
.pie__marca{display:flex;flex-direction:column;gap:12px;align-items:flex-start}
/* 14-oct, Kevin: «el logo del footer más grande, que llene el círculo». */
.pie__logo{width:156px;height:156px;border-radius:50%;background:#fff;display:grid;place-items:center;overflow:hidden;box-shadow:0 0 0 4px rgba(255,248,236,.12)}
.pie__logo img{width:100%;height:100%;object-fit:cover;transform:scale(.94)}
.pie__lema{margin:0;font:italic 400 18px/1.4 var(--titulo);color:#F5EDE0}
.pie__texto{margin:0;font-size:14.5px;line-height:1.6;color:#C9B79F}
.pie h2{margin:0 0 4px;font:700 12.5px/1.3 var(--letra);letter-spacing:.2em;text-transform:uppercase;color:#D4A017}
.pie__col{display:flex;flex-direction:column;gap:10px}
.pie__col a,.pie__col span{font-size:15px;color:#E8DCC8;text-decoration:none}
.pie__col a:hover{color:#F2C94C}
.pie__tel{font:600 15px var(--mono)!important;color:#F2C94C!important}
.pie__redes{display:flex;gap:8px;flex-wrap:wrap}
.pie__redes a{min-height:44px;padding:0 14px;border-radius:999px;border:1px solid #4A2A12;display:flex;align-items:center;gap:8px;font-size:14px}
.pie__abajo{margin-top:36px;padding-top:20px;border-top:1px solid #3A2C1F;display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;font-size:13px;color:#C9B79F}
.pie__abajo a{color:#E8DCC8}

/* ---------- LEGALES ---------- */
.legal{max-width:860px}
.legal__texto{margin-top:24px;font-size:16px;line-height:1.75;color:var(--tinta3);white-space:pre-line}

/* ---------- VISTA PREVIA DEL PANEL ---------- */
.en-preview .ed-campo{outline:3px solid #FFD43B;outline-offset:5px;border-radius:6px;box-shadow:0 0 0 9px rgba(255,212,59,.28);animation:ed-pulso 1.4s ease-in-out 2}
@keyframes ed-pulso{50%{box-shadow:0 0 0 14px rgba(255,212,59,.12)}}

/* ---------- TAMAÑOS DE UN MISMO PRODUCTO (14-oct): Coca-Cola 300 ml · 1 L · 1.35 L en una sola tarjeta ---------- */
.prod__tam-foto{display:block;width:100%;height:100%}
.prod__tam-foto[hidden]{display:none}
.prod__tams,.ficha__tams{display:flex;flex-wrap:wrap;gap:6px}
.prod__tam{min-height:36px;padding:6px 12px;border-radius:999px;border:1.5px solid var(--borde2,#E6D9C6);background:#fff;color:var(--tinta,#2A1300);font:700 13.5px/1.2 var(--letra);cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:6px}
.prod__tam:hover{border-color:var(--p)}
.prod__tam[aria-pressed="true"],.prod__tam[aria-current="page"]{background:var(--p);border-color:var(--p);color:var(--p-tinta)}
.prod__tam:focus-visible{outline:3px solid var(--a);outline-offset:2px}
.prod__tam small{font-weight:600;opacity:.85}
.ficha__tams .prod__tam{min-height:44px;padding:8px 16px;font-size:15px}

/* ---------- QUIÉN HACE EL PRODUCTO (14-oct, tema legal): «Hecho en Roman's» o «Marca: Coca-Cola» ---------- */
.prod__origen{align-self:flex-start;max-width:100%;padding:3px 10px;border-radius:999px;background:var(--crema-sec,#F3EADB);color:#5A4634;font:700 12px/1.4 var(--letra);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.prod__origen--propio{background:#E7F2E7;color:#1F4A2B}
.ficha__origen{margin:0;padding:12px 14px;border-radius:14px;background:var(--crema-sec,#F3EADB);border:1px solid var(--borde2,#E6D9C6);font-size:14.5px;line-height:1.5;color:var(--tinta,#2A1300)}
.ficha__origen--propio{background:#EEF6EE;border-color:#B9D8BC}
.pie__marcas{margin:14px 0 0;font-size:12.5px;line-height:1.5;color:#B5A38C;max-width:760px}