/* ===== Base / Reset mínimo (sin variables) ===== */
/* === Editables rápidos ===
   Colores:            #0f172a (texto), #64748b (muted), #e2e8f0 (bordes), #6d28d9 (brand), #5b21b6 (brand hover), #f8fafc (surface), #fff (bg)
   Container máx:      1200px
   Espaciados:         4, 8, 12, 16, 20, 24
   Sombra:             0 6px 20px rgba(2, 6, 23, 0.06)
*/

* { box-sizing: border-box; }
html, body { height: 100%; }
html { scroll-behavior: smooth; }

body{
  margin: 0;
  color: #0f172a;                 /* texto */
  background: #ffffff;            /* fondo */
  font: 16px/1.55 system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji","Segoe UI Emoji";
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; margin: 0; padding: 0; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }

/* Skip link */
.skip-link{
  position: absolute; left: -9999px; top: auto;
  width: 1px; height: 1px; overflow: hidden;
}
.skip-link:focus{
  left: 12px; top: 12px; width: auto; height: auto;
  background: #000; color: #fff; padding: 8px 10px; border-radius: 8px;
}

/* Botones genéricos */
.btn{
  display: inline-flex; align-items: center; justify-content: center;
  padding: 10px 16px;
  border-radius: 14px;                     /* radio */
  border: 1px solid #e2e8f0;               /* borde */
  font-weight: 600; text-decoration: none;
  transition: transform .05s ease, box-shadow .2s ease;
  box-shadow: 0 6px 20px rgba(2, 6, 23, 0.06);  /* sombra */
}
.btn:active{ transform: translateY(1px); }

.btn--primary{
  background: #6d28d9; color: #fff; border-color: transparent;
}
.btn--primary:hover{ background: #5b21b6; }
.btn--ghost{
  background: transparent; color: #0f172a;
}

@media (prefers-reduced-motion: reduce){
  .btn{ transition: none; }
}


.small{ font-size: 13px; color:#64748b; margin:6px 0 0; }