/* Mejoras de velocidad y accesibilidad (revisión tipo jurado, nov 2026).
   Va en todas las páginas, después del <style> propio de cada una. */

/* Foto del hero como <img> real: carga antes y en el tamaño justo */
.hero-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; }

/* Saltar al contenido: invisible hasta que se llega con el teclado */
.skip-link {
  position: fixed; top: 12px; left: 12px; z-index: 1000;
  background: var(--negro, #1c1c1a); color: var(--crema, #f2efea);
  font-family: var(--font-body, 'Figtree', sans-serif); font-size: 12px; font-weight: 500;
  letter-spacing: 0.18em; text-transform: uppercase; text-decoration: none;
  padding: 12px 18px; transform: translateY(-160%); transition: transform 0.2s;
}
.skip-link:focus { transform: translateY(0); }
main:focus { outline: none; }

/* Foco visible en el color de la marca, en vez del anillo azul del navegador */
:focus-visible { outline: 2px solid #afa699; outline-offset: 3px; }
.section-dark :focus-visible, .cta-band :focus-visible, footer :focus-visible,
.mobile-menu :focus-visible, .page-hero :focus-visible { outline-color: #cfc4b8; }

/* Footer con contraste suficiente sobre el fondo oscuro (antes 2.5:1) */
.footer-links a { color: rgba(242,239,234,0.62); }
.footer-links a:hover { color: var(--crema, #f2efea); }
.footer-copy, .footer-brand span { color: rgba(242,239,234,0.55); }
footer p { color: rgba(242,239,234,0.5) !important; }

/* Movimiento reducido: todo el texto se ve de una vez, sin animación */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-delay: 0s !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
  [style*="opacity:0;"], .reveal { opacity: 1 !important; transform: none !important; }
}