/* consulta · Da primeira consulta ao pós */
.cs-secao { background: var(--hd-papel); padding: var(--wf-secao) var(--wf-margem); overflow: hidden; }
.cs-dentro { max-width: var(--wf-largura); margin: 0 auto; }

.cs-cabeca { display: grid; grid-template-columns: 1.15fr 1fr; gap: 1.6rem 4rem; align-items: end; }
.cs-titulo { margin-top: 1.1rem; }
.cs-intro { color: var(--hd-tinta-suave); max-width: 30em; }

.cs-momentos { list-style: none; padding: 0; margin: clamp(2.2rem, 5vw, 4.5rem) 0 0; }

/* três momentos: a frase do Ricardo em três partes, descendo em degraus */
.cs-momento { display: grid; grid-template-columns: clamp(11rem, 21vw, 19rem) minmax(0, 1fr) clamp(13rem, 20vw, 17rem); column-gap: clamp(1.4rem, 3vw, 3rem); align-items: start; margin-left: calc(var(--n, 0) * 6.5%); }
.cs-momento + .cs-momento { margin-top: clamp(2.8rem, 5vw, 4.6rem); }
.cs-forma { display: block; width: 100%; margin-top: .4rem; }
.cs-corpo { position: relative; margin-left: clamp(-4.5rem, -5vw, -2rem); }
.cs-rotulo { display: flex; align-items: baseline; gap: .7rem; font-size: var(--wf-mini); font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--hd-tinta-suave); }
.cs-rotulo i { font-family: var(--hd-serifa); font-size: 1.5rem; letter-spacing: 0; color: var(--wf-laranja-texto); line-height: 1; }
.cs-frag { font-family: var(--hd-serifa); font-weight: 400; font-size: clamp(2.5rem, 1rem + 5.2vw, 5.8rem); line-height: .96; letter-spacing: -.022em; margin-top: .35rem; }
.cs-frag em { font-style: italic; color: var(--wf-laranja-texto); }
.cs-fonte { margin-top: .8rem; font-size: var(--wf-mini); color: var(--hd-tinta-suave); }
.cs-como { margin-top: 1.3rem; padding-left: clamp(2rem, 5vw, 4.5rem); color: var(--hd-tinta-suave); max-width: 36em; }
.cs-momento .cs-dela { margin: 1.1rem 0 0; padding-left: clamp(2rem, 5vw, 4.5rem); max-width: 40em; }
.cs-dela blockquote, .cs-paciente blockquote, .cs-rejane blockquote { margin: 0; }
.cs-dela p { font-family: var(--hd-serifa); font-size: clamp(1.25rem, 1.08rem + .55vw, 1.6rem); line-height: 1.28; }
.cs-dela figcaption, .cs-paciente figcaption, .cs-rejane figcaption { margin-top: .55rem; font-size: var(--wf-mini); color: var(--hd-tinta-suave); }
.cs-dela figcaption::before { content: ""; display: inline-block; width: 1.4rem; height: 1px; background: var(--hd-laranja); vertical-align: middle; margin-right: .6rem; }

/* a voz de quem passou: nota de margem, sem cartão */
.cs-paciente { margin: 0; align-self: end; padding-top: 1rem; border-top: 1px solid var(--hd-fio); }
.cs-paciente p { font-size: 1rem; line-height: 1.55; margin-top: .45rem; }
.cs-estrelas { color: var(--hd-laranja); letter-spacing: .14em; font-size: .9rem; }

/* quarto momento: fecha o ciclo com a pergunta do hero */
.cs-m4 { margin-top: clamp(3.2rem, 6vw, 5.5rem); position: relative; isolation: isolate; display: grid; grid-template-columns: 1.15fr 1fr; align-items: center; gap: 2rem; padding: clamp(1.7rem, 5vw, 4.5rem); border-radius: clamp(28px, 4vw, 56px); overflow: hidden;
  background:
    radial-gradient(55% 75% at 78% 58% in oklab, color-mix(in oklab, var(--hd-pessego) 90%, transparent), transparent),
    radial-gradient(70% 90% at 6% 0% in oklab, color-mix(in oklab, var(--hd-nevoa) 75%, transparent), transparent),
    var(--hd-papel-claro);
  box-shadow: 0 40px 80px -60px rgba(120, 70, 40, .55); }
.cs-m4 .cs-frag { font-size: clamp(2.5rem, 1rem + 4.6vw, 5.2rem); }
.cs-m4 .cs-como { padding-left: 0; max-width: 30em; }
.cs-rejane { margin: 1.8rem 0 0; }
.cs-rejane p { font-family: var(--hd-serifa); font-style: italic; font-size: clamp(1.45rem, 1.1rem + 1.2vw, 2.2rem); line-height: 1.18; max-width: 20em; }
.cs-m4 .cs-dela { margin: 1.6rem 0 0; max-width: 30em; }
.cs-volta { margin-top: 1.4rem; }
.cs-palco { text-align: center; }
.cs-forma-fecho { display: block; width: 100%; transform-origin: 45% 92%; animation: cs-respira 9s ease-in-out infinite alternate; }
@keyframes cs-respira { from { transform: scale(1, 1); } to { transform: scale(1.025, .975); } }
.cs-palco p { position: relative; margin-top: 1.6rem; padding-top: 2.4rem; font-family: var(--hd-serifa); font-style: italic; font-size: 1.1rem; letter-spacing: .04em; color: var(--hd-tinta-suave); }
.cs-palco p::before { content: ""; position: absolute; left: 50%; top: 0; width: 1px; height: 1.8rem; background: var(--hd-laranja); opacity: .7; }

.cs-pratico { margin-top: clamp(2.2rem, 4.5vw, 3.6rem); display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.5rem 2rem; }
.cs-fatos { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 1rem 0; }
.cs-fatos li { padding: .2rem 2.2rem; border-left: 1px solid var(--hd-fio); }
.cs-fatos li:first-child { padding-left: 0; border-left: 0; }
.cs-fatos b { display: block; font-family: var(--hd-serifa); font-weight: 400; font-size: 1.35rem; line-height: 1.2; }
.cs-fatos span { font-size: var(--wf-mini); color: var(--hd-tinta-suave); }

@media (max-width: 1080px) {
  .cs-momento { grid-template-columns: clamp(8rem, 21vw, 15rem) minmax(0, 1fr); margin-left: calc(var(--n, 0) * 4%); }
  .cs-paciente { grid-column: 2; margin-top: 1.4rem; margin-left: clamp(0rem, 1vw, 1rem); max-width: 30em; }
}
@media (max-width: 700px) {
  .cs-cabeca { grid-template-columns: 1fr; }
  .cs-momento { grid-template-columns: 1fr; margin-left: 0; }
  .cs-forma { width: 46%; margin: 0 0 -1.6rem calc(var(--n, 0) * 13%); }
  .cs-corpo { margin-left: 0; }
  .cs-como, .cs-momento .cs-dela { padding-left: 0; }
  .cs-paciente { grid-column: 1; margin-left: 0; }
  .cs-m4 { grid-template-columns: 1fr; }
  .cs-palco { order: -1; }
  .cs-forma-fecho { width: 78%; margin: 0 auto; }
  .cs-palco p { display: none; }
  .cs-fatos { flex-direction: column; }
  .cs-fatos li { padding: .9rem 0 0; border-left: 0; border-top: 1px solid var(--hd-fio); }
  .cs-fatos li:first-child { border-top: 0; padding-top: 0; }
  .cs-pratico { display: grid; }
  .cs-pratico .wf-botao { justify-content: space-between; }
}
