/* ============================================================
   MD Solutions — Estilos responsivos
   Breakpoints: 1024px (laptop) · 860px (tablet) · 640px (móvil)
============================================================ */

/* ---------- Laptop / tablet grande ---------- */
@media (max-width: 1024px) {
  .section, .cta, .showcase { padding: 88px 0; }

  .services-grid { grid-template-columns: repeat(2, 1fr); }

  .features-grid,
  .features-grid--4,
  .projects-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .mvp-grid { grid-template-columns: 1fr; max-width: 560px; margin-inline: auto; }

  .split, .story { gap: 48px; }

  .timeline { grid-template-columns: repeat(4, 1fr); gap: 32px 18px; }
  .timeline::before { display: none; }

  .contact__layout {
    grid-template-columns: 1fr;
    gap: 56px;
  }

  .cta__card { padding: 70px 36px; }

  /* Anillo 3D un poco más pequeño */
  .scene { height: 440px; }
  .ring-card {
    width: 260px; height: 330px;
    margin: -165px 0 0 -130px;
  }
}

/* ---------- Tablet ---------- */
@media (max-width: 860px) {
  /* Menú móvil */
  .navbar__cta { display: none; }

  .navbar__toggle { display: flex; }

  .navbar__links {
    position: fixed;
    top: var(--nav-h);
    left: 0; right: 0;
    flex-direction: column;
    align-items: stretch;
    gap: 4px;
    padding: 18px 24px 26px;
    background: rgba(2, 6, 23, .95);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    border-bottom: 1px solid var(--border-glass);
    transform: translateY(-12px);
    opacity: 0;
    visibility: hidden;
    transition: transform .3s var(--ease), opacity .3s, visibility .3s;
  }
  .navbar__links.is-open {
    transform: translateY(0);
    opacity: 1;
    visibility: visible;
  }
  .nav-link { padding: 13px 16px; font-size: 1rem; border-radius: 12px; }
  .nav-link.is-active { border: none; }

  .hero__shape--ring { display: none; }

  /* Splits apilados */
  .split, .split--reverse { grid-template-columns: 1fr; }
  .split--reverse .split__text  { order: 1; }
  .split--reverse .split__media { order: 2; }
  .split__media { max-width: 520px; }

  .story { grid-template-columns: 1fr; }

  .team-grid { grid-template-columns: 1fr; max-width: 420px; margin-inline: auto; }

  .timeline { grid-template-columns: repeat(2, 1fr); }

  .footer__grid {
    grid-template-columns: 1fr 1fr;
    gap: 40px 28px;
  }
}

/* ---------- Móvil ---------- */
@media (max-width: 640px) {
  .section, .cta, .showcase { padding: 68px 0; }
  .section__head { margin-bottom: 44px; }

  .container { padding-inline: 20px; }

  .hero__content { padding-top: calc(var(--nav-h) + 32px); padding-bottom: 72px; }
  .hero__actions .btn { width: 100%; }

  .page-hero { padding: calc(var(--nav-h) + 56px) 0 56px; }

  /* Anillo 3D compacto */
  .scene { height: 400px; perspective: 1100px; }
  .ring-card {
    width: 225px; height: 305px;
    margin: -152px 0 0 -112px;
    padding: 26px 22px;
  }
  .ring-card__icon { width: 50px; height: 50px; }
  .showcase__hint { display: none; }

  .services-grid,
  .features-grid,
  .features-grid--4,
  .projects-grid {
    grid-template-columns: 1fr;
  }

  .timeline { grid-template-columns: 1fr; gap: 24px; }
  .timeline__step { display: grid; grid-template-columns: 44px 1fr; gap: 4px 18px; text-align: left; }
  .timeline__num { grid-row: span 2; margin: 0; }

  .vtimeline { padding-left: 28px; }

  .form__row { grid-template-columns: 1fr; gap: 0; }
  .contact__form-wrap { padding: 28px 22px; }

  .accordion__item summary { padding: 17px 48px 17px 18px; font-size: .95rem; }
  .accordion__content { padding: 0 18px; }

  .cta__card { padding: 56px 24px; border-radius: 24px; }
  .cta__actions .btn { width: 100%; }

  .filters { gap: 8px; margin-bottom: 36px; }
  .chip { padding: 8px 16px; font-size: .82rem; }

  .footer { padding: 56px 0 24px; }
  .footer__grid { grid-template-columns: 1fr; gap: 34px; }
  .footer__bottom { flex-direction: column; text-align: center; }

  .back-to-top { right: 18px; bottom: 18px; }
}
