/* ==========================================================
   I-GSE | Estilos base
   ========================================================== */
html { scroll-behavior: smooth; scroll-padding-top: var(--ig-nav-h); overflow-x: hidden; }
@supports (overflow: clip) { html, body { overflow-x: clip; } }

body {
  background-color: var(--ig-night);
  color: var(--ig-text);
  font-family: var(--ig-font-body);
  font-size: 1rem;
  line-height: 1.7;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, .font-title {
  font-family: var(--ig-font-title);
  color: var(--ig-heading);
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -.01em;
}

a { color: var(--ig-primary); text-decoration: none; transition: color .25s var(--ig-ease); }
a:hover { color: var(--ig-heading); }

::selection { background: var(--ig-primary); color: var(--ig-night); }

img { max-width: 100%; height: auto; }

/* Logo: PNG blanco con transparencia -> siempre sobre fondo oscuro */
.brand-logo {
  display: block;
  height: auto;
  background: transparent;
  filter: drop-shadow(0 0 12px rgba(63, 162, 246, .25));
}

section { position: relative; padding: 6.5rem 0; }
@media (max-width: 767.98px) { section { padding: 4.5rem 0; } }

.text-gradient {
  background: var(--ig-grad-brand);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.text-soft { color: var(--ig-text-soft) !important; }

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .35rem .9rem;
  font-size: .78rem;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ig-primary);
  background: rgba(63, 162, 246, .08);
  border: 1px solid rgba(63, 162, 246, .25);
  border-radius: 50rem;
}

.section-title { font-size: clamp(1.9rem, 1.2rem + 2.4vw, 3rem); margin: 1rem 0; }
.section-lead  { max-width: 640px; font-size: 1.08rem; }

/* Scrollbar */
::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: var(--ig-night); }
::-webkit-scrollbar-thumb { background: var(--ig-surface); border-radius: 10px; }
::-webkit-scrollbar-thumb:hover { background: var(--ig-primary-dark); }

/* Accesibilidad */
.skip-link {
  position: absolute; left: 1rem; top: -60px; z-index: 2000;
  padding: .6rem 1rem; background: var(--ig-primary); color: var(--ig-night);
  border-radius: .5rem; font-weight: 600;
}
.skip-link:focus { top: 1rem; color: var(--ig-night); }
:focus-visible { outline: 2px solid var(--ig-primary); outline-offset: 3px; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

.text-heading { color: var(--ig-heading) !important; }

/* Zonas que siempre son oscuras (pie de página y franjas CTA), en ambos temas */
.ig-footer, .cta-band, .theme-dark-zone {
  --ig-heading: #FFFFFF;
  --ig-text: #A9AABA;
  --ig-text-soft: #C6C7D5;
  --ig-glass: rgba(255, 255, 255, .05);
  --ig-border: rgba(255, 255, 255, .12);
  --ig-border-2: rgba(255, 255, 255, .22);
  --ig-primary: #3FA2F6;
  color: var(--ig-text);
}