/* Sessão 2 · prova social. Estilos copiados do site bombeiros.avibedigital.com.br (css/style.css: 293-299, 483-513, 664, 694-810) e o fecho com a chamada para a ficha. */
.sec-head { max-width: 760px; margin-bottom: clamp(48px, 7vw, 90px); }
.eyebrow--plain { background: transparent; border-color: rgba(255,255,255,.18); }
.sec-title {
  font-family: var(--font-title); font-weight: 400; text-transform: uppercase;
  font-size: clamp(46px, 6.4vw, 96px); line-height: .92; margin: 0 0 18px;
}
.sec-sub { margin: 0; color: rgba(255,255,255,.7); font-size: clamp(16px, 1.3vw, 18px); max-width: 560px; }
/* ===== SEÇÃO 3: ESCOLAS ===== */
.schools {
  position: relative; overflow: hidden;
  padding: clamp(90px, 11vw, 160px) 0 clamp(70px, 9vw, 130px);
  background:
    radial-gradient(50% 35% at 50% 75%, rgba(229, 9, 20, .18), transparent 70%),
    linear-gradient(180deg, var(--black), #0d0607 60%, var(--black));
}
.sec-head--center { margin-inline: auto; text-align: center; padding: 0 var(--gutter); max-width: 1100px; }
.sec-head--center .sec-sub { margin-inline: auto; }

/* Faixas de nomes */
.names { display: grid; gap: 6px; margin-bottom: clamp(40px, 6vw, 80px); }
.names__row { overflow: hidden; transform: rotate(-2deg); }
.names__row--rev { transform: rotate(-2deg) translateY(-6px); }
.names__track {
  display: flex; align-items: center; gap: clamp(20px, 2.4vw, 36px); width: max-content;
  animation: marquee 48s linear infinite;
  font-family: var(--font-title); text-transform: uppercase; letter-spacing: .02em;
  font-size: clamp(44px, 6.4vw, 104px); line-height: 1.05;
}
.names__row--rev .names__track { animation-direction: reverse; animation-duration: 56s; }
.names:hover .names__track { animation-play-state: paused; }
.names__track span {
  color: transparent; -webkit-text-stroke: 1.5px rgba(255, 255, 255, .45); white-space: nowrap;
  transition: color .25s, -webkit-text-stroke-color .25s, text-shadow .25s;
}
.names__row--rev .names__track span { -webkit-text-stroke-color: rgba(229, 9, 20, .7); }
.names__track span:hover { color: var(--red); -webkit-text-stroke-color: var(--red); text-shadow: 0 0 40px rgba(229, 9, 20, .7); }
.names__track i { font-style: normal; color: var(--orange); font-size: .35em; }

@keyframes msgIn { to { opacity: 1; transform: none; } }
/* ===== SEÇÃO 5: DEPOIMENTOS ===== */
.testi {
  position: relative; padding: clamp(90px, 11vw, 150px) 0 clamp(80px, 10vw, 140px);
  background: radial-gradient(50% 30% at 50% 0%, rgba(229, 9, 20, .16), transparent 70%), var(--black);
}

/* Recorde Firebird */
.record {
  max-width: 1360px; margin: 0 auto; padding: 0 var(--gutter);
  display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(28px, 5vw, 80px); align-items: center;
}
.record__kicker { margin: 0 0 6px; font-size: 12px; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: var(--orange); }
.record__num { margin: 0 0 26px; display: flex; align-items: center; gap: 18px; font-family: var(--font-title); font-size: clamp(120px, 15vw, 220px); line-height: .85; }
.record__num span {
  background: linear-gradient(180deg, #fff3c4 0%, #ffb000 25%, var(--orange) 55%, var(--red) 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  filter: drop-shadow(0 10px 40px rgba(229, 9, 20, .35));
}
.record__num small { font-size: clamp(22px, 2.4vw, 34px); line-height: 1; color: #fff; letter-spacing: .03em; }
.record__bars { display: grid; gap: 14px; max-width: 460px; }
.rbar { display: grid; grid-template-columns: 1fr auto; gap: 6px 14px; align-items: center; }
.rbar span { grid-column: 1 / -1; font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: rgba(255,255,255,.55); }
.rbar i { display: block; height: 12px; border-radius: 12px; width: var(--w); background: rgba(255,255,255,.22); transform: scaleX(0); transform-origin: left; transition: transform 1.2s var(--ease-out); }
.rbar--vibe i { background: linear-gradient(90deg, var(--red), var(--orange)); box-shadow: 0 0 20px rgba(255, 90, 0, .5); transition-delay: .3s; }
.rbar b { font-family: var(--font-title); font-weight: 400; font-size: 30px; line-height: 1; }
.record.is-in .rbar i { transform: scaleX(1); }

.record__quote {
  position: relative; margin: 0; padding: clamp(28px, 3.5vw, 48px);
  border-radius: 28px; background: linear-gradient(160deg, #1b1b1e, #111113);
  border: 1px solid rgba(255,255,255,.08);
}
.record__quote::before {
  content: "“"; position: absolute; left: 22px; top: -40px; font-family: Georgia, serif; font-size: 160px; line-height: 1; color: var(--red);
}
.record__quote p { margin: 0 0 24px; font-size: clamp(19px, 1.7vw, 25px); line-height: 1.5; font-weight: 600; min-height: 7.5em; }
.record__quote p .caret { display: inline-block; width: 2px; height: 1em; background: var(--orange); margin-left: 2px; vertical-align: -.12em; animation: caret .8s steps(1) infinite; }
@keyframes caret { 50% { opacity: 0; } }
.record__quote footer { display: flex; align-items: center; gap: 12px; font-size: 14px; font-weight: 700; color: rgba(255,255,255,.75); }

/* Frase de indicação */
.referral { max-width: 1100px; margin: clamp(70px, 9vw, 120px) auto; padding: 0 var(--gutter); text-align: center; }
.referral blockquote {
  margin: 0 0 18px; font-family: var(--font-title); text-transform: uppercase;
  font-size: clamp(34px, 4.6vw, 70px); line-height: 1; letter-spacing: .01em;
}
.referral em { font-style: normal; color: var(--red); }
.referral figcaption { font-size: 14px; color: rgba(255,255,255,.6); }
.referral blockquote .w { display: inline-block; opacity: .15; transition: opacity .4s; }
.referral blockquote .w.is-on { opacity: 1; }

/* Cards que viram */
.tgrid {
  max-width: 1360px; margin: 0 auto; padding: 0 var(--gutter);
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(16px, 2vw, 26px);
}
.tcard { perspective: 1400px; height: 430px; opacity: 0; transform: translateY(40px); transition: opacity .7s var(--ease-out), transform .7s var(--ease-out); transition-delay: calc(var(--i) * 80ms); }
.tcard.is-in { opacity: 1; transform: none; }
.tcard__inner { position: relative; width: 100%; height: 100%; transform-style: preserve-3d; transition: transform .9s cubic-bezier(.3, 1.4, .5, 1); }
.tcard.is-flipped .tcard__inner { transform: rotateY(180deg); }
.tcard__face {
  position: absolute; inset: 0; border-radius: 24px; overflow: hidden;
  backface-visibility: hidden; -webkit-backface-visibility: hidden;
  border: 1px solid rgba(255,255,255,.09);
}
.tcard__front {
  display: flex; flex-direction: column; padding: 24px;
  background: radial-gradient(90% 60% at 100% 0%, rgba(229, 9, 20, .22), transparent 60%), #141416;
  transition: border-color .3s;
}
.tcard:hover .tcard__front { border-color: rgba(229, 9, 20, .5); }
.tcard__back { transform: rotateY(180deg); background: #0b0b0c; }
.tcard__back img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
.tcard__head { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }
.tcard__head b { display: block; font-size: 15px; line-height: 1.2; }
.tcard__head small { font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--orange); }
.tcard__avatar {
  flex: 0 0 auto; width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center;
  font-family: var(--font-title); font-size: 19px; letter-spacing: .02em; background: linear-gradient(135deg, var(--red), var(--orange));
}
.tcard__avatar.has-img { background: #fff; padding: 0; overflow: hidden; box-shadow: 0 0 0 2px rgba(229, 9, 20, .7); }
.tcard__avatar.has-img img { width: 100%; height: 100%; object-fit: cover; }
.tcard__num { margin: 0; font-family: var(--font-title); font-size: 96px; line-height: .9; white-space: nowrap; }
.tcard__unit { margin: 4px 0 0; font-size: 14px; font-weight: 600; color: rgba(255,255,255,.7); }
.tcard__chat {
  margin-top: auto; padding: 14px 12px 6px; border-radius: 16px;
  background: #0b141a url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='40' height='40'><circle cx='4' cy='4' r='1.2' fill='%23ffffff' fill-opacity='.05'/></svg>");
  display: flex; flex-direction: column;
}
.bubble {
  margin: 0 0 8px; max-width: 88%; padding: 7px 11px; border-radius: 10px; font-size: 13.5px; line-height: 1.35;
  opacity: 0; transform: translateY(8px) scale(.95);
}
.bubble--in { background: #202c33; border-top-left-radius: 2px; align-self: flex-start; }
.bubble--out { background: #005c4b; border-top-right-radius: 2px; align-self: flex-end; }
.tcard.is-in .bubble { animation: msgIn .45s var(--ease-out) calc(var(--d) + var(--i) * 80ms + .3s) forwards; }
.tcard__flip {
  margin-top: 14px; align-self: flex-start; cursor: pointer;
  font: 700 13px var(--font-body); color: #fff; padding: 9px 14px; border-radius: 999px;
  background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.18); transition: background .25s, border-color .25s;
}
.tcard__flip:hover { background: var(--red); border-color: var(--red); }
.tcard__flip span { display: inline-block; transition: transform .4s; }
.tcard__flip:hover span { transform: rotate(180deg); }
.tcard__flip--back { position: absolute; left: 16px; bottom: 16px; margin: 0; background: rgba(0,0,0,.7); backdrop-filter: blur(6px); }

@media (max-width: 960px) {
  .record { grid-template-columns: minmax(0, 1fr); }
  .record__quote p { min-height: 0; }
  .tgrid { grid-template-columns: minmax(0, 1fr); }
  .tcard { height: 430px; }
}
@media (min-width: 961px) and (max-width: 1180px) {
  .tgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}



/* ---------- ajustes desta página ---------- */
.testi .names { margin: 0 0 clamp(70px, 9vw, 120px); }
.tgrid { margin-top: clamp(60px, 8vw, 110px); }

/* fecho da sessão: chama de volta para a ficha */
.volta {
  max-width: 1360px; margin: clamp(60px, 8vw, 100px) auto 0; padding: 0 var(--gutter);
  display: flex; flex-direction: column; align-items: center; text-align: center; gap: 18px;
}
.volta__titulo {
  margin: 0; font-family: var(--font-title); font-weight: 400; text-transform: uppercase;
  font-size: clamp(40px, 4.6vw, 72px); line-height: .95;
}
.volta__nota { margin: 0; font-size: 15px; color: rgba(255, 255, 255, .65); }
.volta__nota b { color: #fff; }
.volta .btn-jelly { margin-top: 8px; }
.volta .btn-jelly__icon { transform: rotate(-90deg); }
.volta .btn-jelly:hover .btn-jelly__icon { transform: rotate(-90deg) translateX(5px); }
@media (max-width: 560px) {
  .volta .btn-jelly { width: 100%; justify-content: center; }
}
