/* VI · A casa — percurso da fachada à varanda */
.ca{max-width:1680px;margin:0 auto;padding:clamp(72px,11vh,140px) var(--margem)}
.ca-nb{white-space:nowrap}
.ca-cab{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:clamp(24px,4vw,72px);align-items:end;margin-bottom:clamp(48px,8vh,96px)}
.ca-rotulo{margin:0 0 18px;font-size:12px;letter-spacing:.32em;text-transform:uppercase;color:var(--tinta-suave)}
.ca-rom{font-family:var(--f-serifa);font-weight:600;color:var(--camelo);letter-spacing:.05em}
.ca-titulo{margin:0;font-family:var(--f-serifa);font-weight:500;font-size:clamp(30px,3.4vw,54px);line-height:1.04;letter-spacing:-.018em;color:var(--tinta)}
.ca-linha{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em}
.ca-linha>span{display:inline-block;transition:transform 1.1s var(--facil)}
.ca-linha-2>span{transition-delay:.18s}
.js .ca:not(.ca-vista) .ca-linha>span{transform:translateY(105%)}
.ca-linha-2{color:var(--camelo)}
.ca-intro{margin:20px 0 0;max-width:540px;color:var(--tinta-suave);text-wrap:pretty}

/* placa de mármore real */
.ca-placa{position:relative;justify-self:end;width:min(100%,460px);padding:clamp(22px,2.4vw,34px);color:#f3ede4;overflow:hidden;
  background:linear-gradient(160deg in oklab,rgba(20,18,16,.25),rgba(20,18,16,.6)),url("../img/ca-marmore-mesa.webp") center/cover #141210}
.ca-placa::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(100deg in oklab,rgba(20,18,16,.72),rgba(20,18,16,.15) 75%)}
.ca-placa>*{position:relative;z-index:1}
.ca-placa::after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 0 1px rgba(243,237,228,.12)}
.ca-placa-rot{margin:0 0 12px;font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:#d2a77f}
.ca-end{margin:0;font-family:var(--f-serifa);font-weight:500;font-size:clamp(19px,1.5vw,23px);line-height:1.3}
.ca-hora{margin:10px 0 18px;font-size:var(--t-mini);color:#d8c8b8}
.ca-chegar{display:inline-flex;align-items:center;gap:10px;min-height:46px;padding:0 20px;border-radius:999px;background:#f3ede4;color:var(--cafe);
  text-decoration:none;font-weight:600;font-size:15px;transition:background .3s}
.ca-chegar span{color:var(--camelo);transition:transform .4s var(--facil)}
.ca-chegar:hover{background:#fff}
.ca-chegar:hover span{transform:translateX(4px)}

/* percurso */
.ca-percurso{position:relative}
.ca-fio{position:absolute;left:0;right:0;top:11px;height:2px;background:var(--linha);overflow:hidden}
.ca-fio i{display:block;height:100%;background:var(--camelo);transform:scaleX(var(--p,1));transform-origin:left}
.ca-trilho{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1.75fr 1.05fr .7fr .95fr 1.05fr;gap:clamp(12px,1.4vw,24px);align-items:start}
.ca-est{position:relative;min-width:0}
.ca-marco{position:relative;margin:0 0 clamp(18px,2.6vh,28px);padding-top:30px;font-family:var(--f-serifa);font-size:17px;color:var(--cafe)}
.ca-marco::before{content:"";position:absolute;left:0;top:7px;width:10px;height:10px;border-radius:50%;background:var(--creme);box-shadow:inset 0 0 0 2px var(--camelo);transition:background .6s}
.ca-n{font-weight:600;color:var(--camelo);margin-right:8px;font-variant-numeric:tabular-nums}
.ca-f{position:relative;margin:0;overflow:hidden;background:var(--areia)}
.ca-f::after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 0 1px rgba(36,26,21,.08)}
.ca-f img{width:100%;height:100%;object-fit:cover;transition:filter 1.2s ease,transform 2.4s var(--facil)}
.ca-leg{margin:12px 0 0;max-width:30ch;font-size:var(--t-mini);line-height:1.45;color:var(--tinta-suave);text-wrap:pretty}

/* alturas e desníveis */
.ca-est-1 .ca-f{aspect-ratio:3/4.1}
.ca-est-2 .ca-f{aspect-ratio:3/4}
.ca-est-2 .ca-f img{object-position:50% 78%}
.ca-est-3 .ca-f{aspect-ratio:1/2}
.ca-est-4 .ca-f{aspect-ratio:4/5}
.ca-est-4 .ca-f img{object-position:50% 80%}
.ca-par{position:relative;padding-bottom:34%}
.ca-par>.ca-f:first-child{aspect-ratio:3/4}
.ca-f-cafe{position:absolute;left:-22%;bottom:0;width:56%;aspect-ratio:1/1;outline:clamp(5px,.5vw,8px) solid var(--creme)}
.ca-f-cafe img{object-position:50% 70%}
.ca-est-2 .ca-f{margin-top:clamp(80px,13vh,150px)}
.ca-est-4 .ca-f{margin-top:clamp(40px,6vh,80px)}
.ca-est-5 .ca-par{margin-top:clamp(90px,15vh,170px)}

/* entrada em sequência (computador) */
.js .ca:not(.ca-andou) .ca-fio i{transform:scaleX(0)}
.js .ca-andou .ca-fio i{transition:transform 3.2s var(--facil) .2s}
.js .ca-est:not(.ca-acesa) .ca-f img{filter:sepia(.55) saturate(.62) brightness(1.04) contrast(.92);transform:scale(1.02)}
.js .ca-est .ca-f img{transition-delay:calc(.35s + var(--k) * .55s)}
.ca-est.ca-acesa .ca-marco::before{background:var(--camelo)}
.js .ca-est .ca-marco::before{transition-delay:calc(.35s + var(--k) * .55s)}

.ca-dica{display:none;margin:14px 0 0;font-size:13px;color:var(--tinta-suave)}
.ca-dica::after{content:" →";color:var(--camelo)}

/* celular: trilho deslizante */
@media (max-width:900px){
  .ca-cab{grid-template-columns:minmax(0,1fr);gap:28px;margin-bottom:40px}
  .ca-placa{justify-self:stretch;width:auto;padding:22px 20px}
  .ca-end{font-size:19px}
  .ca-hora{margin:8px 0 14px}
  .ca-percurso{margin:0 calc(-1 * var(--margem))}
  .ca-trilho{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 var(--margem) 6px;scroll-padding:0 var(--margem);
    overscroll-behavior-x:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .ca-trilho::-webkit-scrollbar{display:none}
  .ca-trilho::after{content:"";flex:0 0 1px}
  .ca-est{flex:0 0 min(78%,380px);scroll-snap-align:start}
  .ca-marco{margin-bottom:16px}
  .ca-est-2 .ca-f,.ca-est-4 .ca-f,.ca-est-5 .ca-par{margin-top:0}
  .ca-est .ca-f,.ca-par>.ca-f:first-child{aspect-ratio:4/5}
  .ca-est-3 .ca-f{aspect-ratio:4/5}
  .ca-est-3 .ca-f img{object-position:50% 30%}
  .ca-par{padding-bottom:0}
  .ca-f-cafe{left:auto;right:10px;bottom:10px;width:38%;outline-width:4px}
  .ca-fio{left:var(--margem);right:var(--margem)}
  .js .ca .ca-fio i{transition:transform .5s var(--facil)}
  .js .ca .ca-est .ca-f img,.js .ca .ca-est .ca-marco::before{transition-delay:0s}
  .ca-dica{display:block}
}