/* Seção 6 · primeira — Sua primeira consulta (areia). Prefixo pc-
   Gesto: o fio da visita se desenha pelos seis passos, quebrando de linha como um texto;
   os pontos acendem quando ele passa. */

.pc-sec { --pc-gut: clamp(1.6rem, 1rem + 1.6vw, 2.6rem); }

.pc-cab { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: clamp(2rem, 1rem + 4vw, 5rem); align-items: end; }
.pc-voz { margin: 0 0 .3rem; padding-left: 1.4rem; border-left: 1px solid var(--madeira); }
.pc-voz p { margin: 0 0 .8rem; font-family: var(--serif); font-size: clamp(1.35rem, 1.05rem + .8vw, 1.75rem); line-height: 1.3; text-wrap: pretty; }
.pc-voz cite, .pc-mini cite { font-style: normal; font-size: var(--t-mini); color: var(--cafe-suave); }

/* a trilha: svg absoluto desenhado pelo js por cima da grade */
.pc-trilha { position: relative; margin-top: clamp(4.5rem, 3rem + 4vw, 7rem); }
.pc-noite { position: absolute; z-index: 0; top: var(--pc-nt, 50%); bottom: -3.5rem; left: calc(-1 * min(4.5rem, var(--margem))); right: calc(-1 * min(4.5rem, var(--margem)));
  background: var(--noite); border-radius: 140px var(--raio) var(--raio) var(--raio); box-shadow: 0 40px 80px -40px rgb(38 27 20 / .6); }
.pc-noite::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  background: radial-gradient(60% 80% at 18% 0% in oklab, rgb(240 194 127 / .10), transparent 70%); }
.pc-passos { position: relative; z-index: 1; }
.pc-svg { z-index: 2; position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.pc-svg path { fill: none; stroke-width: 1.2; stroke-linecap: round; stroke-linejoin: round; }
.pc-trilho-base { stroke: color-mix(in oklab, var(--madeira) 30%, transparent); }
.pc-trilho { stroke: var(--ambar); filter: drop-shadow(0 0 4px rgb(240 194 127 / .7)); }

.pc-passos { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: clamp(2rem, 1rem + 2.5vw, 3.5rem); row-gap: 9.5rem; }
.pc-passo { position: relative; padding-top: 2.2rem; }
.pc-grupo { position: absolute; left: 0; top: -2.9rem; font-size: var(--t-mini); letter-spacing: .14em; text-transform: uppercase; color: var(--madeira-escura); white-space: nowrap; }
.pc-pt { position: absolute; left: 0; top: 0; width: 15px; height: 15px; margin: -7.5px 0 0 -7.5px; border-radius: 50%;
  background: var(--areia-clara); border: 1px solid var(--madeira); transition: background .6s, border-color .6s, box-shadow .9s, scale .6s var(--suave); }
.pc-dia .pc-pt { width: 19px; height: 19px; margin: -9.5px 0 0 -9.5px; }
.pc-aceso .pc-pt, html:not(.js) .pc-pt { background: var(--ambar); border-color: var(--ambar); box-shadow: 0 0 0 5px rgb(192 130 58 / .16), 0 0 20px 4px rgb(240 194 127 / .6); }
.pc-passo:not(.pc-dia).pc-aceso .pc-pt { background: var(--madeira); border-color: var(--madeira); box-shadow: 0 0 0 4px rgb(138 106 85 / .14); }

.pc-num { display: block; font-family: var(--serif); font-size: clamp(2.6rem, 1.8rem + 2vw, 3.6rem); line-height: 1; letter-spacing: -.03em; color: var(--madeira); margin-bottom: .5rem; }
/* o dia da consulta: a faixa escura, as paradas do hero */
.pc-dia { color: var(--tinta-noite); }
.pc-dia .pc-grupo { color: var(--ambar-luz); }
.pc-dia .pc-num { color: var(--tinta-noite-suave); }
.pc-dia .pc-h3 { font-size: clamp(1.75rem, 1.3rem + 1.1vw, 2.3rem); }
.pc-passo.pc-dia > p { color: var(--tinta-noite-suave); }
.pc-dia .pc-mini p { color: var(--tinta-noite); }
.pc-dia .pc-mini cite { color: var(--tinta-noite-suave); }
.pc-dia:not(.pc-aceso) .pc-pt { background: var(--noite-2); border-color: var(--ambar-luz); }
.pc-h3 { margin: 0 0 .6rem; font-family: var(--serif); font-weight: 400; font-size: clamp(1.45rem, 1.15rem + .7vw, 1.8rem); line-height: 1.15; letter-spacing: -.01em; }
.pc-passo > p { margin: 0; font-size: var(--t-corpo); line-height: 1.6; color: var(--cafe-suave); text-wrap: pretty; }
.pc-tel { white-space: nowrap; color: var(--cafe); }
.pc-mini { margin: 1.2rem 0 0; }
.pc-mini p { margin: 0 0 .35rem; font-family: var(--serif); font-size: 1.125rem; line-height: 1.4; color: var(--cafe); }

/* convênios + ação */
.pc-painel { margin-top: clamp(5rem, 3rem + 5vw, 8rem); display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: 0;
  background: var(--travertino-claro); border-radius: 140px var(--raio) var(--raio) var(--raio); box-shadow: 0 24px 50px -28px rgb(58 42 32 / .45); }
.pc-conv { padding: clamp(2.5rem, 2rem + 2vw, 4rem) clamp(2rem, 1rem + 3vw, 4rem) clamp(2.5rem, 2rem + 2vw, 3.5rem) clamp(3rem, 2rem + 4vw, 6rem); }
.pc-conv-tit { margin: 0 0 1.2rem; font-weight: 400; color: var(--madeira-escura); }
.pc-lista { list-style: none; margin: 0; padding: 0; columns: 2; column-gap: 2.5rem; font-family: var(--serif); font-size: clamp(1.35rem, 1.1rem + .6vw, 1.7rem); line-height: 1.25; }
.pc-lista li { display: flex; align-items: center; gap: .7rem; padding: .3rem 0; break-inside: avoid; }
.pc-lista li::before { content: ""; flex: none; width: 6px; height: 6px; border-radius: 50%; background: var(--ambar); }
.pc-part { margin: 1.2rem 0 0; font-size: var(--t-corpo); }
.pc-aviso { margin: .5rem 0 0; font-size: 1rem; color: var(--cafe-suave); }
.pc-acao { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 1.2rem; padding: 3rem clamp(2rem, 1rem + 3vw, 4rem); border-left: 1px solid var(--linha); }
.pc-acao-tit { margin: 0; font-family: var(--serif); font-weight: 400; font-size: clamp(1.75rem, 1.3rem + 1.1vw, 2.3rem); line-height: 1.12; letter-spacing: -.01em; text-wrap: balance; }
.pc-acao-txt { margin: -.4rem 0 .4rem; color: var(--cafe-suave); }
.pc-acao .ligar { min-height: 48px; display: inline-flex; align-items: center; }

/* ---------- celular e tablet ---------- */
@media (max-width: 860px) {
  .pc-cab { display: block; }
  .pc-voz { margin-top: 2.2rem; }
  .pc-trilha { margin-top: 4.5rem; }
  .pc-passos { display: block; padding-left: var(--pc-gut); }
  .pc-passo { padding-top: 0; padding-left: .6rem; margin-bottom: 3rem; }
  .pc-passo:last-child { margin-bottom: 0; }
  .pc-pt { left: calc(-1 * var(--pc-gut) + 6px); top: 1rem; }
  .pc-passo:has(.pc-grupo) .pc-pt { top: 3.55rem; }
  .pc-grupo { position: static; display: block; margin: 0 0 1.2rem; white-space: normal; }
  .pc-dia:nth-child(4) { margin-top: 4rem; }
  .pc-num { font-size: 2rem; }
  .pc-passo > p { font-size: 1.0625rem; }
  .pc-painel { grid-template-columns: 1fr; border-radius: 80px 22px 22px 22px; margin-left: calc(-.5 * var(--margem)); margin-right: calc(-.5 * var(--margem)); }
  .pc-conv { padding: 3rem 1.5rem 2rem 1.8rem; }
  .pc-acao { border-left: 0; border-top: 1px solid var(--linha); padding: 2rem 1.5rem 2.4rem 1.8rem; align-items: stretch; }
  .pc-acao .botao { justify-content: center; }
  .pc-acao .ligar { align-self: center; }
  .pc-lista { font-size: 1.125rem; columns: 2; column-gap: 1rem; }
  .pc-lista li { gap: .5rem; align-items: baseline; }
  .pc-lista li::before { translate: 0 -.2em; }
  .pc-noite { left: calc(-1 * var(--margem)); right: calc(-1 * var(--margem)); border-radius: 80px 0 0 0; bottom: -3rem; }
}
