/* v2.css — Overrides para la variante v2
   Estrategia: mantener look táctico/HUD pero:
   1. Ampliar el rango tonal de fondos para que las secciones se distingan.
   2. Civilizar lenguaje (ya hecho en HTML, este archivo refuerza la sobriedad visual).
   3. Reforzar separadores de sección con líneas/acentos más visibles.
   4. Romper la monotonía con una sección "paper" clara para convenios.
*/

/* ===== Paleta v2: fondos con más contraste tonal ===== */
:root {
  /* Antes era #141612 / #1E2119 / #191C18 — casi indistinguibles. Ahora un rango real: */
  --umt-bg-deep: #0A0B08;          /* casi negro — secciones tipo carbón puro */
  --umt-bg-mid: #16190F;           /* oliva muy oscuro — fondo base */
  --umt-bg-panel: #232A18;         /* oliva oscuro saturado — paneles destacados */
  --umt-bg-light-olive: #2F3922;   /* oliva medio — secciones de ruptura */
  --umt-bg-paper: #ECE6D4;         /* sand papel — UNA sección clara para romper */

  /* Sobrescribo los tres tokens originales para que todo el sistema use los nuevos */
  --umt-dark-bg: var(--umt-bg-mid);
  --umt-card-bg: var(--umt-bg-panel);
  --umt-section-alt: var(--umt-bg-deep);

  /* Grid lines más visibles */
  --umt-grid-line: rgba(200, 182, 138, 0.14);
  --umt-grid-line-strong: rgba(255, 199, 44, 0.35);
}

body { background: var(--umt-bg-mid); }

/* ===== Logo nav: glow más sutil (mantiene tricolor pero menos "fan-made") ===== */
.logo-u, .logo-t { text-shadow: 0 0 4px rgba(198, 11, 30, 0.25); }
.logo-m { text-shadow: 0 0 4px rgba(255, 196, 0, 0.25); }

/* ===== Separadores de sección reforzados ===== */
section + section,
section + main > section,
main > section + section {
  position: relative;
}

/* Banda dorada de 1px arriba de cada sección + cruz decorativa */
.v2-section-divider {
  position: relative;
  height: 0;
  border-top: 1px solid var(--umt-grid-line-strong);
}
.v2-section-divider::before {
  content: '+';
  position: absolute;
  top: -10px;
  left: var(--space-6);
  font-family: var(--font-mono);
  font-size: 14px;
  color: var(--umt-tactical-gold);
  background: var(--umt-bg-mid);
  padding: 0 6px;
  opacity: 0.9;
}
.v2-section-divider::after {
  content: '';
  position: absolute;
  top: -3px;
  right: var(--space-6);
  width: 60px;
  height: 5px;
  border-top: 1px solid var(--umt-tactical-gold);
  border-right: 1px solid var(--umt-tactical-gold);
}

/* ===== Grid HUD coherente en TODA la web (vía ::before) ===== */
main > section:not(.home-cta):not(.stats),
main > header:not(.home-hero):not(.asoc-hero):not(.serv-hero):not(.news-hero):not(.article-hero) {
  position: relative;
}

main > section:not(.home-cta):not(.stats)::before,
main > header:not(.home-hero):not(.asoc-hero):not(.serv-hero):not(.news-hero):not(.article-hero)::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(to right, rgba(200, 182, 138, 0.04) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(200, 182, 138, 0.04) 1px, transparent 1px);
  background-size: 32px 32px;
  pointer-events: none;
  z-index: 0;
}

main > section > .container,
main > header > .container {
  position: relative;
  z-index: 1;
}

.home-selector {
  background: var(--umt-bg-panel);
  border-bottom: 1px solid var(--umt-grid-line);
  padding: var(--space-24) 0;
}

.stats {
  background: var(--umt-bg-deep);
  border-top: 1px solid var(--umt-grid-line-strong);
  border-bottom: 1px solid var(--umt-grid-line-strong);
}

.home-why {
  background: var(--umt-bg-light-olive);
}

.home-news {
  background: var(--umt-bg-mid);
  border-top: 1px solid var(--umt-grid-line);
}

/* CONVENIOS v2: solo el fondo de sección. El diseño de chips lo gestiona pages.css */
.home-conv {
  background: var(--umt-bg-deep);
  border-top: 1px solid var(--umt-grid-line-strong);
  border-bottom: 1px solid var(--umt-grid-line-strong);
  position: relative;
}
.home-conv::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(to right, rgba(200, 182, 138, 0.04) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(200, 182, 138, 0.04) 1px, transparent 1px);
  background-size: 32px 32px;
  pointer-events: none;
}
.home-conv .container { position: relative; z-index: 1; }

/* CTA final: fondo casi negro con la imagen de helicóptero al 18% — más sobrio */
.home-cta {
  background: var(--umt-bg-deep);
  border-top: 1px solid var(--umt-grid-line-strong);
}
.home-cta__bg { opacity: 0.18; }

/* ===== Cards bloque selector — reducir competencia con el meta-overline ===== */
.card-block {
  background: var(--umt-bg-deep);
  border: 1px solid var(--umt-grid-line);
}
.card-block__body {
  background: var(--umt-bg-deep);
  border-top: 1px solid var(--umt-grid-line);
}
.card-block__body .t-mono.color-gold {
  opacity: 0.55;
  font-size: 10px !important;
}
.card-block__title {
  font-size: var(--fs-xl);
  line-height: 1.05;
}
.card-block__copy {
  opacity: 0.75;
}

/* ===== Hero: SE MANTIENE INTACTO. Solo bajamos las scanlines un punto. ===== */
.home-hero .hud-scanlines { opacity: 0.32; }

/* ===== Stats: corchetes dorados más visibles ===== */
.stats__item::before {
  width: 10px;
  height: 10px;
  border-top: 2px solid var(--umt-tactical-gold);
  border-left: 2px solid var(--umt-tactical-gold);
}
.stats__meta { opacity: 0.7; }

/* ===== News list, asoc, servicios: usar nueva paleta ===== */
.news-list { background: var(--umt-bg-deep); }
.article-hero { background: var(--umt-bg-panel); }
.asoc-hero { background: var(--umt-bg-deep); }
.asoc-benefits { background: var(--umt-bg-panel); }
.asoc-form { background: var(--umt-bg-deep); }
.asoc-timeline { background: var(--umt-bg-panel); }
.asoc-faq { background: var(--umt-bg-mid); }
.serv-testimony { background: var(--umt-bg-light-olive); }

/* ===== Footer CTA: contraste reforzado ===== */
.footer__cta {
  background: var(--umt-olive-dark);
  border-top: 1px solid var(--umt-grid-line-strong);
}

/* Responsive ajustes */
@media (max-width: 767px) {
  .v2-section-divider::before { left: var(--space-4); }
}
