/* ============================================================
   Frase de assinatura — bloco colorido
   ============================================================ */
.frase{
  position:relative;
  overflow:hidden;
  text-align:center;
  margin:0 clamp(10px,2vw,22px);
  border-radius:var(--raio-g);
  background:var(--grad-quente);
  color:#fff;
}

.frase blockquote{
  position:relative;
  z-index:1;
  max-width:20ch;
  margin:0 auto;
  font-family:var(--display);
  font-weight:800;
  font-size:clamp(1.9rem,5vw,3.6rem);
  line-height:1.06;
  letter-spacing:-.04em;
}

.frase cite{
  position:relative;
  z-index:1;
  display:inline-block;
  margin-top:28px;
  padding:9px 18px;
  border-radius:var(--pilula);
  background:rgba(255,255,255,.18);
  font-style:normal;
  font-size:.8rem;
  font-weight:700;
  letter-spacing:.06em;
}

.frase .filete{color:#fff;opacity:.9}

/* aspas decorativas ao fundo */
.aspas{
  position:absolute;top:8%;left:50%;
  transform:translateX(-50%);
  pointer-events:none;
  user-select:none;
  font-family:var(--display);
  font-weight:800;
  font-size:clamp(11rem,30vw,24rem);
  line-height:.62;
  color:rgba(255,255,255,.16);
}