:root{
    --grafite: #17140F;
    --grafite-2: #221E17;
    --concreto: #E6E1D6;
    --concreto-2: #D8D2C3;
    --aco: #6E6A5E;
    --amarelo: #F5B700;
    --amarelo-escuro: #C99200;
    --texto-claro: #F6F3EA;
    --texto-escuro: #17140F;
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{
    font-family:'Barlow', sans-serif;
    background:var(--concreto);
    color:var(--texto-escuro);
    line-height:1.5;
    -webkit-font-smoothing:antialiased;
  }
  h1,h2,h3{font-family:'Archivo Black', sans-serif; line-height:1.05; letter-spacing:-0.01em;}
  .mono{font-family:'IBM Plex Mono', monospace; letter-spacing:0.04em;}
  a{color:inherit; text-decoration:none;}
  img{max-width:100%; display:block;}
  .wrap{max-width:1160px; margin:0 auto; padding:0 24px;}

  /* ===== Rivet plate signature element ===== */
  .plate{
    position:relative;
    background:var(--grafite);
    color:var(--texto-claro);
    border:1px solid #3a3527;
    padding:28px;
  }
  .plate::before,.plate::after,
  .plate .rivet-tl,.plate .rivet-br{
    content:"";
    position:absolute;
    width:10px; height:10px;
    border-radius:50%;
    background:radial-gradient(circle at 35% 35%, #d9d2b8, #8a8467 60%, #55503e);
    box-shadow: inset 0 0 0 1px rgba(0,0,0,0.4);
  }
  .plate::before{ top:10px; left:10px; }
  .plate::after{ bottom:10px; right:10px; }
  .plate .rivet-tl{ top:10px; right:10px; }
  .plate .rivet-br{ bottom:10px; left:10px; }
  .plate-label{
    font-family:'IBM Plex Mono', monospace;
    font-size:11px;
    letter-spacing:0.12em;
    text-transform:uppercase;
    color:var(--amarelo);
    display:block;
    margin-bottom:10px;
  }

  /* ===== Header ===== */
  header{
    position:sticky; top:0; z-index:50;
    background:var(--grafite);
    border-bottom:3px solid var(--amarelo);
  }
  header .wrap{
    display:flex; align-items:center; justify-content:space-between;
    padding:16px 24px;
  }
  .logo{
    font-family:'Archivo Black', sans-serif;
    color:var(--texto-claro);
    font-size:18px;
    letter-spacing:0.02em;
  }
  .logo span{color:var(--amarelo);}
  nav{display:flex; gap:28px;}
  nav a{
    color:#C9C4B4; font-size:14px; font-weight:600;
    text-transform:uppercase; letter-spacing:0.05em;
  }
  nav a:hover{color:var(--amarelo);}
  .btn-wpp{
    background:var(--amarelo);
    color:var(--texto-escuro);
    font-weight:700;
    padding:11px 20px;
    font-size:14px;
    text-transform:uppercase;
    letter-spacing:0.03em;
    border:2px solid var(--amarelo);
    transition:background .15s, color .15s;
    white-space:nowrap;
    display:inline-flex;
    align-items:center;
    gap:8px;
  }
  .wpp-icon{flex-shrink:0; display:inline-block;}
  .btn-wpp:hover{background:transparent; color:var(--amarelo);}
  .nav-toggle{display:none;}

  /* ===== Hero ===== */
  .hero{
    background:var(--grafite);
    color:var(--texto-claro);
    padding:72px 0 90px;
    position:relative;
    overflow:hidden;
    background-image:
      repeating-linear-gradient(135deg, rgba(245,183,0,0.045) 0px, rgba(245,183,0,0.045) 2px, transparent 2px, transparent 22px);
  }
  .hero-grid{
    display:grid;
    grid-template-columns: 1.15fr 0.85fr;
    gap:48px;
    align-items:start;
  }
  .eyebrow{
    font-family:'IBM Plex Mono', monospace;
    color:var(--amarelo);
    font-size:13px;
    letter-spacing:0.14em;
    text-transform:uppercase;
    display:flex; align-items:center; gap:10px;
    margin-bottom:18px;
  }
  .eyebrow::before{content:""; width:26px; height:2px; background:var(--amarelo); display:inline-block;}
  .hero h1{
    font-size:clamp(34px, 5vw, 54px);
    margin-bottom:20px;
  }
  .hero h1 em{font-style:normal; color:var(--amarelo);}
  .hero p.lead{
    font-size:18px;
    color:#D6D1C2;
    max-width:46ch;
    margin-bottom:32px;
  }
  .hero-ctas{display:flex; gap:14px; flex-wrap:wrap;}
  .btn-primary{
    background:var(--amarelo);
    color:var(--texto-escuro);
    font-weight:700;
    padding:16px 26px;
    font-size:15px;
    text-transform:uppercase;
    letter-spacing:0.03em;
    display:inline-flex; align-items:center; gap:10px;
    border:2px solid var(--amarelo);
    transition:transform .12s;
  }
  .btn-primary:hover{transform:translateY(-2px);}
  .btn-secondary{
    color:var(--texto-claro);
    border:2px solid #4c4736;
    padding:16px 26px;
    font-size:15px;
    text-transform:uppercase;
    letter-spacing:0.03em;
    font-weight:600;
  }
  .btn-secondary:hover{border-color:var(--amarelo); color:var(--amarelo);}

  .spec-plate{margin-top:4px;}
  .spec-plate h3{font-size:20px; margin-bottom:18px; color:var(--texto-claro);}
  .spec-row{
    display:flex; justify-content:space-between;
    padding:11px 0;
    border-top:1px solid #332e21;
    font-size:14px;
  }
  .spec-row:first-of-type{border-top:1px solid #332e21;}
  .spec-row span:first-child{color:#9C977F;}
  .spec-row span:last-child{font-family:'IBM Plex Mono', monospace; color:var(--texto-claro); font-weight:600;}

  /* ===== Trust bar ===== */
  .trust{
    background:var(--amarelo);
    padding:16px 0;
  }
  .trust .wrap{
    display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px 32px;
  }
  .trust-item{
    font-family:'IBM Plex Mono', monospace;
    font-size:13px;
    font-weight:600;
    letter-spacing:0.03em;
    color:var(--texto-escuro);
    display:flex; align-items:center; gap:8px;
  }
  .trust-item::before{content:"■"; font-size:9px;}

  /* ===== Section shell ===== */
  section{padding:88px 0;}
  .section-head{
    max-width:640px;
    margin-bottom:52px;
  }
  .section-head .plate-label{color:var(--amarelo-escuro);}
  .section-head h2{font-size:clamp(26px,3.4vw,38px); color:var(--texto-escuro);}
  .section-head p{color:var(--aco); font-size:16px; margin-top:14px;}

  /* ===== Pillars ===== */
  .pillars{background:var(--concreto);}
  .pillars-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:2px;
    background:#3a3527;
  }
  .pillar{
    background:var(--grafite);
    color:var(--texto-claro);
    padding:36px 30px;
  }
  .pillar .num{
    font-family:'IBM Plex Mono', monospace;
    color:var(--amarelo);
    font-size:13px;
    display:block;
    margin-bottom:16px;
  }
  .pillar h3{font-size:21px; margin-bottom:12px; font-family:'Barlow', sans-serif; font-weight:700;}
  .pillar p{color:#C9C4B4; font-size:15px;}

  /* ===== Services ===== */
  .services{background:var(--concreto-2);}
  .service-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:22px;
  }
  .service-card{
    background:var(--texto-claro);
    border:1px solid #c7c1af;
    padding:30px;
    display:flex; flex-direction:column; gap:14px;
    transition:border-color .15s;
  }
  .service-card:hover{border-color:var(--amarelo-escuro);}
  .service-card .tag{
    font-family:'IBM Plex Mono', monospace;
    font-size:11px; color:var(--amarelo-escuro);
    text-transform:uppercase; letter-spacing:0.08em;
  }
  .service-card h3{font-family:'Barlow', sans-serif; font-weight:700; font-size:20px;}
  .service-card p{color:var(--aco); font-size:14.5px; flex:1;}
  .service-card .link{
    font-size:13px; font-weight:700; text-transform:uppercase;
    letter-spacing:0.03em; color:var(--texto-escuro);
    border-top:1px solid #d9d3c2; padding-top:14px;
    display:flex; justify-content:space-between; align-items:center;
  }
  .service-card:hover .link{color:var(--amarelo-escuro);}

  /* ===== About ===== */
  .about{background:var(--concreto);}
  .about-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:56px;
    align-items:center;
  }
  .about h2{font-size:clamp(26px,3.4vw,36px); margin-bottom:20px;}
  .about p{color:var(--aco); font-size:16px; margin-bottom:16px; max-width:52ch;}
  .about-plate .spec-row span:first-child{color:#9C977F;}

  /* ===== Coverage ===== */
  .coverage{background:var(--grafite); color:var(--texto-claro);}
  .coverage .section-head p{color:#B7B29E;}
  .coverage .section-head h2{color:var(--texto-claro);}
  .city-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:2px;
    background:#3a3527;
  }
  .city{
    background:var(--grafite-2);
    padding:20px 22px;
    font-family:'IBM Plex Mono', monospace;
    font-size:14px;
    display:flex; align-items:center; gap:10px;
  }
  .city::before{content:"›"; color:var(--amarelo);}
  .coverage-note{margin-top:22px; font-size:13px; color:#8f8a76; font-family:'IBM Plex Mono', monospace;}

  /* ===== Final CTA ===== */
  .cta-final{
    background:var(--amarelo);
    text-align:center;
    padding:80px 0;
  }
  .cta-final h2{font-size:clamp(28px,4vw,42px); color:var(--texto-escuro); margin-bottom:16px;}
  .cta-final p{color:#4a3c00; font-size:17px; margin-bottom:32px; max-width:52ch; margin-left:auto; margin-right:auto;}
  .cta-final .btn-primary{background:var(--texto-escuro); color:var(--texto-claro); border-color:var(--texto-escuro);}
  .cta-final .btn-primary:hover{background:transparent; color:var(--texto-escuro);}

  /* ===== Footer ===== */
  footer{background:var(--grafite); color:#9C977F; padding:44px 0 28px; font-size:13.5px;}
  .footer-grid{display:flex; justify-content:space-between; flex-wrap:wrap; gap:24px; margin-bottom:28px;}
  footer h4{color:var(--texto-claro); font-family:'Barlow',sans-serif; font-size:14px; text-transform:uppercase; letter-spacing:0.05em; margin-bottom:12px;}
  footer .foot-bottom{border-top:1px solid #332e21; padding-top:20px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;}

  /* ===== Floating WhatsApp ===== */
  .float-wpp{
    position:fixed; bottom:22px; right:22px; z-index:60;
    background:var(--amarelo); color:var(--texto-escuro);
    padding:14px 20px;
    font-weight:700; font-size:14px;
    display:flex; align-items:center; gap:10px;
    box-shadow:0 8px 24px rgba(0,0,0,0.35);
    border:2px solid var(--texto-escuro);
  }

  @media (max-width: 880px){
    .hero-grid{grid-template-columns:1fr;}
    .pillars-grid, .service-grid{grid-template-columns:1fr;}
    .about-grid{grid-template-columns:1fr;}
    .city-grid{grid-template-columns:repeat(2,1fr);}
    nav{display:none;}
    .float-wpp span.txt{display:none;}
  }

  :focus-visible{outline:3px solid var(--amarelo); outline-offset:2px;}
  @media (prefers-reduced-motion: reduce){
    html{scroll-behavior:auto;}
    .btn-primary:hover{transform:none;}
  }

/* ===== Internal / service pages ===== */
.breadcrumb{
  font-family:'IBM Plex Mono', monospace;
  font-size:12px;
  color:#9C977F;
  padding:16px 0;
  display:flex; gap:8px; flex-wrap:wrap;
}
.breadcrumb a{color:#C9C4B4;}
.breadcrumb a:hover{color:var(--amarelo);}
.breadcrumb span.sep{color:#5c5844;}

.page-hero{
  background:var(--grafite);
  color:var(--texto-claro);
  padding:36px 0 64px;
  background-image:
    repeating-linear-gradient(135deg, rgba(245,183,0,0.045) 0px, rgba(245,183,0,0.045) 2px, transparent 2px, transparent 22px);
}
.page-hero h1{font-size:clamp(30px,4.4vw,46px); max-width:18ch; margin-bottom:16px;}
.page-hero p.lead{font-size:17px; color:#D6D1C2; max-width:56ch;}

.content-grid{
  display:grid;
  grid-template-columns: 1.5fr 1fr;
  gap:56px;
  align-items:start;
}
.prose h2{font-size:24px; margin:0 0 14px; color:var(--texto-escuro);}
.prose h2:not(:first-child){margin-top:40px;}
.prose p{color:var(--aco); font-size:16px; margin-bottom:14px; max-width:62ch;}
.prose ul{margin:0 0 16px 20px; color:var(--aco); font-size:16px;}
.prose ul li{margin-bottom:8px;}
.prose strong{color:var(--texto-escuro);}

.sidebar-card{
  background:var(--texto-claro);
  border:1px solid #c7c1af;
  padding:26px;
  margin-bottom:20px;
}
.sidebar-card h3{font-family:'Barlow',sans-serif; font-weight:700; font-size:17px; margin-bottom:14px;}
.sidebar-card ul{list-style:none; font-size:14px; color:var(--aco);}
.sidebar-card ul li{padding:8px 0; border-top:1px solid #e4dfd0;}
.sidebar-card ul li:first-child{border-top:none;}
.sidebar-card ul li a:hover{color:var(--amarelo-escuro);}

.faq-item{border-top:1px solid #d9d3c2; padding:20px 0;}
.faq-item:last-child{border-bottom:1px solid #d9d3c2;}
.faq-item h3{font-family:'Barlow',sans-serif; font-weight:700; font-size:16.5px; margin-bottom:8px; color:var(--texto-escuro);}
.faq-item p{color:var(--aco); font-size:15px; max-width:62ch;}

.related-cities{
  display:flex; flex-wrap:wrap; gap:10px;
}
.related-cities a{
  font-family:'IBM Plex Mono', monospace; font-size:12.5px;
  background:var(--concreto-2); padding:9px 14px;
  border:1px solid #c7c1af;
}
.related-cities a:hover{border-color:var(--amarelo-escuro); color:var(--amarelo-escuro);}

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