/* Estilos base para la página en construcción */
:root{
  --bg: #0f172a; /* slate-900 */
  --fg: #e2e8f0; /* slate-200 */
  --muted: #94a3b8; /* slate-400 */
  --accent: #a3e635; /* lime-400 */
  --maxw: 64rem;
  --pad: 1.25rem;
  --radius: 1rem;
}
*{box-sizing:border-box}
body{
  margin:0; font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  background: radial-gradient(1200px 600px at 70% -10%, #1e293b 0%, var(--bg) 40%) fixed;
  color: var(--fg);
  min-height:100svh; display:flex; flex-direction:column;
}
#site-header, #site-footer{padding: var(--pad); max-width: var(--maxw); margin: 0 auto; width: 100%;}
#site-header a{color: var(--fg); text-decoration: none; font-weight: 600;}
.container{flex:1; display:grid; place-items:center; padding: clamp(2rem, 5vw, 6rem);}
.hero{
  text-align:center; padding: clamp(2rem, 5vw, 4rem); border: 1px solid rgba(226,232,240,.08);
  border-radius: var(--radius); backdrop-filter: blur(8px);
  background: linear-gradient(180deg, rgba(148,163,184,.08), transparent);
  box-shadow: 0 10px 30px rgba(0,0,0,.25);
}
.hero h1{font-size: clamp(1.75rem, 2.5vw, 3rem); margin: 0 0 .5rem;}
.hero p{color: var(--muted); margin:.25rem 0;}