/* =========================
   Grão 1000 — Premium UI
   ========================= */

:root{
  --bg0:#061114;
  --bg1:#071a12;
  --ink:#0f172a;
  --text:#0b1220;
  --muted:rgba(15,23,42,.72);
  --card:rgba(255,255,255,.74);
  --card2:rgba(255,255,255,.62);
  --stroke:rgba(255,255,255,.22);
  --shadow:0 18px 45px rgba(0,0,0,.18);
  --shadow2:0 10px 26px rgba(0,0,0,.14);
  --brand:#16a34a; /* green */
  --brand2:#f59e0b; /* gold */
  --brand3:#22c55e; /* bright green */
  --ring:rgba(34,197,94,.35);
  --radius:22px;
  --radius2:16px;
  --container:1200px;
  --font: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Noto Sans", "Helvetica Neue", sans-serif;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:var(--font);
  color:rgba(255,255,255,.92);
  background:
    radial-gradient(1200px 700px at 15% 10%, rgba(245,158,11,.22), transparent 60%),
    radial-gradient(900px 650px at 85% 20%, rgba(34,197,94,.18), transparent 58%),
    radial-gradient(900px 700px at 50% 90%, rgba(16,185,129,.16), transparent 60%),
    linear-gradient(180deg, #031013 0%, #06161a 45%, #031013 100%);
  overflow-x:hidden;
}

img{max-width:100%;height:auto;display:block}
a{color:inherit}
a:hover{opacity:.95}
p{line-height:1.6;margin:0 0 14px}
h1,h2,h3{margin:0 0 12px;letter-spacing:-.02em}
h1{font-size:clamp(32px, 4.2vw, 52px);line-height:1.05}
h2{font-size:clamp(24px, 3.2vw, 36px);line-height:1.15}
h3{font-size:20px;line-height:1.25}

.container{
  width:min(var(--container), calc(100% - 48px));
  margin:0 auto;
}

/* =========================
   Topbar
   ========================= */
.topbar{
  position:sticky; top:0; z-index:50;
  backdrop-filter: blur(14px);
  background: linear-gradient(90deg, rgba(3,16,19,.80), rgba(3,16,19,.45));
  border-bottom:1px solid rgba(255,255,255,.10);
}
.topbar__inner{
  display:flex; align-items:center; gap:16px;
  padding:14px 0;
}
.brand{
  display:flex; align-items:center; gap:12px;
  text-decoration:none;
  min-width:220px;
}
.brand__logo{
  /* SVG-friendly sizing: keeps aspect ratio (no squash) */
  height:56px;
  width:auto;
  max-width:220px;
  display:block;
  object-fit:contain;
  border-radius:14px;
  box-shadow:0 10px 22px rgba(0,0,0,.18);
}
.brand__text strong{display:block; font-size:18px; letter-spacing:-.01em}
.brand__text span{display:block; font-size:12.5px; color:rgba(255,255,255,.74); margin-top:2px}

.nav{
  display:flex; align-items:center; gap:8px;
  margin-left:auto;
}
.nav__link{
  text-decoration:none;
  padding:10px 12px;
  border-radius:14px;
  color:rgba(255,255,255,.85);
  font-weight:650;
  font-size:14px;
  transition:.18s;
  border:1px solid transparent;
}
.nav__link:hover{
  background:rgba(255,255,255,.07);
  border-color:rgba(255,255,255,.12);
}
.nav__link.is-active{
  background: linear-gradient(180deg, rgba(34,197,94,.20), rgba(245,158,11,.10));
  border-color:rgba(34,197,94,.22);
  box-shadow:0 0 0 5px var(--ring);
}

.topbar__actions{display:flex; align-items:center; gap:10px}
.iconbtn{
  width:38px; height:38px;
  border-radius:12px;
  display:inline-flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 8px 18px rgba(0,0,0,.12);
  transition:.18s;
  text-decoration:none;
}
.iconbtn:hover{transform:translateY(-1px); background:rgba(255,255,255,.10)}
.iconbtn--wpp{background:rgba(34,197,94,.16); border-color:rgba(34,197,94,.22)}
.iconbtn--fb{background:rgba(59,130,246,.16); border-color:rgba(59,130,246,.22)}
.iconbtn--ig{background:rgba(236,72,153,.16); border-color:rgba(236,72,153,.22)}

.iconbtn::before{
  content:"";
  width:18px;height:18px;
  background-size:18px 18px;
  background-repeat:no-repeat;
  filter: drop-shadow(0 2px 6px rgba(0,0,0,.25));
}
.iconbtn--wpp::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M12.04 2C6.58 2 2.13 6.33 2.13 11.7c0 1.85.52 3.56 1.43 5.03L2 22l5.45-1.52c1.4.76 3.01 1.2 4.69 1.2 5.46 0 9.91-4.33 9.91-9.7S17.5 2 12.04 2Zm5.78 13.36c-.24.67-1.19 1.23-1.95 1.38-.52.1-1.2.18-3.91-.8-3.46-1.24-5.69-4.29-5.86-4.5-.17-.22-1.4-1.83-1.4-3.5 0-1.67.9-2.48 1.22-2.83.32-.35.7-.44.93-.44h.67c.21 0 .5-.07.78.6.28.67.95 2.33 1.03 2.5.09.17.15.37.03.6-.12.22-.18.37-.36.57-.18.2-.38.45-.54.6-.18.17-.37.35-.16.69.21.35.93 1.52 2 2.46 1.37 1.2 2.53 1.57 2.89 1.74.36.17.57.15.78-.09.21-.24.9-1.03 1.15-1.38.24-.35.48-.29.82-.17.33.12 2.1.98 2.46 1.16.36.18.6.27.69.42.09.15.09.87-.15 1.54Z'/%3E%3C/svg%3E");}
.iconbtn--fb::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M13.5 22v-8h2.7l.4-3H13.5V9.2c0-.87.24-1.46 1.5-1.46H16.7V5.05c-.3-.04-1.33-.13-2.52-.13-2.5 0-4.2 1.52-4.2 4.32V11H7.5v3h2.48v8h3.52Z'/%3E%3C/svg%3E");}
.iconbtn--ig::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M7 2h10a5 5 0 0 1 5 5v10a5 5 0 0 1-5 5H7a5 5 0 0 1-5-5V7a5 5 0 0 1 5-5Zm10 2H7a3 3 0 0 0-3 3v10a3 3 0 0 0 3 3h10a3 3 0 0 0 3-3V7a3 3 0 0 0-3-3Zm-5 4.5A5.5 5.5 0 1 1 6.5 14 5.51 5.51 0 0 1 12 8.5Zm0 2A3.5 3.5 0 1 0 15.5 14 3.5 3.5 0 0 0 12 10.5ZM18 6.75a1.25 1.25 0 1 1-1.25 1.25A1.25 1.25 0 0 1 18 6.75Z'/%3E%3C/svg%3E");}

.pillbtn{
  padding:10px 14px;
  border-radius:999px;
  font-weight:800;
  font-size:13px;
  letter-spacing:.01em;
  text-decoration:none;
  background:linear-gradient(180deg, rgba(34,197,94,.92), rgba(22,163,74,.88));
  color:#04120d;
  border:1px solid rgba(34,197,94,.35);
  box-shadow:0 12px 26px rgba(34,197,94,.16);
  transition:.18s;
}
.pillbtn:hover{transform:translateY(-1px)}
.pillbtn--ghost{
  background:rgba(255,255,255,.06);
  color:rgba(255,255,255,.88);
  border-color:rgba(255,255,255,.14);
  box-shadow:none;
}

.burger{
  display:none;
  margin-left:6px;
  width:44px;height:40px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
  cursor:pointer;
}
.burger span{
  display:block; height:2px; width:18px;
  margin:5px auto; background:rgba(255,255,255,.88);
  border-radius:99px;
}

/* Mobile menu */
.mobileNav{
  display:none;
  border-top:1px solid rgba(255,255,255,.10);
  background:rgba(3,16,19,.82);
  backdrop-filter: blur(14px);
  padding:14px 0;
}
.mobileNav a{
  display:block;
  text-decoration:none;
  padding:12px 24px;
  color:rgba(255,255,255,.86);
  font-weight:750;
}
.mobileNav a:hover{background:rgba(255,255,255,.06)}
.mobileNav__row{
  display:flex; gap:10px;
  padding:10px 24px 0;
}

/* =========================
   Page hero + sections
   ========================= */
.pageHero{
  padding:56px 0 22px;
}
.pageHero .eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:7px 10px;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.12);
  color:rgba(255,255,255,.80);
  font-weight:800;
  font-size:12px;
  letter-spacing:.02em;
}
.breadcrumb{
  margin-top:14px;
  color:rgba(255,255,255,.70);
  font-size:13px;
}
.breadcrumb a{color:rgba(255,255,255,.85); text-decoration:none}
.breadcrumb a:hover{text-decoration:underline}
.hero__cta, .ctaRow{
  display:flex; gap:12px; flex-wrap:wrap;
  margin-top:16px;
}

.btn{
  display:inline-flex; align-items:center; justify-content:center;
  gap:10px;
  padding:12px 16px;
  border-radius:14px;
  font-weight:850;
  font-size:14px;
  text-decoration:none;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.08);
  color:rgba(255,255,255,.92);
  transition:.18s;
}
.btn:hover{transform:translateY(-1px); background:rgba(255,255,255,.10)}
.btn--ghost{
  background:transparent;
  border-color:rgba(255,255,255,.16);
}

.section{
  padding:26px 0 52px;
}
.sectionHead{
  display:flex; align-items:flex-end; justify-content:space-between;
  gap:18px; flex-wrap:wrap;
  margin-bottom:18px;
}
.sectionHead .muted{max-width:700px}
.section--field{
  padding:56px 0;
  background:
    linear-gradient(180deg, rgba(34,197,94,.08), transparent 60%),
    radial-gradient(900px 600px at 50% 15%, rgba(245,158,11,.16), transparent 60%),
    url("../img/bg-field.webp") center/cover no-repeat;
  border-top:1px solid rgba(255,255,255,.10);
  border-bottom:1px solid rgba(255,255,255,.10);
}
.section--grain{
  padding:56px 0;
  background:
    linear-gradient(180deg, rgba(245,158,11,.10), transparent 58%),
    url("../img/bg-grains.webp") center/cover no-repeat;
  border-top:1px solid rgba(255,255,255,.10);
  border-bottom:1px solid rgba(255,255,255,.10);
}

.muted{color:rgba(255,255,255,.72)}
.badge{
  padding:6px 10px;
  border-radius:999px;
  font-weight:850;
  font-size:12px;
  background:rgba(34,197,94,.14);
  border:1px solid rgba(34,197,94,.22);
}

/* =========================
   Cards / grids
   ========================= */
.cards3, .grid3{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:18px;
}
.cardLink{
  display:block;
  text-decoration:none;
  padding:18px 18px 16px;
  border-radius:var(--radius);
  background:linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.06));
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 14px 34px rgba(0,0,0,.14);
  transition:.2s;
}
.cardLink:hover{
  transform:translateY(-4px);
  border-color:rgba(34,197,94,.22);
  box-shadow:0 22px 48px rgba(0,0,0,.18);
}
.cardLink__title{font-weight:950; font-size:16px}
.cardLink__text{color:rgba(255,255,255,.74); margin-top:8px}
.cardLink__meta{color:rgba(255,255,255,.60); margin-top:12px; font-size:12.5px}

.infoCard{
  border-radius:var(--radius);
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.12);
  box-shadow:var(--shadow2);
  padding:18px;
}
.infoCard__title{font-weight:950; font-size:16px}
.infoCard__big{font-weight:1000; font-size:26px; margin-top:8px}
.infoCard__actions{display:flex; gap:10px; flex-wrap:wrap; margin-top:14px}

.serviceCard{
  border-radius:var(--radius);
  padding:20px;
  background:linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.06));
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 14px 36px rgba(0,0,0,.14);
}
.serviceCard__icon{
  width:46px; height:46px;
  border-radius:16px;
  display:flex; align-items:center; justify-content:center;
  background:rgba(245,158,11,.14);
  border:1px solid rgba(245,158,11,.20);
  margin-bottom:12px;
  font-size:20px;
}

.metricCard{
  border-radius:var(--radius);
  padding:18px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 14px 32px rgba(0,0,0,.14);
}
.metricIcon{
  width:44px;height:44px;border-radius:16px;
  display:flex;align-items:center;justify-content:center;
  background:rgba(34,197,94,.14);border:1px solid rgba(34,197,94,.22);
}
.metricLabel{margin-top:12px;color:rgba(255,255,255,.70);font-weight:850;font-size:12px;letter-spacing:.02em}
.metricValue{margin-top:8px;font-weight:1000;font-size:28px;letter-spacing:-.02em}
.metricHelp{margin-top:6px;color:rgba(255,255,255,.62);font-size:12.5px;line-height:1.35}

.chip{
  display:inline-flex;align-items:center;gap:8px;
  padding:9px 12px;border-radius:999px;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.12);
  color:rgba(255,255,255,.80);
  font-weight:850;font-size:12px;
}

/* CTA strip */
.ctaStrip{
  display:flex; align-items:center; justify-content:space-between;
  gap:18px; flex-wrap:wrap;
  border-radius:28px;
  padding:18px 18px;
  background:linear-gradient(90deg, rgba(34,197,94,.18), rgba(245,158,11,.12));
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 18px 42px rgba(0,0,0,.16);
}
.ctaStrip strong{font-weight:1000}

/* =========================
   Qualidade — 5 cards line + line icons
   ========================= */
.qualidade-grid{
  display:grid;
  grid-template-columns:repeat(5, 1fr);
  gap:18px;
  margin-top:24px;
}
.q-card{
  border-radius:var(--radius);
  padding:18px 18px 16px;
  background:linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.06));
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 14px 34px rgba(0,0,0,.14);
  transition:.2s;
}
.q-card:hover{transform:translateY(-4px);border-color:rgba(34,197,94,.22)}
.q-icon{
  width:46px;height:46px;border-radius:16px;
  display:flex;align-items:center;justify-content:center;
  background:rgba(34,197,94,.12);
  border:1px solid rgba(34,197,94,.18);
  margin-bottom:10px;
  color:rgba(255,255,255,.92);
}
.q-icon svg{width:24px;height:24px;display:block}

@media(max-width:1180px){ .qualidade-grid{grid-template-columns:repeat(3, 1fr)} }
@media(max-width:860px){ .qualidade-grid{grid-template-columns:repeat(2, 1fr)} }

/* =========================
   Contato — Map (colorful + outline state)
   ========================= */
.mapWrap{
  display:grid;
  grid-template-columns: 1.4fr .9fr;
  gap:18px;
  align-items:stretch;
}
.mapLeft, .mapRight{
  border-radius:var(--radius);
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 14px 34px rgba(0,0,0,.14);
  overflow:hidden;
}
.mapHead{
  display:flex; align-items:center; justify-content:space-between;
  gap:14px;
  padding:16px 16px 12px;
  border-bottom:1px solid rgba(255,255,255,.10);
  background:linear-gradient(90deg, rgba(34,197,94,.10), rgba(245,158,11,.06));
}
.mapTitle{font-weight:1000}
.mapCanvas{
  padding:16px;
  background:
    radial-gradient(900px 520px at 45% 20%, rgba(245,158,11,.20), transparent 62%),
    radial-gradient(760px 520px at 70% 60%, rgba(34,197,94,.18), transparent 62%),
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
}
.mapCanvas svg{
  width:100%;
  height:auto;
  display:block;
}
.mapCanvas .uf{
  fill: url(#grainPattern);
  stroke: rgba(255,255,255,.22);
  stroke-width:1.2;
  transition: .18s;
  outline:none !important;
}
.mapCanvas .uf:hover{
  stroke: rgba(34,197,94,.85);
  stroke-width:2.2;
  filter: drop-shadow(0 10px 18px rgba(34,197,94,.18));
}
.mapCanvas .uf.active{
  stroke: rgba(245,158,11,.95);
  stroke-width:3.0;
  filter: drop-shadow(0 12px 22px rgba(245,158,11,.22));
}
.mapRight{padding:16px}
.panelTag{
  display:inline-flex; align-items:center;
  padding:7px 10px;
  border-radius:999px;
  font-weight:900;
  font-size:12px;
  background:rgba(245,158,11,.14);
  border:1px solid rgba(245,158,11,.18);
  margin-bottom:10px;
}
.contactsList .card{
  border-radius:18px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
  padding:12px 12px;
}
.contactsList .card strong{color:rgba(255,255,255,.92)}
.contactsList .card div{color:rgba(255,255,255,.70)}

.listRow{
  padding:14px 14px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.05);
  margin-top:10px;
}
.listRow .uf{
  display:inline-flex;
  width:34px; height:34px;
  align-items:center; justify-content:center;
  border-radius:12px;
  background:rgba(34,197,94,.14);
  border:1px solid rgba(34,197,94,.18);
  font-weight:1000;
}

/* =========================
   Footer
   ========================= */
.footer{
  padding:40px 0;
  border-top:1px solid rgba(255,255,255,.10);
  background:linear-gradient(180deg, rgba(3,16,19,.0), rgba(3,16,19,.65));
}
.footer__inner{
  display:flex; align-items:flex-start; justify-content:space-between;
  gap:22px; flex-wrap:wrap;
}
.footer__left{max-width:520px}
.footer__logo{
  width:220px;
  height:auto;
  display:block;
  object-fit:contain;
  filter: drop-shadow(0 12px 26px rgba(0,0,0,.25));
}
.footer__links{
  display:flex; gap:14px; flex-wrap:wrap;
  margin-top:16px;
}
.footer__links a{
  text-decoration:none;
  color:rgba(255,255,255,.78);
  padding:8px 10px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.05);
}
.footer__links a:hover{background:rgba(255,255,255,.08)}
.footer__right{color:rgba(255,255,255,.70); font-size:13px}

/* =========================
   Responsive
   ========================= */
@media (max-width: 980px){
  .nav{display:none}
  .burger{display:block}
  .topbar__actions{margin-left:auto}
  .cards3,.grid3{grid-template-columns:repeat(2,1fr)}
  .mapWrap{grid-template-columns:1fr}
}
@media (max-width: 640px){
  .container{width:min(var(--container), calc(100% - 32px))}
  .brand__logo{height:64px; width:auto; max-width:220px}
  .cards3,.grid3{grid-template-columns:1fr}
  .ctaStrip{border-radius:22px}
}

/* =========================================================
   Ajustes finos (legibilidade / cards / facebook / graint)
   ========================================================= */

/* Cards menos transparentes (global leve) */
:root{
  --card-solid: rgba(15, 23, 42, 0.82);
  --card-solid-2: rgba(15, 23, 42, 0.74);
  --text-strong: rgba(248, 250, 252, 0.96);
  --text-soft: rgba(226, 232, 240, 0.92);
}

/* Home: métricas em linha */
.metricsGrid{
  display: grid !important;
  grid-template-columns: repeat(5, minmax(180px, 1fr));
  gap: 16px;
}
@media (max-width: 1180px){
  .metricsGrid{ grid-template-columns: repeat(3, minmax(180px, 1fr)); }
}
@media (max-width: 820px){
  .metricsGrid{ grid-template-columns: repeat(2, minmax(160px, 1fr)); }
}
@media (max-width: 520px){
  .metricsGrid{ grid-template-columns: 1fr; }
}

/* Cards (métricas / info / geral) mais legíveis */
.metricCard,
.infoCard,
.card{
  background: var(--card-solid) !important;
  border: 1px solid rgba(255,255,255,0.12) !important;
  box-shadow: 0 20px 45px rgba(0,0,0,0.30) !important;
}

.metricLabel,
.metricHelp,
.infoCard .muted,
.muted{
  color: var(--text-soft) !important;
}

.metricValue,
.infoCard__big,
.h1, .h2, h1, h2, h3{
  color: var(--text-strong) !important;
}

/* Qualidade: limitar ícones (evita “explodir”) */
.q-icon{
  width: 46px !important;
  height: 46px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 46px !important;
  overflow: hidden !important;
}
.q-icon svg{
  width: 100% !important;
  height: 100% !important;
  max-width: 46px !important;
  max-height: 46px !important;
  display: block !important;
}

/* Contato: painel direito + cards de contato (mais contraste) */
.mapRight{
  background: rgba(15,23,42,0.86) !important;
  border: 1px solid rgba(255,255,255,0.12) !important;
  box-shadow: 0 25px 50px rgba(0,0,0,0.35) !important;
}
.contactCard{
  background: rgba(255,255,255,0.07) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  margin-bottom: 10px;
}
.contactCard__name{
  font-weight: 900;
  color: var(--text-strong) !important;
}
.contactCard__fone,
.contactCard__hint{
  margin-top: 6px;
  color: var(--text-soft) !important;
}

/* Facebook: remover texto “API/preview” */
#facebook .lead{
  display:none !important;
}

/* Facebook: feed em grid + imagens menores */
#fbFeed.fbGrid{
  display: grid !important;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 18px;
  align-items: stretch;
}
@media (min-width: 680px){
  .fbGrid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1024px){
  .fbGrid{ grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 1000px){
  #fbFeed.fbGrid{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px){
  #fbFeed.fbGrid{ grid-template-columns: 1fr; }
}
#fbFeed .fbCard img{
  width: 100%;
  height: 220px !important;
  object-fit: cover;
  border-radius: 14px;
}
#fbFeed .fbTitle{
  font-weight: 900;
  margin-bottom: 6px;
  color: var(--text-strong);
}
#fbFeed .fbText{
  font-size: 13px;
  color: var(--text-soft);
}

/* Sobre: cards mais sólidos em cima de mídia */
body[data-page="sobre"] .infoCard,
.sobre .infoCard{
  background: rgba(15, 23, 42, 0.84) !important;
}


/* =====================================================
   SERVIÇOS — cards lado a lado (ADICIONADO)
   ===================================================== */

.services-grid,
.servicos-grid,
.service-list,
.servicos-list,
.cards-servicos,
.cards-servicos-wrap,
.service-cards,
.servico-cards,
.section-servicos .cards,
.section-servicos .grid,
#servicos .cards,
#servicos .grid{
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  align-items: stretch;
}

.service-card,
.servico-card,
.card-servico,
.cards-servicos .card,
.section-servicos .card{
  height: 100%;
}

@media (max-width:1100px){
  .services-grid,
  .servicos-grid,
  .service-list,
  .servicos-list,
  .cards-servicos,
  .cards-servicos-wrap,
  .service-cards,
  .servico-cards,
  .section-servicos .cards,
  .section-servicos .grid,
  #servicos .cards,
  #servicos .grid{
    grid-template-columns: repeat(2,1fr);
  }
}

@media (max-width:640px){
  .services-grid,
  .servicos-grid,
  .service-list,
  .servicos-list,
  .cards-servicos,
  .cards-servicos-wrap,
  .service-cards,
  .servico-cards,
  .section-servicos .cards,
  .section-servicos .grid,
  #servicos .cards,
  #servicos .grid{
    grid-template-columns: 1fr;
  }
}


/* ===== PATCH PREMIUM FINAL ===== */

.servicos-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:24px;
}

@media(max-width:1000px){
.servicos-grid{grid-template-columns:1fr;}
}

/* cards padrão */
.card-glass{
background:rgba(15,23,42,0.75);
backdrop-filter:blur(10px);
border:1px solid rgba(255,255,255,0.08);
}

/* mapa destaque */
.mapa-bg{
background:rgba(0,0,0,0.35);
}



/* --- Cards / links: prevent default underline on card links --- */
.cardLink, .cardLink:hover, .cardLink:focus { text-decoration: none; color: inherit; }
.cardLink * { text-decoration: none; }



/* --- Quality cards (Padrao / Evidencia / Confianca) --- */
.card--dark{
  background: linear-gradient(180deg, rgba(15,23,42,.78), rgba(15,23,42,.58));
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 22px;
  padding: 22px;
  min-height: 260px;
  box-shadow: 0 18px 44px rgba(0,0,0,.28);
}
.card--dark h3{ margin: 10px 0 8px; }
.card__icon{
  width: 44px; height: 44px;
  display:flex; align-items:center; justify-content:center;
  border-radius: 14px;
  background: rgba(22,101,52,.22);
  border: 1px solid rgba(22,101,52,.35);
  font-size: 18px;
}
.bullets{ margin: 14px 0 0; padding-left: 18px; }
.bullets li{ margin: 6px 0; }
.sectionHead{ margin-bottom: 16px; }
.sectionHead p{ margin-top: 6px; color: rgba(229,231,235,.84); }



/* --- Header logo: render "livre" (sem moldura) --- */
.brand__logoWrap{
  padding: 0;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
}
.brand__logo{
  border-radius: 0;
  background: transparent;
}


/* =========================
   Visual identity upgrades (less "cardy")
   ========================= */
.sectionDivider{
  width:100%;
  display:block;
  margin:-1px 0;
}
.band{
  position:relative;
  padding:70px 0;
}
.band--alt{
  background: linear-gradient(180deg, rgba(8,16,18,.0) 0%, rgba(8,16,18,.65) 30%, rgba(8,16,18,.0) 100%);
}
.split{
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  gap:28px;
  align-items:center;
}
@media (max-width: 900px){
  .split{grid-template-columns:1fr; gap:18px;}
}
.kpiRow{
  display:flex;
  gap:18px;
  flex-wrap:wrap;
  align-items:stretch;
  margin-top:14px;
}
.kpi{
  flex:1 1 160px;
  padding:16px 16px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.10);
  background: linear-gradient(180deg, rgba(20,32,40,.58), rgba(10,18,24,.62));
  box-shadow: 0 18px 40px rgba(0,0,0,.25);
}
.kpi b{font-size:22px; letter-spacing:.2px;}
.kpi .muted{margin-top:6px; font-size:12px;}
.ribbon{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:10px 14px;
  border-radius:999px;
  background: rgba(22, 101, 52, .16);
  border:1px solid rgba(22,101,52,.30);
}
.flow{
  margin-top:18px;
  display:grid;
  grid-template-columns: 1fr 56px 1fr 56px 1fr;
  gap:12px;
  align-items:stretch;
}
@media (max-width: 980px){
  .flow{grid-template-columns:1fr; gap:12px;}
  .flow .arrow{display:none;}
}
.flowStep{
  border-radius:22px;
  padding:18px 16px;
  background: radial-gradient(120% 120% at 20% 10%, rgba(32,46,60,.9) 0%, rgba(10,18,24,.85) 60%, rgba(8,14,18,.88) 100%);
  border:1px solid rgba(255,255,255,.10);
  position:relative;
  overflow:hidden;
}
.flowStep::after{
  content:"";
  position:absolute;
  inset:-1px;
  background: radial-gradient(800px 220px at 0% 0%, rgba(22,101,52,.22), transparent 60%);
  pointer-events:none;
}
.flowStep h3{margin:8px 0 6px 0; font-size:16px;}
.flowStep .pillRow{display:flex; flex-wrap:wrap; gap:8px; margin-top:12px;}
.flowStep .pill{
  display:inline-flex;
  padding:6px 10px;
  border-radius:999px;
  font-size:12px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.06);
}
.arrow{
  display:flex;
  align-items:center;
  justify-content:center;
  opacity:.9;
}
.arrow svg{filter: drop-shadow(0 10px 12px rgba(0,0,0,.25));}

/* Facebook cards */
.fbGrid{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap:14px;
}
@media (max-width: 1100px){ .fbGrid{grid-template-columns: repeat(2, 1fr);} }
@media (max-width: 520px){ .fbGrid{grid-template-columns: 1fr;} }
.fbPost{
  border-radius:22px;
  overflow:hidden;
  background: rgba(10,18,24,.82);
  border:1px solid rgba(255,255,255,.10);
  box-shadow: 0 18px 44px rgba(0,0,0,.30);
  transition: transform .18s ease, border-color .18s ease;
}
.fbPost:hover{ transform: translateY(-2px); border-color: rgba(22,101,52,.35); }
.fbPost__img{
  height:140px;
  background-size:cover;
  background-position:center;
  position:relative;
}
.fbPost__img::after{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,.0) 20%, rgba(0,0,0,.55) 100%);
}
.fbPost__body{ padding:12px 12px 14px; }
.fbPost__meta{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:8px; }
.fbPost__date{ font-size:12px; color: rgba(229,231,235,.75); }
.fbPost__tag{ font-size:12px; padding:5px 10px; border-radius:999px; background: rgba(22,101,52,.14); border:1px solid rgba(22,101,52,.30); }
.fbPost__text{ font-size:13px; line-height:1.35; color: rgba(229,231,235,.92); min-height:58px; }
.fbPost__link{ display:inline-flex; margin-top:10px; gap:8px; align-items:center; font-weight:600; }


/* ===== Zero Bala cleanup ===== */
#facebook .lead{display:block !important; max-width:72ch;}
#fbFeed{display:block;}
#fbGrid .fbPost__text{min-height:72px;}
#fbGrid .fbPost__img{height:180px;}
.brand__text span{opacity:.88;}


/* ===== Ajustes v2 — proposta responsiva + mapa funcional ===== */
.proposalHead{
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(260px,.8fr);
  gap:22px;
  align-items:end;
}
.proposalCTA{
  justify-self:end;
  width:min(100%, 320px);
  padding:18px;
  border-radius:22px;
  background:linear-gradient(180deg, rgba(20,32,40,.72), rgba(10,18,24,.82));
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 18px 40px rgba(0,0,0,.22);
}
.proposalCTA .btn{width:100%; justify-content:center;}
.proposalWrap{
  padding:22px;
  border-radius:28px;
  background:linear-gradient(180deg, rgba(9,18,22,.76), rgba(9,18,22,.58));
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 20px 48px rgba(0,0,0,.22);
  overflow:hidden;
}
.proposalFlow{
  display:grid;
  grid-template-columns:minmax(0,1fr) 72px minmax(0,1fr) 72px minmax(0,1fr);
  gap:16px;
  align-items:stretch;
}
.pfCard{
  min-width:0;
  padding:20px;
  border-radius:24px;
  background:radial-gradient(120% 120% at 20% 10%, rgba(32,46,60,.92) 0%, rgba(10,18,24,.88) 62%, rgba(8,14,18,.90) 100%);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 18px 40px rgba(0,0,0,.25);
}
.pfTop{display:grid; grid-template-columns:auto auto minmax(0,1fr); gap:12px; align-items:start;}
.pfBadge{
  width:34px; height:34px; border-radius:12px; display:flex; align-items:center; justify-content:center;
  background:rgba(34,197,94,.18); border:1px solid rgba(34,197,94,.28); font-weight:900;
}
.pfIcon{font-size:20px; line-height:1; padding-top:5px;}
.pfCard h3{margin:0 0 6px; font-size:26px;}
.pfChips{display:flex; flex-wrap:wrap; gap:8px; margin-top:16px;}
.pfArrow{display:flex; align-items:center; justify-content:center; min-width:0;}
.pfArrow svg{width:100%; max-width:72px; height:24px;}
.pfArrow path:first-child{stroke:rgba(229,231,235,.45); stroke-width:2; fill:none; stroke-linecap:round;}
.pfArrow path:last-child{stroke:rgba(34,197,94,.85); stroke-width:2; fill:none; stroke-linecap:round; stroke-linejoin:round;}
.mapWrap--compact{grid-template-columns:1.15fr .85fr;}
.mapCanvas .uf{cursor:pointer;}
.contactCard{
  padding:14px; border-radius:18px; border:1px solid rgba(255,255,255,.10); background:rgba(255,255,255,.06); margin-top:10px;
}
.contactCard__name{font-weight:900; color:rgba(255,255,255,.94);}
.contactCard__hint,.contactCard__fone{margin-top:6px; color:rgba(229,231,235,.78);}
.panelNote{margin-top:14px; color:rgba(229,231,235,.74);}
@media (max-width: 1120px){
  .proposalFlow{grid-template-columns:1fr; gap:14px;}
  .pfArrow{display:none;}
}
@media (max-width: 900px){
  .proposalHead{grid-template-columns:1fr;}
  .proposalCTA{justify-self:stretch; width:100%;}
  .mapWrap--compact{grid-template-columns:1fr;}
}
@media (max-width: 640px){
  .proposalWrap{padding:16px; border-radius:22px;}
  .pfCard{padding:16px; border-radius:20px;}
  .pfCard h3{font-size:20px;}
  .pfTop{grid-template-columns:auto minmax(0,1fr);}
  .pfIcon{display:none;}
}


/* Ajustes mapa interativo - contato */
.mapCanvas .uf{cursor:pointer; vector-effect:non-scaling-stroke;}
.mapCanvas .uf:focus-visible{outline:none; stroke:#facc15; stroke-width:4; fill-opacity:1;}
.mapCanvas .uf.active{stroke:#facc15; stroke-width:4; fill-opacity:1; filter:drop-shadow(0 0 20px rgba(250,204,21,.18));}
.contactCard__fone{display:inline-flex; align-items:center; text-decoration:none; font-weight:800;}
.contactCard__fone:hover{text-decoration:underline;}


/* ===== v4 interatividade + alinhamento ===== */
.split{align-items:start;}
.flow{align-items:stretch;}
.flowStep{
  display:flex;
  flex-direction:column;
  min-height:280px;
  transition:transform .22s ease, border-color .22s ease, box-shadow .22s ease;
}
.flowStep:hover{
  transform:translateY(-4px);
  border-color:rgba(34,197,94,.24);
  box-shadow:0 24px 56px rgba(0,0,0,.32);
}
.flowStep .pillRow{
  margin-top:auto;
  align-content:flex-start;
}
.flow .arrow{
  align-self:center;
}
.pfCard{
  display:flex;
  flex-direction:column;
  min-height:100%;
  transition:transform .22s ease, border-color .22s ease, box-shadow .22s ease;
}
.pfCard:hover{
  transform:translateY(-4px);
  border-color:rgba(34,197,94,.24);
  box-shadow:0 24px 56px rgba(0,0,0,.32);
}
.pfChips{margin-top:auto; padding-top:16px; align-content:flex-start;}
.serviceCard,
.cardLink,
.infoCard,
.metricCard,
.q-card,
.contactCard{
  transition:transform .22s ease, border-color .22s ease, box-shadow .22s ease;
}
.serviceCard:hover,
.cardLink:hover,
.infoCard:hover,
.metricCard:hover,
.q-card:hover,
.contactCard:hover{
  transform:translateY(-4px);
  border-color:rgba(34,197,94,.22);
  box-shadow:0 24px 56px rgba(0,0,0,.28);
}
[data-anim]{
  opacity:0;
  transform:translateY(22px);
  transition:opacity .55s ease, transform .55s ease;
}
[data-anim].is-in{
  opacity:1;
  transform:none;
}
.mapCanvas .uf{
  cursor:pointer;
  transition:fill-opacity .18s ease, stroke .18s ease, stroke-width .18s ease, transform .18s ease, filter .18s ease;
}
.mapCanvas .uf:hover{ transform:translateY(-1px); }
@media (max-width: 980px){
  .flowStep{min-height:auto;}
}


/* =========================
   V5 — contraste, limpeza e mapa premium
   ========================= */
:root{
  --card-v5: rgba(6, 17, 20, 0.88);
  --card-v5-2: rgba(8, 22, 28, 0.94);
  --stroke-v5: rgba(148, 163, 184, 0.18);
  --stroke-v5-strong: rgba(34, 197, 94, 0.28);
  --shadow-v5: 0 24px 60px rgba(0,0,0,.34);
}

.section{padding:34px 0 64px;}
.section--field,
.section--grain{
  position:relative;
  isolation:isolate;
}
.section--field::before,
.section--grain::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(180deg, rgba(2,8,11,.30), rgba(2,8,11,.48));
}

.topbar__actions{gap:12px;}
.topbar__actions .pillbtn--ghost{min-width:92px; text-align:center;}
.mobileNav__row .pillbtn--ghost{min-width:100%; text-align:center;}

.cardLink,
.infoCard,
.metricCard,
.serviceCard,
.q-card,
.contactCard,
.mapLeft,
.mapRight,
.proposalWrap,
.proposalCTA,
.fbPost,
.kpi,
.flowStep,
.pfCard,
.ctaStrip{
  background:linear-gradient(180deg, rgba(7,18,22,.94), rgba(6,15,19,.88)) !important;
  border:1px solid var(--stroke-v5) !important;
  box-shadow:var(--shadow-v5) !important;
  backdrop-filter:blur(10px);
}

.cardLink,
.infoCard,
.metricCard,
.serviceCard,
.q-card,
.contactCard,
.pfCard,
.flowStep,
.fbPost{
  position:relative;
  overflow:hidden;
}
.cardLink::before,
.infoCard::before,
.metricCard::before,
.serviceCard::before,
.q-card::before,
.contactCard::before,
.pfCard::before,
.flowStep::before,
.fbPost::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(135deg, rgba(34,197,94,.10), transparent 34%, transparent 64%, rgba(245,158,11,.06));
  pointer-events:none;
}

.cardLink:hover,
.infoCard:hover,
.metricCard:hover,
.serviceCard:hover,
.q-card:hover,
.contactCard:hover,
.pfCard:hover,
.flowStep:hover,
.fbPost:hover{
  border-color:var(--stroke-v5-strong) !important;
  box-shadow:0 28px 68px rgba(0,0,0,.42), 0 0 0 1px rgba(34,197,94,.06) inset !important;
}

.cardLink__text,
.cardLink__meta,
.metricLabel,
.metricHelp,
.infoCard .muted,
.serviceCard .muted,
.q-card .muted,
.panelNote,
.contactCard__hint,
.muted{
  color:rgba(226,232,240,.82) !important;
}

.metricValue,
.infoCard__big,
.cardLink__title,
.serviceCard h3,
.q-card h3,
.mapTitle,
.panelTag,
#stateTitle,
.pfCard h3,
.flowStep h3,
h1,h2,h3,strong{
  color:rgba(248,250,252,.98);
}

.metricIcon,
.serviceCard__icon,
.q-icon,
.pfBadge,
.listRow .uf{
  box-shadow:0 12px 28px rgba(0,0,0,.22);
}
.metricIcon,
.q-icon,
.pfBadge,
.listRow .uf{
  background:rgba(22,101,52,.22) !important;
  border-color:rgba(34,197,94,.26) !important;
}
.serviceCard__icon{
  background:rgba(245,158,11,.14);
  border:1px solid rgba(245,158,11,.24);
}

.ctaStrip{
  background:linear-gradient(90deg, rgba(8,22,28,.94), rgba(11,28,20,.92)) !important;
  border:1px solid rgba(34,197,94,.22) !important;
}

/* Proposta mais limpa após remover conteúdo lateral */
.proposalHead{align-items:stretch;}
.proposalWrap{
  padding:24px;
  border-radius:30px;
}
.proposalFlow{gap:18px;}

/* Mapa com contraste forte */
.mapWrap{
  grid-template-columns: 1.28fr .92fr;
  gap:20px;
}
.mapLeft,
.mapRight{
  background:linear-gradient(180deg, rgba(6,17,20,.96), rgba(7,20,25,.92)) !important;
}
.mapHead{
  background:linear-gradient(90deg, rgba(10,30,20,.92), rgba(13,24,30,.88));
  border-bottom:1px solid rgba(255,255,255,.08);
}
.mapCanvas{
  position:relative;
  min-height:640px;
  padding:22px;
  background:
    linear-gradient(180deg, rgba(2,10,12,.52), rgba(2,10,12,.56)),
    radial-gradient(760px 420px at 25% 14%, rgba(245,158,11,.24), transparent 64%),
    radial-gradient(680px 420px at 82% 65%, rgba(34,197,94,.24), transparent 62%),
    url("../img/bg-field.webp") center/cover no-repeat;
}
.mapCanvas::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.00) 35%, rgba(255,255,255,.03));
  pointer-events:none;
}
.mapCanvas svg{
  position:relative;
  z-index:1;
  filter:brightness(1.12) contrast(1.22) saturate(1.08);
}
.mapCanvas .uf{
  fill:rgba(253, 224, 71, 0.18) !important;
  fill-opacity:.88;
  stroke:rgba(255,255,255,.48) !important;
  stroke-width:1.7 !important;
  transition:fill .18s ease, fill-opacity .18s ease, stroke .18s ease, stroke-width .18s ease, transform .18s ease, filter .18s ease !important;
}
.mapCanvas .uf:hover{
  fill:rgba(250,204,21,.28) !important;
  stroke:rgba(255,255,255,.92) !important;
  stroke-width:2.6 !important;
  filter:drop-shadow(0 0 18px rgba(250,204,21,.28));
}
.mapCanvas .uf.active,
.mapCanvas .uf:focus-visible{
  fill:rgba(34,197,94,.36) !important;
  fill-opacity:1 !important;
  stroke:#facc15 !important;
  stroke-width:3.2 !important;
  filter:drop-shadow(0 0 8px rgba(250,204,21,.36)) drop-shadow(0 0 22px rgba(34,197,94,.28));
}

.contactsList .contactCard,
.contactsList .card{
  background:linear-gradient(180deg, rgba(12,25,32,.92), rgba(8,18,24,.88)) !important;
  border:1px solid rgba(255,255,255,.12) !important;
}
.contactCard__fone,
.contactsList .card strong{
  color:#bbf7d0 !important;
}

.footer__links a{
  background:rgba(255,255,255,.06);
}

@media (max-width: 1120px){
  .mapCanvas{min-height:560px;}
}
@media (max-width: 980px){
  .topbar__actions{display:none;}
  .mapWrap{grid-template-columns:1fr;}
  .mapCanvas{min-height:520px;}
}
@media (max-width: 640px){
  .section{padding:28px 0 56px;}
  .mapCanvas{min-height:420px; padding:16px;}
  .proposalWrap{padding:16px;}
}


/* v5.1 - alinhamento fino dos cards */
.flow{
  align-items:stretch;
}
.flowStep{
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  min-height:252px;
}
.flowStep .ribbon{
  width:fit-content;
}
.flowStep h3{
  min-height:52px;
  display:flex;
  align-items:flex-start;
}
.flowStep .pillRow{
  margin-top:auto;
}

.proposalFlow{
  align-items:stretch;
}
.pfCard{
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  min-height:246px;
}
.pfTop{
  align-items:start;
}
.pfCard h3{
  min-height:62px;
  display:flex;
  align-items:flex-start;
}
.pfChips{
  margin-top:auto;
}

@media (max-width: 1120px){
  .flowStep,
  .pfCard{
    min-height:auto;
  }
  .flowStep h3,
  .pfCard h3{
    min-height:0;
  }
}


/* ===== v5.2 ajuste final do bloco de consistência ===== */
#como-funciona .split{
  grid-template-columns: minmax(0, .96fr) minmax(0, 1.04fr);
  gap: 30px;
  align-items: start;
}
#como-funciona .flow{
  grid-template-columns: minmax(0,1fr) 32px minmax(0,1fr) 32px minmax(0,1fr);
  gap: 10px;
  align-items: stretch;
}
#como-funciona .flowStep{
  min-height: 312px;
  padding: 18px 14px;
}
#como-funciona .flowStep .ribbon{
  align-self: flex-start;
  min-height: 54px;
}
#como-funciona .flowStep h3{
  min-height: 84px;
  line-height: 1.08;
}
#como-funciona .flowStep .pillRow{
  gap: 10px;
}
#como-funciona .flow .arrow{
  justify-self: center;
}
#como-funciona .flow + div{
  justify-content: flex-start;
}
@media (max-width: 1180px){
  #como-funciona .split{
    grid-template-columns: 1fr;
  }
  #como-funciona .flow{
    grid-template-columns: minmax(0,1fr) 28px minmax(0,1fr) 28px minmax(0,1fr);
  }
}
@media (max-width: 900px){
  #como-funciona .flow{
    grid-template-columns: 1fr;
  }
  #como-funciona .flowStep{
    min-height: auto;
  }
}


/* ===== v8 upgrade ===== */
.heroStats{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  margin-top:22px;
  max-width:860px;
}
.heroStat{
  padding:16px 18px;
  border-radius:18px;
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 16px 30px rgba(0,0,0,.18);
  backdrop-filter: blur(8px);
}
.heroStat strong{
  display:block;
  font-size:clamp(20px,2.6vw,28px);
  line-height:1;
  margin-bottom:6px;
  color:#fff;
}
.heroStat span{
  display:block;
  color:rgba(255,255,255,.78);
  font-size:13px;
  line-height:1.45;
}

.trustGrid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:18px;
}
.trustCard{
  padding:24px;
  border-radius:22px;
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 16px 28px rgba(0,0,0,.14);
}
.trustCard h3{margin:10px 0 8px}
.trustIcon{
  width:48px;height:48px;border-radius:14px;display:grid;place-items:center;
  background:linear-gradient(180deg, rgba(34,197,94,.22), rgba(245,158,11,.12));
  border:1px solid rgba(255,255,255,.10);
  font-size:22px;
}

.proposalSide--modern{
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
}
.psLead{margin:4px 0 16px}
.deliverablesModern{
  display:grid;
  grid-template-columns:1fr;
  gap:14px;
}
.deliverablesModern__card{
  padding:18px;
  border-radius:18px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 12px 24px rgba(0,0,0,.12);
}
.deliverablesModern__card h3{font-size:18px;margin:10px 0 8px}
.deliverablesModern__icon{
  width:42px;height:42px;border-radius:12px;display:grid;place-items:center;
  background:linear-gradient(180deg, rgba(34,197,94,.18), rgba(255,255,255,.04));
  border:1px solid rgba(255,255,255,.08);
}
.chip--soft{
  background:rgba(255,255,255,.05);
  border-color:rgba(255,255,255,.09);
}

@media (max-width:980px){
  .heroStats{grid-template-columns:1fr}
  .trustGrid{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .trustGrid{grid-template-columns:1fr}
}


/* ===== Ajustes solicitados — logo limpa, trabalhe conosco e rodapé ===== */
.brand{
  min-width:auto;
  gap:0;
}
.brand__text{display:none !important;}
.brand__logo{
  height:80px;
  width:auto;
  max-width:320px;
  border-radius:0;
  box-shadow:none;
  object-fit:contain;
}
.pillbtn--careers{
  white-space:nowrap;
  font-size:12px;
  padding:10px 13px;
  background:linear-gradient(180deg, rgba(245,158,11,.96), rgba(217,119,6,.92));
  color:#fff7ed;
  border-color:rgba(245,158,11,.30);
  box-shadow:0 12px 26px rgba(245,158,11,.18);
}
.pillbtn--careers:hover{
  background:linear-gradient(180deg, rgba(251,191,36,.98), rgba(217,119,6,.94));
}
.careerCallout{
  margin-top:28px;
  padding:28px;
  border-radius:28px;
  background:linear-gradient(180deg, rgba(7,18,22,.94), rgba(6,15,19,.88));
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 24px 60px rgba(0,0,0,.34);
}
#trabalhe-conosco{scroll-margin-top:110px;}
.careerCallout .eyebrow{margin-bottom:14px;}
.careerCallout h2{margin-bottom:12px;}
.careerCallout__email{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-top:6px;
  padding:12px 16px;
  border-radius:14px;
  text-decoration:none;
  font-weight:900;
  background:rgba(245,158,11,.14);
  border:1px solid rgba(245,158,11,.26);
  color:#fde68a;
}
.footer{
  padding:28px 0;
}
.footer__inner{
  justify-content:center;
}
.footer__meta{
  width:100%;
  max-width:760px;
  margin:0 auto;
  text-align:center;
}
.footer__meta strong{
  display:block;
  margin-bottom:8px;
  font-size:18px;
}
.footer__meta .muted{margin-top:6px;}
@media (max-width: 980px){
  .topbar__actions{
    gap:8px;
  }
  .topbar__actions .pillbtn--careers{
    display:none;
  }
  .careerCallout{
    padding:22px;
  }
}


/* =========================================================
   HEADER PREMIUM — topo integrado ao hero, logo maior,
   barra suave ao rolar
   ========================================================= */

.topbar{
  position: fixed !important;
  inset: 0 0 auto 0 !important;
  width: 100% !important;
  z-index: 80 !important;
  background: transparent !important;
  border-bottom: none !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
  transition:
    background .28s ease,
    border-color .28s ease,
    backdrop-filter .28s ease,
    box-shadow .28s ease,
    transform .28s ease;
}

.topbar::before{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(180deg, rgba(3,16,19,.48), rgba(3,16,19,0));
  pointer-events:none;
}

.topbar__inner{
  position: relative;
  display:flex;
  align-items:center;
  gap: 18px;
  min-height: 128px !important;
  padding: 18px 0 !important;
  transition: min-height .28s ease, padding .28s ease;
}

.brand{
  position: relative;
  z-index: 1;
  display:flex !important;
  align-items:center !important;
  gap:0 !important;
  min-width: 320px !important;
  overflow: visible !important;
}

.brand__logo{
  height: 118px !important;
  width: auto !important;
  max-width: 440px !important;
  object-fit: contain !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  filter: drop-shadow(0 10px 28px rgba(0,0,0,.28));
  transition: height .28s ease, max-width .28s ease, filter .28s ease, transform .28s ease;
}

.brand__text{
  display:none !important;
}

.nav{
  position: relative;
  z-index: 1;
  margin-left: auto !important;
  gap: 10px !important;
}

.nav__link{
  color: rgba(255,255,255,.94) !important;
  font-weight: 800 !important;
  text-shadow: 0 2px 12px rgba(0,0,0,.32);
  padding: 12px 14px !important;
}

.nav__link:hover{
  background: rgba(255,255,255,.08) !important;
  border-color: rgba(255,255,255,.12) !important;
}

.nav__link.is-active{
  box-shadow: 0 0 0 5px rgba(34,197,94,.18) !important;
}

.topbar__actions{
  position: relative;
  z-index: 1;
  gap: 12px !important;
}

.iconbtn{
  width: 40px !important;
  height: 40px !important;
  background: rgba(255,255,255,.10) !important;
  border-color: rgba(255,255,255,.16) !important;
  backdrop-filter: blur(10px);
}

.pillbtn{
  padding: 11px 18px !important;
  font-size: 14px !important;
  box-shadow: 0 12px 26px rgba(0,0,0,.18);
}

.pillbtn--ghost{
  background: rgba(255,255,255,.08) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
}

main{
  position: relative;
  z-index: 1;
}

.hero.hero--campo,
.pageHero{
  padding-top: 158px !important;
}

.hero.hero--campo{
  margin-top: 0 !important;
}

.topbar.topbar--scrolled{
  background: linear-gradient(90deg, rgba(3,16,19,.92), rgba(3,16,19,.74)) !important;
  border-bottom: 1px solid rgba(255,255,255,.10) !important;
  backdrop-filter: blur(16px) !important;
  box-shadow: 0 14px 40px rgba(0,0,0,.26) !important;
}

.topbar.topbar--scrolled::before{
  opacity: 0;
}

.topbar.topbar--scrolled .topbar__inner{
  min-height: 92px !important;
  padding: 10px 0 !important;
}

.topbar.topbar--scrolled .brand__logo{
  height: 86px !important;
  max-width: 340px !important;
}

.topbar.topbar--scrolled .nav__link{
  text-shadow: none;
}

@media (max-width: 1180px){
  .brand{
    min-width: 260px !important;
  }
  .brand__logo{
    height: 104px !important;
    max-width: 380px !important;
  }
  .topbar__inner{
    min-height: 118px !important;
  }
  .hero.hero--campo,
  .pageHero{
    padding-top: 148px !important;
  }
}

@media (max-width: 980px){
  .topbar::before{
    background: linear-gradient(180deg, rgba(3,16,19,.62), rgba(3,16,19,.08));
  }
  .topbar__inner{
    min-height: 104px !important;
    padding: 14px 0 !important;
  }
  .brand{
    min-width: auto !important;
  }
  .brand__logo{
    height: 94px !important;
    max-width: 320px !important;
  }
  .topbar__actions{
    margin-left: auto !important;
  }
  .mobileNav{
    background: rgba(3,16,19,.92) !important;
    backdrop-filter: blur(18px) !important;
  }
  .hero.hero--campo,
  .pageHero{
    padding-top: 136px !important;
  }
  .topbar.topbar--scrolled .topbar__inner{
    min-height: 84px !important;
  }
  .topbar.topbar--scrolled .brand__logo{
    height: 76px !important;
    max-width: 280px !important;
  }
}

@media (max-width: 640px){
  .topbar__inner{
    min-height: 92px !important;
    padding: 12px 0 !important;
  }
  .brand__logo{
    height: 82px !important;
    max-width: 260px !important;
  }
  .hero.hero--campo,
  .pageHero{
    padding-top: 122px !important;
  }
  .topbar.topbar--scrolled .brand__logo{
    height: 68px !important;
    max-width: 220px !important;
  }
}


/* =========================================================
   HOTFIX — páginas internas / qualidade
   evita sobreposição do header premium no conteúdo
   ========================================================= */

.pageHero,
.page-hero,
.hero--page,
.hero--inner,
.section--hero,
body.page-qualidade .hero,
body.page-qualidade .pageHero{
  padding-top: 220px !important;
}

.pageHero .container,
.page-hero .container,
.hero--page .container,
.hero--inner .container{
  position: relative;
  z-index: 2;
}

.pageHero h1,
.page-hero h1,
.hero--page h1,
.hero--inner h1{
  margin-top: 0 !important;
  max-width: 1100px;
  line-height: 1.05 !important;
}

.pageHero .eyebrow,
.page-hero .eyebrow,
.hero--page .eyebrow,
.hero--inner .eyebrow{
  display: block;
  margin-bottom: 12px;
}

@media (max-width: 1180px){
  .pageHero,
  .page-hero,
  .hero--page,
  .hero--inner,
  .section--hero,
  body.page-qualidade .hero,
  body.page-qualidade .pageHero{
    padding-top: 190px !important;
  }
}

@media (max-width: 980px){
  .pageHero,
  .page-hero,
  .hero--page,
  .hero--inner,
  .section--hero,
  body.page-qualidade .hero,
  body.page-qualidade .pageHero{
    padding-top: 170px !important;
  }

  .pageHero h1,
  .page-hero h1,
  .hero--page h1,
  .hero--inner h1{
    font-size: clamp(2.2rem, 6vw, 3.2rem) !important;
  }
}

@media (max-width: 640px){
  .pageHero,
  .page-hero,
  .hero--page,
  .hero--inner,
  .section--hero,
  body.page-qualidade .hero,
  body.page-qualidade .pageHero{
    padding-top: 145px !important;
  }
}


/* =========================================================
   HOTFIX FINAL — páginas internas estáveis
   mantém premium na home e evita quebra nas internas
   ========================================================= */

body.page-inner .topbar{
  position: sticky !important;
  top: 0 !important;
  background: linear-gradient(90deg, rgba(3,16,19,.94), rgba(3,16,19,.78)) !important;
  border-bottom: 1px solid rgba(255,255,255,.10) !important;
  backdrop-filter: blur(16px) !important;
  box-shadow: 0 14px 40px rgba(0,0,0,.24) !important;
}

body.page-inner .topbar::before{
  display: none !important;
}

body.page-inner .topbar__inner{
  min-height: 96px !important;
  padding: 10px 0 !important;
}

body.page-inner .brand{
  min-width: 260px !important;
}

body.page-inner .brand__logo{
  height: 82px !important;
  max-width: 320px !important;
}

body.page-inner .nav__link{
  text-shadow: none !important;
}

body.page-inner .hero,
body.page-inner .pageHero{
  padding-top: 40px !important;
}

body.page-inner .hero.hero--service{
  padding: 26px 0 10px !important;
}

body.page-inner .hero.hero--service .container{
  position: relative;
  z-index: 2;
}

body.page-inner .hero__content,
body.page-inner .hero__content--single,
body.page-inner .hero__copy{
  max-width: 980px;
}

body.page-inner .kicker{
  display: block;
  margin: 0 0 10px !important;
  color: rgba(255,255,255,.80);
  font-size: 14px;
  font-weight: 850;
  letter-spacing: .02em;
}

body.page-inner .hero.hero--service h1{
  margin: 0 0 10px !important;
  max-width: 1120px;
  font-size: clamp(38px, 5.4vw, 64px) !important;
  line-height: 1.04 !important;
}

body.page-inner .hero.hero--service .lead{
  display: block !important;
  max-width: 860px;
  margin: 0 0 18px !important;
  font-size: 18px;
  color: rgba(255,255,255,.86);
}

body.page-inner .hero__actions{
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 18px;
}

@media (max-width: 980px){
  body.page-inner .topbar__inner{
    min-height: 84px !important;
    padding: 8px 0 !important;
  }

  body.page-inner .brand__logo{
    height: 72px !important;
    max-width: 260px !important;
  }

  body.page-inner .hero,
  body.page-inner .pageHero{
    padding-top: 28px !important;
  }

  body.page-inner .hero.hero--service h1{
    font-size: clamp(32px, 6vw, 48px) !important;
  }

  body.page-inner .hero.hero--service .lead{
    font-size: 16px;
  }
}

@media (max-width: 640px){
  body.page-inner .topbar__inner{
    min-height: 76px !important;
  }

  body.page-inner .brand__logo{
    height: 64px !important;
    max-width: 220px !important;
  }

  body.page-inner .hero.hero--service{
    padding-top: 20px !important;
  }

  body.page-inner .hero.hero--service h1{
    font-size: clamp(28px, 8vw, 40px) !important;
  }
}
