/* =========================================================
   VERSIÓN DE PRUEBA — toda la página con el fondo azul de chapa
   (solo la usa index-fondo-oscuro.html; no afecta a la página publicada)
   ========================================================= */
body.tema-oscuro {
  color: var(--blanco);
  background-color: var(--azul-marino);
  background-image: repeating-linear-gradient(90deg,
    rgba(255,255,255,.035) 0 18px, rgba(0,0,0,.08) 18px 22px, rgba(255,255,255,.02) 22px 40px);
}
/* Todas las secciones dejan ver el mismo fondo */
.tema-oscuro section, .tema-oscuro .gris, .tema-oscuro .oscuro, .tema-oscuro .corrugado,
.tema-oscuro .seccion-instagram, .tema-oscuro .pie { background: transparent; }
.tema-oscuro .portada { background: var(--azul-noche); }
.tema-oscuro .frase { background: rgba(8,18,34,.55); }

/* Textos */
.tema-oscuro .bajada, .tema-oscuro .nota { color: var(--acero-claro); }
.tema-oscuro .nosotros-texto .destacado { color: var(--blanco); }
.tema-oscuro .nosotros-texto .destacado b { color: var(--acero-claro); }
.tema-oscuro .lista-ofrecemos svg { color: var(--acero-claro); }
.tema-oscuro .nosotros-foto .sello { background: var(--azul-panel); }

/* Botón azul: en fondo oscuro pasa a blanco */
.tema-oscuro .boton-azul { background: var(--blanco); color: var(--azul-marino); }
.tema-oscuro .boton-azul:hover { background: var(--acero-claro); }

/* Tarjetas de contenedores */
.tema-oscuro .tarjeta-contenedor { background: var(--azul-panel); border-color: rgba(169,193,220,.18); }
.tema-oscuro .tarjeta-contenedor:hover { border-color: rgba(169,193,220,.45); box-shadow: 0 24px 50px -24px rgba(0,0,0,.8); }
.tema-oscuro .tarjeta-contenedor h3 { color: var(--blanco); }
.tema-oscuro .tarjeta-contenedor p, .tema-oscuro .medidas div { color: var(--acero-claro); }
.tema-oscuro .medidas { border-top-color: rgba(169,193,220,.18); }
.tema-oscuro .medidas b { color: var(--blanco); }
.tema-oscuro .dibujo svg > line { stroke: rgba(169,193,220,.25); }
.tema-oscuro .dibujo .caja > rect:first-child { stroke: var(--acero); }
.tema-oscuro .banda-asesoramiento { background: var(--azul-panel); border: 1px solid rgba(169,193,220,.18); }

/* Galería e Instagram */
.tema-oscuro .galeria figure, .tema-oscuro .post-ig { background: var(--azul-panel); }
.tema-oscuro .post-ig.vacio { background: var(--azul-panel); border: 1px solid rgba(169,193,220,.18); }
.tema-oscuro .post-ig.vacio:hover { background: var(--azul-contenedor); }

/* Por qué elegirnos */
.tema-oscuro .razones { background: rgba(169,193,220,.16); border-color: rgba(169,193,220,.16); }
.tema-oscuro .razon { background: var(--azul-panel); }
.tema-oscuro .razon:hover { background: #17304f; }
.tema-oscuro .razon .numero { background: var(--blanco); color: var(--azul-marino); }
.tema-oscuro .razon:hover .numero { background: var(--acero-claro); }
.tema-oscuro .razon p { color: var(--acero-claro); }

/* Contacto */
.tema-oscuro .datos-contacto .icono { background: var(--azul-panel); color: var(--acero-claro); }
.tema-oscuro .datos-contacto small { color: var(--acero-claro); }
.tema-oscuro .datos-contacto a, .tema-oscuro .datos-contacto span { color: var(--blanco); }
.tema-oscuro .datos-contacto a:hover { color: var(--acero-claro); }
.tema-oscuro .formulario, .tema-oscuro .mapa-provincia { background: var(--azul-panel); border: 1px solid rgba(169,193,220,.18); }
.tema-oscuro .mapa-google { background: var(--azul-panel); }
.tema-oscuro .mapa-google .como-llegar { background: var(--azul-marino); color: var(--blanco); }

/* Menos espacio entre secciones (antes 120px arriba y abajo de cada una) */
.tema-oscuro main > section:not(.portada):not(.frase) { padding: clamp(44px, 6vw, 72px) 0; }

/* Política de privacidad con el mismo fondo */
.tema-oscuro .legal-encabezado { background: transparent; padding-bottom: 20px; }
.tema-oscuro .legal-cuerpo { padding-top: 30px; }
.tema-oscuro .legal-indice { border-left-color: rgba(169,193,220,.25); }
.tema-oscuro .legal-indice ol { color: var(--acero-claro); }
.tema-oscuro .legal-indice a:hover { color: var(--blanco); }
.tema-oscuro .legal-texto .intro, .tema-oscuro .legal-texto b, .tema-oscuro .legal-texto h2 { color: var(--blanco); }
.tema-oscuro .legal-texto p, .tema-oscuro .legal-texto li { color: var(--acero-claro); }
.tema-oscuro .legal-texto a { color: var(--blanco); text-decoration: underline; }
.tema-oscuro .legal-aviso { background: var(--azul-panel); border-left-color: var(--acero); }
