/* ======================================================
   BASE.CSS — RESET + GLOBAL (FINAL DEFINITIVO)
   HomeGym Aracena
   Desktop · Android · iOS
====================================================== */

/* ===============================
   RESET MODERNO
================================ */
*,
*::before,
*::after{
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* ===============================
   HTML ROOT
================================ */
html{
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
  text-rendering: optimizeLegibility;
}

/* ===============================
   BODY GLOBAL
================================ */
body{
  font-family: var(--font);
  background: var(--bg);
  color: var(--text);
  min-height: 100vh;
  line-height: 1.5;
  overflow-x: hidden;

  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ===============================
   MEDIA BASE
================================ */
img,
picture,
video,
canvas,
svg{
  display: block;
  max-width: 100%;
  height: auto;
}

/* ===============================
   LINKS
================================ */
a{
  color: inherit;
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
}

/* ===============================
   LISTAS
================================ */
ul,
ol{
  list-style: none;
}

/* ===============================
   BOTONES
================================ */
button{
  font-family: inherit;
  background: none;
  border: none;
  cursor: pointer;
  color: inherit;
  -webkit-tap-highlight-color: transparent;
}

/* ===============================
   FORMULARIOS
================================ */
input,
textarea,
select{
  font-family: inherit;
  background: transparent;
  color: inherit;
  border: none;
  outline: none;
  appearance: none;
  -webkit-appearance: none;
  border-radius: 0;
}

/* ===============================
   CONTAINER GLOBAL (ÚNICO)
================================ */
.container{
  width: min(var(--container), 92%);
  margin-inline: auto;
}

/* ===============================
   TEXTO & HELPERS
================================ */
.neon{
  color: var(--orange);
  text-shadow: var(--neon-glow);
}

.muted{
  color: var(--muted);
}

.center{
  text-align: center;
}

.hidden{
  display: none !important;
}

/* ===============================
   SECCIONES BASE
================================ */
.section{
  padding: 80px 0;
  border-top: 1px solid rgba(255,255,255,.05);
}

/* ===============================
   TÍTULOS BASE
================================ */
h1,
h2,
h3,
h4{
  line-height: 1.1;
  font-weight: 800;
}

/* ===============================
   PÁRRAFOS
================================ */
p{
  max-width: 70ch;
}

/* ===============================
   SELECCIÓN DE TEXTO
================================ */
::selection{
  background: var(--orange);
  color: #000;
}

/* ===============================
   SCROLLBAR (DESKTOP ONLY)
================================ */
@media (hover:hover){
  ::-webkit-scrollbar{
    width: 10px;
  }

  ::-webkit-scrollbar-track{
    background: #050505;
  }

  ::-webkit-scrollbar-thumb{
    background: linear-gradient(
      180deg,
      var(--orange),
      var(--orange-dark)
    );
    border-radius: 999px;
  }
}

/* ===============================
   iOS SAFARI FIXES
================================ */
@supports (-webkit-touch-callout: none){
  body{
    overscroll-behavior-y: none;
  }
}

/* ===============================
   REDUCED MOTION
================================ */
@media (prefers-reduced-motion: reduce){
  *{
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}