/* Solares Engenharia — maquete isométrica de Salvador */

@font-face{font-family:'Atkinson Hyperlegible';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/atkinson-hyperlegible-400.woff2) format('woff2')}
@font-face{font-family:'Atkinson Hyperlegible';font-style:italic;font-weight:400;font-display:swap;src:url(../fonts/atkinson-hyperlegible-400-italic.woff2) format('woff2')}
@font-face{font-family:'Atkinson Hyperlegible';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/atkinson-hyperlegible-700.woff2) format('woff2')}
@font-face{font-family:'Unbounded';font-style:normal;font-weight:400 800;font-display:swap;src:url(../fonts/unbounded-500.woff2) format('woff2')}

:root{
  --ceu:#00A7E4;
  --ceu-fundo:#E3F4FC;
  --ceu-linha:#A9DDF4;
  --ceu-meio:#CDEBF9;
  --marinho:#191A42;
  --marinho-2:#2B2D63;
  --tinta-2:#34376E;
  --sol:#F5A019;
  --sol-fundo:#FFE7B8;
  --azulejo:#1E4E9C;
  --folha:#2F8F5B;
  --led:#39D07A;
  --alerta:#D63A2B;
  --branco:#FFFFFF;
  --papel:#F7FBFE;

  --f-display:'Unbounded', 'Arial Rounded MT Bold', sans-serif;
  --f-texto:'Atkinson Hyperlegible', 'Segoe UI', system-ui, sans-serif;

  --r-s:10px; --r:16px; --r-l:26px; --r-pill:999px;
  --borda:2px solid var(--marinho);
  --sombra:0 14px 28px -14px rgba(27,28,70,.45), 0 2px 0 rgba(27,28,70,.08);
  --sombra-alta:0 22px 40px -18px rgba(27,28,70,.55), 0 3px 0 rgba(27,28,70,.08);

  --gutter:clamp(16px, 4vw, 48px);
  --max:1440px;
  --ease:cubic-bezier(.16,1,.3,1);
  --assenta:cubic-bezier(.22,1,.36,1);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:24px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--ceu-fundo);color:var(--marinho);font:400 1.125rem/1.6 var(--f-texto);text-rendering:optimizeLegibility}
img,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration-thickness:2px;text-underline-offset:.22em}
a:hover{text-decoration-color:var(--sol)}
::selection{background:var(--sol);color:var(--marinho)}
:focus-visible{outline:3px solid var(--marinho);outline-offset:3px;border-radius:6px;box-shadow:0 0 0 6px var(--sol)}
html{scrollbar-color:var(--marinho) var(--ceu-fundo)}
input,textarea,select,button{font:inherit;color:inherit}
input,textarea{caret-color:var(--sol)}

h1,h2,h3,h4{font-family:var(--f-display);font-weight:600;line-height:1.1;letter-spacing:-.02em;margin:0;text-wrap:balance}
h1{font-size:clamp(2rem, 1.2rem + 3vw, 3.6rem);font-weight:700}
h2{font-size:clamp(1.6rem, 1.05rem + 2vw, 2.6rem)}
h3{font-size:clamp(1.2rem, 1rem + .7vw, 1.55rem)}
p{margin:0}
.lede{font-size:clamp(1.12rem, 1rem + .4vw, 1.3rem);line-height:1.55;max-width:38ch}
.prose{max-width:66ch}
.prose > * + *{margin-top:1em}
.num{font-variant-numeric:tabular-nums}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.pular{position:absolute;left:12px;top:-60px;z-index:50;background:var(--sol);color:var(--marinho);padding:10px 16px;border:var(--borda);border-radius:var(--r-pill);font-weight:700;text-decoration:none}
.pular:focus{top:12px}

.wrap{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter)}

/* ---------- ícones ---------- */
.i{width:1.25em;height:1.25em;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.i-cheio{fill:currentColor;stroke:none}

/* ---------- botões ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6em;min-height:54px;padding:.7em 1.4em;border:var(--borda);border-radius:var(--r-pill);font:600 1.06rem/1.2 var(--f-display);letter-spacing:-.01em;text-decoration:none;cursor:pointer;background:var(--branco);color:var(--marinho);box-shadow:var(--sombra);transition:transform .35s var(--ease), box-shadow .35s var(--ease), background-color .2s}
.btn:hover{transform:translateY(-3px);box-shadow:var(--sombra-alta)}
.btn:active{transform:translateY(1px);box-shadow:0 6px 12px -8px rgba(27,28,70,.5);transition-duration:.08s}
.btn-sol{background:var(--sol)}
.btn-sol:hover{background:#FFB23A}
.btn-marinho{background:var(--marinho);color:var(--branco)}
.btn-marinho:hover{background:var(--marinho-2)}
.btn-sm{min-height:44px;padding:.55em 1.05em;font-size:1rem}
.btn[aria-disabled="true"],.btn:disabled{opacity:.55;cursor:not-allowed;transform:none;box-shadow:none}
.link-seta{display:inline-flex;align-items:center;gap:.45em;font-weight:700;text-decoration:none;border-bottom:2px solid var(--sol);padding-block:.2em;min-height:44px}
.link-seta .i{transition:transform .3s var(--ease)}
.link-seta:hover .i{transform:translateX(4px)}

/* ---------- painéis (peças-adesivo) ---------- */
.painel{background:var(--branco);border:var(--borda);border-radius:var(--r-l);box-shadow:var(--sombra)}
.etiqueta{display:inline-flex;align-items:center;gap:.4em;padding:.25em .8em;border:var(--borda);border-radius:var(--r-pill);background:var(--branco);font:600 0.95rem/1.3 var(--f-display);letter-spacing:.01em}

/* ---------- cabeçalho ---------- */
.topo{position:relative;z-index:20;background:var(--ceu)}
.topo .wrap{display:flex;align-items:center;gap:20px;min-height:84px}
.marca{display:flex;align-items:center;flex:none;min-height:44px}
.topo .marca{background:var(--branco);border:var(--borda);border-radius:var(--r-pill);padding:9px 22px;box-shadow:var(--sombra)}
.marca img{width:auto;height:42px}
.nav{margin-left:auto;display:flex;align-items:center;gap:6px}
.nav ul{list-style:none;margin:0;padding:6px;display:flex;gap:2px;background:var(--branco);border:var(--borda);border-radius:var(--r-pill);box-shadow:var(--sombra)}
.nav a{display:flex;align-items:center;min-height:40px;padding:0 14px;border-radius:var(--r-pill);font:500 0.95rem/1 var(--f-display);text-decoration:none;white-space:nowrap}
.nav a:hover{background:var(--ceu-fundo)}
.nav a[aria-current="page"]{background:var(--marinho);color:var(--branco)}
.topo-zap{flex:none}
.menu-btn{display:none;margin-left:auto;align-items:center;justify-content:center;width:52px;height:52px;border:var(--borda);border-radius:50%;background:var(--branco);box-shadow:var(--sombra);cursor:pointer}
@media (max-width:1560px){
  .nav a{padding:0 11px}
  .topo-zap .rotulo{display:none}
  .topo-zap{width:52px;padding:0}
}
@media (max-width:1400px){
  .menu-btn{display:inline-flex}
  .topo-zap{order:2}
  .nav{display:none;position:absolute;left:var(--gutter);right:var(--gutter);top:calc(100% - 6px);margin:0}
  .nav.aberto{display:block}
  .nav ul{flex-direction:column;border-radius:var(--r-l);padding:10px}
  .nav a{min-height:52px;font-size:1rem;padding:0 16px}
  .js .nav{display:none}
  .js .nav.aberto{display:block;animation:desce .35s var(--ease)}
  .no-js-nav .nav{display:block;position:static}
}
@keyframes desce{from{opacity:0;transform:translateY(-8px)}}

/* ---------- herói da home (a maquete) ---------- */
.heroi{background:var(--ceu);padding-block:clamp(12px, 2vw, 28px) clamp(48px, 6vw, 88px);position:relative;overflow:hidden}
.heroi-extra .livro{margin-top:0}
.heroi-texto{padding-top:clamp(8px, 2.4vw, 40px);display:flex;flex-direction:column;gap:22px;position:relative;z-index:2}
.heroi-texto h1{max-width:13ch}
.acoes{display:flex;flex-wrap:wrap;gap:12px}
.livro{display:grid;grid-template-columns:repeat(3, minmax(0,1fr));gap:0;margin-top:8px;border:var(--borda);border-radius:var(--r);background:var(--branco);overflow:hidden;max-width:420px}
.livro div{padding:12px 16px}
.livro div + div{border-left:2px solid var(--marinho)}
.livro b{display:block;font:600 1.7rem/1.1 var(--f-display);font-variant-numeric:tabular-nums}
.livro span{font-size:1rem;line-height:1.3;display:block}
.livro-nota{font-size:0.95rem;margin-top:6px}

.maquete{position:relative;width:100%}
.heroi-extra .hoje{max-width:420px}
.predio{width:100%;height:auto;overflow:visible}
.predio .guia{stroke:var(--marinho);stroke-width:1.5;stroke-dasharray:5 6;opacity:.5}
.predio .fluxo{fill:none;stroke:var(--sol);stroke-width:5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:14 10;animation:flui 1.6s linear infinite}
@keyframes flui{to{stroke-dashoffset:-48}}
.predio .tag rect{fill:var(--branco);stroke:var(--marinho);stroke-width:2;transition:fill .2s}
.predio .tag text{font:600 21px var(--f-display);fill:var(--marinho);letter-spacing:-.01em}
.predio .tag:hover rect,.predio .tag:focus-visible rect{fill:var(--sol)}
.predio .tag:focus{outline:none}
.predio .tag:focus-visible rect{stroke-width:3}
.predio .raios{transform-box:fill-box;transform-origin:center;animation:gira 40s linear infinite}
@keyframes gira{to{transform:rotate(360deg)}}
.predio .led{animation:pisca 2.4s ease-in-out infinite}
@keyframes pisca{50%{opacity:.35}}
.predio .peca{transition:opacity .45s var(--ease), transform .6s var(--assenta), filter .45s}
.predio.montando .peca{opacity:.18;filter:grayscale(1)}
.predio.montando .peca.ligada{opacity:1;filter:none}
.predio .peca.caiu{animation:cai .7s var(--assenta)}
@keyframes cai{0%{transform:translateY(-26px);opacity:0}60%{opacity:1}}
@media (prefers-reduced-motion:reduce){
  .predio .fluxo{animation:none;stroke-dasharray:none}
  .predio .raios,.predio .led{animation:none}
  .predio .peca.caiu{animation:aparece .3s ease-out}
}
@keyframes aparece{from{opacity:0}}

.mobilia{margin-top:14px;padding:8px;display:grid;grid-template-columns:repeat(4, minmax(0,1fr));gap:6px;border-radius:var(--r-l)}
.mobilia-titulo{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;gap:8px;padding:4px 8px 2px;font:600 0.95rem/1.3 var(--f-display)}
.mobilia-titulo button{border:0;background:none;padding:6px 4px;min-height:44px;font:700 0.95rem/1 var(--f-texto);text-decoration:underline;text-underline-offset:.2em;cursor:pointer}
.peca-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:84px;padding:10px 6px;border:2px solid transparent;border-radius:var(--r);background:var(--ceu-fundo);font:600 0.95rem/1.2 var(--f-display);text-align:center;cursor:pointer;transition:background-color .2s, border-color .2s, transform .35s var(--assenta)}
.peca-btn .i{width:28px;height:28px}
.peca-btn:hover{border-color:var(--marinho)}
.peca-btn[aria-pressed="true"]{background:var(--sol);border-color:var(--marinho);transform:translateY(-2px)}
.peca-btn[aria-pressed="true"] .marca-ok{opacity:1}
.peca-btn .marca-ok{opacity:0}
.no-js .mobilia, .no-js .ficha-js{display:none}

.lateral{display:flex;flex-direction:column;gap:16px;padding-top:clamp(0px, 3vw, 40px)}
.hoje{padding:18px 20px}
.hoje h2,.ficha h2{font-size:1rem;display:flex;align-items:center;gap:.5em}
.hoje-linha{display:flex;align-items:center;gap:14px;margin-top:12px}
.hoje-arco{width:96px;flex:none}
.hoje-arco .ceu-arco{fill:none;stroke:var(--ceu-linha);stroke-width:3;stroke-dasharray:3 5}
.hoje-arco .chao{stroke:var(--marinho);stroke-width:2}
.hoje-arco .solzinho{fill:var(--sol);stroke:var(--marinho);stroke-width:2}
.hoje dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:2px 10px;font-size:1rem}
.hoje dt{font-weight:700}
.hoje dd{margin:0;font-variant-numeric:tabular-nums}
.hoje-nota{margin-top:10px;font-size:1rem;line-height:1.45}

.ficha{padding:18px 20px;display:flex;flex-direction:column;gap:12px}
.ficha fieldset{border:0;margin:0;padding:0}
.ficha legend{font-weight:700;font-size:1rem;margin-bottom:6px}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{position:relative}
.chip input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.chip span{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border:var(--borda);border-radius:var(--r-pill);background:var(--branco);font-weight:700;font-size:1rem;transition:background-color .2s}
.chip input:checked + span{background:var(--marinho);color:var(--branco)}
.chip input:focus-visible + span{outline:3px solid var(--marinho);outline-offset:2px;box-shadow:0 0 0 6px var(--sol)}
.ficha-lista{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.ficha-lista li{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border-radius:var(--r-s);background:var(--ceu-fundo);font-size:1rem;line-height:1.4;animation:aparece .4s var(--ease)}
.ficha-lista li b{display:block;font-family:var(--f-display);font-weight:600;font-size:0.95rem}
.ficha-lista .i{margin-top:2px;color:var(--azulejo)}
.ficha-vazia{font-size:1rem;line-height:1.45;padding:12px;border:2px dashed var(--ceu-linha);border-radius:var(--r-s)}
.aviso{display:none;gap:10px;padding:12px;border-radius:var(--r-s);background:var(--sol-fundo);border:2px solid var(--marinho);font-size:1rem;line-height:1.45}
.aviso.ativo{display:grid}
.aviso button{justify-self:start}

/* ---------- seções ---------- */
.secao{padding-block:clamp(64px, 9vw, 128px)}
.secao-branca{background:var(--ceu-meio)}
.secao-marinho{background:var(--marinho);color:var(--branco)}
.secao-cabeca{display:flex;flex-direction:column;gap:14px;margin-bottom:clamp(32px, 5vw, 64px);max-width:62ch}

/* cômodos (serviços) */
.comodos{display:flex;flex-direction:column;gap:clamp(56px, 8vw, 112px)}
.comodo{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(24px, 4vw, 64px);align-items:center}
.comodo:nth-child(even){grid-template-columns:minmax(0,6fr) minmax(0,5fr)}
.comodo:nth-child(even) .comodo-texto{order:2}
.comodo-texto{display:flex;flex-direction:column;gap:16px}
.comodo-texto ul{margin:0;padding:0;list-style:none;display:grid;gap:6px}
.comodo-texto li{display:flex;gap:10px;align-items:baseline}
.comodo-texto li::before{content:"";flex:none;width:10px;height:10px;border:2px solid var(--marinho);background:var(--sol);transform:rotate(45deg) translateY(-1px)}
.comodo-visual{position:relative;min-height:320px}
.comodo-visual .foto{border:var(--borda);border-radius:var(--r-l);overflow:hidden;box-shadow:var(--sombra);background:var(--ceu-linha)}
.comodo-visual .foto img{width:100%;height:100%;object-fit:cover}
.comodo-visual .sala{position:absolute;width:min(58%, 330px);filter:drop-shadow(0 16px 18px rgba(27,28,70,.25))}
.cv-a .foto{width:78%;aspect-ratio:4/3;margin-left:auto}
.cv-a .sala{left:-2%;bottom:-8%}
.cv-b .foto{width:62%;aspect-ratio:3/4}
.cv-b .sala{right:-2%;bottom:6%;width:min(64%, 360px)}
.cv-c .foto{width:70%;aspect-ratio:1/1;margin-left:auto}
.cv-c .sala{left:0;top:-6%}
.comodo h3 a{text-decoration:none}
.comodo h3 a:hover{text-decoration:underline;text-decoration-color:var(--sol)}

/* medir antes de ligar */
.medir-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px, 5vw, 72px);align-items:start}
.curva-painel{padding:clamp(16px, 2.4vw, 28px);color:var(--marinho)}
.curva-topo{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px}
.curva-topo h3{font-size:1.05rem}
.alterna{display:inline-flex;max-width:100%;padding:4px;border:var(--borda);border-radius:var(--r-pill);background:var(--ceu-fundo)}
.alterna button{min-height:40px;padding:0 14px;border:0;border-radius:var(--r-pill);background:none;font:600 0.95rem/1 var(--f-display);cursor:pointer}
.alterna button[aria-pressed="true"]{background:var(--marinho);color:var(--branco)}
.curva svg{width:100%;height:auto}
.curva .eixo{stroke:var(--marinho);stroke-width:2}
.curva .grade{stroke:#D6E6F1;stroke-width:1}
.curva .limite{stroke:var(--alerta);stroke-width:2.5;stroke-dasharray:8 6}
.curva .hoje-l{fill:none;stroke:var(--azulejo);stroke-width:3.5;stroke-linejoin:round}
.curva .hoje-a{fill:rgba(0,167,228,.18)}
.curva .extra-l{fill:none;stroke:var(--sol);stroke-width:3.5;stroke-linejoin:round;transition:opacity .5s var(--ease)}
.curva .extra-a{fill:rgba(245,160,25,.25);transition:opacity .5s var(--ease)}
.curva .excesso{fill:var(--alerta);transition:opacity .5s var(--ease)}
.curva text{font:500 15px var(--f-texto);fill:var(--marinho)}
.curva .rot-limite{font-weight:700;fill:var(--alerta)}
.curva[data-modo="hoje"] .extra-l,.curva[data-modo="hoje"] .extra-a,.curva[data-modo="hoje"] .excesso{opacity:0}
.curva-legenda{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:10px;font-size:1rem}
.curva-legenda span{display:inline-flex;align-items:center;gap:8px}
.curva-legenda i{width:22px;height:4px;border-radius:var(--r-pill);display:inline-block}
.curva-nota{margin-top:10px;font-size:0.95rem;line-height:1.45}
.curva-leitura{margin-top:12px;padding:12px 14px;border-radius:var(--r-s);background:var(--ceu-fundo);font-size:1rem;line-height:1.45;min-height:3.2em}

.passos{list-style:none;margin:clamp(40px, 6vw, 72px) 0 0;padding:0;display:grid;grid-template-columns:repeat(4, minmax(0,1fr));gap:16px;counter-reset:passo}
.passo{position:relative;padding:22px 20px 20px;border:2px solid rgba(255,255,255,.35);border-radius:var(--r-l);transition:background-color .3s, border-color .3s, color .3s}
.passo .n{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;border:2px solid currentColor;font:700 1.1rem/1 var(--f-display);margin-bottom:14px}
.passo h3{font-size:1.1rem;margin-bottom:8px}
.passo p{font-size:1rem;line-height:1.5}
.passo:hover,.passo.ativo{background:var(--sol);border-color:var(--sol);color:var(--marinho)}
.passo:hover .n,.passo.ativo .n{background:var(--branco);border-color:var(--marinho)}
.secao-marinho .lede,.secao-marinho .prose{color:var(--ceu-fundo)}
.secao-marinho a:not(.btn){color:var(--branco)}
.foto-medicao{margin-top:24px;border:2px solid var(--branco);border-radius:var(--r-l);overflow:hidden;aspect-ratio:4/3}
.foto-medicao img{width:100%;height:100%;object-fit:cover}
figcaption{font-size:1rem;line-height:1.4;margin-top:8px}

/* diário de obra */
.diario{display:grid;grid-template-columns:repeat(12, minmax(0,1fr));grid-auto-rows:clamp(90px, 9vw, 130px);gap:14px}
.diario figure{margin:0;position:relative;border:var(--borda);border-radius:var(--r);overflow:hidden;background:var(--ceu-linha);box-shadow:var(--sombra)}
.diario img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.diario figure:hover img{transform:scale(1.04)}
.diario figcaption{position:absolute;left:10px;bottom:10px;right:10px;margin:0;display:inline-block;width:fit-content;max-width:calc(100% - 20px);padding:6px 10px;background:var(--branco);border:var(--borda);border-radius:var(--r-s);font-size:0.95rem;line-height:1.3;font-weight:700}
.d1{grid-column:1/6;grid-row:span 4}
.d2{grid-column:6/10;grid-row:span 2}
.d3{grid-column:10/13;grid-row:span 3}
.d4{grid-column:6/10;grid-row:span 2}
.d5{grid-column:10/13;grid-row:span 3}
.d6{grid-column:1/4;grid-row:span 2}
.d7{grid-column:4/10;grid-row:span 2}

/* sobre (home) */
.sobre-grid{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(28px, 5vw, 72px);align-items:center}
.sobre-foto{border:var(--borda);border-radius:var(--r-l);overflow:hidden;aspect-ratio:4/5;box-shadow:var(--sombra)}
.sobre-foto img{width:100%;height:100%;object-fit:cover}

/* fechamento */
.fecho{background:var(--sol);padding-block:clamp(56px, 8vw, 104px)}
.fecho-grid{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(28px, 5vw, 64px);align-items:center}
.canais{list-style:none;margin:0;padding:8px;display:flex;flex-direction:column}
.canais li + li{border-top:2px solid var(--ceu-fundo)}
.canais a,.canais .canal{display:flex;align-items:center;gap:14px;padding:14px 12px;min-height:60px;text-decoration:none;border-radius:var(--r)}
.canais a:hover{background:var(--ceu-fundo)}
.canais .ico{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:var(--borda);background:var(--ceu-fundo);flex:none}
.canais small{display:block;font-size:0.95rem;line-height:1.3}
.canais strong{font-family:var(--f-display);font-weight:600;font-size:1rem;overflow-wrap:anywhere}

/* rodapé */
.rodape{background:var(--marinho);color:var(--ceu-fundo);padding-block:56px 32px;font-size:1rem}
.rodape a{color:var(--branco);text-decoration:none}
.rodape a:hover{text-decoration:underline;text-decoration-color:var(--sol)}
.rodape-grid{display:grid;grid-template-columns:minmax(0,4fr) repeat(3, minmax(0,3fr));gap:32px}
.rodape h2{font-size:1rem;color:var(--branco);margin-bottom:12px}
.rodape ul{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.rodape li a{display:inline-flex;min-height:36px;align-items:center}
.rodape .marca img{height:52px}
.rodape-base{margin-top:40px;padding-top:20px;border-top:1px solid rgba(255,255,255,.2);display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;font-size:1rem}

/* barra de contato fixa no celular */
.barra-contato{display:none}
@media (max-width:760px){
  .barra-contato{display:grid;grid-template-columns:1fr auto;gap:8px;position:fixed;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));z-index:30;padding:8px;background:var(--branco);border:var(--borda);border-radius:var(--r-pill);box-shadow:var(--sombra-alta)}
  .barra-contato .btn{min-height:48px;box-shadow:none}
  .barra-contato .btn:hover{transform:none}
  body{padding-bottom:88px}
}

/* ---------- páginas internas ---------- */
.miolo-heroi{background:var(--ceu);padding-block:clamp(16px, 3vw, 32px) clamp(48px, 7vw, 96px)}
.migalhas{font-size:1rem;margin-bottom:clamp(16px, 3vw, 32px)}
.migalhas ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.migalhas li + li::before{content:"/";margin-right:6px}
.migalhas a{display:inline-flex;min-height:44px;align-items:center}
.miolo-grid{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(24px, 4vw, 56px);align-items:center}
.miolo-grid .sala{width:100%;max-width:520px;margin-inline:auto;filter:drop-shadow(0 18px 20px rgba(27,28,70,.25))}
.miolo-texto{display:flex;flex-direction:column;gap:20px}
.miolo-texto h1{max-width:16ch}

.lista-servico{display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:0;border:var(--borda);border-radius:var(--r-l);overflow:hidden;background:var(--branco)}
.lista-servico > div{padding:clamp(18px, 2.4vw, 28px);border-top:2px solid var(--marinho)}
.lista-servico > div:nth-child(-n+2){border-top:0}
.lista-servico > div:nth-child(even){border-left:2px solid var(--marinho)}
.lista-servico > div:last-child:nth-child(odd){grid-column:1/-1}
.lista-servico h3{font-size:1.1rem;margin-bottom:8px}
.lista-servico p{font-size:1.02rem;line-height:1.55}

.publicos{display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:clamp(20px, 3vw, 40px)}
.publico{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:start}
.publico .ico{display:grid;place-items:center;width:56px;height:56px;border:var(--borda);border-radius:var(--r);background:var(--sol);box-shadow:var(--sombra)}
.publico .ico .i{width:28px;height:28px}
.publico h3{font-size:1.1rem;margin-bottom:6px}

.faixa-fotos{display:grid;grid-template-columns:repeat(3, minmax(0,1fr));gap:16px;align-items:start}
.faixa-fotos figure{margin:0}
.faixa-fotos .f{aspect-ratio:1/1;border:var(--borda);border-radius:var(--r);overflow:hidden;box-shadow:var(--sombra);background:var(--ceu-linha)}
.faixa-fotos img{width:100%;height:100%;object-fit:cover}

.perguntas{display:flex;flex-direction:column;gap:10px;max-width:860px}
.perguntas details{background:var(--branco);border:var(--borda);border-radius:var(--r)}
.perguntas summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px 20px;min-height:60px;font:600 1.02rem/1.35 var(--f-display)}
.perguntas summary::-webkit-details-marker{display:none}
.perguntas summary .i{transition:transform .35s var(--ease);flex:none}
.perguntas details[open] summary .i{transform:rotate(45deg)}
.perguntas details > div{padding:0 20px 20px;max-width:70ch}
.perguntas details > div > * + *{margin-top:.8em}

.chamada{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center;padding:clamp(24px, 4vw, 44px)}
.chamada h2{font-size:clamp(1.4rem, 1rem + 1.4vw, 2rem)}

/* projetos */
.filtros{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px}
.filtros button{min-height:44px;padding:0 16px;border:var(--borda);border-radius:var(--r-pill);background:var(--branco);font:600 0.95rem/1 var(--f-display);cursor:pointer}
.filtros button[aria-pressed="true"]{background:var(--marinho);color:var(--branco)}
.galeria{display:grid;grid-template-columns:repeat(auto-fill, minmax(280px, 1fr));gap:16px}
.galeria figure{margin:0;display:flex;flex-direction:column;background:var(--branco);border:var(--borda);border-radius:var(--r);overflow:hidden;box-shadow:var(--sombra)}
.galeria figure[hidden]{display:none}
.galeria img{width:100%;aspect-ratio:4/3;object-fit:cover;border-bottom:2px solid var(--marinho)}
.galeria figcaption{margin:0;padding:10px 14px 12px;font-size:1rem;line-height:1.4}
.galeria figcaption b{display:block;font-family:var(--f-display);font-weight:600;font-size:0.95rem;color:var(--azulejo)}

/* contato */
.contato-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(24px, 4vw, 56px);align-items:start}
.form{padding:clamp(20px, 3vw, 36px);display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:18px}
.campo{display:flex;flex-direction:column;gap:6px}
.campo.largo{grid-column:1/-1}
.campo label{font-weight:700}
.campo .dica{font-size:1rem;line-height:1.35}
.campo input,.campo select,.campo textarea{width:100%;min-height:52px;padding:12px 14px;border:var(--borda);border-radius:var(--r-s);background:var(--papel);font-size:1.05rem}
.campo textarea{min-height:140px;resize:vertical;line-height:1.5}
.campo input::placeholder,.campo textarea::placeholder{color:#55588A}
.campo input:focus,.campo select:focus,.campo textarea:focus{outline:none;background:var(--branco);box-shadow:0 0 0 4px var(--sol)}
.campo input[aria-invalid="true"],.campo textarea[aria-invalid="true"]{border-color:var(--alerta);background:#FFF3F1}
.erro{color:var(--alerta);font-weight:700;font-size:1rem;display:none}
.erro.ativo{display:block}
.mel{position:absolute;left:-9999px}
.form-rodape{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between}
.form-rodape p{font-size:1rem;max-width:40ch}
.status{grid-column:1/-1;padding:14px 16px;border-radius:var(--r-s);border:var(--borda);font-weight:700;display:none}
.status.ok{display:block;background:#DFF6E8}
.status.falha{display:block;background:#FFE3DF}

/* página simples */
.simples{min-height:60vh;display:grid;place-items:center;text-align:center;padding-block:80px}
.simples .sala{max-width:360px;margin:0 auto 24px}

/* ---------- responsivo ---------- */
@media (max-width:1080px){
  .heroi-texto h1{max-width:18ch}
}
@media (max-width:900px){
  .heroi-grid,.comodo,.comodo:nth-child(even),.medir-grid,.sobre-grid,.fecho-grid,.miolo-grid,.contato-grid{grid-template-columns:minmax(0,1fr)}
  .comodo:nth-child(even) .comodo-texto{order:0}
  .comodo-visual{min-height:0}
  .passos{grid-template-columns:repeat(2, minmax(0,1fr))}
  .rodape-grid{grid-template-columns:repeat(2, minmax(0,1fr))}
  .chamada{grid-template-columns:minmax(0,1fr)}
  .diario{grid-template-columns:repeat(6, minmax(0,1fr));grid-auto-rows:110px}
  .d1{grid-column:1/-1;grid-row:span 3}
  .d2,.d4{grid-column:span 3;grid-row:span 2}
  .d3,.d5{grid-column:span 3;grid-row:span 3}
  .d6{grid-column:span 3;grid-row:span 2}
  .d7{grid-column:1/-1;grid-row:span 2}
  .miolo-grid .sala{max-width:440px}
}
@media (max-width:640px){
  .lista-servico,.publicos,.form{grid-template-columns:minmax(0,1fr)}
  .lista-servico > div:nth-child(even){border-left:0}
  .lista-servico > div:nth-child(2){border-top:2px solid var(--marinho)}
  .passos{grid-template-columns:minmax(0,1fr)}
  .rodape-grid{grid-template-columns:minmax(0,1fr)}
  .faixa-fotos{grid-template-columns:minmax(0,1fr)}
  .comodo-visual .sala{width:62%}
  .cv-a .foto,.cv-b .foto,.cv-c .foto{width:100%}
  .cv-a .sala{bottom:-14%}
  .comodo-visual{margin-bottom:10%}
  .cv-c .sala{top:auto;bottom:-14%}
  .topo .wrap{min-height:72px;gap:10px}
  .marca img{height:32px}
  .topo .marca{padding:7px 14px}
  .topo-zap{display:none}
  .livro{max-width:none}
}
.no-js .js-only{display:none}

@media (max-width:640px){.alterna{display:flex;width:100%}.alterna button{flex:1;padding:0 8px}}
.migalhas li{display:flex;align-items:center}
.nav a[aria-current="page"]:hover{background:var(--marinho-2);color:var(--branco)}
.secao-marinho .painel{box-shadow:none}
.hoje h2,.ficha h2{font-size:1.1rem}
.passo:hover .n,.passo.ativo .n{color:var(--marinho)}
.secao-marinho .btn{box-shadow:none}
.predio .tag:focus-visible rect{fill:var(--sol);stroke-width:4}
.predio .tag:focus-visible text{text-decoration:underline}
.predio .tag{cursor:pointer}
.rodape .social{gap:8px}
.rodape .social .i{width:20px;height:20px}

/* ---------- herói: texto | maquete | ferramentas ---------- */
.heroi-grid{display:grid;grid-template-columns:minmax(0,3.2fr) minmax(0,5.3fr) minmax(270px,2.6fr);grid-template-areas:"texto maquete ferr" "extra maquete ferr";grid-template-rows:auto 1fr;column-gap:clamp(20px, 2.2vw, 40px);row-gap:22px;align-items:start}
.heroi-texto{grid-area:texto}
.heroi-texto h1{font-size:clamp(2rem, 1rem + 2.3vw, 3.15rem);max-width:12ch}
.heroi-extra{grid-area:extra;display:flex;flex-direction:column;gap:18px}
.heroi-extra .livro{margin-top:0}
.maquete{grid-area:maquete;display:flex;justify-content:center;align-self:stretch}
.maquete .predio{display:block;height:min(900px, calc(100vh - 120px));min-height:560px;width:auto;max-width:100%;margin-top:-6px}
.ferramentas{grid-area:ferr;display:flex;flex-direction:column;gap:14px;padding-top:clamp(0px, 1.6vw, 24px)}
.ferramentas .mobilia{margin-top:0;grid-template-columns:minmax(0,1fr);gap:6px}
.ferramentas .peca-btn{flex-direction:row;justify-content:flex-start;gap:12px;min-height:56px;padding:8px 14px;font-size:1.02rem;text-align:left}
.ferramentas .peca-btn .i{width:24px;height:24px}
.ferramentas .ficha{padding:16px 18px;gap:10px}
.ferramentas .chip span{min-height:44px;padding:0 13px;font-size:1.02rem}
.ferramentas .ficha-vazia{font-size:1rem;padding:10px}
@media (max-width:1180px){
  .heroi-grid{grid-template-columns:minmax(0,4fr) minmax(0,6fr);grid-template-areas:"texto maquete" "extra maquete" "ferr ferr"}
  .ferramentas{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);align-items:start;padding-top:0}
  .ferramentas .mobilia{grid-template-columns:repeat(2, minmax(0,1fr))}
  .ferramentas .peca-btn{flex-direction:column;justify-content:center;text-align:center;min-height:84px}
  .maquete .predio{height:auto;min-height:0;width:100%;max-width:640px}
}
@media (max-width:1080px){
  .heroi-grid{grid-template-columns:minmax(0,1fr);grid-template-areas:"texto" "maquete" "ferr" "extra";grid-template-rows:auto}
  .heroi-texto h1{max-width:18ch}
}
@media (max-width:640px){
  .ferramentas{grid-template-columns:minmax(0,1fr)}
}

/* telas grandes: o site cresce junto */
@media (min-width:1680px){html{font-size:106.25%}:root{--max:1600px}}
@media (min-width:2200px){html{font-size:118.75%}:root{--max:1840px}}

/* rótulos do prédio legíveis no celular */
@media (max-width:640px){.maquete .predio{width:84%;margin-inline:auto}.predio .tag{transform-box:fill-box;transform-origin:center;transform:scale(1.32)}}

/* ---------- diagrama da instalação de recarga (página de carregadores) ---------- */
.miolo-diagrama{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(24px, 3vw, 40px)}
.miolo-diagrama .miolo-texto{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);column-gap:clamp(24px, 4vw, 64px);row-gap:20px;align-items:end}
.miolo-diagrama .miolo-texto h1{max-width:16ch;grid-row:span 2}
.miolo-diagrama .miolo-texto .lede{max-width:44ch}
@media (max-width:900px){.miolo-diagrama .miolo-texto{grid-template-columns:minmax(0,1fr)}.miolo-diagrama .miolo-texto h1{grid-row:auto}}
.diagrama-painel{margin:0;padding:clamp(12px, 2vw, 24px);display:flex;flex-direction:column;gap:18px}
.diagrama-palco{border:var(--borda);border-radius:var(--r);overflow:hidden;background:#F3F8FC}
.diagrama{width:100%;height:auto}
.diagrama-v{display:none}
.diagrama .num text{font:700 18px var(--f-display);fill:var(--marinho)}
.diagrama .visor{font:700 13px var(--f-texto);fill:var(--led)}
.diagrama .placa{font:700 8.6px var(--f-texto);fill:var(--marinho);letter-spacing:0}
.diagrama .fluxo-rec{fill:none;stroke:var(--sol);stroke-width:5;stroke-linecap:round;stroke-dasharray:12 12;animation:flui-rec 1.1s linear infinite;transition:opacity .35s var(--ease)}
.diagrama .fluxo-rec.cabo{stroke-width:4}
@keyframes flui-rec{to{stroke-dashoffset:-48}}
.diagrama .led-rec{fill:var(--led);stroke:var(--marinho);stroke-width:2;animation:pisca 1.6s ease-in-out infinite;transition:fill .3s}
.diagrama .ponteiro{transform-origin:110px 240px;animation:gira 6s linear infinite}
.diagrama .carga{transform-box:fill-box;transform-origin:left center;animation:carrega 6s var(--ease) infinite;transition:fill .3s}
@keyframes carrega{0%{transform:scaleX(.15)}85%{transform:scaleX(1)}100%{transform:scaleX(1)}}
.diagrama .botoeira-g{cursor:pointer}
.diagrama .cogumelo{transition:transform .2s var(--ease);transform-box:fill-box;transform-origin:center}
.diagrama-painel.parado .fluxo-rec{opacity:0}
.diagrama-painel.parado .led-rec{fill:var(--alerta);animation:none}
.diagrama-painel.parado .ponteiro,.diagrama-painel.parado .carga{animation-play-state:paused}
.diagrama-painel.parado .carga{fill:#9EAAB8}
.diagrama-painel.parado .raio-bat{opacity:.25}
.diagrama-painel.parado .cogumelo{transform:scale(.86)}
.diagrama-controle{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px}
.botoeira-btn{background:#F5C518}
.botoeira-btn .cog{width:22px;height:22px;border-radius:50%;background:#E94B3C;border:2px solid var(--marinho);flex:none}
.botoeira-btn[aria-pressed="true"]{background:var(--branco)}
.botoeira-btn[aria-pressed="true"] .cog{background:var(--led)}
.diagrama-status{font-weight:700;display:flex;align-items:center;gap:10px}
.diagrama-status::before{content:"";width:12px;height:12px;border-radius:50%;background:var(--led);border:2px solid var(--marinho);flex:none}
.diagrama-painel.parado .diagrama-status::before{background:var(--alerta)}
.diagrama-legenda{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3, minmax(0,1fr));gap:16px 24px}
.diagrama-legenda li{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start}
.diagrama-legenda .n{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--sol);border:2px solid var(--marinho);font:700 1rem/1 var(--f-display)}
.diagrama-legenda b{font-family:var(--f-display);font-weight:600;display:block;margin-bottom:4px}
.diagrama-legenda p{font-size:1rem;line-height:1.5}
.diagrama-painel figcaption{font-size:.95rem;line-height:1.5;margin:0;padding-top:12px;border-top:2px solid var(--ceu-fundo)}
@media (max-width:900px){.diagrama-legenda{grid-template-columns:repeat(2, minmax(0,1fr))}}
@media (max-width:640px){
  .diagrama-legenda{grid-template-columns:minmax(0,1fr)}
  .diagrama-h{display:none}
  .diagrama-v{display:block}
}
@media (prefers-reduced-motion:reduce){
  .diagrama .fluxo-rec{animation:none;stroke-dasharray:none}
  .diagrama .led-rec,.diagrama .ponteiro,.diagrama .carga{animation:none}
}
.galeria-3{grid-template-columns:repeat(3, minmax(0,1fr))}
@media (max-width:900px){.galeria-3{grid-template-columns:repeat(2, minmax(0,1fr))}}
@media (max-width:640px){.galeria-3{grid-template-columns:minmax(0,1fr)}}
.galeria figcaption{flex:1}
.socios{margin:0;max-width:440px;justify-self:center;width:100%}
.socios .sobre-foto{aspect-ratio:4/5}
.nav a{padding:0 10px}
.nav ul{gap:0}
@media (max-width:1400px){.nav a{padding:0 16px}}
@media (min-width:1401px) and (max-width:1540px){.nav a{padding:0 7px}.topo .marca{padding:9px 14px}.topo .wrap{gap:14px}}

/* botão flutuante do WhatsApp (acima de 760px; no celular, a barra de contato fixa cumpre esse papel) */
.zap-flutuante{position:fixed;right:clamp(16px, 2.5vw, 32px);bottom:clamp(16px, 2.5vw, 32px);z-index:40;display:flex;align-items:center;gap:10px;height:64px;padding:0 22px 0 8px;border:var(--borda);border-radius:var(--r-pill);background:#25D366;color:var(--marinho);text-decoration:none;font:600 1rem/1 var(--f-display);box-shadow:var(--sombra-alta);transition:transform .35s var(--ease), box-shadow .35s var(--ease)}
.zap-flutuante .zap-ico{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:var(--branco);border:2px solid var(--marinho)}
.zap-flutuante .zap-ico .i{width:26px;height:26px}
.zap-flutuante:hover{transform:translateY(-3px);box-shadow:0 26px 44px -16px rgba(25,26,66,.6)}
.zap-flutuante::before{content:"";position:absolute;inset:-2px;border-radius:inherit;border:3px solid #25D366;animation:chama 2.6s var(--ease) 1.2s 3;pointer-events:none}
@keyframes chama{0%{opacity:.8;transform:scale(1)}100%{opacity:0;transform:scale(1.35)}}
@media (prefers-reduced-motion:reduce){.zap-flutuante::before{animation:none;display:none}}
@media (max-width:760px){.zap-flutuante{display:none}}
