/* ===================================================================
   FPI — responsive.css
   Mobile First → Tablet → Desktop → UltraWide
   =================================================================== */

/* ---------- BASE MÓVIL (< 640px) ---------- */
.nav-links { display: none; }
.nav-toggle { display: block; }

.nav-links.is-open {
  display: flex;
  position: fixed;
  inset: 0;
  z-index: 205;
  background: rgba(8,16,30,0.98);
  backdrop-filter: blur(10px);
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 2.2rem;
  height: 100svh;
}
.nav-links.is-open a { font-size: 1.3rem; }

.hero {
  padding-top: 96px;
  min-height: 100svh;
  padding-bottom: 4rem;
}
.hero-content { padding-inline: 20px; }
.hero-text { max-width: 100%; }
.hero-title { font-size: clamp(2.2rem, 8vw, 3.2rem); }
.hero-overlay {
  background: linear-gradient(
    160deg,
    rgba(8,16,30,0.92) 0%,
    rgba(8,16,30,0.80) 55%,
    rgba(8,16,30,0.55) 100%
  );
}
.scroll-cue { display: none; }

.about-grid { grid-template-columns: 1fr; }
.about-visual { order: -1; aspect-ratio: 16/10; }
.pillars { grid-template-columns: 1fr; }

.services-grid { grid-template-columns: 1fr 1fr; }
.hero-title { font-size: clamp(3.2rem, 12vw, 5rem); }

.grow-grid { grid-template-columns: 1fr; }
.grow-img-wrap { order: -1; aspect-ratio: 16/9; }

.contact-grid { grid-template-columns: 1fr; }
.form-row { grid-template-columns: 1fr; }

.footer-inner { flex-direction: column; align-items: flex-start; }
.footer-links { flex-wrap: wrap; }

.wa-float { width: 50px; height: 50px; bottom: 18px; right: 18px; }
.wa-float svg { width: 24px; height: 24px; }

/* ---------- TABLET (≥ 640px) ---------- */
@media (min-width: 640px) {
  .grow-stats { grid-template-columns: 1fr 1fr; }
  .pillars { grid-template-columns: 1fr 1fr; }
  .form-row { grid-template-columns: 1fr 1fr; }
}

/* ---------- TABLET GRANDE / LAPTOP PEQUEÑA (≥ 860px) ---------- */
@media (min-width: 860px) {
  .nav-links { display: flex; }
  .nav-toggle { display: none; }
  .nav-links.is-open { position: static; display: flex; background: none; height: auto; flex-direction: row; }
  .nav-links.is-open a { font-size: 0.87rem; }

  .hero {
    min-height: 100svh;
    padding-bottom: 0;
  }
  .hero-content { padding-inline: var(--edge); }
  .hero-text { max-width: 620px; }
  .hero-overlay {
    background: linear-gradient(
      100deg,
      rgba(8,16,30,0.88) 0%,
      rgba(8,16,30,0.78) 42%,
      rgba(8,16,30,0.45) 72%,
      rgba(8,16,30,0.15) 100%
    );
  }
  .scroll-cue { display: flex; }

  .about-grid { grid-template-columns: 0.95fr 1.05fr; }
  .about-visual { order: 0; aspect-ratio: 4/5; }

  .services-grid { grid-template-columns: repeat(2, 1fr); }
  .hero-title { font-size: clamp(4rem, 8vw, 7rem); }

  .grow-grid { grid-template-columns: 1fr 1fr; }
  .grow-img-wrap { order: 0; aspect-ratio: 4/3; }

  .contact-grid { grid-template-columns: 0.85fr 1.15fr; }

  .footer-inner { flex-direction: row; align-items: center; }
}

/* ---------- DESKTOP (≥ 1180px) ---------- */
@media (min-width: 1180px) {
  .services-grid { grid-template-columns: repeat(4, 1fr); }
}

/* ---------- ULTRAWIDE (≥ 1700px) ---------- */
@media (min-width: 1700px) {
  .container { max-width: 1640px; }
  :root { --edge: clamp(24px, 8vw, 160px); }
  .services-grid { grid-template-columns: repeat(4, 1fr); }
  .hero-title { font-size: 9rem; }
}

/* ---------- MÓVIL MUY PEQUEÑO (≤ 380px) ---------- */
@media (max-width: 380px) {
  :root { --edge: 18px; }
  .hero-title { font-size: 2.3rem; }
  .btn { padding: 0.85rem 1.4rem; font-size: 0.85rem; }
}

/* ---------- ABOUT GRID 2 — responsive ---------- */
.about-grid2 { grid-template-columns: 1fr; }

@media (min-width: 860px) {
  .about-grid2 { grid-template-columns: 1fr 1fr; }
}