/* =====================================================================
   SECTORES · paleta brasa (sustituye el azul en las 4 páginas de sector)
   Cargada la última en views/pages/sectores/detalle.php.

   1) --accent deja de ser azul: todos los var(--accent) de estas páginas
      (textos, bordes, fondos de botón, barras, gradientes) pasan a
      naranja encendido sin tocar las hojas compartidas.
   2) El .muted del H1 del hero se enciende con el efecto de "empresas"
      del home: degradado de brasa vivo con vaivén. Rango CLARO porque
      los heros de sector van sobre fondo oscuro.
   ===================================================================== */

.gd-page.ind-page,
.gd-page.corp-page,
.gd-page.inmo-page,
.gd-page.sport-page {
  --accent: #E8501F;
}

/* Azul hardcodeado en deporte que no pasa por la variable */
.gd-page.sport-page .class-card__level.is-l2 {
  color: #E8501F;
  border-color: #E8501F;
  background: rgba(232, 80, 31, 0.08);
}

/* Hero: lo gris, encendido */
.gd-page.ind-page .hero h1 .muted,
.gd-page.corp-page .hero h1 .muted,
.gd-page.inmo-page .hero h1 .muted,
.gd-page.sport-page .hero h1 .muted {
  color: #FF7B3B;
  background: linear-gradient(100deg, #E8501F 0%, #FF7B3B 45%, #FFB06B 100%);
  background-size: 200% 100%;
  background-position: 0% 50%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: sectEmber 5s ease-in-out infinite alternate;
}

/* H2 bicolor: lo gris, encendido con el efecto de "empresas".
   Industrial y corporativo titulan sobre fondo claro → rango oscuro;
   inmobiliaria y deporte sobre fondo oscuro → rango claro. */
.gd-page.ind-page .section-title .muted,
.gd-page.corp-page .section-title .muted {
  color: #C93312;
  font-weight: inherit; /* mismo peso que la parte oscura del H2 */
  background: linear-gradient(100deg, #8F1D0A 0%, #C93312 35%, #FF7B3B 68%, #FF9754 100%);
  background-size: 200% 100%;
  background-position: 0% 50%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: sectEmber 5s ease-in-out infinite alternate;
}
.gd-page.inmo-page .section-title .muted,
.gd-page.sport-page .section-title .muted {
  color: #FF7B3B;
  font-weight: inherit; /* mismo peso que la parte blanca del H2 */
  background: linear-gradient(100deg, #E8501F 0%, #FF7B3B 45%, #FFB06B 100%);
  background-size: 200% 100%;
  background-position: 0% 50%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: sectEmber 5s ease-in-out infinite alternate;
}

/* CTA final: badges (Email / WhatsApp / Formulario) con borde en brasa,
   igual que en el home */
.gd-page.ind-page .contact-row,
.gd-page.corp-page .contact-row,
.gd-page.inmo-page .contact-row,
.gd-page.sport-page .contact-row {
  border-color: #FF5A1F;
}
.gd-page.ind-page .contact-row:hover,
.gd-page.corp-page .contact-row:hover,
.gd-page.inmo-page .contact-row:hover,
.gd-page.sport-page .contact-row:hover {
  border-color: #FF8A47;
  background: rgba(255, 90, 31, 0.08);
}

/* ═══ HERO EDITORIAL (oct-2026) · como las soluciones ══════════════
   Titular gigante y prieto con el .muted encendido (definido arriba)
   y el summary descolgado a la derecha. Pisa el "H1 reducido" de la
   hoja de cada sector: esta carga la última. */
.gd-page.ind-page .hero h1,
.gd-page.corp-page .hero h1,
.gd-page.inmo-page .hero h1,
.gd-page.sport-page .hero h1 {
  font-size: clamp(2.6rem, 6.8vw, 7rem);
  font-weight: 600;
  letter-spacing: -0.045em;
  line-height: 1.01;
  max-width: 1100px;
  margin-left: -0.02em; /* side bearing óptico, como el index */
}
.gd-page.ind-page .hero h1 .muted,
.gd-page.corp-page .hero h1 .muted,
.gd-page.inmo-page .hero h1 .muted,
.gd-page.sport-page .hero h1 .muted {
  font-weight: inherit;
}
.gd-page.ind-page .hero-summary,
.gd-page.corp-page .hero-summary,
.gd-page.inmo-page .hero-summary,
.gd-page.sport-page .hero-summary {
  margin-left: auto;
  margin-top: clamp(2rem, 5vh, 3.5rem);
  max-width: 38ch;
}
@media (max-width: 900px) {
  .gd-page.ind-page .hero-summary,
  .gd-page.corp-page .hero-summary,
  .gd-page.inmo-page .hero-summary,
  .gd-page.sport-page .hero-summary { margin-left: 0; max-width: 46ch; }
}

@keyframes sectEmber {
  from { background-position: 0% 50%; }
  to   { background-position: 100% 50%; }
}

@media (prefers-reduced-motion: reduce) {
  .gd-page.ind-page .hero h1 .muted,
  .gd-page.corp-page .hero h1 .muted,
  .gd-page.inmo-page .hero h1 .muted,
  .gd-page.sport-page .hero h1 .muted,
  .gd-page.ind-page .section-title .muted,
  .gd-page.corp-page .section-title .muted,
  .gd-page.inmo-page .section-title .muted,
  .gd-page.sport-page .section-title .muted { animation: none; }
}
