/* Seção: os seis cuidados. A coluna de pedras do hero vira a espinha da seção:
   as pedras começam frias e esquentam uma a uma conforme a pessoa desce. A quinta é a dela. */
.cuidados{position:relative;z-index:4;isolation:isolate;overflow:clip;margin-top:-2.4rem;border-radius:2.4rem 2.4rem 0 0;padding:var(--respiro) var(--margem) calc(var(--respiro) * .8);
  background:linear-gradient(180deg in oklab,var(--creme) 0%,var(--creme) 38%,#f6e6d2 78%,#f1d9bd 100%)}
.cd-brasa{position:absolute;left:10%;right:10%;bottom:-8%;height:46%;z-index:-2;border-radius:50%;background:radial-gradient(closest-side in oklch,rgba(247,207,145,.85),transparent);filter:blur(60px)}
.cd-dentro{max-width:var(--largura);margin:0 auto;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2rem,6vw,6rem)}
.cd-cab{position:sticky;top:clamp(4rem,12vh,7rem);align-self:start}
.cd-cab h2{margin-top:1rem}
.cd-cab>p:not(.olho){margin-top:1.3rem;font-size:clamp(1.02rem,1.2vw,1.16rem);line-height:1.6;max-width:34ch;color:var(--tinta-2)}
.cd-cab strong{color:var(--tinta);font-weight:700}
.cd-conta{margin-top:clamp(1.5rem,4vh,2.6rem);display:flex;align-items:flex-end;gap:1rem}
.cd-num{font-family:var(--display);font-size:clamp(7rem,15vw,13.5rem);line-height:.74;letter-spacing:-.04em;color:var(--madeira);min-width:.62em;transition:color .5s}
.cd-num.e-dela{color:var(--pink)}
.cd-conta span{padding-bottom:.4rem;font-size:.76rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--madeira-texto);line-height:1.6}
.cd-lista{list-style:none;padding:0;position:relative}
.cd-lista::before{content:"";position:absolute;left:3.6rem;top:3rem;bottom:3rem;border-left:1px dashed rgba(42,28,22,.28)}
.cd-lista li{position:relative;display:grid;grid-template-columns:7.2rem 1fr;gap:1.6rem;align-items:center;min-height:clamp(7rem,17vh,9.6rem);padding:1rem 0}
.cd-lista svg{width:var(--w,6.4rem);justify-self:center;transform:translateX(var(--x,0)) rotate(var(--r,0deg));transition:transform .7s var(--curva)}
.cd-lista .cd-n{position:absolute;left:-1.4rem;top:50%;transform:translateY(-50%);font-family:var(--display);font-weight:400;font-size:1rem;color:var(--madeira-texto)}
.cd-lista li.cd-dela .cd-n{color:var(--madeira-texto);text-decoration:underline;text-decoration-color:var(--pink);text-decoration-thickness:2px;text-underline-offset:.2em}
.cd-lista .cd-t{font-family:var(--display);font-size:clamp(1.6rem,2.9vw,2.7rem);line-height:1.06;letter-spacing:-.012em;color:var(--tinta);transition:color .7s}
/* ainda não esquentou: mais claro, mas legível (4:1 em letra grande) */
.js .cd-lista li:not(.quente) .cd-t{color:color-mix(in oklab,var(--tinta) 58%,var(--creme))}
.cd-lista li.aqui svg{transform:translateX(calc(var(--x,0px) - 6px)) translateY(-5px) rotate(var(--r,0deg))}
.cd-ela{margin-top:.9rem;max-width:38ch}
.cd-ela em{display:inline-block;font-style:normal;font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#fff;background:var(--pink);padding:.3rem .7rem;border-radius:99px}
.cd-ela p{margin-top:.7rem;font-size:1rem;line-height:1.55;color:var(--tinta-2)}
.cd-ela .sec{display:inline-block;margin-top:.7rem}
/* o pouso: a prateleira atravessa a seção, com as seis deitadas nela. Chegam frias e acendem em fila. */
.cd-pouso{max-width:var(--largura);margin:clamp(3rem,8vw,6rem) auto 0}
.cd-pouso blockquote{max-width:24ch;font-family:var(--display);font-size:clamp(1.5rem,3vw,2.8rem);line-height:1.1;letter-spacing:-.012em;text-wrap:balance}
.cd-pouso cite{display:block;margin-top:1rem;font-family:var(--sans);font-style:normal;font-size:.84rem;letter-spacing:0;color:var(--tinta-2)}
.cd-prat{position:relative;margin-top:clamp(2.2rem,5vw,4rem)}
.cd-fila{list-style:none;margin:0;padding:0 clamp(.2rem,3vw,3rem);display:grid;grid-template-columns:repeat(6,1fr);align-items:end;position:relative;z-index:1}
.cd-fila li{position:relative;display:grid;justify-items:center}
.cd-fila svg{width:min(78%,8.4rem);height:auto;margin-bottom:-.55rem;transition:transform .9s var(--pouso);transition-delay:calc(var(--i) * 130ms)}
.cd-fila .calor{transition-delay:calc(var(--i) * 130ms + 200ms)!important}
.cd-fila b{position:absolute;top:calc(100% + 1rem);font-family:var(--display);font-weight:400;font-size:1.5rem;line-height:1;color:var(--madeira)}
.cd-fila li.cd-dela b{color:var(--pink)}
.js .cd-prat:not(.visto) .cd-fila svg{transform:translateY(-1.6rem)}
.cd-leg{margin-top:3.4rem;display:grid;grid-template-columns:4fr 1fr 1fr;padding:0 clamp(.2rem,3vw,3rem);font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--tinta-2)}
.cd-leg span{padding-top:.7rem;border-top:1px solid rgba(42,28,22,.3)}
.cd-leg .cd-dela{color:var(--tinta);border-top:2px solid var(--pink);margin:0 .9rem;text-align:center}
@media (max-width:860px){
  .cuidados{border-radius:1.6rem 1.6rem 0 0;margin-top:-1.6rem}
  .cd-dentro{grid-template-columns:1fr;gap:1.2rem}
  .cd-cab{position:static}
  .cd-conta{display:none}
  .cd-lista::before{left:2.4rem;top:2.4rem;bottom:2.4rem}
  .cd-lista li{grid-template-columns:4.8rem 1fr;gap:1rem;min-height:0;padding:1.15rem 0}
  .cd-lista svg{width:calc(var(--w,6.4rem) * .68)}
  .cd-lista .cd-n{position:static;transform:none;display:block;font-size:1.5rem;line-height:1;color:var(--madeira);margin-bottom:.2rem}
  .cd-lista li.cd-dela .cd-n{color:var(--pink);text-decoration:none}
  .cd-lista .cd-t{font-size:clamp(1.4rem,6.2vw,1.8rem)}
  .cd-pouso{margin-top:2.4rem}
  .cd-fila{padding:0}
  .cd-fila svg{width:96%}
  .cd-fila b{top:calc(100% + .8rem)}
  .cd-leg{padding:0;margin-top:2.6rem;font-size:.6rem;letter-spacing:.08em}
  .cd-leg .cd-dela{margin:0 .35rem}
}
