/* Painel Wall Brasil Wall (brasil-wall.html, 18/10/2026). Revenda exclusiva com preço de fábrica.
   Cores do site (azul-marinho e amarelo) com o verde da Brasil Wall como destaque. */
.bw { --bw-verde: #138a3e; --bw-verde-esc: #0d6a2f; --bw-fundo: #F6F5F1; color: var(--navy); }
.bw h2 { font-family: var(--font-display); font-weight: 800; letter-spacing: -0.02em; font-size: clamp(1.6rem, 3.2vw, 2.4rem);
  line-height: 1.12; margin: 0 0 16px; color: var(--navy); }
.bw h3 { font-family: var(--font-display); font-weight: 800; font-size: 1.12rem; margin: 0 0 6px; color: var(--navy); }
.bw p { line-height: 1.6; color: #3d4559; }
.bw-sec { padding: clamp(48px, 7vw, 88px) 0; }
.bw-sec:nth-of-type(even) { background: var(--bw-fundo); }
.bw-kicker { font: 800 0.78rem var(--font-display); letter-spacing: 0.14em; text-transform: uppercase; color: var(--bw-verde) !important;
  margin: 0 0 8px; }
.bw-duas { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 64px); align-items: center; }
.bw-duas-topo { align-items: start; }
.bw-nota { font-size: 0.88rem; color: #6b7285 !important; margin-top: 12px; }
.bw-nota a { color: var(--navy); font-weight: 700; }
.bw-link { display: inline-block; margin-top: 8px; color: var(--navy); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }

/* abertura */
.bw-hero { position: relative; color: #fff; padding: clamp(28px, 5vw, 56px) 0 0; overflow: hidden;
  background-color: #0f1622; background-position: center; background-size: cover; background-repeat: no-repeat; }
.bw-hero::before { content: ""; position: absolute; inset: 0;
  background: linear-gradient(100deg, rgba(5, 40, 22, 0.95) 0%, rgba(7, 52, 29, 0.84) 48%, rgba(10, 30, 22, 0.4) 100%); }
.bw-hero > * { position: relative; }
.bw-hero .breadcrumb { color: rgba(255, 255, 255, 0.7); font-size: 0.86rem; margin-bottom: 18px; }
.bw-hero .breadcrumb a { color: inherit; }
.bw-hero-in { max-width: 1180px; }
.bw-selos { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.bw-selo { display: inline-flex; align-items: center; gap: 7px; padding: 7px 12px; border-radius: 999px; font: 800 0.8rem var(--font-display);
  letter-spacing: 0.02em; background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.22); color: #fff; }
.bw-selo:first-child { background: var(--bw-verde); border-color: var(--bw-verde); }
.bw-selo:nth-child(2) { background: var(--yellow); border-color: var(--yellow); color: var(--navy); }
.bw-selo svg { width: 16px; height: 16px; }
.bw-logo { display: block; width: 200px; height: auto; background: #fff; border-radius: 6px; padding: 6px 8px; margin-bottom: 18px; }
.bw-hero h1 { font-family: var(--font-display); font-weight: 900; letter-spacing: -0.025em; font-size: clamp(2rem, 5vw, 3.6rem);
  line-height: 1.04; max-width: 17ch; margin: 0 0 16px; color: #fff; }
.bw-lead { max-width: 58ch; font-size: clamp(1rem, 1.6vw, 1.18rem); color: rgba(255, 255, 255, 0.86) !important; margin: 0 0 24px; }
.bw-acoes { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; margin-bottom: clamp(32px, 5vw, 56px); }
.bw-link-claro { color: #fff; font-weight: 700; text-decoration: underline; text-underline-offset: 4px; }
.bw-numeros { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; background: rgba(255, 255, 255, 0.14);
  border-top: 1px solid rgba(255, 255, 255, 0.14); }
.bw-num { background: rgba(4, 30, 17, 0.72); padding: 18px 16px 22px; }
.bw-num b { display: block; font: 900 clamp(1.4rem, 2.6vw, 2rem) var(--font-display); color: var(--yellow); letter-spacing: -0.02em; }
.bw-num span { font-size: 0.86rem; color: rgba(255, 255, 255, 0.78); line-height: 1.4; }

/* revenda exclusiva */
.bw-exclusiva { background: #fff !important; }
.bw-tres { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 10px; }
.bw-tres > div { border: 1px solid var(--border); border-top: 4px solid var(--bw-verde); border-radius: 10px; padding: 22px 20px; background: #fff; }
.bw-tres svg { width: 30px; height: 30px; color: var(--bw-verde); margin-bottom: 10px; }

/* o que é */
.bw-painel { margin: 0; }
.bw-painel img { width: 100%; height: auto; display: block; filter: drop-shadow(0 24px 30px rgba(20, 30, 50, 0.18)); }
.bw-check { list-style: none; padding: 0; margin: 14px 0 0; display: grid; gap: 9px; }
.bw-check li { position: relative; padding-left: 28px; line-height: 1.5; color: #3d4559; }
.bw-check li::before { content: ""; position: absolute; left: 0; top: 4px; width: 17px; height: 17px; border-radius: 50%;
  background: var(--bw-verde) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.2 4.2L19 7'/%3E%3C/svg%3E") center / 11px no-repeat; }

/* onde usar */
.bw-aplic { list-style: none; padding: 0; margin: 8px 0 28px; display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; }
.bw-aplic li { display: flex; gap: 12px; align-items: flex-start; background: #fff; border: 1px solid var(--border); border-radius: 10px; padding: 14px; }
.bw-aplic svg { flex: none; width: 26px; height: 26px; color: var(--bw-verde); }
.bw-aplic b { display: block; font-family: var(--font-display); margin-bottom: 2px; }
.bw-aplic span { font-size: 0.88rem; color: #4a5266; line-height: 1.45; }
.bw-fotos-uso { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 12px; }
.bw-fotos-uso figure, .bw-obra { margin: 0; position: relative; overflow: hidden; border-radius: 10px; background: #1b1f2a; }
.bw-fotos-uso img { width: 100%; height: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; }
.bw-fotos-uso figcaption, .bw-obra figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 22px 12px 10px; color: #fff;
  font: 700 0.84rem var(--font-display); background: linear-gradient(transparent, rgba(0, 0, 0, 0.7)); }

/* obras */
.bw-galeria { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: 210px; gap: 12px; }
.bw-obra img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.6s ease; }
.bw-obra:hover img { transform: scale(1.04); }
.bw-obra-grande { grid-column: span 2; grid-row: span 2; }
.bw-fonte { font-size: 0.8rem; color: #8a8f9c !important; margin-top: 8px; }

/* medidas */
.bw-tabela-caixa { overflow-x: auto; border: 1px solid var(--border); border-radius: 10px; background: #fff; }
.bw-tabela { width: 100%; border-collapse: collapse; font-size: 0.95rem; min-width: 560px; }
.bw-tabela th { background: var(--bw-verde); color: #fff; text-align: left; font: 800 0.8rem var(--font-display); letter-spacing: 0.04em;
  text-transform: uppercase; padding: 12px 14px; }
.bw-tabela td { padding: 11px 14px; border-top: 1px solid #eceae4; }
.bw-tabela tbody tr:nth-child(odd) td { background: #fbfbf9; }
.bw-escolha { margin-top: 22px; padding: 20px 22px; border-radius: 10px; background: #fff; border-left: 5px solid var(--yellow);
  box-shadow: var(--shadow); max-width: 820px; }
.bw-escolha p { margin: 0; }

/* desempenho */
.bw-desemp { list-style: none; padding: 0; margin: 6px 0 30px; display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 10px; }
.bw-desemp li { display: flex; gap: 12px; align-items: center; background: #fff; border: 1px solid var(--border); border-radius: 10px; padding: 14px 16px; }
.bw-desemp svg { flex: none; width: 26px; height: 26px; color: var(--bw-verde); }
.bw-desemp span { display: block; font-size: 0.8rem; color: #6b7285; }
.bw-desemp b { font-family: var(--font-display); font-size: 0.98rem; }
.bw-acustica { background: #fff; border: 1px solid var(--border); border-radius: 10px; padding: 20px 22px; }
.bw-acu { display: flex; align-items: flex-end; gap: 4px; height: 170px; margin-top: 12px; padding-top: 18px; }
.bw-acu-barra { flex: 1; position: relative; height: calc(var(--v) * 100%); min-height: 6px; border-radius: 4px 4px 0 0;
  background: linear-gradient(180deg, var(--bw-verde), var(--bw-verde-esc)); }
.bw-acu-barra span { position: absolute; top: -18px; left: 50%; transform: translateX(-50%); font: 700 0.68rem var(--font-display); color: var(--navy); }
.bw-acu-barra i { position: absolute; bottom: -18px; left: 50%; transform: translateX(-50%); font: 600 0.6rem var(--font-text); font-style: normal;
  color: #8a8f9c; white-space: nowrap; }
.bw-acu-eixo { margin: 26px 0 0; font-size: 0.8rem; color: #8a8f9c !important; }

/* instalação */
.bw-passos { list-style: none; padding: 0; margin: 10px 0 0; display: grid; gap: 14px; counter-reset: p; }
.bw-passo { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; background: #fff; border: 1px solid var(--border);
  border-radius: 12px; padding: 20px 22px; }
.bw-passo:has(.bw-desenho) { grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); align-items: center; }
.bw-passo-n { display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--navy); color: var(--yellow);
  font: 900 1rem var(--font-display); margin-bottom: 10px; }
.bw-passo p { margin: 0; }
.bw-desenho { margin: 0; background: #fff; border: 1px solid #eceae4; border-radius: 10px; padding: 10px; }
.bw-desenho img { width: 100%; height: auto; display: block; }
.bw-desenho-p { max-width: 380px; justify-self: center; }

/* acabamentos */
.bw-acabs { display: grid; gap: 10px; }
.bw-acab { background: #fff; border: 1px solid var(--border); border-radius: 10px; padding: 0 18px; }
.bw-acab summary { cursor: pointer; list-style: none; padding: 16px 0; display: grid; gap: 2px; position: relative; padding-right: 28px; }
.bw-acab summary::-webkit-details-marker { display: none; }
.bw-acab summary::after { content: "+"; position: absolute; right: 0; top: 14px; font: 800 1.3rem var(--font-display); color: var(--bw-verde); }
.bw-acab[open] summary::after { content: "–"; }
.bw-acab summary b { font-family: var(--font-display); font-size: 1.02rem; }
.bw-acab summary span { font-size: 0.86rem; color: #6b7285; }
.bw-acab p { margin: 0 0 14px; }
.bw-acab .bw-link { margin: -6px 0 16px; }

/* divisórias */
.bw-perfis-tit { margin: 16px 0 6px; font-weight: 700; }
.bw-perfis { list-style: none; padding: 0; margin: 0 0 14px; display: flex; flex-wrap: wrap; gap: 6px; }
.bw-perfis li { padding: 6px 10px; border-radius: 999px; background: #fff; border: 1px solid var(--border); font: 600 0.84rem var(--font-display); }

/* calculadora */
.bw-calculo { background: var(--navy) !important; }
.bw-calculo h2, .bw-calculo .bw-calc, .bw-calculo legend { color: #fff; }
.bw-calculo .bw-kicker { color: var(--yellow) !important; }
.bw-calculo .bw-nota { color: rgba(255, 255, 255, 0.66) !important; }
.bw-calc { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; align-items: end; margin-top: 8px; }
.bw-calc > label { display: grid; gap: 6px; font: 700 0.86rem var(--font-display); }
.bw-calc input[type="number"], .bw-calc input[inputmode="decimal"] { padding: 12px 14px; border-radius: 8px; border: 0; font: 700 1.05rem var(--font-display); color: var(--navy); width: 100%; }
.bw-calc fieldset { border: 0; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.bw-calc legend { font: 700 0.86rem var(--font-display); margin-bottom: 6px; width: 100%; }
.bw-calc fieldset label { cursor: pointer; }
.bw-calc fieldset input { position: absolute; opacity: 0; pointer-events: none; }
.bw-calc fieldset label { padding: 9px 12px; border-radius: 8px; border: 1.5px solid rgba(255, 255, 255, 0.3); color: #fff; font: 700 0.9rem var(--font-display); }
.bw-calc fieldset label:has(input:checked) { background: var(--yellow); border-color: var(--yellow); color: var(--navy); }
.bw-calc fieldset label:has(input:focus-visible) { outline: 2px solid #fff; outline-offset: 2px; }
.bw-resultado { margin-top: 22px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)) auto; gap: 12px; align-items: stretch; }
.bw-res { background: rgba(255, 255, 255, 0.08); border: 1px solid rgba(255, 255, 255, 0.16); border-radius: 10px; padding: 14px 16px; color: #fff; }
.bw-res b { display: block; font: 900 1.6rem var(--font-display); color: var(--yellow); }
.bw-res span { font-size: 0.84rem; color: rgba(255, 255, 255, 0.78); }
.bw-resultado .btn { align-self: center; white-space: nowrap; }

/* perguntas */
.bw-faq-lista { display: grid; gap: 10px; max-width: 900px; }
.bw-faq-item { background: #fff; border: 1px solid var(--border); border-radius: 10px; padding: 0 18px; }
.bw-faq-item summary { cursor: pointer; list-style: none; padding: 16px 28px 16px 0; font: 700 1rem var(--font-display); position: relative; }
.bw-faq-item summary::-webkit-details-marker { display: none; }
.bw-faq-item summary::after { content: "+"; position: absolute; right: 0; top: 13px; font: 800 1.3rem var(--font-display); color: var(--bw-verde); }
.bw-faq-item[open] summary::after { content: "–"; }
.bw-faq-item p { margin: 0 0 16px; }

/* fim */
.bw-final { background: var(--bw-verde); color: #fff; padding: 40px 0; }
.bw-final-in { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 24px; align-items: center; }
.bw-final img { width: 180px; height: auto; background: #fff; border-radius: 6px; padding: 6px 8px; }
.bw-final h2 { color: #fff; font-size: clamp(1.3rem, 2.4vw, 1.8rem); margin-bottom: 6px; }
.bw-final p { color: rgba(255, 255, 255, 0.9); margin: 0; }
.bw-final-acoes { display: grid; gap: 10px; justify-items: start; }

/* 2ª versão (18/10/2026): obra a seco, sustentabilidade, números com fonte */
.bw-ref { font: 700 0.72em var(--font-text); color: var(--bw-verde); text-decoration: none; vertical-align: super; line-height: 0;
  margin-left: 1px; }
.bw-ref:hover { text-decoration: underline; }
.bw-atalhos { background: #fff; border-bottom: 1px solid var(--border); position: relative; z-index: 2; }
.bw-atalhos .container { display: flex; gap: 6px; overflow-x: auto; padding-top: 10px; padding-bottom: 10px; scrollbar-width: none; }
.bw-atalhos .container::-webkit-scrollbar { display: none; }
.bw-atalhos a { flex: none; padding: 8px 14px; border-radius: 999px; border: 1.5px solid #d6e9dc; color: var(--bw-verde-esc);
  font: 700 0.86rem var(--font-display); white-space: nowrap; transition: background 0.15s, color 0.15s, border-color 0.15s; }
.bw-atalhos a:hover { background: var(--bw-verde); border-color: var(--bw-verde); color: #fff; }

/* novo conceito: laje de concreto x obra a seco */
.bw-conceito { background: #fff !important; }
.bw-conceito-in { margin-bottom: 26px; }
.bw-conceito-in .bw-painel { max-width: 460px; justify-self: center; }
.bw-compara { width: 100%; border-collapse: collapse; min-width: 640px; font-size: 0.95rem; }
.bw-compara th, .bw-compara td { padding: 14px 16px; text-align: left; vertical-align: top; border-top: 1px solid #eceae4; line-height: 1.5; }
.bw-compara thead th { border-top: 0; font: 800 0.8rem var(--font-display); letter-spacing: 0.04em; text-transform: uppercase; }
.bw-compara thead th:nth-child(2) { background: #eceae4; color: #4a5266; }
.bw-compara thead th:nth-child(3) { background: var(--bw-verde); color: #fff; }
.bw-compara tbody th { width: 22%; font: 800 0.95rem var(--font-display); color: var(--navy); }
.bw-compara tbody th svg { width: 20px; height: 20px; color: var(--bw-verde); vertical-align: -4px; margin-right: 8px; }
.bw-compara tbody td:nth-child(2) { color: #6b7285; }
.bw-compara tbody td:nth-child(3) { background: #f1f8f3; color: #173b26; font-weight: 600; }

/* o mundo já constrói assim */
.bw-mundo-grade { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-top: 8px; }
.bw-mundo-grade-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.bw-mundo-card { background: #fff; border: 1px solid var(--border); border-radius: 12px; padding: 20px 18px; }
.bw-mundo-card b { display: block; font: 900 clamp(1.9rem, 3.4vw, 2.6rem) var(--font-display); letter-spacing: -0.03em; color: var(--bw-verde);
  line-height: 1; margin-bottom: 10px; }
.bw-mundo-card p { margin: 0; font-size: 0.92rem; }
.bw-mundo-br { border-top: 4px solid var(--yellow); }
.bw-mundo-br b { color: var(--navy); }
.bw-mundo-tit { margin: 34px 0 4px !important; font-size: 1.25rem !important; }
.bw-mundo-fecho { margin: 22px 0 0; font: 700 1.08rem var(--font-display); color: var(--navy) !important; max-width: 60ch; }

/* sustentável */
.bw-sustenta { background: linear-gradient(160deg, #0d4f2a 0%, #0b3d21 100%) !important; color: #fff; }
.bw-sustenta h2, .bw-sustenta h3 { color: #fff; }
.bw-sustenta .bw-kicker { color: #9be3b0 !important; }
.bw-sustenta p { color: rgba(255, 255, 255, 0.84); }
.bw-sustenta .bw-ref { color: #9be3b0; }
.bw-sustenta-lista { list-style: none; padding: 0; margin: 10px 0 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; }
.bw-sustenta-lista li { display: flex; gap: 14px; align-items: flex-start; padding: 20px 18px; border-radius: 12px;
  background: rgba(255, 255, 255, 0.07); border: 1px solid rgba(255, 255, 255, 0.14); }
.bw-sustenta-lista svg { flex: none; width: 32px; height: 32px; color: #9be3b0; }
.bw-sustenta-lista p { margin: 0; font-size: 0.93rem; }

/* mezanino, laudos, fábrica, referências */
.bw-mezanino { margin-top: 22px; max-width: none; border-left-color: var(--bw-verde); }
.bw-laudos-tit { margin: 30px 0 10px !important; }
.bw-laudos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.bw-laudo { display: flex; gap: 12px; align-items: flex-start; background: #fff; border: 1px solid var(--border); border-radius: 10px;
  padding: 16px; color: var(--navy); transition: border-color 0.15s, box-shadow 0.15s; }
.bw-laudo:hover { border-color: var(--bw-verde); box-shadow: var(--shadow); }
.bw-laudo svg { flex: none; width: 26px; height: 26px; color: var(--bw-verde); }
.bw-laudo b { display: block; font-family: var(--font-display); margin-bottom: 3px; }
.bw-laudo span { font-size: 0.86rem; color: #4a5266; line-height: 1.45; }
.bw-fabrica-logo { width: 180px; height: auto; margin-top: 10px; }
.bw-compensados { background: #fff; border: 1px solid var(--border); border-radius: 12px; padding: 22px; }
.bw-compensados .bw-check { margin-bottom: 4px; }
.bw-refs { padding-top: 40px !important; padding-bottom: 40px !important; }
.bw-refs h2 { font-size: 1.3rem !important; }
.bw-refs-lista { margin: 0; padding-left: 22px; display: grid; gap: 6px; font-size: 0.86rem; color: #4a5266; }
.bw-refs-lista li { line-height: 1.5; scroll-margin-top: 120px; }
.bw-refs-lista li:target { background: #eaf6ee; border-radius: 4px; }
.bw-refs-lista a { color: var(--bw-verde-esc); font-weight: 700; word-break: break-word; }
.bw-final { background: linear-gradient(120deg, var(--bw-verde) 0%, var(--bw-verde-esc) 100%); }

@media (max-width: 960px) {
  .bw-mundo-grade, .bw-mundo-grade-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bw-laudos { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 560px) {
  .bw-mundo-grade, .bw-mundo-grade-3 { grid-template-columns: minmax(0, 1fr); }
  .bw-sustenta-lista { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 960px) {
  .bw-numeros { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bw-tres, .bw-duas { grid-template-columns: minmax(0, 1fr); }
  .bw-passo:has(.bw-desenho) { grid-template-columns: minmax(0, 1fr); }
  .bw-galeria { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 160px; }
  .bw-fotos-uso { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .bw-fotos-uso figure:first-child { grid-column: span 2; }
  .bw-calc { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .bw-calc fieldset { grid-column: span 2; }
  .bw-resultado { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .bw-resultado .btn { grid-column: span 2; justify-self: start; }
  .bw-final-in { grid-template-columns: minmax(0, 1fr); }
}

/* acertos da conferência (18/10/2026) */
.bw-duas > div > p + p, .bw-conceito-in p + p { margin-top: 12px; }
.bw-conceito-in .bw-painel { max-width: 360px; }
.bw-mundo { background: var(--bw-fundo) !important; }
.bw-sustenta-lista { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.bw-sustenta-lista li:last-child { grid-column: 1 / -1; }
@media (max-width: 960px) { .bw-sustenta-lista { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .bw-sustenta-lista { grid-template-columns: minmax(0, 1fr); } }
.bw-foto-oque img { aspect-ratio: 4 / 3; object-fit: cover; border-radius: 12px; filter: none; box-shadow: 0 18px 40px rgba(20, 30, 50, 0.18); }