:root{
      /* Paleta Industrial */
      --brand:#dfa11b;             /* mostarda */
      --black:#000000;             /* preto */
      --graphite:#2c2c2c;          /* grafite */
      --cement:#d9d9d9;            /* cinza cimento claro */
      --steel:#2f4858;             /* aço oxidado */
      --concrete:#5a5a5a;          /* concreto escuro */
      --muted:#737373;             /* cinza médio do logo */
      --ice:#f5f5f5;               /* branco gelo */
      --bluegray:#6c7a89;          /* azul acinzentado */

      --text:#1a1a1a;
      --bg:var(--ice);
      --bg-alt:#0e0e0e;
      --container:1180px;
      --radius:16px;
      --shadow:0 8px 24px rgba(0,0,0,.08);
    }
    *{box-sizing:border-box;margin:0;padding:0}
    body{font-family:Inter, system-ui, sans-serif;color:var(--text);background:var(--bg)}
    a{text-decoration:none;color:inherit}
    img{max-width:100%;display:block}
    .container{max-width:var(--container);margin:0 auto;padding:0 20px}
    /* Header */
    header{background:#ffffff;border-bottom:1px solid #ddd}
    .nav{display:flex;align-items:center;justify-content:space-between;height:72px}
    .brand{display:flex;align-items:center;gap:10px;font-weight:700}
    .brand img{height:42px}
    .nav ul{display:flex;gap:24px;list-style:none}
    .nav a{color:#333}
    .nav a:hover{color:var(--brand)}
    .cta{background:var(--brand);color:#000;font-weight:700;padding:12px 20px;border-radius:999px;border:1px solid rgba(0,0,0,.1)}
    .cta:hover{background:var(--concrete);color:#fff;transform:translateY(-1px);transition:all .15s ease}
    .cta:hover{background:var(--concrete);color:#fff;transform:translateY(-1px);transition:all .15s ease}
    /* Hero */
    .hero{
    padding:84px 0;
    background: #2f4858;
  }
    .hero .wrap{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
    .hero h1{font-size:clamp(32px,4vw,56px);line-height:1.1;color:#fff}
    .hero p{font-size:18px;color:var(--cement);margin-top:16px;max-width:60ch}
    .hero .actions{margin-top:28px;display:flex;gap:16px;flex-wrap:wrap}
    .hero img {
  width: 120%;   /* aumenta a empilhadeira */
  max-width: none; /* remove o limite */
  height: auto;
}

    @media(max-width:900px){.hero .wrap{grid-template-columns:1fr}}
    /* Section */
    section{padding:64px 0;background:#737373;color:#f5f5f5}
    .section-title{text-align:center;font-size:30px;margin-bottom:12px;color:#f5f5f5}
    .section-sub{text-align:center;color:#d9d9d9;margin-bottom:36px}
    .grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px}
    .card{background:#1c1c1c;border-radius:var(--radius);padding:24px;box-shadow:var(--shadow);text-align:center;color:#f5f5f5}
    .card h3{margin:12px 0;font-size:20px;color:var(--brand)}
    /* Contact */
    .contact{display:grid;grid-template-columns:1fr 1fr;gap:24px}
    @media(max-width:900px){.contact{grid-template-columns:1fr}}
    .map{min-height:260px;width:100%;border:0;border-radius:var(--radius)}
    footer{background:#000;color:#ccc;padding:24px 0;text-align:center;font-size:14px}
      /* Secondary button (para hero escuro) */
    .btn-secondary{background:transparent;border:1px solid var(--cement);color:#fff;padding:12px 20px;border-radius:999px}
    .btn-secondary:hover{border-color:var(--brand);color:var(--brand)}

    /* Section typography colors */
    .section-title{color:var(--graphite)}
    .section-sub{color:var(--concrete)}
    .card{background:#fff;color:var(--graphite)}
    .card p{color:var(--concrete)}
      /* Hero decorative art */
    .hero{position:relative}
    .hero .wrap{position:relative;z-index:1}
    .hero-art{position:absolute;right:6vw;top:40px;width:min(460px,38vw);opacity:.35;pointer-events:none;z-index:0;background:none;box-shadow:none;border:none}
    .hero-art .path{stroke:var(--cement);opacity:.9}
    .hero-art .fork{fill:var(--brand)}
  
  /* Final header colors */
  header{background:#f5f5f5;border-bottom:1px solid #ddd}
  .nav a{color:#333}
  .nav a:hover{color:var(--brand)}
  
  /* Contrast fix for Services section on dark background */
#sobre {
  background: #2f4858; /* aço oxidado */
}
#sobre .section-title { color: #fff; }
#sobre .section-sub, #sobre p, #sobre li { color: #d9d9d9; }
#sobre strong { color: #dfa11b; }

#servicos {
  background: #f5f5f5; /* branco gelo */
}
#servicos .section-title { color: #2c2c2c; }
#servicos .section-sub { color: #5a5a5a; }


/* === Service cards with icons === */
.svc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:22px}
.svc-card{background:#fff;border-radius:16px;padding:22px;box-shadow:0 10px 24px rgba(0,0,0,.08);text-align:left;border:1px solid #eee}
.svc-icon{width:54px;height:54px;border-radius:14px;display:inline-flex;align-items:center;justify-content:center;background:rgba(223,161,27,.12);border:1px solid rgba(223,161,27,.35);margin-bottom:12px}
.svc-icon svg{width:28px;height:28px;fill:#dfa11b}
.svc-card h3{margin:6px 0 6px;font-size:20px;color:#2c2c2c}
.svc-card p{color:#5a5a5a;margin:0}
#servicos .section-title{color:#2c2c2c}
#servicos .section-sub{color:#5a5a5a}

/* === About with image === */
.about-wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:24px;align-items:center}
.about-media{border-radius:0;box-shadow:none;overflow:visible;background:none}
.about-media svg{width:100%;height:auto;display:block}
@media(max-width:900px){.about-wrap{grid-template-columns:1fr}}


/* Section theme overrides */
#servicos{background:#f5f5f5}
#sobre{background:#2f4858;color:#d9d9d9}
#sobre .section-title{color:#fff}


/* ===== HERO FINAL (como no modelo) ===== */
:root{--brand:#dfa11b;--graphite:#2c2c2c;--concrete:#5a5a5a;--ice:#f5f5f5}
header{background:#fff !important;border-bottom:1px solid #e6e6e6 !important}
.nav a{color:#333 !important}
.nav a:hover{color:var(--brand) !important}
.cta{background:var(--brand);color:#000;font-weight:700;padding:12px 20px;border-radius:999px;border:1px solid rgba(0,0,0,.1)}
.cta:hover{background:#5a5a5a;color:#fff}
.btn-secondary{background:transparent;border:1px solid #cfd2d4;color:#e8edf0;padding:12px 20px;border-radius:999px}
.btn-secondary:hover{border-color:var(--brand);color:#fff}

.hero{background:#2f4858 !important;padding:92px 0 52px}
.hero .container{max-width:1200px}
.hero .wrap{display:grid;grid-template-columns:0.95fr 1.05fr;gap:56px;align-items:center}
.hero-left{text-align:center}
.hero-left h1{font-size:clamp(44px,6.5vw,72px);line-height:1.06;font-weight:800;color:#f5f5f5;margin:0 0 18px}
.hero-left .lead{color:#d9d9d9;max-width:780px;margin:0 auto 22px}
.hero-left .actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.hero-right{display:flex;align-items:flex-end;justify-content:flex-end}
.hero-right img{width:135%;max-width:none;height:auto;display:block;margin:0;border-radius:0 !important;box-shadow:none !important;background:none !important;transform:translate(8%,18px)}
@media(max-width:900px){
  .hero{padding:56px 0 24px}
  .hero .wrap{grid-template-columns:1fr;gap:28px}
  .hero-left{text-align:left}
  .hero-left .lead{margin:0 0 22px}
  .hero-left .actions{justify-content:flex-start}
  .hero-right img{width:100%;transform:none}
}


/* ===== Ajuste hero texto ocupa mais espaço ===== */
.hero .wrap{
  display:grid;
  grid-template-columns:1.2fr 0.8fr; /* texto maior que imagem */
  gap:56px;
  align-items:center;
}
.hero-left{
  text-align:left !important;
  max-width:100% !important;
}
.hero-left h1{
  font-size:clamp(48px,7vw,80px);
  line-height:1.12;
  margin:0 0 24px;
}
.hero-left .lead{
  font-size:20px;
  max-width:100% !important;
  margin:0 0 26px;
}


/* ===== HERO MAIS AMPLO (ocupa mais espaço da <section class="hero">) ===== */
.hero{background:#2f4858 !important; padding:140px 0 120px !important;}
.hero .container{max-width:1400px !important;}
.hero .wrap{display:grid; grid-template-columns:1.2fr 0.8fr !important; gap:70px !important; align-items:center;}
.hero-left{text-align:left !important; max-width:100% !important;}
.hero-left h1{font-size:clamp(52px,7vw,88px) !important; line-height:1.1 !important; margin:0 0 24px !important;}
.hero-left .lead{font-size:22px !important; line-height:1.5 !important; max-width:100% !important; margin:0 0 28px !important;}
.hero-right img{width:100% !important; max-width:760px !important; transform:none !important; margin:0 !important; border-radius:0 !important; box-shadow:none !important; background:none !important;}
@media (max-width:900px){
  .hero{padding:80px 0 48px !important;}
  .hero .container{max-width:100% !important;}
  .hero .wrap{grid-template-columns:1fr !important; gap:28px !important;}
  .hero-right img{max-width:100% !important;}
}


/* ===== HERO TEXTO EM TELA CHEIA (sem imagem) ===== */
.hero{padding:150px 0 130px !important; background:#2f4858 !important;}
.hero .container{max-width:1500px !important;}
.hero .wrap{display:grid !important; grid-template-columns:1fr !important; gap:32px !important;}
.hero-right{display:none !important;} /* garante que nada ocupe espaço */
.hero-left{max-width:100% !important; text-align:left !important;}
.hero-left h1{font-size:clamp(56px,8vw,96px) !important; line-height:1.05 !important; margin:0 0 24px !important; color:#f5f5f5 !important;}
.hero-left .lead{font-size:22px !important; line-height:1.5 !important; max-width:none !important; color:#d9d9d9 !important; margin:0 0 28px !important;}
.hero-left .actions{display:flex; gap:14px; flex-wrap:wrap; justify-content:flex-start;}
@media (max-width:900px){
  .hero{padding:90px 0 60px !important;}
  .hero .container{max-width:100% !important;}
  .hero-left h1{font-size:clamp(40px,9vw,56px) !important;}
  .hero-left .lead{font-size:18px !important;}
}


/* ==== Centralizar HERO (texto apenas) igual Serviços ==== */
.hero .wrap{display:grid !important;grid-template-columns:1fr !important;gap:28px !important;align-items:center;justify-items:center}
.hero-right{display:none !important;}
.hero-left{text-align:center !important;max-width:100% !important;}
.hero-left .lead{max-width:75ch !important;margin:0 auto 22px !important;}
.hero-left .actions{justify-content:center !important}

/* ==== Centralizar SOBRE igual Serviços ==== */
#sobre .about-wrap{display:block !important;text-align:center !important}
#sobre .section-title{margin-bottom:8px !important;text-align:center !important}
#sobre .section-sub{margin:0 auto 14px !important;max-width:75ch !important;text-align:center !important}
#sobre p{max-width:75ch;margin:0 auto 10px}



/* === CUSTOMIZAÇÕES DE FUNDO SOLICITADAS === */

/* Header */
header {
  background: #2f4858 !important;
  border-bottom: none !important;
}
.nav a { color: #fff !important; }
.nav a:hover { color: #dfa11b !important; }

/* Hero */
.hero {
  background: #f5f5f5 !important;
}
.hero-left h1,
.hero-left .lead { color: #2f4858 !important; }

/* Nossos Serviços */
#servicos {
  background: #737373 !important;
}
#servicos .section-title,
#servicos .section-sub {
  color: #fff !important;
}

/* Caixinhas dos serviços */
.svc-card {
  background: #dfa11b !important;
  color: #fff !important;
  width: 580px; /* aumente esse valor (hoje deve estar algo tipo 200px) */
  padding: 200px;
  border-radius: 100px;
}
.svc-card h3,
.svc-card p { color: #fff !important; }
.svc-icon { background: rgba(0,0,0,0.2) !important; }

/* Sobre a MG */
#sobre {
  background: #2f4858 !important;
}
#sobre .section-title,
#sobre .section-sub,
#sobre p { color: #fff !important; }

/* Entre em contato */
#contato {
  background: #dfa11b !important;
}
#contato h2,
#contato p,
#contato a {
  color: #fff !important;
}



/* === BOTÕES CUSTOMIZADOS (cores e estados) === */

/* Botão principal (Falar no WhatsApp) */
.cta {
  background: #2f4858 !important;
  color: #dfa11b !important;
  font-weight: 700;
  padding: 12px 20px;
  border-radius: 999px;
  border: none !important;
  box-shadow: 0 2px 8px rgba(0,0,0,.12);
  transition: all .2s ease;
}
.cta:hover,
.cta:active,
.cta:focus-visible {
  background: #dfa11b !important;
  color: #2f4858 !important;
  outline: none;
}

/* Botão secundário (Entre em contato) */
.btn-secondary {
  background: #737373 !important;
  color: #dfa11b !important;
  font-weight: 700;
  padding: 12px 20px;
  border-radius: 999px;
  border: none !important;
  box-shadow: 0 2px 8px rgba(0,0,0,.12);
  transition: all .2s ease;
}
.btn-secondary:hover,
.btn-secondary:active,
.btn-secondary:focus-visible {
  background: #dfa11b !important;
  color: #737373 !important;
  outline: none;
}



/* === Ajustes finais solicitados === */

/* Botão principal (Falar no WhatsApp) */
.cta {
  background: #2f4858 !important;
  color: #f5f5f5 !important; /* texto branco gelo */
  font-weight: 700;
  padding: 12px 20px;
  border-radius: 999px;
  border: none !important;
  box-shadow: 0 2px 8px rgba(0,0,0,.12);
  transition: all .2s ease;
}
.cta:hover,
.cta:active,
.cta:focus-visible {
  background: #dfa11b !important;
  color: #2f4858 !important;
  outline: none;
}

/* Botão secundário (Entre em contato) */
.btn-secondary {
  background: #737373 !important;
  color: #f5f5f5 !important; /* texto branco gelo */
  font-weight: 700;
  padding: 12px 20px;
  border-radius: 999px;
  border: none !important;
  box-shadow: 0 2px 8px rgba(0,0,0,.12);
  transition: all .2s ease;
}
.btn-secondary:hover,
.btn-secondary:active,
.btn-secondary:focus-visible {
  background: #dfa11b !important;
  color: #2f4858 !important;
  outline: none;
}

/* Botão pedir orçamento (no header) */
header .cta {
  background: #dfa11b !important;
  color: #2f4858 !important;
}
header .cta:hover {
  background: #2f4858 !important;
  color: #f5f5f5 !important;
}

/* Logo acima do título principal no hero */
.hero-left::before {
  content: url('../img/mge_logo_2.svg');
  display: block;
  margin: 0 auto 20px auto;
  max-width: 160px;
}

/* Ícones centralizados nas caixinhas de serviços */
.svc-icon {
  width: 70px;
  height: 70px;
  border-radius: 14px;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 auto 14px auto !important;
}
.svc-card {
  text-align: center !important;
}



/* === AJUSTES SOLICITADOS (botões, logo no hero e serviços) === */

/* 1) Botões do HERO */
.hero .cta {
  background: #2f4858 !important;   /* fundo aço oxidado */
  color: #f5f5f5 !important;         /* texto branco gelo */
  font-weight: 700;
  padding: 12px 20px;
  border-radius: 999px;
  border: none !important;
  transition: all .2s ease;
}
.hero .cta:hover,
.hero .cta:active,
.hero .cta:focus-visible {
  background: #dfa11b !important;    /* mostarda */
  color: #2f4858 !important;         /* texto escuro no hover/click */
  outline: none;
}

/* Botão secundário no HERO */
.hero .btn-secondary {
  background: #737373 !important;    /* cinza médio */
  color: #f5f5f5 !important;         /* texto branco gelo */
  font-weight: 700;
  padding: 12px 20px;
  border-radius: 999px;
  border: none !important;
  transition: all .2s ease;
}
.hero .btn-secondary:hover,
.hero .btn-secondary:active,
.hero .btn-secondary:focus-visible {
  background: #dfa11b !important;    /* mostarda */
  color: #2f4858 !important;         /* texto escuro no hover/click */
  outline: none;
}

/* 2) Botão "Pedir orçamento" do HEADER em mostarda */
header .cta {
  background: #dfa11b !important;
  color: #2f4858 !important;
  font-weight: 700;
  border: none !important;
  transition: all .2s ease;
}
header .cta:hover,
header .cta:active,
header .cta:focus-visible {
  background: #2f4858 !important;
  color: #dfa11b !important;
  outline: none;
}

/* 3) Logo acima do título do HERO (sem alterar HTML) */
.hero-left h1::before {
  content: "";
  display: block;
  width: 120px;
  height: 120px;
  margin: 0 0 12px 0;
  background: url('../img/mge_logo_2.svg') no-repeat center / contain;
  filter: none; /* mantém as cores originais do SVG */
}

/* 4) Centralização dos ícones nos cards de serviços */
.svc-card {
  text-align: center !important;
}
.svc-icon {
  width: 64px;
  height: 64px;
  border-radius: 14px;
  display: flex !important;
  align-items: center;
  justify-content: center;
  margin: 0 auto 12px !important; /* centraliza o quadrado no card */
  background: #f5f5f5 !important;
  border: 1px solid rgba(0,0,0,.08) !important;
}
.svc-icon svg {
  width: 32px !important;
  height: 32px !important;
  display: block !important;
  fill: #2f4858 !important;
}

/* Mantém o fundo das caixinhas em mostarda e textos brancos */
.svc-card {
  background: #dfa11b !important;
  color: #fff !important;
}
.svc-card h3,
.svc-card p {
  color: #fff !important;
}



/* === HERO LOGO INLINE (removendo pseudo-elementos anteriores) === */
.hero-left::before,
.hero-left h1::before {
  content: none !important;
  display: none !important;
}

/* Logo centralizado e maior no Hero */
.hero-logo {
  text-align: center;
  margin-bottom: 20px;
}
.hero-logo img {
  max-width: 750px;
  height: auto;
  display: inline-block;
}



/* ===== Acessibilidade & Legibilidade — Ajustes para #sobre e #servicos ===== */

/* 1) Sobre: aumentar tamanhos e conforto de leitura */
#sobre {
  padding: 88px 0 !important;              /* mais respiro */
}
#sobre .section-title {
  font-size: clamp(40px, 5.2vw, 56px) !important;
  line-height: 1.15 !important;
  letter-spacing: -0.01em !important;
}
#sobre .section-sub {
  font-size: clamp(20px, 2.4vw, 24px) !important;
  line-height: 1.6 !important;
  opacity: 0.95;
}
#sobre p {
  font-size: 19px !important;
  line-height: 1.85 !important;
  color: #eef3f6 !important;               /* contraste melhor no #2f4858 */
  max-width: 80ch !important;
  margin-left: auto;
  margin-right: auto;
}

/* 2) Serviços: melhorar contraste dentro das caixinhas amarelas */
.svc-card {
  background: #dfa11b !important;          /* amarelo mostarda */
  color: #2c2c2c !important;               /* texto escuro (melhor contraste) */
  text-align: left;
  padding: 26px !important;
}
.svc-card h3 {
  color: #2f4858 !important;               /* título mais escuro ainda */
  font-size: clamp(22px, 2.8vw, 28px) !important;
  line-height: 1.3 !important;
  margin-bottom: 8px !important;
}
.svc-card p {
  color: #2c2c2c !important;
  font-size: 18px !important;
  line-height: 1.6 !important;
}
/* Ícone com contraste estável */
.svc-icon {
  background: #fff !important;
  border: 1px solid rgba(0,0,0,.1) !important;
  width: 64px !important;
  height: 64px !important;
  margin-bottom: 14px !important;
}
.svc-icon svg {
  fill: #2f4858 !important;
}

/* 3) Títulos de seção maiores nessas áreas */
#servicos .section-title,
#sobre .section-title {
  letter-spacing: -0.02em !important;
}
#servicos .section-title {
  font-size: clamp(34px, 4.2vw, 50px) !important;
}
#servicos .section-sub {
  font-size: clamp(18px, 2.2vw, 22px) !important;
}

/* 4) Mobile: reforçar legibilidade */
@media (max-width: 480px) {
  #sobre p { font-size: 18px !important; line-height: 1.8 !important; }
  .svc-card p { font-size: 17px !important; }
}



/* ==== NOSSOS SERVIÇOS — cards largos e responsivos (override) ==== */

/* Grid mais elástico e sem overlap */
.svc-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); /* ↑ aumenta a largura mínima */
  gap:20px;
  align-items:stretch;
}

/* Card amplo sem width fixo e sem padding gigante */
.svc-card{
  background:#dfa11b !important;
  color:#fff !important;
  width:auto;                 /* remove largura fixa */
  padding:28px 24px;          /* padding confortável */
  border-radius:28px;         /* cantos arredondados */
  box-shadow:0 10px 24px rgba(0,0,0,.12);
  border:1px solid rgba(255,255,255,.35);
  text-align:center;          /* centraliza conteúdo */
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  min-height:260px;           /* altura agradável */
  transition:transform .18s ease, box-shadow .18s ease;
}
.svc-card:hover{
  transform:translateY(-2px);
  box-shadow:0 14px 30px rgba(0,0,0,.16);
}

/* Ícone centralizado e legível */
.svc-icon{
  width:64px; height:64px;
  border-radius:16px;
  display:flex; align-items:center; justify-content:center;
  margin:0 0 12px 0;
  background:#fff !important;
  border:1px solid rgba(0,0,0,.08) !important;
}
.svc-icon svg{ width:32px; height:32px; fill:#2f4858 !important; }

/* Tipografia dentro do card */
.svc-card h3{
  margin:8px 0 8px;
  font-size:clamp(20px, 2.2vw, 24px);
  line-height:1.25;
  color:#fff !important;
}
.svc-card p{
  margin:0;
  font-size:17px;
  line-height:1.6;
  color:#fff !important;
  opacity:.95;
}

/* Títulos e subtítulo da seção em fundo escuro */
#servicos{
  background:#737373 !important;
}
#servicos .section-title,
#servicos .section-sub{
  color:#fff !important;
}

/* Para telas muito largas, força 4 colunas alinhadas */
@media (min-width: 1280px){
  .svc-grid{ grid-template-columns: repeat(4, 1fr); }
}



/* ====== LAYOUT V3 — Ajustes pedidos ====== */

/* Header: fundo #737373, links brancos, CTA mostarda */
header { background:#737373 !important; border-bottom:none !important; }
.nav a { color:#f5f5f5 !important; }
.nav a:hover { color:#dfa11b !important; }
header .cta { background:#dfa11b !important; color:#2f4858 !important; border:none !important; }
header .cta:hover { background:#2f4858 !important; color:#dfa11b !important; }

/* Serviços: 2 colunas largas, cards azul-aço com textos claros */
#servicos { background:#737373 !important; }
.svc-grid{
  display:grid;
  grid-template-columns: repeat(2, minmax(360px, 1fr)) !important;
  gap:28px !important;
  align-items:stretch;
}
@media (max-width: 900px){
  .svc-grid{ grid-template-columns: 1fr !important; }
}
.svc-card{
  background:#2f4858 !important;    /* fundo aço */
  color:#f5f5f5 !important;         /* texto ice */
  padding:28px 26px !important;
  border-radius:26px !important;
  border:1px solid rgba(255,255,255,.12) !important;
  box-shadow:0 10px 24px rgba(0,0,0,.18) !important;
  text-align:left !important;
  display:flex !important; flex-direction:column !important; gap:8px !important;
  min-height:220px !important;
}
.svc-card h3{
  color:#f5f5f5 !important;
  font-size:clamp(22px, 2.6vw, 28px) !important;
  line-height:1.25 !important;
  margin:4px 0 6px !important;
}
.svc-card p{
  color:#f5f5f5 !important;
  opacity:.95;
  font-size:18px !important;
  line-height:1.6 !important;
}
/* Ícones mostarda centralizados */
.svc-icon{
  width:68px !important; height:68px !important;
  border-radius:16px !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
  background:rgba(223,161,27,.15) !important;
  border:1px solid rgba(223,161,27,.45) !important;
  margin-bottom:6px !important;
}
.svc-icon svg{ width:32px !important; height:32px !important; fill:#dfa11b !important; }

/* Títulos da seção */
#servicos .section-title{ color:#fff !important; font-size:clamp(36px, 4.5vw, 54px) !important; letter-spacing:-0.02em; }
#servicos .section-sub{ color:#f0f0f0 !important; font-size:clamp(18px, 2.4vw, 22px) !important; opacity:.9; }

/* Contato: tipografia maior e icones */
#contato{ background:#dfa11b !important; }
#contato h2{ font-size:clamp(34px, 4.2vw, 48px) !important; color:#2f4858 !important; margin-bottom:10px !important; }
#contato p, #contato li, #contato a { font-size:18px !important; line-height:1.7 !important; color:#2f4858 !important; }
#contato ul.contact-list{ list-style:none; padding:0; margin:12px 0 0 0; display:grid; gap:10px; }
#contato ul.contact-list li{ display:flex; align-items:flex-start; gap:10px; }
#contato ul.contact-list svg{ width:22px; height:22px; flex:0 0 22px; fill:#2f4858; margin-top:4px; }
#contato .map{ min-height:320px !important; border-radius:18px !important; box-shadow:0 10px 22px rgba(0,0,0,.18); }

/* Hero botões coerentes com o novo header */
.hero .cta{ background:#2f4858 !important; color:#f5f5f5 !important; }
.hero .cta:hover{ background:#dfa11b !important; color:#2f4858 !important; }
.hero .btn-secondary{ background:#737373 !important; color:#f5f5f5 !important; border:none !important; }
.hero .btn-secondary:hover{ background:#dfa11b !important; color:#2f4858 !important; }
:root{
  --brand:#dfa11b;             /* mostarda */
  --steel:#2f4858;             /* aço oxidado */
  --muted:#737373;             /* cinza médio */
  --ice:#f5f5f5;               /* branco gelo */
  --text:#1a1a1a;
  --radius:16px;
  --shadow:0 8px 24px rgba(0,0,0,.08);
}

*{box-sizing:border-box;margin:0;padding:0}
body{font-family:Inter, system-ui, sans-serif;color:var(--text);background:var(--ice);line-height:1.6;font-size:18px}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
.container{max-width:1180px;margin:0 auto;padding:0 20px}

/* Header */
header{
  background:#737373 !important;
  border-bottom:none !important;
}
.nav{display:flex;align-items:center;justify-content:space-between;height:72px;flex-wrap:nowrap}
.brand{display:flex;align-items:center;gap:10px;font-weight:700;color:#f5f5f5}
.brand img{height:42px}
.nav ul{display:flex;gap:24px;list-style:none}
.nav a{color:#f5f5f5 !important;}
.nav a:hover{color:#dfa11b !important;}
header .cta{
  background:#dfa11b !important;
  color:#2f4858 !important;
  border:none !important;
  font-weight:700;
  padding:12px 20px;
  border-radius:999px;
}
header .cta:hover{
  background:#2f4858 !important;
  color:#dfa11b !important;
}

/* Hero */
.hero{background:#f5f5f5 !important;padding:92px 0}
.hero .wrap{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.hero-left h1{font-size:clamp(48px,7vw,88px);line-height:1.1;color:#2f4858 !important;margin-bottom:20px}
.hero-left .lead{color:#2f4858 !important;font-size:20px;line-height:1.7;margin-bottom:22px}
.hero-left .actions{display:flex;gap:16px;flex-wrap:wrap}
.hero .cta{
  background:#2f4858 !important;
  color:#f5f5f5 !important;
}
.hero .cta:hover{background:#dfa11b !important;color:#2f4858 !important;}
.hero .btn-secondary{
  background:#737373 !important;
  color:#f5f5f5 !important;
  border:none !important;
}
.hero .btn-secondary:hover{background:#dfa11b !important;color:#2f4858 !important;}

/* Serviços */
#servicos{background:#737373 !important;padding:64px 0}
#servicos .section-title{color:#fff !important;font-size:clamp(36px,4.5vw,54px);text-align:center;margin-bottom:12px}
#servicos .section-sub{color:#f0f0f0 !important;font-size:clamp(18px,2.4vw,22px);text-align:center;margin-bottom:36px}
.svc-grid{display:grid;grid-template-columns:repeat(2,minmax(360px,1fr)) !important;gap:28px}
@media (max-width:900px){.svc-grid{grid-template-columns:1fr !important}}
.svc-card{
  background:#2f4858 !important;
  color:#f5f5f5 !important;
  padding:28px;
  border-radius:26px;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 10px 24px rgba(0,0,0,.18);
  display:flex;flex-direction:column;gap:8px;
  min-height:220px;
}
.svc-card h3{color:#f5f5f5 !important;font-size:clamp(22px,2.8vw,28px);line-height:1.3}
.svc-card p{color:#f5f5f5 !important;font-size:18px;line-height:1.6;opacity:.95}
.svc-icon{
  width:68px;height:68px;border-radius:16px;
  display:flex;align-items:center;justify-content:center;
  background:rgba(223,161,27,.15);border:1px solid rgba(223,161,27,.45);
}
.svc-icon svg{width:32px;height:32px;fill:#dfa11b}

/* Sobre */
#sobre{background:#2f4858 !important;padding:88px 0;color:#f5f5f5}
#sobre .section-title{color:#fff;font-size:clamp(40px,5.2vw,56px);margin-bottom:16px;text-align:center}
#sobre .section-sub{color:#d9d9d9;font-size:clamp(20px,2.4vw,24px);margin-bottom:20px;text-align:center}
#sobre p{font-size:19px;line-height:1.85;color:#eef3f6;max-width:80ch;margin:0 auto 14px;text-align:center}

/* Contato */
#contato{background:#dfa11b !important;padding:64px 0}
#contato h2{font-size:clamp(34px,4.2vw,48px) !important;color:#2f4858;margin-bottom:20px;text-align:center}
#contato p,#contato a{font-size:18px;line-height:1.7;color:#2f4858}
#contato ul.contact-list{list-style:none;padding:0;margin:12px auto 0;max-width:600px;display:grid;gap:12px}
#contato ul.contact-list li{display:flex;align-items:flex-start;gap:10px}
#contato ul.contact-list svg{width:22px;height:22px;fill:#2f4858;flex:0 0 22px;margin-top:4px}
#contato .map{min-height:320px;width:100%;border:0;border-radius:18px;box-shadow:0 10px 22px rgba(0,0,0,.18)}

/* Footer */
footer{background:#000;color:#ccc;padding:24px;text-align:center;font-size:14px}

/* === Menu Hambúrguer === */
.nav-toggle { display:none; }
.nav-toggle-btn{
  display:none;width:42px;height:34px;align-items:center;justify-content:center;gap:5px;
  margin-left:12px;border-radius:10px;cursor:pointer
}
.nav-toggle-btn span{display:block;width:26px;height:3px;background:#f5f5f5;border-radius:2px;transition:all .25s ease}
@media (max-width:768px){
  header .nav{flex-wrap:wrap;height:auto;gap:10px;padding:10px 0}
  .nav-toggle-btn{display:flex;order:2}
  header nav{order:4;width:100%}
  header nav ul{display:none;flex-direction:column;gap:10px;width:100%;padding:10px 0 0;border-top:1px solid rgba(255,255,255,.15)}
  .nav-toggle:checked ~ nav ul{display:flex}
  .nav-toggle:checked + .nav-toggle-btn span:nth-child(1){transform:translateY(8px) rotate(45deg)}
  .nav-toggle:checked + .nav-toggle-btn span:nth-child(2){opacity:0}
  .nav-toggle:checked + .nav-toggle-btn span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
  header .cta{order:3;font-size:14px;padding:8px 12px;border-radius:999px;margin-left:auto}
  .brand{font-size:16px}
  .brand img{height:32px}
}
/* ===== Overflow + Mobile polish fixes ===== */

/* Nunca permitir scroll horizontal */
html, body { overflow-x: hidden; width: 100%; }
.container { max-width: 1180px; width: 100%; box-sizing: border-box; }

/* Impedir que algo extrapole a largura */
img, svg, video, iframe { max-width: 100%; height: auto; display: block; }

/* Padding menor no mobile */
@media (max-width: 768px){
  .container { padding: 0 16px; }
}

/* Menu mobile: largura e alinhamento corretos */
@media (max-width: 768px){
  header .nav { width: 100%; }
  header nav { width: 100%; }
  header nav ul {
    width: 100%;
    margin: 0;
  }
}

/* Grade de serviços: evitar min-width que estoura a tela */
@media (max-width: 480px){
  .svc-grid { grid-template-columns: 1fr !important; gap: 20px !important; }
}

/* Botões do hero podem quebrar linha sem estourar */
.hero .actions { flex-wrap: wrap; }
.hero .actions a { max-width: 100%; }

/* Mapa nunca deve ultrapassar a largura visível */
.map { width: 100% !important; display: block; }