/* ============================================================
   AXFIT — maintenance.css
   Hoja de estilos independiente y ligera para la página de
   "sitio en construcción" (index.html). No depende de styles.css
   a propósito, para que cargue lo más rápido posible.
   ============================================================ */

:root{
  --navy-950:#0a1526;
  --navy-900:#0d1b2e;
  --blue-600:#2166a3;
  --blue-700:#1a4d80;
  --teal:#1fb5a3;
  --teal-light:#5fd6c4;
  --slate-300:#c3ccd4;
  --font-display:'Space Grotesk', sans-serif;
  --font-body:'Inter', sans-serif;
  --font-mono:'JetBrains Mono', monospace;
}

*{margin:0;padding:0;box-sizing:border-box;}

body{
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--navy-950);
  font-family:var(--font-body);
  color:#fff;
  overflow:hidden;
  position:relative;
}

.bg-glow{
  position:fixed;
  inset:0;
  background:
    radial-gradient(900px 600px at 15% 15%, rgba(33,102,163,0.35), transparent 60%),
    radial-gradient(800px 600px at 85% 85%, rgba(31,181,163,0.25), transparent 60%);
  z-index:0;
}

.wrap{
  position:relative;
  z-index:1;
  max-width:640px;
  padding:40px 28px;
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
}

.logo{
  height:240px;
  width:auto;
  margin-bottom:36px;
  filter:brightness(0) invert(1);
}

.eyebrow{
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--teal-light);
  font-weight:500;
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-bottom:18px;
}
.eyebrow::before{
  content:"";
  width:16px;height:1px;
  background:var(--teal-light);
  display:inline-block;
}

h1{
  font-family:var(--font-display);
  font-weight:600;
  font-size:clamp(30px, 5vw, 46px);
  line-height:1.15;
  letter-spacing:-0.01em;
  margin-bottom:20px;
}
h1 .accent{
  background:linear-gradient(100deg, var(--blue-400, #5a9fd4), var(--teal) 85%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.lead{
  font-size:16.5px;
  line-height:1.6;
  color:var(--slate-300);
  max-width:460px;
  margin-bottom:34px;
}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:14px 28px;
  border-radius:999px;
  font-weight:600;
  font-size:15px;
  text-decoration:none;
  color:var(--navy-950);
  background:var(--teal);
  box-shadow:0 8px 24px -8px rgba(31,181,163,0.5);
  transition:transform .25s ease;
}
.btn:hover{transform:translateY(-2px);}
.btn:focus-visible{outline:2px solid var(--teal-light);outline-offset:3px;}

.footer-note{
  margin-top:56px;
  font-family:var(--font-mono);
  font-size:11.5px;
  color:rgba(195,204,212,0.5);
}

@media (max-width:520px){
  .logo{height:64px;margin-bottom:28px;}
  .footer-note{margin-top:40px;}
}

@media (prefers-reduced-motion: reduce){
  *{transition-duration:0.001ms !important;}
}