/* Página inicial — capa + capítulos do catálogo */

/* ── Capa (PDF p.1) ── */
.capa { display: grid; grid-template-columns: minmax(400px, 38%) 1fr; min-height: calc(100svh - var(--header-h)); background: var(--petroleo); color: var(--areia); }
.capa__texto { display: flex; flex-direction: column; justify-content: center; padding: clamp(48px, 7vh, 96px) var(--margem); }
.capa h1 { display: flex; flex-direction: column; }
.capa__marca { display: inline-flex; flex-direction: column; line-height: 1; letter-spacing: 0; margin-bottom: clamp(36px, 7vh, 72px); }
.capa__marca b { font-size: clamp(1.625rem, 2.2vw, 2.125rem); }
.capa__marca span { margin-top: 12px; font-size: .9375rem; font-weight: 700; letter-spacing: .42em; color: var(--cobre); }
.capa__titulo { font-size: clamp(2.75rem, 4.9vw, 5rem); line-height: .98; text-transform: uppercase; letter-spacing: -0.015em; max-width: 9.5ch; }
.capa__sub { margin-top: 32px; font-size: clamp(1.1875rem, 1.5vw, 1.5rem); line-height: 1.5; max-width: 30ch; color: #e3e0d8; }
.capa__acoes { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 36px; }
.capa .rotulo, .contato .rotulo { color: var(--cobre); }
.capa__linha { margin-top: clamp(40px, 7vh, 72px); padding-top: 18px; border-top: 3px solid var(--cobre); font-size: .9375rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.capa__foto { position: relative; overflow: hidden; }
.capa__foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; animation: respira 22s ease-in-out infinite alternate; }
@keyframes respira { from { transform: scale(1); } to { transform: scale(1.06); } }
@media (max-width: 900px) {
  .capa { grid-template-columns: 1fr; min-height: 0; }
  .capa__foto { order: -1; aspect-ratio: 4 / 3; }
  .capa__texto { padding-block: 40px 56px; }
  .capa__acoes .btn { flex: 1 1 100%; }
}

/* ── Da fabricação ao ambiente completo (PDF p.2) ── */
.fab__titulo { display: flex; justify-content: space-between; align-items: baseline; gap: 24px; flex-wrap: wrap; }
.fab__titulo h2 { font-size: var(--t-h2); }
.fab__grade { display: grid; grid-template-columns: 1fr minmax(260px, .8fr) 1.1fr; gap: clamp(20px, 3vw, 48px); align-items: center; margin-top: clamp(32px, 4vw, 56px); }
.fab__grade img { width: 100%; aspect-ratio: 1.1; object-fit: cover; }
.fab__grade img.alto { aspect-ratio: 1 / 1.05; }
.fab__texto { font-size: clamp(1.25rem, 1.7vw, 1.625rem); line-height: 1.45; text-align: center; color: var(--tinta-2); }
.fatos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: clamp(40px, 5vw, 72px); }
.fato { background: var(--papel); border-radius: var(--raio); padding: 26px 24px; text-align: center; }
.fato b { display: block; font-size: clamp(2rem, 3.2vw, 3rem); line-height: 1; color: var(--tinta); }
.fato span { display: block; margin-top: 10px; font-size: 1.0625rem; color: var(--tinta-2); }
@media (max-width: 900px) {
  .fab__grade { grid-template-columns: 1fr 1fr; }
  .fab__texto { grid-column: 1 / -1; order: -1; text-align: left; }
}
@media (max-width: 560px) { .fatos { grid-template-columns: 1fr; } .fab__grade { grid-template-columns: 1fr; } }

/* ── Processos (PDF p.3) ── */
.proc h2 { font-size: var(--t-h2); max-width: 18ch; }
.proc__grade { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-top: clamp(36px, 5vw, 64px); }
.proc__item { display: block; text-decoration: none; background: var(--petroleo-2); }
.proc__item figure { overflow: hidden; aspect-ratio: 6 / 7; }
.proc__item img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease); }
.proc__item:hover img { transform: scale(1.05); }
.proc__item span { display: flex; justify-content: space-between; align-items: center; padding: 16px 18px; font-weight: 700; font-size: 1.0625rem; text-transform: uppercase; letter-spacing: .04em; }
.proc__item span::after { content: "→"; color: var(--cobre); transition: transform .2s var(--ease); }
.proc__item:hover span::after { transform: translateX(4px); }
@media (max-width: 900px) { .proc__grade { grid-template-columns: 1fr 1fr; } }

/* ── Etapas (PDF p.4, 6, 7, 8) ── */
.etapa { display: grid; grid-template-columns: 1.1fr 1fr; min-height: 92svh; }
.etapa--inv .etapa__foto { order: 2; }
.etapa__foto { position: relative; overflow: hidden; min-height: 420px; }
.etapa__foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.etapa__texto { display: flex; flex-direction: column; justify-content: center; padding: clamp(56px, 7vw, 112px) var(--margem); }
.etapa__texto h2 { font-size: var(--t-h2); }
.etapa__texto .lead { margin-top: clamp(24px, 3vw, 40px); color: var(--tinta-2); }
.spec { display: grid; grid-template-columns: max-content 1fr; gap: 16px 36px; margin-top: clamp(28px, 3.5vw, 48px); font-size: 1.0625rem; }
.spec dt { font-size: var(--t-small); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--cobre-texto); padding-top: 3px; }
.spec dd { color: var(--tinta); }
.etapa__frase { margin-top: 36px; padding-top: 18px; border-top: 3px solid var(--cobre); font-weight: 700; font-size: 1.1875rem; }
@media (max-width: 900px) {
  .etapa { grid-template-columns: 1fr; min-height: 0; }
  .etapa--inv .etapa__foto { order: 0; }
  .etapa__foto { min-height: 0; aspect-ratio: 4 / 3; }
}
@media (max-width: 420px) { .spec { grid-template-columns: 1fr; gap: 4px; } .spec dd { margin-bottom: 12px; } }

/* ── Aplicações corporativas (PDF p.5) ── */
.apl h2 { font-size: var(--t-h2); }
.apl .lead { margin-top: 20px; }
.apl__lista { margin-top: clamp(40px, 5vw, 72px); }
.apl__lista li { display: flex; justify-content: space-between; align-items: baseline; gap: 24px; padding-block: clamp(10px, 1.4vw, 18px); }
.apl__lista li + li { box-shadow: inset 0 3px 0 var(--petroleo-2); }
.apl__lista b { font-size: clamp(2.5rem, 7.6vw, 7.5rem); line-height: .95; letter-spacing: -0.03em; text-transform: uppercase; transition: color .25s; }
.apl__lista li:hover b { color: var(--cobre); }
.apl__lista span { font-size: clamp(1.0625rem, 1.4vw, 1.375rem); text-align: right; color: #e3e0d8; }
@media (max-width: 700px) {
  .apl__lista li { flex-direction: column; gap: 4px; padding-block: 16px; }
  .apl__lista b { font-size: 12.5vw; }
  .apl__lista span { text-align: left; }
}

/* ── Projetos (PDF p.9, 10, 11) ── */
.proj__topo { display: grid; grid-template-columns: 1fr 1fr; gap: 24px 64px; align-items: end; }
.proj__topo h2 { font-size: var(--t-h2); }
.proj__mosaico { display: grid; grid-template-columns: repeat(12, 1fr); grid-auto-rows: clamp(120px, 13vw, 200px); gap: 12px; margin-top: clamp(36px, 5vw, 64px); }
.proj__mosaico figure { position: relative; overflow: hidden; background: var(--areia-2); }
.proj__mosaico img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--ease); }
.proj__mosaico figure:hover img { transform: scale(1.04); }
.proj__mosaico figcaption { position: absolute; left: 0; bottom: 0; padding: 8px 12px; background: var(--petroleo); color: var(--areia); font-size: .9375rem; font-weight: 700; }
.m-a { grid-column: 1 / 8; grid-row: span 3; }
.m-b { grid-column: 8 / 13; grid-row: span 2; }
.m-c { grid-column: 8 / 13; grid-row: span 1; }
.m-d { grid-column: 1 / 5; grid-row: span 2; }
.m-e { grid-column: 5 / 9; grid-row: span 2; }
.m-f { grid-column: 9 / 13; grid-row: span 2; }
.m-g { grid-column: 1 / 4; grid-row: span 3; }
.m-h { grid-column: 4 / 7; grid-row: span 3; }
.m-i { grid-column: 7 / 13; grid-row: span 3; }
.proj__sub { margin-top: clamp(48px, 6vw, 88px); }
.proj__sub + .proj__mosaico { margin-top: 20px; }
@media (max-width: 900px) {
  .proj__topo { grid-template-columns: 1fr; }
  .proj__mosaico { grid-template-columns: 1fr 1fr; grid-auto-rows: 40vw; }
  .proj__mosaico > * { grid-column: auto; grid-row: auto; }
  .m-a, .m-f, .m-i { grid-column: 1 / -1; grid-row: span 1; }
  .m-a, .m-i { grid-row: span 2; }
}

/* ── Da proposta à peça (PDF p.12) ── */
.prop h2 { font-size: var(--t-h2); }
.prop__par { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(14px, 2vw, 28px); margin-top: clamp(36px, 5vw, 64px); }
.prop__par img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.prop__par figcaption { margin-top: 14px; font-size: var(--t-small); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--cobre); }
@media (max-width: 700px) { .prop__par { grid-template-columns: 1fr; gap: 28px; } }

/* ── Linhas (PDF p.13) — índice com prévia ── */
.linhas__grade { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 5vw, 88px); align-items: start; }
.linhas h2 { font-size: var(--t-h2); }
.linhas .lead { margin-top: 24px; color: var(--tinta-2); }
.nota { display: inline-block; margin-top: 28px; padding: 18px 24px; background: var(--salvia); border-radius: var(--raio); font-weight: 700; font-size: 1.1875rem; }
.indice { margin-top: clamp(32px, 4vw, 48px); }
.indice a { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 16px; padding: 14px 0; text-decoration: none; transition: opacity .24s, color .24s; }
.indice li + li a { box-shadow: inset 0 2px 0 var(--areia-2); }
.indice b { font-size: clamp(1.75rem, 3vw, 2.75rem); line-height: 1.05; letter-spacing: -0.02em; }
.indice span { font-size: 1rem; color: var(--tinta-2); }
.indice img { display: none; }
.indice:hover a { opacity: .38; }
.indice:hover a:hover, .indice a:focus-visible { opacity: 1; color: var(--cobre-texto); }
.previa { position: sticky; top: calc(var(--header-h) + 32px); aspect-ratio: 4 / 5; overflow: hidden; background: var(--areia-2); }
.previa img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .24s ease; }
.previa img.is-on { opacity: 1; }
.previa figcaption { position: absolute; left: 0; bottom: 0; padding: 10px 16px; background: var(--petroleo); color: var(--areia); font-weight: 700; z-index: 2; }
@media (max-width: 900px) {
  .linhas__grade { grid-template-columns: 1fr; }
  .previa { display: none; }
  .indice a { grid-template-columns: 88px 1fr; }
  .indice img { display: block; width: 88px; height: 88px; object-fit: cover; grid-row: span 2; }
  .indice span { grid-column: 2; margin-top: -10px; }
  .indice:hover a { opacity: 1; }
}

/* ── Reforma (PDF p.33) ── */
.ref__grade { display: grid; grid-template-columns: 1fr 1fr .9fr; gap: 14px; margin-top: clamp(36px, 5vw, 64px); align-items: stretch; }
.ref__grade img { width: 100%; height: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.ref h2 { font-size: var(--t-h2); }
.ref .lead { margin-top: 20px; }
.ref__lista { background: var(--petroleo-2); border-radius: var(--raio); padding: clamp(24px, 3vw, 40px); display: flex; flex-direction: column; justify-content: center; gap: 18px; }
.ref__lista li { display: flex; gap: 14px; align-items: baseline; font-size: 1.1875rem; }
.ref__lista li::before { content: ""; flex: none; width: 10px; height: 10px; background: var(--cobre); transform: translateY(-2px); }
.ref__nota { margin-top: 20px; font-size: 1rem; }
@media (max-width: 900px) { .ref__grade { grid-template-columns: 1fr 1fr; } .ref__lista { grid-column: 1 / -1; } }
@media (max-width: 560px) { .ref__grade { grid-template-columns: 1fr; } }

/* ── Garantias (PDF p.34) ── */
.gar h2 { font-size: var(--t-h2); }
.gar__grade { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-top: clamp(36px, 5vw, 64px); }
.gar__item { background: var(--papel); border-radius: var(--raio); padding: clamp(28px, 3vw, 44px) 20px; text-align: center; }
.gar__item b { display: block; font-size: clamp(4rem, 7vw, 6.5rem); line-height: .9; letter-spacing: -0.04em; font-variant-numeric: tabular-nums; }
.gar__item small { display: block; margin-top: 12px; font-size: 1rem; font-weight: 700; letter-spacing: .1em; color: var(--cobre-texto); }
.gar__item span { display: block; margin-top: 16px; font-size: 1.1875rem; font-weight: 700; color: var(--tinta-2); }
.gar__nota { margin-top: 28px; color: var(--tinta-2); font-size: 1.0625rem; }
@media (max-width: 900px) { .gar__grade { grid-template-columns: 1fr 1fr; } }

/* ── Como desenvolvemos (PDF p.35) ── */
.como h2 { font-size: var(--t-h2); }
.como__lista { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-top: clamp(36px, 5vw, 64px); counter-reset: passo; }
.como__lista li { counter-increment: passo; background: var(--petroleo); color: var(--areia); border-radius: var(--raio); padding: clamp(24px, 2.6vw, 36px); min-height: 260px; display: flex; flex-direction: column; }
.como__lista li::before { content: counter(passo, decimal-leading-zero); font-size: clamp(3rem, 4.4vw, 4.25rem); font-weight: 700; line-height: 1; color: var(--cobre); margin-bottom: auto; padding-bottom: 32px; }
.como__lista b { font-size: 1.375rem; text-transform: uppercase; letter-spacing: .02em; }
.como__lista span { margin-top: 8px; font-size: 1.0625rem; color: #e3e0d8; }
.como__cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px; margin-top: 40px; }
.como__cta p { font-size: clamp(1.1875rem, 1.6vw, 1.5rem); max-width: 48ch; }
@media (max-width: 900px) { .como__lista { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .como__lista { grid-template-columns: 1fr; } .como__lista li { min-height: 0; } }

/* ── Contato (PDF p.36) ── */
.contato { display: grid; grid-template-columns: 1.15fr 1fr; background: var(--petroleo); color: var(--areia); }
.contato__texto { padding: var(--gap-secao) var(--margem); }
.contato h2 { font-size: var(--t-h2); }
.contato__linhas { margin-top: 24px; font-size: 1.125rem; color: #e3e0d8; }
.contato__fone { display: inline-block; margin-top: clamp(32px, 4vw, 56px); font-size: clamp(2rem, 3.4vw, 3rem); font-weight: 700; text-decoration: none; letter-spacing: -0.01em; }
.contato__fone:hover { color: var(--cobre); }
.contato__dados { display: grid; grid-template-columns: max-content 1fr; gap: 12px 28px; margin-top: 28px; font-size: 1.0625rem; }
.contato__dados dt { color: var(--cobre); font-weight: 700; }
.contato__dados a { text-decoration: none; }
.contato__dados a:hover { text-decoration: underline; text-underline-offset: 3px; }
.contato__acoes { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 36px; }
.contato__foto { position: relative; overflow: hidden; min-height: 480px; border-left: 10px solid var(--cobre); }
.contato__foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.mapa { background: var(--petroleo); padding: 0 var(--margem) var(--gap-secao); }
.mapa iframe { display: block; width: 100%; height: clamp(280px, 32vw, 420px); border: 0; filter: grayscale(.35) contrast(1.05); }
@media (max-width: 900px) {
  .contato { grid-template-columns: 1fr; }
  .contato__foto { min-height: 0; aspect-ratio: 4 / 3; border-left: 0; border-top: 8px solid var(--cobre); }
}
@media (max-width: 460px) { .contato__dados { grid-template-columns: 1fr; gap: 2px; } .contato__dados dd { margin-bottom: 12px; } .contato__acoes .btn { flex: 1 1 100%; } }