/* Fuentes autoalojadas (subconjunto latino extraído del diseño) */
@font-face { font-family: 'Bricolage Grotesque'; font-style: normal; font-weight: 500; font-stretch: 100%; font-display: swap; src: url("../fonts/bricolage-grotesque-latin.woff2") format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Bricolage Grotesque'; font-style: normal; font-weight: 700; font-stretch: 100%; font-display: swap; src: url("../fonts/bricolage-grotesque-latin.woff2") format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Bricolage Grotesque'; font-style: normal; font-weight: 800; font-stretch: 100%; font-display: swap; src: url("../fonts/bricolage-grotesque-latin.woff2") format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Space Mono'; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/space-mono-400-latin.woff2") format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Space Mono'; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/space-mono-700-latin.woff2") format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

/* Reglas globales del diseño */
html, body { margin: 0; background: #0A1633; }
html { scroll-behavior: smooth; scroll-padding-top: 64px; }
* { box-sizing: border-box; }
a { color: #6FA3FF; text-decoration: none; }
a:hover { color: #FFFFFF; }
input::placeholder, textarea::placeholder { color: #7F8EB0; }
@keyframes q5marq { from { transform: translateX(0) } to { transform: translateX(-50%) } }

/* Añadidos de la v1 (no están en el diseño) */
a:focus-visible, button:focus-visible { outline: 3px solid #4D8DFF; outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; scroll-behavior: auto !important; }
}

/* Capa responsiva: el diseño cubre escritorio; bajo 860 px las secciones fluyen
   en una columna, sin altura de pantalla completa ni zoom de ajuste. */
@media (max-width: 860px) {
  html { scroll-snap-type: none !important; scroll-padding-top: 56px; }
  header { height: 56px !important; }
  header .px { padding-left: 16px !important; padding-right: 16px !important; }
  .topnav a:not(:last-child) { display: none !important; }
  .topnav a:last-child { padding: 8px 12px !important; font-size: 11px !important; }
  section[data-screen-label] { height: auto !important; min-height: 0 !important; display: block !important; padding-top: 48px !important; padding-bottom: 48px !important; }
  section[data-screen-label] > * { zoom: 1 !important; }
  .px { padding-left: 20px !important; padding-right: 20px !important; }
  #top > .px, #contacto > .px { padding-top: 40px !important; padding-bottom: 48px !important; }
  .rg { grid-template-columns: minmax(0, 1fr) !important; gap: 24px !important; }
  .rg5 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 0 !important; }
  .rg5 > div { border-right: 0 !important; border-bottom: 2px solid #EEF2F8; }
  .rg5 > div:last-child { grid-column: 1 / -1; border-bottom: 0; }
  .rg3 { gap: 0 !important; }
  .rg3 > div { border-right: 0 !important; border-bottom: 2px solid #0A1633; }
  .rg3 > div:last-child { border-bottom: 0; }
  .rflex { flex-wrap: wrap !important; }
  #contacto { display: block !important; }
  #contacto > .px { display: grid !important; }
  h1 { font-size: clamp(34px, 9vw, 48px) !important; }
}