/* IM Gender · formación. Informe impreso a dos tintas: cobalto sobre arena. */

:root {
  --bg: #e6dbc7;
  --surface: #ddd0b9;
  --surface-2: #d0c0a3;
  --ink: #062b8a;
  --muted: #2f4f9c;
  --accent: #062b8a;
  --accent-ink: #e6dbc7;
  --field: #062b8a;
  --field-ink: #e6dbc7;

  --step-small: clamp(0.8125rem, 0.79rem + 0.1vw, 0.875rem);
  --step-body: clamp(1.125rem, 1.05rem + 0.3vw, 1.3125rem);
  --step-lead: clamp(1.25rem, 1.1rem + 0.7vw, 1.625rem);
  --step-head: clamp(2rem, 1.3rem + 3.2vw, 4rem);
  --step-giant: clamp(4.5rem, 1rem + 11vw, 11.5rem);

  --margin: clamp(16px, 2.2vw, 32px);
  --axis: 42%;
  --gap-section: clamp(96px, 12vw, 200px);
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: "STIX Two Text", "Times New Roman", serif;
  font-size: var(--step-body);
  line-height: 1.45;
  font-feature-settings: "kern", "liga", "onum";
  text-rendering: optimizeLegibility;
}
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
::selection { background: var(--ink); color: var(--bg); }
:focus-visible { outline: 3px solid var(--ink); outline-offset: 3px; }
.campo :focus-visible, .pie :focus-visible, .programa :focus-visible, .cierre :focus-visible, .plan-b :focus-visible, .tile-oscuro :focus-visible { outline-color: var(--field-ink); }

h1, h2, h3 { font-weight: 400; letter-spacing: -0.026em; line-height: 1.05; margin: 0; text-wrap: balance; }
p { margin: 0; }
.cifra { font-variant-numeric: lining-nums tabular-nums; }

.salto { position: absolute; left: -9999px; }
.salto:focus { left: var(--margin); top: 8px; z-index: 50; background: var(--ink); color: var(--bg); padding: 8px 14px; }

/* ---------- Botones: un solo bloque rectangular ---------- */
.boton {
  display: inline-flex; align-items: center; justify-content: space-between; gap: 24px;
  background: var(--accent); color: var(--accent-ink);
  font: 600 var(--step-small)/1 "STIX Two Text", serif; letter-spacing: 0.01em;
  text-decoration: none; padding: 18px 22px; min-height: 56px; border: 0; cursor: pointer;
  transition: transform .35s var(--ease), background-color .25s;
}
.boton span[aria-hidden] { transition: transform .35s var(--ease); }
.boton:hover span[aria-hidden] { transform: translateX(6px); }
.boton:active { transform: scale(0.98); }
.boton.claro { background: var(--surface-2); color: var(--ink); }
.campo .boton { background: var(--field-ink); color: var(--field); }

/* ---------- Tablero de portada ---------- */
.tablero {
  display: grid; gap: 8px; padding: 8px; min-height: 100svh;
  grid-template-rows: 60px 1fr 1fr;
  grid-template-columns: 1fr 1fr;
}
.tablero > * { margin: 0; }
.barra { grid-column: 1 / -1; display: grid; grid-template-columns: 60px 1fr auto; gap: 8px; }
.barra .marca { background: var(--ink); color: var(--bg); display: grid; place-items: center; font-weight: 600; font-size: 1.05rem; letter-spacing: -0.02em; text-decoration: none; }
.barra nav { background: var(--surface); display: flex; align-items: center; padding-left: calc(50vw - 76px); gap: clamp(14px, 2vw, 32px); overflow: hidden; }
.barra nav a { font-size: var(--step-small); text-decoration: none; white-space: nowrap; }
.barra nav a:hover { text-decoration: underline; text-underline-offset: 4px; }
.barra .accion { background: var(--ink); color: var(--bg); display: flex; align-items: center; padding: 0 22px; font-size: var(--step-small); font-weight: 600; text-decoration: none; gap: 16px; }
.barra .accion:hover span { transform: translateX(4px); }
.barra .accion span { transition: transform .3s var(--ease); }

.tile { position: relative; overflow: hidden; }
.tile-nombre { background: var(--bg); padding: 24px; display: flex; flex-direction: column; justify-content: flex-end; }
.tile-nombre h1 { font-size: min(var(--step-giant), 7.6vw); letter-spacing: -0.05em; line-height: 0.86; }
.tile-nombre p { margin-top: 18px; font-size: var(--step-lead); max-width: 30ch; }
.tile-foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.05); }
.tile-pareja { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.tile-pareja > p { padding: 24px; font-size: var(--step-lead); line-height: 1.25; }
.tile-oscuro { background: var(--ink); color: var(--bg); }
.tile-acento { background: var(--surface-2); color: var(--ink); }

.tile-nombre h1 .h1-sub { display: block; font-size: var(--step-lead); letter-spacing: -0.01em; line-height: 1.2; margin-top: 18px; max-width: 26ch; }

/* ---------- Bloques de página ---------- */
.marco { padding-inline: var(--margin); }
.seccion { padding-block: var(--gap-section) 0; }
.seccion:last-of-type { padding-bottom: var(--gap-section); }

/* Intro: título, nota y fila de datos */
.intro-fila { display: grid; grid-template-columns: repeat(12, 1fr); column-gap: 24px; align-items: end; }
.intro-fila h2 { grid-column: 1 / 7; font-size: clamp(2.75rem, 5vw, 4.75rem); }
.intro-fila .nota { grid-column: 10 / 13; font-size: 1.0625rem; }
.datos { display: flex; justify-content: space-between; gap: 32px; margin-top: 120px; flex-wrap: wrap; }
.datos div { min-width: 0; }
.datos strong { display: block; font-weight: 400; font-size: clamp(1.75rem, 3vw, 2.75rem); line-height: 1.05; letter-spacing: -0.02em; }
.datos span { display: block; margin-top: 8px; font-size: var(--step-small); color: var(--muted); max-width: 22ch; }

/* Mosaico de piezas distintas */
.mosaico { display: grid; grid-template-columns: repeat(12, 1fr); grid-auto-rows: 96px; gap: 8px; }
.pieza { padding: 24px; overflow: hidden; position: relative; }
.pieza h2 { font-size: clamp(2.25rem, 4vw, 3.75rem); }
.pieza h3 { font-size: 1.375rem; letter-spacing: -0.01em; font-weight: 600; margin-bottom: 10px; }
.pieza p { font-size: 1.0625rem; max-width: 46ch; }
.pieza .grande { font-size: clamp(1.5rem, 2.2vw, 1.875rem); line-height: 1.2; letter-spacing: -0.01em; }
.pieza .cifra-xl { font-size: clamp(3.5rem, 6vw, 6rem); line-height: 0.9; letter-spacing: -0.04em; display: block; margin-bottom: 12px; }
.pieza img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.05); }
.p-6x5 { grid-column: span 6; grid-row: span 5; }
.p-6x3 { grid-column: span 6; grid-row: span 3; }
.p-3x3 { grid-column: span 3; grid-row: span 3; }
.p-3x2 { grid-column: span 3; grid-row: span 2; }
.p-6x2 { grid-column: span 6; grid-row: span 2; }
.mosaico { grid-auto-flow: dense; }
.f-0 { background: var(--surface); }
.f-1 { background: var(--surface-2); }
.f-2 { background: var(--ink); color: var(--bg); }

/* Lámina cuadrada con texto: el registro quirúrgico */
.lamina { display: grid; grid-template-columns: 1fr 1fr; min-height: 88svh; background: var(--surface); }
.lamina-foto { padding: 40px; display: grid; place-items: center; }
.lamina-foto img { width: 100%; aspect-ratio: 1; object-fit: cover; filter: grayscale(1) contrast(1.05); }
.lamina-texto { padding: 40px 40px 40px 0; display: flex; flex-direction: column; justify-content: space-between; gap: 40px; }
.pestanas { display: flex; gap: 28px; flex-wrap: wrap; }
.pestanas button {
  font: inherit; font-size: 1.125rem; background: none; border: 0; padding: 4px 0; cursor: pointer;
  color: var(--muted); text-decoration: none;
}
.pestanas button[aria-pressed="true"] { color: var(--ink); font-weight: 600; text-decoration: underline; text-decoration-thickness: 3px; text-underline-offset: 8px; }
.pestanas button:hover { color: var(--ink); }
.lamina-texto h2 { font-size: clamp(2rem, 3vw, 2.5rem); font-weight: 600; }
.lamina-texto .desc { margin-top: 24px; max-width: 40ch; }
.registro { width: 100%; border-collapse: collapse; margin-top: 28px; font-size: 1.0625rem; }
.registro th, .registro td { text-align: left; padding: 10px 0; border-bottom: 1px solid rgba(6, 43, 138, 0.22); font-weight: 400; }
.registro td { text-align: right; font-variant-numeric: lining-nums tabular-nums; }
.registro tfoot th, .registro tfoot td { font-weight: 600; border-bottom: 0; padding-top: 16px; }
.registro td b { display: inline-block; min-width: 3ch; transition: transform .45s var(--ease); }
.registro.cambia td b { transform: translateY(-3px); }
.cuenta { margin-top: 20px; font-size: 1.0625rem; }
.cuenta strong { font-weight: 600; }
.acciones-dos { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.acciones-dos .boton { min-height: 72px; }

/* Retratos de la dirección */
.retratos { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 56px; }
.retratos figure { margin: 0; }
.retratos img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; filter: grayscale(1) contrast(1.05); }
.retratos figcaption { margin-top: 12px; font-size: 1.0625rem; }

/* El programa del curso: página de color con el parte de cada día */
.programa { background: var(--field); color: var(--field-ink); padding: clamp(56px, 8vw, 120px) var(--margin); }
.programa-cab { display: grid; grid-template-columns: var(--axis) 1fr; column-gap: 24px; align-items: end; }
.programa-cab h2 { font-size: var(--step-head); }
.programa-cab p { max-width: 46ch; font-size: 1.125rem; }
.pestanas-claras { margin-top: 56px; gap: 8px; display: grid; grid-template-columns: repeat(4, 1fr); }
.pestanas-claras button { color: var(--field-ink); background: rgba(230, 219, 199, 0.12); padding: 18px 16px; text-align: left; font-size: 1.0625rem; line-height: 1.25; text-decoration: none; transition: background-color .25s; }
.pestanas-claras button:hover { background: rgba(230, 219, 199, 0.22); color: var(--field-ink); }
.pestanas-claras button[aria-pressed="true"] { background: var(--field-ink); color: var(--field); text-decoration: none; }
.parte { margin-top: 8px; background: rgba(230, 219, 199, 0.08); }
.parte.entra { animation: entra .6s var(--ease); }
@keyframes entra { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.parte table { width: 100%; border-collapse: collapse; }
.parte th, .parte td { text-align: left; vertical-align: top; padding: 20px 16px; border-bottom: 1px solid rgba(230, 219, 199, 0.18); font-weight: 400; }
.parte th { width: 120px; font-size: var(--step-lead); font-variant-numeric: lining-nums tabular-nums; }
.parte td strong { display: block; font-size: var(--step-lead); font-weight: 400; letter-spacing: -0.01em; line-height: 1.2; }
.parte td span { display: block; margin-top: 6px; font-size: 1.0625rem; max-width: 70ch; }
.parte td:last-child { width: 90px; text-align: right; font-weight: 600; font-size: 1rem; }
.parte tr.vivo { background: rgba(230, 219, 199, 0.12); }
.parte tr.pausa td strong, .parte tr.pausa th { font-size: 1.0625rem; }
.celda .palabra.palabra-m { font-size: clamp(1.5rem, 2.5vw, 2.5rem); line-height: 1; hyphens: manual; }

/* Lado y párrafo: requisitos */
.lado { display: grid; grid-template-columns: 160px 1fr; column-gap: calc(34% - 160px - var(--margin)); row-gap: 120px; }
.lado h2 { grid-column: 2; font-size: var(--step-head); margin-bottom: -80px; }
.lado dl { margin: 0; display: grid; gap: 20px; font-size: var(--step-small); align-content: start; }
.lado dt { color: var(--muted); }
.lado dd { margin: 2px 0 0; }
.lado .parrafo { font-size: clamp(1.25rem, 1.7vw, 1.625rem); line-height: 1.35; max-width: 62ch; }
.lado .rotulo { font-size: var(--step-small); font-weight: 600; }
.listas { display: grid; grid-template-columns: repeat(2, minmax(0, 300px)); gap: 64px; }
.listas h3 { font-size: 1.125rem; font-weight: 600; margin-bottom: 14px; letter-spacing: 0; }
.listas ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; font-size: 1.0625rem; }

/* Muro de palabras y fotos */
.muro { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; padding-inline: 8px; }
.celda { aspect-ratio: 1; padding: 20px; position: relative; display: grid; place-items: center; overflow: hidden; text-align: center; }
.celda .palabra { position: relative; z-index: 1; font-size: clamp(2.75rem, 6vw, 6rem); letter-spacing: -0.04em; line-height: 0.9; max-width: 92%; }
.celda .pie-celda { position: absolute; left: 16px; right: 16px; bottom: 18px; font-size: var(--step-small); }
.celda img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.05); transition: transform 1.2s var(--ease); }
.celda:hover img { transform: scale(1.04); }
.celda.foto .pie-celda { color: var(--bg); background: var(--ink); left: 0; right: auto; bottom: 0; padding: 8px 12px; }
.celda.c-a { background: var(--surface); }
.celda.c-b { background: var(--ink); color: var(--bg); }
.celda.c-c { background: var(--surface-2); }
.celda .detalle { position: absolute; inset: auto 16px 48px; font-size: 1rem; line-height: 1.35; opacity: 0; transform: translateY(8px); transition: opacity .35s, transform .45s var(--ease); }
.celda:hover .detalle, .celda:focus-within .detalle { opacity: 1; transform: none; }
.encabezado-muro { padding-inline: var(--margin); margin-bottom: 40px; display: grid; grid-template-columns: var(--axis) 1fr; }
.encabezado-muro h2 { font-size: var(--step-head); grid-column: 2; }
.encabezado-muro p { grid-column: 2; margin-top: 20px; max-width: 52ch; }

/* Muchos en uno: admisión */
.fases-cab { display: grid; grid-template-columns: repeat(12, 1fr); column-gap: 24px; }
.fases-cab h2 { grid-column: 1 / 6; font-size: clamp(2.25rem, 4vw, 3.75rem); }
.fases-cab p { grid-column: 1 / 6; margin-top: 20px; font-size: 1.0625rem; max-width: 40ch; }
.diagrama { width: 100%; height: auto; margin-top: 56px; display: block; }
.diagrama rect { transition: transform 1.4s var(--ease); }
.fases { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin: 32px 0 0; padding: 0; list-style: none; }
.fases li strong { display: block; font-size: 1.25rem; font-weight: 600; margin-bottom: 8px; }
.fases li p { font-size: 1rem; max-width: 38ch; }

/* Dos campos de precio */
.precios { display: grid; grid-template-columns: 5fr 7fr; min-height: 90svh; }
.plan { padding: 40px; display: flex; flex-direction: column; }
.plan h2 { font-size: clamp(2.25rem, 4.6vw, 4.5rem); }
.plan > p { margin-top: 18px; max-width: 30ch; font-size: 1.125rem; }
.plan .incluye { margin-top: 28px; max-width: 42ch; font-size: 1.0625rem; }
.plan .pie-plan { margin-top: auto; padding-top: 48px; display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.plan .precio { font-size: clamp(3.5rem, 9vw, 9rem); line-height: 0.85; letter-spacing: -0.045em; }
.plan .precio small { font-size: 1.125rem; letter-spacing: 0; margin-left: 10px; }
.plan-a { background: var(--surface-2); }
.plan-b { background: var(--field); color: var(--field-ink); }

/* Tira de fotos y campo final */
.tira { display: grid; grid-template-columns: repeat(3, 1fr); overflow: hidden; }
.tira img { width: 100%; height: 40svh; object-fit: cover; filter: grayscale(1) contrast(1.05); }
.cierre { background: var(--field); color: var(--field-ink); min-height: 44svh; padding: 56px var(--margin); display: grid; grid-template-columns: repeat(12, 1fr); column-gap: 24px; position: relative; }
.cierre h2 { grid-column: 1 / 9; font-size: var(--step-head); line-height: 1.05; }
.cierre h2 a { text-decoration: underline; text-decoration-thickness: 4px; text-underline-offset: 6px; }
.cierre h2 a:hover { text-decoration-thickness: 6px; }
.cierre .lineas { grid-column: 1 / 8; margin-top: 32px; font-size: 1.0625rem; }
.cierre figure { grid-column: 11 / 13; grid-row: 1 / 3; align-self: end; justify-self: end; margin: 0; width: min(150px, 100%); }
.cierre figure img { aspect-ratio: 4 / 5; object-fit: cover; width: 100%; filter: grayscale(1) contrast(1.05); }
.cierre figcaption { font-size: var(--step-small); margin-top: 8px; }

/* Pie: el nombre primero */
.pie { background: var(--field); color: var(--field-ink); padding: 40px var(--margin) 32px; overflow: hidden; }
.pie .nombre { font-size: clamp(3.5rem, 15vw, 15rem); letter-spacing: -0.055em; line-height: 0.8; margin: 0 0 72px; white-space: nowrap; }
.pie .fila { display: grid; grid-template-columns: repeat(12, 1fr); column-gap: 24px; }
.pie .lugares { grid-column: 1 / 6; display: grid; gap: 10px; font-size: clamp(1.5rem, 2.4vw, 2.125rem); line-height: 1.15; }
.pie .lugares a { text-decoration: none; }
.pie .lugares a:hover { text-decoration: underline; text-underline-offset: 6px; }
.pie .enlaces { grid-column: 7 / 13; display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; font-size: 0.9375rem; }
.pie .enlaces h3 { font-size: 0.9375rem; font-weight: 600; letter-spacing: 0; margin-bottom: 10px; }
.pie .enlaces ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.pie .legal { display: flex; justify-content: space-between; gap: 24px; margin-top: 96px; font-size: var(--step-small); flex-wrap: wrap; }

/* ---------- Formularios ---------- */
.form-pagina { display: grid; grid-template-columns: minmax(0, 42fr) minmax(0, 58fr); column-gap: 24px; padding: 80px var(--margin) var(--gap-section); }
.form-pagina .lateral { padding-right: 24px; }
.form-pagina .lateral h1 { font-size: clamp(2.75rem, 5.2vw, 5rem); }
.form-pagina .lateral > p { margin-top: 24px; max-width: 36ch; font-size: var(--step-lead); line-height: 1.3; }
.form-pagina .lateral ol { margin: 48px 0 0; padding-left: 1.2em; display: grid; gap: 14px; font-size: 1.0625rem; max-width: 40ch; }
.foto-lateral { margin: 48px 0 0; max-width: 420px; }
.foto-lateral img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; filter: grayscale(1) contrast(1.05); }
.form-pagina .lateral .aparte { margin-top: 40px; font-size: 1.0625rem; max-width: 40ch; }
form.solicitud { background: var(--surface); padding: clamp(24px, 4vw, 48px); display: grid; grid-template-columns: 1fr 1fr; gap: 24px 24px; align-content: start; }
form.solicitud h2 { grid-column: 1 / -1; font-size: var(--step-head); }
.campo-f { display: grid; gap: 8px; }
.campo-f.ancho { grid-column: 1 / -1; }
.campo-f label { font-size: 1rem; font-weight: 600; }
.campo-f label .opc { font-weight: 400; color: var(--muted); }
.campo-f input, .campo-f select, .campo-f textarea {
  font: inherit; font-size: 1.0625rem; color: var(--ink); background: var(--bg);
  border: 1px solid rgba(6, 43, 138, 0.35); border-radius: 0; padding: 14px 14px; width: 100%;
  transition: border-color .2s, box-shadow .2s;
}
.campo-f select { appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23062b8a' stroke-width='1.6'/%3E%3C/svg%3E"); background-position: right 16px center; background-repeat: no-repeat; padding-right: 44px; }
.campo-f textarea { resize: vertical; min-height: 160px; }
.campo-f input:focus, .campo-f select:focus, .campo-f textarea:focus { outline: 2px solid var(--ink); outline-offset: 0; border-color: var(--ink); }
.campo-f [aria-invalid="true"] { border-color: #a1271b; outline: 1px solid #a1271b; }
.campo-f .error { color: #a1271b; font-size: var(--step-small); min-height: 1em; }
.form-pie { grid-column: 1 / -1; display: flex; align-items: center; gap: 24px; flex-wrap: wrap; margin-top: 8px; }
.form-pie p { font-size: 1rem; max-width: 44ch; }
.estado { grid-column: 1 / -1; font-size: 1.0625rem; }
.estado[data-tipo="error"] { color: #a1271b; }
.hecho { grid-column: 1 / -1; padding: 24px 0; }
.hecho h2 { font-size: var(--step-head); }
.hecho p { margin-top: 18px; max-width: 46ch; }
.cabecera-form { display: grid; grid-template-columns: 60px 1fr; gap: 8px; padding: 8px var(--margin); }
.cabecera-form .marca { background: var(--ink); color: var(--bg); display: grid; place-items: center; font-weight: 600; text-decoration: none; height: 60px; }
.cabecera-form .volver { background: var(--surface); display: flex; align-items: center; padding: 0 22px; text-decoration: none; font-size: var(--step-small); }
.cabecera-form .volver:hover { text-decoration: underline; text-underline-offset: 4px; }

/* ---------- Movimiento ---------- */
.js .sube { opacity: 0; transform: translateY(24px); transition: opacity .8s var(--ease), transform .9s var(--ease); transition-delay: calc(var(--i, 0) * 75ms); }
.js .sube.visto { opacity: 1; transform: none; }
.js .celda.sube, .js .pieza.sube { transform: scale(0.985); }
.js .celda.sube.visto, .js .pieza.sube.visto { transform: none; }
.js .obturador { clip-path: inset(0 0 100% 0); transition: clip-path 1.1s var(--ease); }
.js .obturador img { transform: scale(1.12); transition: transform 1.4s var(--ease); }
.js .obturador.visto { clip-path: inset(0 0 0 0); }
.js .obturador.visto img { transform: scale(1); }
.deriva-tira img { animation: deriva 26s ease-in-out infinite alternate; }
.deriva img { animation: deriva 22s ease-in-out infinite alternate; }
@keyframes deriva { from { transform: scale(1.02) translate3d(0, 0, 0); } to { transform: scale(1.1) translate3d(-1.5%, -1%, 0); } }

@media (prefers-reduced-motion: reduce) {
  .deriva-tira img { animation: none; }
  .parte.entra { animation: none; }
  html { scroll-behavior: auto; }
  .js .sube, .js .obturador, .js .obturador img { opacity: 1; transform: none; clip-path: none; transition: none; }
  .deriva-tira img { animation: deriva 26s ease-in-out infinite alternate; }
.deriva img { animation: none; }
  *, *::before, *::after { transition-duration: 0.01ms !important; }
}

/* ---------- Teléfono ---------- */
@media (max-width: 860px) {
  .tablero { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto; gap: 6px; padding: 6px; min-height: 0; }
  .barra { grid-template-columns: 56px 1fr; gap: 6px; }
  .barra nav { display: none; }
  .barra .accion { justify-content: space-between; height: 56px; }
  .barra .marca { height: 56px; }
  .tile-nombre { min-height: 30svh; padding: 18px; }
  .tile-nombre h1 { font-size: 15.5vw; }
  .tile-foto { aspect-ratio: 4 / 3; }
  .tile-foto.segunda { display: none; }
  .tile-pareja { gap: 6px; }
  .tile-pareja > p { aspect-ratio: 1; padding: 16px; font-size: 1.125rem; }

  .intro-fila { display: block; }
  .intro-fila h2 { font-size: 11vw; }
  .intro-fila .nota { margin-top: 20px; }
  .datos { display: grid; grid-template-columns: 1fr 1fr; row-gap: 32px; margin-top: 56px; }
  .datos strong { font-size: 1.625rem; }

  .mosaico { grid-template-columns: 1fr 1fr; grid-auto-rows: auto; gap: 6px; }
  .mosaico .pieza { grid-column: 1 / -1; grid-row: auto; min-height: 0; }
  .mosaico .pieza.foto-p { aspect-ratio: 4 / 3; }
  .mosaico .pieza.par { grid-column: span 1; aspect-ratio: 1; }
  .pieza .cifra-xl { font-size: 11vw; }
  .mosaico figure.pieza { aspect-ratio: 4 / 3; }
  .retratos { grid-template-columns: 1fr; }
  .lado .rotulo { display: none; }

  .lamina { grid-template-columns: 1fr; }
  .lamina-foto { padding: 16px; }
  .lamina-texto { padding: 8px 16px 24px; gap: 28px; }
  .acciones-dos { grid-template-columns: 1fr; }
  .acciones-dos .boton { min-height: 60px; }

  .lado { grid-template-columns: 1fr; row-gap: 40px; }
  .lado h2 { grid-column: 1; margin-bottom: 0; }
  .lado dl { grid-template-columns: 1fr 1fr; font-size: 0.875rem; order: 2; }
  .lado .parrafo { font-size: 1.1875rem; order: 1; }
  .listas { grid-template-columns: 1fr; gap: 40px; }

  .muro { grid-template-columns: 1fr 1fr; gap: 6px; padding-inline: 6px; }
  .celda .palabra { font-size: 8.6vw; }
  .celda .detalle { display: none; }
  .encabezado-muro { grid-template-columns: 1fr; }
  .encabezado-muro h2, .encabezado-muro p { grid-column: 1; }

  .programa-cab { display: block; }
  .programa-cab p { margin-top: 18px; }
  .pestanas-claras { grid-template-columns: 1fr 1fr; gap: 6px; margin-top: 32px; }
  .parte th { width: 64px; padding: 16px 8px 16px 12px; font-size: 1.0625rem; }
  .parte td { padding: 16px 12px 16px 0; }
  .parte td strong { font-size: 1.125rem; }
  .parte td span { font-size: 1rem; }
  .parte td:last-child { width: 48px; font-size: 0.875rem; }
  .celda .palabra.palabra-m { font-size: 6.2vw; }
  .tile-nombre h1 .h1-sub { font-size: 1.25rem; }
  .fases-cab { display: block; }
  .fases-cab h2 { font-size: 10vw; }
  .fases { grid-template-columns: 1fr; gap: 28px; }

  .precios { grid-template-columns: 1fr; min-height: 0; }
  .plan { min-height: 70svh; padding: 20px; }
  .plan h2 { font-size: 11vw; }
  .plan .precio { font-size: 22vw; }
  .plan .pie-plan .boton { width: 100%; }

  .tira { grid-template-columns: 1fr 1fr; }
  .tira img { height: auto; aspect-ratio: 1; }
  .tira img:first-child { grid-column: 1 / -1; aspect-ratio: 4 / 3; }
  .cierre { display: block; padding: 40px var(--margin); }
  .cierre h2 { font-size: 2rem; }
  .cierre figure { width: 96px; margin-top: 32px; margin-left: auto; }

  .pie .nombre { font-size: 17vw; margin-bottom: 48px; }
  .pie .fila { display: block; }
  .pie .lugares { font-size: 1.5rem; }
  .pie .enlaces { grid-template-columns: 1fr 1fr; margin-top: 40px; }
  .pie .legal { margin-top: 56px; }

  .form-pagina { grid-template-columns: minmax(0, 1fr); padding-top: 40px; row-gap: 40px; }
  .form-pagina .lateral { padding-right: 0; }
  form.solicitud { grid-template-columns: minmax(0, 1fr); padding: 20px; }
  .foto-lateral { max-width: none; }
  .form-pie .boton { width: 100%; }
}