/* ==========================================================================
   Reset/normalización + estilos base y utilidades
   Contiene: reset básico, body/typography, helpers (.container), botones (.btn),
             clases de accesibilidad (.sr-only) y utilidades genéricas.
   No incluye: estilos específicos de secciones o del header.
   ========================================================================== */


/* Reset + base */
*,*::before,*::after{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;background:var(--bg);color:var(--text-1);
  font-family:var(--font-sans);font-size:20px;line-height:1.6;
  overflow-x:hidden;
}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}

/* Utilidades y componentes genéricos */
.container{width:100%;max-width:var(--container);margin:0 auto;padding:0 24px}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:12px 18px;border-radius:12px;border:1px solid var(--line);
  background:var(--panel);transition:transform var(--dur) var(--ease),border-color var(--dur),background var(--dur);
  font-size:1rem;color:#fff;
}
.btn:hover{transform:translateY(-1px);border-color:#eef0ff;background:var(--panel-2)}
.btn.primary{border:none;color:#fff;font-weight:900;background:linear-gradient(180deg,var(--accent),var(--accent-600))}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}