/* =============================================================================
   PÁGINAS — identidade "Orla": papel, petróleo, calçadão
   ============================================================================= */

/* ---------- capa (home) ---------- */
.capa{position:relative;display:block;overflow:clip;isolation:isolate;padding:var(--e-5) 0 var(--e-4);
  background:
    radial-gradient(60% 80% at 88% 8%,rgba(31,107,115,.10),rgba(247,244,236,0) 62%),
    linear-gradient(180deg,var(--papel-200),var(--fundo) 60%)}
.particulas{display:none}
.capa-luz{position:absolute;inset:auto 0 0 0;height:1px;background:var(--borda);z-index:-1}
.capa-faixa{margin-top:var(--e-4)}
/* disciplina de dobra: título do herói em no máximo duas linhas */
.capa h1{font-size:clamp(34px,5.2vw,62px);max-width:26ch}
.capa-conteudo{max-width:none}
.capa-conteudo .fila{margin-top:var(--e-4)}
.capa-foto{display:block;background:var(--superficie);border:2px solid var(--petroleo-600)}
.capa-foto img{width:100%;aspect-ratio:16/9;object-fit:cover}
/* a ficha do destaque tem de caber na primeira tela junto com a manchete */
@media (min-width:900px){.capa-foto img{aspect-ratio:3/1;max-height:420px}}
.capa-foto figcaption{position:static;padding:20px var(--e-3);display:grid;gap:4px;align-items:center;
  background:var(--petroleo-600);color:var(--papel-100);border-top:3px solid var(--terracota-600)}
@media (min-width:800px){
  /* ficha do destaque em barra: rótulo, nome e dados à esquerda; preço e ação à direita */
  .capa-foto figcaption{grid-template-columns:1fr auto;gap:4px var(--e-4);padding:22px var(--e-4);align-items:center}
  .capa-foto figcaption .rotulo-cartao{grid-column:1}
  .capa-foto figcaption b{grid-column:1}
  .capa-foto figcaption span{grid-column:1}
  .capa-foto figcaption strong{grid-column:2;grid-row:1 / span 3;justify-self:end;margin:0;font-size:var(--t-7)}
  .capa-foto figcaption .botao{grid-column:2;grid-row:4;justify-self:end;width:auto}
}
.capa-foto .rotulo-cartao{font-size:10.5px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;
  color:rgba(247,244,236,.72);margin-bottom:6px}
.capa-foto figcaption b{font-family:'Fraunces',Georgia,serif;font-size:var(--t-4);font-weight:600}
.capa-foto figcaption span{font-size:var(--t-2);color:rgba(247,244,236,.78)}
.capa-foto figcaption strong{margin-top:8px;font-family:'Fraunces',Georgia,serif;font-size:var(--t-6);font-weight:600;color:#fff}
.capa-foto .botao-secundario{background:transparent;border-color:rgba(247,244,236,.55);color:var(--papel-100)}
.capa-foto .botao-secundario:hover{background:rgba(247,244,236,.14)}
.capa-dados{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--e-3);margin:56px 0 0}
@media (min-width:800px){.capa-dados{grid-template-columns:repeat(4,1fr)}}
.capa-dados div{border-top:2px solid var(--petroleo-600);padding-top:var(--e-2)}
.capa-dados dt{font-size:var(--t-2);color:var(--texto-fraco)}
.capa-dados dd{margin:6px 0 0;font-family:'Fraunces',Georgia,serif;font-size:var(--t-6);font-weight:600}
.linha{display:block;overflow:hidden}
.linha>div{display:block}
[data-dividir]{visibility:hidden}

/* ---------- banda de números, com o calçadão no fundo ---------- */
.numeros-faixa{position:relative;background-color:var(--papel-200);border-top:1px solid var(--borda-forte);
  border-bottom:1px solid var(--borda-forte);padding:var(--e-5) 0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='52' height='52' viewBox='0 0 52 52'%3E%3Cg fill='none' stroke='%230d3e44' stroke-opacity='.13' stroke-width='1.4'%3E%3Cpath d='M0 40 C 8 40 10 12 26 12 C 42 12 44 40 52 40'/%3E%3Cpath d='M0 12 C 8 12 10 40 26 40 C 42 40 44 12 52 12'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat:repeat-x;background-size:52px 52px;background-position:bottom left}

/* ---------- pilares ---------- */
.pilar{border-top:2px solid var(--borda-forte);padding-top:var(--e-2)}
.pilar-num{font-family:'Fraunces',Georgia,serif;font-size:var(--t-4);letter-spacing:.04em;color:var(--acento);
  font-variant-numeric:tabular-nums}
.pilar h3{margin:14px 0 8px}
.pilar p{color:var(--texto-fraco);font-size:var(--t-2);line-height:1.6}

/* ---------- vitrine ---------- */
.vitrine{position:relative;background:var(--fundo)}
.vitrine-palco{display:grid;gap:var(--e-4);padding:var(--e-6) 0}
.vitrine-topo{display:block}
.vitrine-trilha{display:grid;gap:var(--e-3);padding:0 var(--e-3)}
@media (min-width:620px){.vitrine-trilha{grid-template-columns:repeat(2,1fr)}}
@media (min-width:900px){
  .vitrine-trilha{grid-template-columns:repeat(3,1fr);padding:0}
  .vitrine-trilha .cartao{width:auto}
}

/* ---------- localização e mapa ---------- */
.local{display:grid;gap:var(--e-5);align-items:center}
@media (min-width:900px){.local{grid-template-columns:1fr 1fr;gap:var(--e-6)}}
.lista-contato{list-style:none;margin:0;padding:0;display:grid;gap:12px;color:var(--texto-fraco)}
.lista-contato strong{color:var(--texto)}
.link{color:var(--marca-texto);border-bottom:1px solid var(--marca-texto);padding-bottom:2px}
.mapa-caixa{position:relative;display:block;border:2px solid var(--petroleo-600);overflow:hidden;aspect-ratio:4/3;
  background:var(--papel-300)}
.mapa{width:100%;height:100%;border:0;filter:grayscale(.6) contrast(1.02);pointer-events:none}
.mapa-bloco{display:grid;gap:12px}
.carro-escolhido{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:16px;margin-bottom:24px;
  border:2px solid var(--petroleo-600);background:var(--superficie)}
.carro-escolhido img{width:104px;height:78px;object-fit:cover;flex:none}
.carro-escolhido b{display:block;font-size:var(--t-3)}
.carro-escolhido span{display:block;font-size:13px}
.carro-escolhido .link{margin-left:auto;font-size:14px}
.mapa-veu{position:absolute;left:0;right:0;bottom:0;padding:18px 20px;display:flex;align-items:baseline;gap:12px;
  background:var(--petroleo-600);color:var(--papel-100)}
.mapa-caixa:hover .mapa-veu{background:var(--petroleo-700)}
.mapa-veu b{font-family:'Fraunces',Georgia,serif;font-size:var(--t-4);font-weight:600}
.mapa-veu small{color:rgba(247,244,236,.8)}

/* ---------- filtros do estoque ---------- */
.filtros{display:grid;gap:var(--e-2);margin-top:var(--e-4);padding:var(--e-3);background:var(--superficie);
  border:2px solid var(--borda-forte)}
@media (min-width:800px){.filtros{grid-template-columns:1.4fr 1fr 1fr 1fr}}
.campo{display:grid;gap:8px}
.campo>span{font-size:10.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--texto-fraco)}
.campo input,.campo select,.campo textarea{width:100%;min-height:48px;padding:0 14px;border-radius:2px;
  background:var(--fundo);border:1px solid var(--borda-forte);color:var(--texto);font:inherit;
  transition:border-color var(--t-micro) var(--curva)}
.campo textarea{padding:12px 14px;min-height:120px;resize:vertical}
.campo input:focus,.campo select:focus,.campo textarea:focus{border-color:var(--petroleo-600);outline:none}
.campo input[type=range]{min-height:auto;padding:0;accent-color:var(--petroleo-600);height:44px}
.campo output{color:var(--texto)}

/* ---------- foto ausente (enquanto o estoque real não chega) ---------- */
.sem-foto{width:100%;height:100%;display:flex;flex-direction:column;justify-content:flex-end;gap:3px;padding:var(--e-3);
  background:
    radial-gradient(80% 70% at 76% 18%,rgba(31,107,115,.14),rgba(240,235,224,0) 62%),
    linear-gradient(150deg,var(--papel-300),var(--papel-200) 70%);
  color:var(--texto-fraco)}
.sem-foto span{font-size:10.5px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:var(--petroleo-600)}
.sem-foto b{font-family:'Fraunces',Georgia,serif;font-size:var(--t-5);color:var(--texto)}
.sem-foto small{font-size:var(--t-1);margin-top:6px}
.sem-foto.grande{aspect-ratio:16/10;border:1px solid var(--borda-forte)}
.sem-foto.grande b{font-size:var(--t-7)}

/* ---------- página do veículo ---------- */
.trilha{display:flex;gap:10px;font-size:var(--t-2);margin-bottom:var(--e-3)}
.trilha a:hover{color:var(--texto)}
.veiculo-topo{margin-bottom:var(--e-4)}
.veiculo-grade{display:grid;gap:var(--e-5);align-items:start}
@media (min-width:1000px){.veiculo-grade{grid-template-columns:1.6fr .9fr;gap:var(--e-6)}}
.foto-grande{border:1px solid var(--borda-forte);overflow:hidden;box-shadow:12px 12px 0 rgba(13,62,68,.12)}
.foto-grande img{width:100%;aspect-ratio:16/10;object-fit:cover}
.ficha-tecnica{margin-top:var(--e-5)}
.lista-ficha{list-style:none;margin:var(--e-3) 0 0;padding:0;display:grid;gap:0}
.lista-ficha li{display:flex;justify-content:space-between;gap:var(--e-2);padding:14px 0;border-bottom:1px solid var(--borda)}
.lista-ficha span{color:var(--texto-fraco)}
.veiculo-lateral{position:sticky;top:96px}
.carrossel{overflow:hidden}
.carrossel .splide__slide img{width:100%;height:100%;object-fit:cover}

/* ---------- simulador ---------- */
.simulador{display:grid;gap:var(--e-3);margin-top:var(--e-5)}
@media (min-width:900px){.simulador{grid-template-columns:1.1fr .9fr;align-items:start}}
.resultado{position:sticky;top:96px}

/* ---------- sobre ---------- */
.etapas{list-style:none;margin:var(--e-3) 0 0;padding:0;counter-reset:etapa;display:grid;gap:var(--e-3)}
.etapas li{counter-increment:etapa;border-top:2px solid var(--borda-forte);padding-top:var(--e-2)}
.etapas b{display:block;font-size:var(--t-3);font-weight:700}
.etapas b::before{content:none}
.etapas p{margin-top:8px;color:var(--texto-fraco);font-size:var(--t-2)}

/* ---------- contato ---------- */
.contato-grade{display:grid;gap:var(--e-4)}
@media (min-width:1000px){.contato-grade{grid-template-columns:1fr 1fr;gap:var(--e-6)}}
.duvida{border-bottom:1px solid var(--borda);padding:16px 0}
.duvida summary{cursor:pointer;font-weight:700;list-style:none;display:flex;justify-content:space-between;gap:16px;
  min-height:32px;align-items:center}
.duvida summary::-webkit-details-marker{display:none}
.duvida summary::after{content:"+";color:var(--acento);font-size:var(--t-5);line-height:1}
.duvida[open] summary::after{content:"–"}
.duvida p{margin-top:12px;color:var(--texto-fraco);font-size:var(--t-2)}

/* ---------- chamada final ---------- */
.chamada{text-align:left;background:var(--petroleo-700);color:var(--papel-100);padding:var(--e-6) 0}
.chamada .texto,.chamada .mudo{color:rgba(247,244,236,.78)}
.chamada .olho{color:var(--terracota-400)}
.chamada .botao-principal{background:var(--terracota-600);box-shadow:var(--sombra-2)}
.chamada .botao-principal:hover{background:var(--terracota-400)}
.chamada .botao-fantasma{border-color:rgba(247,244,236,.5);color:var(--papel-100)}
.chamada .botao-secundario{border-color:rgba(247,244,236,.5);color:var(--papel-100);background:transparent}
.chamada .botao-secundario:hover{background:rgba(247,244,236,.14)}
.chamada .botao-fantasma:hover{background:rgba(247,244,236,.12)}