/* pg · Perguntas dos pais (noite) */
.pg-grade {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: clamp(2rem, 5vw, 6rem);
  align-items: start;
}

/* ---------- lâmina: ela respondendo, com a figurinha da pergunta aberta ---------- */
.pg-esq { position: sticky; top: max(1.5rem, 6vh); }
.pg-lamina {
  position: relative;
  margin-left: calc(-1 * var(--margem));
}
.pg-foto {
  margin: 0; aspect-ratio: 1080 / 1040;
  border-radius: 0 var(--raio) var(--raio) 0;
  background: #b9a6a0;
  box-shadow: 0 40px 90px -40px rgb(0 0 0 / .7), 0 0 0 1px rgb(255 255 255 / .06) inset;
}
.pg-foto img { object-position: 50% 30%; }
.pg-foto::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 1;
  background: linear-gradient(to top, color-mix(in oklab, var(--noite) 55%, transparent), transparent 30%);
}
.pg-figurinha {
  position: absolute; z-index: 3; left: 50%; top: 4%; translate: -50% 0;
  width: min(74%, 340px);
  margin: 0; border-radius: 16px; overflow: hidden; text-align: center;
  background: #fff; color: #1b1b1b;
  box-shadow: 0 18px 40px -18px rgb(0 0 0 / .55);
  pointer-events: none;
  transition: transform .5s var(--curva), opacity .3s;
}
.pg-figurinha.pg-troca { opacity: 0; transform: translateY(-8px) scale(.96); }
.pg-figurinha-topo {
  background: #262626; color: #fff;
  font-size: .78rem; font-weight: 500; letter-spacing: .02em; padding: .55rem .8rem;
}
.pg-figurinha-texto {
  font-size: clamp(.9rem, .82rem + .3vw, 1.02rem); line-height: 1.32; font-weight: 500; padding: .75rem 1rem .85rem;
  text-wrap: balance;
}
.pg-legenda { position: absolute; z-index: 3; left: calc(var(--margem) + .2rem); bottom: 1rem; pointer-events: none; }

/* ---------- texto ---------- */
.pg-apoio { margin-top: var(--e-3); max-width: 34rem; }

.pg-lista { margin-top: var(--e-4); border-top: 1px solid color-mix(in oklab, var(--esmalte) 22%, transparent); }
.pg-item { border-bottom: 1px solid color-mix(in oklab, var(--esmalte) 22%, transparent); }
.pg-pergunta {
  list-style: none; cursor: pointer;
  display: grid; grid-template-columns: 1.4rem minmax(0, 1fr) 2.2rem; align-items: center; gap: .9rem;
  min-height: 64px; padding: .9rem 0;
  font-family: var(--f-titulo); font-weight: 500;
  font-size: clamp(1.12rem, .98rem + .55vw, 1.5rem); line-height: 1.22;
  -webkit-tap-highlight-color: transparent;
  transition: color .3s;
}
.pg-pergunta::-webkit-details-marker { display: none; }
.pg-pergunta:hover { color: var(--rosa-claro); }
.pg-pergunta:focus-visible { outline-offset: 2px; }
.pg-gota {
  width: .7rem; height: .7rem; border-radius: 50%; justify-self: center;
  border: 1.5px solid color-mix(in oklab, var(--esmalte) 45%, transparent);
  transition: background .4s, border-color .4s, box-shadow .4s, transform .5s var(--curva);
}
.pg-item[open] .pg-gota {
  border-color: transparent; transform: scale(1.25);
  background: radial-gradient(circle at 35% 35%, #ffd3e4, var(--rosa) 60%);
  box-shadow: 0 0 0 4px color-mix(in oklab, var(--rosa) 24%, transparent), 0 0 18px color-mix(in oklab, var(--rosa) 50%, transparent);
}
.pg-item[open] .pg-p-texto { color: var(--esmalte); }
.pg-mais {
  position: relative; width: 2.2rem; height: 2.2rem; border-radius: 50%;
  border: 1px solid color-mix(in oklab, var(--esmalte) 25%, transparent);
  transition: transform .45s var(--curva), background .3s, border-color .3s;
}
.pg-mais::before, .pg-mais::after {
  content: ""; position: absolute; left: 50%; top: 50%; width: .8rem; height: 1.5px; margin: -.75px 0 0 -.4rem;
  background: currentColor; border-radius: 2px; transition: transform .45s var(--curva);
}
.pg-mais::after { transform: rotate(90deg); }
.pg-item[open] .pg-mais { background: var(--rosa-claro); border-color: var(--rosa-claro); color: var(--noite); }
.pg-item[open] .pg-mais::after { transform: rotate(0deg); }

.pg-resposta {
  display: grid; gap: var(--e-2);
  padding: 0 3.1rem 1.6rem 2.3rem;
  color: var(--texto-suave); max-width: 44rem;
}
.pg-resposta .wf-fala { color: var(--esmalte); padding-left: 1rem; border-left: 2px solid color-mix(in oklab, var(--rosa) 70%, transparent); }
.pg-fonte { font-size: .8rem; letter-spacing: .04em; color: color-mix(in oklab, var(--texto-suave) 85%, transparent); }
.pg-link { color: var(--rosa-claro); margin-left: .3rem; white-space: nowrap; }
.pg-item[open] .pg-resposta { animation: pg-abre .6s var(--curva) both; }
@keyframes pg-abre { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }

/* ---------- convite ---------- */
.pg-convite {
  margin-top: var(--e-5);
  display: flex; flex-wrap: wrap; align-items: center; gap: var(--e-2) var(--e-4);
}
.pg-convite-fala { font-size: clamp(1.2rem, 1rem + .8vw, 1.6rem); color: var(--esmalte); }

/* ---------- celular e tablet ---------- */
@media (max-width: 960px) {
  .pg-grade { grid-template-columns: 1fr; gap: var(--e-4); }
  .pg-esq { position: relative; top: 0; }
  .pg-lamina { margin-right: calc(-1 * var(--margem)); }
  .pg-foto { border-radius: 0; aspect-ratio: 1080 / 1000; }
  .pg-pergunta { grid-template-columns: 1rem minmax(0, 1fr) 2.2rem; gap: .75rem; }
  .pg-resposta { padding: 0 0 1.4rem 1.75rem; }
  .pg-legenda { left: var(--margem); }
}
@media (max-width: 420px) {
  .pg-convite .wf-botao { width: 100%; justify-content: center; }
}

@media (prefers-reduced-motion: reduce) {
  .pg-item[open] .pg-resposta { animation: none; }
  .pg-figurinha, .pg-gota, .pg-mais, .pg-mais::before, .pg-mais::after { transition: none; }
}

/* ---------- rodada 1 ---------- */
.pg-lamina { margin-left: calc(-1 * (var(--margem) + max(0px, (100vw - 2 * var(--margem) - var(--largura)) / 2))); }
.pg-foto { aspect-ratio: 1080 / 1155; }
.pg-foto img { object-position: 50% 40%; }
.pg-legenda { left: auto; right: 1rem; }

.pg-item { position: relative; isolation: isolate; }
.pg-item::before {
  content: ""; position: absolute; z-index: -1; inset: -1px -1rem; border-radius: 18px;
  background: color-mix(in oklab, var(--vinho) 70%, transparent);
  box-shadow: 0 0 0 1px rgb(255 255 255 / .05) inset;
  opacity: 0; transition: opacity .4s;
}
.pg-item[open]::before { opacity: 1; }
.pg-item[open] { border-bottom-color: transparent; }

.pg-convite { display: grid; gap: var(--e-3); justify-items: start; }
.pg-caixinha {
  width: min(100%, 34rem); border-radius: 20px; overflow: hidden;
  background: #fff; color: #1b1b1b;
  box-shadow: 0 30px 70px -30px rgb(0 0 0 / .7);
  display: grid;
}
.pg-caixinha-topo { background: #262626; color: #fff; text-align: center; font-size: .9rem; font-weight: 500; padding: .7rem 1rem; }
.pg-caixinha-campo {
  font: 500 16px/1.4 var(--f-texto); color: #1b1b1b; text-align: center;
  border: 0; resize: none; background: #fff; padding: 1.1rem 1.2rem .6rem; min-height: 4.6rem;
}
.pg-caixinha-campo::placeholder { color: #8a8486; }
.pg-caixinha-campo:focus { outline: none; }
.pg-caixinha:focus-within { box-shadow: 0 30px 70px -30px rgb(0 0 0 / .7), 0 0 0 3px var(--rosa-claro); }
.pg-caixinha-botao { margin: .4rem 1rem 1rem; justify-content: center; border: 0; cursor: pointer; font-family: inherit; }
.pg-caixinha-botao:focus-visible { outline: 2px solid var(--rosa-escuro); outline-offset: 3px; }

@media (max-width: 960px) {
  .pg-grade { display: flex; flex-direction: column; gap: 0; }
  .pg-dir { display: contents; }
  .pg-topo { order: 1; }
  .pg-esq { order: 2; margin-top: var(--e-4); }
  .pg-lista { order: 3; }
  .pg-convite { order: 4; }
  .pg-lamina { margin-left: calc(-1 * var(--margem)); }
  .pg-foto { aspect-ratio: 1080 / 1100; }
  .pg-legenda { position: static; margin: .8rem 0 0 var(--margem); background: none; border: 0; padding: 0;
    -webkit-backdrop-filter: none; backdrop-filter: none; color: var(--texto-suave); font-size: .85rem; }
  .pg-item::before { inset: -1px calc(-1 * var(--margem)); border-radius: 0; }
}

/* ---------- rodada 2 ---------- */
.pg-esq .pg-convite { margin-top: var(--e-4); }
.pg-convite-fala { font-size: clamp(1.15rem, 1rem + .6vw, 1.45rem); }
.pg-caixinha .wf-botao { width: auto; justify-self: stretch; }
.pg-esq { top: max(1rem, 4vh); }
/* luz rosa vinda da lista, como a do hero */
.pg-luz { position: absolute; inset: 0; z-index: 1; pointer-events: none; mix-blend-mode: soft-light;
  background: linear-gradient(to left in oklch, color-mix(in oklab, var(--rosa-claro) 60%, transparent), transparent 45%); }
.pg-item[open] .pg-p-texto { font-style: italic; font-weight: 600; color: var(--rosa-claro); }
.pg-pergunta { transition: color .3s; }
@media (min-width: 961px) and (max-height: 820px) {
  .pg-foto { aspect-ratio: 1080 / 980; }
}
@media (max-width: 960px) {
  .pg-esq { display: contents; }
  .pg-lamina { order: 2; margin-top: var(--e-4); }
  .pg-legenda { order: 2; }
  .pg-esq .pg-convite { order: 4; margin-top: var(--e-5); }
}
@media (max-width: 960px) {
  .pg-fonte, .pg-legenda, .pg-figurinha-topo { font-size: .875rem; }
}