/* ===== 1. camadas — a régua do hero vira a espinha da seção ===== */
.cm{--p:0;padding-bottom:calc(var(--sec) * .8)}
.cm-malha{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.cm-malha i{position:absolute;border-radius:50%;background:radial-gradient(closest-side,var(--c),transparent)}
.cm-malha i:nth-child(1){--c:color-mix(in oklab,var(--madeira) 45%,transparent);width:80vmax;height:80vmax;left:-30vmax;top:-30vmax}
.cm-malha i:nth-child(2){--c:color-mix(in oklab,var(--caramelo) 30%,transparent);width:60vmax;height:60vmax;right:-25vmax;top:30%}
.cm-malha i:nth-child(3){--c:color-mix(in oklab,#120b07 70%,transparent);width:90vmax;height:90vmax;left:10%;bottom:-45vmax}

.cm-topo{min-height:88svh;display:flex;flex-direction:column;justify-content:center;padding:4rem 0 2rem}
.cm-topo .wf-rotulo{margin-bottom:1.6rem}
.cm-tit .f{font-size:clamp(3rem,1rem + 4.3vw,5.8rem)}
.cm-abre{margin-top:clamp(1.6rem,3vw,2.4rem);color:var(--texto-claro);font-size:clamp(1.15rem,1rem + .45vw,1.4rem);line-height:1.5;max-width:27em}

/* profundidade: quanto mais fundo, mais escuro e mais quente o halo */
.cm::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,rgba(14,8,5,0),rgba(14,8,5,.55));opacity:var(--p);transition:opacity .4s linear}
.cm-rastro{position:absolute;left:.5rem;top:6rem;width:1px;height:calc(var(--y,0px) - 6rem);background:linear-gradient(180deg,rgba(240,220,192,0),var(--champanhe));box-shadow:0 0 10px rgba(240,220,192,.6);z-index:1}

/* palco: régua grudada à esquerda, camadas à direita */
.cm-palco{display:grid;grid-template-columns:minmax(0,45fr) minmax(0,55fr);column-gap:clamp(2rem,4vw,5rem);margin-top:0}
.cm-regua{position:relative}
.cm-regua-in{position:sticky;top:0;height:100svh;display:flex;flex-direction:column;justify-content:center;padding:6rem 0 3rem 3.2rem}
.cm-fio{position:absolute;left:.5rem;top:6rem;bottom:3rem;width:1px;background:linear-gradient(180deg,transparent,rgba(240,220,192,.55) 8%,rgba(240,220,192,.55) 92%,transparent)}
.cm-fio::after{content:"";position:absolute;left:0;top:8%;bottom:8%;width:6px;background:repeating-linear-gradient(180deg,rgba(240,220,192,.32) 0 1px,transparent 1px 16px)}
.cm-ponta{position:absolute;left:1.4rem;font-size:var(--t-mini);letter-spacing:.08em;text-transform:uppercase;color:var(--texto-claro-suave);transform:translateX(-0%)}
.cm-ponta-a{top:4.2rem}
.cm-ponta-b{bottom:1.2rem}
.cm-nomes{list-style:none;display:flex;flex-direction:column;gap:clamp(.4rem,1.6vh,1.2rem)}
.cm-nome{position:relative;font-family:var(--f-titulo);line-height:1;color:var(--texto-claro-suave);opacity:.42;transition:opacity .6s var(--curva),color .6s var(--curva)}
.cm-nome::before{content:"";position:absolute;left:-2.95rem;top:calc(clamp(2.2rem,4.3vw,4.6rem) * .5);width:7px;height:7px;margin-top:-3.5px;border-radius:50%;background:rgba(240,220,192,.7)}
.cm-nome b{display:block;font-weight:300;font-size:clamp(2.2rem,4.3vw,4.6rem);letter-spacing:-.03em;transition:font-weight .7s var(--curva)}
.cm-nome small{display:block;font-family:var(--f-texto);font-size:var(--t-mini);letter-spacing:.06em;text-transform:uppercase;margin-top:.35rem;height:0;opacity:0;overflow:hidden;transition:opacity .5s var(--curva),height .5s var(--curva)}
.cm-nome:nth-child(2){opacity:.38}.cm-nome:nth-child(3){opacity:.33}.cm-nome:nth-child(4){opacity:.29}.cm-nome:nth-child(5){opacity:.25}
.cm-nome.on{opacity:1;color:var(--champanhe);text-shadow:0 0 42px rgba(240,220,192,.28)}
.cm-nome.on b{font-weight:800}
.cm-nome.on small{opacity:1;height:1.4em;color:var(--texto-claro-suave)}
.cm-ponto{position:absolute;left:.5rem;top:0;margin-left:-8.5px;transform:translateY(var(--y,0px));will-change:transform;z-index:2}
.cm-halo{position:absolute;left:-14rem;top:0;width:36rem;height:36rem;margin-top:-18rem;border-radius:50%;background:radial-gradient(closest-side,rgba(240,220,192,.16),rgba(240,220,192,0));transform:translateY(var(--y,0px));pointer-events:none;z-index:-1}

.cm-camada{min-height:82svh;display:flex;flex-direction:column;justify-content:center;padding:3rem 0;transition:opacity .7s var(--curva)}
.js .cm-camada{opacity:.32}
.js .cm-camada.on{opacity:1}
.cm-h{position:relative}
.cm-camada .cm-h::before{content:"";position:absolute;right:calc(100% + 1rem);top:50%;width:0;height:1px;background:linear-gradient(90deg,rgba(240,220,192,0),var(--champanhe));transition:width .9s var(--curva)}
.cm-camada.on .cm-h::before{width:clamp(2rem,4vw,5rem)}
.cm-h{display:flex;align-items:baseline;gap:.9rem;font-family:var(--f-texto);font-size:var(--t-mini);font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--champanhe);margin-bottom:1.1rem}
.cm-n{color:var(--texto-claro-suave);font-weight:500}
.cm-queixa{font-family:var(--f-titulo);font-weight:300;font-size:clamp(1.6rem,1rem + 1.7vw,2.6rem);line-height:1.12;color:var(--texto-claro);letter-spacing:-.02em;max-width:16em}
.cm-nota{margin-top:1.2rem;color:var(--texto-claro-suave);max-width:30em}
.cm-trata{list-style:none;margin-top:2rem;border-top:1px solid rgba(240,220,192,.18)}
.cm-trata li{display:grid;grid-template-columns:minmax(0,1fr);gap:.25rem;padding:1.1rem 0;border-bottom:1px solid rgba(240,220,192,.18)}
.cm-trata b{font-family:var(--f-titulo);font-weight:500;font-size:clamp(1.15rem,1rem + .35vw,1.35rem);letter-spacing:-.01em;color:var(--champanhe)}
.cm-trata span{color:var(--texto-claro-suave)}
.cm-trata-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:2rem}
.cm-exame{display:flex;gap:.9rem;align-items:flex-start;color:var(--texto-claro);padding:1rem 1.2rem;border-radius:var(--raio);background:color-mix(in oklab,var(--champanhe) 7%,transparent);box-shadow:inset 0 0 0 1px rgba(240,220,192,.14)}
.cm-exame .wf-ponto{margin-top:.2rem}
.cm-cita{margin-top:2rem;padding-left:1.4rem;border-left:1px solid var(--champanhe)}
.cm-cita p{font-family:var(--f-titulo);font-weight:300;font-size:clamp(1.15rem,1rem + .5vw,1.45rem);line-height:1.3;color:var(--champanhe)}
.cm-cita footer{margin-top:.6rem;font-size:var(--t-mini);color:var(--texto-claro-suave)}

.cm-fim{position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.5rem 3rem;margin-top:clamp(2rem,4vw,4rem);padding-top:2.6rem}
.cm-fim::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,var(--champanhe),rgba(240,220,192,.12) 60%,rgba(240,220,192,0));box-shadow:0 0 12px rgba(240,220,192,.35)}
.cm-fim p b{font-weight:800;color:var(--champanhe)}
.cm-fim p{font-family:var(--f-titulo);font-weight:300;font-size:clamp(1.5rem,1rem + 1.6vw,2.5rem);letter-spacing:-.015em;line-height:1.2;color:var(--texto-claro);max-width:22em}

@media (max-width:980px){
  .cm-topo{min-height:0;padding:0 0 2rem}
  .cm-abre{margin-top:1.2rem}
  .cm-tit .f{font-size:clamp(2.3rem,10vw,3.6rem)}
  .cm-fio::after{display:none}
  .cm-nome.on{text-shadow:none}
  .cm-palco{grid-template-columns:1.6rem minmax(0,1fr);column-gap:1.1rem;margin-top:2.5rem}
  .cm-regua-in{top:5.5rem;height:calc(100svh - 9rem);padding:0}
  .cm-fio{left:50%;top:0;bottom:0}
  .cm-ponta-a{top:0}.cm-ponta-b{bottom:0}
  .cm-ponta,.cm-nome b,.cm-nome small{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .cm-nomes{position:absolute;inset:0;justify-content:space-between;gap:0}
  .cm-nome{height:0;opacity:1}
  .cm-nome::before{left:50%;top:0;margin-left:-3.5px}
  .cm-ponto{left:50%}
  .cm-rastro{left:50%;top:0;height:var(--y,0px)}
  .cm-camada .cm-h::before{display:none}
  .cm-queixa{font-size:clamp(1.4rem,6vw,1.9rem)}
  .cm-halo{left:-8rem;width:18rem;height:18rem;margin-top:-9rem}
  .cm-camada,.js .cm-camada{min-height:0;padding:2rem 0 3rem;opacity:1}
  .cm-h{font-family:var(--f-titulo);font-size:clamp(2.2rem,9vw,3rem);font-weight:800;letter-spacing:-.03em;text-transform:none;flex-direction:column;gap:.3rem;align-items:flex-start;line-height:1}
  .cm-n{font-family:var(--f-texto);font-size:var(--t-mini);letter-spacing:.08em;text-transform:uppercase}
  .cm-trata-2{grid-template-columns:minmax(0,1fr)}
}