/* =====================================================================
   Rodrigo Reina Liceaga — sitio
   Medidas tomadas del layout aprobado (788 px) normalizadas a 1440 px (×1.827).
   Escritorio/tableta: todo escala con --u (1 px a 1440, proporcional debajo).
   Móvil: medidas del hero móvil aprobado (390 px) con --m.
   Colores y familias: design system RRL (tokens.css).
   ===================================================================== */

@font-face { font-family: "Anton"; src: url(../fonts/anton-latin.woff2) format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Manrope"; src: url(../fonts/manrope-latin.woff2) format("woff2"); font-weight: 200 800; font-display: swap; }

:root {
  --u: min(calc(100vw / 1440), 1px);
  --m: min(calc(100vw / 390), 1.6px);
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--fondo-palido); color: var(--azul-electrico); font-family: var(--font-funcional);
  -webkit-font-smoothing: antialiased; overflow-x: hidden; }
body.menu-abierto { overflow: hidden; }
img { display: block; max-width: none; }
a { color: inherit; }
p, h1, h2, ul { margin: 0; padding: 0; }
ul { list-style: none; }
:focus-visible { outline: 2px solid var(--marino-display); outline-offset: 4px; }
.cuartago :focus-visible { outline-color: var(--azul-claro); }
.saltar { position: absolute; left: 16px; top: -80px; z-index: 60; padding: 12px 16px; background: var(--marino-display); color: #fff; font: 600 16px/1 var(--font-funcional); text-decoration: none; }
.saltar:focus { top: 16px; }

.sx { transform: scaleX(var(--sx, 1)); transform-origin: left top; white-space: nowrap; width: max-content; }
.wrap { width: calc(1280 * var(--u)); margin-inline: auto; position: relative; }

/* ---------- Etiqueta con filete ---------- */
.eyebrow { display: flex; align-items: center; gap: calc(24 * var(--u)); font: 600 max(11px, calc(22 * var(--u)))/1.2 var(--font-funcional);
  letter-spacing: .02em; text-transform: uppercase; color: var(--azul-electrico); }
.eyebrow::after { content: ""; flex: 1; height: 1px; background: var(--azul-filete); }
.eyebrow--chica { font-size: max(11px, calc(20 * var(--u))); font-weight: 500; }
.eyebrow--vision { max-width: calc(804 * var(--u)); }
.eyebrow--oscuro { color: var(--blanco); font-weight: 500; font-size: max(11px, calc(24.5 * var(--u))); letter-spacing: .14em; max-width: calc(804 * var(--u)); }
.eyebrow--oscuro::after { background: rgba(255,255,255,.85); }

/* ---------- Botones ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; height: max(44px, calc(75 * var(--u))); min-width: calc(356 * var(--u));
  padding: 0 calc(40 * var(--u)); background: var(--azul-principal); color: var(--blanco); border: 2px solid transparent; border-radius: 0;
  font: 600 max(13px, calc(25 * var(--u)))/1 var(--font-funcional); letter-spacing: .02em; text-transform: uppercase; text-decoration: none; cursor: pointer;
  transition: background-color var(--dur-base) var(--ease-estandar), color var(--dur-base) var(--ease-estandar); }
.btn:hover { background: var(--marino-display); }
.btn:active { background: var(--indigo-profundo); }
.btn--contorno { background: transparent; border-color: var(--blanco); min-width: calc(360 * var(--u)); height: max(44px, calc(70 * var(--u))); }
.btn--contorno:hover { background: var(--blanco); color: var(--marino-cuartago); }
.btn--compacto { min-width: calc(312 * var(--u)); height: max(44px, calc(77 * var(--u))); }

/* ---------- Header ---------- */
.cabecera { background: var(--fondo-palido); position: relative; z-index: 20; }
.cabecera__in { height: calc(120 * var(--u)); display: flex; align-items: center; justify-content: space-between; }
.logo { font: 800 max(14px, calc(33.5 * var(--u)))/1 var(--font-funcional); color: var(--indigo-profundo); text-transform: uppercase; text-decoration: none; letter-spacing: -.005em; }
.nav { display: flex; gap: calc(72 * var(--u)); }
.nav a { font: 500 max(10px, calc(19.5 * var(--u)))/1.2 var(--font-funcional); letter-spacing: .02em; text-transform: uppercase; color: var(--azul-electrico); text-decoration: none; text-underline-offset: 6px; }
.nav a:hover { text-decoration: underline; text-decoration-thickness: 1px; }
.menu-btn { display: none; }

/* ---------- Portada ---------- */
.portada { position: relative; }
.hero { background: var(--superficie-hero); height: calc(840 * var(--u)); position: relative; z-index: 1; }
.nombre { --sx: 1.2; padding-top: calc(109 * var(--u)); font: 400 calc(204 * var(--u))/0.955 var(--font-display); letter-spacing: -.01em; text-transform: uppercase; color: var(--texto-display); }
.nombre span { display: block; }
.triada { display: flex; justify-content: space-between; width: calc(731 * var(--u)); margin-top: calc(16 * var(--u));
  font: 500 max(11px, calc(29 * var(--u)))/1.2 var(--font-funcional); letter-spacing: .01em; text-transform: uppercase; color: var(--azul-electrico); }
.desliza { display: none; }

/* La foto: capa sobre hero y visión, alineada al borde derecho del contenido */
.foto { position: absolute; top: 0; left: 0; right: 0; height: 0; z-index: 3; pointer-events: none; }
.foto img { position: absolute; top: calc(-1 * var(--u)); right: calc(-1 * var(--u)); height: calc(1430 * var(--u)); width: auto; }

.vision { background: var(--superficie-editorial); position: relative; z-index: 1; padding-top: calc(40 * var(--u)); padding-bottom: calc(29 * var(--u)); }
.vision__t { --sx: 1.19; margin-top: calc(30 * var(--u)); font: 400 calc(88 * var(--u))/1.03 var(--font-display); letter-spacing: -.005em; text-transform: uppercase;
  color: var(--azul-principal); max-width: calc(840 * var(--u)); position: relative; z-index: 4; }
.vision__t .oport { color: inherit; }
.vision__bajada { margin-top: calc(26 * var(--u)); max-width: calc(760 * var(--u)); font: 400 max(14px, calc(30 * var(--u)))/1.4 var(--font-funcional); color: var(--azul-electrico); }
.vision .btn { margin-top: calc(30 * var(--u)); }

/* ---------- Cuartago ---------- */
.cuartago { background: var(--superficie-cuartago); color: var(--blanco); position: relative; overflow: hidden; }
.cuartago__img { position: absolute; top: 0; bottom: 0; right: 0; width: calc(760 * var(--u) + max(0px, (100vw - 1440px) / 2));
  background: url(../img/cuartago-caballo.jpg) right center / auto 100% no-repeat;
  background-image: image-set(url(../img/cuartago-caballo.webp) type("image/webp"), url(../img/cuartago-caballo.jpg) type("image/jpeg")); }
.cuartago__img { width: calc(709 * var(--u) + max(0px, (100vw - 1440px) / 2)); }
.cuartago__img::before { content: ""; position: absolute; inset: 0;
  background: linear-gradient(90deg, var(--marino-cuartago) 0%, var(--marino-cuartago) 15%, rgba(0,30,76,.55) 27%, rgba(0,30,76,0) 42%); }
.cuartago__in { padding-top: calc(56 * var(--u)); padding-bottom: calc(28 * var(--u)); min-height: calc(635 * var(--u)); z-index: 1; }
.cuartago__t { --sx: 1.25; margin-top: calc(26 * var(--u)); font: 400 calc(100 * var(--u))/1 var(--font-display); letter-spacing: -.005em; text-transform: uppercase; }
.cuartago__txt { margin-top: calc(20 * var(--u)); max-width: calc(640 * var(--u)); font: 400 max(13px, calc(27 * var(--u)))/1.3 var(--font-funcional); }
.capacidades { display: flex; margin-top: calc(36 * var(--u)); font: 600 max(10px, calc(21 * var(--u)))/1 var(--font-funcional); letter-spacing: .02em; text-transform: uppercase; }
.capacidades li { display: flex; align-items: center; height: calc(40 * var(--u)); padding: 0 calc(34 * var(--u)); border-left: 1px solid var(--blanco); }
.capacidades li:first-child { padding-left: 0; border-left: 0; }
.cuartago .btn { margin-top: calc(24 * var(--u)); }

/* ---------- Humano + dato ---------- */
.humano { background: var(--fondo-palido); padding-top: calc(73 * var(--u)); padding-bottom: calc(83 * var(--u)); }
.humano__grid { display: grid; grid-template-columns: calc(545 * var(--u)) 1fr; }
.humano__izq { border-top: 1px solid var(--azul-filete); width: calc(484 * var(--u)); padding-top: calc(40 * var(--u)); }
.humano__t { --sx: .894; font: 400 calc(165 * var(--u))/0.9 var(--font-display); letter-spacing: -.01em; text-transform: uppercase; color: var(--marino-display); }
.humano__txt { margin-top: calc(22 * var(--u)); max-width: calc(470 * var(--u)); font: 400 max(14px, calc(34.5 * var(--u)))/1.3 var(--font-funcional); color: var(--azul-electrico); }
.intereses { display: flex; flex-wrap: nowrap; white-space: nowrap; gap: 0 calc(12 * var(--u)); margin-top: calc(40 * var(--u)); font: 500 max(11px, calc(21.7 * var(--u)))/1.2 var(--font-funcional); letter-spacing: .02em; text-transform: uppercase; }
.intereses li + li::before { content: "·"; margin-right: calc(12 * var(--u)); }
.redes { margin-top: calc(44 * var(--u)); }
.redes__lista { display: flex; align-items: center; gap: calc(52 * var(--u)); margin-top: calc(24 * var(--u)); }
.redes__lista a { display: block; width: calc(72 * var(--u)); height: calc(72 * var(--u)); color: var(--azul-principal); transition: color var(--dur-base) var(--ease-estandar); }
.redes__lista a:hover { color: var(--marino-display); }
.redes__lista a[aria-disabled] { cursor: default; }
.redes__lista li:last-child a { width: calc(97 * var(--u)); }
.redes__lista svg { width: 100%; height: 100%; display: block; }

.humano__der { border-left: 1px solid var(--azul-filete); padding-left: calc(58 * var(--u)); margin-top: calc(-6 * var(--u)); padding-bottom: calc(30 * var(--u)); }
.dato__titulo { margin-top: calc(22 * var(--u)); font: 700 max(12px, calc(26 * var(--u)))/1.2 var(--font-funcional); text-transform: uppercase; color: var(--azul-electrico); }
.dato__cuerpo { display: grid; grid-template-columns: calc(119 * var(--u)) 1fr; margin-top: calc(26 * var(--u)); min-height: calc(200 * var(--u)); }
.dato__cita { min-height: 3.9em; }
.dato__comillas { font: 400 calc(210 * var(--u))/0.8 var(--font-display); color: var(--azul-claro); user-select: none; }
.dato__cita { margin-top: calc(14 * var(--u)); font: 400 calc(46 * var(--u))/1.3 var(--font-display); letter-spacing: -.012em; color: var(--texto-cita); transition: opacity var(--dur-dato) var(--ease-estandar); }
.dato__cita.is-saliendo { opacity: 0; }
.dato__apoyo { margin: calc(24 * var(--u)) 0 0 calc(119 * var(--u)); font: 400 max(12px, calc(23 * var(--u)))/1.5 var(--font-funcional); color: var(--azul-electrico); }
.dato__apoyo strong { font-weight: 700; }
.dato .btn { margin: calc(44 * var(--u)) 0 0 calc(119 * var(--u)); }

/* ---------- CTA ---------- */
.cta { background: var(--fondo-palido); }
.cta__in { border-top: 1px solid var(--azul-filete); padding-top: calc(46 * var(--u)); padding-bottom: calc(47 * var(--u)); }
.cta__t { --sx: 1.095; margin-top: calc(20 * var(--u)); font: 400 calc(89 * var(--u))/1 var(--font-display); letter-spacing: -.01em; text-transform: uppercase; color: var(--marino-display); white-space: nowrap; }
.cta__bajada { margin-top: calc(16 * var(--u)); font: 400 max(13px, calc(28 * var(--u)))/1.4 var(--font-funcional); color: var(--azul-electrico); }
.cta .btn { margin-top: calc(34 * var(--u)); }

/* ---------- Pie ---------- */
.pie { background: var(--fondo-palido); }
.pie__in { border-top: 1px solid var(--azul-filete); display: flex; justify-content: space-between; align-items: center; padding-top: calc(44 * var(--u)); padding-bottom: calc(70 * var(--u)); }
.pie__nombre { font: 600 max(10px, calc(20.4 * var(--u)))/1.2 var(--font-funcional); text-transform: uppercase; color: var(--azul-electrico); }
.nav--pie a { font-size: max(10px, calc(18 * var(--u))); }
.nav--pie { align-items: center; gap: calc(60 * var(--u)); }
.nav--pie::after { content: ""; width: 1px; height: calc(48 * var(--u)); background: var(--azul-filete); margin-left: calc(10 * var(--u)); }

/* ---------- Menú móvil ---------- */
.menu { position: fixed; inset: 0; z-index: 70; background: var(--fondo-palido); padding: 0 20px 40px; display: flex; flex-direction: column;
  opacity: 0; visibility: hidden; transition: opacity var(--dur-menu) var(--ease-salida), visibility 0s linear var(--dur-menu); }
.menu.is-open { opacity: 1; visibility: visible; transition: opacity var(--dur-menu) var(--ease-estandar); }
.menu__top { height: 64px; display: flex; align-items: center; justify-content: space-between; }
.menu-cerrar { width: 48px; height: 48px; margin-right: -12px; background: none; border: 0; color: var(--indigo-profundo); cursor: pointer; }
.menu-cerrar svg { width: 26px; height: 26px; }
.menu__lista { margin-top: 32px; border-top: 1px solid var(--azul-filete); }
.menu__lista li { border-bottom: 1px solid var(--azul-filete); }
.menu__lista a { display: flex; align-items: center; min-height: 72px; font: 400 44px/1 var(--font-display); text-transform: uppercase; color: var(--marino-display); text-decoration: none; }

/* =====================================================================
   Tableta (768–1023): misma composición, navegación en botón de menú
   ===================================================================== */
/* ---------- Experiencia ---------- */
.exp { background: var(--blanco); padding-top: calc(96 * var(--u)); padding-bottom: calc(104 * var(--u)); }
.exp__grid { display: grid; grid-template-columns: calc(545 * var(--u)) 1fr; align-items: start; }
.exp__izq { padding-right: calc(61 * var(--u)); }
.exp__t { --sx: .894; margin-top: calc(28 * var(--u)); font: 400 calc(96 * var(--u))/0.9 var(--font-display); letter-spacing: -.01em; text-transform: uppercase; color: var(--marino-display); }
.exp__lead { margin-top: calc(26 * var(--u)); max-width: calc(470 * var(--u)); font: 400 max(15px, calc(24 * var(--u)))/1.5 var(--font-funcional); color: var(--azul-electrico); }
.enlace { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; margin-top: calc(22 * var(--u)); color: var(--azul-principal); font: 700 max(14px, calc(20 * var(--u)))/1.2 var(--font-funcional); text-decoration: none; border-bottom: 1px solid currentColor; }
.enlace:hover { color: var(--marino-display); }
.enlace svg { width: 18px; height: 18px; flex: none; }
.hitos { list-style: none; margin: calc(6 * var(--u)) 0 0; padding: 0; border-top: 1px solid var(--azul-filete); counter-reset: none; }
.hito { display: grid; grid-template-columns: calc(230 * var(--u)) 1fr; align-items: start; gap: calc(24 * var(--u)); padding: calc(34 * var(--u)) 0; border-bottom: 1px solid var(--azul-filete); }
.hito__año { font: 400 calc(64 * var(--u))/1 var(--font-display); color: var(--azul-principal); letter-spacing: -.01em; white-space: nowrap; }
.hito__año i { font-style: normal; }
.hito__cargo { margin: calc(10 * var(--u)) 0 0; font: 800 max(17px, calc(32 * var(--u)))/1.15 var(--font-funcional); color: var(--marino-display); text-transform: uppercase; letter-spacing: -.005em; }
.hito__lugar { margin-top: calc(8 * var(--u)); font: 400 max(14px, calc(22 * var(--u)))/1.45 var(--font-funcional); color: var(--azul-electrico); }

/* ---------- Dato: fuente y compartir ---------- */
.dato__extra { display: flex; flex-wrap: wrap; align-items: center; gap: 4px calc(28 * var(--u)); margin: calc(14 * var(--u)) 0 0 calc(119 * var(--u)); font: 400 max(12px, calc(16 * var(--u)))/1.4 var(--font-funcional); color: var(--azul-electrico); }
#dato-fuente { opacity: .8; }
#dato-compartir { display: inline-flex; align-items: center; min-height: 44px; font-weight: 700; color: var(--azul-principal); text-decoration: underline; text-underline-offset: 4px; }

/* ---------- Pie ---------- */
.pie__id { display: flex; flex-direction: column; gap: 6px; }
.pie__legal { font: 400 max(12px, calc(15 * var(--u)))/1.3 var(--font-funcional); color: var(--azul-electrico); opacity: .8; }

/* ---------- Navegación: sección actual ---------- */
.nav a[aria-current="true"] { color: var(--marino-display); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 6px; }
.menu__lista a[aria-current="true"] { color: var(--azul-principal); }

/* ---------- Aviso (correo copiado) ---------- */
.aviso { position: fixed; z-index: 80; left: 50%; bottom: calc(24px + env(safe-area-inset-bottom, 0px)); transform: translate(-50%, 20px); max-width: calc(100% - 32px);
  padding: 14px 20px; background: var(--marino-display); color: var(--blanco); font: 600 15px/1.35 var(--font-funcional); text-align: center;
  opacity: 0; pointer-events: none; transition: opacity var(--dur-base) var(--ease-estandar), transform var(--dur-base) var(--ease-estandar); }
.aviso.is-visible { opacity: 1; transform: translate(-50%, 0); }
@media (max-width: 767px) { .aviso { bottom: calc(88px + env(safe-area-inset-bottom, 0px)); } }

/* ---------- WhatsApp flotante (sólo celular) ---------- */
.wa-flotante { display: none; }

@media (max-width: 1023px) {
  .nav:not(.nav--pie) { display: none; }
  .menu-btn { display: inline-flex; flex-direction: column; justify-content: center; gap: 6px; width: 48px; height: 48px; margin-right: -10px; padding: 0 10px; background: none; border: 0; cursor: pointer; }
  .menu-btn span { display: block; height: 3px; background: var(--indigo-profundo); }
}

/* =====================================================================
   Móvil (< 768) — hero a pantalla completa según referencia móvil
   ===================================================================== */
/* ---------- Datos de contacto ---------- */
.contacto { display: flex; flex-wrap: wrap; gap: calc(12 * var(--u)) calc(48 * var(--u)); margin-top: calc(28 * var(--u)); }
.contacto a { display: inline-flex; align-items: center; gap: calc(12 * var(--u)); min-height: 44px; color: var(--azul-electrico); text-decoration: none;
  font: 500 max(14px, calc(21 * var(--u)))/1.2 var(--font-funcional); transition: color var(--dur-base) var(--ease-estandar); }
.contacto a:hover { color: var(--marino-display); text-decoration: underline; text-underline-offset: 5px; }
.contacto strong { font-weight: 700; }
.contacto svg { width: max(20px, calc(28 * var(--u))); height: max(20px, calc(28 * var(--u))); flex: none; }

@media (max-width: 767px) {
  /* Celular: misma composición apilada, tipografía grande y legible, objetivos táctiles de 48–56 px */
  html { scroll-padding-top: 56px; }
  .wrap { width: auto; margin-inline: 20px; }
  body { padding-top: calc(56px + env(safe-area-inset-top, 0px)); }
  .cabecera { position: fixed; top: 0; left: 0; right: 0; padding-top: env(safe-area-inset-top, 0px); }
  .cabecera__in { height: 56px; }
  .logo { font-size: calc(14.5 * var(--m)); display: inline-flex; align-items: center; min-height: 44px; }
  .menu-btn { gap: 5px; width: 48px; height: 48px; } .menu-btn span { height: 3px; width: 28px; }
  .menu__top { height: 56px; }

  /* Hero a pantalla completa */
  .hero { height: max(calc(100svh - 56px), calc(740 * var(--m))); min-height: calc(640 * var(--m)); overflow: hidden; z-index: auto; }
  .portada { overflow-x: clip; }
  .hero .wrap { position: static; }
  .nombre { --sx: .96; padding-top: calc(32 * var(--m)); font-size: calc(72 * var(--m)); line-height: 1; position: relative; z-index: 1; }
  .triada { width: auto; margin-top: calc(14 * var(--m)); justify-content: flex-start; gap: calc(6 * var(--m)); font-size: max(11px, calc(10.5 * var(--m))); font-weight: 600; letter-spacing: 0; position: relative; z-index: 4; text-shadow: 0 0 6px var(--fondo-palido), 0 0 2px var(--fondo-palido); }
  .triada li + li::before { content: "·"; margin-right: calc(6 * var(--m)); }
  .foto { position: static; height: auto; }
  .foto__wrap { position: static; }
  .foto img { top: calc(72 * var(--m)); right: auto; left: calc(194 * var(--m)); height: min(calc(580 * var(--m)), calc(100svh - 56px - 120px)); z-index: 3; }
  .desliza { position: absolute; left: 0; right: 0; bottom: calc(26 * var(--m)); top: auto; display: flex; flex-direction: column; align-items: center; text-decoration: none; color: var(--azul-principal); z-index: 4; min-height: 48px; }
  .desliza__linea { width: 1px; height: calc(30 * var(--m)); background: var(--azul-principal); }
  .desliza svg { width: 18px; height: 9px; margin-top: 8px; }
  .desliza__txt { margin-top: 12px; font: 600 12px/1 var(--font-funcional); letter-spacing: .24em; text-transform: uppercase; }

  .eyebrow { font-size: 12px; gap: 14px; letter-spacing: .06em; }
  .eyebrow--vision, .eyebrow--oscuro { max-width: none; }
  .btn { width: 100%; min-width: 0; height: 56px; font-size: 15px; letter-spacing: .06em; }

  /* Visión */
  .vision { padding-top: 40px; padding-bottom: 44px; }
  .vision__t { --sx: 1.08; margin-top: 18px; font-size: calc(39 * var(--m)); line-height: .98; max-width: none; }
  .vision__bajada { margin-top: 18px; max-width: 32ch; font-size: 17px; line-height: 1.5; }
  .vision .btn { margin-top: 26px; }

  /* Cuartago: imagen arriba a todo lo ancho, texto debajo */
  .cuartago { display: flex; flex-direction: column; }
  .cuartago__img { position: relative; width: 100%; height: auto; aspect-ratio: 1 / 1; background-size: cover; background-position: 38% 60%; }
  .cuartago__img::before { background: linear-gradient(180deg, rgba(0,30,76,0) 55%, var(--marino-cuartago) 100%); }
  .cuartago__in { min-height: 0; margin-top: -48px; padding-top: 0; padding-bottom: 48px; }
  .eyebrow--oscuro { font-size: 12px; letter-spacing: .12em; }
  .cuartago__t { --sx: 1.12; margin-top: 18px; font-size: calc(50 * var(--m)); line-height: .95; }
  .cuartago__txt { margin-top: 18px; max-width: none; font-size: 17px; line-height: 1.5; }
  .capacidades { flex-direction: column; margin-top: 26px; font-size: 14px; border-top: 1px solid rgba(255,255,255,.35); }
  .capacidades li { height: 52px; padding: 0; border-left: 0; border-bottom: 1px solid rgba(255,255,255,.35); }
  .cuartago .btn { width: 100%; height: 56px; margin-top: 28px; font-size: 15px; }

  /* Humano + dato */
  .humano { padding-top: 48px; padding-bottom: 24px; }
  .humano__grid { display: flex; flex-direction: column; }
  .humano__izq, .humano__der { display: contents; }
  .humano__t { --sx: .9; order: -5; border-top: 1px solid var(--azul-filete); padding-top: 26px; font-size: calc(100 * var(--m)); }
  .humano__txt { order: -4; margin-top: 18px; max-width: 30ch; font-size: 20px; line-height: 1.4; }
  .intereses { order: -3; margin-top: 20px; flex-wrap: wrap; white-space: normal; font-size: 13px; gap: 6px 10px; }
  .intereses li + li::before { margin-right: 10px; }
  .dato > .eyebrow { margin-top: 44px; }
  .dato__titulo { margin-top: 16px; font-size: 15px; }
  .dato__cuerpo { grid-template-columns: calc(54 * var(--m)) 1fr; margin-top: 14px; min-height: 0; }
  .dato__comillas { font-size: calc(96 * var(--m)); }
  .dato__cita { margin-top: 6px; font-size: calc(29 * var(--m)); line-height: 1.12; min-height: 4.48em; }
  .dato__apoyo { margin: 16px 0 0; font-size: 15px; line-height: 1.5; }
  .dato .btn { margin: 22px 0 0; }
  .redes { order: 5; margin-top: 44px; }
  .redes__lista { justify-content: space-between; gap: 0; margin-top: 18px; padding: 0 4px; }
  .redes__lista a, .redes__lista li:last-child a { width: 52px; height: 52px; padding: 4px; }

  /* Experiencia */
  .exp { padding-top: 48px; padding-bottom: 52px; }
  .exp__grid { display: block; }
  .exp__izq { padding-right: 0; }
  .exp__t { --sx: .9; margin-top: 18px; font-size: calc(78 * var(--m)); }
  .exp__lead { margin-top: 18px; max-width: 32ch; font-size: 18px; line-height: 1.5; }
  .enlace { margin-top: 14px; font-size: 15px; }
  .hitos { margin-top: 30px; }
  .hito { grid-template-columns: calc(112 * var(--m)) 1fr; gap: 12px; padding: 22px 0; }
  .hito__año { font-size: calc(32 * var(--m)); }
  .hito__cargo { margin-top: 4px; }
  .hito__cargo { font-size: 18px; }
  .hito__lugar { margin-top: 4px; font-size: 15px; }

  .dato__extra { margin: 10px 0 0; font-size: 13px; gap: 0 18px; }

  .wa-flotante { display: inline-flex; align-items: center; gap: 10px; position: fixed; z-index: 40; right: 16px; bottom: calc(16px + env(safe-area-inset-bottom, 0px));
    height: 56px; padding: 0 20px; background: var(--azul-principal); color: var(--blanco); border: 2px solid var(--blanco); text-decoration: none;
    font: 700 15px/1 var(--font-funcional); letter-spacing: .04em; text-transform: uppercase;
    transform: translateY(140%); opacity: 0; transition: transform var(--dur-menu) var(--ease-estandar), opacity var(--dur-menu) var(--ease-estandar); }
  .wa-flotante.is-visible { transform: none; opacity: 1; }
  .wa-flotante svg { width: 24px; height: 24px; }
  body.menu-abierto .wa-flotante { opacity: 0; pointer-events: none; }
  .pie__in { padding-bottom: calc(100px + env(safe-area-inset-bottom, 0px)); }

  /* Contacto */
  .cta__in { padding-top: 40px; padding-bottom: 44px; }
  .cta__t span { display: block; }
  .cta__t { --sx: 1; margin-top: 16px; font-size: calc(66 * var(--m)); line-height: .95; white-space: normal; width: auto; }
  .cta__bajada { margin-top: 18px; max-width: 30ch; font-size: 17px; line-height: 1.5; }
  .cta .btn { margin-top: 26px; }
  .contacto { flex-direction: column; gap: 0; margin-top: 18px; border-top: 1px solid var(--azul-filete); }
  .contacto a { width: 100%; min-height: 56px; gap: 14px; font-size: 16px; border-bottom: 1px solid var(--azul-filete); }
  .contacto svg { width: 22px; height: 22px; }

  /* Pie */
  .pie__in { flex-direction: column; align-items: flex-start; gap: 6px; padding-top: 24px; padding-bottom: calc(100px + env(safe-area-inset-bottom, 0px)); }
  .pie__nombre { font-size: 14px; }
  .nav--pie { gap: 0 22px; flex-wrap: wrap; }
  .nav--pie a { display: inline-flex; align-items: center; min-height: 44px; font-size: 13px; }
  .nav--pie::after { display: none; }
}
@media (max-width: 359px) {
  .wrap { margin-inline: 16px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; }
}

/* ---------- 404 ---------- */
.p404 { min-height: 100vh; display: flex; align-items: center; padding: 0; }
.p404__in { padding-block: 64px; }
.p404__t { margin-top: 24px; font: 400 clamp(56px, 11vw, 160px)/.9 var(--font-display); text-transform: uppercase; color: var(--marino-display); }
.p404__txt { margin-top: 20px; max-width: 32ch; font: 400 clamp(17px, 2vw, 24px)/1.5 var(--font-funcional); color: var(--azul-electrico); }
.p404 .btn { margin-top: 32px; width: auto; padding: 0 40px; }