/* =========================================================
   NEO ARTE — Responsivo
   ========================================================= */

@media (max-width:1024px){
  .hero-grid{grid-template-columns:1fr;gap:40px;text-align:center}
  .hero-visual{order:-1}
  .hero-logo-big{width:min(70%,320px)}
  .hero-trust,.hero-actions{justify-content:center}
  .sobre-grid,.tab-content-grid,.app-grid,.contato-grid{grid-template-columns:1fr;gap:40px}
  .servicos-grid{grid-template-columns:repeat(2,1fr)}
  .clientes-grid{grid-template-columns:repeat(4,1fr)}
  .footer-grid{grid-template-columns:1fr 1fr;gap:30px}
  .timeline-connector{display:none}
  .timeline-item{min-width:45%;margin-bottom:30px}
}

@media (max-width:768px){
  /* ===== MENU MOBILE MODERNO ===== */
  .nav-menu{
    position:fixed;top:0;right:-100%;width:min(340px,90vw);height:100vh;
    background:rgba(5,18,28,0.97);
    backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
    border-left:1px solid rgba(45,212,191,0.15);
    flex-direction:column;justify-content:center;gap:0;
    transition:right .35s cubic-bezier(0.22,1,0.36,1);
    z-index:1001;padding:0;
    box-shadow:-20px 0 60px rgba(0,0,0,0.5);
  }
  .nav-menu.open{right:0}

  /* Links do menu mobile — maiores e mais claros */
  .nav-menu li{width:100%;border-bottom:1px solid rgba(45,212,191,0.07)}
  .nav-menu .nav-link{
    display:flex;align-items:center;
    padding:18px 36px;
    font-size:17px;font-weight:600;
    color:rgba(255,255,255,0.85);
    letter-spacing:0.01em;
    transition:all .2s ease;
    position:relative;
  }
  .nav-menu .nav-link::before{
    content:'';
    position:absolute;left:0;top:0;bottom:0;width:3px;
    background:var(--teal-bright,#2dd4bf);
    border-radius:0 3px 3px 0;
    opacity:0;transition:opacity .2s;
  }
  .nav-menu .nav-link:hover,
  .nav-menu .nav-link.active{
    color:#2dd4bf;
    background:rgba(45,212,191,0.06);
    padding-left:44px;
  }
  .nav-menu .nav-link:hover::before,
  .nav-menu .nav-link.active::before{opacity:1}

  /* Cabeçalho interno do menu mobile */
  .nav-menu::before{
    content:'MENU';
    display:block;
    padding:32px 36px 24px;
    font-size:10px;font-weight:800;letter-spacing:4px;
    color:rgba(45,212,191,0.5);
    border-bottom:1px solid rgba(45,212,191,0.1);
    margin-bottom:8px;
  }

  /* CTA dentro do menu mobile */
  .nav-cta{
    display:flex !important;
    margin:20px 24px 0;
    justify-content:center;
  }
  .nav-menu .btn.btn-primary.nav-cta{
    width:calc(100% - 48px);
    margin:20px 24px 0;
    padding:14px 20px;
    font-size:14px;
    border-radius:14px;
  }

  /* Hamburger */
  .nav-hamburger{display:flex;z-index:1002}
  .nav-hamburger span{
    width:24px;height:2px;background:var(--text,#fff);
    border-radius:2px;transition:all .3s ease;
    display:block;
  }
  .nav-hamburger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .nav-hamburger.open span:nth-child(2){opacity:0;transform:scaleX(0)}
  .nav-hamburger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

  /* Overlay escuro */
  .nav-overlay{
    position:fixed;inset:0;
    background:rgba(0,0,0,0.65);
    backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);
    z-index:1000;
    opacity:0;visibility:hidden;transition:all .3s ease;
  }
  .nav-overlay.show{opacity:1;visibility:visible}

  section[id]{padding:70px 0}
  .trust-strip-grid{grid-template-columns:1fr 1fr;gap:24px}
  .servicos-grid{grid-template-columns:1fr}
  .clientes-grid{grid-template-columns:repeat(3,1fr);gap:14px}
  .sobre-counters{grid-template-columns:1fr 1fr}
  .form-row{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr;text-align:center}
  .footer-desc{margin:0 auto}
  .footer-social{justify-content:center}
  .footer-contact-item,.footer-links a{justify-content:center}
  .simulador-card,.contato-form-wrap{padding:26px}
  .section-divider.left{margin:0 auto 22px}
  .sobre-feature{text-align:left}
  .hero-scroll{display:none}
}

@media (max-width:480px){
  .container{padding:0 18px}
  .clientes-grid{grid-template-columns:repeat(2,1fr)}
  .trust-strip-grid{grid-template-columns:1fr}
  .hero-title{font-size:2.1rem}
  .btn-lg{padding:15px 28px;font-size:15px}
  .tab-text h3{font-size:1.5rem}
}