/* ==========================================================================
   EVOLUZION MEDIA — Responsive
   ========================================================================== */

@media (max-width: 1024px){
  .cards--4{ grid-template-columns:repeat(2,1fr); }
  .identidad__grid{ grid-template-columns:1fr; gap:56px; }
  .contacto__grid{ grid-template-columns:1fr; gap:48px; }
  .ech__card{ grid-template-columns:1fr; gap:28px; text-align:center; }
  .ech__brand{ align-items:center; }
  .ech__logo-img{ max-width:200px; margin:0 auto; }
  :root{ --section-pad:100px; }
  .hero__grid{ grid-template-columns:1fr; gap:56px; text-align:center; }
  .hero__content{ max-width:100%; margin:0 auto; }
  .hero__content .hero__actions{ justify-content:center; }
  .hero__quote{ margin-left:auto; margin-right:auto; text-align:left; }
  .hero__visual{ order:-1; max-width:280px; margin:0 auto; }
  .identidad__intro{ flex-direction:column; align-items:center; text-align:center; }
  .identidad__photo-frame{ width:200px; flex-basis:auto; }
  .identidad__intro-text{ align-items:center; text-align:left; width:100%; }
  .portfolio-track{ grid-auto-columns:calc((100% - 32px) / 2); }
}

@media (max-width: 860px){
  .nav__links{
    position:fixed;
    top:0; right:0;
    height:100vh;
    width:min(300px, 80vw);
    background:rgba(9,10,13,.97);
    backdrop-filter:blur(18px);
    border-left:1px solid rgba(255,255,255,.08);
    flex-direction:column;
    align-items:flex-start;
    justify-content:flex-start;
    gap:28px;
    padding:100px 32px;
    transform:translateX(100%);
    transition:transform .4s var(--ease);
    box-shadow:-12px 0 30px rgba(0,0,0,.5);
  }
  .nav__links.is-open{ transform:translateX(0); }
  .nav__toggle{ display:flex; }
  .nav__whatsapp{ margin-top:8px; }

  .portfolio-track{ grid-auto-columns:82%; gap:20px; }
  .cursor-glow{ display:none; }
}

@media (max-width: 640px){
  .cards--4{ grid-template-columns:1fr; }
  .hero{ padding-top:130px; }
  .hero__quote{ padding-left:14px; }
  .section__inner{ padding:0 22px; }
  .ech__card{ padding:32px 24px; }
  .contacto__form{ padding:26px; }
  :root{ --section-pad:80px; }
  .fab-group{ bottom:20px; right:20px; gap:10px; }
  .fab--brand{ width:48px; height:48px; }
  .fab--ghost{ width:40px; height:40px; }
}
