/* pc · Pacientes — anotações de caneta em tiras de papel milimetrado */
.pc-malha { position: absolute; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; }
.pc-malha span { position: absolute; border-radius: 50%; }
.pc-m1 { width: 70vmax; height: 70vmax; right: -16vmax; top: -16vmax;
  background: radial-gradient(closest-side in oklab, rgb(241 239 234 / .14), rgb(120 150 132 / .06) 55%, transparent); }
.pc-m2 { width: 80vmax; height: 80vmax; left: -34vmax; bottom: -40vmax;
  background: radial-gradient(closest-side in oklab, rgb(1 30 23 / .9), transparent); }

.pc-grade { position: relative; display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: clamp(2rem, 4vw, 4rem); align-items: start; }

/* cabeça: título + contagem */
.pc-cab { grid-column: 1; grid-row: 1; position: relative; z-index: 2; }
.pc-cab .rotulo { margin: 0 0 1.3rem; }
.pc-titulo .ts-sobre { max-width: 26ch; }
.pc-titulo .ts-forte { color: var(--creme); font-size: clamp(3.4rem, 1.4rem + 7vw, 8.6rem); line-height: .82; }
.pc-conta { margin-top: 1.1rem; max-width: 36rem; }
.pc-conta p { margin: .7rem 0 0; color: var(--creme); }
.pc-conta b { font-family: var(--f-titulo); font-weight: 700; font-size: 1.3em; line-height: 1; }
.pc-conta .pc-conta-2 { color: var(--creme-80); margin-top: .25rem; }
.pc-tally { width: min(100%, 30rem); height: auto; display: block; overflow: visible; }
.pc-tally line { stroke-width: 2.6; stroke-linecap: round; stroke-dasharray: 30; stroke-dashoffset: 0; }
.pc-tally .pc-sim { stroke: var(--vermelho-caneta); }
.pc-tally .pc-nao { stroke: rgb(241 239 234 / .3); }
.js .pc-tally line { stroke-dashoffset: 30; transition: stroke-dashoffset .35s calc(.6s + var(--i) * 45ms) var(--curva); }
.js .pc-conta.on .pc-tally line { stroke-dashoffset: 0; }

/* nota do Google */
.pc-nota { grid-column: 1; grid-row: 2; position: relative; z-index: 2; margin-top: clamp(1.6rem, 2.6vw, 2.2rem); display: flex; align-items: flex-end; gap: 1.2rem;
  padding-top: 1.4rem; border-top: 1px solid var(--linha-escuro); max-width: 36rem; }
.pc-cinco { margin: 0; display: flex; align-items: flex-end; gap: .9rem; }
.pc-cinco b { font-family: var(--f-titulo); font-weight: 700; font-size: clamp(4.6rem, 2.6rem + 5vw, 8rem); line-height: .78; letter-spacing: -.03em; }
.pc-estrelas { color: var(--ouro); font-size: clamp(1.2rem, 1rem + .6vw, 1.6rem); letter-spacing: .14em; padding-bottom: .2em; }
.pc-total { margin: 0 0 .1rem; font-family: var(--f-nota); font-size: 1rem; line-height: 1.35; color: var(--creme-80); }

/* retrato */
.pc-figura { grid-column: 2; grid-row: 1 / span 3; margin: calc(var(--respiro) * -.35) calc(var(--marg) * -.6) 0 0; position: relative; z-index: 1; }
.pc-figura img { display: block; width: 100%; height: auto;
  filter: drop-shadow(-24px 30px 38px rgb(0 0 0 / .45));
  -webkit-mask-image: linear-gradient(to bottom, #000 80%, transparent 99%); mask-image: linear-gradient(to bottom, #000 80%, transparent 99%); }

/* tiras */
.pc-tira { --rot: -1.2deg; position: relative; z-index: 2; margin: 0; background-color: var(--papel); color: var(--tinta);
  background-image: linear-gradient(rgb(157 23 21 / .08) 1px, transparent 1px), linear-gradient(90deg, rgb(157 23 21 / .08) 1px, transparent 1px),
    linear-gradient(rgb(157 23 21 / .04) 1px, transparent 1px), linear-gradient(90deg, rgb(157 23 21 / .04) 1px, transparent 1px);
  background-size: 30px 30px, 30px 30px, 6px 6px, 6px 6px;
  padding: 1.15rem 1.4rem 1rem; rotate: var(--rot);
  box-shadow: 0 1px 0 rgb(255 255 255 / .35) inset, 0 34px 60px -26px rgb(0 0 0 / .7), 0 8px 18px -8px rgb(0 0 0 / .45); }
.pc-tira figure { margin: 0; }
.pc-tira blockquote { margin: 0; font-family: var(--f-nota); font-style: italic; font-weight: 500; font-size: clamp(1.1rem, 1rem + .4vw, 1.3rem); line-height: 1.5; }
.pc-tira figcaption { margin-top: .55rem; font-family: var(--f-titulo); font-size: .95rem; font-weight: 600; color: var(--verde); }
.pc-tira figcaption span { font-weight: 400; color: var(--texto-papel); }
.pc-curta blockquote { font-size: clamp(1.5rem, 1.1rem + 1vw, 2rem); line-height: 1.25; }

.pc-tiras { grid-column: 1 / -1; grid-row: 4; list-style: none; margin: clamp(-9rem, -10vw, -4rem) 0 0; padding: 0; display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1.8rem, 3vw, 2.8rem) clamp(1rem, 2vw, 1.8rem); align-items: start; position: relative; z-index: 2; }
.pc-t2 { grid-column: span 2; --rot: .7deg; margin-top: 2.6rem; }
.pc-t2 blockquote { font-size: clamp(1.15rem, 1rem + .55vw, 1.42rem); }
.pc-t3 { --rot: .8deg; }
.pc-t4 { --rot: -.7deg; margin-top: 2.2rem; }
.pc-t5 { --rot: 1.1deg; margin-top: .6rem; }
/* a tira curta fica pregada sobre a poltrona, ao lado dele */
.pc-t6 { grid-column: 2; grid-row: 2 / span 2; align-self: end; justify-self: end; max-width: 26rem; --rot: -2.2deg; z-index: 3; margin-bottom: clamp(6rem, 12vw, 12rem); margin-right: -1rem; }
.pc-dica { display: none; }

.pc-chave { position: relative; background: none; color: var(--vermelho); display: inline-block; white-space: nowrap; }
.pc-risco { position: absolute; left: -2%; bottom: -.32em; width: 104%; height: .45em; overflow: visible; pointer-events: none; }
.pc-risco path { fill: none; stroke: var(--vermelho); stroke-width: 2.6; stroke-linecap: round; vector-effect: non-scaling-stroke; stroke-dasharray: 600; stroke-dashoffset: 0; }
.js .pc-risco path { stroke-dashoffset: 600; transition: stroke-dashoffset .9s calc(.8s + var(--d, 0) * 1s) var(--curva-traco); }
.js .pc-tira.on .pc-risco path { stroke-dashoffset: 0; }

.pc-mais { grid-column: 1 / -1; grid-row: 5; margin: 2.6rem 0 0; position: relative; z-index: 2; }
.pc-mais .link-nota { font-size: 1rem; }

/* tablet */
@media (min-width: 901px) and (max-width: 1180px) {
  .pc-tiras { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 3rem; }
  .pc-t2 { grid-column: span 2; }
}

/* celular */
@media (max-width: 900px) {
  .pc-grade { grid-template-columns: minmax(0, 1fr); }
  .pc-cab, .pc-nota, .pc-figura, .pc-t6, .pc-dica, .pc-tiras, .pc-mais { grid-column: 1; grid-row: auto; }
  .pc-figura { margin: 1.4rem calc(var(--marg) * -1) 0; display: flex; justify-content: center; }
  .pc-figura img { width: min(100%, 520px); -webkit-mask-image: linear-gradient(to bottom, #000 58%, transparent 90%); mask-image: linear-gradient(to bottom, #000 58%, transparent 90%); }
  .pc-t6 { justify-self: start; max-width: 92%; margin: -46vw 0 0 0; }
  .pc-dica { display: block; margin: 2.4rem 0 0; font-size: 1rem; }
  /* as tiras viram um maço que se folheia com o dedo */
  .pc-tiras { display: flex; gap: 1rem; margin: .6rem calc(var(--marg) * -1) 0; padding: 1.4rem var(--marg) 2.4rem; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: var(--marg); overscroll-behavior-x: contain; scrollbar-width: none; }
  .pc-tiras::-webkit-scrollbar { display: none; }
  .pc-tiras > li { flex: 0 0 min(84%, 22rem); scroll-snap-align: start; margin-top: 0; }
  .pc-t2 { flex-basis: min(90%, 24rem) !important; }
  .pc-tira blockquote { font-size: 1.08rem; }
  .pc-t2 blockquote { font-size: 1.06rem; }
  .pc-curta blockquote { font-size: 1.4rem; }
  .pc-mais { margin-top: .6rem; }
}
.pc-nb { white-space: nowrap; }