/* ============================================================
   TRILHA — elemento-assinatura: um fio que atravessa a página
   ============================================================ */
.trilha{
  position:fixed; left:clamp(1.6rem,2.6vw,2.9rem); top:0; bottom:0; width:1px; z-index:90;
  background:var(--linha);
}
.trilha__preenche{
  position:absolute; top:0; left:0; width:100%; height:0;
  background:var(--vinho); opacity:.55;
}
.trilha__marcos{ position:absolute; inset:0; }
.trilha__m{
  position:absolute; left:50%; transform:translate(-50%,-50%);
  width:11px; height:11px; padding:0; border:0; background:none; cursor:pointer;
  display:grid; place-items:center;
}
.trilha__m::after{
  content:""; width:5px; height:5px; border-radius:50%;
  background:var(--areia); border:1px solid var(--linha-forte);
  transition:all .3s var(--ease);
}
.trilha__m[aria-current="true"]::after{ background:var(--vinho); border-color:var(--vinho); transform:scale(1.5); }
.trilha__m:hover::after{ border-color:var(--vinho); }
.trilha__rot{
  position:absolute; left:1.1rem; top:50%; transform:translateY(-50%) translateX(-4px);
  font-size:.62rem; letter-spacing:.18em; text-transform:uppercase; color:var(--vinho);
  white-space:nowrap; opacity:0; pointer-events:none; transition:all .3s var(--ease);
}
.trilha__m:hover .trilha__rot, .trilha__m:focus-visible .trilha__rot{ opacity:1; transform:translateY(-50%) translateX(0); }
@media (max-width:1240px){ .trilha{ display:none; } }

/* ============================================================
   HERO
   ============================================================ */
.hero{ padding-top:clamp(3rem,7vw,6rem); padding-bottom:clamp(4.5rem,9vw,8rem); }
.hero-grid{ display:grid; grid-template-columns:repeat(12,1fr); gap:clamp(1.5rem,3vw,3rem); align-items:start; }
.hero-copy{ grid-column:1 / span 7; }
.hero-copy h1 em{ color:var(--vinho); }
.hero-copy .lead{ margin-top:clamp(1.6rem,2.6vw,2.2rem); max-width:46ch; }
.hero-acoes{ display:flex; flex-wrap:wrap; gap:.85rem; margin-top:clamp(2rem,3.4vw,2.9rem); }

.hero-fig{ grid-column:9 / span 4; position:relative; margin-top:clamp(1rem,4vw,4.5rem); }
.hero-fig__blob{
  position:absolute; inset:-14% -18% auto -22%; aspect-ratio:1; z-index:0;
  background:url("https://d8j0ntlcm91z4.cloudfront.net/user_3I6D1mPKRb7x23d4cgv4KnTKgcv/hf_20260818_182305_071c16f6-2a5c-4125-ac68-d5f9fa95c455_min.webp") center/contain no-repeat;
  opacity:.34; mix-blend-mode:multiply; pointer-events:none;
}
.hero-fig__foto{
  position:relative; z-index:1; margin:0;
  aspect-ratio:4/5; overflow:hidden; border-radius:50% 50% 3px 3px / 30% 30% 3px 3px;
  background:var(--areia-3);
}
.hero-fig__foto img{ width:100%; height:100%; object-fit:cover; object-position:center top; }
.hero-fig figcaption{
  position:relative; z-index:1;
  margin-top:1.1rem; font-size:.72rem; letter-spacing:.16em; text-transform:uppercase;
  color:var(--tinta-40); display:flex; justify-content:space-between; gap:1rem;
}
.hero-selo{
  position:absolute; z-index:2; left:-2.6rem; bottom:2.5rem;
  background:var(--ameixa); color:var(--areia);
  font-size:.66rem; letter-spacing:.2em; text-transform:uppercase;
  padding:.75rem 1.1rem; border-radius:2px; line-height:1.5;
}
@media (max-width:1000px){
  .hero-copy{ grid-column:1 / -1; }
  .hero-fig{ grid-column:1 / span 8; margin-top:3.5rem; }
  .hero-selo{ left:auto; right:-1rem; }
}
@media (max-width:640px){
  .hero-fig{ grid-column:1 / -1; }
  .hero-selo{ right:0; bottom:auto; top:-1.4rem; }
}

/* ============================================================
   FRAGMENTOS — "Talvez você tenha chegado até aqui porque…"
   ============================================================ */
.frag{ background:var(--areia-2); position:relative; overflow:hidden; }
.frag-grid{ display:grid; grid-template-columns:repeat(12,1fr); gap:clamp(2rem,4vw,4rem); }
.frag-head{ grid-column:1 / span 6; }
.frag-lista{ grid-column:1 / span 7; margin:clamp(3rem,5vw,4.5rem) 0 0; padding:0; list-style:none; }
.frag-lista li{
  font-family:var(--serif); font-weight:300; font-style:italic;
  font-size:clamp(1.35rem,2.5vw,2.05rem); line-height:1.32; color:var(--ameixa);
  padding:clamp(1.4rem,2.3vw,1.9rem) 0; border-top:1px solid var(--linha);
  max-width:26ch;
}
.frag-lista li:nth-child(2){ margin-left:clamp(0rem,4vw,3.5rem); }
.frag-lista li:nth-child(3){ margin-left:clamp(0rem,8vw,7rem); }
.frag-lista li:nth-child(4){ margin-left:clamp(0rem,3vw,2.5rem); }
.frag-fig{ grid-column:9 / span 4; align-self:end; margin:0; }
.frag-fig img{ aspect-ratio:4/5; object-fit:cover; width:100%; border-radius:3px; }
.frag-fecho{
  grid-column:9 / span 4; margin-top:1.6rem;
  font-size:.94rem; color:var(--tinta-60); line-height:1.65;
}
@media (max-width:1000px){
  .frag-head, .frag-lista{ grid-column:1 / -1; }
  .frag-fig{ grid-column:1 / span 7; margin-top:3rem; }
  .frag-fecho{ grid-column:1 / -1; }
}

/* ============================================================
   PSICOTERAPIA
   ============================================================ */
.psi-grid{ display:grid; grid-template-columns:repeat(12,1fr); gap:clamp(2rem,4vw,4rem); align-items:start; }
.psi-head{ grid-column:1 / span 6; }
.psi-head .lead{ margin-top:1.8rem; }
.psi-fig{ grid-column:8 / span 6; margin:clamp(0rem,4vw,4rem) calc(var(--pad) * -1) 0 0; }
.psi-fig img{ width:100%; aspect-ratio:16/10; object-fit:cover; border-radius:3px 0 0 3px; }
.psi-fig figcaption{ margin-top:.9rem; font-size:.74rem; color:var(--tinta-40); letter-spacing:.04em; }

.demandas{ margin:clamp(4.5rem,8vw,7rem) 0 0; padding:0; list-style:none; grid-column:1 / -1; }
.demandas li{
  display:grid; grid-template-columns:minmax(0,10rem) minmax(0,1fr);
  gap:clamp(1rem,3vw,3rem); align-items:baseline;
  padding:clamp(1.8rem,3vw,2.6rem) 0; border-top:1px solid var(--linha);
}
.demandas li:last-child{ border-bottom:1px solid var(--linha); }
.demandas h3{ color:var(--ameixa); }
.demandas p{ color:var(--tinta-60); max-width:56ch; margin:0; }
@media (max-width:820px){
  .psi-head{ grid-column:1 / -1; }
  .psi-fig{ grid-column:1 / -1; margin-right:calc(var(--pad) * -1); }
  .demandas li{ grid-template-columns:1fr; gap:.6rem; }
}

/* ============================================================
   FAIXA DE RESPIRO — citação sobre imagem
   ============================================================ */
.faixa{
  position:relative; isolation:isolate;
  padding-block:clamp(6rem,12vw,10rem);
  display:grid; place-items:center; text-align:center;
}
.faixa::before{
  content:""; position:absolute; inset:0; z-index:-3;
  background:url("https://d8j0ntlcm91z4.cloudfront.net/user_3I6D1mPKRb7x23d4cgv4KnTKgcv/hf_20260818_182305_ba37fb74-dbf3-465f-a945-ae31c821d2f2_min.webp") center/cover no-repeat;
}
.faixa::after{
  content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(180deg, rgba(51,16,31,.80), rgba(71,24,47,.72));
}
.faixa blockquote{
  margin:0; max-width:22ch; padding-inline:var(--pad);
  font-size:clamp(1.7rem,3.6vw,3rem); line-height:1.18;
  color:var(--areia); font-style:italic; font-weight:200;
}
.faixa blockquote span{
  display:block; margin-top:1rem; font-size:.86em; color:var(--rosa);
}