/* ==========================================================================
   RERTS · sistema visual aprovado em 14/09/2026
   Página-piloto: Subestações e Proteção
   ========================================================================== */

/* Fontes hospedadas no próprio site (sem Google Fonts).
   Coloque os arquivos .woff2 do IBM Plex Sans em /fontes/.
   Enquanto os arquivos não estiverem na pasta, a pilha de reserva assume. */
@font-face{font-family:"IBM Plex Sans";src:url("/fontes/IBMPlexSans-Regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Sans";src:url("/fontes/IBMPlexSans-Medium.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Sans";src:url("/fontes/IBMPlexSans-SemiBold.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}

:root{
  --grafite:#1E2328;
  --grafite-claro:#4A5258;
  --base:#DFE3DE;
  --branco:#FFFFFF;
  --linha:#C9CFC8;
  --ambar:#F2A33C;
  --verde:#18864B;
  --verde-escuro:#126B3C;

  --fonte:"IBM Plex Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

  --conteudo:1200px;
  --gutter:24px;
  --e1:4px; --e2:8px; --e3:12px; --e4:16px; --e5:24px; --e6:32px; --e7:48px; --e8:64px; --e9:96px;
  --raio:8px;
  --altura-cabecalho:80px;
  --altura-barra-mobile:68px;
}

*,*::before,*::after{box-sizing:border-box}

html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *{animation:none !important;transition:none !important}
}

body{
  margin:0;
  background:var(--base);
  color:var(--grafite);
  font-family:var(--fonte);
  font-size:17px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}

img{max-width:100%;height:auto;display:block}
figure{margin:0}

h1,h2,h3{margin:0 0 var(--e4);font-weight:600;line-height:1.2}
h1{font-size:42px;line-height:1.15}
h2{font-size:28px}
h3{font-size:20px}
p{margin:0 0 var(--e4)}
p:last-child{margin-bottom:0}

.container{max-width:var(--conteudo);margin:0 auto;padding:0 var(--gutter)}
.texto{max-width:68ch}
.small{font-size:14px;color:var(--grafite-claro)}
.pular{position:absolute;left:-9999px}
.pular:focus{left:var(--gutter);top:var(--e2);z-index:60;background:var(--branco);padding:var(--e3) var(--e4);border-radius:var(--raio)}

/* --------------------------------------------------------------- foco --- */
:is(a,button,[tabindex]):focus-visible{
  outline:none;
  box-shadow:0 0 0 3px var(--ambar), 0 0 0 6px var(--grafite);
  border-radius:4px;
}

/* ------------------------------------------------------------- botões --- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:var(--e2);
  height:48px;padding:0 22px;border-radius:6px;
  font:500 16px/1 var(--fonte);text-decoration:none;border:1px solid transparent;cursor:pointer;
  transition:background-color .15s ease, color .15s ease, border-color .15s ease;
}
.btn--ligar{background:var(--grafite);color:#fff}
.btn--ligar:hover{background:#000}
.btn--wa{background:var(--verde);color:#fff}
.btn--wa:hover{background:var(--verde-escuro)}
.btn--sec{background:transparent;color:var(--grafite);border-color:var(--grafite)}
.btn--sec:hover{background:var(--grafite);color:#fff}
.link{color:var(--grafite);text-decoration:underline;text-underline-offset:3px}
.link:hover{text-decoration-thickness:2px}
.acoes{display:flex;gap:var(--e3);flex-wrap:wrap;align-items:center}
.acoes .btn{min-width:180px}

/* ---------------------------------------------------------- cabeçalho --- */
.cabecalho{
  position:sticky;top:0;z-index:50;background:var(--branco);
  border-bottom:3px solid var(--ambar);
}
.cabecalho__in{
  display:flex;align-items:center;gap:var(--e5);
  height:var(--altura-cabecalho);transition:height .2s ease;
}
.cabecalho.is-compacto .cabecalho__in{height:64px}
.logo{display:inline-flex;align-items:center;text-decoration:none;color:var(--grafite)}
.logo img{height:34px;width:auto;display:block;transition:height .2s ease}
.cabecalho.is-compacto .logo img{height:28px}
.rodape__logo{height:26px;width:auto}

.menu{display:flex;align-items:center;gap:var(--e5);margin-left:auto}
.menu__link,.menu__botao{
  background:none;border:0;padding:var(--e2) 0;font:400 16px/1.4 var(--fonte);color:var(--grafite);
  text-decoration:none;cursor:pointer;border-bottom:2px solid transparent;
}
.menu__link:hover,.menu__botao:hover{border-color:var(--ambar)}
.menu__botao[aria-expanded="true"]{border-color:var(--grafite);font-weight:500}
.menu__botao::after{content:"";display:inline-block;margin-left:6px;border:5px solid transparent;border-top-color:currentColor;transform:translateY(3px)}
.menu__botao[aria-expanded="true"]::after{transform:translateY(-2px) rotate(180deg)}
.telefone{font-weight:500;text-decoration:none;color:var(--grafite);white-space:nowrap}
.telefone:hover{text-decoration:underline;text-underline-offset:3px}

.painel{
  position:absolute;left:0;right:0;background:var(--branco);
  border-top:1px solid var(--linha);box-shadow:0 12px 24px rgba(30,35,40,.10);
}
.painel[hidden]{display:none}
.painel__in{display:grid;grid-template-columns:1fr 1fr;gap:var(--e6);padding-block:var(--e6)}
.painel__grupo .rotulo{font:600 13px/1.2 var(--fonte);letter-spacing:.08em;text-transform:uppercase;color:var(--grafite-claro);margin:0 0 var(--e3)}
.painel__lista{list-style:none;margin:0;padding:0;display:grid;gap:var(--e3)}
.painel__lista a{color:var(--grafite);text-decoration:none;border-bottom:1px solid transparent;padding-bottom:2px}
.painel__lista a:hover{border-color:var(--ambar)}
.painel__todos{
  grid-column:1 / -1;margin:var(--e5) 0 0;padding-top:var(--e5);
  border-top:1px solid var(--linha);
}

/* menu do celular */
.hamburguer{display:none;background:none;border:1px solid var(--linha);border-radius:6px;width:44px;height:44px;cursor:pointer}
.hamburguer span{display:block;width:20px;height:2px;background:var(--grafite);margin:4px auto}
.menu-mobile{display:none}

/* ---------------------------------------------------------- conteúdo --- */
main{display:block}
.secao{padding-block:var(--e9)}
.secao--branca{background:var(--branco);border-top:1px solid var(--linha);border-bottom:1px solid var(--linha)}
.secao + .secao{padding-top:var(--e9)}

.trilha{padding-block:var(--e5) var(--e4);font-size:14px;color:var(--grafite-claro)}
.trilha a{color:var(--grafite-claro)}
.trilha span[aria-current]{color:var(--grafite)}

.abertura{padding-block:var(--e6) var(--e9)}
/* em duas colunas o texto é curto e a foto é alta: o texto acompanha o centro
   da imagem. No empilhado volta a alinhar pelo topo — ver a faixa de 860px. */
.abertura__grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:var(--e7);align-items:center}
/* container com proporção controlada: a foto nunca define a altura do hero */
.abertura__foto{
  margin:0;width:100%;min-width:0;aspect-ratio:4/5;max-height:560px;min-height:320px;
  border-radius:var(--raio);overflow:hidden;
}
.abertura__foto img{width:100%;height:100%;object-fit:cover;object-position:center}
.abertura p{font-size:19px}

.lista-situacoes{list-style:none;margin:0;padding:0;display:grid;gap:var(--e4);max-width:68ch}
.lista-situacoes li{padding-left:var(--e5);position:relative}
.lista-situacoes li::before{content:"";position:absolute;left:0;top:12px;width:10px;height:2px;background:var(--ambar)}

.escopo{display:grid;gap:var(--e5);max-width:68ch}
.escopo__item{padding-bottom:var(--e5);border-bottom:1px solid var(--linha)}
.escopo__item:last-of-type{border-bottom:0;padding-bottom:0}
.escopo__item b{display:block;margin-bottom:var(--e1)}
.escopo__nota{margin-top:var(--e5);color:var(--grafite-claro)}

.galeria{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--e5);margin-top:var(--e6)}
.galeria figure{margin:0;display:flex;flex-direction:column}
.galeria img{border-radius:var(--raio);aspect-ratio:3/4;object-fit:cover;width:100%;height:auto}
.galeria figcaption{font-size:14px;color:var(--grafite-claro);margin-top:var(--e3)}

/* bloco de esclarecimento: segue direto o escopo, sem trocar de fundo */
.secao--colada{padding-top:0}
.esclarecimento{
  max-width:68ch;margin:0;padding-left:var(--e5);
  border-left:3px solid var(--ambar);color:var(--grafite);
}

/* galeria com uma única foto aprovada */
.galeria.galeria--uma{grid-template-columns:minmax(0,440px)}
/* quatro fotos aprovadas: duas por linha, sem virar catálogo */
.galeria.galeria--quatro{grid-template-columns:1fr 1fr}
/* duas fotos: mesmo tamanho das três colunas, sem esticar */
.galeria.galeria--duas{grid-template-columns:repeat(2,minmax(0,440px))}

/* cases relacionados: uma linha curta e um link por case */
.casesrel{
  background:var(--branco);border:1px solid var(--linha);border-radius:var(--raio);
  padding:var(--e6);max-width:68ch;display:grid;gap:var(--e5);
}
.casesrel__item + .casesrel__item{padding-top:var(--e5);border-top:1px solid var(--linha)}
.casesrel__item p{margin:0}
.casesrel__item .destaque__links{margin-top:var(--e3)}

/* página Cases: três cards com o mesmo peso, sem foto nesta etapa */
.cases{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--e5);margin-top:var(--e6);align-items:start}
.case{
  background:var(--branco);border:1px solid var(--linha);border-radius:var(--raio);
  padding:var(--e6);display:flex;flex-direction:column;gap:var(--e4);height:100%;
}
.case h3{margin:0}
.case p{margin:0}
.case__resultado b{display:block;margin-bottom:var(--e1)}
.case__servicos{font-size:15px;color:var(--grafite-claro)}
.case .destaque__links{margin-top:auto;padding-top:var(--e2)}

/* páginas de case */
.abertura--sem-foto h1{max-width:30ch}
.abertura--sem-foto p{max-width:68ch}
.caso{display:grid;gap:var(--e6);max-width:68ch}
.caso__bloco + .caso__bloco{padding-top:var(--e6);border-top:1px solid var(--linha)}
.caso__bloco h2{font-size:22px;margin-bottom:var(--e3)}
.caso__ressalva{margin-top:var(--e3);color:var(--grafite-claro);font-size:15px}

/* páginas de apoio */
.caminhos{list-style:none;margin:var(--e5) 0 0;padding:0;display:grid;gap:var(--e4);font-size:19px}
.marcacao-dev{
  margin-top:var(--e6);max-width:68ch;font-size:13px;color:var(--grafite-claro);
  border:1px dashed var(--linha);border-radius:var(--raio);padding:var(--e3) var(--e4);
}
.legal__bloco{max-width:68ch}
.legal__bloco + .legal__bloco{margin-top:var(--e7);padding-top:var(--e7);border-top:1px solid var(--linha)}
.legal__bloco h2{font-size:20px;margin-bottom:var(--e3)}

/* faixa de clientes */
.faixa-clientes{margin-top:var(--e6);background:var(--branco);border-radius:var(--raio);padding:var(--e6) var(--e5)}
.faixa-clientes__lista{
  list-style:none;margin:0;padding:0;
  display:flex;flex-wrap:wrap;justify-content:center;align-items:center;
  gap:var(--e5) var(--e7);
}
.faixa-clientes__lista img{width:120px;height:46px;object-fit:contain}
.cred__titulo{font-size:16px;margin:var(--e7) 0 0}
.cred__titulo + .faixa-clientes{margin-top:var(--e4)}

.credibilidade{text-align:center}
.credibilidade__faixa{
  margin-top:var(--e5);border:1px dashed var(--linha);border-radius:var(--raio);
  padding:var(--e6);color:var(--grafite-claro);font-size:14px;background:var(--branco);
}

.final{background:var(--branco);border-top:1px solid var(--linha)}
.final p{max-width:68ch}

/* ------------------------------------------------------------ rodapé --- */
.rodape{background:var(--grafite);color:#fff;padding-block:var(--e8) var(--e6);border-top:1px solid #333B42}
.rodape__cols{display:grid;grid-template-columns:1fr 1fr 1fr;gap:var(--e6)}
.rodape .rotulo{font:600 13px/1.2 var(--fonte);letter-spacing:.08em;text-transform:uppercase;color:#AEB6BC;margin:0 0 var(--e3)}
.rodape ul{list-style:none;margin:0;padding:0;display:grid;gap:var(--e2);font-size:15px}
.rodape a{color:#fff;text-decoration:none}
.rodape a:hover{text-decoration:underline;text-underline-offset:3px}
.rodape__fim{border-top:1px solid #333B42;margin-top:var(--e6);padding-top:var(--e4);font-size:13px;color:#AEB6BC;display:flex;gap:var(--e4);flex-wrap:wrap;justify-content:space-between}

/* ------------------------------------------------- barra fixa mobile --- */
.barra-mobile{
  display:none;position:fixed;left:0;right:0;bottom:0;z-index:55;
  background:var(--branco);box-shadow:0 -4px 12px rgba(30,35,40,.12);
  padding:var(--e2);padding-bottom:calc(var(--e2) + env(safe-area-inset-bottom));
  grid-template-columns:1fr 1fr;gap:var(--e2);
}
.barra-mobile .btn{width:100%;height:52px;font-size:17px}

/* ------------------------------------------------------- responsivo --- */
@media (max-width:1100px){
  .abertura__foto{aspect-ratio:3/4;max-height:480px}
}

@media (max-width:860px){
  .abertura__grid{grid-template-columns:1fr;gap:var(--e6);align-items:start}
  .abertura__foto{aspect-ratio:3/2;max-height:420px;min-height:240px}
  .galeria{grid-template-columns:1fr 1fr}
  .rodape__cols{grid-template-columns:1fr 1fr}
}

@media (max-width:760px){
  h1{font-size:30px}
  h2{font-size:24px}
  h3{font-size:19px}
  .secao{padding-block:var(--e8)}
  .abertura{padding-block:var(--e5) var(--e8)}
  .abertura__grid{gap:var(--e5)}
  .container{padding:0 20px}
  .menu{display:none}
  .hamburguer{display:block;margin-left:auto}
  .menu-mobile{display:none;background:var(--branco);border-top:1px solid var(--linha);padding:var(--e5) 20px var(--e6);max-width:none}
  .menu-mobile.is-aberto{display:block}
  .menu-mobile__links{list-style:none;margin:0 0 var(--e5);padding:0;display:grid;gap:var(--e3);font-size:18px}
  .menu-mobile a{color:var(--grafite);text-decoration:none}
  .menu-mobile__grade{display:grid;gap:var(--e5)}
  .menu-mobile__grade .rotulo{font:600 13px/1.2 var(--fonte);letter-spacing:.08em;text-transform:uppercase;color:var(--grafite-claro);margin:0 0 var(--e3)}
  .menu-mobile__grade ul{list-style:none;margin:0;padding:0;display:grid;gap:var(--e3)}
  .painel{display:none !important}
  .galeria{grid-template-columns:1fr}
  .rodape__cols{grid-template-columns:1fr}
  /* abertura: Ligar e WhatsApp lado a lado, duas colunas iguais */
  .abertura .acoes{display:grid;grid-template-columns:1fr 1fr;gap:var(--e3)}
  .abertura .acoes .btn{min-width:0;width:100%;height:52px}
  .barra-mobile{display:grid}
  body{padding-bottom:calc(var(--altura-barra-mobile) + var(--e5) + env(safe-area-inset-bottom))}
}

/* aparelho muito estreito: exceção, os dois botões empilham */
@media (max-width:340px){
  .abertura .acoes{grid-template-columns:1fr}
}

/* ==========================================================================
   Home · blocos próprios (mesmo sistema visual da página-piloto)
   ========================================================================== */

/* abertura da Home: texto + uma foto de cada área, com o mesmo peso */
.home-abertura{padding-block:var(--e7) var(--e9)}
.home-abertura__grid{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:var(--e7);align-items:center}
.home-abertura h1{font-size:40px;max-width:18ch}
.home-abertura p{font-size:19px;max-width:52ch}
.home-fotos{display:grid;grid-template-columns:1fr 1fr;gap:var(--e4)}
.home-fotos figure{margin:0;width:100%;min-width:0;aspect-ratio:4/5;max-height:440px;border-radius:var(--raio);overflow:hidden}
.home-fotos img{width:100%;height:100%;object-fit:cover}

/* duas áreas e os oito serviços */
.areas{display:grid;grid-template-columns:1fr 1fr;gap:var(--e7);margin-top:var(--e6)}
.area h3{font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--grafite-claro);margin-bottom:var(--e3)}
.area p{margin-bottom:var(--e4)}
.area ul{list-style:none;margin:0;padding:0;display:grid;gap:var(--e3)}
.area a{color:var(--grafite);text-decoration:none;border-bottom:1px solid var(--linha);padding-bottom:6px;display:inline-block}
.area a:hover{border-color:var(--ambar)}
.areas__link{margin-top:var(--e6)}
/* ação global: vale para as duas colunas, por isso fica abaixo das duas */
.areas__todos{
  grid-column:1 / -1;margin:var(--e5) 0 0;padding-top:var(--e5);
  border-top:1px solid var(--linha);
}

/* trabalho real da Home: uma foto por área, com o nome do serviço */
.provas{display:grid;grid-template-columns:1fr 1fr;gap:var(--e6);margin-top:var(--e6)}
.provas figure{margin:0}
.provas .moldura{width:100%;aspect-ratio:3/2;border-radius:var(--raio);overflow:hidden}
.provas img{width:100%;height:100%;object-fit:cover}
.provas figcaption{font-size:14px;color:var(--grafite-claro);margin-top:var(--e3)}
.provas figcaption a{display:block;margin-top:var(--e1);color:var(--grafite);font-size:16px}

/* credibilidade */
.cred__texto{max-width:68ch}
.cred__faixa{margin-top:var(--e6);border:1px dashed var(--linha);border-radius:var(--raio);padding:var(--e6);background:var(--branco);text-align:center;color:var(--grafite-claro);font-size:14px}
.cred__faixa strong{display:block;color:var(--grafite);font-size:16px;margin-bottom:var(--e2)}
.cred__nota{margin-top:var(--e3);font-size:13px}

/* case em destaque */
.destaque{background:var(--branco);border:1px solid var(--linha);border-radius:var(--raio);padding:var(--e6);margin-top:var(--e6);max-width:68ch}
.destaque h3{margin-bottom:var(--e2)}
.destaque p{margin-bottom:var(--e4)}
.destaque__links{display:flex;gap:var(--e5);flex-wrap:wrap;font-size:16px}

@media (max-width:1100px){
  .home-fotos figure{aspect-ratio:3/4;max-height:360px}
}
/* largura intermediária: quebra intencional dos três botões da abertura —
   Ligar e WhatsApp lado a lado e "Ver os serviços" abaixo, na largura dos dois */
@media (max-width:1120px) and (min-width:861px){
  .home-abertura .acoes{display:grid;grid-template-columns:1fr 1fr;gap:var(--e3)}
  .home-abertura .acoes .btn{min-width:0;width:100%}
  .home-abertura .acoes .btn--sec{grid-column:1 / -1}
}
@media (max-width:860px){
  .home-abertura{padding-block:var(--e5) var(--e8)}
  .home-abertura__grid{grid-template-columns:1fr;gap:var(--e6)}
  .home-abertura h1{font-size:30px;max-width:none}
  .home-fotos figure{aspect-ratio:3/4;max-height:none}
  .areas{grid-template-columns:1fr;gap:var(--e6)}
  .provas{grid-template-columns:1fr;gap:var(--e6)}
  .home-abertura .acoes{display:grid;grid-template-columns:1fr 1fr;gap:var(--e3)}
  .home-abertura .acoes .btn{min-width:0;width:100%;height:52px}
  .home-abertura .acoes .btn--sec{grid-column:1 / -1}
}
@media (max-width:340px){
  .home-abertura .acoes{grid-template-columns:1fr}
}

/* ==========================================================================
   Página Serviços · mesmo sistema visual
   ========================================================================== */

.pagina-topo{padding-block:var(--e7) var(--e5)}
.pagina-topo p{font-size:19px}

.secao--grade{padding-block:var(--e6) var(--e9)}
.grade{display:grid;grid-template-columns:1fr 1fr;gap:var(--e7)}
.grupo h2{font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--grafite-claro);margin-bottom:var(--e3)}
.grupo__area{margin-bottom:var(--e6)}
.grade__lista{list-style:none;margin:0;padding:0;display:grid;gap:var(--e5)}
.grade__lista li{padding-bottom:var(--e5);border-bottom:1px solid var(--linha)}
.grade__lista li:last-child{border-bottom:0;padding-bottom:0}
.grade__lista a{color:var(--grafite);text-decoration:none;font-weight:500;font-size:19px;border-bottom:1px solid transparent}
.grade__lista a:hover{border-color:var(--ambar)}
.grade__lista p{margin:var(--e2) 0 0;color:var(--grafite-claro)}

@media (max-width:860px){
  .grade{grid-template-columns:1fr;gap:var(--e8)}
}

/* ==========================================================================
   A Empresa e Contato · mesmo sistema visual
   ========================================================================== */

/* seção que segue direto a abertura da página, sem respiro dobrado */
.secao--seguida{padding-top:var(--e6)}

/* pilares */
.pilares{display:grid;grid-template-columns:1fr 1fr;gap:var(--e6) var(--e7);margin-top:var(--e6)}
.pilar{padding-top:var(--e5);border-top:1px solid var(--linha)}
.pilar h3{margin-bottom:var(--e2)}
.pilar p{color:var(--grafite-claro)}

/* canais diretos */
.canais{list-style:none;margin:var(--e6) 0 0;padding:0;display:grid;gap:0;max-width:760px}
.canais li{
  display:flex;align-items:center;justify-content:space-between;gap:var(--e5);flex-wrap:wrap;
  padding:var(--e5) 0;border-bottom:1px solid var(--linha);
}
.canais li:first-child{border-top:1px solid var(--linha)}
.canais__rotulo{display:block;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--grafite-claro);margin-bottom:var(--e1)}
.canais__valor{font-size:22px;font-weight:500;color:var(--grafite);text-decoration:none}
.canais__valor:hover{text-decoration:underline;text-underline-offset:3px}
.canais .btn{min-width:180px}
.canais--email .link{font-size:19px}

/* formulário */
.formulario{display:grid;grid-template-columns:1fr 1fr;gap:var(--e5);margin-top:var(--e6);max-width:760px}
.campo{display:flex;flex-direction:column}
.campo--largo{grid-column:1 / -1}
.campo label{font-weight:500;margin-bottom:var(--e2)}
.campo input,.campo textarea{
  font:400 17px/1.5 var(--fonte);color:var(--grafite);background:var(--branco);
  border:1px solid var(--linha);border-radius:6px;padding:12px 14px;width:100%;
}
.campo input{height:48px}
.campo textarea{resize:vertical;min-height:140px}
.campo input:focus-visible,.campo textarea:focus-visible{
  outline:none;box-shadow:0 0 0 3px var(--ambar),0 0 0 6px var(--grafite);border-color:var(--grafite);
}
.campo__apoio{margin:var(--e2) 0 0;font-size:14px;color:var(--grafite-claro)}
.armadilha{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.formulario__aviso{margin-top:var(--e4);font-size:14px;color:var(--grafite-claro);max-width:68ch}
.formulario__prov{
  margin-top:var(--e4);font-size:13px;color:var(--grafite-claro);max-width:68ch;
  border:1px dashed var(--linha);border-radius:var(--raio);padding:var(--e3) var(--e4);
}

/* localização */
.local{max-width:68ch}
.local__endereco{margin-top:var(--e5);padding-top:var(--e5);border-top:1px solid var(--linha)}
.local__endereco p{margin-bottom:var(--e3)}

@media (max-width:860px){
  .pilares{grid-template-columns:1fr;gap:var(--e5)}
  .formulario{grid-template-columns:1fr}
}
@media (max-width:760px){
  .canais li{align-items:flex-start;flex-direction:column;gap:var(--e3)}
  .canais .btn{width:100%;height:52px}
  .canais__valor{font-size:20px}
}
@media (max-width:760px){
  .pagina-topo{padding-block:var(--e5) var(--e4)}
  .pagina-topo p{font-size:18px}
  .secao--grade{padding-block:var(--e5) var(--e8)}
  .grade__lista a{font-size:18px}
}

/* uma única foto: mantém o tamanho controlado em qualquer largura */
@media (max-width:760px){
  .galeria.galeria--uma{grid-template-columns:1fr}
  .galeria.galeria--quatro{grid-template-columns:1fr}
  .galeria.galeria--duas{grid-template-columns:1fr}
}

@media (max-width:1024px){
  .cases{grid-template-columns:1fr}
  .case{max-width:68ch}
}

/* ==========================================================================
   REFINO VISUAL · PROPOSTA — escopo: cabeçalho, abertura da Home e a seção
   "O que a RERTS faz". Nada de HTML ou conteúdo muda; só tratamento visual.
   ========================================================================== */

:root{
  --superficie:#F2F5F1;                 /* off-white com o mesmo viés do --base */
  --linha-fina:rgba(30,35,40,.10);      /* divisória mais discreta que --linha */
  --ambar-veu:rgba(242,163,60,.16);
}

/* ------------------------------------------------------- cabeçalho --- */
.cabecalho{
  background:rgba(242,245,241,.86);
  border-bottom:2px solid var(--ambar);
  box-shadow:0 1px 0 rgba(30,35,40,.04);
}
@supports ((backdrop-filter:blur(2px)) or (-webkit-backdrop-filter:blur(2px))){
  .cabecalho{
    background:rgba(242,245,241,.72);
    -webkit-backdrop-filter:blur(16px) saturate(150%);
    backdrop-filter:blur(16px) saturate(150%);
  }
}
.cabecalho.is-compacto{box-shadow:0 6px 20px rgba(30,35,40,.08)}

.cabecalho__in{height:86px;gap:var(--e6)}
.cabecalho.is-compacto .cabecalho__in{height:66px}
.logo img{height:40px}
.cabecalho.is-compacto .logo img{height:32px}

/* mais respiro horizontal, sem mexer na largura do conteúdo */
@media (min-width:1261px){
  .cabecalho__in,
  .painel__in{padding-inline:40px}
}

/* menu: peso menor, espaçamento maior, âmbar como marcador de interação */
.menu{gap:var(--e6)}
.menu__link,.menu__botao{
  font:500 15px/1.4 var(--fonte);
  letter-spacing:.012em;
  color:var(--grafite-claro);
  padding-bottom:6px;
  border-bottom-width:2px;
  transition:color .15s ease, border-color .15s ease;
}
.menu__link:hover,.menu__botao:hover{color:var(--grafite);border-color:var(--ambar)}
.menu__botao[aria-expanded="true"]{color:var(--grafite);border-color:var(--ambar);font-weight:600}
.menu__botao::after{border-width:4px;margin-left:8px}

/* telefone ganha presença; WhatsApp deixa de pesar como bloco verde */
.telefone{
  font-weight:600;font-size:16px;
  font-variant-numeric:tabular-nums;letter-spacing:.01em;
  border-bottom:2px solid transparent;padding-bottom:6px;
}
.telefone:hover{text-decoration:none;border-color:var(--ambar)}

.cabecalho .btn--wa{
  height:40px;padding:0 18px;font-size:15px;
  background:transparent;color:var(--verde);
  border:1.5px solid var(--verde);
}
.cabecalho .btn--wa:hover{background:var(--verde);color:#fff;border-color:var(--verde)}

/* painel de Serviços: mesma superfície do cabeçalho */
/* o painel é uma superfície de leitura: fica opaco, sem desfoque */
.painel{
  background:var(--superficie);
  border-top:1px solid var(--linha-fina);
  box-shadow:0 18px 36px rgba(30,35,40,.14);
}
.painel__in{padding-block:var(--e7)}
.painel__grupo .rotulo{letter-spacing:.14em;color:var(--grafite)}
.painel__lista a{border-bottom-width:2px;padding-bottom:4px;transition:border-color .15s ease}
.painel__todos{border-top-color:var(--linha-fina)}

/* --------------------------------------------- cabeçalho no celular --- */
@media (max-width:760px){
  .cabecalho__in{height:72px;gap:var(--e4)}
  .cabecalho.is-compacto .cabecalho__in{height:62px}
  .logo img{height:34px}
  .cabecalho.is-compacto .logo img{height:30px}
  .hamburguer{border-color:var(--linha-fina);background:rgba(255,255,255,.6);transition:border-color .15s ease}
  .hamburguer[aria-expanded="true"]{border-color:var(--ambar)}
  .menu-mobile{
    background:rgba(242,245,241,.97);
    border-top:1px solid var(--linha-fina);
  }
  .menu-mobile__links{font-size:17px;font-weight:500;gap:var(--e4)}
  .menu-mobile__links a{border-bottom:2px solid transparent;padding-bottom:4px}
  .menu-mobile__grade .rotulo{letter-spacing:.14em;color:var(--grafite)}
}

/* ---------------------------------------------- abertura da Home --- */
.home-abertura h1{
  font-size:46px;line-height:1.08;letter-spacing:-.016em;
  text-wrap:balance;max-width:17ch;
}
.home-abertura h1::before{                 /* marca da identidade, não é conteúdo */
  content:"";display:block;width:52px;height:3px;background:var(--ambar);
  margin-bottom:var(--e5);
}
.home-abertura p{font-size:20px;color:var(--grafite-claro);max-width:48ch}
.home-abertura p strong{color:var(--grafite);font-weight:600}
.home-abertura .acoes{margin-top:var(--e6)}

.home-fotos figure{box-shadow:0 1px 0 rgba(30,35,40,.06), 0 18px 36px rgba(30,35,40,.10)}

/* ------------------------------- seção "O que a RERTS faz" (branca) --- */
.secao--branca{border-color:var(--linha-fina)}
.secao--branca h2{
  font-size:32px;letter-spacing:-.012em;text-wrap:balance;
}
.areas{gap:var(--e8)}
.area h3{
  font-size:12px;letter-spacing:.14em;color:var(--grafite);
  display:flex;align-items:center;gap:var(--e3);margin-bottom:var(--e4);
}
.area h3::before{content:"";width:18px;height:2px;background:var(--ambar);flex:none}
.area p{color:var(--grafite-claro)}
.area a{
  border-bottom-color:var(--linha-fina);border-bottom-width:2px;padding-bottom:8px;
  width:100%;transition:border-color .15s ease, color .15s ease;
}
.area a:hover{border-color:var(--ambar);color:#000}
.areas__todos{border-top-color:var(--linha-fina)}

/* abertura no celular: a presença tipográfica sobe, mas sem estourar a tela */
@media (max-width:760px){
  .home-abertura h1{font-size:33px;line-height:1.12;letter-spacing:-.012em;max-width:none}
  .home-abertura h1::before{width:44px;margin-bottom:var(--e4)}
  .home-abertura p{font-size:18px;max-width:none}
  .secao--branca h2{font-size:26px}
}
