/* SPECTRA RENTAL — fondo corporativo de las páginas públicas.
   Mismo lenguaje visual que /acceso-crm: azul, violeta y magenta
   sobre una base nocturna. No afecta la autenticación del CRM. */
:root {
  --black: #05050b;
  --black-2: #0b0c18;
  --surface: #101222;
  --surface-2: #171528;
}

html { background-color: #05050b; }

body[data-page] {
  background-color: #05050b;
  background-image:
    radial-gradient(ellipse 58% 48% at 14% 18%, rgba(0,123,255,.25), transparent 70%),
    radial-gradient(ellipse 55% 48% at 89% 80%, rgba(123,46,255,.29), transparent 72%),
    radial-gradient(ellipse 42% 30% at 65% 8%, rgba(203,44,170,.10), transparent 72%);
  background-attachment: fixed;
  background-repeat: no-repeat;
  color: #f6f6fc;
}

/* Navegación oscura y translúcida, para no distraer de los contenidos. */
body[data-page] .site-header {
  background: rgba(6,7,18,.88);
  border-bottom-color: rgba(150,151,219,.15);
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
}
body[data-page] .nav-service-list {
  background: rgba(12,12,28,.97);
  border-color: rgba(143,147,211,.23);
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
}

/* Capas editoriales que anteriormente ocultaban el fondo con negro plano. */
body[data-page] .section--panel {
  background: linear-gradient(180deg,rgba(19,16,39,.55),rgba(7,9,24,.27));
}
body[data-page] :is(
  .av-audio-brief,
  .av-integration-map,
  .identity-mission,
  .identity-method,
  .led-solutions,
  .contact-services
) {
  background:
    radial-gradient(ellipse at 88% 15%,rgba(113,49,221,.12),transparent 60%),
    linear-gradient(120deg,rgba(10,17,41,.72),rgba(16,9,35,.63));
}
body[data-page] .av-light-editorial {
  background: linear-gradient(180deg,rgba(67,25,112,.18),rgba(9,10,26,.60));
}
body[data-page] .av-home-note {
  background: linear-gradient(110deg,rgba(0,123,255,.09),rgba(123,46,255,.10));
}
body[data-page] .identity-finale {
  background:
    radial-gradient(ellipse at 15% 95%,rgba(0,123,255,.16),transparent 58%),
    radial-gradient(ellipse at 90% 10%,rgba(123,46,255,.20),transparent 54%),
    rgba(8,8,21,.55);
}
body[data-page="home"] .sr-home-values {
  background: linear-gradient(180deg,rgba(8,9,25,.96),rgba(14,10,34,.88));
  border-block-color: rgba(128,117,223,.16);
}

/* Superficies, formularios y tarjetas: tonos de la pantalla Usuario. */
body[data-page] :is(
  .stat,
  .service-row,
  .event-card,
  .led-card,
  .led-service-note,
  .quote-form,
  .faq details,
  .project-feature,
  .contact-capture__form
) {
  background: linear-gradient(145deg,rgba(24,27,49,.88),rgba(9,11,26,.91));
  border-color: rgba(155,157,215,.20);
}
body[data-page] :is(.av-contact-channels a,.contact-secondary__grid a) {
  background: linear-gradient(145deg,rgba(20,23,44,.91),rgba(9,11,26,.93));
}
body[data-page] :is(.av-contact-channels a:hover,.contact-secondary__grid a:hover) {
  background: linear-gradient(145deg,rgba(26,38,74,.94),rgba(30,16,61,.92));
}
body[data-page] :is(.field input,.field select,.field textarea) {
  background: rgba(15,17,35,.96);
  border-color: rgba(169,171,220,.25);
}
body[data-page] :is(.field input,.field select,.field textarea):focus-visible {
  border-color: #799dff;
}
body[data-page] .field select option {background: #101222;}

/* Pie de página acorde al resto del sistema visual. */
body[data-page] .site-footer {
  background:
    radial-gradient(ellipse at 0% 45%,rgba(0,104,229,.13),transparent 60%),
    radial-gradient(ellipse at 100% 65%,rgba(123,46,255,.18),transparent 56%),
    linear-gradient(180deg,rgba(8,9,23,.94),rgba(7,6,18,.98));
  border-top-color: rgba(153,146,223,.20);
}
body[data-page] .corporate-footer {border-top-color: rgba(153,146,223,.18);}
body[data-page] .nav-cta,
body[data-page] .btn--primary {background-image:linear-gradient(110deg,#007bff,#7b2eff);}

/* No reencuadrar ni sustituir el hero fotográfico de Inicio.
   Conservar también los SVG, formularios y botones originales. */
@media (max-width: 980px) {
  body[data-page] .nav-links {
    background: rgba(8,9,24,.98);
    border-bottom-color: rgba(153,146,223,.20);
  }
}
@media (max-width: 680px) {
  body[data-page] {
    background-image:
      radial-gradient(ellipse 95% 43% at 4% 9%,rgba(0,123,255,.23),transparent 75%),
      radial-gradient(ellipse 95% 55% at 100% 85%,rgba(123,46,255,.27),transparent 72%),
      radial-gradient(ellipse 70% 32% at 80% 20%,rgba(203,44,170,.08),transparent 75%);
  }
}