/* ============================================
   AXIS Business Hub - Base
   Reset basico, tipografia, helpers
   Solo aplica dentro de .axis-page
   ============================================ */

.axis-page,
.axis-page * {
  box-sizing: border-box;
}

.axis-page {
  font-family: var(--axis-font-sans);
  font-size: var(--axis-fs-body);
  line-height: 1.6;
  color: var(--axis-ink);
  background: var(--axis-offwhite);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

.axis-page img {
  max-width: 100%;
  height: auto;
  display: block;
}

.axis-page h1,
.axis-page h2,
.axis-page h3,
.axis-page h4 {
  margin: 0;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -0.01em;
  color: var(--axis-night-2);
}

.axis-page h1 { font-size: var(--axis-fs-h1); }
.axis-page h2 { font-size: var(--axis-fs-h2); }
.axis-page h3 { font-size: var(--axis-fs-h3); }

.axis-page p { margin: 0 0 var(--axis-space-4); }

.axis-page a {
  color: var(--axis-inmo-primary);
  text-decoration: none;
  transition: color var(--axis-dur) var(--axis-ease);
}
.axis-page a:hover { color: var(--axis-inmo-primary-900); }

.axis-page button { font-family: inherit; cursor: pointer; }

.axis-page ul, .axis-page ol { margin: 0; padding: 0; list-style: none; }
.axis-page dl, .axis-page dt, .axis-page dd { margin: 0; }

/* Focus visible consistente */
.axis-page :focus-visible {
  outline: 3px solid var(--axis-gold);
  outline-offset: 3px;
  border-radius: var(--axis-radius-sm);
}

/* Skip link */
.axis-skip {
  position: absolute;
  top: -100px;
  left: 12px;
  background: var(--axis-night);
  color: var(--axis-white);
  padding: 12px 18px;
  border-radius: var(--axis-radius-md);
  z-index: 9999;
  transition: top var(--axis-dur) var(--axis-ease);
}
.axis-skip:focus { top: 12px; color: var(--axis-white); }

/* ---------- Contenedor ---------- */
.axis-container {
  width: 100%;
  max-width: var(--axis-container-max);
  margin: 0 auto;
  padding: 0 var(--axis-container-pad);
}

/* ---------- Helpers ---------- */
.axis-eyebrow {
  display: inline-block;
  font-size: var(--axis-fs-eyebrow);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: var(--axis-gold-dark);
  margin-bottom: var(--axis-space-3);
}
.axis-page .axis-eyebrow--light { color: var(--axis-gold-light); }

.axis-h2 {
  font-family: var(--axis-font-display);
  font-weight: 600;
  font-size: var(--axis-fs-h2);
  letter-spacing: -0.015em;
  margin-bottom: var(--axis-space-4);
  color: var(--axis-night-2);
}
.axis-page .axis-h2--light { color: var(--axis-white); }

.axis-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 14px;
  font-size: var(--axis-fs-eyebrow);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  border-radius: var(--axis-radius-pill);
  background: rgba(199, 163, 109, 0.15);
  color: var(--axis-gold-light);
  border: 1px solid var(--axis-line);
}
.axis-pill--gold {
  background: var(--axis-gold);
  color: var(--axis-night-2);
  border-color: transparent;
}

/* Honeypot */
.axis-honeypot {
  position: absolute !important;
  left: -9999px;
  top: -9999px;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  .axis-page *, .axis-page *::before, .axis-page *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}