/* RSJ · plantillas v3 · hoja común de todas las páginas: fuentes, tokens 0.17 y base 1.1, y las piezas compartidas header 1.2 y footer 1.1
   (con contacto-whatsapp 1.0-rc4: formas «pie» y «destacado»). Copias tal cual de la biblioteca (rsj_integracion_piezas_v2, catálogo v0.46; header 1.2 y
   contacto-whatsapp 1.0-rc4 del paquete rsj_plantilla_contacto_v1.0). Se carga antes que la hoja de cada página. Los módulos no se cambian aquí: se piden al «Gestor de módulos». */
@font-face{font-family:Montserrat;src:url(../fonts/montserrat-400-700.woff2) format("woff2");font-weight:400 700;font-display:swap}@font-face{font-family:"Montserrat Fallback";src:local("Arial"),local("Liberation Sans"),local("Helvetica");size-adjust:112.2%;ascent-override:86.27%;descent-override:22.37%;line-gap-override:0%}
/* ===== biblioteca: tokens (sin cambios) ===== */
/* RSJ · tokens v0.17 (15/10/2026; copia del libro §15, sin cambios de valores desde la v0.12). Fuente única: «RSJ - libro de estilo» §15. Dueño: chat «Libro de estilos». No cambiar en el repositorio. */
/* Puntos de corte (no admiten variables): móvil primero; @media (min-width:768px) y @media (min-width:1024px). */
:root{
  color-scheme: light;
  --color-brand-600:#B8320D; --color-brand-700:#92270A; --color-brand-100:#FBE8E2;
  --color-action:#176B3A; --color-action-hover:#10512C; --color-action-soft:#E3F3E8;
  --color-ink:#1D2420; --color-text-muted:#536058; --color-surface:#FFFFFF; --color-surface-soft:#F7F8F5;
  --color-border:#DCE3DC; --color-border-strong:#7A847E;
  --color-success:#176B3A; --color-success-soft:#E3F3E8; /* v0.10: valor propio; ningún tema lo cambia */ --color-status-on:#16A34A; --color-status-on-halo:rgba(22,163,74,.22); --color-warning:#9A5B00; --color-warning-soft:#FFF4E0;
  --color-error:#B42318; --color-error-soft:#FDECEA;
  --color-avail-5:#3B6D11; --color-avail-4:#639922; --color-avail-3:#97C459; --color-avail-2:#EF9F27; --color-avail-1:#D85A30; --color-avail-out:#E24B4A;
  --color-campaign-sant-jordi:var(--color-brand-600); --color-campaign-navidad:#D42426; /* rojo Navidad (libro v0.11) */ --color-campaign-san-valentin:#B0185E;
  --color-campaign-dia-madre:#6B3FA0; --color-campaign-ramos:#4F5D16; --color-campaign:var(--color-campaign-sant-jordi);
  --font-ui:"Montserrat","Montserrat Fallback",sans-serif;
  --fs-h1:32px; --fs-h2:26px; --fs-h3:20px; --fs-body:16px; --fs-aux:14px; --fs-badge:12px;
  --fs-price-lead:36px; --fs-price:28px; --fs-cta:20px;
  --lh-body:1.6; --lh-h1:1.15; --lh-h2:1.2; --lh-h3:1.3; --lh-tight:1.1;
  --fw-regular:400; --fw-medium:500; --fw-semibold:600; --fw-bold:700;
  --s-4:4px; --s-8:8px; --s-12:12px; --s-16:16px; --s-24:24px; --s-32:32px; --s-48:48px; --s-64:64px; --s-80:80px; --s-120:120px;
  --gutter:var(--s-16); --section-gap:var(--s-48); --container-max:1280px;
  --logo-h:40px; --header-h:60px; --strip-h:44px; --strip2-h:52px; --grid-cols:1; --grid-gap:var(--s-16); --card-thumb:96px;
  --h-btn:48px; --h-btn-lg:56px; --h-touch-min:44px; --icon-sm:20px; --icon-md:24px; --brand3-glyph:22px; /* v0.12: glifo de WhatsApp en el botón de 48 px */ --status-dot:8px; --status-halo:4px;
  --radius-sm:8px; --radius-md:12px; --radius-lg:20px; --radius-pill:999px;
  --shadow-sm:0 2px 8px rgba(29,36,32,.12); --shadow-lg:0 8px 32px rgba(29,36,32,.18); --overlay:rgba(29,36,32,.48);
  --z-sticky:20; --z-dropdown:30; --z-overlay:40; --z-drawer:41; --z-toast:50; --z-skip:100;
  --dur-fast:150ms; --dur-base:200ms; --ease:cubic-bezier(.2,0,0,1);
  --t-added:2000ms; --t-toast:4000ms; --t-toast-action:6000ms;
}
@media (min-width:768px){:root{--gutter:var(--s-24);--grid-cols:3;--grid-gap:var(--s-24)}}
@media (min-width:1024px){:root{--fs-h1:40px;--fs-h2:30px;--fs-h3:22px;--fs-price-lead:38px;--fs-price:30px;--section-gap:var(--s-80);--grid-cols:4;--logo-h:48px;--header-h:72px}}
@media (prefers-reduced-motion:reduce){:root{--dur-fast:0ms;--dur-base:0ms}}
html{scroll-padding-top:var(--header-h)} /* solo el header es fijo (libro §4.5) */
/* Temas de campaña (libro §2.7): solo estos ocho tokens */
[data-tema="navidad"]{--color-action:#D42426;--color-action-hover:#A51A1D;--color-action-soft:#FEEEEE;--color-surface-soft:#FFF4F4;--color-brand-100:#FCE3E4;--color-brand-700:#8E1517;--color-border:#F1D6D7;--color-campaign:var(--color-campaign-navidad)}
/* ===== biblioteca: base (sin cambios) ===== */
/* RSJ · base · v1.1 (validado por Miguel el 15/10/2026): «Añadida» en success/success-soft (libro v0.12).css · módulo 0 · v1.0 (validada por Miguel el 08/10/2026). Biblioteca de módulos. Requiere tokens.css (libro §15).
   Solo tokens del libro; sin valores sueltos salvo 1-2 px de bordes y contornos. */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--color-surface);color:var(--color-ink);font-family:var(--font-ui);font-size:var(--fs-body);line-height:var(--lh-body);font-weight:var(--fw-regular)}
img,svg{display:block;max-width:100%;height:auto}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
h1,h2,h3,p,ul,ol,dl,dd,figure{margin:0}
h1{font-size:var(--fs-h1);line-height:var(--lh-h1);font-weight:var(--fw-bold);text-wrap:balance}
h2{font-size:var(--fs-h2);line-height:var(--lh-h2);font-weight:var(--fw-bold);text-wrap:balance}
h3{font-size:var(--fs-h3);line-height:var(--lh-h3);font-weight:var(--fw-semibold)}
a{color:var(--color-action)}
a:hover{color:var(--color-action-hover)}
:focus-visible{outline:2px solid var(--color-action);outline-offset:2px}
.t-aux{font-size:var(--fs-aux);font-weight:var(--fw-medium)}
.t-muted{color:var(--color-text-muted)}
.t-badge{font-size:var(--fs-badge);line-height:1.3;font-weight:var(--fw-semibold);text-transform:uppercase;letter-spacing:.04em}
.num{font-variant-numeric:tabular-nums}
.container{max-width:var(--container-max);margin-inline:auto;padding-inline:var(--gutter)}
.sec{padding-block:var(--section-gap)}
.sec--soft{background:var(--color-surface-soft)}
.sec-head{max-width:760px;margin-bottom:var(--s-24)}
.sec-head p{margin-top:var(--s-8);color:var(--color-text-muted)}
.prose{max-width:760px}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:var(--s-8);top:-80px;z-index:var(--z-skip);background:var(--color-ink);color:var(--color-surface);padding:var(--s-8) var(--s-16);border-radius:var(--radius-sm)}
.skip:focus{top:var(--s-8)}

/* Botones (libro §8.2). Estados: data-state="loading" | "added"; agotado = .btn-out */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s-8);min-height:var(--h-btn);padding:var(--s-12) var(--s-24);border-radius:var(--radius-sm);border:2px solid transparent;font-size:var(--fs-body);font-weight:var(--fw-semibold);line-height:1.2;text-decoration:none;text-align:center;transition:background-color var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease),color var(--dur-fast) var(--ease)}
.btn svg{width:var(--icon-sm);height:var(--icon-sm);flex:none}
.btn-primary{background:var(--color-action);color:var(--color-surface)}
.btn-primary:hover{background:var(--color-action-hover);color:var(--color-surface)}
.btn-secondary{background:var(--color-surface);border-color:var(--color-action);color:var(--color-action)}
.btn-secondary:hover{background:var(--color-action-soft);border-color:var(--color-action-hover);color:var(--color-action-hover)}
.btn-lg{min-height:var(--h-btn-lg);font-size:var(--fs-cta)}
.btn-block{width:100%}
.btn-link{min-height:var(--h-touch-min);padding:0 var(--s-8);background:none;border:0;color:var(--color-action);text-decoration:none}
.btn-link:hover{background:none;text-decoration:underline}
.btn[data-state=loading] .btn__ico{animation:btn-spin .8s linear infinite}
.btn[data-state=added],.btn[data-state=added]:hover{background:var(--color-success-soft);border:2px solid var(--color-success);color:var(--color-success)} /* v1.1: «Añadida» siempre verde, también con tema (libro §8.2, C1.a) */
.btn-out,.btn-out:hover{background:var(--color-surface);border:1px solid var(--color-border-strong);color:var(--color-ink);cursor:default}
@keyframes btn-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.btn[data-state=loading] .btn__ico{animation:none}}

/* «Por confirmar» (libro C1.b): contorno discontinuo en el dato + etiqueta */
.tbd{outline:1px dashed var(--color-warning);outline-offset:2px;border-radius:2px}
.tbd-tag{display:inline-block;margin-left:var(--s-4);padding:0 var(--s-8);border-radius:var(--radius-pill);background:var(--color-warning-soft);color:var(--color-warning);font-size:var(--fs-badge);font-weight:var(--fw-semibold);line-height:1.7;vertical-align:middle;white-space:nowrap}

/* Campo (libro §8.8 y §8.5) */
.field{display:grid;gap:var(--s-4)}
.field>label{font-size:var(--fs-aux);font-weight:var(--fw-semibold)}
.input{width:100%;min-height:var(--h-touch-min);padding:var(--s-8) var(--s-12);border:1px solid var(--color-border-strong);border-radius:var(--radius-sm);background:var(--color-surface)}
.field__help{font-size:var(--fs-aux);color:var(--color-text-muted)}
.field__err{display:flex;gap:var(--s-8);align-items:flex-start;font-size:var(--fs-aux);color:var(--color-error)}
.field__err svg{width:var(--icon-sm);height:var(--icon-sm);flex:none;margin-top:2px}
.field--error .input{border-color:var(--color-error)}

/* Mensajes de estado (libro §8.5): siempre icono + texto */
.msg{display:flex;gap:var(--s-12);align-items:flex-start;padding:var(--s-12) var(--s-16);border-radius:var(--radius-sm);color:var(--color-ink);font-size:var(--fs-aux)}
.msg svg{width:var(--icon-sm);height:var(--icon-sm);flex:none;margin-top:2px}
.msg b{display:block;font-weight:var(--fw-semibold)}
.msg--ok{background:var(--color-action-soft)}.msg--ok svg,.msg--ok b{color:var(--color-action)}
.msg--warn{background:var(--color-warning-soft)}.msg--warn svg,.msg--warn b{color:var(--color-warning)}
.msg--error{background:var(--color-error-soft)}.msg--error svg,.msg--error b{color:var(--color-error)}
.msg--info{background:var(--color-surface-soft)}
/* ===== biblioteca: header (sin cambios) ===== */
/* RSJ · header · v1.2 (validado por Miguel el 19/10/2026). 1.2: sin data-cart-count en el carrito del header (petición 20). 1.1: buscador, variante «Checkout reducido» (prototipo v4, definición v0.19) y botón «Editar header» con data-editar. Biblioteca de módulos. Programado a partir del prototipo funcional v3 aprobado por Miguel
   (https://claude.ai/artifact/JRAbF9Q1R3qgS9JcTkNCyy) y de «RSJ - header y cambio de campaña» v0.17; aspecto del libro de estilo v0.15
   (§4.5, §8.9 a §8.13) con los cambios de su §13. Todo va dentro de .m-header (display:contents, para que el header principal sea
   sticky respecto a la página). Solo el header principal es fijo; la barra superior (escritorio) y la segunda franja (móvil) se van con
   la página. La franja de campaña NO es parte del header (banner-urgencia, solo en la home de Sant Jordi).
   Valores fuera de la escala que vienen del prototipo aprobado (se piden al libro, C44): 15 px del enlace de Ramos en la segunda franja,
   18/700 del nombre en la tarjeta del menú, 40 px de alto visible de la píldora con 14 px de relleno (libro §13.3), 6 y 2 px internos. */
.m-header{display:contents}
.m-header .skip{ position:absolute; left:8px; top:-60px; z-index:var(--z-skip); background:var(--color-ink); color:var(--color-surface); padding:10px 16px; border-radius:var(--radius-sm); font-weight:var(--fw-semibold); }
.m-header .skip:focus{ top:8px; }
.m-header .topbar{ display:none; }
@media (min-width:1024px){.m-header .topbar{ display:block; background:var(--color-surface-soft); border-bottom:1px solid var(--color-border); }
.m-header .topbar__in{ max-width:var(--container-max); margin:0 auto; padding:0 var(--gutter); height:44px; display:flex; align-items:center; justify-content:flex-end; gap:8px; }
}
.m-header .util{ display:inline-flex; align-items:center; gap:8px; min-height:var(--h-touch-min); padding:0 8px; font-size:var(--fs-aux); font-weight:var(--fw-medium); }
.m-header .util[hidden]{ display:none; }
.m-header .util[aria-current="page"]{ text-decoration:underline; text-underline-offset:3px; }
.m-header .util:hover{ text-decoration:underline; text-underline-offset:3px; }
.m-header .util svg{ width:var(--icon-sm); height:var(--icon-sm); flex:none; }
.m-header .lang{ display:inline-flex; align-items:center; font-size:var(--fs-aux); font-weight:var(--fw-semibold); color:var(--color-text-muted); }
.m-header .lang button{ min-width:var(--h-touch-min); min-height:var(--h-touch-min); border:0; background:none; cursor:pointer; color:var(--color-text-muted); font-weight:var(--fw-semibold); }
.m-header .lang button[aria-pressed="true"]{ color:var(--color-ink); text-decoration:underline; text-underline-offset:4px; }
.m-header .hdr{ position:sticky; top:0; z-index:var(--z-sticky); background:var(--color-surface); border-bottom:1px solid var(--color-border); }
.m-header .hdr__in{ position:relative; max-width:var(--container-max); margin:0 auto; height:var(--header-h); padding:0 4px 0 var(--gutter); display:flex; align-items:center; justify-content:space-between; gap:var(--s-16); }
@media (min-width:1024px){.m-header .hdr__in{ padding:0 var(--gutter); }
}
.m-header .logo{ display:flex; align-items:center; flex:none; height:var(--h-touch-min); }
.m-header .logo img{ height:var(--logo-h); width:auto; display:block; }
.m-header .camp{ display:none; align-items:center; gap:var(--s-8); margin-right:auto; }
@media (min-width:768px){.m-header .camp{ display:flex; }
}
.m-header .right{ display:flex; align-items:center; gap:0; }
@media (min-width:1024px){.m-header .right{ gap:var(--s-16); }
}
.m-header .pill{ display:inline-flex; align-items:center; min-height:var(--h-touch-min); flex:none; }
.m-header .pill__body{ display:inline-flex; align-items:center; gap:8px; height:40px; padding:0 14px; border:1px solid var(--color-border-strong); border-radius:var(--radius-pill); background:var(--color-surface); white-space:nowrap; transition:background-color var(--dur-fast) var(--ease); }
.m-header .pill:hover .pill__body{ background:var(--color-surface-soft); }
.m-header .pill:focus-visible{ outline:none; }
.m-header .pill:focus-visible .pill__body{ outline:2px solid var(--color-action); outline-offset:2px; }
.m-header .pill__name{ font-size:var(--fs-body); font-weight:var(--fw-semibold); }
.m-header .pill__state{ font-size:var(--fs-aux); font-weight:var(--fw-medium); color:var(--color-text-muted); }
.m-header .dot{ width:8px; height:8px; border-radius:50%; flex:none; margin:0 4px; }
.m-header .dot--on{ background:var(--color-status-on); box-shadow:0 0 0 4px var(--color-status-on-halo); }
.m-header .dot--prox{ border:2px solid var(--color-border-strong); }
.m-header .navlink{ display:inline-flex; align-items:center; min-height:var(--h-touch-min); padding:0 12px; font-size:var(--fs-body); font-weight:var(--fw-medium); white-space:nowrap; }
.m-header .navlink:hover{ text-decoration:underline; text-underline-offset:4px; }
.m-header .navlink[aria-current="page"]{ color:var(--color-action); }
.m-header .otras{ display:none; }
@media (min-width:1024px){.m-header .otras{ display:inline-flex; }
}
.m-header .otras{ align-items:center; gap:6px; min-height:var(--h-touch-min); padding:0 12px 0 16px; border:0; border-radius:var(--radius-sm); background:var(--color-surface-soft); font-size:var(--fs-body); font-weight:var(--fw-medium); cursor:pointer; white-space:nowrap; }
.m-header .otras svg{ width:var(--icon-sm); height:var(--icon-sm); transition:transform var(--dur-fast) var(--ease); }
.m-header .otras[aria-expanded="true"] svg{ transform:rotate(180deg); }
.m-header .panel{ position:absolute; top:calc(100% + 8px); z-index:var(--z-dropdown); width:min(560px, calc(100vw - 32px)); padding:var(--s-8); background:var(--color-surface); border:1px solid var(--color-border); border-radius:var(--radius-md); box-shadow:var(--shadow-sm); }
.m-header .panel[hidden]{ display:none; }
.m-header .grp{ margin:0; padding:12px 16px 4px; font-size:var(--fs-badge); font-weight:var(--fw-semibold); letter-spacing:.04em; text-transform:uppercase; color:var(--color-text-muted); line-height:1.3; }
.m-header .sep{ height:1px; background:var(--color-border); margin:8px 16px; }
.m-header .rows{ list-style:none; margin:0; padding:0; }
.m-header .row{ display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:56px; padding:12px 16px; border-radius:var(--radius-sm); transition:background-color var(--dur-fast) var(--ease); }
.m-header .row:hover{ background:var(--color-surface-soft); }
.m-header .row__txt{ display:flex; flex-direction:column; gap:2px; }
.m-header .row__name{ font-size:var(--fs-body); font-weight:var(--fw-semibold); line-height:1.3; }
.m-header .row__who{ font-size:var(--fs-aux); color:var(--color-text-muted); line-height:1.4; }
.m-header .row__end{ display:flex; align-items:center; gap:12px; color:var(--color-text-muted); }
.m-header .state{ display:inline-flex; align-items:center; gap:8px; font-size:var(--fs-aux); font-weight:var(--fw-medium); color:var(--color-text-muted); white-space:nowrap; }
.m-header .row__end svg{ width:var(--icon-sm); height:var(--icon-sm); flex:none; }
.m-header .wa{ display:inline-flex; align-items:center; gap:8px; min-height:var(--h-touch-min); padding:0 8px; font-size:var(--fs-aux); font-weight:var(--fw-semibold); color:var(--color-ink); white-space:nowrap; }
.m-header .wa:hover{ text-decoration:underline; text-underline-offset:3px; }
.m-header .wa svg{ width:var(--icon-sm); height:var(--icon-sm); flex:none; }
.m-header .cart{ position:relative; display:inline-flex; align-items:center; justify-content:center; gap:8px; min-width:var(--h-touch-min); min-height:var(--h-touch-min); font-size:var(--fs-aux); font-weight:var(--fw-semibold); }
.m-header .cart svg{ width:var(--icon-md); height:var(--icon-md); flex:none; }
.m-header .cart__txt{ display:none; }
.m-header .cart__badge{ position:absolute; top:2px; right:0; min-width:var(--icon-sm); height:var(--icon-sm); padding:0 5px; border-radius:var(--radius-pill); background:var(--color-ink); color:var(--color-surface); font-size:var(--fs-badge); font-weight:var(--fw-bold); line-height:20px; text-align:center; font-variant-numeric:tabular-nums; }
@media (min-width:1024px){.m-header .cart{ padding:0 12px; border:1px solid var(--color-border-strong); border-radius:var(--radius-sm); }
.m-header .cart__txt{ display:inline; font-variant-numeric:tabular-nums; }
.m-header .cart__badge{ display:none; }
}
.m-header .burger{ display:inline-flex; align-items:center; justify-content:center; width:var(--h-touch-min); height:var(--h-touch-min); border:0; background:none; cursor:pointer; }
.m-header .burger svg{ width:var(--icon-md); height:var(--icon-md); }
@media (min-width:1024px){.m-header .burger{ display:none; }
}
.m-header .strip2{ display:flex; align-items:center; justify-content:space-between; gap:8px; height:var(--strip2-h); padding:0 var(--gutter); background:var(--color-surface); border-bottom:1px solid var(--color-border); overflow:hidden; }
.m-header .strip2.is-tight .navlink{ display:none; }
.m-header .strip2 .navlink{ padding:0; font-size:15px; }
@media (min-width:768px){.m-header .strip2{ display:none; }
}
.m-header .mmenu{ position:fixed; inset:0; z-index:var(--z-drawer); background:var(--color-surface); overflow-y:auto; overscroll-behavior:contain; padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px); }
.m-header .mmenu[hidden]{ display:none; }
.m-header .mmenu__top{ display:flex; align-items:center; justify-content:space-between; height:var(--header-h); padding:0 4px 0 var(--gutter); border-bottom:1px solid var(--color-border); position:sticky; top:0; background:var(--color-surface); }
.m-header .mmenu__body{ padding:0 var(--gutter) var(--s-32); max-width:640px; }
.m-header .mmenu .grp{ padding:20px 0 4px; }
.m-header .mrow{ display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:56px; padding:12px 0; border-bottom:1px solid var(--color-border); }
.m-header .mrow .row__txt{ gap:4px; }
.m-header .mcard > svg,.m-header .mrow > svg{ width:var(--icon-sm); height:var(--icon-sm); color:var(--color-text-muted); flex:none; }
.m-header .mcard{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:6px; padding:14px 16px; border:1px solid var(--color-border-strong); border-radius:var(--radius-md); }
.m-header .mcard .row__name{ font-size:18px; font-weight:var(--fw-bold); }
.m-header .mlang{ display:flex; gap:8px; padding-top:8px; }
.m-header .mlang button{ min-height:var(--h-touch-min); padding:0 20px; border:1px solid var(--color-border-strong); border-radius:var(--radius-sm); background:var(--color-surface); font-size:var(--fs-body); font-weight:var(--fw-medium); cursor:pointer; }
.m-header .mlang button[aria-pressed="true"]{ font-weight:var(--fw-bold); border-width:2px; }
@media (min-width:1024px){.m-header .mmenu{ display:none!important; }
}
.m-header a{color:inherit;text-decoration:none}
.m-header .lang a{display:inline-flex;align-items:center;justify-content:center;min-width:var(--h-touch-min);min-height:var(--h-touch-min);color:var(--color-text-muted);font-weight:var(--fw-semibold)}
.m-header .lang a[aria-current="true"]{color:var(--color-ink);text-decoration:underline;text-underline-offset:4px}
.m-header .mlang a{display:inline-flex;align-items:center;min-height:var(--h-touch-min);padding:0 20px;border:1px solid var(--color-border-strong);border-radius:var(--radius-sm);font-weight:var(--fw-medium)}
.m-header .mlang a[aria-current="true"]{font-weight:var(--fw-bold);border-width:2px}
.m-header .cart{cursor:pointer;background:none;font:inherit;color:inherit}
.m-header .vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* 1.1 · Buscador (escritorio: lupa que abre una barra bajo el header; < 1024: campo arriba del menú) */
.m-header .sbtn{display:none;align-items:center;justify-content:center;width:var(--h-touch-min);height:var(--h-touch-min);border:0;border-radius:var(--radius-sm);background:none;cursor:pointer;color:inherit}
.m-header .sbtn svg{width:var(--icon-md);height:var(--icon-md)}
.m-header .sbtn[aria-expanded="true"]{background:var(--color-surface-soft)}
@media (min-width:1024px){.m-header .sbtn{display:inline-flex}}
.m-header .hdr{position:sticky}
.m-header .sbar{position:absolute;left:0;right:0;top:100%;z-index:var(--z-dropdown);background:var(--color-surface);border-bottom:1px solid var(--color-border);box-shadow:var(--shadow-sm)}
.m-header .sbar[hidden]{display:none}
.m-header .sbar__in{max-width:var(--container-max);margin:0 auto;padding:var(--s-16) var(--gutter) var(--s-24)}
.m-header .sform{display:flex;align-items:center;gap:var(--s-8)}
.m-header .sform label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.m-header .sinput{flex:1;min-width:0;height:var(--h-btn);padding:0 var(--s-16);border:1px solid var(--color-border-strong);border-radius:var(--radius-sm);font:inherit;font-size:var(--fs-body);color:var(--color-ink);background:var(--color-surface)}
.m-header .sinput::placeholder{color:var(--color-text-muted)}
.m-header .sclose{display:inline-flex;align-items:center;justify-content:center;width:var(--h-touch-min);height:var(--h-touch-min);border:0;background:none;cursor:pointer;color:inherit}
.m-header .sclose svg{width:var(--icon-md);height:var(--icon-md)}
.m-header .sres{list-style:none;margin:var(--s-8) 0 0;padding:0;max-width:720px}
.m-header .sres a{display:flex;align-items:center;justify-content:space-between;gap:var(--s-12);min-height:var(--h-btn);padding:var(--s-8) var(--s-12);border-radius:var(--radius-sm)}
.m-header .sres a:hover{background:var(--color-surface-soft)}
.m-header .sres a>svg{width:var(--icon-sm);height:var(--icon-sm);flex:none;color:var(--color-text-muted)}
.m-header .sres .row__who{font-size:13px}
.m-header .shint{margin:var(--s-8) 0 0;font-size:var(--fs-aux);color:var(--color-text-muted)}
.m-header .shint:empty{display:none}
.m-header .msearch{padding-top:var(--s-16)}
/* 1.1 · Variante «Checkout reducido»: logo, volver al carrito, pago seguro y WhatsApp; sin barra superior, franjas, campañas, buscador, carrito ni menú */
.m-header .back,.m-header .secure{display:none}
.m-header[data-variante="checkout"] .topbar,.m-header[data-variante="checkout"] .strip2,.m-header[data-variante="checkout"] .camp,.m-header[data-variante="checkout"] .sbtn,.m-header[data-variante="checkout"] .cart,.m-header[data-variante="checkout"] .burger,.m-header[data-variante="checkout"] .sbar,.m-header[data-variante="checkout"] .mmenu{display:none!important}
.m-header[data-variante="checkout"] .back{display:inline-flex;align-items:center;gap:4px;min-height:var(--h-touch-min);padding:0 var(--s-8) 0 0;font-size:var(--fs-aux);font-weight:var(--fw-semibold);color:var(--color-ink);white-space:nowrap;margin-right:auto}
.m-header[data-variante="checkout"] .back:hover{text-decoration:underline;text-underline-offset:3px}
.m-header[data-variante="checkout"] .back svg{width:var(--icon-sm);height:var(--icon-sm);flex:none}
.m-header[data-variante="checkout"] .secure{display:inline-flex;align-items:center;gap:6px;font-size:var(--fs-aux);font-weight:var(--fw-semibold);color:var(--color-text-muted);white-space:nowrap}
.m-header[data-variante="checkout"] .secure svg{width:18px;height:18px;flex:none}
@media (max-width:767.98px){
.m-header[data-variante="checkout"] .back{order:-1;padding:0;width:var(--h-touch-min);justify-content:center;margin-right:0}
.m-header[data-variante="checkout"] .back .back__txt{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.m-header[data-variante="checkout"] .hdr__in{padding-left:4px}
.m-header[data-variante="checkout"] .logo{margin-right:auto}
.m-header[data-variante="checkout"] .secure{display:none}
}
/* 1.1 · Botón «Editar header»: solo si el contenedor trae data-editar (el servidor lo pone únicamente con sesión de administración y perfil
   que puede editar la pieza; contrato data-editar, «RSJ - backend, módulo de contenidos» §22). Pestaña colgada bajo el header: no mueve el diseño. */
/* 1.3-rc (encargo 26, C7): las pestañas de edición van juntas (en la ficha, también «Editar artículo» y «Editar variante»), colgadas bajo el header a la derecha */
.m-header .hdr-editas{position:absolute;right:var(--gutter);top:100%;z-index:var(--z-dropdown);display:flex;gap:var(--s-4,4px)}
.m-header .hdr-editar{display:inline-flex;align-items:center;gap:var(--s-8);min-height:var(--h-touch-min);padding:0 var(--s-12);background:var(--color-ink);color:var(--color-surface);border-radius:0 0 var(--radius-sm) var(--radius-sm);font-size:var(--fs-aux);font-weight:var(--fw-semibold)}
.m-header .hdr-editar svg{width:var(--icon-sm);height:var(--icon-sm)}
.m-header .hdr-editar:hover{text-decoration:underline}
.m-header .hdr-editar:focus-visible{outline:2px solid var(--color-action);outline-offset:2px}
/* ===== biblioteca: footer (sin cambios) ===== */
/* RSJ · footer · v1.1 (validado por Miguel el 15/10/2026). Biblioteca de módulos. Programado a partir del diseño aprobado por Miguel el 15/10/2026
   (prototipo v0.5, https://claude.ai/artifact/7GGykzNiRHZTAT8dzLT7EE, y «RSJ - footer» v0.6). Sustituye a la 0.9 provisional.
   Pieza compartida: un solo footer para toda la web; cada plantilla solo dice la variante (global o checkout). Todo lo visible sale de la
   configuración «footer» (footer.config.json; backend de Vinx). Solo tokens del libro; fondo de una lista de tokens (hoy, ink) y todo
   el texto en blanco; no cambia con el tema de campaña. Foco: contorno blanco 2 px (también en el WhatsApp de pie). */
.m-footer{background:var(--color-ink);color:var(--color-surface);padding-block:var(--section-gap) calc(var(--s-32) + env(safe-area-inset-bottom,0px))}
.m-footer__in{max-width:var(--container-max);margin:0 auto;padding-inline:var(--gutter);display:grid;gap:var(--s-48)}
.m-footer a{color:var(--color-surface);text-decoration:none;text-underline-offset:3px}
.m-footer a:hover{color:var(--color-surface);text-decoration:underline}
.m-footer a:focus-visible,.m-footer button:focus-visible{outline:2px solid var(--color-surface);outline-offset:2px}
.m-footer ul{margin:0;padding:0;list-style:none}
.m-footer svg{flex:none;width:var(--icon-sm);height:var(--icon-sm)}

/* Arriba: marca y ayuda | navegación */
.m-footer__top{display:grid;gap:var(--s-48)}
.m-footer__marca{display:grid;gap:var(--s-16);align-content:start}
.m-footer__logo{display:inline-flex;width:max-content;padding-block:var(--s-12)}  /* zona de respeto: 1/4 del alto (libro §7.1) */
.m-footer__logo img{height:var(--logo-h);width:auto}
.m-footer__ayuda h2{font-size:var(--fs-h3);line-height:var(--lh-h3);font-weight:var(--fw-semibold)}
.m-footer__ayuda p{margin-top:var(--s-4);font-size:var(--fs-aux);font-weight:var(--fw-medium)}
.m-footer__contacto{display:flex;flex-wrap:wrap;gap:0 var(--s-24);margin-top:var(--s-8)!important}
.m-footer__contacto a{display:inline-flex;align-items:center;gap:var(--s-8);min-height:var(--h-touch-min);font-size:var(--fs-aux);font-weight:var(--fw-semibold)}

/* Columnas de enlaces */
.m-footer__cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-32) var(--s-24)}
.m-footer__h{margin:0 0 var(--s-4);font-size:var(--fs-body);line-height:var(--lh-h3);font-weight:var(--fw-semibold)}
.m-footer__cols a,.m-footer__cookies{display:inline-flex;align-items:center;min-height:var(--h-touch-min);font-size:var(--fs-aux);font-weight:var(--fw-medium);line-height:1.3}
.m-footer__cookies{padding:0;border:0;background:none;color:var(--color-surface);font-family:inherit;text-align:left;cursor:pointer}
.m-footer__cookies:hover{text-decoration:underline;text-underline-offset:3px}

/* Abajo: titular, redes e idioma */
.m-footer__legal{margin:0;font-size:var(--fs-badge);line-height:1.6}
.m-footer__fila{display:flex;flex-wrap:wrap;gap:0 var(--s-24)}
.m-footer__fila a{display:inline-flex;align-items:center;min-height:var(--h-touch-min);font-size:var(--fs-aux);font-weight:var(--fw-medium)}

/* Variante «checkout reducido»: sin navegación; ayuda y legales en una fila */
.m-footer[data-variante=checkout]{padding-block:var(--s-32) calc(var(--s-24) + env(safe-area-inset-bottom,0px))}
.m-footer[data-variante=checkout] .m-footer__in{gap:var(--s-24)}
.m-footer[data-variante=checkout] .m-footer__ayuda h2{font-size:var(--fs-body)}
.m-footer[data-variante=checkout] .m-footer__ayuda{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 var(--s-12)}
.m-footer[data-variante=checkout] .m-footer__contacto{flex-basis:100%}

@media (min-width:768px){
 .m-footer__cols{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (min-width:1024px){
 .m-footer__top{grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:var(--s-64)}
}

/* ===== v0.3 · Capa de arriba: ayuda + redes (Miguel, 14/10/2026: sin registro, más amena) ===== */
.m-footer__capa{display:grid;gap:var(--s-48)}
.m-footer__capa .m-footer__ayuda h2,.m-footer__redes h2{font-size:var(--fs-h2);line-height:var(--lh-h2);font-weight:var(--fw-bold)}
.m-footer__capa .m-footer__ayuda p,.m-footer__redes p{margin-top:var(--s-8);font-size:var(--fs-body);font-weight:var(--fw-regular)}
.m-footer__redes{display:grid;align-content:start}
.m-footer__redes p{margin:var(--s-8) 0 0}
.m-footer__redes ul{display:flex;flex-wrap:wrap;gap:var(--s-8) var(--s-24);margin-top:var(--s-8)}
.m-footer__redes a{display:inline-flex;align-items:center;gap:var(--s-8);min-height:var(--h-touch-min);font-size:var(--fs-aux);font-weight:var(--fw-semibold)}
.m-footer__redes img{width:var(--icon-sm);height:var(--icon-sm);flex:none}
@media (min-width:768px){.m-footer__capa{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-48)}}
@media (min-width:1024px){.m-footer__capa{grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:var(--s-64)}}
.m-footer__lema{margin:0;max-width:36ch;font-size:var(--fs-aux);font-weight:var(--fw-medium);line-height:var(--lh-body)}
/* v0.5 · Formas de pago (para verlo; PDC-F2 abierto): marcadores, no logos */
.m-footer__base{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--s-16) var(--s-32)}
.m-footer__pago{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-8)}
.m-footer__pago-t{margin:0;font-size:var(--fs-badge);font-weight:var(--fw-semibold)}
.m-footer__pago ul{display:flex;flex-wrap:wrap;gap:var(--s-8)}
.m-footer__marca-pago{display:inline-flex;align-items:center;min-height:var(--s-32);padding:0 var(--s-8);border:1px dashed var(--color-surface);border-radius:var(--radius-sm);font-size:var(--fs-badge);font-weight:var(--fw-semibold)}

/* Fondo: solo de la lista de tokens permitidos (F14). Hoy, ink. */
.m-footer[data-fondo=ink]{background:var(--color-ink)}
/* El tema de campaña no cambia el pie (libro §2.7.2): el pie lee solo tokens que ningún tema redefine (ink, surface) */
.m-footer .tbd-tag{margin-left:var(--s-8)}
.m-footer .m-wa--pie:focus-visible{outline:2px solid var(--color-surface);outline-offset:2px}
/* 1.1 · Botón «Editar pie» (solo con sesión de administración: lo decide el servidor con data-editar) */
.m-footer__in{position:relative}
.m-footer__editar{position:absolute;top:calc(-1 * var(--s-32));right:var(--gutter);display:inline-flex;align-items:center;gap:var(--s-8);min-height:var(--h-touch-min);padding:0 var(--s-12);border:1px solid var(--color-surface);border-radius:var(--radius-sm);font-size:var(--fs-aux);font-weight:var(--fw-semibold)}
.m-footer__editar:hover{background:rgba(255,255,255,.08);text-decoration:none!important}
/* ===== biblioteca: contacto-whatsapp (sin cambios) ===== */
/* RSJ · contacto-whatsapp · v1.0-rc4 (19/10/2026; rc4: forma «destacado» para la cabecera de contacto, excepción de Miguel al botón neutro; rc3: foco blanco en la forma «pie», CF4 del chat «Footer»). Libro de estilo v0.12 §7.5 y §8.13. Biblioteca de módulos.
   Tres formas: botón neutro (bloque de ayuda de la ficha, presupuesto, vacíos y errores sin solución), enlace compacto (header y pie del
   carrito lateral) y versión de pie (glifo blanco sobre ink). Glifo oficial de Meta en línea, sin recolorear (su verde va dentro del
   SVG; no es token). Siempre con texto al lado; glifo aria-hidden; «(se abre WhatsApp)» para lectores de pantalla. Sin botón flotante.
   Número y texto predefinido: dato de configuración (Vinx/Paco), nunca escrito en la plantilla. Sin JS (es un enlace normal). */
.m-wa{display:inline-flex;align-items:center;gap:var(--s-8);text-decoration:none;font-weight:var(--fw-semibold);color:var(--color-ink);transition:background-color var(--dur-fast) var(--ease)}
.m-wa svg{flex:none;width:var(--icon-sm);height:var(--icon-sm)}
.m-wa:focus-visible{outline:2px solid var(--color-action);outline-offset:2px}
.m-wa--boton{min-height:var(--h-btn);padding:0 20px;border:1px solid var(--color-border-strong);border-radius:var(--radius-sm);background:var(--color-surface);font-size:var(--fs-body)}
.m-wa--boton svg{width:var(--brand3-glyph);height:var(--brand3-glyph)}
.m-wa--boton:hover{background:var(--color-surface-soft)}
.m-wa--compacto,.m-wa--pie{min-height:var(--h-touch-min);font-size:var(--fs-aux)}
.m-wa--compacto:hover,.m-wa--pie:hover{text-decoration:underline}
.m-wa--pie{color:var(--color-surface)}
.m-wa-ayuda{display:grid;gap:var(--s-8);justify-items:start;padding:var(--s-16);border-radius:var(--radius-md);background:var(--color-surface-soft)}
.m-wa-ayuda h2{font-size:var(--fs-body);font-weight:var(--fw-semibold);line-height:var(--lh-h3)}
.m-wa-ayuda p{margin:0;font-size:var(--fs-aux);color:var(--color-text-muted)}
.m-wa-ayuda .m-wa--boton{margin-top:var(--s-4)}
.m-wa--pie:focus-visible{outline-color:var(--color-surface)} /* rc3 (CF4): el verde de acción no llega a 3:1 sobre ink; blanco 15,84:1 */
/* rc4 · Forma «destacado» (solo la cabecera de la página de contacto; excepción pedida por Miguel el 19/10/2026 a «botón neutro», libro §7.5 y §8.13).
   Fondo verde oficial de WhatsApp #25D366 (color de marca de terceros, no token), glifo oficial BLANCO, texto ink (7,99:1; blanco daría 1,98:1),
   hover #1FBF5B (ink 6,53:1). El glifo blanco sobre ese verde no llega a 3:1: es decorativo (aria-hidden) y el texto dice la acción. */
.m-wa--destacado{min-height:var(--h-btn);padding:0 20px;border:0;border-radius:var(--radius-sm);background:#25D366;color:var(--color-ink);font-size:var(--fs-body)}
.m-wa--destacado svg{width:var(--brand3-glyph);height:var(--brand3-glyph)}
.m-wa--destacado:hover{background:#1FBF5B}
.m-wa--destacado:focus-visible{outline:2px solid var(--color-action);outline-offset:2px}
/* ===== Ajuste de Miguel (25/10/2026), no viene de la biblioteca: pasar al «Gestor de módulos» (header) =====
   Más aire entre el logo y la pastilla de la campaña: el doble del hueco (16 + 16 = 32 px) donde se ve la pastilla (desde 768 px) */
@media (min-width:768px){.m-header .camp{ margin-left:var(--s-16); }}
/* Buscador oculto mientras no haya motor (V3_BUSCADOR_ACTIVO, Vinx 02/11/2026): la lupa y su barra (escritorio) y el campo de arriba del menú
   del móvil (js/header.js, sform) */
.m-header[data-buscador="no"] .sbtn,.m-header[data-buscador="no"] .sbar,.m-header[data-buscador="no"] .msearch,.m-header[data-buscador="no"] .mmenu .shint,.m-header[data-buscador="no"] .mmenu .sres{display:none!important}
/* Población por código postal (encargo 26, C15; v3/js/poblacion-cp.js): con varias poblaciones en el código postal, la lista para elegir */
.cp-pobs{display:flex;flex-wrap:wrap;gap:var(--s-8);margin-top:var(--s-8)}
.cp-pobs[hidden]{display:none}
.cp-pobs__t{flex-basis:100%;margin:0;font-size:var(--fs-aux);color:var(--color-text-muted)}
.cp-pobs__b{min-height:var(--h-touch-min);padding:0 var(--s-12);border:1px solid var(--color-border-strong);border-radius:var(--radius-pill);background:var(--color-surface);color:var(--color-ink);font:inherit;cursor:pointer}
.cp-pobs__b:hover{border-color:var(--color-action)}
.cp-pobs__b:focus-visible{outline:2px solid var(--color-action);outline-offset:2px}
/* Dirección con otro código postal dentro (encargo 27, punto 19 quater; v3/js/poblacion-cp.js, data-cp-dir): el aviso bajo el campo */
.cp-dir-aviso{margin:var(--s-8) 0 0;font-size:var(--fs-aux);font-weight:var(--fw-medium);color:var(--color-error)}
.cp-dir-aviso[hidden]{display:none}
.input[aria-invalid="true"]{border-color:var(--color-error)}
/* Lo que no se ha podido añadir al carrito, junto al botón (js/plantilla.js; encargo 27, puntos 1 y 19 sexies) */
.v3-anyadir-aviso{margin:var(--s-8) 0 0;padding:var(--s-12) var(--s-16);border-radius:var(--radius-sm);background:var(--color-error-soft);color:var(--color-error);font-size:var(--fs-aux);line-height:1.4}