/* base.css — variables, reset y estilos globales de Instituto EDUCA */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body{ margin:0; font-family:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif; color:#0f172a; background:#fff; }
img{ max-width:100%; }
a{ color:inherit; }

img{ height:auto; }

/* Tipografía de titulares compartida */
h1,h2,h3,h4,h5,h6,[class*='title'],[class*='kicker'],[class*='step-num'],[class*='badge'],[class*='stat']{
  font-family:'Nunito Sans',system-ui,sans-serif;
}

/* ---------- Pulido y accesibilidad ---------- */
html{ scroll-behavior:smooth; }
/* Que el header fijo no tape las secciones al saltar a un ancla */
[id]{ scroll-margin-top:96px; }

/* Foco visible solo para navegación por teclado */
:focus-visible{
  outline:3px solid #2563eb;
  outline-offset:2px;
  border-radius:4px;
}
:focus:not(:focus-visible){ outline:none; }

/* Selección de texto con color de marca */
::selection{ background:#1d4ed8; color:#fff; }

/* Enlace para saltar al contenido (accesibilidad) */
.skip-link{
  position:absolute; left:12px; top:-60px; z-index:2147483647;
  background:#1d4ed8; color:#fff; padding:10px 16px; border-radius:10px;
  font-weight:700; text-decoration:none; transition:top .2s ease;
}
.skip-link:focus{ top:12px; }

/* Micro-animaciones: aparición al hacer scroll (las activa js/anim.js) */
.educa-reveal{
  opacity:0;
  transform:translateY(22px);
  transition:opacity .6s ease, transform .6s cubic-bezier(.22,.61,.36,1);
  will-change:opacity, transform;
}
.educa-reveal.educa-in{ opacity:1; transform:none; }

/* Respetar a quienes prefieren menos movimiento */
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
}