/* =========================================================
   GreenFlex Soluções — estilos do site
   Cores principais: azul royal #1A47B8 + laranja #F37A2C
   ========================================================= */

:root{
  --laranja:#F37A2C;
  --royal:#1A47B8;
  --marinho:#0C1E4A;
  --bg:#ffffff;--suave:#F2F5FC;--card:#ffffff;--txt:#0C1E4A;--txt2:#44506B;--txt3:#56627C;
  --titulo-azul:#1A47B8;--hero:#1A47B8;--escuro:#0C1E4A;--rodape:#081538;--campo:#F2F5FC;
  --borda-foto:#AEBBD6;--logo-fundo:transparent;--logo-pad:0;--mapa:#13295F;--lt:#C24E12;
  --sombra:rgba(26,71,184,0.10);--suja:#E9E4DC;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-tema="claro"]){
    --bg:#0A1430;--suave:#0F1C40;--card:#13224D;--txt:#EEF2FB;--txt2:#B4C0DA;--txt3:#9AA7C4;
    --titulo-azul:#8EAEFF;--hero:#0F2A6B;--escuro:#060E26;--rodape:#040A1C;--campo:#0A1430;
    --borda-foto:#33467A;--logo-fundo:#ffffff;--logo-pad:6px 10px;--mapa:#0D1D47;--lt:#F7A06A;
    --sombra:rgba(0,0,0,0.35);--suja:#2A2A33;color-scheme:dark;
  }
}
:root[data-tema="escuro"]{
  --bg:#0A1430;--suave:#0F1C40;--card:#13224D;--txt:#EEF2FB;--txt2:#B4C0DA;--txt3:#9AA7C4;
  --titulo-azul:#8EAEFF;--hero:#0F2A6B;--escuro:#060E26;--rodape:#040A1C;--campo:#0A1430;
  --borda-foto:#33467A;--logo-fundo:#ffffff;--logo-pad:6px 10px;--mapa:#0D1D47;--lt:#F7A06A;
  --sombra:rgba(0,0,0,0.35);--suja:#2A2A33;color-scheme:dark;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,system-ui,sans-serif;background:var(--bg);color:var(--txt);overflow-x:hidden;transition:background .35s,color .35s;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:var(--titulo-azul)}
h1,h2,h3{font-family:Montserrat,sans-serif;margin:0}
p{margin:0}
button{font:inherit}
:focus-visible{outline:2px solid var(--laranja);outline-offset:2px}
.wrap{max-width:1240px;margin:0 auto;padding-left:24px;padding-right:24px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- botões ---------- */
.btn{background:transparent;display:inline-flex;align-items:center;justify-content:center;gap:10px;border:0;cursor:pointer;text-decoration:none;font-weight:800;border-radius:999px;padding:17px 26px;min-height:48px;transition:transform .2s,filter .2s}
.btn:hover{transform:translateY(-2px);filter:brightness(1.05)}
.btn-laranja{background:var(--laranja);color:var(--marinho)}
.btn-laranja:hover{color:var(--marinho)}
.btn-escuro{background:var(--marinho);color:#fff}
.btn-escuro:hover{color:#fff}
.btn-contorno{color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.55);font-weight:600}
.btn-contorno:hover{color:#fff}
.btn-whats{background:#0F7A3F;color:#fff;width:100%}
.btn-whats:hover{color:#fff}
.btn svg{flex:none}

/* ---------- topo ---------- */
.topo{background:var(--bg);position:relative;z-index:5}
.topo .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;padding-top:12px;padding-bottom:12px}
.marca{display:flex;align-items:center;gap:12px;text-decoration:none}
.marca .logo{background:var(--logo-fundo);padding:var(--logo-pad);border-radius:12px;display:flex}
.marca img{height:46px;width:auto}
.marca .sub{font-family:Montserrat,sans-serif;font-weight:700;font-size:12px;letter-spacing:2px;color:var(--titulo-azul);border-left:2px solid var(--laranja);padding-left:12px}
.menu{display:flex;flex-wrap:wrap;gap:24px;font-size:15px;font-weight:600}
.menu a{color:var(--txt);text-decoration:none}
.menu a:hover{color:var(--lt)}
.acoes-topo{display:flex;align-items:center;gap:10px}
.btn-tema{width:46px;height:46px;border-radius:999px;border:0;background:var(--suave);color:var(--txt);cursor:pointer;display:flex;align-items:center;justify-content:center}
.btn-tema .lua{display:block}.btn-tema .sol{display:none}
:root[data-tema="escuro"] .btn-tema .lua{display:none}
:root[data-tema="escuro"] .btn-tema .sol{display:block}
@media (prefers-color-scheme: dark){
  :root:not([data-tema="claro"]) .btn-tema .lua{display:none}
  :root:not([data-tema="claro"]) .btn-tema .sol{display:block}
}
.topo .btn{padding:12px 20px;font-size:14px;font-weight:700}
@media (max-width:760px){.menu{order:3;width:100%;flex-wrap:nowrap;gap:20px;overflow-x:auto;white-space:nowrap;padding-bottom:4px;scrollbar-width:none}.menu::-webkit-scrollbar{display:none}.topo .btn{display:none}.marca img{height:40px}}

/* ---------- hero ---------- */
.hero{background:var(--hero);color:#fff;position:relative;overflow:hidden}
.hero .cabos{position:absolute;inset:0;width:100%;height:100%}
.cabo{fill:none;stroke:rgba(255,255,255,.10);stroke-width:1.2}
.pulso{fill:none;stroke-width:2.4;stroke-linecap:round;stroke-dasharray:10 310;animation:fluxo 7s linear infinite}
.pulso.b{animation-duration:9s;animation-delay:-3s}
.pulso.c{animation-duration:11s;animation-delay:-6s}
.pulso.d{animation-duration:8s;animation-delay:-1s}
@keyframes fluxo{to{stroke-dashoffset:-320}}
.hero .wrap{position:relative;display:flex;flex-wrap:wrap;gap:56px;align-items:center;padding-top:84px;padding-bottom:120px}
.hero-texto{flex:1 1 520px;min-width:0;display:flex;flex-direction:column;gap:24px}
.selo-topo{align-self:flex-start;display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.10);border-radius:999px;padding:8px 16px 8px 10px;font-size:13px;font-weight:600}
.selo-topo i{width:8px;height:8px;border-radius:999px;background:var(--laranja)}
.hero h1{font-weight:900;font-size:clamp(38px,5.4vw,72px);line-height:1.0;letter-spacing:-2px}
.hero h1 em{color:var(--laranja)}
.hero p{font-size:19px;line-height:1.55;color:#E3E9F7;max-width:540px}
.botoes{display:flex;flex-wrap:wrap;gap:12px}
.hero-foto{flex:1 1 400px;min-width:0;position:relative;display:flex;justify-content:center;padding:20px 0}
.giro{position:absolute;width:560px;height:560px;top:50%;left:50%;margin:-280px 0 0 -280px;animation:giro 60s linear infinite}
@keyframes giro{to{transform:rotate(360deg)}}
.moldura{position:relative;width:100%;max-width:440px;height:460px;border-radius:220px 220px 32px 220px;overflow:hidden;background:rgba(255,255,255,.10)}
.moldura img{width:100%;height:100%;object-fit:cover}
.flut{position:absolute;box-shadow:0 18px 40px rgba(12,30,74,.28);animation:flutua 6s ease-in-out infinite}
.flut.b{animation-delay:-3s}
@keyframes flutua{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
.flut-anos{left:0;bottom:40px;background:#fff;color:var(--marinho);border-radius:20px;padding:16px 20px;display:flex;flex-direction:column;gap:2px}
.flut-anos strong{font-family:Montserrat,sans-serif;font-weight:900;font-size:32px;line-height:1;color:var(--royal)}
.flut-anos span{font-size:13px;color:#44506B}
.flut-loja{right:0;top:36px;background:var(--laranja);color:var(--marinho);border-radius:999px;padding:12px 18px;display:flex;align-items:center;gap:8px;font-weight:700;font-size:14px}
.onda-base{position:absolute;left:0;bottom:-1px;width:100%;height:80px;display:block}
.onda-base path{fill:var(--bg)}

/* hero das páginas de serviço */
.hero-servico .wrap{padding-top:64px;padding-bottom:110px}
.hero-servico h1{font-size:clamp(34px,4.6vw,60px)}
.migalha{font-size:14px;color:#C9D3EA}
.migalha a{color:#fff}

/* ---------- faixa correndo ---------- */
.faixa{background:var(--bg);padding:18px 0 8px;overflow:hidden}
.trilho{display:flex;width:max-content;animation:corre 38s linear infinite;font-family:Montserrat,sans-serif;font-weight:800;font-size:clamp(22px,2.6vw,34px);color:var(--titulo-azul);white-space:nowrap}
.trilho span{display:flex;align-items:center;gap:28px;padding-right:28px}
.trilho b{color:var(--laranja)}
@keyframes corre{to{transform:translateX(-50%)}}

/* ---------- seções ---------- */
.secao{padding:88px 0}
.secao-suave{background:var(--suave)}
.cabeca{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:40px}
.titulo{font-weight:900;font-size:clamp(32px,4vw,52px);letter-spacing:-1.2px;line-height:1.02;color:var(--txt)}
.titulo em{font-style:normal;color:var(--lt)}
.titulo .azul{color:var(--titulo-azul)}
.cabeca p,.texto{font-size:17px;color:var(--txt2);line-height:1.55;max-width:440px}

/* serviços */
.grade-servicos{display:grid;grid-template-columns:repeat(auto-fit,minmax(310px,1fr));gap:18px;align-items:start}
.painel{background:var(--suave);border-radius:28px;padding:30px 22px 18px;display:flex;flex-direction:column;gap:18px}
.painel h3{padding:0 8px;font-weight:800;font-size:24px;color:var(--txt)}
.painel-azul{background:var(--royal);color:#fff}
.painel-azul h3{color:#fff}
.painel .topo-painel{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 8px}
.painel .topo-painel h3{padding:0}
.etiqueta{background:var(--laranja);color:var(--marinho);font-size:12px;font-weight:700;border-radius:999px;padding:5px 12px}
.linha{display:flex;justify-content:space-between;align-items:center;width:100%;text-align:left;border:0;background:transparent;cursor:pointer;color:var(--txt);text-decoration:none;font-size:16px;padding:15px 10px;border-radius:14px;transition:background .25s,padding-left .25s}
.painel-azul .linha{color:#fff}
.linha:hover{background:rgba(243,122,44,.10);padding-left:22px;color:var(--txt)}
.painel-azul .linha:hover{background:rgba(255,255,255,.08);color:#fff}
.linha .seta{color:var(--lt);font-size:20px;transition:transform .25s}
.painel-azul .linha .seta{color:var(--laranja)}
.linha:hover .seta{transform:translateX(4px)}

/* faixa usina */
.faixa-usina{position:relative;background:var(--laranja)}
.faixa-usina .ondas{position:absolute;left:0;width:100%;height:60px;display:block}
.faixa-usina .cima{top:-1px}.faixa-usina .cima path{fill:var(--bg)}
.faixa-usina .baixo{bottom:-1px}.faixa-usina .baixo path{fill:var(--suave)}
.faixa-usina .wrap{position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:28px;padding-top:96px;padding-bottom:84px}
.faixa-usina .txt{flex:1 1 560px;min-width:0;display:flex;flex-direction:column;gap:12px;color:var(--marinho)}
.faixa-usina small{font-size:13px;font-weight:700;letter-spacing:1.5px}
.faixa-usina h2{font-weight:900;font-size:clamp(28px,3.4vw,44px);letter-spacing:-1px;line-height:1.05}
.faixa-usina p{font-size:18px;color:#1B2A4E;line-height:1.5;max-width:620px}

/* ---------- formulários / calculadoras ---------- */
.lado-a-lado{display:flex;flex-wrap:wrap;gap:56px;align-items:flex-start}
.lado-a-lado>.col{flex:1 1 360px;min-width:0;display:flex;flex-direction:column;gap:16px}
.lado-a-lado>.col-larga{flex:1 1 540px;min-width:0}
.cartao{background:var(--card);border-radius:32px;padding:30px;display:flex;flex-direction:column;gap:22px;box-shadow:0 30px 60px var(--sombra)}
.dica{display:flex;align-items:flex-start;gap:12px;background:var(--card);border-radius:18px;padding:16px 18px;font-size:15px;line-height:1.45}
.dica i{flex:none;width:34px;height:34px;border-radius:999px;background:var(--laranja);display:flex;align-items:center;justify-content:center}
.abas{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;background:var(--suave);border-radius:999px;padding:6px}
.abas button,.pilulas button{border:0;cursor:pointer;font-weight:700;border-radius:999px;background:transparent;color:var(--titulo-azul);min-height:46px;padding:12px 14px;font-size:15px}
.abas button[aria-pressed="true"],.pilulas button[aria-pressed="true"]{background:var(--royal);color:#fff}
.pilulas{display:flex;flex-wrap:wrap;gap:8px}
.pilulas button{background:var(--suave);color:var(--txt);font-weight:600;font-size:14px;padding:10px 16px}
.cartao .pilulas button{background:var(--campo)}
.rotulo{font-size:14px;font-weight:600;color:var(--txt)}
label.campo{display:flex;flex-direction:column;gap:8px;font-size:14px;font-weight:600;color:var(--txt)}
.campo input,input.campo{font:inherit;font-weight:400;font-size:17px;padding:15px 18px;border:0;background:var(--campo);color:var(--txt);border-radius:16px;width:100%}
.campo input::placeholder{color:var(--txt3)}
.escolhas{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.escolha{text-align:left;cursor:pointer;border-radius:20px;padding:16px;background:var(--campo);color:var(--txt);border:2px solid transparent;display:flex;flex-direction:column;gap:8px}
.escolha[aria-pressed="true"]{border-color:var(--laranja)}
.escolha strong{font-size:16px}
.escolha span{font-size:13px;color:var(--txt2)}
.itens{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px}
.item{background:var(--campo);border-radius:18px;padding:8px 8px 8px 18px;display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:15px;font-weight:500}
.contador{display:flex;align-items:center;gap:6px}
.contador button{width:38px;height:38px;border:0;border-radius:999px;font-size:18px;cursor:pointer;background:var(--card);color:var(--titulo-azul)}
.contador button.mais{background:var(--royal);color:#fff}
.contador output{min-width:24px;text-align:center;font-weight:700}
.resumo{display:flex;align-items:center;gap:10px;border-radius:16px;padding:12px 16px;background:rgba(243,122,44,.12);font-size:14px}
.obs{font-size:13px;color:var(--txt3);text-align:center}
.oculto{display:none !important}
.honey{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}

/* ---------- limpeza ---------- */
.comparar{display:flex;flex-wrap:wrap;gap:18px;align-items:stretch}
.comparar>div{flex:1 1 280px;min-width:0;border-radius:28px;padding:28px;display:flex;flex-direction:column;gap:16px}
.suja{background:var(--suja)}
.limpa{background:var(--royal);color:#fff;box-shadow:inset 0 0 0 3px var(--laranja)}
.comparar svg{width:100%;height:120px}
.comparar .nome{font-family:Montserrat,sans-serif;font-weight:800;font-size:22px}
.comparar ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:10px;font-size:15px;line-height:1.4}
.suja ul{color:var(--txt2)}.limpa ul{color:#E3E9F7}
.poeira{animation:poeira 5s ease-in-out infinite}
@keyframes poeira{0%,100%{opacity:.55}50%{opacity:.8}}
.brilho{animation:brilho 3.2s ease-in-out infinite}
@keyframes brilho{0%,100%{opacity:.15}50%{opacity:.45}}
.form-limpeza{background:var(--suave);gap:16px}
.form-limpeza .item{background:var(--card)}
.form-limpeza .campo input{background:var(--card)}
.form-limpeza .pilulas button{background:var(--card)}

/* ---------- galeria ---------- */
.galeria{display:flex;gap:18px;overflow-x:auto;padding:12px 24px 96px;scrollbar-width:none;cursor:grab}
.galeria::-webkit-scrollbar{display:none}
.foto{flex:0 0 320px;height:400px;border-radius:28px;background:var(--card);border:1px dashed var(--borda-foto);display:flex;flex-direction:column;justify-content:flex-end;padding:24px;gap:4px;position:relative;overflow:hidden;transition:transform .4s}
.foto:hover{transform:translateY(-6px)}
.foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.foto.tem-foto{border:0}
.foto.tem-foto::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(6,14,38,.75),rgba(6,14,38,0) 55%)}
.foto span,.foto strong{position:relative;z-index:1}
.foto span{font-size:12px;font-weight:700;letter-spacing:1.2px;color:var(--lt)}
.foto strong{font-family:Montserrat,sans-serif;font-weight:800;font-size:20px;color:var(--txt)}
.foto.tem-foto span{color:var(--laranja)}.foto.tem-foto strong{color:#fff}

/* ---------- visite ---------- */
.visite{background:var(--escuro);color:#fff;position:relative;overflow:hidden}
.visite .onda-top{position:absolute;left:0;top:-1px;width:100%;height:60px;display:block}
.visite .onda-top path{fill:var(--suave)}
.visite .wrap{position:relative;display:flex;flex-wrap:wrap;gap:56px;align-items:center;padding-top:120px;padding-bottom:96px}
.visite .col{flex:1 1 480px;min-width:0;display:flex;flex-direction:column;gap:20px}
.visite .titulo{color:#fff}.visite .titulo em{color:var(--laranja)}
.visite p{font-size:18px;line-height:1.55;color:#D3DCF0;max-width:520px}
.info{display:flex;flex-direction:column;gap:14px;font-size:16px}
.info span{display:flex;align-items:center;gap:12px}
.mapa{flex:1 1 420px;min-width:0;position:relative;height:380px;border-radius:32px;background:var(--mapa);overflow:hidden;display:block;text-decoration:none}
.mapa svg{position:absolute;inset:0;width:100%;height:100%}
.pulsa{animation:pulsa 2.4s ease-out infinite;transform-origin:214px 186px}
.pulsa.b{animation-delay:1.2s}
@keyframes pulsa{from{transform:scale(.4);opacity:.9}to{transform:scale(2.6);opacity:0}}
.mapa .cartaz{position:absolute;left:20px;bottom:20px;right:20px;background:#fff;color:var(--marinho);border-radius:20px;padding:16px 18px;display:flex;align-items:center;gap:14px;font-size:14px;line-height:1.35}
.mapa .cartaz img{height:34px;width:auto}

/* conteúdo das páginas de serviço */
.blocos{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.bloco{background:var(--suave);border-radius:24px;padding:24px;display:flex;flex-direction:column;gap:8px}
.bloco strong{font-family:Montserrat,sans-serif;font-size:18px}
.bloco span{color:var(--txt2);font-size:15px;line-height:1.5}
.outros{display:flex;flex-wrap:wrap;gap:10px}
.outros a{background:var(--suave);color:var(--txt);text-decoration:none;font-weight:600;font-size:14px;padding:12px 18px;border-radius:999px}
.outros a:hover{background:rgba(243,122,44,.15)}

/* ---------- rodapé ---------- */
.rodape{background:var(--rodape);color:#A9B6D3;font-size:14px}
.rodape .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;padding-top:28px;padding-bottom:28px}
.rodape strong{color:#fff;font-family:Montserrat,sans-serif}
.rodape a{color:#A9B6D3}

/* botão flutuante do WhatsApp */
.whats-flutua{position:fixed;right:18px;bottom:18px;z-index:40;width:60px;height:60px;border-radius:999px;background:#0F7A3F;color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 12px 30px rgba(0,0,0,.3)}

/* ---------- janela de pedido ---------- */
.janela{position:fixed;inset:0;z-index:60;background:rgba(6,14,38,.55);display:flex;align-items:flex-end;justify-content:center;padding:16px}
.janela[hidden]{display:none}
.janela .caixa{width:100%;max-width:520px;max-height:92vh;overflow-y:auto;background:var(--card);color:var(--txt);border-radius:28px;padding:26px;display:flex;flex-direction:column;gap:18px;box-shadow:0 30px 80px rgba(0,0,0,.35);animation:sobe .45s cubic-bezier(.2,.7,.2,1) both}
@media (min-width:700px){.janela{align-items:center}}
.janela .cab{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.janela small{font-size:12px;font-weight:700;letter-spacing:1.2px;color:var(--lt)}
.janela h2{font-weight:800;font-size:24px;line-height:1.15}
.fechar{flex:none;width:44px;height:44px;border-radius:999px;border:0;background:var(--suave);color:var(--txt);font-size:20px;cursor:pointer}
.previa small{color:var(--txt3);letter-spacing:1px}
.balao{background:#E7F7EE;color:#0C1E4A;border-radius:4px 18px 18px 18px;padding:14px 16px;font-size:15px;line-height:1.5;white-space:pre-line;margin-top:6px}

/* ---------- entradas suaves ---------- */
.sobe{animation:sobe .9s cubic-bezier(.2,.7,.2,1) both}
.d1{animation-delay:.12s}.d2{animation-delay:.24s}.d3{animation-delay:.36s}
@keyframes sobe{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@supports (animation-timeline: view()){
  .revela{animation:sobe linear both;animation-timeline:view();animation-range:entry 0% cover 28%}
}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  .pulso,.giro,.flut,.trilho,.sobe,.revela,.pulsa,.poeira,.brilho,.janela .caixa{animation:none !important}
}
@media (max-width:560px){
  .flut-anos strong{font-size:26px}
  .moldura{height:380px}
  .giro{display:none}
  .escolhas{grid-template-columns:1fr}
}

/* desempenho: título e texto do topo aparecem na hora (não atrasam o carregamento) */
.hero h1.sobe,.hero p.sobe{animation:none}

/* fotos da galeria com link */
.foto-link{text-decoration:none;cursor:pointer}
.foto .ver{position:relative;z-index:1;font-style:normal;font-size:13px;font-weight:700;color:var(--laranja);margin-top:6px;opacity:.9;transition:transform .25s}
.foto-link:hover .ver{transform:translateX(4px)}
.foto img{-webkit-user-drag:none;user-select:none}