/* ══════════════════════════════════════
   base.css
   Reset, Defaults & Utilities
   ══════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600;700;800;900&family=Open+Sans:wght@400;500;600;700;800&display=swap');

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

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  font-family: 'Open Sans', sans-serif;
  color: var(--text);
  background: var(--white);
  overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Montserrat', sans-serif;
}

body.menu-open {
  overflow: hidden;
}

img {
  max-width: 100%;
  display: block;
}

.container {
  width: min(var(--container-max), 100%);
  margin: 0 auto;
  padding: 0 24px;
}

/* ══════════════════════════════
   MICROINTERACTIONS — Buttons
══════════════════════════════ */
a.hero-btn,
a.cta,
button.esp-tab,
button.conocenos-tab,
.srv-card-btn,
.cta-plan,
.btn-ver-todas,
.srv-header .search-btn {
  transition: transform 0.25s cubic-bezier(.4, 0, .2, 1),
              box-shadow 0.25s cubic-bezier(.4, 0, .2, 1),
              background 0.25s ease;
}

a.hero-btn:active,
a.cta:active,
.srv-card-btn:active,
.cta-plan:active {
  transform: scale(0.97);
}

/* ══════════════════════════════
   ESP CARD TRANSITION
══════════════════════════════ */
.esp-card {
  transition: opacity 0.3s ease, transform 0.3s ease;
}

/* ══════════════════════════════
   REDUCED MOTION
══════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}