/* ==========================================================================
   JENN Empaques y Equipos — base compartida de las páginas de producto
   Lo usan:  /bolsas-pouch-alto-vacio   /bolsas-termoencogibles
             /maquinaria                /tripas-para-embutidos
   Cada página carga además su propia hoja (pouch.css, termo.css,
   maquinaria.css, tripas.css) con su dirección de arte.

   Tokens idénticos a index.html (si cambian allá, cambiarlos aquí).
   CACHÉ: firebase.json sirve los .css/.js de /assets como "immutable" un año.
   Si editas este archivo, sube el número de ?v= en las cuatro páginas
   (busca "productos.css?v=") o los visitantes recurrentes no verán el cambio.
   ========================================================================== */

:root{
  --jenn-negro-onix: #0A0A0A;
  --jenn-blanco-marfil: #F8F6F1;
  --jenn-gris-grafito: #4A4A48;
  --jenn-gris-perla: #C9C7C0;
  --jenn-dorado: #B8944D;
  --jenn-plata: #9CA3AA;
  /* El dorado de marca da 2.6:1 sobre marfil: sirve para fondos de botón, líneas y
     texto sobre negro, pero NO para texto chico sobre fondo claro. Para eso va esta
     variante más honda del mismo tono (5.3:1 sobre marfil, pasa AA). */
  --jenn-dorado-tinta: #7E6230;
  /* Fondo de los "plates" de foto. Las fotos de producto vienen sobre blanco
     (#FEFEFE); con mix-blend-mode:multiply ese blanco toma este tono y la foto
     queda integrada al plate, sin caja visible. */
  --jenn-plate: #FCFBF8;
  /* Derivados: mezclas de los colores de marca, no colores nuevos. */
  --jenn-acero: color-mix(in srgb, var(--jenn-gris-perla) 36%, var(--jenn-blanco-marfil)); /* bahía clara (maquinaria) */
  --jenn-onix-2: #141413;  /* superficie elevada sobre negro */
  --jenn-onix-3: #1D1D1B;

  --jenn-font-heading: 'Playfair Display', Georgia, serif;
  --jenn-font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* Lenguaje de movimiento: mismos valores que index.html */
  --ease-out: cubic-bezier(.23,1,.32,1);
  --ease-in-out: cubic-bezier(.77,0,.175,1);
  --ease-drawer: cubic-bezier(.32,.72,0,1);
  --dur-press: 140ms;
  --dur-hover: 200ms;
  --dur-lift: 260ms;
  --dur-panel: 320ms;
  --dur-reveal: 640ms;
  --dur-stagger: 80ms;

  /* Escala tipográfica (fluida). El display no pasa de 5.25rem. */
  --t-display: clamp(2.5rem, 1.45rem + 4.1vw, 5.25rem);
  --t-statement: clamp(2rem, 1.25rem + 3vw, 3.875rem);
  --t-h2: clamp(2rem, 1.35rem + 2.3vw, 3.25rem);
  --t-lede: clamp(1.0625rem, 1rem + .3vw, 1.25rem);

  /* Espaciado (base 4) */
  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 24px;
  --s6: 32px; --s7: 48px; --s8: 64px; --s9: 96px; --s10: 128px;
  --sec: clamp(4.5rem, 2.6rem + 6vw, 8.5rem);
  --sec-tight: clamp(3rem, 2rem + 3vw, 5rem);
  --gutter: clamp(1.25rem, .4rem + 3.4vw, 3rem);
  --maxw: 75rem;
  --maxw-wide: 90rem;
  --subnav-h: 60px;

  /* Esquinas: industriales, casi rectas. Los botones van rectos como en el home. */
  --r-sm: 3px; --r-md: 6px; --r-lg: 10px;
  --linea: color-mix(in srgb, var(--jenn-gris-perla) 85%, transparent);
  --linea-fuerte: color-mix(in srgb, var(--jenn-gris-grafito) 55%, transparent);
  --linea-oscura: color-mix(in srgb, var(--jenn-blanco-marfil) 14%, transparent);
  --sombra-1: 0 1px 2px color-mix(in srgb, var(--jenn-negro-onix) 6%, transparent), 0 12px 28px -16px color-mix(in srgb, var(--jenn-negro-onix) 22%, transparent);
  --sombra-2: 0 28px 56px -28px color-mix(in srgb, var(--jenn-negro-onix) 34%, transparent);

  /* Escala de capas */
  --z-base: 1;
  --z-raised: 2;
  --z-sticky: 40;
  --z-header: 50;
  --z-float: 60;
}
@media (prefers-reduced-motion: reduce){
  :root{ --dur-press:1ms; --dur-hover:1ms; --dur-lift:1ms; --dur-panel:1ms; --dur-reveal:1ms; --dur-stagger:0ms; }
}
@media (max-width:860px){ :root{ --subnav-h: 56px; } }

/* ===== Base ===== */
*,*::before,*::after{box-sizing:border-box;}
html{background:var(--jenn-blanco-marfil);scroll-behavior:smooth;-webkit-text-size-adjust:100%;text-size-adjust:100%;}
@media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto;} }
body{margin:0;font-family:var(--jenn-font-body);font-size:1.0625rem;line-height:1.65;color:var(--jenn-negro-onix);background:var(--jenn-blanco-marfil);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;font-kerning:normal;overflow-x:clip;}
img,svg,video{display:block;max-width:100%;}
img{height:auto;}
a{color:inherit;text-decoration:none;}
button,input,select,textarea{font:inherit;color:inherit;}
h1,h2,h3,h4,p,ul,ol,dl,dd,figure,blockquote{margin:0;}
ul,ol{padding:0;list-style:none;}
:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{outline:2px solid var(--jenn-dorado);outline-offset:3px;border-radius:2px;}
[hidden]{display:none !important;}
.visually-hidden{position:absolute !important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
.skip{position:absolute;left:var(--s4);top:-100px;z-index:100;background:var(--jenn-dorado);color:var(--jenn-negro-onix);font-weight:600;padding:12px 18px;transition:top var(--dur-hover) var(--ease-out);}
.skip:focus{top:var(--s4);}

.wrap{width:100%;max-width:calc(var(--maxw) + var(--gutter) * 2);margin-inline:auto;padding-inline:var(--gutter);}
.wrap--wide{max-width:calc(var(--maxw-wide) + var(--gutter) * 2);}

/* ===== Tipografía ===== */
.display{font-family:var(--jenn-font-heading);font-weight:500;font-size:var(--t-display);line-height:1.02;letter-spacing:-.02em;text-wrap:balance;}
.statement{font-family:var(--jenn-font-heading);font-weight:500;font-size:var(--t-statement);line-height:1.08;letter-spacing:-.015em;text-wrap:balance;}
.h2{font-family:var(--jenn-font-heading);font-weight:500;font-size:var(--t-h2);line-height:1.08;letter-spacing:-.01em;text-wrap:balance;}
/* H2 utilitario (preguntas, relacionados): Inter, un escalón abajo del narrativo */
.h2--util{font-family:var(--jenn-font-body);font-weight:600;font-size:clamp(1.5rem,1.3rem + .7vw,1.875rem);line-height:1.25;letter-spacing:-.01em;}
.h3{font-weight:600;font-size:1.25rem;line-height:1.3;letter-spacing:-.005em;text-wrap:balance;}
.h3--serif{font-family:var(--jenn-font-heading);font-weight:500;font-size:clamp(1.5rem,1.2rem + 1vw,2rem);line-height:1.12;letter-spacing:-.005em;}
.lede{font-size:var(--t-lede);line-height:1.6;color:var(--jenn-gris-grafito);text-wrap:pretty;}
.prose p{color:var(--jenn-gris-grafito);text-wrap:pretty;max-width:38em;}
.prose p + p{margin-top:var(--s4);}
.prose a,.inline-link{color:var(--jenn-negro-onix);text-decoration:underline;text-decoration-color:var(--jenn-dorado);text-decoration-thickness:1.5px;text-underline-offset:3px;transition:text-decoration-color var(--dur-hover) ease;}
.on-dark .inline-link,.inline-link--claro{color:var(--jenn-blanco-marfil);}
/* Kicker: una sola etiqueta por página, en el hero. No se repite sobre cada sección. */
.kicker{display:flex;align-items:center;gap:var(--s3);font-size:.75rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--jenn-dorado-tinta);}
.kicker::before{content:"";width:28px;height:1px;background:currentColor;flex:none;}
/* Etiqueta de dato: tipo de oración, no mayúsculas con tracking */
.etq{display:block;font-size:.8125rem;font-weight:600;line-height:1.4;color:var(--jenn-dorado-tinta);}
.on-dark .etq{color:var(--jenn-dorado);}
/* Pie de figura estilo ficha técnica: "Fig. 2 — …" */
.figcap{display:flex;gap:var(--s3);align-items:baseline;font-size:.8125rem;line-height:1.5;color:var(--jenn-gris-grafito);margin-top:var(--s4);}
.figcap b{font-weight:600;font-size:.8125rem;color:var(--jenn-dorado-tinta);flex:none;}
.on-dark .figcap{color:var(--jenn-gris-perla);}
.on-dark .figcap b{color:var(--jenn-dorado);}
.num{font-variant-numeric:tabular-nums lining-nums;}
.oro{color:var(--jenn-dorado-tinta);}
.on-dark .oro{color:var(--jenn-dorado);}

/* Títulos con líneas enmascaradas (hero): cada .ln es una frase pensada como línea.
   La entrada es CSS puro: no depende de que cargue el JS y no retrasa el LCP. */
@keyframes ln-in{from{transform:translateY(104%);}to{transform:none;}}
@keyframes rise-in{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:none;}}
@keyframes fade-in{from{opacity:0;}to{opacity:1;}}
.ln{display:block;overflow:hidden;padding-bottom:.1em;margin-bottom:-.1em;}
.ln > span{display:block;animation:ln-in 900ms var(--ease-out) both;animation-delay:calc(120ms + var(--l, 0) * 90ms);}
.ln:nth-child(2) > span{--l:1;}
.ln:nth-child(3) > span{--l:2;}
.ln:nth-child(4) > span{--l:3;}
.intro-in{animation:rise-in 720ms var(--ease-out) both;animation-delay:calc(260ms + var(--d, 0) * 80ms);}

/* ===== Botones (mismo lenguaje que el sitio: esquina recta, mayúsculas) ===== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;font-weight:600;font-size:.9375rem;letter-spacing:.09em;text-transform:uppercase;line-height:1.2;padding:18px 30px;border:1px solid transparent;cursor:pointer;text-align:center;transition:background-color var(--dur-hover) ease, border-color var(--dur-hover) ease, color var(--dur-hover) ease, transform var(--dur-press) var(--ease-out);}
.btn:active{transform:scale(.97);}
.btn svg{flex:none;transition:transform var(--dur-lift) var(--ease-out);}
.btn--oro{background:var(--jenn-dorado);color:var(--jenn-negro-onix);}
.btn--negro{background:var(--jenn-negro-onix);color:var(--jenn-blanco-marfil);}
.btn--marfil{background:var(--jenn-blanco-marfil);color:var(--jenn-negro-onix);}
.btn--linea{border-color:var(--jenn-negro-onix);color:var(--jenn-negro-onix);background:transparent;}
.btn--linea-clara{border-color:color-mix(in srgb, var(--jenn-blanco-marfil) 45%, transparent);color:var(--jenn-blanco-marfil);background:transparent;}
.btn--sm{font-size:.8125rem;padding:11px 18px;letter-spacing:.1em;}
.btn--block{width:100%;}
.link-arrow{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:1rem;color:var(--jenn-negro-onix);transition:color var(--dur-hover) ease;}
.link-arrow svg{flex:none;transition:transform var(--dur-hover) var(--ease-out);}
.on-dark .link-arrow{color:var(--jenn-blanco-marfil);}
.chips{display:flex;flex-wrap:wrap;gap:var(--s2);}
.chip{display:inline-flex;align-items:center;gap:8px;font-size:.875rem;line-height:1.3;border:1px solid var(--linea);border-radius:999px;padding:8px 14px;color:var(--jenn-negro-onix);}
.on-dark .chip{border-color:var(--linea-oscura);color:var(--jenn-blanco-marfil);}

/* ===== HEADER (misma barra negra que el home) =====
   Sticky para que quede siempre visible al hacer scroll. --header-h la mide
   assets/js/nav.js (alto real del header) y la usa .subnav para apilarse justo
   debajo en vez de tapar/ser tapada por él. */
.site-header{position:sticky;top:0;z-index:var(--z-header);background:var(--jenn-negro-onix);color:var(--jenn-blanco-marfil);}
.site-header__bar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:var(--s5);padding:30px 48px;}
.site-nav{justify-self:start;}
.brand{justify-self:center;display:flex;}
.brand img{height:40px;width:auto;}
.site-header__cta{justify-self:end;}
.btn-header{display:inline-block;font-weight:600;font-size:.9375rem;letter-spacing:1.5px;color:var(--jenn-negro-onix);text-transform:uppercase;background:var(--jenn-dorado);padding:16px 26px;transition:background-color var(--dur-hover) ease, transform var(--dur-press) var(--ease-out);}
.btn-header:active{transform:scale(.97);}
.nav-link{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:.9375rem;letter-spacing:2px;text-transform:uppercase;color:var(--jenn-blanco-marfil);background:none;border:0;padding:0;cursor:pointer;transition:color var(--dur-hover) ease;}
.nav-link[aria-current="page"]{color:var(--jenn-dorado);}
.nav-link__chev{flex:none;transition:transform var(--dur-hover) var(--ease-out);}
.site-nav__list{display:flex;align-items:center;gap:44px;}
.burger{display:none;}
.site-nav__item{position:relative;}
.site-nav__item.is-open .nav-link__chev{transform:rotate(180deg);}
/* Panel de Productos (escritorio): sale desde su disparador, no desde el centro */
.mega{position:absolute;top:calc(100% + 22px);left:-28px;width:min(640px, calc(100vw - 48px));background:var(--jenn-blanco-marfil);color:var(--jenn-negro-onix);border:1px solid var(--linea);border-radius:14px;padding:var(--s3);box-shadow:var(--sombra-2);opacity:0;visibility:hidden;transform:translateY(-6px) scale(.985);transform-origin:28px 0;transition:opacity 140ms ease, transform 180ms var(--ease-out), visibility 0s linear 180ms;}
/* Puente invisible: cubre el hueco entre el enlace y el panel para que el hover no se corte */
.mega::before{content:"";position:absolute;left:0;right:0;top:-24px;height:24px;}
.site-nav__item.is-open .mega{opacity:1;visibility:visible;transform:none;transition:opacity 160ms ease, transform 220ms var(--ease-out), visibility 0s;}
.mega__label{display:none;}
.mega__grid{display:grid;grid-template-columns:1fr 1fr;gap:2px;}
.mega__link{display:grid;grid-template-columns:36px 1fr;gap:4px 14px;align-items:start;padding:14px 16px;border-radius:9px;transition:background-color var(--dur-hover) ease;}
.mega__icon{grid-row:span 2;width:36px;height:36px;border-radius:8px;display:grid;place-items:center;background:color-mix(in srgb, var(--jenn-dorado) 16%, transparent);color:var(--jenn-dorado-tinta);}
.mega__title{font-weight:600;font-size:1rem;line-height:1.3;}
.mega__desc{font-size:.875rem;line-height:1.45;color:var(--jenn-gris-grafito);}
.mega__link[aria-current="page"] .mega__title{color:var(--jenn-dorado-tinta);}
.mega__foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--s3);margin-top:var(--s2);padding:14px 16px 6px;border-top:1px solid var(--linea);font-size:.875rem;}
.mega__foot a{font-weight:600;display:inline-flex;align-items:center;gap:8px;}
.site-nav__extra{display:none;}

/* ===== SUB-NAVEGACIÓN de la página (fija al hacer scroll, con progreso de lectura) ===== */
.subnav{position:sticky;top:var(--header-h, 0px);z-index:var(--z-sticky);background:var(--jenn-blanco-marfil);border-bottom:1px solid var(--linea);transition:box-shadow var(--dur-lift) ease;}
.subnav.is-stuck{box-shadow:0 10px 24px -18px color-mix(in srgb, var(--jenn-negro-onix) 40%, transparent);}
.subnav__inner{display:flex;align-items:center;gap:var(--s6);min-height:var(--subnav-h);}
.subnav__title{font-family:var(--jenn-font-heading);font-size:1.1875rem;font-weight:500;white-space:nowrap;}
.subnav__links{display:flex;gap:30px;flex:1;justify-content:center;}
.subnav__links a{position:relative;display:block;padding:19px 0;font-size:.875rem;font-weight:500;color:var(--jenn-gris-grafito);white-space:nowrap;transition:color var(--dur-hover) ease;}
.subnav__links a::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--jenn-dorado);transform:scaleX(0);transform-origin:left center;transition:transform var(--dur-lift) var(--ease-out);}
.subnav__links a[aria-current="true"]{color:var(--jenn-negro-onix);}
.subnav__links a[aria-current="true"]::after{transform:scaleX(1);}
/* El botón aparece solo cuando la barra ya está fija: arriba, el CTA del header ya está a la vista */
.subnav__cta{margin-left:auto;opacity:0;transform:translateY(4px);pointer-events:none;transition:opacity var(--dur-hover) ease, transform var(--dur-lift) var(--ease-out), background-color var(--dur-hover) ease;}
.subnav.is-stuck .subnav__cta{opacity:1;transform:none;pointer-events:auto;}
/* Progreso de lectura: línea dorada de 2px bajo la barra (la escala productos.js) */
.subnav__progress{position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--jenn-dorado);transform:scaleX(var(--p, 0));transform-origin:left center;pointer-events:none;}
section[id],[data-anchor]{scroll-margin-top:calc(var(--header-h, 0px) + var(--subnav-h) + 16px);}
/* Hero oscuro: la barra también es oscura, para no partir en dos el bloque negro */
.subnav--oscura{background:var(--jenn-negro-onix);border-bottom-color:var(--linea-oscura);color:var(--jenn-blanco-marfil);}
.subnav--oscura .subnav__links a{color:var(--jenn-gris-perla);}
.subnav--oscura .subnav__links a[aria-current="true"]{color:var(--jenn-blanco-marfil);}
/* Índice de secciones en móvil (en escritorio están los enlaces en línea) */
.subnav__menu{display:none;position:relative;}
.subnav__menu summary{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 4px;font-size:.875rem;font-weight:600;cursor:pointer;list-style:none;color:inherit;}
.subnav__menu summary::-webkit-details-marker{display:none;}
.subnav__menu summary svg{transition:transform var(--dur-hover) var(--ease-out);}
.subnav__menu[open] summary svg{transform:rotate(180deg);}
.subnav__menu ul{position:fixed;left:0;right:0;top:calc(var(--header-h, 0px) + var(--subnav-h));padding:6px var(--gutter) 14px;background:var(--jenn-blanco-marfil);border-bottom:1px solid var(--linea);box-shadow:0 18px 30px -20px color-mix(in srgb, var(--jenn-negro-onix) 45%, transparent);}
.subnav__menu li a{display:flex;align-items:center;min-height:48px;border-bottom:1px solid var(--linea);font-size:1rem;color:var(--jenn-negro-onix);}
.subnav--oscura .subnav__menu ul{background:var(--jenn-negro-onix);border-bottom-color:var(--linea-oscura);}
.subnav--oscura .subnav__menu li a{color:var(--jenn-blanco-marfil);border-bottom-color:var(--linea-oscura);}
/* Barra de acción inferior (móvil): el CTA queda al alcance del pulgar. Aparece al dejar
   atrás el hero y se esconde al llegar al cierre (productos.js). */
.barra-cta{display:none;}

/* ===== Migas de pan ===== */
.crumbs ol{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:.8125rem;color:var(--jenn-gris-grafito);}
.crumbs li{display:flex;align-items:center;gap:8px;}
.crumbs li + li::before{content:"/";color:var(--jenn-gris-perla);}
.crumbs a{border-bottom:1px solid transparent;transition:color var(--dur-hover) ease, border-color var(--dur-hover) ease;}
.crumbs [aria-current="page"]{color:var(--jenn-negro-onix);font-weight:600;}
.on-dark .crumbs ol{color:var(--jenn-gris-perla);}
.on-dark .crumbs li + li::before{color:color-mix(in srgb, var(--jenn-blanco-marfil) 30%, transparent);}
.on-dark .crumbs [aria-current="page"]{color:var(--jenn-blanco-marfil);}

/* ===== HERO: solo lo común. La composición de cada hero vive en la hoja de su página. ===== */
.phero{position:relative;isolation:isolate;}
.phero__lede{font-size:var(--t-lede);line-height:1.6;color:var(--jenn-gris-grafito);max-width:34em;text-wrap:pretty;}
.on-dark .phero__lede{color:var(--jenn-gris-perla);line-height:1.68;}
.phero__actions{display:flex;flex-wrap:wrap;gap:var(--s3);}
/* Línea de especificación: datos cortos con rombo, no tarjetas de métricas */
.specline{display:flex;flex-wrap:wrap;gap:10px 22px;font-size:.9375rem;color:var(--jenn-gris-grafito);}
.specline li{display:flex;align-items:center;gap:10px;}
.specline li::before{content:"";width:6px;height:6px;background:var(--jenn-dorado);transform:rotate(45deg);flex:none;}
.specline b{color:var(--jenn-negro-onix);font-weight:600;}
.on-dark .specline{color:var(--jenn-gris-perla);}
.on-dark .specline b{color:var(--jenn-blanco-marfil);}

/* ===== Plates y figuras ===== */
.plate{position:relative;background:var(--jenn-plate);border:1px solid color-mix(in srgb, var(--jenn-gris-perla) 55%, transparent);border-radius:var(--r-lg);overflow:hidden;isolation:isolate;}
.plate > img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply;}
/* Trazos que se dibujan: los paths llevan pathLength="1" */
.trazo{stroke-dasharray:1;stroke-dashoffset:0;}
/* Toma pendiente (foto o video que falta): marco de visor con esquinas, no una caja
   rayada. El texto entre corchetes describe exactamente la toma que hay que hacer. */
.toma{position:relative;display:flex;flex-direction:column;justify-content:flex-end;gap:6px;padding:var(--s5);background:color-mix(in srgb, var(--jenn-gris-perla) 22%, var(--jenn-blanco-marfil));color:var(--jenn-gris-grafito);isolation:isolate;}
.toma::before{content:"";position:absolute;inset:14px;z-index:-1;pointer-events:none;background:
  linear-gradient(var(--jenn-dorado-tinta),var(--jenn-dorado-tinta)) 0 0 / 18px 1.5px no-repeat,
  linear-gradient(var(--jenn-dorado-tinta),var(--jenn-dorado-tinta)) 0 0 / 1.5px 18px no-repeat,
  linear-gradient(var(--jenn-dorado-tinta),var(--jenn-dorado-tinta)) 100% 0 / 18px 1.5px no-repeat,
  linear-gradient(var(--jenn-dorado-tinta),var(--jenn-dorado-tinta)) 100% 0 / 1.5px 18px no-repeat,
  linear-gradient(var(--jenn-dorado-tinta),var(--jenn-dorado-tinta)) 0 100% / 18px 1.5px no-repeat,
  linear-gradient(var(--jenn-dorado-tinta),var(--jenn-dorado-tinta)) 0 100% / 1.5px 18px no-repeat,
  linear-gradient(var(--jenn-dorado-tinta),var(--jenn-dorado-tinta)) 100% 100% / 18px 1.5px no-repeat,
  linear-gradient(var(--jenn-dorado-tinta),var(--jenn-dorado-tinta)) 100% 100% / 1.5px 18px no-repeat;}
.toma__tag{display:inline-flex;align-items:center;gap:8px;font-size:.8125rem;font-weight:600;color:var(--jenn-dorado-tinta);}
.toma__tag::before{content:"";width:8px;height:8px;border-radius:50%;border:1.5px solid currentColor;}
.toma__txt{font-size:.875rem;line-height:1.5;max-width:34em;text-wrap:pretty;}
.on-dark .toma{background:var(--jenn-onix-2);color:var(--jenn-gris-perla);}
.on-dark .toma::before{filter:brightness(1.6);}
.on-dark .toma__tag{color:var(--jenn-dorado);}

/* ===== Secciones ===== */
/* La marca de agua del sitio se deja ver solo en el hero: detrás de diagramas, tablas
   y texto largo era ruido. :where() deja la especificidad en 0 para no pisar los fondos
   de las secciones oscuras o con banda. */
:where(main > section:not(.phero)){background-color:var(--jenn-blanco-marfil);}
.sec{position:relative;padding-block:var(--sec);}
.sec--tight{padding-block:var(--sec-tight);}
.sec--dark,.on-dark{color:var(--jenn-blanco-marfil);}
.sec--dark{background:var(--jenn-negro-onix);}
.sec--dark .lede,.sec--dark .prose p{color:var(--jenn-gris-perla);}
.sec--band{background:var(--jenn-plate);border-block:1px solid color-mix(in srgb, var(--jenn-gris-perla) 55%, transparent);}
.sh{display:flex;flex-direction:column;gap:var(--s4);max-width:46rem;margin-bottom:clamp(2.5rem,1.6rem + 2.6vw,4rem);}
.sh--split{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s5);row-gap:var(--s4);max-width:none;align-items:end;}
.sh--split > :first-child{grid-column:1 / span 6;}
.sh--split > :last-child{grid-column:8 / span 5;}

/* Lista con viñeta rombo (características) */
.rombos li{position:relative;padding-left:22px;color:var(--jenn-gris-grafito);text-wrap:pretty;}
.rombos li + li{margin-top:10px;}
.rombos li::before{content:"";position:absolute;left:2px;top:.62em;width:6px;height:6px;background:var(--jenn-dorado);transform:rotate(45deg);}
.on-dark .rombos li{color:var(--jenn-gris-perla);}

/* Datos en pares etiqueta/valor (ficha) */
.datos{display:grid;grid-template-columns:minmax(0,11rem) 1fr;border-top:1px solid var(--linea);}
.datos dt,.datos dd{padding:14px 0;border-bottom:1px solid var(--linea);}
.datos dt{font-size:.875rem;font-weight:600;color:var(--jenn-gris-grafito);padding-right:var(--s4);}
.datos dd{color:var(--jenn-negro-onix);}
/* Tira de ficha en horizontal: 4 datos en una fila con reglas */
.ficha-tira{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--jenn-negro-onix);}
.ficha-tira > div{padding:var(--s4) var(--s5) var(--s4) 0;border-bottom:1px solid var(--linea);}
.ficha-tira > div + div{padding-left:var(--s5);border-left:1px solid var(--linea);}
.ficha-tira dt{font-size:.8125rem;font-weight:600;color:var(--jenn-dorado-tinta);margin-bottom:4px;}
.ficha-tira dd{font-size:.9375rem;line-height:1.5;text-wrap:pretty;}
.on-dark .ficha-tira{border-top-color:var(--linea-oscura);}
.on-dark .ficha-tira > div{border-color:var(--linea-oscura);}
.on-dark .ficha-tira dt{color:var(--jenn-dorado);}

/* ===== Segment control (cambio de estado de un diagrama) ===== */
/* Columnas iguales: así el indicador solo se traslada (transform), nunca cambia de ancho */
.seg{display:inline-grid;grid-auto-flow:column;grid-auto-columns:1fr;padding:4px;border-radius:999px;border:1px solid var(--linea);background:var(--jenn-plate);position:relative;isolation:isolate;}
.seg__btn{position:relative;z-index:1;border:0;background:none;padding:11px 20px;border-radius:999px;font-size:.875rem;font-weight:600;color:var(--jenn-gris-grafito);cursor:pointer;transition:color var(--dur-hover) ease, transform var(--dur-press) var(--ease-out);white-space:nowrap;}
.seg__btn:active{transform:scale(.97);}
.seg__btn[aria-pressed="true"]{color:var(--jenn-blanco-marfil);}
.seg__thumb{position:absolute;z-index:0;top:4px;bottom:4px;left:4px;width:calc((100% - 8px) / var(--n, 2));border-radius:999px;background:var(--jenn-negro-onix);transform:translateX(calc(100% * var(--i, 0)));transition:transform var(--dur-panel) var(--ease-out);}

/* Opciones tipo pastilla (radios). Variante clara por defecto; en .on-dark se invierte. */
.opciones{display:flex;flex-wrap:wrap;gap:8px;}
.opcion{position:relative;cursor:pointer;}
.opcion input{position:absolute;opacity:0;width:1px;height:1px;}
.opcion span{display:inline-block;padding:10px 16px;border:1px solid var(--linea-fuerte);border-radius:999px;font-size:.875rem;line-height:1.3;color:var(--jenn-negro-onix);transition:background-color var(--dur-hover) ease, border-color var(--dur-hover) ease, color var(--dur-hover) ease, transform var(--dur-press) var(--ease-out);}
.opcion:active span{transform:scale(.97);}
.opcion input:checked + span{background:var(--jenn-negro-onix);border-color:var(--jenn-negro-onix);color:var(--jenn-blanco-marfil);}
.opcion input:focus-visible + span{outline:2px solid var(--jenn-dorado);outline-offset:2px;}
.on-dark .opcion span{border-color:color-mix(in srgb, var(--jenn-blanco-marfil) 30%, transparent);color:var(--jenn-blanco-marfil);}
.on-dark .opcion input:checked + span{background:var(--jenn-blanco-marfil);border-color:var(--jenn-blanco-marfil);color:var(--jenn-negro-onix);}

/* ===== CIERRE COMERCIAL =====
   Misma estructura en las cuatro páginas (consistencia para quien compara), con una
   "fórmula" distinta en cada una: lo que necesitamos para cotizar, dicho como dato. */
.cierre{position:relative;isolation:isolate;overflow:hidden;background:var(--jenn-negro-onix);color:var(--jenn-blanco-marfil);padding-block:clamp(4.5rem,3rem + 5vw,8rem) clamp(3rem,2rem + 3vw,4.5rem);border-top:4px solid var(--jenn-dorado);}
.cierre__grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s5);row-gap:clamp(2rem,1.4rem + 2vw,3.5rem);align-items:end;}
.cierre__formula{grid-column:1 / -1;}
.cierre__lead{grid-column:1 / span 7;align-self:start;display:flex;flex-direction:column;gap:var(--s5);}
.cierre__formula{display:flex;flex-wrap:wrap;align-items:flex-start;gap:.15em .35em;font-family:var(--jenn-font-heading);font-weight:500;font-size:clamp(2.25rem,1.2rem + 4.2vw,5rem);line-height:1;letter-spacing:-.02em;}
.cierre__term{display:inline-flex;flex-direction:column;gap:12px;}
.cierre__term small{font-family:var(--jenn-font-body);font-size:.8125rem;font-weight:500;letter-spacing:0;color:var(--jenn-gris-perla);padding-top:10px;border-top:1px solid var(--linea-oscura);}
.cierre__op{color:var(--jenn-dorado);font-style:normal;}
.cierre__t{font-family:var(--jenn-font-body);font-weight:600;font-size:clamp(1.25rem,1.1rem + .5vw,1.5rem);line-height:1.35;letter-spacing:0;max-width:30em;}
.cierre__d{color:var(--jenn-gris-perla);font-size:1.0625rem;line-height:1.65;max-width:36em;text-wrap:pretty;}
.cierre__panel{grid-column:9 / span 4;display:flex;flex-direction:column;gap:var(--s4);padding:var(--s5);border:1px solid var(--linea-oscura);background:var(--jenn-onix-2);}
.cierre__label{font-size:.8125rem;font-weight:600;color:var(--jenn-dorado);}
/* Vista previa del mensaje que se abre en WhatsApp: la persona sabe qué va a mandar */
.cierre__msg{position:relative;padding:14px 16px;border-left:0;background:color-mix(in srgb, var(--jenn-blanco-marfil) 6%, transparent);font-size:.9375rem;line-height:1.55;color:var(--jenn-blanco-marfil);white-space:pre-line;}
.cierre__msg::after{content:"";position:absolute;left:16px;bottom:-7px;border:7px solid transparent;border-top-color:color-mix(in srgb, var(--jenn-blanco-marfil) 6%, transparent);border-bottom:0;}
.cierre__alt{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 16px;font-size:.9375rem;color:var(--jenn-gris-perla);}
.cierre__alt a{color:var(--jenn-blanco-marfil);border-bottom:1px solid color-mix(in srgb, var(--jenn-dorado) 60%, transparent);transition:border-color var(--dur-hover) ease;}
.cierre__datos{grid-column:1 / -1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s5);padding-top:var(--s6);border-top:1px solid var(--linea-oscura);}
.cierre__datos dt{font-size:.8125rem;font-weight:600;color:var(--jenn-dorado);margin-bottom:4px;}
.cierre__datos dd{color:var(--jenn-gris-perla);font-size:.9375rem;line-height:1.55;}
.cierre__datos a{color:var(--jenn-blanco-marfil);border-bottom:1px solid color-mix(in srgb, var(--jenn-dorado) 60%, transparent);}

/* ===== ÍNDICE "También podría interesarte" =====
   Filas grandes en lugar de tarjetas iguales. En escritorio, al pasar el cursor
   aparece una vista previa que sigue al puntero (productos.js); en móvil cada fila
   lleva su miniatura. */
.indice__list{border-top:1px solid var(--jenn-negro-onix);}
.indice__row{position:relative;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,5fr) auto;align-items:center;gap:var(--s5);padding:clamp(1.25rem,.9rem + 1.2vw,2rem) 0;border-bottom:1px solid var(--linea);}
.indice__media{display:none;}
.indice__t{font-family:var(--jenn-font-heading);font-weight:500;font-size:clamp(1.625rem,1.1rem + 1.8vw,2.75rem);line-height:1.08;letter-spacing:-.01em;transition:transform var(--dur-lift) var(--ease-out), color var(--dur-hover) ease;}
.indice__d{font-size:.9375rem;color:var(--jenn-gris-grafito);max-width:30em;text-wrap:pretty;}
.indice__go{display:grid;place-items:center;width:52px;height:52px;border:1px solid var(--linea-fuerte);border-radius:50%;color:var(--jenn-negro-onix);transition:background-color var(--dur-hover) ease, color var(--dur-hover) ease, border-color var(--dur-hover) ease, transform var(--dur-lift) var(--ease-out);}
.indice__preview{position:fixed;left:0;top:0;z-index:var(--z-float);width:260px;aspect-ratio:4 / 3;pointer-events:none;border-radius:var(--r-md);overflow:hidden;background:var(--jenn-plate);box-shadow:var(--sombra-2);opacity:0;transform:translate(-50%,-50%) scale(.9);visibility:hidden;}
.indice__preview img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply;}
.indice__preview svg{width:100%;height:100%;}

/* ===== FAQ (mismo componente que index.html) ===== */
.faq__grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s5);row-gap:var(--s6);}
.faq__head{grid-column:1 / span 4;display:flex;flex-direction:column;gap:var(--s4);align-self:start;position:sticky;top:calc(var(--subnav-h) + 36px);}
.faq__head p{color:var(--jenn-gris-grafito);text-wrap:pretty;}
.faq__list{grid-column:6 / span 7;border-top:1px solid var(--linea);}
.faq__item{border-bottom:1px solid var(--linea);}
.faq__q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:var(--s5);background:none;border:0;cursor:pointer;padding:24px 4px;text-align:left;transition:transform var(--dur-press) var(--ease-out);}
.faq__q:active{transform:scale(.99);}
.faq__q-text{font-weight:600;font-size:1.125rem;line-height:1.4;color:var(--jenn-negro-onix);text-wrap:pretty;transition:color var(--dur-hover) ease;}
.faq__indicator{position:relative;width:18px;height:18px;flex:0 0 auto;}
.faq__indicator::before,.faq__indicator::after{content:"";position:absolute;top:50%;left:50%;background:var(--jenn-dorado);border-radius:1px;transition:transform var(--dur-panel) var(--ease-in-out);}
.faq__indicator::before{width:2px;height:16px;transform:translate(-50%,-50%);}
.faq__indicator::after{width:16px;height:2px;transform:translate(-50%,-50%);}
.faq__item.is-open .faq__indicator::before{transform:translate(-50%,-50%) rotate(90deg);}
.faq__a{display:grid;grid-template-rows:0fr;opacity:0;visibility:hidden;transition:grid-template-rows var(--dur-panel) var(--ease-in-out), opacity calc(var(--dur-panel) * .6) ease, visibility 0s linear var(--dur-panel);}
.faq__a > div{overflow:hidden;min-height:0;padding:0 4px;font-size:1rem;line-height:1.7;color:var(--jenn-gris-grafito);text-wrap:pretty;}
/* El aire inferior va como contenido, no como padding: así se colapsa a 0 con la fila */
.faq__a > div::after{content:"";display:block;height:26px;}
.faq__item h3{font:inherit;margin:0;}
.faq__a > div a{color:var(--jenn-negro-onix);text-decoration:underline;text-decoration-color:var(--jenn-dorado);text-underline-offset:3px;}
.faq__item.is-open .faq__a{grid-template-rows:1fr;opacity:1;visibility:visible;transition:grid-template-rows var(--dur-panel) var(--ease-in-out), opacity calc(var(--dur-panel) * .6) ease;}
/* Sin JS, todas las respuestas quedan abiertas */
html:not(.js-on) .faq__a{grid-template-rows:1fr;opacity:1;visibility:visible;}

/* ===== FOOTER (mismo bloque que index.html + columna de productos) ===== */
.site-footer{position:relative;z-index:var(--z-base);background:var(--jenn-negro-onix);color:var(--jenn-gris-perla);}
.footer__accent{height:4px;width:100%;background:var(--jenn-dorado);}
.footer__cols{max-width:1200px;margin:0 auto;padding:70px 48px 40px;display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:40px;}
.footer__logo{height:40px;width:auto;margin-bottom:18px;}
.footer__blurb{font-size:15px;line-height:1.6;color:var(--jenn-gris-perla);max-width:280px;}
.site-footer h4,.site-footer .footer__h{font-size:13px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--jenn-gris-perla);margin:0 0 16px;}
.site-footer p{font-size:15px;line-height:1.7;color:var(--jenn-gris-perla);}
.site-footer a{color:var(--jenn-gris-perla);font-size:15px;transition:color var(--dur-hover) ease;}
.footer__links li + li{margin-top:9px;}
.footer__links a[aria-current="page"]{color:var(--jenn-blanco-marfil);}
.footer__bar{border-top:1px solid var(--linea-oscura);}
.footer__bar-inner{max-width:1200px;margin:0 auto;padding:22px 48px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;}
.footer__copy{font-size:13px;}
.footer__legal a{font-size:13px;}
.footer__credit{border-top:1px solid color-mix(in srgb, var(--jenn-dorado) 25%, transparent);padding:20px 48px;text-align:center;background:color-mix(in srgb, var(--jenn-dorado) 7%, transparent);}
.footer__credit span{font-size:13px;letter-spacing:.3px;color:var(--jenn-gris-perla);}
.footer__credit a{display:inline-block;color:var(--jenn-dorado);font-size:14px;font-weight:700;letter-spacing:.8px;padding-bottom:1px;border-bottom:1.5px solid color-mix(in srgb, var(--jenn-dorado) 45%, transparent);transition:color var(--dur-hover) ease, border-color var(--dur-hover) ease, transform var(--dur-hover) ease;}

/* ===== Revelado al hacer scroll =====
   Lo activa productos.js añadiendo .js-reveal a <html>. Sin JS (o si el archivo
   no carga) no hay nada oculto: el contenido nunca depende de la animación.
   Se usa poco y a propósito: solo en listas, no como entrada de cada sección. */
.js-reveal [data-reveal]{opacity:0;transform:translateY(16px);transition:opacity var(--dur-reveal) var(--ease-out), transform var(--dur-reveal) var(--ease-out);transition-delay:calc(var(--i, 0) * var(--dur-stagger));}
.js-reveal [data-reveal="fade"]{transform:none;}
.js-reveal [data-reveal].is-in{opacity:1;transform:none;}
/* Líneas de SplitText: la máscara la crea el plugin; aquí solo el aire para descendentes */
.split-mask{padding-bottom:.08em;margin-bottom:-.08em;}

/* ===== HOVERS (solo puntero fino: en touch el :hover se queda pegado) ===== */
@media (hover:hover) and (pointer:fine){
  .nav-link:hover{color:var(--jenn-dorado);}
  .btn-header:hover,.btn--oro:hover{background:color-mix(in srgb, var(--jenn-dorado) 82%, black);}
  .btn--negro:hover{background:color-mix(in srgb, var(--jenn-negro-onix) 84%, white);}
  .btn--marfil:hover{background:var(--jenn-dorado);}
  .btn--linea:hover{background:var(--jenn-negro-onix);color:var(--jenn-blanco-marfil);}
  .btn--linea-clara:hover{border-color:var(--jenn-dorado);color:var(--jenn-dorado);}
  .btn:hover svg{transform:translateX(3px);}
  .link-arrow:hover{color:var(--jenn-dorado-tinta);}
  .on-dark .link-arrow:hover{color:var(--jenn-dorado);}
  .link-arrow:hover svg{transform:translateX(3px);}
  .prose a:hover,.inline-link:hover{text-decoration-color:var(--jenn-negro-onix);}
  .on-dark .inline-link:hover,.inline-link--claro:hover{text-decoration-color:var(--jenn-blanco-marfil);}
  .mega__link:hover{background:color-mix(in srgb, var(--jenn-gris-perla) 32%, transparent);}
  .mega__foot a:hover{color:var(--jenn-dorado-tinta);}
  .subnav__links a:hover{color:var(--jenn-negro-onix);}
  .crumbs a:hover{color:var(--jenn-negro-onix);border-bottom-color:var(--jenn-dorado);}
  .on-dark .crumbs a:hover{color:var(--jenn-blanco-marfil);}
  .seg__btn:not([aria-pressed="true"]):hover{color:var(--jenn-negro-onix);}
  .opcion:hover span{border-color:var(--jenn-negro-onix);}
  .on-dark .opcion:hover span{border-color:var(--jenn-blanco-marfil);}
  .indice__row:hover .indice__t{transform:translateX(10px);color:var(--jenn-dorado-tinta);}
  .indice__row:hover .indice__go{background:var(--jenn-negro-onix);border-color:var(--jenn-negro-onix);color:var(--jenn-blanco-marfil);transform:rotate(-45deg);}
  .faq__q:hover .faq__q-text{color:var(--jenn-dorado-tinta);}
  .site-footer a:hover{color:var(--jenn-blanco-marfil);}
  .footer__credit a:hover{color:color-mix(in srgb, var(--jenn-dorado) 78%, white);border-bottom-color:color-mix(in srgb, var(--jenn-dorado) 78%, white);transform:translateY(-1px);}
  .cierre__alt a:hover,.cierre__datos a:hover{border-bottom-color:var(--jenn-blanco-marfil);}
}

/* ===== MARCA DE AGUA GLOBAL (idéntica a index.html) =====
   Va al final de la hoja a propósito: las secciones claras se declaran arriba con
   fondo y aquí se apagan para dejar pasar el mosaico. Ver nota larga en index.html. */
body{position:relative;isolation:isolate;}
body::before{content:"";position:fixed;top:-25%;left:-25%;width:150%;height:150%;transform:rotate(-20deg);background-image:url("../LOGO%20JENN.jpeg");background-repeat:repeat;background-size:180px auto;mix-blend-mode:multiply;opacity:.05;pointer-events:none;z-index:0;}
.subnav,main{position:relative;}
main{z-index:var(--z-base);}
.subnav{position:sticky;}

/* ===== RESPONSIVE ===== */
@media (max-width:1100px){
  .subnav__links{gap:22px;}
}
/* Escritorio angosto (961–1180): el menú de tres enlaces + logo centrado + CTA no cabe
   con el espaciado completo; se compacta antes de pasar a la hamburguesa. */
@media (min-width:961px) and (max-width:1180px){
  .site-header__bar{padding-inline:28px;gap:var(--s4);}
  .site-nav__list{gap:26px;}
  .nav-link{font-size:.8125rem;letter-spacing:1.4px;}
  .btn-header{font-size:.8125rem;letter-spacing:1.2px;padding:14px 18px;}
  .mega{left:-16px;}
}
@media (max-width:960px){
  .site-header__bar{grid-template-columns:1fr auto;padding:20px var(--gutter);}
  .brand{justify-self:start;order:-1;}
  .brand img{height:32px;}
  .site-nav{justify-self:end;position:static;}
  /* En páginas de producto el CTA vive en la sub-navegación fija; aquí sobraría */
  .site-header--producto .site-header__cta{display:none;}
  .burger{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;width:44px;height:44px;margin:-9px -9px -9px 0;cursor:pointer;background:none;border:0;padding:0;}
  .burger span{height:2px;width:26px;background:var(--jenn-blanco-marfil);display:block;transition:transform var(--dur-panel) var(--ease-in-out), opacity var(--dur-press) ease;}
  .site-nav.is-open .burger span:nth-child(1){transform:translateY(7px) rotate(45deg);}
  .site-nav.is-open .burger span:nth-child(2){opacity:0;}
  .site-nav.is-open .burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
  /* Panel móvil: sin JS queda abierto (progressive enhancement); con JS se colapsa */
  .site-nav__panel{position:absolute;left:0;right:0;top:100%;display:grid;grid-template-rows:1fr;background:var(--jenn-negro-onix);border-top:1px solid var(--linea-oscura);box-shadow:0 28px 40px -24px rgba(0,0,0,.65);transition:grid-template-rows var(--dur-panel) var(--ease-in-out);}
  .js-on .site-nav__panel{grid-template-rows:0fr;}
  .js-on .site-nav.is-open .site-nav__panel{grid-template-rows:1fr;}
  .site-nav__panel > div{overflow:hidden;min-height:0;}
  .site-nav__list{flex-direction:column;align-items:stretch;gap:0;padding:8px var(--gutter) 0;}
  .site-nav__list > li > .nav-link{display:flex;width:100%;padding:16px 2px;border-bottom:1px solid var(--linea-oscura);}
  .site-nav__trigger{display:none !important;}
  .mega{position:static;width:auto;opacity:1;visibility:visible;transform:none;background:none;border:0;box-shadow:none;padding:6px 0 10px;color:var(--jenn-blanco-marfil);border-bottom:1px solid var(--linea-oscura);border-radius:0;transition:none;}
  .mega::before{display:none;}
  .mega__label{display:block;font-size:.6875rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--jenn-dorado);padding:14px 2px 6px;}
  .mega__grid{grid-template-columns:1fr;gap:0;}
  .mega__link{grid-template-columns:1fr;padding:11px 2px;border-radius:0;}
  .mega__icon,.mega__desc{display:none;}
  .mega__title{font-size:1.0625rem;font-weight:500;}
  .mega__link[aria-current="page"] .mega__title{color:var(--jenn-dorado);}
  .mega__foot{display:none;}
  .site-nav__extra{display:flex;flex-direction:column;gap:var(--s3);padding:var(--s5) var(--gutter) var(--s6);}
  .site-nav__extra .btn{width:100%;}
  .sh--split > :first-child,.sh--split > :last-child{grid-column:1 / -1;}
  .cierre__lead,.cierre__panel{grid-column:1 / -1;}
  .cierre__panel{max-width:560px;}
  .cierre__datos{grid-template-columns:1fr 1fr;}
  .indice__row{grid-template-columns:72px minmax(0,1fr) auto;column-gap:var(--s4);row-gap:4px;}
  .indice__media{display:block;grid-row:span 2;width:72px;height:72px;border-radius:var(--r-md);overflow:hidden;background:var(--jenn-plate);border:1px solid var(--linea);}
  .indice__media img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply;}
  .indice__media svg{width:100%;height:100%;}
  .indice__t{grid-column:2;}
  .indice__d{grid-column:2;}
  .indice__go{grid-column:3;grid-row:1 / span 2;width:44px;height:44px;}
  .indice__preview{display:none;}
  .ficha-tira{grid-template-columns:1fr 1fr;}
  .ficha-tira > div:nth-child(3){padding-left:0;border-left:0;}
  .faq__head{grid-column:1 / -1;position:static;}
  .faq__list{grid-column:1 / -1;}
  .footer__cols{grid-template-columns:1fr 1fr;padding:56px 24px 32px;}
  .footer__bar-inner{padding:22px 24px;}
  .footer__credit{padding:16px 24px;}
}
@media (max-width:860px){
  .subnav__links,.subnav__cta{display:none;}
  .subnav__menu{display:block;margin-left:auto;}
  .subnav__inner{gap:var(--s4);}
  .subnav__title{font-size:1.0625rem;overflow:hidden;text-overflow:ellipsis;}
  .js-on .barra-cta{position:fixed;left:0;right:0;bottom:0;z-index:var(--z-sticky);display:flex;gap:8px;align-items:center;padding:10px var(--gutter) calc(10px + env(safe-area-inset-bottom));background:color-mix(in srgb, var(--jenn-negro-onix) 94%, transparent);border-top:1px solid var(--linea-oscura);transform:translateY(110%);transition:transform var(--dur-panel) var(--ease-drawer);}
  .barra-cta.is-on{transform:none;}
  .barra-cta .btn{flex:1;padding-block:15px;}
  .barra-cta__tel{display:grid;place-items:center;flex:none;width:52px;height:52px;border:1px solid color-mix(in srgb, var(--jenn-blanco-marfil) 35%, transparent);color:var(--jenn-blanco-marfil);}
}
@media (max-width:560px){
  body{font-size:1rem;}
  .phero__actions{flex-direction:column;align-items:stretch;}
  .phero__actions .btn{width:100%;}
  .cierre__datos{grid-template-columns:1fr;gap:var(--s4);}
  .cierre__panel{padding:var(--s4);}
  .datos{grid-template-columns:1fr;}
  .datos dt{padding-bottom:2px;border-bottom:0;padding-top:14px;}
  .datos dd{padding-top:2px;}
  .ficha-tira{grid-template-columns:1fr;}
  .ficha-tira > div,.ficha-tira > div + div{padding-left:0;padding-right:0;border-left:0;}
  .indice__row{grid-template-columns:56px minmax(0,1fr);}
  .indice__media{width:56px;height:56px;}
  .indice__go{display:none;}
  .footer__cols{grid-template-columns:1fr;}
  .faq__q-text{font-size:1.0625rem;}
  body::before{background-size:110px auto;}
}
@media (prefers-reduced-motion: reduce){
  .ln > span,.intro-in{animation:none;}
  .barra-cta{transition:none;}
}
@media print{
  body::before{display:none;}
  .subnav,.site-nav,.cierre__panel .btn,.barra-cta{display:none !important;}
  .js-reveal [data-reveal]{opacity:1 !important;transform:none !important;}
}