/* =====================================================================================================
   KIT APPLE DE BWIT · kit.css · 21-10-2026
   Piezas de la web de Bwit con las medidas y el comportamiento de apple.com, escritas desde cero.
   De Apple solo se copian números y comportamiento: nada de su código, su letra, sus imágenes ni sus textos.
   Todo lleva el prefijo kit- para no chocar con la web actual. Qué es cada pieza, sus números y de qué
   medida de Apple sale: LEEME.md (misma carpeta). Las fichas entre corchetes, como [A2.4] o [P6.2], son
   las de «guia-apple-precision.md»; «portada» es «fotograma-a-fotograma-portada.md».
   Fondos: blanco y #F5F7FA. Negro, nunca.
   ===================================================================================================== */
@import url("../../assets/fonts/fuentes.css");   /* Inter, la letra de Bwit (local, sin Google) */

/* ---------- 1 · Tokens ------------------------------------------------------------------------------ */
:root {
  /* Colores de Bwit (web/assets/css/estilo-b.css). Entre paréntesis, el de Apple al que sustituyen. */
  --kit-tinta: #15283D;                          /* texto fuerte (rgb 29,29,31) */
  --kit-gris: #5E6E81;                           /* texto de cuerpo (rgb 96,111,127) */
  --kit-gris2: #8391A2;                          /* apagado (rgb 110,110,115 y 134,134,139) */
  --kit-azul: #004C97;                           /* acción y enlaces (#0071e3 y #0066cc) */
  --kit-azul-hover: #0060BD;                     /* (#0076df) */
  --kit-amarillo: #E9B920;                       /* solo en dosis: el kit no lo usa */
  --kit-banda: #F5F7FA;                          /* fondo gris claro (#f5f5f7) */
  --kit-blanco: #FFFFFF;
  --kit-filete: #D9E0E8;                         /* rayas de 1 px (rgb 210,210,215) */
  --kit-aro: #E2E7ED;                            /* aro de 1 px de la barra local (rgb 230,230,232), derivado */
  --kit-velo: rgba(226, 231, 238, .72);          /* píldoras translúcidas (rgba 232,232,237,.72), derivado */
  --kit-velo-lleno: rgb(226, 231, 238);
  --kit-flecha: rgba(201, 209, 219, .64);        /* flechas (rgba 210,210,215,.64) */
  --kit-flecha-hover: rgba(214, 221, 229, .70);  /* (rgba 223,223,227,.6976) */
  --kit-flecha-pulsada: rgba(187, 197, 209, .66);/* (rgba 193,193,198,.6544) */
  --kit-flecha-icono: rgba(21, 40, 61, .56);     /* (negro al 56 %, al 64 % con el ratón) */
  --kit-punto: rgba(21, 40, 61, .6);             /* puntos de «Lo principal» (rgba 29,29,31,.6) */
  --kit-punto-portada: rgba(21, 40, 61, .48);    /* puntos de la galería de portada (negro al 48 %) */
  --kit-degradado-titular: linear-gradient(0deg, #7A8FA4, #15283D 60%);  /* titular en degradado [1.2] */

  /* Letra. De Apple se copia tamaño/interlínea, peso y espaciado entre letras (en em, su regla [1.2]). */
  --kit-letra: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --kit-t-gigante:   600 96px/100px var(--kit-letra); --kit-ls-gigante: -.015em;   /* titular gigante [P3.1] */
  --kit-t-portada:   600 80px/84px var(--kit-letra);  --kit-ls-portada: -.015em;   /* nombre de cabecera [P1.2] */
  --kit-t-grande:    600 64px/68px var(--kit-letra);  --kit-ls-grande: -.009em;    /* titular grande [P6.5] */
  --kit-t-bloque:    600 56px/60px var(--kit-letra);  --kit-ls-bloque: -.005em;    /* bloque y franja de portada */
  --kit-t-seccion:   600 48px/52px var(--kit-letra);  --kit-ls-seccion: -.003em;   /* titular de sección [A3.1] */
  --kit-t-comercial: 600 40px/44px var(--kit-letra);  --kit-ls-comercial: 0em;     /* galerías y teselas [A2.1] */
  --kit-t-tarjeta:   600 28px/32px var(--kit-letra);  --kit-ls-tarjeta: .007em;    /* título de tarjeta [A10.3] */
  --kit-t-frase:     400 28px/32px var(--kit-letra);  --kit-ls-frase: .007em;      /* frase de portada [A1.2] */
  --kit-t-antetitulo:600 21px/25px var(--kit-letra);  --kit-ls-antetitulo: .011em; /* antetítulo [A3.1] */
  --kit-t-entrada:   400 21px/29px var(--kit-letra);  --kit-ls-entrada: .011em;    /* párrafo de entrada [A3.1] */
  --kit-t-dato:      400 19px/23px var(--kit-letra);  --kit-ls-dato: .012em;       /* dato de franja (portada) */
  --kit-t-cuerpo:    400 17px/25px var(--kit-letra);  --kit-ls-cuerpo: -.022em;    /* texto corriente */
  --kit-t-pie:       400 17px/25px var(--kit-letra);  --kit-ls-pie: -.022em;       /* pie de foto [A7.7] */
  --kit-t-tarjeta-texto: 400 17px/21px var(--kit-letra); --kit-ls-tarjeta-texto: -.022em; /* [A10.3] */
  --kit-t-cifra:     600 48px/48px var(--kit-letra);  --kit-ls-cifra: -.003em;     /* cifra estrella [P6.4] */
  --kit-t-etiqueta:  400 14px/18px var(--kit-letra);  --kit-ls-etiqueta: -.016em;  /* etiqueta de cifra [P6.4] */
  --kit-t-legal:     400 12px/16px var(--kit-letra);  --kit-ls-legal: -.01em;      /* nota legal [AL.5] */

  /* Rejilla y espacios [1.1] [1.3] */
  --kit-ancho: 87.5%;            /* contenido: 1.260 a 1.440 (margen 90), 367,5 a 420 (margen 26,25) */
  --kit-ancho-max: 1260px;       /* a 1.920 el margen sale de 330 */
  --kit-margen: max(6.25%, calc(50% - 630px));  /* relleno lateral de lo que va a todo lo ancho (carriles) */
  --kit-aire: 160px;             /* aire de sección arriba y abajo (Air; el Pro usa 144) */
  --kit-aire-pildora: 226px;     /* abajo de una sección con botonera o píldora flotante (Air) */
  --kit-hueco-col: 20px;         /* entre columnas de tarjetas [A7.7] */
  --kit-hueco-fila: 24px;        /* entre filas */
  --kit-cab-contenido: 48px;     /* cabecera de sección → contenido (Pro 48; Air 40-56) */
  --kit-ante-titular: 20px;      /* antetítulo → titular [P5.1] */
  --kit-titular-parrafo: 32px;   /* titular → párrafo (Air) */
  --kit-entre-bloques: 120px;    /* entre bloques de una sección [A5.2] */
  --kit-mosaico-hueco: 12px;     /* portada: blanco entre piezas */

  /* Radios [1.4] */
  --kit-radio: 28px;             /* tarjetas, vídeos, imágenes y galerías */
  --kit-radio-barra: 18px;       /* barra local plegada (32 desplegada) */
  --kit-radio-barra-abierta: 32px;
  --kit-radio-pildora: 980px;    /* botones */
  --kit-radio-caja: 22px;        /* caja de compra del móvil */

  /* Curvas [1.5] */
  --kit-eiq: cubic-bezier(.476, .035, .524, .965);   /* easeInOutQuad: entradas y galerías */
  --kit-eoq: cubic-bezier(.3333, .6667, .6667, 1);   /* easeOutQuad: cifras */
  --kit-eic: cubic-bezier(.6187, -.0479, .3813, 1.0479); /* easeInOutCubic: cambio de imagen */
  --kit-ease: cubic-bezier(.25, .1, .25, 1);         /* barra local (230 ms), índice (320 ms) */
  --kit-ease-out: cubic-bezier(0, 0, .58, 1);        /* fotograma final, barra local desplegada */
  --kit-ease-in: cubic-bezier(.42, 0, 1, 1);
  --kit-ease-in-out: cubic-bezier(.42, 0, .58, 1);   /* acordeón, texto de la píldora */
  --kit-hover: cubic-bezier(0, 0, .5, 1);            /* tarjeta al pasar el ratón */
  --kit-menu: cubic-bezier(.4, 0, .6, 1);            /* menú de la barra global (portada) */
  --kit-portada-paso: cubic-bezier(.645, .045, .355, 1);  /* galería de portada (portada) */
  --kit-revela-luz: cubic-bezier(.45, 0, .55, 1);    /* imagen que se revela: opacidad [P9.6] */
  --kit-revela-mov: cubic-bezier(.33, 0, .83, 1);    /* imagen que se revela: subida y escala [P9.6] */

  /* Duraciones [1.6] */
  --kit-entrada-paso: 150ms;     --kit-entrada-fundido: 900ms;  --kit-entrada-subida: 700ms;  --kit-entrada-distancia: 30px;
  --kit-barra-aparece: 230ms;    --kit-barra-abre: 400ms;
  --kit-galeria-espera: 6.15s;   --kit-galeria-paso: 1s;
  --kit-portada-espera: 5.03s;   --kit-portada-relleno: 4.16s;  --kit-portada-relleno-retraso: .84s;
  --kit-galeria-p-paso: .5s;     --kit-flecha-t: 100ms;         --kit-hover-t: 300ms;
  --kit-fotograma-final: 400ms;  --kit-fotograma-tarjeta: 200ms;
  /* Sección fija [P6.1]: recorrido de 220vh, quieta 120vh (1.079 px medidos a 1.440 × 900). 170vh es el valor por defecto
     del código de Apple (quieta 70vh, 630 px). Nunca más de 220vh. */
  --kit-fija-recorrido: 220vh;
}
/* easeInOutQuad exacta donde el navegador entiende linear() (Chrome 113, Safari 17.2, Firefox 112) [1.5] */
@supports (transition-timing-function: linear(0, 1)) {
  :root { --kit-eiq: linear(0, .005, .02, .045, .08, .125, .18, .245, .32, .405, .5, .595, .68, .755, .82, .875, .92, .955, .98, .995, 1); }
}
@media (max-width: 1068px) { :root { --kit-aire: 120px; } }          /* tramo intermedio de Apple (735-1.068): 120 del Pro */
@media (max-width: 734px) {                                          /* móvil [1.2] columna «Móvil (420)» */
  :root {
    --kit-t-gigante:   600 40px/44px var(--kit-letra); --kit-ls-gigante: 0em;
    --kit-t-portada:   600 40px/44px var(--kit-letra); --kit-ls-portada: 0em;
    --kit-t-grande:    600 40px/44px var(--kit-letra); --kit-ls-grande: 0em;
    --kit-t-bloque:    600 32px/36px var(--kit-letra); --kit-ls-bloque: .004em;
    --kit-t-seccion:   600 32px/36px var(--kit-letra); --kit-ls-seccion: .004em;
    --kit-t-comercial: 600 28px/32px var(--kit-letra); --kit-ls-comercial: .007em;
    --kit-t-tarjeta:   600 21px/25px var(--kit-letra); --kit-ls-tarjeta: .011em;
    --kit-t-frase:     400 19px/23px var(--kit-letra); --kit-ls-frase: .012em;
    --kit-t-antetitulo:600 17px/21px var(--kit-letra); --kit-ls-antetitulo: -.022em;
    --kit-t-entrada:   400 19px/27px var(--kit-letra); --kit-ls-entrada: .012em;
    --kit-t-dato:      400 17px/21px var(--kit-letra); --kit-ls-dato: -.022em;
    --kit-t-pie:       400 14px/20px var(--kit-letra); --kit-ls-pie: -.016em;
    --kit-t-tarjeta-texto: 400 14px/18px var(--kit-letra); --kit-ls-tarjeta-texto: -.016em;
    --kit-t-cifra:     600 40px/40px var(--kit-letra); --kit-ls-cifra: 0em;      /* para que «50.000» quepa en media columna */
    --kit-t-etiqueta:  400 12px/16px var(--kit-letra); --kit-ls-etiqueta: -.01em;
    --kit-aire: 96px;  --kit-aire-pildora: 110px;
    --kit-cab-contenido: 40px;  --kit-ante-titular: 12px;  --kit-titular-parrafo: 28px;  --kit-entre-bloques: 64px;
  }
}

/* ---------- 2 · Base (solo dentro de .kit) ------------------------------------------------------------ */
.kit { margin: 0; background: var(--kit-blanco); color: var(--kit-tinta); font: var(--kit-t-cuerpo); letter-spacing: var(--kit-ls-cuerpo);
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; -webkit-text-size-adjust: 100%; }
.kit *, .kit *::before, .kit *::after { box-sizing: border-box; }
.kit :where(h1, h2, h3, h4, p, figure, figcaption, ul, ol, li, dl, dt, dd) { margin: 0; padding: 0; }
.kit :where(ul, ol) { list-style: none; }
.kit :where(img, video, canvas, svg) { display: block; max-width: 100%; }
.kit :where(img) { height: auto; }                                 /* que el atributo height no pise el aspect-ratio */
.kit :where(a) { color: inherit; text-decoration: none; }
.kit :where(button) { font: inherit; letter-spacing: inherit; color: inherit; background: none; border: 0; padding: 0; margin: 0; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.kit :where(strong, b) { font-weight: 600; }
/* Foco con el teclado: 2 px del azul, separado 1 px (3 px en píldoras, flechas y puntos) (fotograma-a-fotograma-pro, «Hover y foco») */
.kit :focus-visible { outline: 2px solid var(--kit-azul); outline-offset: 1px; }
.kit :is(.kit-galeria__punto, .kit-galeria__pausa, .kit-flecha, .kit-pildora, .kit-local__pestanas a, .kit-local__ver, .kit-local__cerrar):focus-visible { outline-offset: 3px; }
.kit-saltar { position: absolute; left: 12px; top: -64px; z-index: 10001; background: var(--kit-blanco); color: var(--kit-azul); padding: 8px 14px; border-radius: var(--kit-radio-pildora); box-shadow: 0 0 0 1px var(--kit-filete); }
.kit-saltar:focus { top: 8px; }
.kit-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- 3 · Rejilla, secciones y fondos [1.1] [1.3] [2.10] --------------------------------------- */
.kit-contenido { width: var(--kit-ancho); max-width: var(--kit-ancho-max); margin-inline: auto; }
.kit-lectura { max-width: 630px; }                                  /* 6 de 12 columnas (630 px) */
.kit-lectura--centro { margin-inline: auto; }
.kit-seccion { position: relative; padding-block: var(--kit-aire); overflow-x: clip; }
.kit-seccion--sin-arriba { padding-top: 0; }
.kit-seccion--con-pildora { padding-bottom: var(--kit-aire-pildora); }
.kit-fondo-blanco { background: var(--kit-blanco); }
.kit-fondo-gris { background: var(--kit-banda); }
.kit-fondo-blanco-a-gris { background: var(--kit-blanco) linear-gradient(180deg, var(--kit-blanco), var(--kit-banda)); }   /* sección que empieza blanca y acaba gris */
.kit-fondo-gris-a-blanco { background: var(--kit-banda) linear-gradient(0deg, var(--kit-blanco), 15%, var(--kit-banda)); }/* gris que se aclara en el último 15 % */
.kit-cab { width: var(--kit-ancho); max-width: var(--kit-ancho-max); margin: 0 auto var(--kit-cab-contenido); display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 20px 80px; }
.kit-cab--columna { flex-direction: column; align-items: flex-start; gap: 0; }
.kit-cab--centro { flex-direction: column; align-items: center; text-align: center; gap: 0; }
.kit-cab--ante { display: grid; grid-template-columns: 315px minmax(0, 1fr); align-items: start; gap: 0; }   /* antetítulo en 3 columnas (315) y titular en 9 (945) */
.kit-cab .kit-t-antetitulo + * { margin-top: var(--kit-ante-titular); }
.kit-cab--ante .kit-t-antetitulo + * { margin-top: 0; }
.kit-cab + .kit-contenido > .kit-t-entrada:first-child, .kit-cab__parrafo { margin-top: var(--kit-titular-parrafo); }
@media (max-width: 1068px) { .kit-cab--ante { grid-template-columns: 1fr; } .kit-cab--ante .kit-t-antetitulo + * { margin-top: var(--kit-ante-titular); } }
@media (max-width: 734px) {
  .kit-cab { flex-direction: column; align-items: flex-start; gap: 16px; }
  .kit-cab--centro { align-items: center; gap: 0; }
  .kit-lectura { max-width: none; width: calc(100% * 10 / 12); margin-inline: auto; }   /* 10 de 12 columnas: 306 px a 420 [A0.1] */
}

/* ---------- 4 · Letra ------------------------------------------------------------------------------- */
.kit-t-gigante    { font: var(--kit-t-gigante);    letter-spacing: var(--kit-ls-gigante); }
.kit-t-portada    { font: var(--kit-t-portada);    letter-spacing: var(--kit-ls-portada); }
.kit-t-grande     { font: var(--kit-t-grande);     letter-spacing: var(--kit-ls-grande); }
.kit-t-bloque     { font: var(--kit-t-bloque);     letter-spacing: var(--kit-ls-bloque); }
.kit-t-seccion    { font: var(--kit-t-seccion);    letter-spacing: var(--kit-ls-seccion); }
.kit-t-comercial  { font: var(--kit-t-comercial);  letter-spacing: var(--kit-ls-comercial); }
.kit-t-tarjeta    { font: var(--kit-t-tarjeta);    letter-spacing: var(--kit-ls-tarjeta); }
.kit-t-frase      { font: var(--kit-t-frase);      letter-spacing: var(--kit-ls-frase); }
.kit-t-antetitulo { font: var(--kit-t-antetitulo); letter-spacing: var(--kit-ls-antetitulo); color: var(--kit-gris); }
.kit-t-antetitulo--azul { color: var(--kit-azul); }
.kit-t-entrada    { font: var(--kit-t-entrada);    letter-spacing: var(--kit-ls-entrada); color: var(--kit-gris); }   /* a dos tonos: */
.kit-t-entrada strong, .kit-t-entrada b { color: var(--kit-tinta); }                                               /* la frase clave en tinta */
.kit-t-dato       { font: var(--kit-t-dato);       letter-spacing: var(--kit-ls-dato); color: var(--kit-gris); }
.kit-t-cuerpo     { font: var(--kit-t-cuerpo);     letter-spacing: var(--kit-ls-cuerpo); }
.kit-t-pie        { font: var(--kit-t-pie);        letter-spacing: var(--kit-ls-pie); color: var(--kit-gris); }
.kit-t-pie strong { color: var(--kit-tinta); font-weight: 500; }
.kit-t-cifra      { font: var(--kit-t-cifra);      letter-spacing: var(--kit-ls-cifra); }
.kit-t-etiqueta   { font: var(--kit-t-etiqueta);   letter-spacing: var(--kit-ls-etiqueta); color: var(--kit-gris); }
.kit-t-legal      { font: var(--kit-t-legal);      letter-spacing: var(--kit-ls-legal); color: var(--kit-gris); }
.kit-apagado { color: var(--kit-gris); }                             /* titular a dos tonos: el remate en gris */
.kit-t-degradado { background: var(--kit-degradado-titular); -webkit-background-clip: text; background-clip: text; color: transparent; }

/* ---------- 5 · Botones en píldora y enlaces (portada, «Botones») ------------------------------------- */
.kit-boton { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 11px 21px; border: 1px solid transparent;
  border-radius: var(--kit-radio-pildora); background: var(--kit-azul); color: var(--kit-blanco); font: 400 17px/20px var(--kit-letra); letter-spacing: -.022em;
  text-align: center; text-decoration: none; white-space: nowrap; cursor: pointer; }
.kit-boton:hover { background: var(--kit-azul-hover); text-decoration: none; }               /* al instante, sin transición */
.kit-boton--secundario { background: transparent; border-color: var(--kit-azul); color: var(--kit-azul); }
.kit-boton--secundario:hover { background: var(--kit-azul-hover); border-color: transparent; color: var(--kit-blanco); }
.kit-boton--pequeno { min-height: 36px; padding: 8px 15px; font: 400 14px/18px var(--kit-letra); letter-spacing: -.016em; }
.kit-botones { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 17px; }
.kit-botones--pequenos { gap: 14px; }
.kit-botones--izquierda { justify-content: flex-start; }
.kit-enlace { color: var(--kit-azul); text-decoration: none; cursor: pointer; }
.kit-enlace::after { content: "\00a0›"; }                            /* «Más información ›» */
.kit-enlace:hover { text-decoration: underline; }                   /* subrayado al instante */
.kit-enlace--sin-flecha::after { content: none; }
@media (max-width: 734px) {
  .kit-boton { min-height: 36px; padding: 8px 15px; font: 400 14px/18px var(--kit-letra); letter-spacing: -.016em; }
  .kit-botones { gap: 14px; }
}

/* ---------- 6 · Barra global (portada, apartados 0 y 7) ----------------------------------------------- */
.kit-global { position: relative; z-index: 9999; height: 44px; }
/* El fondo translúcido va en un ::before: un backdrop-filter en la propia barra la convertiría en el marco de lo que lleva
   position: fixed dentro (el menú del móvil se quedaría en 48 px de alto) */
.kit-global::before { content: ""; position: absolute; inset: 0; z-index: 0; background: rgba(250, 251, 253, .8);
  -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px); }
.kit-global--fija { position: sticky; top: 0; }                    /* en la portada se queda fija; en una ficha se va y entra la barra local */
.kit-global__barra { position: relative; z-index: 2; max-width: 1024px; height: 100%; margin: 0 auto; padding: 0 22px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.kit-global__logo { display: inline-flex; align-items: center; height: 44px; flex: none; }
.kit-global__logo img { height: 20px; width: auto; }
.kit-global__lista { display: flex; align-items: center; justify-content: center; flex: 1; gap: 18px; }
.kit-global__enlace { display: inline-flex; align-items: center; height: 44px; padding: 0 8px; font: 400 12px/16px var(--kit-letra); letter-spacing: -.01em;
  color: rgba(21, 40, 61, .8); white-space: nowrap; transition: color 320ms var(--kit-menu); }
.kit-global__enlace:hover, .kit-global__enlace[aria-expanded="true"] { color: var(--kit-tinta); }
.kit-global__dcha { display: flex; align-items: center; gap: 8px; flex: none; }
.kit-global__hamburguesa { display: none; width: 44px; height: 44px; margin-right: -12px; align-items: center; justify-content: center; flex-direction: column; gap: 6px; }
.kit-global__hamburguesa span { display: block; width: 17px; height: 1.5px; border-radius: 1px; background: var(--kit-tinta); }
.kit-global__panel { position: absolute; z-index: 1; left: 0; right: 0; top: 0; padding-top: 44px; height: 44px; overflow: hidden; background: rgb(250, 251, 253); }
.kit-global__panel[hidden] { display: none; }
.kit-global__panel-in { max-width: 1024px; margin: 0 auto; padding: 40px 22px 84px; display: flex; gap: 88px; }
.kit-global__col { min-width: 0; }
.kit-global__titulo { font: 400 12px/16px var(--kit-letra); letter-spacing: -.01em; color: var(--kit-gris2); margin-bottom: 14px; }
.kit-global__col li + li { margin-top: 8px; }
.kit-global__grande { font: 600 24px/28px var(--kit-letra); letter-spacing: .009em; color: rgba(21, 40, 61, .92); }
.kit-global__grande:hover { color: var(--kit-azul); }
.kit-global__peq { font: 600 12px/16px var(--kit-letra); letter-spacing: -.01em; color: rgba(21, 40, 61, .8); }
.kit-global__peq:hover { color: var(--kit-azul); }
.kit-global__cortina { position: absolute; z-index: 0; left: 0; right: 0; top: 44px; height: 100vh; background: rgba(226, 231, 238, .4);
  -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity 160ms var(--kit-menu), visibility 0s linear 160ms; }
.kit-global--abierta .kit-global__cortina { opacity: 1; visibility: visible; transition: opacity 320ms var(--kit-menu) 80ms, visibility 0s; }
.kit-global__movil { position: fixed; inset: 0; z-index: 10000; background: var(--kit-blanco); overflow-y: auto; overscroll-behavior: contain; padding: 0 16px 40px; }
.kit-global__movil[hidden] { display: none; }
.kit-global__movil-cab { display: flex; align-items: center; justify-content: space-between; height: 48px; }
.kit-global__movil-cab img { height: 20px; width: auto; }
.kit-global__movil-cerrar { width: 44px; height: 44px; margin-right: -12px; display: inline-flex; align-items: center; justify-content: center; }
.kit-global__movil-lista { padding: 24px 32px 0; }
.kit-global__movil-lista li + li { margin-top: 10px; }
.kit-global__movil-lista a { font: 600 24px/28px var(--kit-letra); letter-spacing: .009em; color: var(--kit-tinta); }
html.kit-menu-abierto { overflow: hidden; }
@media (max-width: 834px) { .kit-global__lista { gap: 4px; } }
@media (max-width: 734px) {
  .kit-global { height: 48px; }
  .kit-global__barra { padding: 0 16px; }
  .kit-global__logo { height: 48px; }
  .kit-global__lista, .kit-global__oferta { display: none; }
  .kit-global__hamburguesa { display: inline-flex; }
}

/* ---------- 7 · Subnavegación fija de producto: la barra local [AL.1]-[AL.5] --------------------------- */
.kit-local { position: sticky; top: 0; z-index: 9998; height: 72px; margin-bottom: -72px; padding-top: 10px; pointer-events: none; }   /* 52 + 2 × 10; no deja hueco. Los 10 px van de relleno: como margen del hijo se escaparían fuera */
.kit-local__barra { pointer-events: auto; position: relative; width: calc(100% - 20px); max-width: 1024px; margin: 0 auto;
  border-radius: var(--kit-radio-barra); background: rgba(255, 255, 255, .8); -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px);
  box-shadow: 0 0 0 1px var(--kit-aro); transform: translateY(-72px); visibility: hidden;
  transition: transform var(--kit-barra-aparece) var(--kit-ease), visibility 0s linear var(--kit-barra-aparece),
              border-radius var(--kit-barra-abre) var(--kit-ease-out), background-color var(--kit-barra-abre) var(--kit-ease-out); }
.kit-local--visible .kit-local__barra { transform: none; visibility: visible;
  transition: transform var(--kit-barra-aparece) var(--kit-ease), visibility 0s,
              border-radius var(--kit-barra-abre) var(--kit-ease-out), background-color var(--kit-barra-abre) var(--kit-ease-out); }
.kit-local--abierta .kit-local__barra { border-radius: var(--kit-radio-barra-abierta); background-color: rgba(255, 255, 255, .97); }
.kit-local__fila { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 20px; min-height: 52px; }
.kit-local__nombre { font: 600 19px/23px var(--kit-letra); letter-spacing: .012em; color: var(--kit-tinta); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kit-local__botones { display: flex; align-items: center; gap: 10px; flex: none; }
.kit-local__conmutador { display: grid; justify-items: end; align-items: center; }
.kit-local__conmutador > * { grid-area: 1 / 1; }
.kit-local__ver, .kit-local__pedir { display: inline-flex; align-items: center; justify-content: center; height: 28px; padding: 6px 10px; border-radius: 10em;
  font: 400 12px/16px var(--kit-letra); letter-spacing: -.01em; white-space: nowrap;
  transition: font-size var(--kit-barra-abre) var(--kit-ease-out), line-height var(--kit-barra-abre) var(--kit-ease-out), padding var(--kit-barra-abre) var(--kit-ease-out), height var(--kit-barra-abre) var(--kit-ease-out), opacity 100ms linear; }
.kit-local__ver { background: rgba(255, 255, 255, .8); box-shadow: 0 0 0 1px var(--kit-gris2); color: var(--kit-tinta); }
.kit-local__ver:hover { box-shadow: 0 0 0 1px var(--kit-tinta); }
.kit-local__pedir { background: var(--kit-azul); color: var(--kit-blanco); }
.kit-local__pedir:hover { background: var(--kit-azul-hover); text-decoration: none; }
.kit-local__cerrar { width: 28px; height: 28px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--kit-velo-lleno);
  opacity: 0; visibility: hidden; transition: opacity 100ms linear, visibility 0s linear 100ms; }
.kit-local__cerrar svg { width: 10px; height: 10px; }
.kit-local--x .kit-local__ver { opacity: 0; pointer-events: none; }
.kit-local--x .kit-local__cerrar { opacity: 1; visibility: visible; transition: opacity 150ms linear 150ms, visibility 0s; }   /* entra en 0,15 s con 0,15 s de retraso; sale en 0,1 s */
.kit-local--abierta .kit-local__pedir { font-size: 17px; line-height: 20px; height: 36px; padding: 8px 14px; }       /* «Pedir oferta» crece de 12 a 17 px */
.kit-local__panel { display: grid; grid-template-rows: 0fr; transition: grid-template-rows var(--kit-barra-abre) var(--kit-ease-out); }
.kit-local--abierta .kit-local__panel { grid-template-rows: 1fr; }
.kit-local__panel-in { min-height: 0; overflow: hidden; }
.kit-local__panel-cols { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 0 40px; margin: 0 20px; padding: 4px 0 24px; border-top: 1px solid var(--kit-filete); }
.kit-local__rotulo { font: 500 12px/16px var(--kit-letra); letter-spacing: -.01em; color: var(--kit-gris2); padding: 18px 0 10px; }
.kit-local__pestanas { display: flex; flex-wrap: wrap; gap: 8px 6px; }
.kit-local__pestanas a { display: inline-flex; align-items: center; min-height: 41px; padding: 7px 14px; border-radius: 170px; font: 500 17px/25px var(--kit-letra); letter-spacing: -.022em;
  color: var(--kit-gris); transition: color .2s var(--kit-ease), background-color .2s var(--kit-ease); }
.kit-local__pestanas a:hover { color: var(--kit-tinta); }
.kit-local__pestanas a[aria-current="true"] { color: var(--kit-tinta); background: var(--kit-banda); }
.kit-local__enlaces li + li { margin-top: 2px; }
.kit-local__enlaces a { display: inline-block; padding: 7px 0; font: 500 19px/23px var(--kit-letra); letter-spacing: .012em; color: var(--kit-azul); }
.kit-local__enlaces a:hover { text-decoration: underline; }
.kit-local__capa { position: fixed; inset: 0; z-index: 9997; background: rgba(245, 247, 250, .25); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px);
  opacity: 0; visibility: hidden; transition: opacity var(--kit-barra-abre) var(--kit-ease-out), visibility 0s linear var(--kit-barra-abre); }
.kit-local__capa--visible { opacity: 1; visibility: visible; transition: opacity var(--kit-barra-abre) var(--kit-ease-out), visibility 0s; }
@media (max-width: 734px) {
  .kit-local__fila { padding: 12px 12px 12px 12px; }
  .kit-local__nombre { font-size: 17px; line-height: 21px; }
  .kit-local__panel-cols { grid-template-columns: 1fr; margin: 0 12px; }
  .kit-local__rotulo { font: 500 19px/23px var(--kit-letra); letter-spacing: .012em; padding: 14px 0 7px; }   /* «Descripción» del Air */
  .kit-local__pestanas { gap: 10px 6px; }                                                                   /* una cada 51 px */
  .kit-local__cerrar { width: 28px; height: 28px; }
}

/* ---------- 8 · Cabecera con vídeo que se ve una vez [2.1] [A1.1] --------------------------------------- */
.kit-cabecera { position: relative; display: flex; flex-direction: column; justify-content: space-between; height: calc(100svh - 44px); min-height: 700px; max-height: 1200px;
  overflow: hidden; background: var(--kit-banda); text-align: center; }
.kit-cabecera__arriba { position: relative; z-index: 3; padding: 56px 22px 0; }
/* 29-10 (David: «queda hueco» arriba): estilo.css da 120 px arriba a cada main>section; la cabecera ya trae su propio aire. */
main > section.kit-cabecera { padding-top: 0; }
.kit-cabecera__nombre { font: var(--kit-t-portada); letter-spacing: var(--kit-ls-portada); margin-top: 4px; }
.kit-cabecera__frase { font: var(--kit-t-frase); letter-spacing: var(--kit-ls-frase); margin: 12px auto 0; max-width: 820px; }
.kit-cabecera__medio { position: relative; flex: 1 1 0; min-height: 0; margin: 16px 0 8px; }
.kit-cabecera__abajo { position: relative; z-index: 3; padding: 0 22px 56px; }
.kit-cabecera__compra { display: flex; flex-direction: column; align-items: center; gap: 14px; }
.kit-cabecera__nota { margin-top: 18px; }
@media (min-width: 1441px) { .kit-cabecera { min-height: 750px; } }
@media (max-width: 734px) {
  .kit-cabecera { height: calc(100svh - 48px); min-height: 560px; max-height: 895px; }   /* tiene que caber en los 705-710 px que deja el iPhone al cargar */
  .kit-cabecera__arriba { padding: 32px 26px 0; }
  .kit-cabecera__frase { margin-top: 8px; }
  .kit-cabecera__abajo { padding: 0 0 24px; }
  .kit-cabecera__compra { width: min(360px, calc(100% - 40px)); min-height: 120px; margin: 0 auto; padding: 18px 20px; gap: 12px; justify-content: center;
    background: var(--kit-blanco); border-radius: var(--kit-radio-caja); }                                           /* caja de compra del Air: 360 × 120, radio 22 */
  .kit-cabecera__nota { margin-top: 10px; }
}

/* Vídeo que se ve una vez, con su fotograma inicial y su fotograma final [2.1] [A2.5] */
.kit-video { position: relative; overflow: hidden; }
.kit-video > video, .kit-video > img, .kit-video > picture { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; }
.kit-video > video, .kit-video img { object-fit: cover; }
.kit-video > picture > img { width: 100%; height: 100%; max-width: none; }
.kit-video--contener > video, .kit-video--contener img { object-fit: contain; }
.kit-video__inicio { z-index: 1; transition: opacity 200ms var(--kit-ease); }                          /* se va en 200 ms ease al poder reproducir */
.kit-video--listo .kit-video__inicio { opacity: 0; }
.kit-video__final { z-index: 2; opacity: 0; transition: opacity var(--kit-fotograma-final) var(--kit-ease-out); }
.kit-video--acabado .kit-video__final { opacity: 1; }                                                   /* llega en 400 ms ease-out al acabar */
.kit-galeria .kit-video__final { transition-duration: var(--kit-fotograma-tarjeta); }                   /* en las tarjetas, 200 ms */

/* ---------- 9 · Entradas de texto e imagen [2.8] [A0.2] [P9.6] [2.4] ----------------------------------- */
/* Antes de que el JS las lance, las piezas esperan abajo y transparentes. Solo si hay JS (clase kit-js, puesta en el <head>). */
.kit-js [data-kit-entrada]:not(.kit-entrada-fin) [data-kit-pieza],
.kit-js [data-kit-entrada]:not(.kit-entrada-fin):not(:has([data-kit-pieza])) > * { opacity: 0; transform: translateY(var(--kit-entrada-distancia)); }
/* Mientras dura una entrada, las piezas no llevan transiciones: así, al acabar, el paso al estado final no lanza ninguna */
.kit-entrada-viva [data-kit-pieza], .kit-entrada-viva > * { transition: none !important; }
/* Índice con cascada: esperan escondidos a su disparo (t − 70vh) */
.kit-js [data-kit-cascada]:not(.kit-cascada-fin) [data-kit-cascada-item] { opacity: 0; }
/* Imagen que se revela: sube 80 px y pasa de escala 1,2 a 1 en 1,5 s, y aparece en 0,9 s [P9.6] */
.kit-js [data-kit-revela] > * { opacity: 0; visibility: hidden; transform: translateY(80px) scale(1.2); }
.kit-js [data-kit-revela].kit-revelado > * { opacity: 1; visibility: visible; transform: none;
  transition: opacity 900ms var(--kit-revela-luz), transform 1500ms var(--kit-revela-mov), visibility 0s; }
.kit-js [data-kit-revela].kit-revelado.kit-sin-transicion > * { transition: none; }
/* Imagen que encoge al asomar: escala de 1,15 a 1 con el scroll [A5.2] (el JS pone --kit-escala) */
[data-kit-encoge] [data-kit-encoge-media] { transform: scale(var(--kit-escala, 1)); transform-origin: 50% 50%; will-change: transform; }

/* ---------- 10 · Sección fija con secuencia de imágenes en un lienzo [2.3] [P6.1]-[P6.3] ---------------- */
.kit-fija { position: relative; height: var(--kit-fija-recorrido); }               /* recorrido: 220vh; queda quieta 120vh */
.kit-fija__bloque { position: sticky; top: 0; height: max(100vh, 620px); overflow: hidden; background: var(--kit-banda); }
.kit-fija__media { position: absolute; inset: 0; background: var(--kit-banda); }
.kit-fija__media canvas { display: block; width: 100%; height: 100%; }
/* El titular va donde empezaría un bloque de 305 px centrado en la pantalla (297,5 px a 900 de alto y 387,5 a 1.080), así que
   se empieza a borrar (t − 30vh) 28 px después de quedarse quieta a 900 y 64 a 1.080 [P6.3] */
.kit-fija__texto { position: absolute; z-index: 2; top: calc(50% - 152.5px); left: 0; right: 0; width: var(--kit-ancho); max-width: var(--kit-ancho-max); margin: 0 auto; pointer-events: none; }
.kit-fija__texto > * { max-width: 52%; }
.kit-fija__texto .kit-t-antetitulo { font: 600 21px/21px var(--kit-letra); letter-spacing: .011em; margin-bottom: 20px; }
.kit-fija--suelta { height: auto; }                                                  /* sin fijar: la segunda de una página, el móvil y «reducir movimiento» */
.kit-fija--suelta .kit-fija__bloque { position: relative; top: auto; height: auto; overflow: visible; background: none; display: flex; flex-direction: column; }
.kit-fija--suelta .kit-fija__texto { order: -1; }
.kit-fija--suelta .kit-fija__texto { position: relative; top: auto; opacity: 1 !important; margin-bottom: var(--kit-cab-contenido); }
.kit-fija--suelta .kit-fija__texto > * { max-width: none; }
.kit-fija--suelta .kit-fija__media { position: relative; inset: auto; width: var(--kit-ancho); max-width: var(--kit-ancho-max); margin: 0 auto; aspect-ratio: 16 / 9;
  border-radius: var(--kit-radio); overflow: hidden; }
@media (max-width: 734px) {
  .kit-fija--suelta .kit-fija__media { aspect-ratio: 1 / 1; border-radius: var(--kit-radio); }
  .kit-fija--suelta .kit-fija__texto { padding-top: var(--kit-aire); }
}

/* ---------- 11 · Galería «Lo principal» (modo ficha) [2.2] [A2.1]-[A2.5] -------------------------------- */
.kit-galeria { position: relative; }
/* 30 px abajo: hueco para la subida de entrada, que el margen devuelve como hace Apple (padding-bottom 30 y margin-bottom −30), y 52 más
   que compensan el margen de arriba de la botonera (84 en vez de 32): ver la botonera, más abajo */
.kit-galeria__pista { position: relative; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scroll-padding-inline: var(--kit-margen);
  padding: 0 var(--kit-margen) 30px; margin-bottom: -82px; scrollbar-width: none; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; }
.kit-galeria__pista::-webkit-scrollbar { display: none; }
.kit-galeria__fila { display: flex; gap: 20px; width: max-content; }
.kit-galeria__tarjeta { position: relative; flex: none; width: min(1260px, calc(100vw * .875)); aspect-ratio: 1260 / 680; border-radius: var(--kit-radio);
  overflow: hidden; background: var(--kit-blanco); scroll-snap-align: start; isolation: isolate; }
.kit-galeria__media { position: absolute; inset: 0; z-index: 0; }
.kit-galeria__velo { position: absolute; inset: 0 0 auto 0; z-index: 3; height: 46%; background: linear-gradient(180deg, rgba(255, 255, 255, .86), rgba(255, 255, 255, 0)); pointer-events: none; }
.kit-galeria__texto { position: absolute; z-index: 4; top: 48px; left: 48px; width: 400px; max-width: calc(100% - 96px);
  font: 500 28px/32px var(--kit-letra); letter-spacing: .007em; color: rgba(21, 40, 61, .88); will-change: transform, opacity; }   /* 28/32 a 48 px de los bordes, 400 de ancho */
.kit-galeria__texto strong { color: var(--kit-tinta); font-weight: 600; }
.kit-galeria__texto span { color: var(--kit-gris); }
@media (min-width: 1441px) { .kit-galeria__texto { width: 584px; } }
/* La botonera: píldora de puntos y botón de pausa, pegada abajo mientras la galería entra [A2.4] [P2.2] [P2.5].
   Se pega cuando su borde de arriba queda 84 px por debajo del carril y se suelta al llegar a su sitio, 32 px bajo las tarjetas
   (84 − 82 + 30 del hueco): 628 px de scroll. En el Air, a 1.440, de 430 a 1.060 con el carril en 1.158 (84 y 714 px bajo él). */
.kit-galeria__mandos { position: sticky; bottom: 32px; z-index: 5; display: flex; justify-content: center; align-items: center; gap: 16px; width: max-content; max-width: calc(100vw - 40px);
  margin: 84px auto 0; opacity: 0; }
.kit-galeria--lista .kit-galeria__mandos { opacity: 1; }
.kit-galeria__puntos { position: relative; display: flex; align-items: center; height: 56px; padding: 0 16px; border-radius: 28px; overflow: hidden;
  background: var(--kit-velo-lleno); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); transition: background-color 300ms linear; }
.kit-mandos--translucido .kit-galeria__puntos, .kit-mandos--translucido .kit-galeria__pausa { background-color: var(--kit-velo); -webkit-backdrop-filter: blur(7px); backdrop-filter: blur(7px); }
.kit-galeria__punto { position: relative; display: flex; align-items: center; justify-content: center; height: 24px; flex: none; }
.kit-galeria__bolita { position: relative; display: block; width: 8px; height: 8px; margin: 0 8px; border-radius: 10px; background: var(--kit-punto); overflow: hidden; }   /* 8 × 8, uno cada 24 px */
.kit-galeria__punto[aria-current="true"] .kit-galeria__bolita { width: 48px; }                             /* el activo, 48 px (32 en el móvil) */
.kit-galeria__progreso { position: absolute; left: 0; top: 0; bottom: 0; width: 0; border-radius: 10px; background: var(--kit-tinta); }
.kit-galeria__punto[aria-current="true"] .kit-galeria__progreso { animation: kit-relleno var(--kit-galeria-espera) linear forwards; }   /* de 0 a 115 % en 6,15 s, lineal */
.kit-galeria:not(.kit-galeria--reproduce) .kit-galeria__progreso { animation-play-state: paused; }
@keyframes kit-relleno { from { width: 0; } to { width: 115%; } }
.kit-galeria__pausa { position: relative; flex: none; width: 56px; height: 56px; border-radius: 28px; display: inline-flex; align-items: center; justify-content: center;
  background: var(--kit-velo-lleno); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); color: var(--kit-tinta); transition: background-color 100ms linear; }
.kit-galeria__pausa svg { width: 14px; height: 14px; }
.kit-galeria__pausa .kit-icono-reproducir, .kit-galeria__pausa .kit-icono-repetir { display: none; }
.kit-galeria--pausada .kit-galeria__pausa .kit-icono-pausa, .kit-galeria--acabada .kit-galeria__pausa .kit-icono-pausa { display: none; }
.kit-galeria--pausada:not(.kit-galeria--acabada) .kit-galeria__pausa .kit-icono-reproducir { display: block; }
.kit-galeria--acabada .kit-galeria__pausa .kit-icono-repetir { display: block; }
/* Intro de la botonera (bola que se abre), una sola vez [A2.4]: los puntos a los 740 ms y la pausa a los 940 ms */
.kit-mandos--intro .kit-galeria__bolita { opacity: 0; }
.kit-mandos--intro .kit-galeria__pausa { opacity: 0; transform: scale(.5); }
.kit-mandos--puntos .kit-galeria__bolita { opacity: 1; transition: opacity 100ms var(--kit-ease-in); }
.kit-mandos--pausa .kit-galeria__pausa { opacity: 1; transform: none; transition: opacity 100ms var(--kit-ease-in), transform 200ms var(--kit-ease-out), background-color 100ms linear; }
@media (max-width: 1068px) { .kit-galeria__texto { width: 400px; } }
@media (max-width: 734px) {
  .kit-galeria__tarjeta { width: calc(100vw * .875 - 20px); aspect-ratio: 347.5 / 480; }         /* 347,5 × 480 a 420 */
  .kit-galeria__texto { top: 32px; left: 32px; width: auto; max-width: calc(100% - 64px); font: 500 17px/21px var(--kit-letra); letter-spacing: -.022em; }
  .kit-galeria__mandos { bottom: 20px; }
  .kit-galeria__punto[aria-current="true"] .kit-galeria__bolita { width: 32px; }
}

/* Galería en modo portada (la de Apple TV): tarjeta central de 930 × 523 a 1.440, vecinas asomando, bucle (portada, apartado 5) */
.kit-galeria--portada .kit-galeria__pista { padding: 0; margin-bottom: 0; scroll-padding-inline: 0; }
.kit-galeria--portada .kit-galeria__fila { gap: 13px; }
.kit-galeria--portada .kit-galeria__tarjeta { width: calc(930px + (100vw - 1440px) * 2 / 3); aspect-ratio: auto; height: calc(523px + (100vw - 1440px) * .302);
  border-radius: 0; background: var(--kit-banda); scroll-snap-align: center; }           /* 930 × 523 a 1.440 y 1.250 × 668 a 1.920 (con 65vw salía de 936) */
.kit-galeria--portada .kit-galeria__tarjeta img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.kit-galeria--portada .kit-galeria__texto { top: auto; bottom: 40px; left: 48px; width: auto; max-width: calc(100% - 96px); display: flex; flex-direction: column; align-items: flex-start; gap: 16px;
  font: 400 21px/25px var(--kit-letra); letter-spacing: .011em; color: var(--kit-tinta); opacity: .36; transition: opacity 400ms var(--kit-ease); will-change: auto; }
.kit-galeria--portada .kit-galeria__tarjeta.kit-actual .kit-galeria__texto { opacity: 1; }                       /* las vecinas, al 36 % */
.kit-galeria--portada .kit-galeria__puntos-fila { position: relative; display: flex; justify-content: center; align-items: center; height: 48px; padding: 12px 12px; }
.kit-galeria--portada .kit-galeria__puntos { height: 24px; padding: 0; background: none; backdrop-filter: none; -webkit-backdrop-filter: none; overflow: visible; }
.kit-galeria--portada .kit-galeria__punto { width: 24px; transition: width 250ms linear; }
.kit-galeria--portada .kit-galeria__bolita { margin: 0; background: var(--kit-punto-portada); transition: width 250ms var(--kit-ease-out); }
.kit-galeria--portada .kit-galeria__punto[aria-current="true"] { width: 48px; }
.kit-galeria--portada .kit-galeria__punto[aria-current="true"] .kit-galeria__bolita { width: 32px; transition-timing-function: var(--kit-ease-in); }
.kit-galeria--portada .kit-galeria__punto[aria-current="true"] .kit-galeria__progreso { animation: kit-relleno-portada var(--kit-portada-relleno) linear var(--kit-portada-relleno-retraso) forwards; }
@keyframes kit-relleno-portada { from { width: 0; } to { width: 100%; } }
.kit-galeria--portada .kit-galeria__punto:hover .kit-galeria__bolita { background: rgba(21, 40, 61, .64); transition: background-color 120ms linear; }
.kit-galeria--portada .kit-galeria__pausa { position: absolute; right: 12px; top: 12px; width: 24px; height: 24px; border-radius: 50%; background: var(--kit-flecha); color: rgba(21, 40, 61, .48);
  backdrop-filter: none; -webkit-backdrop-filter: none; }
.kit-galeria--portada .kit-galeria__pausa svg { width: 8px; height: 8px; }
.kit-galeria--portada .kit-galeria__pausa:hover { background: var(--kit-flecha-hover); }
@media (min-width: 1441px) { .kit-galeria--portada .kit-galeria__texto { left: 70px; bottom: 58px; } }
@media (max-width: 734px) {
  .kit-galeria--portada .kit-galeria__tarjeta { width: calc(100vw * .875 - 20px); height: auto; aspect-ratio: auto; display: flex; flex-direction: column; }   /* derivado: Apple no se midió en el móvil */
  .kit-galeria--portada .kit-galeria__tarjeta img { position: relative; inset: auto; height: auto; aspect-ratio: 4 / 3; }
  .kit-galeria--portada .kit-galeria__texto { position: relative; top: auto; bottom: auto; left: auto; max-width: none; padding: 4px 24px 24px; font: 400 17px/21px var(--kit-letra); letter-spacing: -.022em; gap: 12px; }
}

/* ---------- 12 · Galería pequeña con flechas [2.11a] [A7.7]-[A7.9] ------------------------------------- */
.kit-galeria-p { position: relative; }
.kit-galeria-p__pista { position: relative; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scroll-padding-inline: var(--kit-margen); padding: 10px var(--kit-margen) 30px; margin: -10px 0 -30px;
  scrollbar-width: none; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; }
.kit-galeria-p__pista::-webkit-scrollbar { display: none; }
.kit-galeria-p__fila { display: flex; gap: 20px; width: max-content; }
.kit-galeria-p__tarjeta { flex: none; width: 372px; scroll-snap-align: start; }
.kit-galeria-p__tarjeta--ancha { width: 696px; }
.kit-galeria-p__foto { height: 450px; border-radius: var(--kit-radio); overflow: hidden; background: var(--kit-banda); }
.kit-fondo-gris .kit-galeria-p__foto { background: var(--kit-blanco); }
.kit-galeria-p__foto img { width: 100%; height: 100%; object-fit: cover; }
.kit-galeria-p__pie { padding: 28px 15px 0; font: var(--kit-t-pie); letter-spacing: var(--kit-ls-pie); color: var(--kit-gris); max-width: 480px; }
.kit-galeria-p__pie strong { color: var(--kit-tinta); font-weight: 500; }
.kit-galeria-p__flechas { width: var(--kit-ancho); max-width: var(--kit-ancho-max); margin: 0 auto; padding-top: 48px; display: flex; justify-content: flex-end; gap: 18px; }
.kit-galeria-p--cabe .kit-galeria-p__flechas { visibility: hidden; }
.kit-flecha { width: 36px; height: 36px; border-radius: 36px; display: inline-flex; align-items: center; justify-content: center; background: var(--kit-flecha); color: var(--kit-flecha-icono);
  transition: background-color var(--kit-flecha-t) linear, color var(--kit-flecha-t) linear, opacity var(--kit-flecha-t) linear; }
.kit-flecha svg { width: 14px; height: 14px; }
.kit-flecha:hover { background: var(--kit-flecha-hover); color: rgba(21, 40, 61, .64); }
.kit-flecha:active { background: var(--kit-flecha-pulsada); color: rgba(21, 40, 61, .64); }
.kit-flecha:disabled { opacity: .42; pointer-events: none; cursor: default; }                              /* la apagada no desaparece: 0,42 */
@media (max-width: 734px) {
  .kit-galeria-p__tarjeta, .kit-galeria-p__tarjeta--ancha { width: 260px; }                                 /* todas de 260, paso de 280 */
  .kit-galeria-p__foto { height: 314px; }
  .kit-galeria-p__pie { padding-top: 24px; }
  .kit-galeria-p__flechas { padding-top: 40px; }
}

/* ---------- 13 · Tarjetas: bloque a todo el ancho, dos y tres por fila (portada, «Medidas fijas») -------- */
.kit-mosaico { display: grid; gap: var(--kit-mosaico-hueco); padding-bottom: var(--kit-mosaico-hueco); background: var(--kit-blanco); }
.kit-mosaico__fila { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--kit-mosaico-hueco); padding-inline: var(--kit-mosaico-hueco); }
.kit-mosaico__fila--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }                                 /* derivada: 464 px a 1.440 */
.kit-franja, .kit-tesela { position: relative; display: flex; flex-direction: column; align-items: center; overflow: hidden; text-align: center; background: var(--kit-banda); color: var(--kit-tinta); }
.kit-franja { min-height: 692px; padding: 56px 22px 0; }                                                     /* alto fijo de 692, no 100vh */
.kit-tesela { min-height: 580px; padding: 53px 22px 0; }
.kit-franja__titulo { font: 600 56px/60px var(--kit-letra); letter-spacing: -.005em; }
.kit-franja__frase { font: 400 28px/32px var(--kit-letra); letter-spacing: .007em; margin-top: 6px; }
.kit-franja__dato { font: 400 19px/23px var(--kit-letra); letter-spacing: .012em; color: var(--kit-gris); margin-top: 9px; max-width: 515px; }
.kit-franja .kit-botones { margin-top: 17px; gap: 17px; }
.kit-tesela__titulo { font: 600 40px/44px var(--kit-letra); letter-spacing: 0; max-width: 545px; }
.kit-tesela__titulo--largo { font-size: 38px; line-height: 41.8px; }
.kit-tesela__frase { font: 400 21px/25px var(--kit-letra); letter-spacing: .011em; margin-top: 3px; }
.kit-tesela .kit-botones { margin-top: 12px; gap: 14px; }
.kit-franja__foto, .kit-tesela__foto { position: relative; flex: 1 1 0; min-height: 0; width: 100%; }
.kit-franja__foto { margin-top: 45px; }
.kit-tesela__foto { margin: 36px 0 30px; }
.kit-franja__foto img, .kit-tesela__foto img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: contain; object-position: 50% 100%; }
.kit-pieza-enlace { position: absolute; inset: 0; z-index: 1; }                                             /* toda la pieza es un enlace… */
.kit-franja .kit-botones, .kit-tesela .kit-botones { position: relative; z-index: 2; }                       /* …y los botones van encima */
@media (max-width: 1068px) {
  .kit-franja { min-height: 650px; }
  .kit-tesela { min-height: 490px; }
  .kit-franja__titulo { font-size: 48px; line-height: 52px; letter-spacing: -.003em; }
  .kit-tesela__titulo, .kit-tesela__titulo--largo { font-size: 32px; line-height: 36px; letter-spacing: .004em; }
  .kit-mosaico__fila--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kit-mosaico__fila--3 > :last-child:nth-child(3) { grid-column: 1 / -1; }                                 /* 2 + 1 */
}
@media (max-width: 734px) {
  .kit-mosaico__fila, .kit-mosaico__fila--3 { grid-template-columns: 1fr; padding-inline: 0; }                /* a sangre, una columna */
  .kit-franja, .kit-tesela { min-height: 500px; padding: 39px 26px 0; }
  .kit-franja__titulo, .kit-tesela__titulo, .kit-tesela__titulo--largo { font-size: 32px; line-height: 36px; letter-spacing: .002em; }
  .kit-franja__frase, .kit-tesela__frase { font: 400 19px/23px var(--kit-letra); letter-spacing: .012em; margin-top: 4px; }
  .kit-franja__dato { font-size: 17px; line-height: 21px; letter-spacing: -.022em; margin-top: 6px; }
  .kit-franja .kit-botones, .kit-tesela .kit-botones { margin-top: 11px; gap: 14px; }
  .kit-franja__foto, .kit-tesela__foto { margin: 40px 0 10px; }
}

/* Tarjetas de ficha (radio 28, sin sombra), de dos y de tres por fila [2.11f] [A10.3] [P15.3] */
.kit-tarjetas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--kit-hueco-fila) var(--kit-hueco-col); }
.kit-tarjetas--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.kit-tarjeta { position: relative; display: flex; flex-direction: column; min-height: 544px; padding: 32px 32px 0; border-radius: var(--kit-radio); overflow: hidden;
  background: var(--kit-blanco); transition: transform var(--kit-hover-t) var(--kit-hover); }
.kit-fondo-blanco .kit-tarjeta, .kit-tarjeta--gris { background: var(--kit-banda); }
.kit-tarjeta__etiqueta { font: 600 17px/21px var(--kit-letra); letter-spacing: -.022em; color: var(--kit-gris); }
.kit-tarjeta__titulo { font: var(--kit-t-tarjeta); letter-spacing: var(--kit-ls-tarjeta); margin-top: 8px; }
.kit-tarjeta__texto { font: var(--kit-t-tarjeta-texto); letter-spacing: var(--kit-ls-tarjeta-texto); color: var(--kit-gris); margin-top: 13.6px; }
.kit-tarjeta .kit-enlace { position: relative; z-index: 2; display: inline-block; margin-top: 14px; font: 400 17px/21px var(--kit-letra); }
.kit-tarjeta__foto { position: relative; margin: auto -32px 0; padding-top: 24px; }
.kit-tarjeta__foto img { width: 100%; height: auto; aspect-ratio: 372 / 284; object-fit: cover; object-position: 50% 62%; }   /* foto de 372 × 284, pegada abajo [2.11f] */
@media (hover: hover) and (pointer: fine) { .kit-tarjeta--hover:hover { transform: scale(var(--kit-escala-hover, 1.016)); } }   /* 6 px más ancha en 300 ms */
@media (max-width: 1068px) { .kit-tarjetas { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 734px) {
  .kit-tarjetas, .kit-tarjetas--2 { grid-template-columns: 1fr; }
  .kit-tarjeta { min-height: 0; padding: 24px 24px 0; }
  .kit-tarjeta__etiqueta { font-size: 14px; line-height: 18px; letter-spacing: -.016em; }
  .kit-tarjeta__foto { margin-inline: -24px; }
}

/* ---------- 14 · Cifras: rejilla y columna de la «mesa giratoria» [2.4] [P6.4] [A5.4] ------------------- */
.kit-cifras { display: grid; grid-template-columns: repeat(4, minmax(0, 210px)); justify-content: center; gap: 40px 48px; }
.kit-cifra__etiqueta { display: block; font: var(--kit-t-etiqueta); letter-spacing: var(--kit-ls-etiqueta); color: var(--kit-gris); }
.kit-cifra__valor { display: block; font: var(--kit-t-cifra); letter-spacing: var(--kit-ls-cifra); color: var(--kit-tinta); margin-top: 4px; white-space: nowrap; }
.kit-cifra__nota { display: block; font: var(--kit-t-etiqueta); letter-spacing: var(--kit-ls-etiqueta); color: var(--kit-gris); margin-top: 6px; }
.kit-fuente { margin-top: 40px; text-align: center; }
.kit-mesa { position: relative; width: var(--kit-ancho); max-width: var(--kit-ancho-max); margin: 0 auto; display: flex; justify-content: center; }
.kit-mesa__media { width: 420px; flex: none; }
.kit-mesa__media img { width: 100%; height: auto; border-radius: var(--kit-radio); }
.kit-mesa__datos { position: absolute; top: 50%; left: calc(50% + 257px); width: 200px; transform: translateY(-50%); display: grid; gap: 84px; }   /* columna de 200 px a la derecha [A5.4] */
.kit-mesa__dato { font: 400 19px/23px var(--kit-letra); letter-spacing: .012em; color: var(--kit-gris); }
.kit-mesa__dato strong { display: block; font: 500 21px/25px var(--kit-letra); letter-spacing: .011em; color: var(--kit-tinta); }
@media (max-width: 1068px) {
  .kit-mesa { flex-direction: column; align-items: center; }
  .kit-mesa__datos { position: static; transform: none; width: min(100%, 640px); margin-top: 64px; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 50px 20px; }
}
@media (max-width: 734px) {
  .kit-cifras { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px 20px; justify-content: stretch; }
  .kit-mesa__media { width: min(300px, 82%); }
  .kit-mesa__datos { margin-top: 48px; gap: 50px 20px; }
  .kit-mesa__dato { font-size: 17px; line-height: 21px; letter-spacing: -.022em; }
  .kit-mesa__dato strong { font-size: 17px; line-height: 21px; letter-spacing: -.022em; font-weight: 600; }
}

/* ---------- 15 · Píldora flotante «Pedir oferta» [2.11b] [A11.5] [A11.6] -------------------------------- */
.kit-pildora-zona { position: absolute; inset: 0; z-index: 9995; display: flex; align-items: flex-end; justify-content: center; pointer-events: none; overflow: clip; }
.kit-pildora { position: sticky; bottom: 32px; margin: 32px 0 100px; pointer-events: auto; display: inline-flex; align-items: center; height: 56px; border-radius: 28px;
  background: var(--kit-velo); -webkit-backdrop-filter: blur(7px); backdrop-filter: blur(7px); color: var(--kit-tinta); text-decoration: none; }
.kit-pildora__texto { margin: 0 62px 0 24px; padding: 15px 0 16px; font: 600 17px/21px var(--kit-letra); letter-spacing: -.022em; white-space: nowrap; }
.kit-pildora__icono { position: absolute; right: 10px; top: 10px; width: 36px; height: 36px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
  background: var(--kit-azul); color: rgba(255, 255, 255, .8); transition: color 200ms var(--kit-ease); }
.kit-pildora__icono svg { width: 14px; height: 14px; }
.kit-pildora:hover .kit-pildora__icono { color: var(--kit-blanco); }
.kit-js .kit-pildora { opacity: 0; }                                              /* espera a su entrada con muelle */
.kit-js .kit-pildora.kit-pildora--lista { opacity: 1; }
.kit-pildora--lista .kit-pildora__texto { opacity: 0; }
.kit-pildora--texto .kit-pildora__texto { opacity: 1; transition: opacity 380ms var(--kit-ease-in-out); }
@media (max-width: 734px) {
  .kit-pildora { bottom: 20px; }
  .kit-pildora__texto { padding: 9px 0 11px; margin: 0 62px 0 20px; font: 600 14px/18px var(--kit-letra); letter-spacing: -.016em; }
}

/* ---------- 16 · Índice con cascada, para el pie [2.11e] [A15.2] [P20.2] -------------------------------- */
.kit-indice { padding-block: var(--kit-aire); background: #FAFBFD; }
.kit-indice__titular { margin-bottom: 56px; }
.kit-indice__cols { display: flex; }
.kit-indice__col { flex: 0 1 25%; min-width: 0; padding-right: 44px; }
.kit-indice__col:first-child { flex: 0 0 342px; max-width: 50%; padding-right: 88px; }
.kit-indice__titulo { font: 400 17px/21px var(--kit-letra); letter-spacing: -.022em; color: var(--kit-gris2); margin-bottom: 14px; }
.kit-indice__grande { display: inline-block; font: 600 28px/32px var(--kit-letra); letter-spacing: .007em; color: rgba(21, 40, 61, .92); padding: 5.5px 0; }   /* uno cada 43 px */
.kit-indice__normal { display: inline-block; font: 600 17px/21px var(--kit-letra); letter-spacing: -.022em; color: rgba(21, 40, 61, .92); padding: 7px 0; }   /* uno cada 35 px */
.kit-indice__grande:hover, .kit-indice__normal:hover { color: var(--kit-azul); }
.kit-indice__legal { margin-top: 56px; padding-top: 16px; border-top: 1px solid var(--kit-filete); }
@media (max-width: 734px) {
  .kit-indice__cols { flex-direction: column; gap: 26px; }
  .kit-indice__col, .kit-indice__col:first-child { flex: none; max-width: none; padding-right: 0; }
  .kit-indice__titulo { font-size: 14px; line-height: 18px; letter-spacing: -.016em; }
  .kit-indice__grande { font-size: 21px; line-height: 25px; letter-spacing: .011em; padding: 4px 0; }   /* uno cada 33 */
  .kit-indice__normal { font-size: 14px; line-height: 18px; letter-spacing: -.016em; padding: 5.5px 0; } /* uno cada 29 */
}

/* ---------- 17 · Reducir movimiento: todas las duraciones a 0 y el estado final (Apple hace lo mismo) ----- */
@media (prefers-reduced-motion: reduce) {
  .kit *, .kit *::before, .kit *::after { transition-duration: 0s !important; transition-delay: 0s !important; animation-duration: 0s !important; animation-delay: 0s !important; }
  .kit-js [data-kit-entrada] [data-kit-pieza], .kit-js [data-kit-entrada] > * { opacity: 1 !important; transform: none !important; }
  .kit-js [data-kit-revela] > * { opacity: 1 !important; visibility: visible !important; transform: none !important; }
  .kit-js .kit-pildora { opacity: 1 !important; }
}
.kit-reducir *, .kit-reducir *::before, .kit-reducir *::after { transition-duration: 0s !important; transition-delay: 0s !important; animation-duration: 0s !important; animation-delay: 0s !important; }
.kit-reducir.kit-js [data-kit-entrada] [data-kit-pieza], .kit-reducir.kit-js [data-kit-entrada] > * { opacity: 1 !important; transform: none !important; }
.kit-reducir.kit-js [data-kit-revela] > * { opacity: 1 !important; visibility: visible !important; transform: none !important; }
.kit-reducir.kit-js .kit-pildora { opacity: 1 !important; }