.hero-code{background-image:linear-gradient(90deg,rgba(0,0,0,.92) 0%,rgba(0,0,0,.65) 28%,rgba(0,0,0,.06) 62%),url('../assets/hero-photo-clean-v3.webp')!important}.premium-resolve{background-image:url('../assets/resolve-premium-render.webp')!important}.modal-art{background-image:linear-gradient(180deg,rgba(5,8,10,.74),rgba(5,8,10,.97)),url('../assets/resolve-premium-render.webp')!important}

/* Ajustes finales solicitados: Outfit global, tipografía legible y navegación responsive. */
html,
body,
body *,
button,
input,
select,
textarea {
  font-family: Outfit, Arial, sans-serif !important;
}

html {
  scroll-padding-top: 116px;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 1000;
}

.wa-icon {
  width: 22px;
  height: 22px;
  flex: none;
  fill: currentColor;
}

.hero-whatsapp-side .wa-icon {
  width: 18px;
  height: 18px;
}

.whatsapp-float .wa-icon {
  width: 25px;
  height: 25px;
}

/* Equipo: incremento mínimo de 4 px. */
.mock-equipment .section-heading span,
.mock-equipment .section-heading > a {
  font-size: 14px;
}

.mock-equipment .section-heading h2 {
  font-size: 30px;
}

.mock-equipment .equip-grid b {
  font-size: 17px;
  line-height: 1.08;
}

.mock-equipment .equip-grid small {
  font-size: 12px;
  line-height: 1.35;
}

/* Proyectos: incremento mínimo de 4 px. */
.mock-projects .section-heading span,
.mock-projects .section-heading > a {
  font-size: 14px;
}

.mock-projects .section-heading h2 {
  font-size: 30px;
}

.mock-projects .project-grid b {
  font-size: 25px;
}

.mock-projects .project-grid small {
  font-size: 14px;
  line-height: 1.3;
}

.mock-projects .project-grid em,
.mock-projects .project-grid a,
.mock-projects mark {
  font-size: 13px;
}

/* Bloque “No solo construimos”: incremento mínimo de 4 px. */
.premium-resolve .eyebrow {
  font-size: 14px;
}

.premium-resolve h2 {
  font-size: 43px;
}

.premium-resolve p {
  font-size: 16px;
  line-height: 1.5;
}

.premium-resolve .mini b {
  font-size: 16px;
}

.premium-resolve .mini small {
  font-size: 13px;
  line-height: 1.35;
}

@media (max-width: 900px) {
  .premium-resolve {
    min-height: 660px;
  }
}

@media (max-width: 800px) {
  html {
    scroll-padding-top: 74px;
  }

  .site-header {
    z-index: 1000;
  }

  .site-header .hamb {
    position: relative;
    z-index: 1030;
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    padding: 0;
    cursor: pointer;
    transition: color 0.25s, transform 0.25s;
  }

  .site-header .hamb:hover,
  .site-header .hamb:focus-visible {
    color: #ff5319;
  }

  .site-header nav {
    display: flex;
    position: fixed;
    inset: 0 auto 0 0;
    width: min(84vw, 380px);
    height: 100dvh;
    margin: 0;
    padding: 104px 26px 34px;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0;
    background: #050505;
    box-shadow: 18px 0 55px rgba(0, 0, 0, 0.42);
    transform: translateX(-105%);
    visibility: hidden;
    transition: transform 0.38s cubic-bezier(0.22, 0.8, 0.3, 1), visibility 0s linear 0.38s;
    overflow-y: auto;
    z-index: 1020;
  }

  .site-header nav.open {
    display: flex;
    transform: translateX(0);
    visibility: visible;
    transition-delay: 0s;
  }

  .site-header nav a {
    display: block;
    padding: 17px 6px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    font-size: 18px;
    line-height: 1.2;
    transition: color 0.2s, padding-left 0.2s;
  }

  .site-header nav a::after {
    display: none;
  }

  .site-header nav a:hover,
  .site-header nav a.active {
    padding-left: 14px;
    color: #ff5319;
  }

  .nav-wa {
    display: flex;
    width: 48px;
    height: 48px;
    padding: 0;
    border-radius: 50%;
  }

  .nav-wa-label {
    display: none;
  }

  body.menu-open {
    overflow: hidden;
  }

  body.menu-open::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 990;
    background: rgba(0, 0, 0, 0.58);
    backdrop-filter: blur(2px);
  }
}

@media (max-width: 560px) {
  .premium-resolve {
    min-height: 780px;
  }

  .premium-resolve .mini {
    gap: 14px;
  }
}

@media (max-width: 480px) {
  .nav-wa {
    display: flex;
  }
}

@media (prefers-reduced-motion: reduce) {
  .site-header nav,
  .site-header .hamb {
    transition-duration: 0.01ms;
  }
}
