/* pa · O que dizem os pacientes (claro, pêssego) */
.pa-secao {
  --pa-arco: clamp(40px, 7vw, 110px);
  --pa-texto-rose: #85412f;           /* rose-ouro escurecido: AA sobre o pêssego */
  position: relative;
  margin-top: calc(-1 * var(--pa-arco));   /* "elevação": sobe sobre o fim da seção escura de cima */
  padding: calc(var(--secao-pad) + var(--pa-arco) * .35) 0 calc(var(--secao-pad) * .7);
  border-radius: 50% 50% 0 0 / var(--pa-arco) var(--pa-arco) 0 0;  /* topo em arco, como o aro do cartão */
  background: linear-gradient(180deg in oklab, #f2d2c1 0%, var(--pessego) 30%, color-mix(in oklab, var(--pessego) 45%, var(--nude)) 78%, var(--nude) 100%);
  color: var(--tinta);
  overflow: clip;
  isolation: isolate;
  z-index: 1;
  box-shadow: 0 -30px 60px -30px rgb(42 11 23 / .45);
}
/* fio de luz rosé na borda do arco */
.pa-secao::before {
  content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  border-top: 1px solid color-mix(in oklch, #fff3ec 80%, transparent);
}
.pa-luz { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.pa-luz i { position: absolute; border-radius: 50%; }
.pa-luz i:first-child { width: 70vmax; height: 70vmax; left: -18%; top: -10%;
  background: radial-gradient(closest-side in oklch, #fcefe7, color-mix(in oklch, #fcefe7 0%, transparent)); opacity: .85; }
.pa-luz i:last-child { width: 60vmax; height: 60vmax; right: -20%; top: 32%;
  background: radial-gradient(closest-side in oklch, color-mix(in oklch, var(--rose) 38%, transparent), transparent); }

/* topo: título + nota */
.pa-topo { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 40px 64px; align-items: end; }
.pa-rotulo { color: var(--pa-texto-rose); }
.pa-titulo { color: var(--vinho-noite); }
.pa-titulo .fino { display: block; padding-left: .7em;
  background-image: linear-gradient(100deg in oklab, #6e3324 0%, #8e4a39 30%, #a9604d 48%, #c4826b 54%, #94503f 64%, #6e3324 100%); }
.pa-nota { display: flex; align-items: center; gap: 22px; padding-bottom: 10px; }
.pa-aro { position: relative; display: grid; place-items: center; width: clamp(150px, 15vw, 220px); aspect-ratio: 4 / 5; border-radius: 50%;
  border: 1px solid color-mix(in oklch, var(--rose-ouro) 70%, transparent);
  box-shadow: inset 0 0 0 7px color-mix(in oklch, #fff3ec 45%, transparent), inset 0 0 0 8px color-mix(in oklch, var(--rose-ouro) 35%, transparent);
  background: radial-gradient(closest-side in oklab, color-mix(in oklab, #fff6f1 70%, transparent), transparent); }
.pa-numero { font-family: var(--f-display); font-weight: 230; font-variation-settings: "wdth" 100; font-size: clamp(64px, 6.6vw, 104px); line-height: .8; transform: translateY(.04em); letter-spacing: -.02em; color: var(--vinho); }
.pa-nota-texto { display: grid; gap: 2px; border-left: 1px solid color-mix(in oklch, var(--rose-ouro) 45%, transparent); padding-left: 22px; }
.pa-estrelas { color: var(--cobre); letter-spacing: .18em; font-size: 20px; line-height: 1.2; }
.pa-conta { font-size: 18px; color: var(--tinta); }
.pa-link { display: inline; justify-self: start; margin-top: 6px; color: var(--vinho); font-weight: 500; font-size: 18px; text-decoration: none;
  border-bottom: 1px solid color-mix(in oklch, var(--vinho) 40%, transparent); padding-bottom: 2px; transition: border-color .3s; }
.pa-link:hover { border-color: var(--vinho); }
.pa-link svg { width: 15px; height: 15px; margin-left: 4px; vertical-align: -1px; fill: none; stroke: currentColor; stroke-width: 1.8; }

/* a frase maior */
.pa-maior { margin: clamp(64px, 8vw, 120px) 0 0; }
.pa-maior blockquote { margin: 0; }
.pa-maior blockquote p {
  font-family: var(--f-titulo); font-style: italic; font-weight: 300;
  font-size: clamp(34px, 4.7vw, 76px); line-height: 1.08; letter-spacing: -.01em; color: var(--vinho-noite);
  max-width: 17.5em; text-wrap: balance;
}
.pa-assina { display: flex; align-items: center; gap: 18px; margin-top: 18px; }
.pa-fio { width: min(760px, 70vw); height: auto; flex: none; overflow: visible; }
.pa-fio path { fill: none; stroke: url(#pa-metal); stroke-width: 3.4; stroke-linecap: round; stroke-linejoin: round; }
.pa-assina figcaption, .pa-quem { font-size: 13px; font-weight: 500; letter-spacing: .2em; text-transform: uppercase; color: var(--pa-texto-rose); }
.pa-assina figcaption { white-space: nowrap; transform: translateY(-6px); }

/* mural: a palavra de cada paciente em destaque, em zigue-zague */
.pa-mural { list-style: none; margin: clamp(80px, 10vw, 150px) 0 0; padding: 0;
  display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: clamp(28px, 3.4vw, 56px); row-gap: clamp(40px, 4vw, 64px); }
.pa-mural li { min-width: 0; }
.pa-mural li:nth-child(3n+1) { grid-column: 1 / 5; }
.pa-mural li:nth-child(3n+2) { grid-column: 5 / 9; margin-top: 110px; }
.pa-mural li:nth-child(3n) { grid-column: 9 / 13; margin-top: 40px; }
.pa-palavra { font-family: var(--f-display); font-weight: 600; font-variation-settings: "wdth" 106; font-size: clamp(34px, 3.3vw, 52px); line-height: 1; color: var(--vinho); text-wrap: balance; }
.pa-palavra.pa-fina { font-weight: 230; font-variation-settings: "wdth" 100;
  background: linear-gradient(100deg in oklab, #6e3324 0%, #8e4a39 35%, #a9604d 50%, #8e4a39 65%, #6e3324 100%); -webkit-background-clip: text; background-clip: text; color: transparent;
  padding-bottom: .12em; margin-bottom: -.12em; }
.pa-mural blockquote { margin: 18px 0 0; padding-left: 18px; border-left: 1px solid color-mix(in oklch, var(--rose-ouro) 45%, transparent);
  font-family: var(--f-titulo); font-style: italic; font-weight: 300; font-size: 20px; line-height: 1.5; color: var(--tinta); max-width: 26em; }
.pa-quem { margin-top: 12px; padding-left: 18px; }

.pa-conta-temas { margin: clamp(80px, 9vw, 130px) auto 0; display: flex; align-items: baseline; justify-content: center; flex-wrap: wrap; gap: 4px 20px; text-align: center;
  padding-top: 34px; border-top: 1px solid color-mix(in oklch, var(--rose-ouro) 40%, transparent); max-width: 980px; }
.pa-conta-temas strong { font-family: var(--f-display); font-weight: 600; font-variation-settings: "wdth" 106; font-size: clamp(40px, 4.4vw, 64px); line-height: 1; color: var(--vinho); white-space: nowrap; }
.pa-conta-temas span { font-family: var(--f-titulo); font-style: italic; font-weight: 300; font-size: clamp(22px, 2.2vw, 30px); line-height: 1.25; color: var(--tinta); }

/* fio se desenhando (só com JS e sem movimento reduzido) */
.pa-fio.pa-anima path { transition: stroke-dashoffset 2.2s cubic-bezier(.45,.05,.25,1) .3s; }

@media (max-width: 1100px) {
  .pa-mural li:nth-child(n) { grid-column: span 6; margin-top: 0; }
  .pa-mural li:nth-child(even) { margin-top: 70px; }
  .pa-topo { grid-template-columns: 1fr; }
  .pa-nota { justify-self: start; }
}
@media (max-width: 860px) {
  .pa-nota { gap: 16px; }
  .pa-aro { width: 118px; }
  .pa-nota-texto { padding-left: 16px; }
  .pa-mural { grid-template-columns: 1fr; }
  .pa-mural li { grid-column: 1 !important; margin-top: 0 !important; }
  .pa-mural li:nth-child(even) { padding-left: 12%; }
  .pa-assina { flex-wrap: wrap; gap: 4px 14px; }
  .pa-fio { width: min(100%, 420px); }
  .pa-assina figcaption { transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .pa-fio path { stroke-dasharray: none !important; stroke-dashoffset: 0 !important; }
}
@media (max-width: 400px) {
  .pa-nota { gap: 12px; }
  .pa-aro { width: 98px; }
  .pa-numero { font-size: 46px; }
  .pa-nota-texto { padding-left: 12px; }
  .pa-link { white-space: nowrap; }
}
