@charset "utf-8";
/* ============================================================
   RESPONSIVE v2 - mobile portrait + landscape + tablet
   Desktop >=1025px preservado. Mobile-first overrides abaixo.
   ============================================================ */
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0;width:100%;overflow-x:hidden}
img,iframe{max-width:100%}
img{height:auto}

/* ---------- Hamburger (hidden on desktop) ---------- */
.menu-toggle{display:none;background:#11111100;border:1px solid #11111133;border-radius:6px;width:44px;height:44px;cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:8px}
.menu-toggle span{display:block;width:24px;height:3px;background:#111111;border-radius:2px;transition:.25s}
.menu-toggle.active{background:#11111100!important;-webkit-tap-highlight-color:transparent}
.menu-toggle.active span{background:#111111!important}
.menu-toggle.active span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.menu-toggle.active span:nth-child(2){opacity:0}
.menu-toggle.active span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
.topo-inner{display:flex;align-items:center;justify-content:space-between;gap:10px}
.logo-wrap{display:flex;align-items:center;justify-content:space-between;gap:10px;flex:1}

/* ---------- Helpers ---------- */
.clientes{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-start}
#contatos input[type="text"],#contatos input[type="email"],#contatos textarea{max-width:100%}

/* ============================================================
   TABLET + MOBILE - menu hamburger até 1024px
   ============================================================ */
@media screen and (max-width:1024px){
  .topo{height:auto;min-height:70px;padding:8px 0;background-size:cover}
  #logo{height:60px!important;margin-left:0!important}
  .menu-toggle{display:inline-flex;flex-shrink:0}
  .topo .left{width:auto;margin-top:0}
  .topo .right,.topo-info{width:100%}
  .topo-inner{flex-wrap:wrap}
  .logo-wrap{width:100%}
  .telefone{width:100%!important;text-align:right;font-size:13px;margin:4px 0!important}
  .telefone p{text-align:right!important;margin:0}
  .topo .menu{width:100%!important;max-width:100%;display:none;float:none;margin:0}
  .topo .menu.open{display:block;background:#11111100;border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,.18);overflow:hidden;margin-top:8px}
  .topo .menu.open a{float:none!important;display:block;width:100%;text-align:left;padding:14px 16px!important;margin:0!important;font-size:15px!important;border-bottom:1px solid #eee;min-height:44px}
  .topo .menu.open a:last-child{border-bottom:0}
  /* banner fluido */
  .banner{position:relative;top:auto;height:auto}
  .topo-home{margin-bottom:0!important}
  .flexslider,.flexslider .slides li{height:auto!important;min-height:0;max-height:none}
  .flexslider .slides img{height:320px!important;width:100%!important;object-fit:cover;object-position:right!important}
  .titulo{margin-top:0!important;text-align:center}
  /* corpo empilha */
  .corpo{flex-direction:column!important;width:100%!important;max-width:960px}
  .corpo .left,.corpo .right{width:100%!important;float:none!important;margin:0 0 16px!important}
  .corpo.servico-parceiro{float:none}
  .safe img{max-width:100%!important;margin-right:0!important;margin-bottom:16px}
  /* larguras fixas viram fluidas */
  .wid100,.wid130,.wid150,.wid180,.wid200,.wid230,.wid250,.wid260,.wid280,.wid300,.wid330,.wid350,.wid380,.wid400,.wid430,.wid450,.wid480,.wid500,.wid530,.wid550,.wid580,.wid600,.wid630,.wid650,.wid680,.wid700,.wid730,.wid750,.wid780,.wid800,.wid830,.wid850,.wid880,.wid900,.wid930,.wid950,.wid980{width:100%!important;max-width:100%}
  .float_left{float:none!important}
  #right,#left{float:none!important;width:100%!important;margin:0 0 16px!important}
  /* clientes grid */
  .clientes img{width:calc(33.333% - 10px);min-width:140px;flex:1 1 160px;float:none;margin:0}
  /* contato / form / mapa */
  .corpo iframe{width:100%!important;height:280px}
  #contatos input[type="text"],#contatos input[type="email"]{width:100%!important;margin-left:0!important;min-height:44px;height:auto;padding:12px}
  #contatos textarea{width:100%!important;height:120px;padding:12px}
  #contatos input[type=submit]{width:100%!important;margin-left:0!important;padding:14px;min-height:48px}
  #FormCaptcha{width:100%!important}
  #FormCaptcha td{display:block;width:100%!important}
  #FormCaptcha input,#FormCaptcha textarea{width:100%!important;float:none!important}
  #FormCaptcha #mensagem{width:100%!important}
  #botao,#botao2{float:none;display:inline-block;margin:8px 0}
  .rodape{height:auto;padding:28px 12px 38px 12px;text-align:center;background-color:#111; margin-top:52px}
  .rodape .limite{width:100%!important}
  .rodape .limite .endereco{display:block;width:100%;max-width:100%;margin:0 auto 60px;line-height:1.5;overflow-wrap:anywhere; text-align: center;}
  .rodape .limite hr{display:none}
  .rodape .limite .esquerda,.rodape .limite .direita{float:none!important;text-align:center;margin:6px 0}
}

/* ---------- Mobile portrait (até 480px) ---------- */
@media screen and (max-width:480px){
  body{font-size:14px}
  #logo{height:44px!important}
  .telefone{font-size:12px}
  .flexslider .slides img{height:200px!important}
  .titulo{font-size:14px!important;padding:12px 8px!important;height:auto}
  .corpo h2{font-size:1.15rem;text-align:center;width:100%}
  .corpo p{padding-right:0;font-size:.92rem;line-height:1.55;text-align:left}
  .clientes img{width:100%;flex:1 1 100%}
  .corpo iframe{height:240px}
  #top{padding:10px 14px;font-size:14px}
}

/* ---------- Mobile landscape (481–767px) + celulares deitados ---------- */
@media screen and (min-width:481px) and (max-width:767px){
  #logo{height:52px!important}
  .flexslider .slides img{height:240px!important}
  .titulo{font-size:15px}
  .clientes img{width:calc(50% - 10px);flex:1 1 45%}
}
/* celulares em landscape: altura baixa — compactar topo/banner */
@media screen and (max-width:767px) and (orientation:landscape){
  .topo{min-height:56px;padding:6px 0}
  #logo{height:40px!important}
  .telefone{display:none}
  .flexslider .slides img{height:180px!important}
  .titulo{font-size:13px!important;padding:8px!important}
  .corpo{min-height:0}
  .topo .menu.open a{padding:10px 14px!important;min-height:40px;font-size:14px!important}
}

/* ---------- Tablet portrait (768–1024px) ---------- */
@media screen and (min-width:768px) and (max-width:1024px){
  body{font-size:15px}
  #logo{height:64px!important}
  .limite,.corpo{padding-left:16px;padding-right:16px}
  .flexslider .slides img{height:320px!important}
  .corpo h2{font-size:1.35rem}
  .clientes img{width:calc(33.333% - 10px)}
}
/* ---------- Tablet landscape ---------- */
@media screen and (min-width:768px) and (max-width:1024px) and (orientation:landscape){
  .flexslider .slides img{height:300px!important}
  .corpo{flex-direction:row!important;flex-wrap:wrap}
  .corpo .left{width:35%!important}
  .corpo .right{width:60%!important}
  .corpo.servico-parceiro .left,.corpo.servico-parceiro .right{margin-bottom:0!important}
  #right,#left{width:48%!important;float:left!important}
  #right{float:right!important}
  .clientes img{width:calc(25% - 10px)}
}

/* ---------- Telas muito pequenas ---------- */
@media screen and (max-width:360px){
  #logo{height:38px!important}
  .titulo{font-size:13px!important}
  .flexslider .slides img{height:170px!important}
}

/* ---------- Desktop: garante original ---------- */
@media screen and (min-width:1025px){
  .menu-toggle{display:none!important}
  .topo .menu{display:block!important}
  .limite{width:940px!important;max-width:940px;padding-left:0;padding-right:0}
  .corpo{width:940px!important;max-width:940px;flex-direction:row;padding-left:0;padding-right:0}
  .topo-home{margin-bottom:400px}
  #logo{height:88px;margin-left:75px}
  .banner{position:absolute;top:30px;height:450px!important}
  .flexslider,.flexslider .slides li{height:450px!important;max-height:450px}
  .flexslider .slides img{height:450px!important}
  .safe img{max-width:42%!important}
}

@media print{.menu-toggle,#top{display:none!important}}

/* Item de menu da página atual: fundo exato pedido; texto em #111111 sólido
   (o #11111100 como cor de texto ficaria 100% transparente/invisível) */
#menu1,#menu2,#menu3,#menu4,#menu5,#menu6,#menu7,#menu8,#menu9{background-color:#11111100!important}
.topo .menu.open a{background-color:#11111100!important}
