/* =========================================================
   EfrainVillagran.net — Sitio completo
   responsive.css — media queries + menú móvil
   ========================================================= */

@media (max-width: 1180px){
  .benefits-grid{grid-template-columns:repeat(2,1fr);}
  .services-grid{grid-template-columns:repeat(2,1fr);}
  .pricing-grid{grid-template-columns:repeat(2,1fr);}
  .pricing-grid.pricing-grid-6{grid-template-columns:repeat(2,1fr);}
  .pricing-grid.pricing-grid-3{grid-template-columns:repeat(2,1fr);max-width:640px;}
  .pricing-grid.pricing-grid-2{grid-template-columns:repeat(2,1fr);max-width:640px;}
  .work-web-grid{grid-template-columns:1fr 1fr;}
  .work-logos-grid{grid-template-columns:repeat(4,1fr);}
  .stats-grid{grid-template-columns:repeat(2,1fr);gap:28px;}
  .region-grid{grid-template-columns:1fr 1fr;}
  .dc-gallery{grid-template-columns:repeat(2,1fr);}
}

@media (max-width: 1140px){
  .main-nav{
    position:fixed;top:96px;right:0;bottom:0;
    width:100%;max-width:400px;
    background:var(--white);
    padding:10px 24px 40px;
    overflow-y:auto;
    transform:translateX(100%);
    transition:transform .32s var(--ease);
    z-index:190;
    box-shadow:-8px 0 40px rgba(10,36,88,.12);
  }
  .main-nav.open{transform:translateX(0);}
  .main-nav > ul{flex-direction:column;align-items:stretch;gap:0;}
  .main-nav > ul > li{border-bottom:1px solid var(--gray-100);}
  .nav-link{padding:17px 6px;font-size:16px;justify-content:space-between;border-radius:0;}
  .nav-link::after{display:none;}
  .nav-link:hover{background:none;}
  .dropdown-menu{
    position:static;opacity:1;visibility:visible;transform:none;
    box-shadow:none;border:none;border-top:none;padding:0 0 10px 12px;
    max-height:0;overflow:hidden;transition:max-height .3s var(--ease);
  }
  .has-dropdown.open .dropdown-menu{max-height:400px;}
  .dropdown-menu li a:hover, .dropdown-menu li .submenu-trigger:hover{padding-left:18px;}
  .submenu{
    position:static;opacity:1;visibility:visible;transform:none;
    box-shadow:none;border:none;border-top:none;margin-left:0;padding:0 0 6px 14px;
    max-height:0;overflow:hidden;transition:max-height .3s var(--ease);
  }
  .has-submenu.open .submenu{max-height:200px;}
  .nav-mobile-toggle{display:flex;}
  .nav-mobile-toggle.open{background:var(--gray-100);}
  .nav-mobile-toggle.open span{background:transparent;}
  .nav-mobile-toggle.open span::before{transform:translateY(6px) rotate(45deg);}
  .nav-mobile-toggle.open span::after{transform:translateY(-6px) rotate(-45deg);}

  .who-grid{grid-template-columns:1fr;gap:40px;}
  .who-photo{max-width:360px;margin:0 auto;}
  .contact-grid{grid-template-columns:1fr;gap:40px;}
  .hub-grid{grid-template-columns:1fr;}
  .testimonials-full-grid{grid-template-columns:1fr;}
}

@media (max-width: 760px){
  .container{padding:0 20px;}
  .header-inner{height:78px;}
  .brand-logo{height:58px;}
  .main-nav{top:78px;}

  .hero{min-height:auto;padding:120px 0 70px;}
  .hero-ctas{flex-direction:column;align-items:stretch;}
  .hero-ctas .btn{width:100%;}

  .section{padding:72px 0;}
  .benefits{padding:64px 0;}
  .benefits-grid{grid-template-columns:1fr;}
  .services-grid{grid-template-columns:1fr;}
  .testimonials-grid{grid-template-columns:1fr;}

  .form-row{grid-template-columns:1fr;gap:0;}
  .contact-form{padding:24px;}

  .work-web-grid{grid-template-columns:1fr;}
  .work-logos-grid{grid-template-columns:repeat(3,1fr);}
  .pricing-grid{grid-template-columns:1fr;}
  .pricing-grid.pricing-grid-6{grid-template-columns:1fr;}
  .pricing-grid.pricing-grid-3{grid-template-columns:1fr;max-width:420px;}
  .pricing-grid.pricing-grid-2{grid-template-columns:1fr;max-width:420px;}
  .page-hero{padding:130px 0 60px;}
  .cta-banner{padding:64px 0;}
  .cta-banner-box{padding:44px 24px;}
  .faq{padding:64px 0;}
  .faq-question{padding:16px 18px;font-size:14px;}
  .faq-answer-inner{padding:0 18px 18px;}

  .stats-grid{grid-template-columns:1fr 1fr;}
  .region-grid{grid-template-columns:1fr;}
  .dc-gallery{grid-template-columns:1fr 1fr;}

  .float-wa{width:52px;height:52px;right:16px;bottom:16px;}

  .site-footer-mini{padding:20px 0;}
  .site-footer-mini p{font-size:12.5px;}
}

@media (max-width: 420px){
  .site-footer-mini p{font-size:11.5px;}
  .step-number{font-size:42px;}
}

@media (max-width: 420px){
  .hero h1{font-size:30px;}
}