/* ============================================================
   TESTEMUNHOS · efeitos
   Entrada em escada, aspas laranja a crescer, estrelas a acender
   uma a uma, anel laranja à volta das iniciais, destaque
   automático que passa de cartão em cartão e inclinação 3D ao
   passar o rato. No estilo claro do site.
   ============================================================ */
.testemunhos-grid { perspective: 1100px; }
.testemunho {
  position: relative; overflow: hidden;
  border: 1px solid transparent;
  transform-style: preserve-3d;
}
/* aspas grandes no canto, que crescem ao entrar */
.testemunho::before {
  content: '\201C'; position: absolute; top: -18px; right: 18px; z-index: 0;
  font-family: 'Cormorant Garamond', Georgia, serif; font-size: 9rem; line-height: 1;
  color: var(--orange); opacity: 0; transform: scale(.4) rotate(-12deg); transform-origin: 70% 40%;
  transition: opacity .8s ease, transform 1s cubic-bezier(.34,1.56,.64,1);
  pointer-events: none;
}
.testemunhos.em-cena .testemunho::before { opacity: .14; transform: none; }
.testemunhos.em-cena .testemunho:nth-child(2)::before { transition-delay: .15s; }
.testemunhos.em-cena .testemunho:nth-child(3)::before { transition-delay: .3s; }
.testemunho > * { position: relative; z-index: 1; }

/* estrelas a acender uma a uma */
.stars .estrela { display: inline-block; color: var(--gray); transform: scale(.6); transition: color .3s ease, transform .5s cubic-bezier(.34,1.56,.64,1); }
.testemunhos.em-cena .stars .estrela { color: var(--orange); transform: none; transition-delay: calc(.5s + var(--c, 0) * .1s + var(--e, 0) * .09s); }

/* anel laranja que se desenha à volta das iniciais */
.autor-initials { position: relative; }
.autor-initials svg { position: absolute; inset: -4px; width: calc(100% + 8px); height: calc(100% + 8px); transform: rotate(-90deg); overflow: visible; }
.autor-initials circle { fill: none; stroke: var(--orange); stroke-width: 1.5; stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 1.2s cubic-bezier(.65,0,.35,1); }
.testemunhos.em-cena .autor-initials circle { stroke-dashoffset: 0; transition-delay: calc(.7s + var(--c, 0) * .15s); }

/* destaque que passa de cartão em cartão */
.testemunho {
  transition: opacity .5s ease, transform .6s cubic-bezier(.16,1,.3,1), box-shadow .6s ease, border-color .6s ease, background-color .6s ease;
}
.testemunho.destaque {
  transform: translateY(-8px) rotateX(calc(var(--ry, 0) * 1deg)) rotateY(calc(var(--rx, 0) * 1deg));
  border-color: rgba(255,127,0,.35); background: var(--white); box-shadow: var(--shadow-md);
}
.testemunho.destaque::before { opacity: .24; }

/* inclinação 3D ao passar o rato */
.testemunho.a-mexer {
  transform: translateY(-8px) rotateX(calc(var(--ry, 0) * 1deg)) rotateY(calc(var(--rx, 0) * 1deg));
  transition: transform .12s linear, box-shadow .4s ease, border-color .4s ease, background-color .4s ease;
  border-color: rgba(255,127,0,.35); background: var(--white); box-shadow: var(--shadow-lg);
}