/* =====================================================================
   Responsivo — carregado depois de app.css. Só layout; cores/fontes do tema.
   Quebras: 1100 (notebook) · 860 (tablet) · 600 (celular grande) · 400 (celular)
   ===================================================================== */

/* --- base fluida (vale em todas as larguras) --- */
html{-webkit-text-size-adjust:100%}
body{overflow-x:hidden}
.site img:not(.brand-logo):not(.footer-logo),.site video,.site iframe,.site svg{max-width:100%;height:auto}
.site iframe{height:auto;aspect-ratio:16/9}
.container{padding-left:clamp(16px,4vw,40px);padding-right:clamp(16px,4vw,40px)}
.site h1{font-size:clamp(2rem,1.2rem + 3.2vw,3.6rem)}
.site h2{font-size:clamp(1.6rem,1.1rem + 2vw,2.5rem)}
.site h3{font-size:clamp(1.1rem,1rem + .5vw,1.35rem)}
.lead{font-size:clamp(1rem,.95rem + .4vw,1.2rem)}
.sec{padding:clamp(2.5rem,6vw,5.5rem) 0}.pad-amplo{padding:clamp(3.5rem,8vw,7rem) 0}.pad-compacto{padding:clamp(1.5rem,3vw,2.5rem) 0}
.hero-text h1{font-size:clamp(2.1rem,1.3rem + 3.4vw,3.8rem) !important}
.site .btn,.site a.btn{min-height:44px;display:inline-flex;align-items:center;justify-content:center}
.site-nav a,.site-nav-mobile a,.footer-col a,.footer-legal a{min-height:44px;display:inline-flex;align-items:center}
.footer-col a{min-height:36px}
.field input,.field textarea,.field select{font-size:16px}   /* evita zoom automático no iOS */
table{display:block;overflow-x:auto;max-width:100%}
.prose pre{overflow-x:auto}

/* --- 1100: notebook --- */
@media (max-width:1100px){
  .hero-grid{gap:2.5rem}
  .mock{width:100% !important;max-width:460px}
  .cols-4{grid-template-columns:repeat(2,1fr)}
  .depoimentos{grid-template-columns:repeat(2,1fr)}
}

/* --- 860: tablet — menu colapsa, grades viram 2 ou 1 coluna --- */
@media (max-width:860px){
  .hero-grid{grid-template-columns:1fr;gap:2rem}
  .hero-text{max-width:100% !important}
  .hero-visual{display:none}.visual-mobile .hero-visual{display:flex;justify-content:center}
  .visual-mobile .mock{max-width:100%}
  .cols-3,.cols-4{grid-template-columns:repeat(2,1fr)}
  .step-list{grid-template-columns:1fr}
  .depoimentos{grid-template-columns:1fr}
  .img-text{grid-template-columns:1fr}.img-text.img-left img{order:0}
  .planos{flex-direction:column;align-items:center}
  .price-card{max-width:100%}
  .footer-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem 2rem}
  .footer-brand{grid-column:1 / -1}
  .form .row{grid-template-columns:1fr 1fr}
  .form .row .field:first-child{grid-column:1 / -1}
}

/* --- 600: celular grande — tudo em 1 coluna, botões em largura total --- */
@media (max-width:600px){
  .cols-2,.cols-3,.cols-4{grid-template-columns:1fr}
  .feature{padding:1.25rem}
  .cta-row{flex-direction:column;align-items:stretch}
  .cta-row .btn{width:100%}
  .al-centro .cta-row{align-items:stretch}
  .hero-selos{flex-direction:column;gap:.5rem}
  .numeros{gap:1.25rem}.numero strong{font-size:2rem}
  .price{font-size:3.2rem}
  .footer-grid{grid-template-columns:1fr}
  .footer-bottom{flex-direction:column;align-items:flex-start}
  .form .row{grid-template-columns:1fr}
  .form fieldset{padding:1rem}
  .input-suffix{flex-direction:column;align-items:stretch}
  .input-suffix span{padding:.45rem .8rem;border-top:1px solid var(--border);text-align:center}
  .erro-codigo{font-size:3rem}
  .post-grid{grid-template-columns:1fr}
  .cats{overflow-x:auto;flex-wrap:nowrap;padding-bottom:.5rem}
  .brand-name{font-size:1.1rem}
}

/* --- 400: celular pequeno --- */
@media (max-width:400px){
  .container{padding-left:14px;padding-right:14px}
  .hero-badge{font-size:.75rem}
  .brand-name{display:none}
  .mock-cols{grid-template-columns:1fr}
  .mock-kpis{flex-direction:column}
  .site-nav-mobile{padding:1rem}
}

/* --- paisagem em celular: cabeçalho fixo rouba altura demais --- */
@media (max-height:500px) and (orientation:landscape){
  .site-header.is-fixo{position:relative}
  .sec-hero{padding:2rem 0}
}

/* --- impressão --- */
@media print{
  .site-header,.site-footer,.nav-toggle,.cta-row,.hero-visual{display:none !important}
  .site{color:#000;background:#fff}
  .sec{padding:1rem 0}
}

/* --- menu do cabeçalho em tablet/celular --- */
@media (max-width:860px){
  .nav-toggle{display:flex}
  .site-nav{display:none}
  .show-desktop{display:none !important}
  .show-mobile{display:inline-flex !important}
  .site-nav-mobile{position:absolute;top:100%;left:0;right:0;z-index:20;flex-direction:column;align-items:stretch;background:var(--hdr-bg);padding:1rem clamp(16px,4vw,40px) 1.25rem;border-bottom:var(--hdr-border);gap:.25rem;box-shadow:0 10px 30px rgba(0,0,0,.08)}
  .site-nav-mobile:not([hidden]){display:flex}
  .site-nav-mobile a{padding:.5rem 0;font-size:1.05rem}
  .site-nav-mobile a.btn{margin-top:.5rem;justify-content:center}
  .menu-centro .header-inner{display:flex}
  .mobile-lateral .site-nav-mobile{position:fixed;top:0;right:0;bottom:0;left:auto;width:min(320px,85vw);padding-top:5rem;border:0;border-left:var(--hdr-border);overflow-y:auto}
  .mobile-tela_cheia .site-nav-mobile{position:fixed;inset:0;justify-content:center;align-items:center;font-size:1.3rem;border:0}
  .mobile-lateral .nav-toggle,.mobile-tela_cheia .nav-toggle{position:relative;z-index:21}
}

/* --- logo e barra menores no celular (cabecalho.*_mobile_px) --- */
@media (max-width:860px){
  .header-inner{min-height:var(--hdr-h-m,60px)}
  .site .brand-logo{height:var(--hdr-logo-m,32px)}
  .brand-name{font-size:var(--hdr-name-m,18px)}
}

@media (max-width:600px){
  .feature.span-2{grid-column:auto}
  .icone-esquerda .feature-body{flex-direction:column}
}

@media (max-width:860px){
  .layout-horizontal{grid-template-columns:1fr}
  .layout-horizontal .step::after,.layout-horizontal .step::before{display:none}
  .layout-zigzag .step:nth-child(even){flex-direction:row;text-align:left}
  .layout-zigzag .step:nth-child(even) .step-tempo{align-self:flex-start}
}
@media (max-width:600px){
  .layout-timeline .step{margin-left:0;flex-direction:column}
  .layout-timeline .step-mark{position:static}
  .layout-timeline::before{display:none !important}
  .layout-zigzag .step{flex-direction:column !important}
}

@media (max-width:860px){
  .formato-split .cta-inner{flex-direction:column;text-align:center}
  .formato-split .cta-text,.formato-split .cta-actions{align-items:center}
  .formato-split .note{text-align:center}
  .formato-card{margin:0 16px;border-radius:18px}
}

@media (max-width:860px){
  .site-footer.mesma-linha .footer-grid{flex-wrap:wrap}
  .site-footer.mesma-linha .footer-col{flex:1 1 40%}
  .site-footer.mesma-linha .footer-brand{flex:1 1 100%}
}
@media (max-width:600px){
  .site-footer.mesma-linha .footer-col{flex:1 1 100%}
}

@media (max-width:860px){.contato-grid{grid-template-columns:1fr;gap:2rem}}
@media (max-width:600px){.row-2{grid-template-columns:1fr}.contato-form{padding:1.25rem}}

@media (max-width:860px){.cad-grid{grid-template-columns:1fr;gap:2rem}.cad-side{position:static}.obrigado-passos{grid-template-columns:1fr}}
@media (max-width:600px){.row-3{grid-template-columns:1fr 1fr}.row-3 .field:first-child{grid-column:1 / -1}.cad-form{padding:1.25rem}}