/* Almeida Engenharia: concreto, preto de obra e amarelo de segurança. Tabelas e números. */
:root {
  --yellow: #ffc400;
  --black: #191919;
  --concrete: #e9e7e2;
  --line: #c9c6bd;
  --r: 0;
  --nav-bg: var(--black);
  --nav-ink: #fff;
}
body { font-family: Barlow, system-ui, sans-serif; font-size: 1.08rem; color: var(--black); background: var(--concrete); }
h1, h2, h3 { font-family: "Barlow Condensed", Barlow, sans-serif; font-weight: 700; line-height: 1.02; letter-spacing: -0.005em; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 9px; padding: 15px 24px; font: 700 1.05rem Barlow, sans-serif; text-decoration: none; border: 2px solid transparent; cursor: pointer; transition: transform .2s; }
.btn:hover { transform: translateY(-2px); }
.btn-y { background: var(--yellow); color: var(--black); }
.btn-wa { background: #1c9c52; color: #fff; }
.btn-line { border-color: #fff; color: #fff; }
.btn-dark { background: var(--black); color: #fff; }

.top { position: sticky; top: 0; z-index: 50; background: var(--black); color: #fff; }
.top .wrap { display: flex; align-items: center; justify-content: space-between; height: 66px; }
.logo { display: flex; align-items: center; gap: 12px; text-decoration: none; font: 700 1.45rem "Barlow Condensed", sans-serif; }
.logo i { font-style: normal; display: grid; place-items: center; width: 38px; height: 38px; background: var(--yellow); color: var(--black); font-size: 1.2rem; }
.links { display: flex; align-items: center; gap: 26px; }
.links a:not(.btn) { text-decoration: none; font-weight: 500; }
.links a:not(.btn):hover { color: var(--yellow); }
.links .btn { padding: 10px 18px; }

/* Capa dividida: painel preto + foto */
.hero { display: grid; grid-template-columns: 1fr 1fr; min-height: min(82vh, 680px); background: var(--black); color: #fff; }
.hero .copy { padding: 72px max(24px, calc((100vw - 1140px) / 2)) 72px max(24px, calc((100vw - 1140px) / 2)); display: flex; flex-direction: column; justify-content: center; }
.hero .copy > div { max-width: 540px; margin-left: auto; width: 100%; }
.hero h1 { font-size: clamp(3rem, 6.6vw, 5.4rem); }
.hero h1 mark { background: var(--yellow); color: var(--black); padding: 0 .12em; }
.hero p.lead { margin-top: 22px; font-size: 1.2rem; color: #d7d4cc; max-width: 36ch; }
.hero .acts { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.hero > img { width: 100%; height: 100%; object-fit: cover; min-height: 340px; }

.facts { background: var(--yellow); }
.facts .wrap { display: grid; grid-template-columns: repeat(3, 1fr); }
.facts div { padding: 20px 22px; border-right: 2px solid var(--black); font: 700 1.5rem "Barlow Condensed", sans-serif; line-height: 1.1; }
.facts div:first-child { padding-left: 0; }
.facts div:last-child { border: 0; }
.facts span { display: block; font: 500 .95rem Barlow, sans-serif; margin-top: 2px; }

/* Serviços em tabela */
.svc { padding: 88px 0 72px; }
.svc h2, .steps h2, .stages h2, .voices h2, .faq-sec h2, .contact h2 { font-size: clamp(2.4rem, 5vw, 3.8rem); }
.svc .intro { margin: 10px 0 30px; max-width: 56ch; color: #45433d; }
.tbl { width: 100%; border-collapse: collapse; background: #fff; }
.tbl th { text-align: left; background: var(--black); color: #fff; font: 600 .95rem Barlow, sans-serif; padding: 14px 18px; }
.tbl td { padding: 20px 18px; border-bottom: 1px solid var(--line); vertical-align: top; }
.tbl td:first-child { font: 700 1.5rem "Barlow Condensed", sans-serif; width: 28%; }
.tbl td:nth-child(2) { color: #3d3b36; }
.tbl td:last-child { width: 22%; font-weight: 600; }
.tbl tr:hover td { background: #fff8d6; }
.tbl-note { margin-top: 14px; font-size: .95rem; color: #45433d; }

/* Etapas */
.steps { background: #fff; padding: 80px 0; }
.steps ol { margin-top: 36px; display: grid; grid-template-columns: repeat(4, 1fr); counter-reset: s; border-top: 6px solid var(--black); }
.steps li { counter-increment: s; padding: 22px 22px 6px 0; }
.steps li::before { content: "0" counter(s); display: block; font: 700 3.6rem/1 "Barlow Condensed", sans-serif; color: var(--yellow); -webkit-text-stroke: 2px var(--black); margin-bottom: 10px; }
.steps h3 { font-size: 1.6rem; }
.steps p { margin-top: 8px; color: #45433d; max-width: 30ch; }

/* Fotos de etapas */
.stages { padding: 80px 0 40px; }
.stages .gal { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 10px; margin-top: 30px; }
.stages figure { position: relative; margin: 0; overflow: hidden; background: #333; }
.stages img { width: 100%; height: 340px; object-fit: cover; }
.stages figcaption { position: absolute; left: 0; bottom: 0; background: var(--black); color: #fff; padding: 8px 14px; font-weight: 600; }
.stages .gal figure:first-child img { height: 340px; }

.voices { padding: 56px 0 72px; }
.voices .cols { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 32px; margin-top: 28px; }
.voices blockquote { font: 600 1.55rem/1.2 "Barlow Condensed", sans-serif; border-top: 4px solid var(--yellow); padding-top: 14px; }
.voices .who { margin-top: 10px; color: #45433d; font-size: .95rem; }
.sample { margin-top: 22px; font-size: .85rem; color: #6a675f; }

.faq-sec { background: #fff; padding: 72px 0 80px; }
.faq { max-width: 800px; margin-top: 18px; border-top: 3px solid var(--black); }
.faq summary { font-family: "Barlow Condensed", sans-serif; font-size: 1.55rem; font-weight: 700; }

.contact { background: var(--black); color: #fff; padding: 84px 0; }
.contact .grid { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; }
.contact p.lead { margin-top: 12px; color: #d1cec6; max-width: 42ch; }
.contact dl { margin-top: 28px; display: grid; gap: 18px; }
.contact dt { font-weight: 700; color: var(--yellow); }
.contact dd { color: #d1cec6; }
.contact dd a { color: #fff; font-weight: 700; }
.contact form { background: var(--concrete); color: var(--black); padding: 28px; border-top: 8px solid var(--yellow); }
.contact form h3 { font-size: 2rem; margin-bottom: 16px; }
.contact form .btn { width: 100%; }
.foot { background: #0e0e0e; color: #bdbab1; padding: 34px 0 92px; font-size: .92rem; }

@media (max-width: 900px) {
  .hero { grid-template-columns: 1fr; }
  .hero > img { order: -1; min-height: 260px; max-height: 320px; }
  .hero .copy { padding: 48px 18px; }
  .hero .copy > div { margin: 0; }
  .facts .wrap { grid-template-columns: 1fr; }
  .facts div { border-right: 0; border-bottom: 2px solid var(--black); padding-left: 0; }
  .facts div:last-child { border: 0; }
  .tbl thead { display: none; }
  .tbl, .tbl tbody, .tbl tr, .tbl td { display: block; width: 100% !important; }
  .tbl tr { border-bottom: 1px solid var(--line); padding: 12px 0; }
  .tbl td { border: 0; padding: 4px 16px; }
  .steps ol { grid-template-columns: 1fr 1fr; }
  .stages .gal, .voices .cols, .contact .grid { grid-template-columns: 1fr; }
  .stages img { height: 240px; }
}
@media (max-width: 520px) { .steps ol { grid-template-columns: 1fr; } }
