/* Estilos comunes a las cuatro landings de servicio de madrid.reforcam.com.
   Solo lo que no cabe en un atributo style: reset, animaciones, media queries,
   estados :hover y el respaldo de fuente. El resto del maquetado va en linea,
   como en el diseno original. Lo genera tools/build-landings.py. */
  * { box-sizing: border-box; }
  html, body { margin: 0; padding: 0; }
  body { font-family: 'Archivo', system-ui, sans-serif; color: #141414; background: #fff; -webkit-font-smoothing: antialiased; }
  a { color: #b30100; text-decoration: none; }
  a:hover { color: #7a0000; }
  img { display: block; max-width: 100%; }
  input, select, textarea, button { font-family: inherit; }
  ::placeholder { color: #a8a8a8; }
  [hidden] { display: none !important; }
  @keyframes tick { from { transform: translateX(0); } to { transform: translateX(-50%); } }
  @keyframes pulseRing { 0% { box-shadow: 0 0 0 0 rgba(37,211,102,.5); } 70% { box-shadow: 0 0 0 18px rgba(37,211,102,0); } 100% { box-shadow: 0 0 0 0 rgba(37,211,102,0); } }
  @keyframes blink { 0%,100% { opacity: 1; } 50% { opacity: .25; } }
  .om-bar { display: none; }
  .om-grid4 { grid-template-columns: repeat(2, minmax(0,1fr)); }
  @media (min-width: 900px) { .om-grid4 { grid-template-columns: repeat(4, minmax(0,1fr)); } }
  @media (max-width: 820px) {
    .om-bar { display: grid !important; }
    .om-dtop { display: none !important; }
    .om-wa { bottom: 86px !important; }
  }
  /* Los carruseles se desplazan con scroll-snap; se oculta la barra nativa
     porque la navegacion va por las flechas y el swipe. */
  .om-scroll { scrollbar-width: none; -ms-overflow-style: none; }
  .om-scroll::-webkit-scrollbar { display: none; }
  /* Etiquetas solo para lector de pantalla: el diseno usa placeholders,
     que no son etiqueta accesible. */
  /* Si Google Fonts no responde (bloqueado por el navegador, red corporativa,
     extension de privacidad), los titulares caian a Times: el diseno declaraba
     'Archivo Black' sin ninguna alternativa. Este respaldo local mantiene el
     titular en una sans negra y reduce el salto cuando la fuente real llega. */
  @font-face {
    font-family: 'Archivo Black Fallback';
    src: local('Arial Black'), local('Helvetica Neue Bold'), local('Arial Bold'), local('Arial');
    font-weight: 400 900;
    size-adjust: 97%;
    ascent-override: 92%;
    descent-override: 24%;
  }
  .om-sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
  [data-ba-range]:focus-visible { opacity: 1 !important; outline: 3px solid #b30100; }
  /* :hover de las opciones del formulario por pasos y de los botones. */
  .om-opt:hover { border-color: #b30100 !important; background: #fff5f5 !important; transform: translateX(3px); }
  .om-arrow-l:hover { background: #f4f4f4 !important; }
  .om-arrow-d:hover { background: #b30100 !important; border-color: #b30100 !important; }
  .om-btn-red:hover { background: #7a0000 !important; }
  .om-btn-wa:hover { background: #1fb457 !important; }
  .om-btn-dark:hover { background: #2e2e2e !important; }
  .om-btn-ghost:hover { background: rgba(255,255,255,.12) !important; }
  .om-btn-white:hover { background: #ededed !important; }
  @media (prefers-reduced-motion: reduce) {
    [style*="animation"] { animation: none !important; }
    .om-scroll { scroll-behavior: auto !important; }
  }
