/* Página de escuta com formulário e acompanhamento da conversa. */
body.escuta-page .site-header {
  background: #242424 url('/cartaz-textura.svg') repeat;
  background-size: 180px 180px;
  border-bottom: 4px solid var(--red);
  padding: 24px max(20px, calc((100vw - 1100px) / 2));
}
body.escuta-page .site-header::after { display: none; }
.escuta-brand { display: block; width: 240px; max-width: 55%; }
.escuta-brand img { display: block; width: 100%; height: auto; }
body.escuta-page .site-header .back { color: var(--paper); }
body.escuta-page .site-header a:focus-visible { outline-color: var(--paper); }
.escuta-page #page-content { max-width: 850px; padding: 36px 24px 8px; margin: auto; }
body.escuta-page #escuta { margin: 0; padding: clamp(20px, 4vw, 40px); }
body.escuta-page #escuta h1 {
  font: 800 clamp(34px, 4.6vw, 54px)/1.05 var(--heading);
  color: var(--ink); text-transform: uppercase; margin: 12px 0 22px;
  letter-spacing: -.02em; overflow-wrap: normal;
}
.escuta-page #escuta > p { max-width: 780px; }
.escuta-page #escuta .listen-grid { grid-template-columns: minmax(0, 1fr); gap: 0; }
.escuta-page #escuta .listen-grid > div { min-width: 0; }
.escuta-page #escuta button, .escuta-page #escuta summary { min-height: 44px; }
.escuta-page .page-footer { max-width: 1052px; }
@media (max-width: 760px) {
  body.escuta-page .site-header { padding: 20px 18px; }
  .escuta-brand { width: 200px; }
  .escuta-page #page-content { padding: 24px 16px 0; }
  .escuta-page #escuta .listen-grid { grid-template-columns: minmax(0, 1fr); gap: 12px; }
}