/* ============================================================
   base.css — Reset + tipografía base · Club Noel
   Fuentes (D-07): Quicksand (títulos/cuerpo) + Arial Rounded (UI).
   POC: se usan .otf/.ttf vía @font-face; el pipeline genera WOFF2.
   ============================================================ */

@font-face {
  font-family: "Quicksand";
  src: url("../assets/fonts/quicksand-regular.otf") format("opentype");
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Quicksand";
  src: url("../assets/fonts/quicksand-bold.otf") format("opentype");
  font-weight: 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Arial Rounded MT";
  src: url("../assets/fonts/arial-rounded-bold.ttf") format("truetype");
  font-weight: 700; font-style: normal; font-display: swap;
}

/* ---- Reset ---- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; }
img, svg, video { display: block; max-width: 100%; }
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
ul { list-style: none; }

body {
  font-family: var(--font-cuerpo);
  font-weight: 400;
  color: var(--color-texto);
  background: var(--navy-principal);   /* letterbox fuera del lienzo 16:9 */
  line-height: 1.4;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow: hidden;                    /* la app gestiona su propio scroll */
}

h1, h2, h3, .titulo { font-family: var(--font-titulo); font-weight: 700; line-height: 1.1; }
strong, b { font-weight: 700; }

/* ---- Accesibilidad: respetar reduce-motion ---- */
@media (prefers-reduced-motion: reduce) {
  :root { --dur-in: 1ms; --dur-out: 1ms; --dur-slide: 1ms; --stagger: 0ms; }
  *, *::before, *::after { animation: none !important; }
}

/* Foco visible para navegación por teclado */
:focus-visible { outline: 3px solid var(--cyan-saturado); outline-offset: 3px; }