/* BASE + HERO (aprovado: D) */
:root {
  --papel: #fbf5ea;
  --pessego: #f7dcc4;
  --rosa: #f3d3cf;
  --creme: #f8ead2;
  --giz-vermelho: #d6453d;
  --giz-laranja: #e0703a;
  --amarelo: #f2c14e;
  --salvia: #8aa37b;
  --azul: #7fb0d0;
  --tinta: #5b1422;
  --tinta-suave: #6b3a40;
  --branco-foto: #fffdf8;

  --f-titulo: "Grandstander", "Baloo 2", system-ui, sans-serif;
  --f-mao: "Gaegu", "Comic Sans MS", cursive;
  --f-texto: "Baloo 2", system-ui, sans-serif;

  --borda: clamp(1.25rem, 4vw, 4rem);
  --topo: clamp(4rem, 8svh, 5rem);
  --raio: 999px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; overflow-x: clip; }
body {
  margin: 0;
  min-height: 100svh;
  color: var(--tinta);
  font-family: var(--f-texto);
  font-size: 1.125rem;
  line-height: 1.5;
  background: var(--papel);
  overflow-x: clip;
}
img { display: block; max-width: 100%; }
a { color: inherit; }

/* ---------- fundo: malha suave + papel ---------- */
body::before {
  content: "";
  position: fixed;
  inset: -20%;
  z-index: -2;
  background:
    radial-gradient(closest-side at 22% 26% in oklch, color-mix(in oklch, var(--pessego) 85%, transparent), transparent),
    radial-gradient(closest-side at 78% 18% in oklch, color-mix(in oklch, var(--rosa) 80%, transparent), transparent),
    radial-gradient(closest-side at 70% 82% in oklch, color-mix(in oklch, var(--creme) 95%, transparent), transparent),
    radial-gradient(closest-side at 18% 86% in oklch, color-mix(in oklch, var(--rosa) 55%, transparent), transparent),
    var(--papel);
  background-size: 70% 70%, 65% 65%, 75% 75%, 60% 60%, auto;
  background-repeat: no-repeat;
  background-position: 0% 0%, 100% 0%, 100% 100%, 0% 100%, 0 0;
  animation: d-malha 32s ease-in-out infinite alternate;
  animation-play-state: var(--estado, running);
}
@keyframes d-malha {
  to { background-position: 12% 10%, 86% 14%, 90% 88%, 8% 90%, 0 0; }
}
/* granulado de papel de desenho (fixo, único) */
body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: .05;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .2  0 0 0 0 .1  0 0 0 0 .05  0 0 0 1.4 -.2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---------- topo ---------- */
.d-topo {
  position: relative;
  z-index: 3;
  height: var(--topo);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0 var(--borda);
}
.d-marca {
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  text-decoration: none;
  font-family: var(--f-titulo);
  font-weight: 700;
  font-size: 1.08rem;
  letter-spacing: .01em;
}
.d-marca img { width: 27px; height: auto; }
.d-marca b { font-weight: 700; color: var(--giz-vermelho); color: #b2332c; }
.d-onde {
  margin: 0;
  font-family: var(--f-mao);
  font-weight: 700;
  font-size: 1.3rem;
  color: var(--tinta-suave);
}
.d-onde i { font-style: normal; margin: 0 .2em; }

/* ---------- hero ---------- */
.d-hero {
  min-height: calc(100svh - var(--topo));
  display: grid;
  grid-template-columns: minmax(0, 1.04fr) minmax(0, .96fr);
  align-items: center;
  gap: clamp(2rem, 5vw, 5rem);
  padding: 0 var(--borda) clamp(1.5rem, 4svh, 3rem);
  max-width: 1500px;
  margin: 0 auto;
}

.d-texto { position: relative; z-index: 2; max-width: 40rem; }

.d-quem {
  margin: 0 0 .9rem;
  font-weight: 600;
  font-size: 1.05rem;
  letter-spacing: .02em;
}
.d-quem span { font-weight: 500; color: var(--tinta-suave); }

.d-titulo {
  margin: 0;
  font-family: var(--f-titulo);
  font-weight: 800;
  font-size: clamp(2.5rem, 4.7vw, 4.6rem);
  line-height: 1.04;
  letter-spacing: -.012em;
  text-wrap: balance;
}
.d-linha { display: block; }
.d-linha + .d-linha { margin-top: .12em; }
.d-marcado, .d-sublinhado { position: relative; display: inline-block; white-space: nowrap; }
.d-giz {
  position: absolute;
  pointer-events: none;
  overflow: visible;
  z-index: -1;
}
.d-giz path { fill: none; stroke-linecap: round; filter: url(#giz); }
.d-giz--amarelo { left: -4%; right: -4%; width: 108%; top: 34%; height: 62%; }
.d-giz--amarelo path { stroke: var(--amarelo); stroke-width: 30; opacity: .88; }
.d-giz--vermelho { left: -2%; width: 104%; top: 84%; height: 26%; z-index: 0; }
.d-giz--vermelho path { stroke: var(--giz-vermelho); stroke-width: 11; }
.d-marcado { isolation: isolate; }

.d-apoio {
  margin: 1.4rem 0 0;
  font-size: clamp(1.125rem, 1.35vw, 1.28rem);
  line-height: 1.55;
  max-width: 33rem;
  color: var(--tinta);
}

.d-acoes {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .8rem 1.6rem;
  margin-top: 1.8rem;
}
.d-botao {
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  padding: .95rem 1.6rem .85rem;
  border-radius: 18px 22px 16px 24px / 22px 16px 24px 18px;
  background: var(--tinta);
  color: #fff8ef;
  text-decoration: none;
  font-weight: 600;
  font-size: 1.12rem;
  line-height: 1.2;
  box-shadow: 0 3px 0 #3a0b15, 0 12px 26px -12px rgb(91 20 34 / .55);
  transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease;
}
.d-botao svg { width: 1.3em; height: 1.3em; flex: none; }
.d-botao:hover { transform: translateY(-2px) rotate(-.6deg); background: #6c1a2a; }
.d-botao:active { transform: translateY(1px); box-shadow: 0 1px 0 #3a0b15; }
.d-botao:focus-visible, .d-link:focus-visible, .d-marca:focus-visible { outline: 3px dashed var(--giz-vermelho); outline-offset: 4px; }
.d-link {
  font-weight: 600;
  font-size: 1.08rem;
  text-decoration: underline;
  text-decoration-color: var(--salvia);
  text-decoration-thickness: 3px;
  text-underline-offset: 6px;
}
.d-link:hover { text-decoration-color: var(--giz-vermelho); }

.d-registro {
  margin: .9rem 0 0;
  font-size: .98rem;
  font-weight: 500;
  letter-spacing: .04em;
  color: var(--tinta-suave);
}
.d-registro i { font-style: normal; margin: 0 .3em; }

.d-ecg {
  display: block;
  width: min(100%, 25rem);
  height: auto;
  margin: 1.1rem 0 .2rem -.4rem;
  overflow: visible;
}

.d-prova { margin: .3rem 0 0; max-width: 30rem; }
.d-prova blockquote {
  margin: 0;
  font-family: var(--f-mao);
  font-weight: 700;
  font-size: clamp(1.4rem, 1.75vw, 1.6rem);
  line-height: 1.15;
  color: var(--tinta);
}
.d-prova figcaption {
  margin-top: .35rem;
  font-size: .98rem;
  color: var(--tinta-suave);
}
.d-nota {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  margin: .7rem 0 0;
  padding: .3rem .9rem .2rem;
  border: 2px solid color-mix(in oklab, var(--tinta) 30%, transparent);
  border-radius: 14px 18px 12px 20px;
  font-size: 1rem;
  font-weight: 500;
}
.d-nota b { font-weight: 700; }
.d-nota i { font-style: normal; color: var(--tinta-suave); }
.d-estrela { color: #c98a12; font-size: 1.1em; }

/* ---------- palco: foto recortada à mão ---------- */
.d-palco {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  min-height: 0;
}
.d-quadro {
  --rot: -2.2deg;
  position: relative;
  height: min(calc(100svh - var(--topo) - 7.5rem), 52rem);
  aspect-ratio: 1335 / 1669;
  max-width: 100%;
  margin-bottom: 2.5rem;
}
.d-papel {
  position: absolute;
  inset: -2.2% -2.6%;
  background: var(--branco-foto);
  clip-path: url(#recorte);
  transform: rotate(calc(var(--rot) + 3.4deg));
  filter: drop-shadow(0 18px 22px rgb(91 20 34 / .14));
}
.d-quadro::before { /* sombra do recorte, fora do elemento cortado */
  content: "";
  position: absolute;
  inset: 2% 1% -1% 3%;
  border-radius: 6px;
  background: rgb(91 20 34 / .16);
  filter: blur(18px);
  transform: rotate(var(--rot));
  z-index: -1;
}
.d-foto {
  position: absolute;
  inset: 0;
  clip-path: url(#recorte);
  transform: rotate(var(--rot));
  background: #d8c4b4;
}
.d-foto img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; }

.d-fita {
  position: absolute;
  width: 26%;
  height: 7%;
  background: rgb(242 193 78 / .55);
  mix-blend-mode: multiply;
  clip-path: polygon(3% 8%, 97% 0, 100% 50%, 96% 100%, 2% 92%, 0 45%);
}
.d-fita--1 { top: -2.6%; left: 6%; transform: rotate(-8deg); }
.d-fita--2 { bottom: -2.4%; right: 4%; transform: rotate(-5deg); background: rgb(127 176 208 / .5); }

/* desenhos de giz em volta (nunca sobre o rosto: rosto ≈ x 46–66 %, y 34–52 %) */
.d-desenho { position: absolute; overflow: visible; pointer-events: none; }
.d-desenho--coracao { width: 30%; left: -16%; top: 56%; transform: rotate(-9deg); }
.d-desenho--sol { width: 25%; right: -9%; top: -8%; }
.d-desenho--nuvem { width: 21%; right: -11%; top: 30%; transform: rotate(4deg); }
.d-traco--leve { opacity: .55; }

.d-anota {
  position: absolute;
  margin: 0;
  display: flex;
  align-items: flex-start;
  gap: .2rem;
  font-family: var(--f-mao);
  font-weight: 700;
  font-size: clamp(1.35rem, 1.75vw, 1.7rem);
  line-height: 1;
  color: var(--tinta);
  white-space: nowrap;
  pointer-events: none;
}
.d-seta { width: 4.2rem; height: auto; overflow: visible; flex: none; }
.d-anota--desenha { right: 101%; top: 45%; flex-direction: column; align-items: flex-end; transform: rotate(-6deg); }
.d-anota--desenha .d-seta { margin: .1rem -.6rem 0 0; width: 3.6rem; transform: rotate(22deg); }
.d-anota--explica { left: 27%; top: 97.5%; align-items: flex-end; transform: rotate(-3deg); }
.d-anota--explica .d-seta { order: 0; width: 5.2rem; margin-bottom: .3rem; }

/* ---------- entrada coreografada ---------- */
.js .d-entra { opacity: 0; transform: translateY(18px); }
.js .pronto .d-entra, .js.pronto .d-entra {
  opacity: 1;
  transform: none;
  transition: opacity .7s cubic-bezier(.2,.7,.2,1), transform .8s cubic-bezier(.2,.7,.2,1);
  transition-delay: calc(var(--i) * 110ms);
}
.js .d-quadro { opacity: 0; transform: translateY(26px) rotate(4deg) scale(.96); }
.js.pronto .d-quadro {
  opacity: 1;
  transform: none;
  transition: opacity .8s ease .15s, transform 1.1s cubic-bezier(.2,.9,.25,1.15) .15s;
}
.js .d-anota-texto { clip-path: inset(0 100% 0 0); }
.js.pronto .d-anota-texto { clip-path: inset(0 -5% 0 0); transition: clip-path 1s steps(18, end); }
.js.pronto .d-anota--desenha .d-anota-texto { transition-delay: 1.5s; }
.js.pronto .d-anota--explica .d-anota-texto { transition-delay: 2.1s; }

/* ---------- tablet e celular ---------- */
@media (max-width: 1100px) {
  .d-titulo { font-size: clamp(2.3rem, 5vw, 3.6rem); }
  .d-desenho--coracao { width: 30%; left: -17%; top: -5%; transform: rotate(-12deg); }
  .d-anota--desenha { right: auto; left: 16%; top: -1.6em; flex-direction: row; align-items: flex-end; transform: rotate(-3deg); }
  .d-anota--desenha .d-seta { order: -1; margin: 0; width: 2.8rem; transform: scaleX(-1) translateY(1.3rem) rotate(24deg); }
  .d-anota--explica { left: 16%; }
}

/* notebooks e telas baixas: o texto cabe na altura */
@media (min-width: 901px) and (max-height: 860px) {
  .d-titulo { font-size: min(4.7vw, 4.6rem, 8.4svh); }
  .d-apoio { margin-top: 1rem; }
  .d-acoes { margin-top: 1.3rem; }
  .d-ecg { width: min(100%, 18rem); margin-top: .6rem; }
  .d-prova blockquote { font-size: 1.35rem; }
  .d-nota { margin-top: .45rem; }
}

@media (max-width: 900px) {
  .d-hero {
    grid-template-columns: minmax(0, .86fr) minmax(0, 1.14fr);
    grid-template-areas:
      "quem  quem"
      "tit   tit"
      "apoio palco"
      "acoes palco"
      "reg   palco"
      "ecg   palco"
      "prova palco"
      ".     palco";
    grid-template-rows: repeat(7, auto) minmax(0, auto);
    align-items: start;
    column-gap: 2.2rem;
    row-gap: 0;
    padding-top: .8rem;
    min-height: calc(100svh - var(--topo));
    align-content: center;
  }
  .d-texto { display: contents; }
  .d-quem { grid-area: quem; }
  .d-titulo { grid-area: tit; font-size: clamp(2.3rem, 7.9vw, 4.2rem); margin-bottom: .6rem; }
  .d-apoio { grid-area: apoio; }
  .d-acoes { grid-area: acoes; }
  .d-registro { grid-area: reg; }
  .d-ecg { grid-area: ecg; width: min(100%, 19rem); }
  .d-prova { grid-area: prova; }
  .d-palco { grid-area: palco; align-items: flex-start; padding: 3.2rem 0 4.6rem; }
  .d-quadro { height: auto; width: 88%; margin: 0; }
  .d-desenho--coracao { width: 28%; left: -10%; top: -7%; }
  .d-anota--desenha { left: 15%; }
  .d-anota--explica { left: 4%; }
  .d-anota--explica .d-seta { width: 3.6rem; }
  .d-onde span { display: none; }
}

@media (max-width: 560px) {
  :root { --topo: 3.6rem; }
  body { font-size: 1.0625rem; }
  .d-hero { display: flex; flex-direction: column; align-items: stretch; padding-top: .3rem; }
  .d-marca { font-size: 1rem; white-space: nowrap; }
  .d-onde { display: none; }
  .d-quem { order: 1; font-size: .98rem; margin-bottom: .5rem; }
  .d-titulo { order: 2; font-size: clamp(2rem, 9.6vw, 2.6rem); margin: 0; }
  .d-palco { order: 3; padding: 2.3rem 0 2.9rem; justify-content: center; }
  .d-apoio { order: 4; margin-top: .2rem; font-size: 1.0625rem; }
  .d-acoes { order: 5; margin-top: 1.1rem; gap: .7rem 1.2rem; }
  .d-registro { order: 6; }
  .d-ecg { order: 7; }
  .d-prova { order: 8; }
  .d-botao { font-size: 1.06rem; padding: .9rem 1.3rem .8rem; }
  .d-quadro { width: 66%; }
  .d-desenho--sol { width: 32%; right: -24%; top: -10%; }
  .d-desenho--nuvem { width: 28%; right: -25%; top: 44%; }
  .d-anota { font-size: 1.28rem; }
  .d-desenho--coracao { width: 34%; left: -25%; top: -4%; transform: rotate(-12deg); }
  .d-anota--desenha { left: 14%; top: -13%; transform: rotate(-3deg); }
  .d-anota--desenha .d-seta { order: -1; width: 2.6rem; transform: scaleX(-1) translateY(1.3rem) rotate(24deg); }
  .d-anota--explica { left: 8%; top: 100%; }
  .d-anota--explica .d-seta { width: 2.8rem; }
}

/* ---------- movimento reduzido ---------- */
@media (prefers-reduced-motion: reduce) {
  body::before { animation: none; }
  .js .d-entra, .js .d-quadro { opacity: 1; transform: none; transition: none; }
  .js .d-anota-texto { clip-path: none; transition: none; }
  .d-botao { transition: none; }
}

/* ================= BASE DO SITE (comum a todas as seções) ================= */
:root{
  --lousa:#3a0b15; --lousa-2:#4a1220; --giz-claro:#fbf0e6;
  --respiro:clamp(5rem,12vw,10rem);
  --t-h2:clamp(2.1rem,4.2vw,3.8rem);
  --t-apoio:clamp(1.15rem,1.4vw,1.3rem);
  --t-mini:.875rem;
  --raio-mao:18px 22px 16px 24px / 22px 16px 24px 18px;
}
html{scroll-padding-top:1rem}
.secao{position:relative;padding:var(--respiro) var(--borda);max-width:1500px;margin:0 auto}
.h2{font-family:var(--f-titulo);font-weight:800;font-size:var(--t-h2);line-height:1.05;letter-spacing:-.01em;margin:0;text-wrap:balance}
.mao{font-family:var(--f-mao);font-weight:700}
.olho{font-family:var(--f-mao);font-weight:700;font-size:1.45rem;color:var(--tinta-suave);margin:0 0 .6rem;display:inline-block;transform:rotate(-2deg)}
.foco:focus-visible,a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px dashed var(--giz-vermelho);outline-offset:4px}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* revelação na rolagem: só com JS */
.js [data-rev]{opacity:0;transform:translateY(22px)}
.js [data-rev].vis{opacity:1;transform:none;transition:opacity .75s cubic-bezier(.2,.7,.2,1),transform .85s cubic-bezier(.2,.7,.2,1);transition-delay:calc(var(--i,0) * 110ms)}

/* botão flutuante de WhatsApp */
.wa-flutua{position:fixed;right:max(1rem,env(safe-area-inset-right));bottom:max(1rem,env(safe-area-inset-bottom));z-index:50;display:inline-flex;align-items:center;gap:.55rem;
  padding:.85rem 1.2rem .75rem;border-radius:var(--raio-mao);background:var(--tinta);color:#fff8ef;text-decoration:none;font-weight:600;font-size:1.02rem;
  box-shadow:0 3px 0 #3a0b15,0 14px 30px -12px rgb(91 20 34 / .6);opacity:0;transform:translateY(20px);pointer-events:none;transition:opacity .35s ease,transform .35s ease}
.wa-flutua svg{width:1.35em;height:1.35em}
.wa-flutua.on{opacity:1;transform:none;pointer-events:auto}
@media (min-width:901px){.wa-flutua .wa-txt-curto{display:none}}
@media (max-width:900px){.wa-flutua .wa-txt-longo{display:none}}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;transition-delay:0s!important;scroll-behavior:auto!important}
  .js [data-rev]{opacity:1;transform:none}
}


/* ================= SO · Sobre ================= */
.so { overflow-x: clip; }
.so-topo {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
  gap: clamp(2.5rem, 6vw, 6.5rem);
  align-items: center;
}

/* ---- retrato: moldura recortada, cabeça "saindo" do papel ---- */
.so-retrato { margin: 0; position: relative; justify-self: center; width: min(100%, 33rem); }
.so-giro { position: relative; aspect-ratio: 1068 / 1600; transform: rotate(-2deg); }
.so-moldura, .so-sombra {
  position: absolute;
  top: 12%; left: -5%; right: -5%; bottom: -3%;
}
.so-sombra { border-radius: 8px; background: rgb(91 20 34 / .16); filter: blur(20px); transform: translate(10px, 16px); }
.so-moldura {
  clip-path: url(#recorte);
  background:
    radial-gradient(closest-side at 72% 30% in oklab, var(--branco-foto), transparent),
    linear-gradient(160deg in oklab, var(--rosa), var(--pessego));
}
.so-foto { position: absolute; width: 90.909%; left: 4.545%; top: -13.187%; height: auto; }
.so-foto--cabeca { width: 100%; left: 0; top: 0; clip-path: inset(0 0 85.5% 0); pointer-events: none; }
.so-fundo-giz { position: absolute; width: 38%; right: 3%; top: 4%; overflow: visible; }
.so-fita {
  position: absolute; width: 30%; height: 6%;
  background: rgb(242 193 78 / .55); mix-blend-mode: multiply;
  clip-path: polygon(3% 8%, 97% 0, 100% 50%, 96% 100%, 2% 92%, 0 45%);
}
.so-fita--1 { top: 10%; right: -10%; transform: rotate(14deg); }
.so-fita--2 { bottom: -5%; left: -8%; transform: rotate(-9deg); background: rgb(127 176 208 / .5); }

.so-anota {
  position: absolute; left: -2%; bottom: -12%;
  display: flex; align-items: flex-end; gap: .3rem;
  font-family: var(--f-mao); font-weight: 700; font-size: clamp(1.35rem, 1.7vw, 1.65rem); line-height: 1;
  color: var(--tinta); white-space: nowrap; transform: rotate(-4deg);
}
.so-seta { width: 4.4rem; height: auto; overflow: visible; flex: none; margin-bottom: .4rem; }

/* ---- texto ---- */
.so-texto { max-width: 38rem; }
.so-titulo { font-size: clamp(2.6rem, 5.6vw, 5rem); }
.so-marca { position: relative; display: inline-block; white-space: nowrap; isolation: isolate; }
.so-marca svg { position: absolute; left: -4%; width: 108%; top: 40%; height: 58%; z-index: -1; overflow: visible; opacity: .9; }
.so-fala { margin: 1.6rem 0 0; }
.so-fala p {
  margin: 0; font-family: var(--f-mao); font-weight: 700;
  font-size: clamp(1.55rem, 2.2vw, 2.05rem); line-height: 1.15; color: var(--tinta);
}
.so-corpo { margin: 1.5rem 0 0; font-size: var(--t-apoio); line-height: 1.6; }
.so-aspas { white-space: nowrap; }
.so-assina { display: flex; align-items: center; gap: .9rem; margin: 1.8rem 0 0; font-size: 1rem; color: var(--tinta-suave); letter-spacing: .02em; }
.so-assina img { width: 34px; height: auto; }
.so-assina b { color: var(--tinta); font-weight: 600; }
.so-assina i { font-style: normal; margin: 0 .25em; }

/* ---- caminho de giz ---- */
.so-topo { position: relative; z-index: 1; }
.so-caminho { position: relative; z-index: 1; margin-top: clamp(7rem, 12vw, 10rem); }
.so-caminho-rotulo { margin: 1.5rem 0 0 3.2rem; font-size: 1.6rem; color: var(--tinta-suave); transform: rotate(-3deg); display: block; width: max-content; }
.so-trilha { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; z-index: 0; }
.so-toco { transition: opacity .5s ease; }
.so-trilha path { fill: none; stroke-linecap: round; stroke-linejoin: round; }
.so-paradas {
  list-style: none; margin: 0; padding: 0; position: relative; z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, .8fr) minmax(0, 1.45fr) minmax(0, 1.3fr) minmax(0, .95fr);
  gap: clamp(1.5rem, 2.6vw, 2.8rem);
  align-items: start;
}
.so-parada { position: relative; padding-top: 3.6rem; }
.so-parada:nth-child(even) { margin-top: 8rem; }
.so-parada p { margin: .55rem 0 0; font-size: 1.125rem; line-height: 1.55; }
.so-pino {
  position: absolute; top: 0; left: 0; width: 2.6rem; height: 2.6rem; border-radius: 50%;
  background: var(--branco-foto); border: 3px solid var(--tinta);
  box-shadow: 0 0 0 6px var(--papel), 0 6px 14px -6px rgb(91 20 34 / .4);
}
.so-pino::after { content: ""; position: absolute; inset: 28%; border-radius: 50%; background: var(--giz-vermelho); }
.so-pino--rosa { width: 3.6rem; height: 4.6rem; top: -1rem; border: 0; border-radius: 0; background: none; box-shadow: none; }
.so-pino--rosa::after { display: none; }
.so-pino--rosa img { width: 100%; height: auto; }
.so-lugar { margin: 0; font-family: var(--f-mao); font-weight: 700; font-size: 1.85rem; line-height: 1; transform: rotate(-2deg); transform-origin: left; }
.so-lugar span { font-size: .7em; color: var(--tinta-suave); }
.so-quando { margin: .45rem 0 0 !important; font-family: var(--f-titulo); font-weight: 700; font-size: 1rem !important; letter-spacing: .04em; color: #a4302a; }
.so-chiquinha {
  position: relative; padding: 1.3rem 1.2rem 1.1rem; margin: 1.4rem .4rem 0 !important;
  background: #fbe9b4; color: var(--tinta);
  border-radius: 3px 3px 22px 3px / 3px 3px 14px 3px;
  box-shadow: 0 14px 22px -14px rgb(91 20 34 / .35);
  transform: rotate(1.6deg);
}
.js .so-parada.so-chegou > .so-chiquinha { transform: rotate(1.6deg); }
.so-fita-bilhete {
  position: absolute; top: -.75rem; left: 50%; width: 5.5rem; height: 1.5rem; margin-left: -2.75rem;
  background: rgb(127 176 208 / .55); mix-blend-mode: multiply; transform: rotate(-4deg);
  clip-path: polygon(3% 8%, 97% 0, 100% 50%, 96% 100%, 2% 92%, 0 45%);
}
.so-chiquinha q { font-family: var(--f-mao); font-weight: 700; font-size: 1.5rem; line-height: 1.1; display: block; margin-top: .45rem; quotes: "“" "”"; }
.so-rabisco { position: absolute; left: 3.7rem; top: -.2rem; width: 4rem; height: auto; overflow: visible; pointer-events: none; }
.so-parada--hoje .so-rabisco { left: 4.4rem; top: .2rem; }
.so-parada q { quotes: "“" "”"; }

/* entrada das paradas: quando o giz chega */
.js .so-parada > :not(.so-pino) { opacity: 0; transform: translateY(14px); }
.js .so-pino { transform: scale(0); }
.js .so-parada.so-chegou > :not(.so-pino) { opacity: 1; transform: none; transition: opacity .6s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1); }
.js .so-parada.so-chegou > :nth-child(3) { transition-delay: .08s; }
.js .so-parada.so-chegou > :nth-child(n+4) { transition-delay: .16s; }
.js .so-parada.so-chegou .so-pino { transform: none; transition: transform .5s cubic-bezier(.2,.9,.25,1.4); }
.js .so-parada.so-chegou .so-lugar { transform: rotate(-2deg); }

/* ---- tablet e celular ---- */
@media (max-width: 1100px) {
  .so-topo { grid-template-columns: minmax(0, 1fr); gap: 5.5rem; }
  .so-retrato { width: min(78%, 28rem); }
  .so-texto, .so-paradas { width: 100%; max-width: 42rem; margin-inline: auto; }
  .so-paradas { grid-template-columns: minmax(0, 1fr); row-gap: 3rem; }
  .so-parada, .so-parada:nth-child(even) { margin-top: 0; padding: 0 0 0 3.8rem; }
  .so-pino { top: -.2rem; }
  .so-pino--rosa { top: -1.2rem; left: -.3rem; width: 3.2rem; height: 4.2rem; }
  .so-rabisco, .so-parada--hoje .so-rabisco { position: static; display: inline-block; vertical-align: middle; width: 2.7rem; margin: -.5rem 0 -.4rem .8rem; }
}
@media (max-width: 560px) {
  .so-retrato { width: 80%; }
  .so-anota { left: -6%; bottom: -13%; font-size: 1.3rem; }
  .so-seta { width: 3.4rem; }
  .so-titulo { font-size: clamp(2.4rem, 11vw, 3rem); }
  .so-fala p { font-size: 1.5rem; }
  .so-corpo { font-size: 1.125rem; }
  .so-aspas { white-space: normal; }
  .so-lugar { font-size: 1.7rem; }
}
@media (prefers-reduced-motion: reduce) {
  .js .so-parada > :not(.so-pino), .js .so-pino { opacity: 1; transform: none; }
}


/* ================= EX · Exames (a lousa) ================= */
.ex {
  --ex-texto: #e9d3c8;   /* 11,8:1 na lousa */
  --ex-rosa: #f08a80;    /* só desenho */
  isolation: isolate;
  color: var(--giz-claro);
  padding-bottom: calc(var(--respiro) + 2.5rem);
}
/* fundo de lousa de ponta a ponta (a seção tem largura máxima) */
.ex::before {
  content: "";
  position: absolute;
  inset: 0 calc(50% - 50vw);
  z-index: -1;
  background:
    radial-gradient(closest-side at 18% 22%, rgb(251 240 230 / .055), transparent),
    radial-gradient(closest-side at 74% 64%, rgb(251 240 230 / .045), transparent),
    radial-gradient(closest-side at 40% 92%, rgb(251 240 230 / .04), transparent),
    linear-gradient(170deg in oklab, var(--lousa-2), var(--lousa) 70%);
  background-size: 60% 40%, 70% 50%, 50% 30%, auto;
  background-repeat: no-repeat;
  border-block: 14px solid #2b0710;
}

.ex-topo {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  gap: clamp(2.5rem, 5vw, 5rem);
  align-items: center;
}
.ex-olho { color: var(--amarelo); }
.ex-titulo { color: var(--giz-claro); font-size: clamp(2.4rem, 5vw, 4.4rem); }
.ex-sub { position: relative; display: inline-block; white-space: nowrap; }
.ex-sub svg { position: absolute; left: -2%; width: 104%; top: 86%; height: 24%; overflow: visible; }
.ex-apoio { margin: 1.4rem 0 0; max-width: 34rem; font-size: var(--t-apoio); line-height: 1.55; color: var(--ex-texto); }

/* foto da sala: papel recortado, inclinado */
.ex-sala { margin: 0; position: relative; justify-self: end; width: min(100%, 30rem); }
.ex-sala-quadro { position: relative; aspect-ratio: 3 / 2; transform: rotate(2.5deg); }
.ex-sala-quadro::before { /* papel */
  content: ""; position: absolute; inset: -4% -3.5%;
  background: var(--branco-foto); clip-path: url(#recorte); transform: rotate(-1.6deg);
}
.ex-sala-quadro::after { /* sombra fora do recorte */
  content: ""; position: absolute; inset: 4% 2% -4% 4%; z-index: -1;
  background: rgb(0 0 0 / .45); filter: blur(22px); border-radius: 8px;
}
.ex-sala-foto { position: absolute; inset: 0; clip-path: url(#recorte); background: #6d6150; }
.ex-sala-foto img { width: 100%; height: 100%; object-fit: cover; }
.ex-fita {
  position: absolute; top: -7%; left: 38%; width: 28%; height: 11%;
  background: rgb(242 193 78 / .62);
  clip-path: polygon(3% 8%, 97% 0, 100% 50%, 96% 100%, 2% 92%, 0 45%); transform: rotate(-6deg);
}
.ex-anota {
  position: absolute; left: -2.5rem; bottom: -3.6rem; display: flex; align-items: flex-end; gap: .2rem;
  font-family: var(--f-mao); font-weight: 700; font-size: 1.5rem; line-height: 1; color: var(--giz-claro);
  white-space: nowrap; transform: rotate(-4deg);
}
.ex-seta { width: 3.6rem; height: auto; overflow: visible; margin-bottom: .3rem; }

/* ---- os exames ---- */
.ex-lista {
  list-style: none; margin: clamp(5.5rem, 9vw, 8rem) 0 0; padding: 0;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: clamp(1.5rem, 3vw, 3.5rem);
  row-gap: clamp(4rem, 7vw, 6rem);
}
.ex-item { position: relative; padding-left: 3.2rem; }
.ex-num {
  position: absolute; left: 0; top: -.35rem;
  font-family: var(--f-mao); font-weight: 700; font-size: 3rem; line-height: 1; color: var(--amarelo);
  transform: rotate(-6deg);
}
.ex-desenho { display: block; overflow: visible; height: auto; }
.ex-nome { margin: 0; font-family: var(--f-titulo); font-weight: 700; font-size: clamp(1.5rem, 2vw, 1.95rem); line-height: 1.1; color: var(--giz-claro); text-wrap: balance; }
.ex-faixa { margin: .4rem 0 0; font-family: var(--f-mao); font-weight: 700; font-size: 1.5rem; line-height: 1.1; color: var(--amarelo); }
.ex-corpo > p:not(.ex-faixa) { margin: .8rem 0 0; font-size: 1.125rem; line-height: 1.55; color: var(--ex-texto); max-width: 34rem; }
.ex-corpo > .ex-laudo { padding-left: .9rem; border-left: 3px solid var(--salvia); }

/* 1 · consulta: desenho | texto | fala */
.ex-item--consulta {
  grid-column: 1 / -1;
  display: grid; grid-template-columns: 9rem minmax(0, 1fr) minmax(0, 1fr); gap: 2.5rem; align-items: center;
}
.ex-desenho--esteto { width: 9.5rem; }

.ex-fala { margin: 0; }
.ex-fala blockquote { margin: 0; font-family: var(--f-mao); font-weight: 700; font-size: clamp(1.6rem, 2.3vw, 2.15rem); line-height: 1.12; color: var(--giz-claro); }
.ex-fala figcaption { margin-top: .5rem; font-size: 1rem; color: var(--ex-texto); }
.ex-fala--1 { transform: rotate(-1.5deg); padding-left: 1.4rem; border-left: 3px solid rgb(251 240 230 / .3); }

/* 2 e 3 · ecos */
.ex-item--fetal { grid-column: 1 / 6; }
.ex-item--fetal { display: flex; flex-direction: column; }
.ex-item--fetal .ex-desenho--fetal { align-self: flex-end; margin: -1.5rem 8% 0 0; max-width: 10.5rem; }
.ex-item--pediatrico { grid-column: 6 / -1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 15rem); gap: 2rem; align-items: end; }
.ex-item--fetal .ex-corpo, .ex-item--pediatrico .ex-corpo { align-self: start; }
.ex-desenho--fetal { width: 100%; }
.ex-desenho--eco { width: 100%; max-width: 15rem; }

/* régua de idade embaixo das duas */
.ex-regua { grid-column: 1 / -1; position: relative; height: 7.5rem; margin-top: calc(-1 * clamp(4rem, 7vw, 6rem) + .6rem); }
.ex-regua-traco { position: absolute; left: 0; top: 0; width: 100%; height: 5rem; overflow: visible; }
.ex-regua-rot, .ex-regua-chave { position: absolute; font-size: var(--t-mini); font-weight: 600; letter-spacing: .03em; color: var(--ex-texto); white-space: nowrap; }
.ex-regua-rot { top: 4.3rem; font-size: 1rem; }
.ex-regua-rot--a { left: 2%; }
.ex-regua-rot--b { left: 43%; transform: translateX(-50%); }
.ex-regua-rot--c { right: 1.6%; transform: translateX(50%); }
.ex-regua-chave { top: -.35rem; font-family: var(--f-mao); font-weight: 700; font-size: 1.3rem; letter-spacing: 0; transform: translateX(-50%); }
.ex-regua-chave--a { left: 19.5%; color: var(--amarelo); }
.ex-regua-chave--b { left: 70.7%; color: var(--azul); }

/* 4 · ritmo */
.ex-item--ritmo { grid-column: 1 / 8; }
.ex-ritmo-desenhos { position: relative; display: flex; align-items: center; gap: 1.2rem; margin-bottom: 1.4rem; }
.ex-desenho--ecg { flex: 1 1 auto; min-width: 0; width: 100%; }
.ex-desenho--relogio { flex: none; width: 6.2rem; }
.ex-24 { position: absolute; right: 1.25rem; bottom: -1.6rem; font-family: var(--f-mao); font-weight: 700; font-size: 1.5rem; color: var(--amarelo); transform: rotate(-4deg); }

/* 5 · avaliações: lista de checagem */
.ex-item--avalia { grid-column: 8 / -1; padding: 2rem 1.8rem 2rem 4.6rem; align-self: start; }
.ex-item--avalia .ex-num { left: 1.3rem; top: 1.6rem; }
.ex-quadro { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.ex-apagador { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -1; pointer-events: none; }
.ex-checa { list-style: none; margin: 1rem 0 0; padding: 0; display: grid; gap: .75rem; }
.ex-checa li { display: grid; grid-template-columns: 2rem minmax(0, 1fr); gap: .7rem; align-items: start; font-size: 1.125rem; line-height: 1.45; color: var(--ex-texto); }
.ex-checa svg { width: 1.9rem; height: auto; overflow: visible; margin-top: .1rem; }

/* pé: fala + botão, uma composição só */
.ex-pe { margin: clamp(5rem, 9vw, 7.5rem) auto 0; max-width: 46rem; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 1.2rem; }
.ex-fala--2 blockquote { font-size: clamp(1.8rem, 3vw, 2.6rem); }
.ex-chama { margin: .8rem 0 0; display: flex; align-items: flex-end; gap: .4rem; font-size: 1.5rem; line-height: 1; color: var(--amarelo); transform: rotate(-3deg); }
.ex-chama svg { width: 3.4rem; height: auto; overflow: visible; }
.ex-botao {
  display: inline-flex; align-items: center; gap: .6rem; min-height: 48px;
  padding: .95rem 1.6rem .85rem; border-radius: var(--raio-mao);
  background: var(--giz-claro); color: var(--tinta); text-decoration: none; font-weight: 600; font-size: 1.12rem; line-height: 1.2;
  box-shadow: 0 3px 0 #c9a99a, 0 14px 30px -14px rgb(0 0 0 / .7);
  transition: transform .2s ease, background-color .2s ease;
}
.ex-botao svg { width: 1.3em; height: 1.3em; flex: none; }
.ex-botao:hover { transform: translateY(-2px) rotate(-.6deg); background: #fff; }
.ex .ex-botao:focus-visible { outline-color: var(--amarelo); }

/* calha da lousa com gizes */
.ex-calha {
  position: absolute; left: var(--borda); right: var(--borda); bottom: 1.6rem; height: .9rem;
  background: linear-gradient(#5a2030, #2b0710); border-radius: 4px; box-shadow: 0 8px 14px -6px rgb(0 0 0 / .6);
}
.ex-calha span { position: absolute; bottom: 60%; width: 3.2rem; height: .7rem; border-radius: 3px; background: var(--giz-claro); }
.ex-calha span:nth-child(1) { left: 12%; transform: rotate(-3deg); }
.ex-calha span:nth-child(2) { left: 16.5%; width: 2.2rem; background: var(--amarelo); transform: rotate(4deg); }
.ex-calha span:nth-child(3) { left: 21%; width: 1.6rem; background: var(--ex-rosa); }
.ex-calha i { position: absolute; bottom: 60%; right: 14%; width: 5.5rem; height: 1.5rem; border-radius: 4px; background: linear-gradient(#c79a6b 0 55%, #4e4a52 55%); transform: rotate(-2deg); }

/* ---- tablet e celular ---- */
@media (max-width: 1100px) {
  .ex-item--consulta { grid-template-columns: 8rem minmax(0, 1fr); }
  .ex-item--consulta .ex-fala--1 { grid-column: 2; }
  .ex-item--ritmo, .ex-item--avalia { grid-column: 1 / -1; max-width: 44rem; }
}
@media (max-width: 900px) {
  .ex-topo { grid-template-columns: minmax(0, 1fr); gap: 3.5rem; }
  .ex-sala { justify-self: center; width: min(88%, 28rem); margin-bottom: 2.5rem; }
  .ex-item--fetal, .ex-item--pediatrico { grid-column: 1 / -1; }
  .ex-item--pediatrico { grid-template-columns: minmax(0, 1fr) minmax(0, 11rem); }
  .ex-regua { margin-top: 0; }
}
@media (max-width: 560px) {
  .ex-item, .ex-item--consulta { padding-left: 2.6rem; }
  .ex-item--avalia { padding: 1.6rem 1.2rem 1.6rem 3.4rem; }
  .ex-item--avalia .ex-num { left: .8rem; }
  .ex-num { font-size: 2.6rem; }
  .ex-item--consulta { grid-template-columns: minmax(0, 1fr); gap: 1.2rem; }
  .ex-item--consulta .ex-fala--1 { grid-column: auto; }
  .ex-desenho--esteto { width: 6.5rem; }
  .ex-item--pediatrico { grid-template-columns: minmax(0, 1fr); gap: 1rem; }
  .ex-item--fetal .ex-desenho--fetal { align-self: flex-start; margin: 1rem 0 0; }
  .ex-desenho--eco { max-width: 9.5rem; }
  .ex-desenho--fetal { max-width: 8.5rem; }
  .ex-longo { display: none; }
  .ex-regua-rot { font-size: var(--t-mini); }
  .ex-regua-rot--a { left: 0; }
  .ex-regua-rot--c { right: 0; transform: none; }
  .ex-regua-chave { font-size: 1.15rem; }
  .ex-desenho--relogio { width: 4.6rem; }
  .ex-24 { right: .6rem; font-size: 1.3rem; }
  .ex-anota { left: -.5rem; font-size: 1.35rem; }
  .ex-calha span:nth-child(1) { left: 6%; } .ex-calha span:nth-child(2) { left: 22%; } .ex-calha span:nth-child(3) { left: 34%; }
}


/* ===== ce · Como é a consulta ===== */
.ce-topo {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 24rem);
  align-items: end;
  column-gap: clamp(2rem, 5vw, 5rem);
}
.ce-topo .olho { grid-column: 1 / -1; justify-self: start; }
.ce-h2 { font-size: clamp(2.3rem, 5vw, 4.4rem); }
.ce-apoio { margin: 0 0 .5rem; font-size: var(--t-apoio); line-height: 1.55; color: var(--tinta); }
.ce-apoio b { font-weight: 600; }
.ce-ela-cor { color: #b2332c; }
.ce-brincar { position: relative; display: inline-block; isolation: isolate; }
.ce-giz-tit { position: absolute; left: -3%; width: 106%; top: 50%; height: 50%; z-index: -1; overflow: visible; pointer-events: none; }
.ce-giz-tit path { fill: none; stroke: var(--amarelo); stroke-width: 26; stroke-linecap: round; opacity: .85; }

/* corpo: mural fixo à esquerda, passos à direita */
.ce-corpo {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(2rem, 6vw, 6rem);
  margin-top: clamp(3rem, 6vw, 5rem);
  align-items: start;
}
.ce-corpo { align-items: stretch; }
.ce-mural { position: relative; }
.ce-mural-in { position: relative; display: flex; flex-direction: column; justify-content: space-between; gap: 2.5rem; height: 100%; max-width: 36rem; padding: 1rem 0 2rem; }

/* polaroides */
.ce-polar { position: relative; margin: 0; }
.ce-polar--a { width: 88%; }
.ce-polar--b { width: 64%; align-self: flex-end; margin-right: 2%; }
.ce-polar-corpo {
  --rot: -3deg;
  position: relative;
  padding: 4.5% 4.5% 0;
  transform: rotate(var(--rot));
}
.ce-polar--b .ce-polar-corpo { --rot: 3.5deg; }
.ce-polar-corpo::before { /* sombra fora do recorte */
  content: "";
  position: absolute;
  inset: 3% 2% -2% 4%;
  border-radius: 6px;
  background: rgb(91 20 34 / .17);
  filter: blur(16px);
  z-index: -1;
}
.ce-polar-papel { position: absolute; inset: 0; background: var(--branco-foto); clip-path: url(#recorte); }
.ce-polar-foto { position: relative; aspect-ratio: 3 / 2; overflow: hidden; background: #d8c4b4; }
.ce-polar--b .ce-polar-foto { aspect-ratio: 4 / 5; }
.ce-polar-foto img { width: 100%; height: 100%; object-fit: cover; }
.ce-polar--b .ce-polar-foto img { object-position: 40% 40%; }
.ce-polar-leg {
  position: relative;
  padding: .55rem 0 .9rem;
  text-align: center;
  font-family: var(--f-mao);
  font-weight: 700;
  font-size: 1.4rem;
  line-height: 1;
  color: var(--tinta-suave);
}
.ce-fita {
  --fr: -7deg;
  position: absolute;
  width: 34%;
  height: 2.1rem;
  background: rgb(242 193 78 / .6);
  mix-blend-mode: multiply;
  clip-path: polygon(3% 8%, 97% 0, 100% 50%, 96% 100%, 2% 92%, 0 45%);
  transform: rotate(var(--fr));
}
.ce-fita--b { background: rgb(127 176 208 / .55); }
.ce-polar--a .ce-fita--y { top: -1rem; left: 8%; }
.ce-polar--a .ce-fita--b { top: -.8rem; right: 6%; --fr: 6deg; width: 26%; }
.ce-polar--b .ce-fita--b { top: -1rem; left: 30%; --fr: -4deg; width: 40%; }
.ce-polar--b .ce-fita--y { bottom: 2.4rem; right: -10%; --fr: -38deg; width: 30%; }

.ce-bilhete {
  position: relative;
  align-self: flex-start;
  width: min(100%, 19rem);
  margin: 0 0 0 6%;
  transform: rotate(-4deg);
}
.ce-bilhete p { margin: 0; font-family: var(--f-mao); font-weight: 700; font-size: clamp(1.7rem, 2.5vw, 2.3rem); line-height: 1.02; color: #b2332c; }
.ce-bilhete footer { margin-top: .4rem; font-size: .95rem; color: var(--tinta-suave); }

/* passos */
.ce-passos { position: relative; list-style: none; margin: 0; padding: 0; counter-reset: ce; }
.ce-passos::before { /* a costura que liga os números */
  content: "";
  position: absolute;
  left: 1.6rem; top: 2.2rem; bottom: 3rem;
  border-left: 3px dashed color-mix(in oklab, var(--salvia) 75%, transparent);
}
.ce-passo {
  position: relative;
  display: grid;
  grid-template-columns: 3.2rem minmax(0, 1fr);
  column-gap: 1.3rem;
  align-items: center;
  padding-bottom: clamp(2.2rem, 4vw, 3.4rem);
}
.ce-passo:last-child { padding-bottom: 0; }
.ce-passo > :not(.ce-num) { grid-column: 2; }
.ce-num {
  grid-column: 1; grid-row: 1;
  position: relative;
  display: grid;
  place-items: center;
  width: 3.2rem; height: 3.2rem;
  border: 3px solid var(--giz-vermelho);
  border-radius: 52% 46% 55% 44% / 48% 56% 42% 54%;
  background: var(--papel);
  font-family: var(--f-titulo);
  font-weight: 800;
  font-size: 1.5rem;
  color: var(--tinta);
  transform: rotate(-6deg);
}
.ce-nota {
  grid-row: 1;
  margin: 0;
  font-family: var(--f-mao);
  font-weight: 700;
  font-size: clamp(1.6rem, 2.2vw, 2.1rem);
  line-height: 1.02;
  color: #b2332c;
  transform: rotate(-2.5deg);
  transform-origin: left center;
}
.ce-h3 {
  margin: .7rem 0 .45rem;
  font-family: var(--f-titulo);
  font-weight: 700;
  font-size: clamp(1.45rem, 2vw, 1.85rem);
  line-height: 1.12;
}
.ce-txt { margin: 0; font-size: 1.15rem; line-height: 1.58; max-width: 34rem; }

.ce-cit { margin: 1.1rem 0 0; padding-left: 1.1rem; border-left: 3px solid var(--amarelo); max-width: 34rem; }
.ce-cit p { margin: 0; font-family: var(--f-mao); font-weight: 700; font-size: 1.45rem; line-height: 1.15; color: var(--tinta); }
.ce-cit footer { margin-top: .35rem; font-size: .95rem; color: var(--tinta-suave); }

/* gesto: a polaroide cai e as fitas colam */
.js .ce-polar .ce-polar-corpo { opacity: 0; transform: translateY(-70px) rotate(calc(var(--rot) + 10deg)) scale(1.05); }
.js .ce-polar.ce-caiu .ce-polar-corpo {
  opacity: 1; transform: rotate(var(--rot));
  transition: opacity .45s ease, transform 1s cubic-bezier(.2,.9,.25,1.15);
}
.js .ce-polar--b.ce-caiu .ce-polar-corpo { transition-delay: .35s; }
.js .ce-polar .ce-fita { opacity: 0; transform: rotate(var(--fr)) translateY(-14px) scale(1.4); }
.js .ce-polar.ce-caiu .ce-fita {
  opacity: 1; transform: rotate(var(--fr));
  transition: opacity .2s ease .85s, transform .32s cubic-bezier(.3,1.6,.5,1) .85s;
}
.js .ce-polar.ce-caiu .ce-fita + .ce-fita { transition-delay: 1.05s; }
.js .ce-polar--b.ce-caiu .ce-fita { transition-delay: 1.2s; }
.js .ce-polar--b.ce-caiu .ce-fita + .ce-fita { transition-delay: 1.4s; }

/* gestação */
.ce-gesta {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(2rem, 5vw, 5rem);
  align-items: center;
  margin-top: clamp(4rem, 8vw, 7rem);
  padding: clamp(2rem, 4vw, 3.5rem);
  border-radius: 28px 34px 24px 38px / 34px 24px 38px 28px;
  background: color-mix(in oklab, var(--rosa) 75%, var(--papel));
}
.ce-gesta-olho { margin: 0 0 .3rem; font-size: 1.5rem; color: #b2332c; transform: rotate(-2deg); display: inline-block; }
.ce-gesta-h3 { margin: 0 0 .8rem; font-family: var(--f-titulo); font-weight: 800; font-size: clamp(1.7rem, 2.8vw, 2.5rem); line-height: 1.08; text-wrap: balance; }
.ce-gesta-txt > p:last-child { margin: 0; font-size: 1.15rem; line-height: 1.58; }
.ce-gesta-num { display: flex; align-items: baseline; gap: .35rem; margin: .4rem 0 .9rem; font-family: var(--f-titulo); font-weight: 800; line-height: .9; color: var(--tinta); }
.ce-gesta-num b { font-size: clamp(3.6rem, 7vw, 6rem); letter-spacing: -.02em; }
.ce-gesta-num span { font-family: var(--f-mao); font-size: 1.8rem; color: #b2332c; }
.ce-gesta-num small { font-family: var(--f-mao); font-size: clamp(1.6rem, 2.4vw, 2.2rem); color: #b2332c; margin-left: .3rem; transform: rotate(-4deg); }
.ce-gesta-leque { position: absolute; right: clamp(1.5rem, 4vw, 3.5rem); top: -3.2rem; width: clamp(6rem, 10vw, 9rem); height: auto; overflow: visible; transform: rotate(8deg); }
.ce-cit--grande p { font-size: clamp(1.55rem, 2.2vw, 1.95rem); }
.ce-cit--grande:first-child { margin-top: 0; }

/* tablet e celular */
@media (max-width: 900px) {
  .ce-topo { grid-template-columns: minmax(0, 1fr); row-gap: 1rem; }
  .ce-br { display: none; }
  .ce-corpo { grid-template-columns: minmax(0, 1fr); }
  .ce-mural-in { flex-direction: row; flex-wrap: wrap; align-items: flex-start; gap: 1.4rem 4%; margin: 0 auto; max-width: 44rem; padding: 0; }
  .ce-polar--a { width: 56%; margin-top: 1rem; }
  .ce-polar--b { width: 38%; margin: 2.6rem 0 0; }
  .ce-bilhete { order: 3; width: auto; margin: .4rem 0 0 4%; }
  .ce-gesta { grid-template-columns: minmax(0, 1fr); gap: 1.6rem; }
}
@media (max-width: 560px) {
  .ce-polar--a { width: 58%; }
  .ce-polar--b { width: 38%; margin-top: 1.8rem; }
  .ce-polar--a .ce-polar-foto { aspect-ratio: 1 / 1; }
  .ce-polar--a .ce-polar-foto img { object-position: 62% 50%; }
  .ce-polar-leg { font-size: 1rem; padding: .4rem .2rem .6rem; }
  .ce-fita { height: 1.3rem; }
  .ce-gesta-leque { width: 5.5rem; right: .8rem; top: -1.8rem; }
  .ce-bilhete p { font-size: 1.45rem; }
  .ce-passo { grid-template-columns: 2.6rem minmax(0, 1fr); column-gap: .9rem; }
  .ce-num { width: 2.6rem; height: 2.6rem; font-size: 1.25rem; }
  .ce-passos::before { left: 1.3rem; }
  .ce-nota { font-size: 1.55rem; }
  .ce-cit p { font-size: 1.35rem; }
  .ce-gesta { margin-inline: calc(var(--borda) * -.5); padding: 1.8rem 1.3rem; }
}

@media (prefers-reduced-motion: reduce) {
  .js .ce-polar .ce-polar-corpo { opacity: 1; transform: rotate(var(--rot)); }
  .js .ce-polar .ce-fita { opacity: 1; transform: rotate(var(--fr)); }
}


/* ===== fa · O que as famílias contam ===== */
.fa-topo {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 22rem);
  gap: clamp(2rem, 5vw, 5rem);
  align-items: end;
}
.fa-esq { max-width: 54rem; }
.fa-h2 { font-size: clamp(2.2rem, 4.6vw, 4.2rem); }
.fa-palavra { position: relative; display: inline-block; white-space: nowrap; isolation: isolate; }
.fa-circulo { position: absolute; left: -5%; top: -18%; width: 104%; height: 140%; overflow: visible; pointer-events: none; }
.fa-circulo path { fill: none; stroke: var(--giz-vermelho); stroke-width: 5; stroke-linecap: round; stroke-linejoin: round; }
.fa-apoio { margin: 1.3rem 0 0; font-size: var(--t-apoio); line-height: 1.55; max-width: 40rem; }
.fa-conta { margin: 1.6rem 0 0; display: flex; flex-wrap: wrap; align-items: center; gap: .4rem 1.2rem; }
.fa-risq { width: min(100%, 26rem); height: auto; overflow: visible; }
.fa-conta figcaption { font-size: 1.5rem; color: var(--tinta-suave); transform: rotate(-3deg); }
.fa-conta figcaption b { font-family: var(--f-titulo); font-weight: 800; font-size: 2.2rem; color: #b2332c; }
.fa-lado { justify-self: end; }

/* destaque: Carla e Heloisa encostadas */
.fa-topo-mural, .fa-mural { list-style: none; margin: 0; padding: 0; }
.fa-topo-mural {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  margin-top: clamp(3rem, 6vw, 5rem);
  align-items: start;
}
.fa-item { position: relative; }
.fa-item--carla { grid-column: 1 / 9; grid-row: 1; z-index: 1; }
.fa-item--heloisa { grid-column: 8 / 13; grid-row: 1; margin-top: clamp(4rem, 9vw, 8rem); z-index: 2; }

/* alvenaria de recados */
.fa-mural { columns: 3 18rem; column-gap: clamp(1.6rem, 3vw, 3rem); margin-top: clamp(2.5rem, 4vw, 3.5rem); }
.fa-mural .fa-item { break-inside: avoid; padding: 1.2rem 0 1.4rem; }
.fa-item--francine { margin-right: 8%; }
.fa-item--viviane { margin-left: 10%; }
.fa-item--rafael { margin: 2.5rem 4% 0 0; }
.fa-item--ana { margin-left: 14%; }
.fa-item--aparecido { margin-right: 6%; }
.fa-item--andressa { margin-left: 6%; }

.fa-bilhete {
  --r: -1.5deg;
  --tam: 1.6rem;
  --cor: #fffdf8;
  position: relative;
  margin: 0;
  padding: 1.5rem 1.5rem 1.2rem;
  background: var(--cor);
  border-radius: 3px 4px 3px 6px;
  box-shadow: 0 1px 0 rgb(91 20 34 / .06), 0 14px 26px -16px rgb(91 20 34 / .4);
  transform: rotate(var(--r));
}
.fa-bilhete p { margin: 0; font-family: var(--f-mao); font-weight: 700; font-size: var(--tam); line-height: 1.12; color: var(--tinta); }
.fa-bilhete footer { margin-top: .8rem; font-size: .95rem; color: var(--tinta-suave); }
.fa-bilhete::before { /* ímã ou fita */
  content: "";
  position: absolute;
  left: 50%; top: -.7rem;
  width: 1.5rem; height: 1.5rem;
  margin-left: -.75rem;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #f08a80, var(--giz-vermelho) 55%, #a8302a);
  box-shadow: 0 3px 4px rgb(91 20 34 / .3);
}
.fa-cor--amarelo { --cor: #fbe9b7; }
.fa-cor--rosa    { --cor: #f7dcd6; }
.fa-cor--azul    { --cor: #dcebf3; }
.fa-cor--salvia  { --cor: #e2ead9; }
.fa-cor--branco  { --cor: #fffdf8; }

.fa-item--carla .fa-bilhete { --tam: clamp(2.3rem, 4vw, 3.6rem); --r: -2deg; padding: clamp(2rem, 4vw, 3.4rem) clamp(1.6rem, 4vw, 3.4rem) clamp(1.6rem, 3vw, 2.6rem); }
.fa-item--carla .fa-bilhete p { line-height: 1.06; max-width: 15em; }
.fa-item--carla .fa-bilhete::before { /* ímã de coração */
  width: 2.4rem; height: 2.2rem; margin-left: -1.2rem; top: -1rem; border-radius: 0;
  clip-path: path("M19 36 C 8 28, 0 20, 0 11 C 0 4, 6 0, 11 0 C 15 0, 18 2, 19 5 C 20 2, 23 0, 27 0 C 32 0, 38 4, 38 11 C 38 20, 30 28, 19 36 Z");
}
.fa-item--francine .fa-bilhete { --r: 2deg; }
.fa-item--heloisa .fa-bilhete { --tam: clamp(1.6rem, 2.1vw, 1.95rem); --r: 2.5deg; padding: 2rem 1.8rem 1.5rem; }
.fa-item--rafael .fa-bilhete { --r: 3deg; }
.fa-item--ana .fa-bilhete { --r: -3deg; }
.fa-item--viviane .fa-bilhete { --tam: 1.9rem; --r: 1.5deg; }
.fa-item--aparecido .fa-bilhete { --r: -2deg; }
.fa-item--andressa .fa-bilhete { --r: 1deg; }
.fa-item--francine .fa-bilhete::before, .fa-item--viviane .fa-bilhete::before, .fa-item--andressa .fa-bilhete::before { /* fita */
  width: 5.5rem; height: 1.6rem; margin-left: -2.75rem; top: -.8rem;
  border-radius: 0; background: rgb(127 176 208 / .55); box-shadow: none; mix-blend-mode: multiply;
  clip-path: polygon(3% 8%, 97% 0, 100% 50%, 96% 100%, 2% 92%, 0 45%);
  transform: rotate(-4deg);
}
.fa-item--viviane .fa-bilhete::before { background: rgb(242 193 78 / .6); }

/* selo da nota */
.fa-selo { text-align: center; padding: 1rem; }
.fa-selo-num { margin: 0; display: inline-flex; align-items: flex-start; gap: .3rem; font-family: var(--f-titulo); font-weight: 800; line-height: .85; color: var(--tinta); }
.fa-selo-num b { font-size: clamp(5rem, 10vw, 8.5rem); letter-spacing: -.03em; }
.fa-estrela { font-size: clamp(2rem, 3.5vw, 3rem); color: #c98a12; transform: rotate(12deg); }
.fa-selo-txt { margin: .5rem 0 0; font-size: 1.25rem; font-weight: 600; }
.fa-selo-txt i { font-style: normal; color: var(--tinta-suave); margin: 0 .2em; }
.fa-link {
  display: inline-flex; align-items: center; min-height: 48px;
  margin-top: .6rem; padding: 0 .2rem;
  font-weight: 600; font-size: 1.08rem;
  text-decoration: underline; text-decoration-color: var(--salvia); text-decoration-thickness: 3px; text-underline-offset: 6px;
}
.fa-link:hover { text-decoration-color: var(--giz-vermelho); }

/* tablet */
@media (max-width: 1000px) {
  .fa-topo { grid-template-columns: minmax(0, 1fr); align-items: start; }
  .fa-lado { justify-self: start; }
  .fa-selo { text-align: left; padding: 0; display: flex; flex-wrap: wrap; align-items: center; gap: .2rem 1.4rem; }
  .fa-selo-txt { margin: 0; }
  .fa-item--carla { grid-column: 1 / 12; }
  .fa-item--heloisa { grid-row: 2; grid-column: 3 / 13; margin-top: -1.2rem; }
}
/* celular */
@media (max-width: 600px) {
  .fa-selo-num b { font-size: 4.6rem; }
  .fa-selo-txt { flex-basis: 100%; }
  .fa-risq { width: 100%; }
  .fa-item--carla { grid-column: 1 / 13; }
  .fa-item--carla .fa-bilhete { --tam: 2.05rem; }
  .fa-item--heloisa { grid-column: 2 / 13; }
  .fa-mural { columns: 1; }
  .fa-mural .fa-item { padding: .9rem 0 1rem; }
  .fa-item--francine, .fa-item--rafael, .fa-item--aparecido { margin: 0 9% 0 0; }
  .fa-item--viviane, .fa-item--ana, .fa-item--andressa { margin: 0 0 0 9%; }
  .fa-bilhete { --tam: 1.45rem; padding: 1.3rem 1.2rem 1rem; }
  .fa-item--heloisa .fa-bilhete { --tam: 1.5rem; padding: 1.5rem 1.3rem 1.1rem; }
  .fa-item--viviane .fa-bilhete { --tam: 1.6rem; }
}

/* o giz sublinha as palavras de atenção */
.fa-sub {
  color: inherit;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 12' preserveAspectRatio='none'%3E%3Cpath d='M2 8 C 40 4, 80 10, 120 6 S 180 7, 198 4' fill='none' stroke='%23d6453d' stroke-width='3.2' stroke-linecap='round' opacity='.85'/%3E%3C/svg%3E") no-repeat 0 100% / 100% .42em;
  padding-bottom: .12em;
  -webkit-box-decoration-break: clone; box-decoration-break: clone;
}
.js .fa-item .fa-sub { background-size: 0% .42em; }
.js .fa-item.vis .fa-sub { background-size: 100% .42em; transition: background-size .9s cubic-bezier(.45,.05,.35,1) .7s; }
.fa-selo-num { position: relative; isolation: isolate; }
.fa-anel { position: absolute; left: -16%; top: -14%; width: 120%; height: 130%; z-index: -1; overflow: visible; pointer-events: none; }
.fa-anel path { fill: none; stroke: var(--amarelo); stroke-width: 9; stroke-linecap: round; opacity: .9; }
@media (max-width: 1000px) {
  .fa-selo { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 1.6rem; align-items: center; }
  .fa-selo-num { grid-row: 1 / 3; }
  .fa-selo-txt { align-self: end; flex-basis: auto; }
  .fa-link { align-self: start; margin-top: 0; }
}
@media (prefers-reduced-motion: reduce) { .js .fa-item .fa-sub { background-size: 100% .42em; } }
.fa-selo-txt span { white-space: nowrap; }
@media (max-width: 1000px) {
  .fa-item--heloisa { margin-top: -.6rem; }
  .fa-item--carla .fa-bilhete { padding-bottom: 2.6rem; }
  .fa-selo-txt i { display: none; }
  .fa-selo-txt span { display: block; }
}


/* ===== pf · Perguntas frequentes (fichário da recepção) ===== */
.pf{--m:4.2rem;--azul-f:color-mix(in oklab,var(--azul) 26%,var(--branco-foto));--salvia-f:color-mix(in oklab,var(--salvia) 30%,var(--branco-foto));--amarelo-f:color-mix(in oklab,var(--amarelo) 40%,var(--branco-foto))}
.pf-grade{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);grid-template-areas:"cab bil" "lista lista";gap:clamp(2.5rem,5vw,4.5rem) 3rem;align-items:end}
.pf-cab{grid-area:cab;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1rem 2rem;align-items:end}
.pf-lista{grid-area:lista}
.pf-bilhete{grid-area:bil}
.pf-apoio{margin:1.2rem 0 0;font-size:var(--t-apoio);line-height:1.55;max-width:34rem}
.pf-cab-lado{display:flex;align-items:flex-end;justify-content:flex-end;gap:1rem}
.pf-interroga{display:block;flex:none;width:clamp(6rem,10vw,9.5rem);height:auto;margin:0 4% .4rem 0;overflow:visible;transform:rotate(-8deg)}

.pf-bilhete{position:relative;max-width:25rem;margin:0 0 0 auto;padding:1.5rem 1.5rem 1.5rem;background:var(--amarelo-f);
  border-radius:var(--raio-mao);transform:rotate(2deg);box-shadow:0 18px 30px -22px rgb(91 20 34 / .55)}
.pf-bilhete::before{content:"";position:absolute;top:-.8rem;left:50%;width:6.5rem;height:1.7rem;margin-left:-3.25rem;transform:rotate(-4deg);
  background:rgb(127 176 208 / .55);mix-blend-mode:multiply;clip-path:polygon(3% 8%,97% 0,100% 50%,96% 100%,2% 92%,0 45%)}
.pf-bilhete p{margin:0 0 1rem;font-size:1.06rem;line-height:1.5}
.pf-bilhete .pf-bilhete-t{margin:0 0 .3rem;font-family:var(--f-mao);font-weight:700;font-size:1.7rem;line-height:1.05}
.pf-botao{display:inline-flex;align-items:center;gap:.55rem;min-height:48px;padding:.75rem 1.3rem .65rem;border-radius:var(--raio-mao);background:var(--tinta);color:#fff8ef;
  text-decoration:none;font-weight:600;font-size:1.08rem;box-shadow:0 3px 0 #3a0b15;transition:transform .2s ease,background-color .2s ease}
.pf-botao svg{width:1.3em;height:1.3em;flex:none}
.pf-botao:hover{transform:translateY(-2px) rotate(-.6deg);background:#6c1a2a}

/* fichário: duas colunas */
.pf-lista{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:2.4rem clamp(1.5rem,3vw,3rem);align-items:start}

/* divisórias (abas) */
.pf-grupo{--cor:var(--azul-f);position:relative;display:inline-block;margin:0 0 -.2rem 1.2rem;padding:.55rem 1.3rem .5rem;
  font-family:var(--f-mao);font-weight:700;font-size:1.55rem;line-height:1;color:var(--tinta);
  background:var(--cor);border-radius:16px 20px 0 0 / 14px 18px 0 0}
.pf-grupo--2{--cor:var(--salvia-f)}
.pf-grupo--3{--cor:var(--amarelo-f);margin-top:2.6rem}
.pf-fichas{--cor:var(--azul-f);list-style:none;margin:0;padding:.9rem;display:grid;gap:.8rem;background:var(--cor);border-radius:var(--raio-mao)}
.pf-grupo--2 + .pf-fichas{--cor:var(--salvia-f)}
.pf-grupo--3 + .pf-fichas{--cor:var(--amarelo-f)}

/* ficha pautada */
.pf-ficha{position:relative;border-radius:10px 14px 9px 13px;
  background:linear-gradient(90deg,transparent calc(var(--m) - 1px),rgb(214 69 61 / .5) calc(var(--m) - 1px),rgb(214 69 61 / .5) calc(var(--m) + 1px),transparent calc(var(--m) + 1px)),var(--branco-foto);
  box-shadow:0 1px 0 rgb(91 20 34 / .1),0 12px 22px -18px rgb(91 20 34 / .5);transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s ease}
.pf-fichas li:nth-child(odd) .pf-ficha{transform:rotate(-.4deg)}
.pf-fichas li:nth-child(even) .pf-ficha{transform:rotate(.35deg)}
.pf-fichas li .pf-ficha[open]{transform:rotate(0) translateY(-2px);box-shadow:0 1px 0 rgb(91 20 34 / .1),0 24px 34px -22px rgb(91 20 34 / .6)}
.pf-ficha[open]::after{content:"";position:absolute;top:-.7rem;right:3.4rem;width:5rem;height:1.5rem;transform:rotate(5deg);pointer-events:none;
  background:rgb(242 193 78 / .6);mix-blend-mode:multiply;clip-path:polygon(3% 8%,97% 0,100% 50%,96% 100%,2% 92%,0 45%)}
.pf-ficha summary{display:grid;grid-template-columns:var(--m) minmax(0,1fr) auto;align-items:center;gap:0 1rem;min-height:4rem;
  padding:.9rem 1rem .9rem 0;cursor:pointer;list-style:none;border-radius:inherit}
.pf-ficha summary::-webkit-details-marker{display:none}
.pf-n{justify-self:center;display:grid;place-items:center;width:2.2rem;height:2.2rem;border-radius:50%;background:var(--cor);
  font-family:var(--f-titulo);font-weight:800;font-size:1rem;line-height:1;color:var(--tinta)}
.pf-q{font-family:var(--f-titulo);font-weight:700;font-size:clamp(1.12rem,1.4vw,1.34rem);line-height:1.32;color:var(--tinta)}

/* o gesto: o giz sublinha a pergunta quando ela abre (atravessa as linhas) */
.pf-sub{padding-bottom:.3em;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 24' preserveAspectRatio='none'%3E%3Cfilter id='g' x='-2%25' y='-40%25' width='104%25' height='180%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.7' numOctaves='2' seed='3'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 2.6 -.45'/%3E%3CfeComposite in='SourceGraphic' operator='in'/%3E%3C/filter%3E%3Cpath d='M5 14 C 80 7, 160 19, 240 11 S 350 16, 395 9' fill='none' stroke='%23d6453d' stroke-width='10' stroke-linecap='round' filter='url(%23g)'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:0 100%;background-size:0% .5em;transition:background-size 1s cubic-bezier(.45,.05,.35,1)}
@media (hover:hover){.pf-ficha summary:hover .pf-sub{background-size:12% .5em}}
.js .pf-fichas li.vis .pf-ficha[open] .pf-sub,html:not(.js) .pf-ficha[open] .pf-sub{background-size:100% .5em}

/* sinal + que vira × */
.pf-sinal{position:relative;width:2.6rem;height:2.6rem;flex:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cpath d='M24 5 C 37 4, 44 14, 43 25 C 42 37, 33 44, 23 43 C 12 42, 4 34, 5 23 C 6 12, 14 6, 27 6' fill='none' stroke='%235b1422' stroke-width='2.4' stroke-linecap='round' opacity='.55'/%3E%3C/svg%3E") center/100% no-repeat}
.pf-sinal::before,.pf-sinal::after{content:"";position:absolute;left:50%;top:50%;width:1rem;height:3px;margin:-1.5px 0 0 -.5rem;border-radius:3px;background:var(--tinta);transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.pf-sinal::after{transform:rotate(90deg)}
.pf-ficha[open] .pf-sinal::before{transform:rotate(45deg)}
.pf-ficha[open] .pf-sinal::after{transform:rotate(135deg)}

/* resposta pautada: anima o filho, nunca o details */
.pf-resp{--l:1.85rem;margin:0 1.2rem 0 calc(var(--m) + 1rem);padding:.15rem 0 calc(var(--l) * .6);font-size:1.125rem;line-height:var(--l);color:var(--tinta);
  background:repeating-linear-gradient(transparent 0 calc(var(--l) - 1px),rgb(127 176 208 / .5) calc(var(--l) - 1px) var(--l)) 0 .15rem / 100% calc(100% - var(--l) * .6) no-repeat}
.pf-ficha[open] .pf-resp{animation:pf-abre .55s cubic-bezier(.2,.7,.2,1) both}
@keyframes pf-abre{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
.pf-resp p{margin:0;max-width:36rem}
.pf-resp p + p{margin-top:var(--l)}
.pf-resp b{font-weight:600}
.pf-mt{color:inherit;font-weight:600;padding:0 .12em;margin:0 -.06em;border-radius:.3em .5em .35em .45em;
  background:linear-gradient(100deg,transparent .2em,rgb(242 193 78 / .55) .35em,rgb(242 193 78 / .5) calc(100% - .35em),transparent calc(100% - .15em)) 0 62% / 100% 62% no-repeat;
  -webkit-box-decoration-break:clone;box-decoration-break:clone}
.pf-link{display:inline-flex;align-items:center;min-height:max(48px,var(--l) * 2);font-weight:600;font-size:1.08rem;line-height:var(--l);
  text-decoration:underline;text-decoration-color:var(--salvia);text-decoration-thickness:3px;text-underline-offset:6px}
.pf-link:hover{text-decoration-color:var(--giz-vermelho)}
.pf-cita{margin:0;font-family:var(--f-mao);font-weight:700;font-size:1.42rem;line-height:var(--l);color:var(--tinta)}
.pf-cita span{display:block;font-family:var(--f-texto);font-weight:400;font-size:.95rem;line-height:var(--l);color:var(--tinta-suave)}

@media (max-width:900px){
  .pf-grade{grid-template-columns:minmax(0,1fr);grid-template-areas:"cab" "lista" "bil";align-items:start}
  .pf-cab{align-items:start;gap:1rem}
  .pf-interroga{width:5.5rem;margin:0}
  .pf-bilhete{margin:0;justify-self:start}
}
@media (max-width:900px){
  .pf-lista{grid-template-columns:minmax(0,1fr)}
  .pf-grupo--3{margin-top:2.4rem}
}
@media (max-width:560px){
  .pf{--m:3rem}
  .pf-interroga{width:4.4rem}
  .pf-fichas{padding:.55rem;gap:.65rem}
  .pf-grupo{margin-left:.6rem;font-size:1.45rem}
  .pf-ficha summary{gap:0 .6rem;padding:.8rem .6rem .8rem 0}
  .pf-n{width:1.9rem;height:1.9rem;font-size:.92rem}
  .pf-sinal{width:2.3rem;height:2.3rem}
  .pf-resp{margin:0 .8rem 0 calc(var(--m) + .6rem)}
  .pf-ficha[open]::after{right:2.6rem;width:4rem}
}
@media (prefers-reduced-motion:reduce){
  .pf-sub{transition:none}
  .pf-ficha[open] .pf-resp{animation:none}
}


/* ===== on · Onde atendo (id contato) ===== */
.on-topo{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(2rem,5vw,5rem);align-items:center;margin-bottom:clamp(3rem,6vw,5.5rem)}
.on-apoio{margin:1.2rem 0 0;font-size:var(--t-apoio);line-height:1.55;max-width:32rem}
.on-marcado{position:relative;white-space:nowrap;background:linear-gradient(transparent 58%,rgb(138 163 123 / .55) 58%,rgb(138 163 123 / .5) 90%,transparent 90%);padding:0 .08em}

/* foto em moldura recortada (sombra fora do recorte) */
.on-palco{position:relative;padding:1.5rem 1rem 2.5rem}
.on-quadro{--rot:1.6deg;position:relative;margin:0;aspect-ratio:1600/1068}
.on-quadro::before{content:"";position:absolute;inset:3% 2% -1% 3%;border-radius:6px;background:rgb(91 20 34 / .16);filter:blur(18px);transform:rotate(var(--rot));z-index:-1}
.on-papel{position:absolute;inset:-2.6% -2%;background:var(--branco-foto);clip-path:url(#recorte);transform:rotate(calc(var(--rot) - 3deg))}
.on-foto{position:absolute;inset:0;clip-path:url(#recorte);transform:rotate(var(--rot));background:#c9b2a2}
.on-foto img{width:100%;height:100%;object-fit:cover;object-position:50% 30%}
.on-fita{position:absolute;width:24%;height:10%;background:rgb(242 193 78 / .55);mix-blend-mode:multiply;clip-path:polygon(3% 8%,97% 0,100% 50%,96% 100%,2% 92%,0 45%)}
.on-fita--1{top:-4%;left:8%;transform:rotate(-7deg)}
.on-fita--2{bottom:-4%;right:10%;transform:rotate(-4deg);background:rgb(127 176 208 / .5)}
.on-anota{position:absolute;left:-1rem;bottom:-2.6rem;display:flex;align-items:flex-end;gap:.3rem;font-family:var(--f-mao);font-weight:700;font-size:clamp(1.35rem,1.7vw,1.6rem);line-height:1;color:var(--tinta);transform:rotate(-4deg);white-space:nowrap}

.on-nw{white-space:nowrap}

/* casas */
.on-casa{position:relative;padding:clamp(1.5rem,2.8vw,2.6rem);border-radius:var(--raio-mao);background:var(--branco-foto);
  box-shadow:0 1px 0 rgb(91 20 34 / .08),0 22px 40px -28px rgb(91 20 34 / .55)}
.on-casa--cg{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:2rem clamp(2rem,4vw,3.5rem);align-items:start}
.on-casa--dd{background:color-mix(in oklab,var(--salvia) 22%,var(--branco-foto));transform:rotate(.6deg)}
.on-cidade{margin:0 0 .35rem;font-family:var(--f-mao);font-weight:700;font-size:1.4rem;line-height:1.1;color:var(--tinta-suave)}
.on-cidade span{color:var(--tinta)}
.on-nome{margin:0;font-family:var(--f-titulo);font-weight:800;font-size:clamp(1.6rem,2.3vw,2.2rem);line-height:1.1}
.on-end{margin:.8rem 0 0;font-size:1.125rem;line-height:1.55}
.on-linhas{margin:1.2rem 0 0;display:grid;gap:1rem}
.on-linhas > div{padding-top:1rem;border-top:2px dashed rgb(91 20 34 / .13)}
.on-linhas dt{margin-bottom:.3rem;font-family:var(--f-mao);font-weight:700;font-size:1.3rem;line-height:1.1;color:var(--tinta-suave)}
.on-linhas dd{margin:0}
.on-linhas .on-end,.on-linhas .on-hora{margin-top:0}
.on-acoes{display:flex;flex-wrap:wrap;align-items:center;gap:.3rem 1.4rem}
.on-botao{display:inline-flex;align-items:center;gap:.55rem;min-height:48px;padding:.8rem 1.35rem .7rem;border-radius:var(--raio-mao);background:var(--tinta);color:#fff8ef;
  text-decoration:none;font-weight:600;font-size:1.08rem;box-shadow:0 3px 0 #3a0b15,0 12px 24px -14px rgb(91 20 34 / .6);transition:transform .2s ease,background-color .2s ease}
.on-botao svg{width:1.3em;height:1.3em;flex:none}
.on-botao:hover{transform:translateY(-2px) rotate(-.6deg);background:#6c1a2a}
.on-fone{display:inline-flex;align-items:center;gap:.5rem;min-height:48px;padding:.5rem 0;font-weight:600;font-size:1.125rem;text-decoration:underline;
  text-decoration-color:var(--salvia);text-decoration-thickness:3px;text-underline-offset:6px}
.on-fone span{font-weight:400;color:var(--tinta-suave)}
.on-fone:hover{text-decoration-color:var(--giz-vermelho)}
.on-hora{font-size:1.125rem}
.on-fones{list-style:none;margin:.9rem 0 0;padding:0}
.on-casa-hist{margin:1.2rem 0 0;padding-top:1rem;border-top:2px dashed rgb(91 20 34 / .13);font-size:1.02rem;color:var(--tinta-suave)}

/* mapa real: topo recortado (esconde o cartão com nota do prédio); fundo e altura fixos se não carregar */
.on-cg-mapa{display:flex;flex-direction:column;height:100%}
.on-mapa{position:relative;flex:1;min-height:20rem;overflow:hidden;border-radius:14px 18px 12px 20px;
  background:color-mix(in oklab,var(--azul) 18%,var(--papel));box-shadow:inset 0 0 0 2px rgb(91 20 34 / .12)}
.on-mapa iframe{position:relative;display:block;width:100%;height:calc(100% + 150px);margin-top:-150px;border:0}
.on-mapa-fundo{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:.5rem;text-align:center;padding:1rem;
  font-family:var(--f-mao);font-weight:700;font-size:1.3rem;color:var(--tinta-suave)}
.on-mapa-fundo svg{width:2.6rem;height:auto;overflow:visible}
.on-links{display:flex;flex-wrap:wrap;gap:0 1.6rem;margin:.6rem 0 0}
.on-link{display:inline-flex;align-items:center;min-height:48px;font-weight:600;font-size:1.08rem;text-decoration:underline;text-decoration-color:var(--salvia);text-decoration-thickness:3px;text-underline-offset:6px}
.on-link:hover{text-decoration-color:var(--giz-vermelho)}

/* ponte: o caminho de giz entre as cidades + as falas */
.on-baixo{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:0 clamp(1rem,3vw,3rem);align-items:start}
.on-casa--dd{margin-top:clamp(5rem,9vw,8rem)}
.on-rota{position:relative;margin:-.5rem 0 0 clamp(1rem,4vw,4rem)}
.on-caminho{display:block;width:100%;height:auto;overflow:visible;pointer-events:none}
.on-rota-t{position:absolute;font-family:var(--f-mao);font-weight:700;font-size:clamp(1.2rem,1.7vw,1.5rem);line-height:1;color:var(--tinta);white-space:nowrap}
.on-rota-t--a{left:16%;top:8%;transform:rotate(-5deg)}
.on-rota-t--b{right:9%;top:6%;transform:rotate(-4deg)}
.on-fala{margin:1.4rem 0 0 clamp(1rem,4vw,4rem);max-width:30rem}
.on-fala blockquote{margin:0;font-family:var(--f-mao);font-weight:700;font-size:clamp(1.7rem,2.6vw,2.4rem);line-height:1.05;color:var(--tinta)}
.on-fala figcaption{margin-top:.35rem;font-size:.95rem;color:var(--tinta-suave)}
.on-fala--paciente{margin-top:1.8rem;padding-left:1rem;border-left:3px solid color-mix(in oklab,var(--salvia) 70%,transparent)}
.on-fala--paciente blockquote{font-size:clamp(1.35rem,1.8vw,1.6rem)}

@media (max-width:1100px){
  .on-casa--cg{grid-template-columns:minmax(0,1fr)}
  .on-mapa{flex:none;height:18rem;min-height:0}
}
@media (max-width:900px){
  .on-topo{grid-template-columns:minmax(0,1fr)}
  .on-palco{padding:1rem .6rem 2.6rem;max-width:40rem}
  .on-baixo{grid-template-columns:minmax(0,1fr)}
  .on-casa--dd{margin-top:2rem}
  .on-rota,.on-fala{margin-left:0}
  .on-rota{margin-top:.5rem}
}
@media (max-width:560px){
  .on-anota{left:0;font-size:1.3rem}
  .on-botao{width:100%;justify-content:center}
  .on-fone{flex-wrap:wrap;column-gap:.4rem}
  .on-mapa{height:15rem}
  .on-rota-t--a{left:18%;top:4%}
  .on-rota-t--b{right:12%;top:-2%}
}


/* FECHO */
.fe{padding-bottom:clamp(2rem,5vw,4rem);overflow:clip}
.fe-in{display:grid;grid-template-columns:minmax(0,1fr);justify-items:center;text-align:center;position:relative;z-index:1}
.fe-texto{display:flex;flex-direction:column;align-items:center}
.fe-acoes{justify-content:center}
.fe-apoio{margin-left:auto;margin-right:auto}
.fe-titulo{font-size:clamp(2.4rem,5.6vw,5.4rem);max-width:17ch}
.fe-marca{position:relative;white-space:nowrap;isolation:isolate;display:inline-block}
.fe-giz{position:absolute;left:-4%;width:108%;top:40%;height:58%;z-index:-1;overflow:visible;pointer-events:none}
.fe-giz path{fill:none;stroke:var(--amarelo);stroke-width:44;stroke-linecap:round;opacity:.85}
.fe-aspa{margin-left:0}
@media (max-width:560px){.fe-aspa{margin-left:0}}
.fe-apoio{font-size:var(--t-apoio);line-height:1.55;max-width:34rem;margin:1.4rem 0 0}
.fe-acoes{display:flex;flex-wrap:wrap;gap:.9rem 1.6rem;align-items:center;margin-top:1.8rem}
.fe-link{font-weight:600;font-size:1.08rem;text-decoration:underline;text-decoration-color:var(--salvia);text-decoration-thickness:3px;text-underline-offset:6px;min-height:48px;display:inline-flex;align-items:center}
.fe-link:hover{text-decoration-color:var(--giz-vermelho)}
.fe-assina{margin:1.2rem 0 0;font-size:.98rem;letter-spacing:.04em;color:var(--tinta-suave)}
.fe-foto{margin:0;justify-self:center;width:min(100%,31rem)}
.fe-quadro{position:relative;aspect-ratio:1440/1791;transform:rotate(2.4deg)}
.fe-quadro::before{content:"";position:absolute;inset:3% 2% -2% 4%;background:rgb(91 20 34 / .16);filter:blur(18px);border-radius:8px;z-index:-1}
.fe-papel{position:absolute;inset:-2.4% -2.8%;background:var(--branco-foto);clip-path:url(#recorte);transform:rotate(-3deg)}
.fe-img{position:absolute;inset:0;clip-path:url(#recorte)}
.fe-img img{width:100%;height:100%;object-fit:cover;object-position:50% 30%}
.fe-fita{position:absolute;top:-3%;right:12%;width:30%;height:7%;background:rgb(127 176 208 / .55);mix-blend-mode:multiply;transform:rotate(6deg);clip-path:polygon(3% 8%,97% 0,100% 50%,96% 100%,2% 92%,0 45%)}
.fe-linha-caixa{position:relative;z-index:0;margin:clamp(1rem,3vw,2.5rem) calc(-1 * var(--borda)) 0;overflow:clip;padding-top:5rem}
.fe-linha{display:block;width:100%;height:auto;overflow:visible}
.fe-logo{opacity:0;transform-box:fill-box;transform-origin:50% 92%;transform:scale(.6) rotate(-8deg);transition:opacity .9s ease,transform 1.2s cubic-bezier(.2,.9,.25,1.15)}
.fe-linha.on .fe-logo{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.fe-logo{opacity:1;transform:none}}
@media (max-width:900px){
  .fe-in{grid-template-columns:minmax(0,1fr)}
  .fe-foto{order:-1;width:min(78%,22rem)}
  .fe-linha-caixa{margin-top:1.5rem}
  .fe-linha{width:220%;margin-left:-118%}
}


/* RODAPÉ */
.rp{position:relative;padding:4.5rem var(--borda) 2rem;background:var(--lousa);color:#f6e6dc;overflow:clip}
.rp-in{max-width:1500px;margin:0 auto;display:grid;grid-template-columns:1.2fr 1.4fr 1.4fr 1fr;gap:2rem 3rem;align-items:start}
.rp p{margin:0 0 .6rem;font-size:1rem;line-height:1.55}
.rp b{font-family:var(--f-titulo);font-weight:700;color:#fff8ef}
.rp a{color:#fff8ef;text-decoration:underline;text-decoration-color:var(--salvia);text-decoration-thickness:2px;text-underline-offset:4px}
.rp-marca{display:flex;gap:.9rem;align-items:flex-start}
.rp-marca img{width:34px;height:auto;filter:brightness(0) invert(.94) sepia(.2)}
.rp-selo{max-width:1500px;margin:3rem auto 0!important;padding-top:1.2rem;border-top:1px dashed rgb(246 230 220 / .3);font-size:.95rem!important;text-align:center;color:#e8cfc4}
@media (max-width:900px){.rp-in{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.rp-in{grid-template-columns:1fr}.rp{padding-bottom:6rem}}