/* Final refinement layer: source-backed hierarchy and mobile-first media behavior. */

img {
  height: auto;
}

.contact-copy > p.contact-hours-summary {
  max-width: 42ch;
  margin-top: 18px;
  padding: 14px 18px;
  border-left: 3px solid var(--yellow);
  border-radius: 0 12px 12px 0;
  background: rgb(255 255 255 / 9%);
  color: #fff;
  font-size: 16px;
  line-height: 1.5;
}

/* Proof of English in action, separated clearly by school stage. */
.evidence-section {
  overflow: clip;
  background:
    radial-gradient(circle at 0 10%, rgba(0, 174, 232, 0.1), transparent 28rem),
    #f6f9fb;
}

.voices-section,
.highschool-section {
  overflow: clip;
}

.tiger-talks {
  margin-top: clamp(36px, 5vw, 60px);
  overflow: hidden;
  border-radius: 26px;
  color: var(--white);
}

.tiger-talks-heading {
  align-items: end;
}

.tiger-talks-heading > div:first-child {
  max-width: 780px;
}

.tiger-talks-heading h3 {
  margin-top: 8px;
  font-weight: 700;
  letter-spacing: -0.045em;
  line-height: 1.02;
}

.tiger-talks-heading p:last-child {
  max-width: 58ch;
  margin-top: 14px;
  line-height: 1.6;
}

.tiger-talks .carousel-controls button {
  color: var(--white);
  border-color: rgba(255, 255, 255, 0.34);
  background: rgba(255, 255, 255, 0.08);
}

.tiger-talks .carousel-controls button:disabled {
  color: rgba(255, 255, 255, 0.35);
  border-color: rgba(255, 255, 255, 0.13);
  background: rgba(255, 255, 255, 0.03);
}

/* Testimonial narrative: story first, more voices next, results last.
   Fluxo de bloco: a ordem é a do HTML, sem flex nem `order`. */
.voices-section > .container {
  display: block;
}

.approval-carousel {
  margin-top: 28px;
}

.approval-track {
  padding-block: 12px 22px;
}

.approval-note {
  max-width: 55ch;
  margin-top: 9px;
  color: var(--muted);
  font-size: var(--texto--2);
  line-height: 1.5;
}

/* The High School gallery becomes a stable grid; no percentage-height crop. */
.highschool-gallery {
  display: grid;
  min-height: 520px;
  grid-template-columns: minmax(0, 1.32fr) minmax(180px, 0.68fr);
  grid-template-rows: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.highschool-gallery::before {
  display: none;
}

.gallery-main,
.gallery-small {
  position: static;
  width: 100%;
  height: 100%;
  min-width: 0;
  border: 0;
  border-radius: 16px;
  object-position: center;
}

.gallery-main {
  grid-row: 1 / 3;
}

/* O contato permanece no fluxo da pagina; sem botao flutuante sobre conteudo. */
.mobile-contact.whatsapp-float {
  display: none;
  right: max(16px, env(safe-area-inset-right));
  bottom: max(16px, env(safe-area-inset-bottom));
  min-height: 54px;
  padding: 9px 18px 9px 9px;
  align-items: center;
  gap: 10px;
  color: var(--ink);
  border: 1px solid rgba(16, 22, 31, 0.3);
  border-radius: 999px;
  background: var(--cyan);
  box-shadow: 0 16px 42px rgba(16, 22, 31, 0.28);
  font-size: var(--texto--2);
  font-weight: 700;
}

.whatsapp-mark {
  display: grid;
  width: 36px;
  height: 36px;
  flex: none;
  place-items: center;
  border-radius: 50%;
  color: var(--white);
  background: var(--ink);
  font-size: var(--texto-0);
}

.mobile-contact.whatsapp-float:hover {
  color: var(--ink);
  background: var(--yellow);
  transform: translateY(-2px);
}

@media (max-width: 1100px) {

  .hero-grid {
    min-height: 0;
    grid-template-columns: 1fr;
  }

  .hero-copy {
    max-width: 760px;
  }

  .hero-visual {
    min-height: 0;
    margin-inline: 0;
    aspect-ratio: auto;
  }

  .hero-visual::before {
    inset: 10px -8px -10px 8px;
  }

  .hero-visual picture {
    position: relative;
    inset: auto;
    display: block;
    aspect-ratio: auto;
    overflow: hidden;
    clip-path: none;
    border-radius: 22px;
  }

  .hero-visual picture img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
    object-position: center;
  }
}

@media (max-width: 900px) {

  .highschool-gallery {
    min-height: 460px;
  }
}

@media (max-width: 720px) {
  body {
    padding-bottom: 84px;
  }

  .section {
    padding-block: 60px;
  }

  .brand {
    display: inline-flex;
    min-height: 44px;
    align-items: center;
  }

  .site-nav {
    display: grid;
    padding: 12px 14px 14px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    overflow: visible;
  }

  .site-nav a {
    display: flex;
    min-height: 44px;
    padding: 8px 10px;
    align-items: center;
    justify-content: center;
    text-align: center;
  }

  .text-link,
  .partner-row a,
  .direct-contacts a,
  .site-footer a {
    display: inline-flex;
    min-height: 44px;
    align-items: center;
  }

  .carousel-controls button,
  .modal-close {
    width: 44px;
    height: 44px;
  }

  .journey-heading h2,
.beyond-heading h2,
.results-heading h2,
.faq-intro h2,
.contact-copy h2 {
    font-size: var(--texto-4);
  }

  .tiger-talks {
    margin: 38px -14px 0;
    padding: 24px 14px;
    border-block: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 0;
  }

  .tiger-talks-heading,
.approval-carousel .carousel-heading {
    position: relative;
    display: block;
  }

  .tiger-talks-heading .carousel-kicker,
.approval-carousel .carousel-kicker {
    min-height: 42px;
    padding-right: 104px;
  }

  .tiger-talks-heading .carousel-controls,
.approval-carousel .carousel-controls {
    position: absolute;
    top: 0;
    right: 0;
  }

  .tiger-talks-heading h3,
.approval-carousel .carousel-heading h3 {
    max-width: none;
    margin-top: 18px;
    font-size: var(--texto-2);
  }

  .approval-track {
    grid-auto-columns: 100%;
  }

  .highschool-gallery {
    min-height: 0;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: auto;
    gap: 8px;
  }

  .gallery-main,
  .gallery-small {
    position: static;
    width: 100%;
    height: auto;
    aspect-ratio: auto;
  }

  .gallery-main {
    grid-row: auto;
    grid-column: 1 / -1;
  }

  .approval-carousel {
    margin-inline: 0;  /* era -14px: sangrava 14px alem do container no mobile */
    padding: 18px 14px;
    border-radius: 0;
  }

  .mobile-contact.whatsapp-float {
    right: 14px;
    left: 14px;
    bottom: max(12px, env(safe-area-inset-bottom));
    width: auto;
    min-height: 56px;
    justify-content: center;
  }
}

@media (max-width: 480px) {
  .hero-visual picture {
    overflow: hidden;
    clip-path: none;
    border-radius: 18px;
  }

  .hero-visual::before {
    display: none;
  }

  .hero-stamp {
    right: 10px;
    bottom: 10px;
  }

  .tiger-talks-heading h3,
.approval-carousel .carousel-heading h3 {
    font-size: var(--texto-2);
  }

  .approval-carousel {
    padding: 16px;
  }

  .mobile-contact.whatsapp-float {
    right: 12px;
    left: 12px;
    max-width: calc(100vw - 24px);
    min-height: 56px;
    padding-right: 16px;
    font-size: var(--texto--2);
  }
}

@media (max-width: 360px) {

  .tiger-talks-heading .carousel-kicker,
.approval-carousel .carousel-kicker {
    padding-right: 92px;
  }

  .tiger-talks-heading h3,
.approval-carousel .carousel-heading h3 {
    font-size: var(--texto-1);
  }

  .mobile-contact.whatsapp-float span:last-child {
    white-space: nowrap;
  }
}

/* ─────────────────────────────────────────────────────────────
   Carrossel de vivências reais (fotos e legendas do folder).
   ───────────────────────────────────────────────────────────── */
.activity-carousel {
  margin-top: clamp(32px, 4.5vw, 52px);
}

.activity-carousel-heading h3 {
  margin-top: 8px;
  font-family: var(--display);
  font-size: var(--texto-3);
  font-weight: 700;
  letter-spacing: -0.035em;
  line-height: 1.1;
}

.activity-rail {
  display: grid;
  margin-top: 26px;
  padding-bottom: 6px;
  grid-auto-flow: column;
  grid-auto-columns: calc((100% - 3 * 18px) / 4);
  gap: 18px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: thin;
  overscroll-behavior-x: contain;
  cursor: grab;
  touch-action: pan-x;
}

.activity-rail:active {
  cursor: grabbing;
}

.activity-rail::-webkit-scrollbar {
  height: 8px;
}

.activity-rail::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(15, 67, 112, 0.28);
}

.activity-card {
  display: flex;
  min-width: 0;
  margin: 0;
  overflow: hidden;
  flex-direction: column;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--white);
  box-shadow: 0 14px 38px rgba(8, 30, 46, 0.09);
  scroll-snap-align: start;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.activity-card:hover {
  box-shadow: 0 20px 48px rgba(8, 30, 46, 0.15);
  transform: translateY(-4px);
}

.activity-media {
  overflow: hidden;
  aspect-ratio: 1 / 1;
  background: #dce8ee;
}

.activity-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.45s ease;
}

.activity-card:hover .activity-media img {
  transform: scale(1.04);
}

.highschool-activity-carousel {
  padding-top: clamp(26px, 4vw, 42px);
  border-top: 1px solid rgba(255, 255, 255, 0.18);
}

.highschool-gallery img {
  transition: transform 0.45s ease, filter 0.45s ease;
}

.highschool-gallery:hover .gallery-main {
  transform: translateY(-3px) scale(1.01);
}

.highschool-gallery:hover .gallery-speech {
  transform: translate(-3px, -3px) rotate(-1deg);
}

.highschool-gallery:hover .gallery-class {
  transform: translate(3px, -3px) rotate(1deg);
}

.activity-card figcaption {
  display: grid;
  padding: 16px 18px 20px;
  align-content: start;
  gap: 8px;
}

.activity-tag {
  color: var(--er-green-dark);
  font-size: var(--texto--2);
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.activity-card figcaption p {
  margin: 0;
  color: var(--ink);
  font-size: var(--texto--2);
  font-weight: 700;
  line-height: 1.45;
}

@media (max-width: 1100px) {
  .activity-rail {
    grid-auto-columns: calc((100% - 2 * 16px) / 3);
    gap: 16px;
  }
}

@media (max-width: 900px) {
  .activity-rail {
    grid-auto-columns: calc((100% - 16px) / 2);
  }
}

@media (max-width: 640px) {
  .activity-rail {
    grid-auto-columns: 82%;
    gap: 14px;
  }

  .activity-carousel-heading {
    position: relative;
    display: block;
  }

  .activity-carousel-heading .carousel-kicker {
    min-height: 42px;
    padding-right: 104px;
  }

  .activity-carousel-heading .carousel-controls {
    position: absolute;
    top: 0;
    right: 0;
  }
}

.gallery-main,
.gallery-small {
  object-fit: cover;
  background: transparent;
}

.gallery-diploma {
  padding: clamp(16px, 2.5vw, 34px);
  object-fit: contain;
  object-position: 55% 50%;
  background: #f3efe4;
}

.gallery-class {
  object-position: 50% 42%;
}

@media (min-width: 721px) {
  .highschool-gallery {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: minmax(170px, 0.72fr) minmax(0, 1.28fr);
  }

  .gallery-diploma {
    grid-row: 1;
    grid-column: 1 / -1;
  }
  .gallery-class { grid-row: 2; grid-column: 2; }
}

.activity-media .focus-classroom {
  object-position: 50% 42%;
}

.activity-media .focus-speaker {
  object-position: 48% 32%;
}

.activity-media .focus-history {
  object-position: 50% 30%;
}

.activity-media .focus-recording {
  object-position: 48% 28%;
}

.activity-media .focus-teacher {
  object-position: 62% 44%;
}

/* Tiger Talks é o palco da página: fundo preto e vídeos maiores. */
.tiger-talks {
  padding: clamp(30px, 5vw, 64px);
  border: 1px solid rgba(255, 255, 255, 0.12);
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.28);
}

.tiger-talks-heading h3 {
  max-width: 18ch;
  font-size: var(--texto-5);
}

.tiger-talks-heading p:last-child {
  color: #d7e0e5;
  font-size: var(--texto-0);
}

/* Arraste real por mouse e touch; o estado é aplicado pelo JavaScript. */
.activity-rail,
.tiger-rail,
.approval-track {
  cursor: grab;
  touch-action: pan-y pinch-zoom;
}

.activity-rail.is-dragging,
.tiger-rail.is-dragging,
.approval-track.is-dragging {
  cursor: grabbing;
  scroll-behavior: auto;
  scroll-snap-type: none;
  user-select: none;
}

@media (max-width: 640px) {

  .tiger-talks {
    margin-inline: 0;  /* era -14px: sangrava 14px alem do container no mobile */
    padding: 30px 14px 34px;
    border-radius: 0;
  }
}

/* ─────────────────────────────────────────────────────────────
   Identidade Mizzou / Dual Diploma High School — preto e laranja.
   Vale só para o percurso internacional; o azul e o verde do logo
   Emílio Ribas continuam sendo a cor de todo o resto da percurso.
   ───────────────────────────────────────────────────────────── */
.activity-tag-mizzou,
.highschool-activity-carousel .activity-tag {
  display: inline-block;
  width: fit-content;
  background: var(--mz-black, #14181d);
  color: var(--mz-gold, #f1b830);
  padding: 3px 8px;
  border-radius: 6px;
  font-weight: 700;
  font-size: var(--texto--2);
  letter-spacing: 0.05em;
}

.eyebrow-mizzou {
  color: var(--mz-gold-deep);
}

/* "Dual Diploma High School em ação": a seção tem fundo claro, então o título
   branco herdado ficava invisível e o kicker vinha em verde. */
.highschool-activity-carousel {
  border-top-color: rgba(20, 24, 29, 0.14);
}

.highschool-activity-carousel .carousel-kicker {
  color: var(--mz-gold-deep);
}

.highschool-activity-carousel .activity-carousel-heading h3 {
  max-width: none;
  color: var(--mz-black);
}

.highschool-activity-carousel .carousel-controls button {
  color: var(--mz-black);
  border-color: rgba(20, 24, 29, 0.28);
}

.highschool-activity-carousel .carousel-controls button:hover {
  color: var(--white);
  border-color: var(--mz-black);
  background: var(--mz-black);
}

/* Tiger Talks é uma vitrine do percurso internacional: painel preto, acento laranja. */
.tiger-talks {
  background:
    radial-gradient(circle at 100% 0, rgba(241, 184, 48, 0.20), transparent 22rem),
    var(--mz-black);
}

.tiger-talks-heading .carousel-kicker {
  color: var(--mz-gold-soft);
}

.tiger-talks .carousel-controls button:hover {
  color: var(--mz-black);
  border-color: var(--mz-gold);
  background: var(--mz-gold);
}

/* ─────────────────────────────────────────────────────────────
   Títulos das vivências ocupando a largura inteira do container.
   ───────────────────────────────────────────────────────────── */
.beyond-heading {
  display: block;
}

.beyond-heading h2 {
  max-width: none;
}

.activity-carousel-heading h3 {
  max-width: none;
}

.tiger-talks .mini-play {
  background: var(--mz-gold);
}

/* ─────────────────────────────────────────────────────────────
   Acabamento dos carrosséis: os cards estavam duros demais —
   cantos quase retos, sem profundidade e sem reação ao ponteiro.
   Raios maiores, sombra suave, elevação e zoom curto na foto.
   ───────────────────────────────────────────────────────────── */
.activity-card,
.approval-card,
.video-card,
.alumni-card {
  overflow: hidden;
  border-radius: 20px;
  box-shadow: 0 2px 10px rgba(11, 23, 34, 0.05);
  transition: transform 0.28s cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 0.28s ease, border-color 0.24s ease;
}

.activity-card:hover,
.approval-card:hover,
.video-card:hover,
.alumni-card:hover {
  box-shadow: 0 18px 40px rgba(11, 23, 34, 0.13);
  transform: translateY(-6px);
}

.activity-media,
.video-thumb,
.alumni-card .video-thumb {
  border-radius: 20px 20px 0 0;
}

.activity-media img,
.approval-card img {
  transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
}

.activity-card:hover .activity-media img,
.approval-card:hover img {
  transform: scale(1.045);
}

/* O trilho ganha respiro para a sombra dos cards não ser cortada. */
.activity-rail,
.alumni-rail,
.approval-track,
.tiger-rail {
  padding-block: 4px 20px;
  scroll-padding-inline: 2px;
}

/* Entrada escalonada: os cards aparecem em sequência quando o trilho surge. */
.motion-ready [data-reveal] .activity-card,
.motion-ready [data-reveal] .alumni-card,
.motion-ready [data-reveal] .approval-card {
  opacity: 0;
  transform: translateY(14px);
  transition: opacity 0.5s ease, transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}

.motion-ready [data-reveal].is-visible .activity-card,
.motion-ready [data-reveal].is-visible .alumni-card,
.motion-ready [data-reveal].is-visible .approval-card {
  opacity: 1;
  transform: none;
}

.motion-ready [data-reveal].is-visible .activity-card:nth-child(2),
.motion-ready [data-reveal].is-visible .alumni-card:nth-child(2),
.motion-ready [data-reveal].is-visible .approval-card:nth-child(2) { transition-delay: 0.07s; }
.motion-ready [data-reveal].is-visible .activity-card:nth-child(3),
.motion-ready [data-reveal].is-visible .alumni-card:nth-child(3),
.motion-ready [data-reveal].is-visible .approval-card:nth-child(3) { transition-delay: 0.14s; }
.motion-ready [data-reveal].is-visible .activity-card:nth-child(4),
.motion-ready [data-reveal].is-visible .alumni-card:nth-child(4),
.motion-ready [data-reveal].is-visible .approval-card:nth-child(4) { transition-delay: 0.21s; }
.motion-ready [data-reveal].is-visible .activity-card:nth-child(n + 5),
.motion-ready [data-reveal].is-visible .alumni-card:nth-child(n + 5),
.motion-ready [data-reveal].is-visible .approval-card:nth-child(n + 5) { transition-delay: 0.28s; }

@media (prefers-reduced-motion: reduce) {
  .activity-card,
  .approval-card,
  .video-card,
  .alumni-card,
  .activity-media img,
  .approval-card img {
    transition: none;
  }

  .motion-ready [data-reveal] .activity-card,
  .motion-ready [data-reveal] .alumni-card,
  .motion-ready [data-reveal] .approval-card {
    opacity: 1;
    transform: none;
    transition: none;
  }

  .activity-card:hover,
  .approval-card:hover,
  .video-card:hover,
  .alumni-card:hover {
    transform: none;
  }
}

/* ─────────────────────────────────────────────────────────────
   Tudo que nasce da parceria com a University of Missouri sai da
   paleta azul/verde: High School, Tiger Talks, depoimentos de alunos
   e famílias do programa e aprovações internacionais. Preto e o
   dourado MU (Pantone 123 C).
   ───────────────────────────────────────────────────────────── */
.families-heading .carousel-kicker,
.alumni-heading .carousel-kicker,
.approval-carousel .carousel-kicker {
  color: var(--mz-gold-deep);
}

.alumni-card .card-copy small,
.approval-note {
  color: var(--mz-gold-deep);
  font-weight: 700;
}

.families .video-card:hover,
.alumni-card:hover,
.approval-card:hover,
.mother-card:hover {
  border-color: var(--mz-black);
}

.families .carousel-controls button:hover,
.alumni-carousel .carousel-controls button:hover,
.approval-carousel .carousel-controls button:hover {
  color: var(--mz-black);
  border-color: var(--mz-gold);
  background: var(--mz-gold);
}

@media (min-width: 901px) {

  .families .carousel-controls {
    display: none;
  }
}

/* Seção do Dual Diploma High School */
.highschool-copy .eyebrow-mizzou::before {
  background: var(--mz-gold);
}

.highschool-copy .check-list li::before {
  color: var(--mz-black);
  background: var(--mz-gold);
}

.highschool-copy .partner-row a {
  color: var(--mz-gold-deep);
}

.highschool-gallery img {
  border-radius: 20px;
}

/* ─────────────────────────────────────────────────────────────
   Contrato cromático e área segura — revisão 11/08/2026

   A interface geral usa ciano, amarelo da campanha, tinta e branco. Preto e
   dourado Mizzou ficam restritos aos cards Middle/High, Tiger Talks e à seção
   de High School. Aprovações e depoimentos gerais não herdam essa marca.
   ───────────────────────────────────────────────────────────── */

.mobile-contact.whatsapp-float {
  display: none;
}

.families-heading .carousel-kicker,
.alumni-heading .carousel-kicker,
.approval-carousel .carousel-kicker,
.alumni-card .card-copy small,
.approval-note {
  color: var(--blue-dark);
}

.families .carousel-controls button:hover,
.alumni-carousel .carousel-controls button:hover,
.approval-carousel .carousel-controls button:hover {
  color: var(--ink);
  border-color: var(--cyan);
  background: var(--cyan);
}

main section[id],
main [id] {
  scroll-margin-top: 104px;
}

/* A disciplina do High School pede leitura comparativa, não mais um gesto de
   carrossel. Em telas largas, cinco registros formam uma grade editorial 3+2. */
.activity-rail.highschool-activity-grid {
  grid-auto-flow: row;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  grid-auto-columns: auto;
  overflow: visible;
  scroll-snap-type: none;
  cursor: default;
  touch-action: auto;
}

/* Controles só aparecem depois que o JavaScript confirma que o trilho está
   operável. Assim, uma falha parcial nunca deixa setas inertes na página. */
.js [data-carousel] .carousel-controls {
  opacity: 0;
  pointer-events: none;
}

.js [data-carousel].is-ready .carousel-controls {
  opacity: 1;
  pointer-events: auto;
}

.carousel-status {
  display: inline-grid;
  min-width: 3.5rem;
  height: 44px;
  padding-inline: 10px;
  place-items: center;
  border: 1px solid currentColor;
  border-radius: 999px;
  color: currentColor;
  font-size: var(--texto--2);
  font-weight: 700;
  letter-spacing: 0.04em;
}

[data-carousel-track] {
  scrollbar-width: none;
}

[data-carousel-track]::-webkit-scrollbar {
  display: none;
}

:where(a, button, [tabindex]):focus-visible {
  outline: 3px solid var(--cyan);
  outline-offset: 4px;
}

.tiger-talks :where(a, button, [tabindex]):focus-visible {
  outline-color: var(--mz-gold);
}

@media (max-width: 900px) {
  .activity-rail.highschool-activity-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .activity-rail.highschool-activity-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .carousel-status {
    min-width: 3rem;
    height: 42px;
    padding-inline: 8px;
  }
}

/* Page pass 2026-08-11: evidence first, less catalogue fatigue. */
/* Elementos ocultos precisam vencer composicoes locais que declaram display. */
[hidden] {
  display: none !important;
}

.highschool-copy {
  order: -1;
}

@media (min-width: 901px) {

  .axes-heading .eyebrow {
    grid-column: 1 / -1;
  }
}

@media (max-width: 760px) {

  .site-footer a,
  .direct-contacts a {
    display: inline-flex;
    min-height: 44px;
    align-items: center;
  }
}

/* Vídeo institucional completo, gravado em formato vertical (Reels/Stories),
   como abertura da página — antes do hero da campanha. */
/* Vídeo institucional completo com destaque em retângulo colorido e mockup de celular */
.opening-film-section {
  padding-top: clamp(24px, 4vw, 40px);
  padding-bottom: clamp(28px, 4.5vw, 44px);
  background: var(--paper, #fffdf7);
}

.opening-film-card {
  display: grid;
  align-items: center;
  gap: clamp(24px, 4vw, 48px);
  grid-template-columns: minmax(0, 1fr);
  justify-items: center;
  padding: clamp(20px, 4vw, 36px) clamp(16px, 4vw, 48px);
  border-radius: 28px;
  background: linear-gradient(135deg, #07253b 0%, #00456f 55%, #006094 100%);
  border: 1px solid rgba(0, 174, 237, 0.3);
  box-shadow: 0 16px 40px rgba(7, 37, 59, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.15);
  text-align: center;
}

.opening-film-copy .eyebrow-light {
  display: inline-block;
  color: #5cd3ff;
  font-size: clamp(0.68rem, 2.2vw, 0.82rem);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  white-space: normal;
  max-width: 100%;
}

.opening-film-copy h2 {
  margin: 8px 0 0;
  max-width: 18ch;
  color: #ffffff;
  font-family: var(--display, inherit);
  font-size: var(--texto-4);
  font-weight: 700;
  letter-spacing: -0.04em;
  line-height: 1.08;
}

.opening-film-copy .button {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 20px;
  padding: 12px 24px;
  border-radius: 999px;
  border: 2px solid #ffffff;
  color: #07253b;
  background: #ffffff;
  font-size: var(--texto--1);
  font-weight: 700;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.16);
  transition: all 0.25s ease;
}

.opening-film-copy .button:hover,
.opening-film-copy .button:focus-visible {
  border-color: #5cd3ff;
  color: #10161f;
  background: #5cd3ff;
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(92, 211, 255, 0.35);
}

.opening-film-holder {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
}

/* Mockup de celular refinado e compacto para controlar a altura da seção */
.opening-film-frame {
  position: relative;
  width: min(100%, 250px);
  max-width: 250px;
  padding: 8px;
  border-radius: 34px;
  background: #151d26;
  box-shadow:
    0 18px 40px -8px rgba(0, 0, 0, 0.6),
    0 0 0 2px rgba(255, 255, 255, 0.12),
    inset 0 0 0 1px rgba(0, 0, 0, 0.8);
  overflow: hidden;
}

/* Dynamic Island / Notch */
.opening-film-frame::before {
  content: "";
  position: absolute;
  top: 13px;
  left: 50%;
  transform: translateX(-50%);
  width: 56px;
  height: 12px;
  background: #0c1218;
  border-radius: 8px;
  z-index: 5;
  pointer-events: none;
}

/* Lente de câmera frontal no notch */
.opening-film-frame::after {
  content: "";
  position: absolute;
  top: 16px;
  left: calc(50% + 15px);
  width: 6px;
  height: 6px;
  background: #1e2c3c;
  border-radius: 50%;
  z-index: 6;
  pointer-events: none;
}

.opening-film-video {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 9 / 16;
  border: 0;
  border-radius: 26px;
  background: #000;
  object-fit: cover;
}

@media (min-width: 881px) {
  .opening-film-card {
    grid-template-columns: minmax(0, 1fr) auto;
    justify-items: initial;
    text-align: left;
  }

  .opening-film-holder {
    justify-self: end;
  }
}

/* Logos recortados com transparência e equilibrados por área ótica. */
.parceiros {
  margin-top: clamp(28px, 4vw, 48px);
  padding-top: clamp(24px, 3vw, 36px);
  border-top: 1px solid var(--line);
}

.parceiros-lista {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: clamp(24px, 4vw, 56px);
  margin: 0;
  padding: 0;
  list-style: none;
}

.parceiros-lista li {
  display: flex;
  min-height: 88px;
  flex: 1 1 150px;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  gap: 14px;
  text-align: center;
}

.parceiros-lista img { display: block; width: auto; max-width: 100%; object-fit: contain; }
.parceiros-lista li:nth-child(1) img { height: 55px; }
.parceiros-lista li:nth-child(2) img { height: 29px; }
.parceiros-lista li:nth-child(3) img { height: 33px; }
.parceiros-lista li:nth-child(4) img { height: 31px; }
.parceiros-lista span { color: var(--muted); font-size: var(--texto--2); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.partner-row img { width: auto; height: 34px; }

@media (max-width: 599px) {
  .parceiros-lista { gap: 28px 20px; }
  .parceiros-lista li { flex-basis: 120px; }
}

/* ---------------------------------------------- Vídeo oficial da campanha */
/* Bloco autocontido com largura controlada para evitar excesso de largura no desktop */
.campanha-video-moldura {
  width: 100%;
  max-width: 860px;
  margin: 0 auto;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border-radius: 20px;
  background: #10161f;
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.45);
}
.campanha-video-moldura video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.campaign-opening-film {
  padding: clamp(16px, 3vw, 28px) 0 clamp(20px, 3.5vw, 36px);
  background: #10161f;
}

.campaign-opening-film .container {
  width: min(100% - (var(--gutter) * 2), 860px);
  max-width: 860px;
  margin: 0 auto;
}

.campaign-opening-film .campanha-video-moldura {
  width: 100%;
  max-width: 860px;
  margin: 0 auto;
  aspect-ratio: 16 / 9;
  border-radius: 20px;
  box-shadow: 0 20px 50px rgb(0 0 0 / 40%);
}

@media (max-width: 720px) {
  .campaign-opening-film { padding: 10px 0 20px; }
  .campaign-opening-film .campanha-video-moldura { border-radius: 14px; }
}

/* --------------------------------------- Alvo de toque minimo, 44x44 CSS px */
/* Padding expande a area clicavel sem alterar o layout visual; a margem
   negativa cancela o deslocamento que o padding causaria nos vizinhos. */
.text-link,
[data-track="mizzou_oficial"],
[data-track="phone_unidade1"],
[data-track="phone_unidade2"] {
  padding-block: 13px;
  margin-block: -13px;
}

/* ─────────────────────────────────────────────────────────────
   Seletor de etapa · show, don't tell
   Substitui o círculo comprimido e três blocos repetitivos por um palco único.
   ───────────────────────────────────────────────────────────── */

.stage-explorer {
  position: relative;
  isolation: isolate;
  overflow: clip;
  background:
    radial-gradient(circle at 8% 16%, rgb(0 174 237 / 14%), transparent 28rem),
    radial-gradient(circle at 96% 82%, rgb(253 221 2 / 13%), transparent 24rem),
    #eef8fc;
}

.stage-explorer::before {
  position: absolute;
  z-index: -1;
  top: 5rem;
  right: -7rem;
  width: 19rem;
  height: 19rem;
  border: 1px solid rgb(0 104 143 / 15%);
  border-radius: 50%;
  box-shadow: 0 0 0 3.5rem rgb(255 255 255 / 36%), 0 0 0 7rem rgb(0 174 237 / 5%);
  content: "";
}

.stage-explorer-heading {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(18rem, 0.75fr);
  /* Era `end`: a coluna mais curta descia para a base da linha e
     abria um vazio acima dela. */
  align-items: start;
  gap: clamp(2rem, 6vw, 7rem);
}

.stage-explorer-heading h2 {
  max-width: 13ch;
  margin: 0;
  font-size: var(--texto-6);
  line-height: 0.92;
  letter-spacing: -0.065em;
}

.stage-explorer-heading h2 b {
  color: var(--er-blue-dark);
  font-weight: 700;
}

.stage-explorer-heading > p {
  /* 34rem devolvia 42 caracteres por linha em 768px, abaixo dos 45 do
     contrato. A coluna precisa de mais largura, não de menos texto. */
  max-width: 40rem;
  margin: 0 0 0.45rem;
  color: var(--muted);
  font-size: var(--texto-1);
  line-height: 1.7;
}

.stage-explorer-shell {
  position: relative;
  margin-top: clamp(2rem, 4vw, 3rem);
  padding: 14px;
  border-radius: 34px;
  background: var(--ink);
  box-shadow: 0 32px 90px rgb(8 30 46 / 22%);
}

.stage-explorer-shell { touch-action: pan-y pinch-zoom; }
.stage-explorer-shell img { -webkit-user-drag: none; user-select: none; }

.stage-selector {
  position: sticky;
  z-index: 12;
  top: calc(var(--header-height) + 8px);
  display: grid;
  overflow: auto hidden;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
  padding: 6px;
  border: 1px solid rgb(255 255 255 / 12%);
  border-radius: 22px;
  background: rgb(16 22 31 / 94%);
  box-shadow: 0 12px 35px rgb(0 0 0 / 16%);
  backdrop-filter: blur(16px);
  scrollbar-width: none;
}

.stage-selector::-webkit-scrollbar { display: none; }

.stage-selector button {
  display: grid;
  min-height: 78px;
  align-content: center;
  gap: 1px;
  padding: 10px 14px;
  border: 0;
  border-radius: 17px;
  color: rgb(255 255 255 / 68%);
  background: transparent;
  text-align: left;
  cursor: pointer;
  transition: color 180ms ease, background 180ms ease, transform 180ms ease;
}

.stage-selector button:hover { color: #fff; background: rgb(255 255 255 / 8%); }
.stage-selector button:focus-visible { outline: 3px solid #fff; outline-offset: -4px; }
.stage-selector button[aria-selected="true"] { color: var(--ink); background: var(--cyan); }
.stage-selector button:nth-child(n + 3)[aria-selected="true"] { background: var(--mz-gold); }
.stage-selector button span { font-size: var(--texto--2); font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; }
.stage-selector button strong { font-size: var(--texto-0); }
.stage-selector button small { font-size: var(--texto--2); font-weight: 700; opacity: 0.75; }

.stage-progress {
  height: 3px;
  margin: 10px 8px 13px;
  overflow: hidden;
  border-radius: 99px;
  background: rgb(255 255 255 / 12%);
}

.stage-progress span {
  display: block;
  width: var(--stage-progress, 25%);
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--cyan), var(--yellow));
  transition: width 260ms ease;
}

.stage-panel {
  display: grid;
  min-height: 0;
  overflow: clip;
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  border-radius: 24px;
  background: #fff;
  animation: stage-panel-in 360ms ease both;
}

.stage-panel[hidden] { display: none; }
html:not(.js) .stage-selector,
html:not(.js) .stage-progress,
html:not(.js) [data-stage-index] { display: none; }
html:not(.js) .stage-panel[hidden] { display: grid; margin-top: 14px; }

@keyframes stage-panel-in {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: translateY(0); }
}

.stage-panel-media {
  position: relative;
  display: grid;
  min-width: 0;
  width: 100%;
  min-height: 0;
  margin: 0;
  overflow: hidden;
  grid-template-rows: minmax(0, 1fr) auto;
  background: var(--mist);
}

.stage-panel-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 700ms cubic-bezier(.2, .8, .2, 1);
}

.stage-panel:hover .stage-panel-media img { transform: scale(1.025); }
.stage-panel-media figcaption {
  position: relative;
  z-index: 2;
  max-width: none;
  color: #fff;
  font-size: var(--texto-0);
  font-weight: 700;
  line-height: 1.45;
}

.stage-panel-media figcaption span {
  display: block;
  margin-bottom: 0.45rem;
  color: var(--yellow);
  font-size: var(--texto--2);
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.stage-explorer .stage-panel-media figcaption {
  padding: 16px 20px;
  border: 0;
  border-radius: 0;
  background: rgb(10 22 32 / 92%);
  background-image: none;
  box-shadow: none;
  font-size: clamp(16px, 1.2vw, 18px);
  line-height: 1.42;
}
.stage-explorer .stage-panel-media figcaption span { font-size: 13px; }

@media (max-width: 420px) {
  .stage-explorer .stage-panel-media figcaption { padding: 13px 15px; }
}

.stage-panel-mizzou .stage-panel-media figcaption span { color: var(--mz-gold); }

.stage-panel-copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
  justify-content: center;
  padding: clamp(1.4rem, 2.5vw, 2.6rem);
}

.stage-panel-age {
  margin: 0 0 0.75rem;
  color: var(--er-blue-dark);
  font-size: var(--texto--2);
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.stage-panel-mizzou .stage-panel-age { color: var(--mz-gold-deep); }

.stage-explorer-shell:has([data-stage-target="middle"][aria-selected="true"]) .stage-progress span,
.stage-explorer-shell:has([data-stage-target="high"][aria-selected="true"]) .stage-progress span {
  background: var(--mz-gold);
}

.stage-mizzou-brand {
  display: flex;
  width: min(250px, 68%);
  min-height: 54px;
  align-items: center;
  margin-bottom: 1.1rem;
  padding: 8px 12px;
  border-radius: 12px;
  border: 2px solid var(--mz-black);
  background: var(--mz-gold);
}

.stage-mizzou-brand img {
  width: 100%;
  height: auto;
  max-height: 46px;
  object-fit: contain;
}
.stage-panel-copy h3 {
  max-width: 24ch;
  margin: 0;
  color: var(--ink);
  font-size: clamp(1.35rem, 1.9vw, 1.8rem);
  line-height: 1.15;
  letter-spacing: -0.035em;
}

.stage-panel-lead {
  max-width: 44rem;
  margin: 0.75rem 0 0;
  color: var(--muted);
  font-size: var(--texto--1);
  line-height: 1.55;
}

.stage-compare {
  display: grid;
  margin-top: clamp(1.1rem, 2vw, 1.6rem);
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.stage-route {
  padding: 1.1rem;
  border: 1px solid var(--line);
  border-top: 4px solid var(--cyan);
  border-radius: 16px;
  background: var(--mist);
}

.stage-route-program { border-top-color: var(--yellow); background: #fff9d7; }
.stage-panel-mizzou .stage-route-regular {
  border-color: rgb(20 24 29 / 24%);
  border-top-color: var(--mz-black);
  background: #fff;
}
.stage-panel-mizzou .stage-route-program { border-color: rgb(241 184 48 / 62%); border-top-color: var(--mz-gold); color: #fff; background: var(--mz-black); }
.stage-route span { display: block; margin-bottom: 0.38rem; color: var(--muted); font-size: var(--texto--2); font-weight: 700; letter-spacing: 0.11em; text-transform: uppercase; }
.stage-panel-mizzou .stage-route-program span { color: var(--mz-gold); }
.stage-route strong { display: block; color: inherit; font-size: var(--texto--1); line-height: 1.35; }
.stage-route p { margin: 0.55rem 0 0; color: inherit; font-size: var(--texto--2); line-height: 1.55; opacity: 0.78; }

.stage-proof-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  margin: 1.25rem 0 0;
  padding: 0;
  list-style: none;
}

.stage-proof-list li {
  padding: 6px 10px;
  border: 1px solid rgb(16 22 31 / 14%);
  border-radius: 999px;
  color: var(--ink);
  background: #fff;
  font-size: var(--texto--2);
  font-weight: 700;
  text-align: center;
}

.stage-proof-list:not(.stage-proof-list-rich):has(> li:nth-child(3):last-child) {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (min-width: 900px) {
  .stage-proof-list:not(.stage-proof-list-rich):has(> li:nth-child(4):last-child) {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

.stage-proof-list-rich {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin: 1.35rem 0 0;
  padding: 0;
  list-style: none;
}

.stage-proof-list-rich li {
  display: flex;
  flex-direction: column;
  padding: 10px 14px;
  border: 1px solid rgb(16 22 31 / 12%);
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 2px 8px rgb(16 22 31 / 4%);
  text-align: left;
  transition: transform 0.25s ease, border-color 0.25s ease;
}

.stage-proof-list-rich li:hover {
  transform: translateY(-2px);
  border-color: var(--cyan, #00aeed);
}

.stage-proof-list-rich li strong {
  display: block;
  color: var(--ink, #10161f);
  font-size: var(--texto--1);
  font-weight: 700;
  line-height: 1.3;
}

.stage-proof-list-rich li span {
  display: block;
  margin-top: 3px;
  color: var(--muted, #526170);
  font-size: var(--texto--2);
  line-height: 1.4;
}

@media (max-width: 640px) {
  .stage-proof-list-rich {
    grid-template-columns: 1fr;
    gap: 8px;
  }
}

.stage-panel-actions {
  display: flex;
  align-items: center;
  gap: 1.1rem;
  margin-top: clamp(1.5rem, 3vw, 2.2rem);
}

.stage-panel-actions .button { min-height: 50px; padding: 12px 20px; font-size: var(--texto--2); }
.stage-panel-mizzou .stage-panel-actions .button { color: var(--mz-black); background: var(--mz-gold); box-shadow: none; }
.stage-panel-actions > a:not(.button) { color: var(--link-on-light); font-size: var(--texto--2); font-weight: 700; text-decoration: underline; text-underline-offset: 4px; }

@media (max-width: 960px) {
  .stage-explorer-heading { grid-template-columns: 1fr; gap: 1.2rem; }
  .stage-explorer-heading h2 { max-width: 12ch; }
  .stage-panel { grid-template-columns: 1fr; }
  .stage-panel-media { min-height: 0; aspect-ratio: auto; }
  .stage-panel-media img { height: clamp(280px, 50vw, 380px); }
  .stage-panel-copy h3 { max-width: 18ch; }
}

@media (max-width: 720px) {
  .stage-explorer { padding-block: 72px; }
  .stage-explorer::before { display: none; }
  .stage-explorer-heading h2 { font-size: var(--texto-5); }
  .stage-explorer-shell { margin-inline: 0;  /* era -4px: vazava 8px além do container no mobile */ padding: 9px; border-radius: 25px; }
  .stage-selector { top: 76px; display: flex; border-radius: 18px; }
  .stage-selector button { min-width: 148px; min-height: 72px; flex: 0 0 auto; border-radius: 14px; }
  .stage-progress { margin-bottom: 9px; }
  .stage-panel { min-height: 0; border-radius: 18px; }
  .stage-panel-media { width: 100%; height: auto; min-height: 0; aspect-ratio: auto; }
  .stage-panel-media img { height: clamp(230px, 55vw, 300px); }
  .stage-panel-copy { padding: 1.8rem 1.15rem 2rem; }
  .stage-panel-copy h3 { font-size: var(--texto-4); }
  .stage-compare { grid-template-columns: 1fr; }
  .stage-panel-actions { align-items: stretch; flex-direction: column; }
  .stage-panel-actions .button { width: 100%; }
  .stage-panel-actions > a:not(.button) { align-self: center; }
}

@media (max-width: 420px) {
  .stage-panel-media figcaption { font-size: 16px; }
}

@media (max-width: 480px) {
  .mobile-contact.whatsapp-float {
    width: 54px;
    min-height: 52px;
    max-width: 54px;
    padding: 8px;
    justify-content: center;
  }

  .mobile-contact.whatsapp-float > span:last-child { display: none; }

  .mobile-contact.whatsapp-float.is-stage-context {
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transform: translateY(12px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .stage-selector button,
  .stage-progress span,
  .stage-panel,
  .stage-panel-media img { animation: none; transition: none; }
  .stage-panel:hover .stage-panel-media img { transform: none; }
}

/* Provas rastreadas no acervo: palco real e conclusão Mizzou em escala editorial. */
.tiger-showcase {
  display: grid;
  align-items: stretch;
  gap: clamp(14px, 2vw, 22px);
  margin-top: 28px;
  grid-template-columns: minmax(0, 1.45fr) minmax(280px, 0.55fr);
}

.tiger-showcase .tiger-feature { margin-top: 0; padding: 0; }
.tiger-showcase .tiger-card:not([hidden]) {
  width: 100%;
  height: 100%;
  margin: 0;
  grid-template-columns: 1fr;
}
.tiger-showcase .tiger-card .video-thumb { min-height: 360px; }

.tiger-showcase .tiger-card:not([hidden]) {
  min-height: 430px;
  border: 2px solid var(--mz-gold);
}

.gallery-graduation {
  object-fit: cover;
  object-position: 50% 36%;
}

@media (min-width: 721px) {
  .highschool-gallery {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: minmax(300px, 1.18fr) minmax(180px, .82fr);
  }

  .gallery-graduation { grid-row: 1; grid-column: 1 / -1; }
  .gallery-diploma { grid-row: 2; grid-column: 1; }
  .gallery-class { grid-row: 2; grid-column: 2; }
}

@media (max-width: 820px) {
  .tiger-showcase { grid-template-columns: 1fr; }
  .tiger-showcase .tiger-card .video-thumb { min-height: 220px; }
}

/* Colisão de modificadores na trilha.
   `--atual` pinta fundo ciano e texto escuro; `--internacional` vem depois e
   troca o fundo por ciano a 12% sobre a faixa escura, mas o texto escuro
   permanecia. Medido em 1,1:1, ou seja, ilegível. A cor passa a acompanhar o
   fundo que de fato venceu. */
.trilha-etapa--atual.trilha-etapa--internacional {
  color: #fff;
}

.trilha-etapa--atual.trilha-etapa--internacional .trilha-etapa-idade,
.trilha-etapa--atual.trilha-etapa--internacional .trilha-etapa-linha {
  color: rgb(255 255 255 / 82%);
}

/* Segunda revisão editorial: Mizzou sem tons intermediários, vídeo do Tiger
   Talks protagonista e três depoimentos com hierarquia real. */
.parceiros-lista li {
  min-height: 92px;
  align-content: center;
}

.parceiros-lista li > span { display: none; }
.partner-row { justify-content: flex-start; }

[data-carousel-track],
.activity-rail,
.families-rail,
.approval-track {
  scrollbar-width: none;
  -ms-overflow-style: none;
}

[data-carousel-track]::-webkit-scrollbar,
.activity-rail::-webkit-scrollbar,
.families-rail::-webkit-scrollbar,
.approval-track::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

@media (max-width: 640px) {
  .stage-selector {
    position: static;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    overflow: visible;
  }
  .stage-selector button {
    min-width: 0;
    min-height: 70px;
    padding-inline: .65rem;
    flex: none;
  }
  .stage-mizzou-brand { width: min(230px, 82%); }
  .tiger-showcase .tiger-card:not([hidden]),
  .tiger-context-shot { min-height: 320px; }
  .tiger-showcase .tiger-card .video-thumb { min-height: 250px; }
}

/* A foto contextual prova o Tiger Talks sem competir com o vídeo, que é o
   protagonista do bloco. A proporção acompanha a foto original e evita o
   recorte vertical excessivo que aparecia nas larguras intermediárias. */
.tiger-showcase { align-items: start; }
/* Tiger Talks reconstruido: foto do palco de 2025, os dois videos em arquivo
   local e a plateia fechando. Sai o carrossel de miniaturas do YouTube. */
.tiger-talks {
  padding: clamp(22px, 3.4vw, 40px);
  border-radius: 32px;
  color: #fff;
  background: linear-gradient(160deg, #14161a 0%, #0b0c0f 100%);
}

.tiger-talks-heading { max-width: 62ch; margin-bottom: clamp(20px, 3vw, 32px); }
.tiger-talks-heading h3 {
  margin: 6px 0 12px;
  color: #fff;
  font-size: var(--texto-4);
  letter-spacing: -.03em;
  line-height: 1.06;
}
.tiger-talks-heading > p:last-child { margin: 0; color: #b6bcc6; font-size: var(--texto-0); }

.tiger-showcase {
  display: grid;
  gap: clamp(14px, 2vw, 22px);
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
  align-items: start;
}

.tiger-palco,
.tiger-plateia,
.tiger-video { margin: 0; min-width: 0; }

.tiger-palco img,
.tiger-plateia img {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  border-radius: 22px;
}

.tiger-palco figcaption,
.tiger-plateia figcaption {
  margin-top: 12px;
  color: #c3c9d2;
  font-size: var(--texto--1);
  line-height: 1.5;
}
.tiger-palco figcaption span {
  display: block;
  color: var(--mz-gold, #f1b830);
  font-size: var(--texto--2);
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.tiger-videos { display: grid; gap: clamp(14px, 2vw, 20px); }

.tiger-video video {
  /* O atributo height="720" vira dica de apresentação e vence o aspect-ratio:
     sem height auto o vídeo fica 430x720 dentro da coluna. */
  height: auto;
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: 18px;
  background: #000;
}
.tiger-video figcaption {
  margin-top: 10px;
  color: #c3c9d2;
  font-size: var(--texto--1);
}
.tiger-video figcaption strong { display: block; color: #fff; }

.tiger-plateia { margin-top: clamp(14px, 2vw, 22px); }
.tiger-plateia img { aspect-ratio: 21 / 9; }

@media (max-width: 820px) {
  .tiger-showcase { grid-template-columns: minmax(0, 1fr); }
  .tiger-videos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
  .tiger-videos { grid-template-columns: minmax(0, 1fr); }
}

/* Depoimentos: dois vídeos em arquivo local e uma lista de títulos. Sai a
   galeria de cabecinhas com gradiente preto e branco. */
.vozes { margin-top: clamp(28px, 4vw, 48px); }
.vozes-cabeca { max-width: 60ch; margin-bottom: clamp(18px, 3vw, 28px); }
.vozes-cabeca h3 {
  margin: 6px 0 0;
  font-size: var(--texto-3);
  letter-spacing: -.03em;
  line-height: 1.1;
}

.vozes-grade {
  display: grid;
  gap: clamp(16px, 2.4vw, 26px);
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.05fr);
  align-items: start;
}

.voz { margin: 0; min-width: 0; }
.voz video {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 9 / 16;
  object-fit: cover;
  border-radius: 22px;
  background: #000;
}
.voz figcaption { margin-top: 14px; }
.voz figcaption strong {
  display: block;
  font-size: var(--texto-1);
  letter-spacing: -.02em;
}
.voz-papel {
  display: block;
  margin-top: 2px;
  color: var(--mz-gold, #b07d05);
  font-size: var(--texto--2);
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.voz figcaption p {
  margin: 8px 0 0;
  color: var(--muted, #5a6a75);
  font-size: var(--texto--1);
  line-height: 1.55;
}

.vozes-lista {
  padding: clamp(16px, 2.4vw, 24px);
  border: 1px solid var(--line, #dbe4e9);
  border-radius: 22px;
  background: #fff;
}
.vozes-lista-titulo {
  margin: 0 0 10px;
  font-size: var(--texto--2);
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.vozes-lista ul { margin: 0; padding: 0; list-style: none; }
.vozes-lista li + li { border-top: 1px solid var(--line, #dbe4e9); }
.vozes-lista button {
  display: grid;
  width: 100%;
  min-height: 56px;
  align-content: center;
  gap: 2px;
  padding: 12px 34px 12px 0;
  border: 0;
  background: none;
  text-align: left;
  cursor: pointer;
  position: relative;
}
.vozes-lista button::after {
  position: absolute;
  top: 50%;
  right: 6px;
  width: 22px;
  height: 22px;
  margin-top: -11px;
  border-radius: 50%;
  background: var(--ink, #10161f);
  color: #fff;
  content: "▶";
  font-size: 9px;
  line-height: 22px;
  text-align: center;
}
.vozes-lista button:hover strong,
.vozes-lista button:focus-visible strong { text-decoration: underline; }
.vozes-lista strong { font-size: var(--texto-0); }
.vozes-lista span { color: var(--muted, #5a6a75); font-size: var(--texto--2); }

@media (max-width: 900px) {
  .vozes-grade { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .vozes-lista { grid-column: 1 / -1; }
}

@media (max-width: 560px) {
  .vozes-grade { grid-template-columns: minmax(0, 1fr); }
}

/* Disciplinas do High School: estavam dentro de um <details> fechado, então as
   cinco fotos nunca carregavam e o portão as contava como quebradas. */
.hs-disciplinas { margin-top: clamp(28px, 4vw, 44px); }
.hs-disciplinas h3 {
  margin: 6px 0 clamp(16px, 2.4vw, 24px);
  font-size: var(--texto-2);
  letter-spacing: -.02em;
}
.hs-grade {
  display: grid;
  gap: clamp(12px, 1.8vw, 18px);
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin: 0;
  padding: 0;
  list-style: none;
}
.hs-item figure { margin: 0; }
.hs-item img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 16px;
}
.hs-item figcaption { margin-top: 10px; }
.hs-item strong {
  display: block;
  font-size: var(--texto--1);
  letter-spacing: -.01em;
}
.hs-item span {
  display: block;
  margin-top: 3px;
  color: var(--muted, #5a6a75);
  font-size: var(--texto--2);
  line-height: 1.45;
}

@media (max-width: 900px) { .hs-grade { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 560px) { .hs-grade { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* O conteúdo define a altura de cada etapa, sem piso que anule o layout móvel. */
.stage-panel-copy h3 {
  max-width: 24ch;
  font-size: var(--texto-3);
  line-height: 1.06;
  letter-spacing: -0.035em;
}
.stage-panel-media { align-self: stretch; }
.stage-panel-media img { display: block; }

/* Cada vivência tem uma etapa; os atalhos navegam sem esconder cartões. */
.activity-jumps { display: flex; flex-wrap: wrap; gap: 10px; margin: 20px 0 0; }
.activity-jumps a { display: inline-flex; align-items: center; min-height: 46px; padding: 10px 18px; border: 1px solid #bdcbd2; border-radius: 999px; background: #fff; color: #164b62; font-weight: 700; text-decoration: none; }
.activity-jumps a:hover { background: #d9f3fb; border-color: #126d89; }
.activity-card:focus-visible { outline: 3px solid #126d89; outline-offset: -4px; }
.middle-project { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); align-items: center; gap: clamp(24px, 4vw, 56px); margin-top: clamp(48px, 7vw, 90px); padding: clamp(24px, 4vw, 48px); background: #f5f0e4; border-radius: 28px; }
.middle-project h3 { margin: 12px 0 24px; font-size: var(--texto-3); line-height: 1.12; letter-spacing: -.025em; }
.middle-project-copy > p:not(.carousel-kicker) { color: #4c5b66; line-height: 1.65; max-width: 64ch; }
.middle-project figure { margin: 0; min-width: 0; }
.middle-project img { display: block; width: 100%; height: auto; aspect-ratio: auto 16 / 9; border-radius: 18px; }
.middle-project figcaption { margin-top: 12px; color: #4c5b66; font-size: var(--texto--1); line-height: 1.5; }
.tiger-curriculo, .hs-apresentacao-link { display: inline-flex; align-items: center; gap: 12px; min-height: 48px; padding-block: 10px; margin-bottom: 24px; font-weight: 700; text-underline-offset: 5px; }
.tiger-curriculo { color: #f1b830; }
.hs-apresentacao-link { color: #175c77; }
.tiger-talks-heading { max-width: none; }
.tiger-showcase { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); grid-template-areas: 'palco vitoria' 'plateia estela'; gap: 28px; }
.tiger-palco { grid-area: palco; }
.tiger-plateia { grid-area: plateia; margin-top: 0; }
.tiger-plateia img { aspect-ratio: auto 3 / 2; height: auto; }
.tiger-videos { display: contents; }
.tiger-video:first-child { grid-area: vitoria; }
.tiger-video:last-child { grid-area: estela; }
.stage-panel:focus-visible { outline: 3px solid #126d89; outline-offset: 5px; }
@media (min-width: 1001px) {
  .tiger-talks-heading { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 12px 48px; align-items: center; }
  .tiger-talks-heading .carousel-kicker { grid-column: 1 / -1; }
  .tiger-talks-heading h3 { margin: 0; }
  .tiger-talks-heading > p:last-child { max-width: 52ch; }
}
@media (max-width: 1000px) { .middle-project { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 820px) {
  .tiger-showcase { grid-template-columns: minmax(0, 1fr); grid-template-areas: 'palco' 'vitoria' 'estela' 'plateia'; }
}
.activity-jumps { scroll-margin-top: 110px; }
.foto-ampliavel { display: block; min-width: 0; cursor: zoom-in; }
.stage-panel-media .foto-ampliavel { height: 100%; }
.foto-ampliavel:focus-visible { outline: 3px solid #147b9b; outline-offset: 4px; }
a.foto-ampliavel.media-lightbox-trigger:focus-visible {
  outline: 3px solid #147b9b;
  outline-offset: 4px;
}
/* Hero: the link wraps the absolutely positioned <picture>. */
.hero-visual > a.foto-ampliavel {
  position: absolute;
  z-index: 2;
  inset: 0;
}
@media (max-width: 1100px) {
  .hero-visual > a.foto-ampliavel {
    position: relative;
    inset: auto;
  }
}
.foto-dialog { position: fixed; inset: 0; width: min(96vw, 1320px); max-width: 96vw; max-height: 96dvh; padding: 0; border: 1px solid #4b5159; border-radius: 20px; background: #10161f; color: #fff; }
.foto-dialog::backdrop { background: rgb(3 8 14 / 92%); }
.foto-dialog-conteudo { display: flex; flex-direction: column; align-items: center; padding: 64px 20px 16px; }
.foto-inteira { display: block; width: auto; height: auto; max-width: 100%; max-height: 68dvh; object-fit: contain; }
.foto-inteira[hidden] { display: none; }
.foto-dialog button { min-width: 48px; min-height: 48px; border: 1px solid #606a77; border-radius: 50%; background: #172230; color: #fff; font-size: 24px; cursor: pointer; }
.foto-dialog button:focus-visible { outline: 3px solid #f1b830; outline-offset: 3px; }
.foto-dialog button:disabled { opacity: .35; cursor: default; }
.foto-fechar { position: absolute; right: 12px; top: 10px; }
.foto-legenda { margin: 14px 0 0; max-width: 72ch; text-align: center; font-size: var(--texto--1); line-height: 1.5; color: #e2e6ec; }
.foto-status { margin: 8px 0; max-width: 64ch; color: #e2e6ec; }
.foto-navegacao { display: flex; align-items: center; gap: 24px; }

/* Keep the yellow underline attached to each wrapped line of the hero title. */
.hero h1 span {
  display: inline;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}

/* Prompt 3: o .header-inner desta página é grade de três colunas, e as regras
   do sistema.css pressupõem flex. A 1440 o menu caía na terceira coluna, o
   agendamento ficava com 85 px e o cabeçalho media 164 px
   (qa2/report/design/bilingue-header.json). Aqui a grade segue a régua:
   logo e agendamento na primeira linha, menu inteiro na segunda. */
@media (min-width: 1101px) {
  .site-header .header-inner {
    grid-template-columns: auto 1fr;
    grid-template-areas: "brand cta" "nav nav";
  }
  .site-header .brand { grid-area: brand; }
  .site-header .contact-action { grid-area: cta; justify-self: end; }
  .site-header .site-nav { grid-area: nav; }
}

@media (min-width: 721px) and (max-width: 1100px) {
  .site-header .header-inner { grid-template-columns: minmax(0,1fr) auto; }
  .site-header .menu-toggle { display: grid; }
  .site-header .site-nav {
    position: absolute;
    z-index: 5;
    top: 100%;
    right: 0;
    left: 0;
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    max-height: calc(100dvh - var(--header-clearance));
    padding: 14px max(24px,5vw);
    overflow-y: auto;
    border-bottom: 1px solid var(--line);
    background: var(--white);
    box-shadow: 0 18px 30px rgb(8 30 46 / 12%);
  }
  .site-header .site-nav a {
    display: flex;
    min-height: 44px;
    padding: 8px 12px;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: var(--mist);
    text-align: center;
    font-size: 14px;
  }
  .js .site-header .site-nav {
    visibility: hidden;
    opacity: 0;
    transform: translateY(-10px);
    transition: opacity .18s ease, transform .18s ease, visibility 0s linear .18s;
  }
  .js .site-header .site-nav.is-open {
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
    transition: opacity .18s ease, transform .18s ease, visibility 0s linear;
  }
}

/* O seletor acompanha o painel sem cobrir a foto durante a rolagem. A coluna
   de texto recebe espaço suficiente para evitar um painel alto demais. */
.stage-selector { position: relative; top: auto; }
.stage-panel { grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr); }
.stage-panel-copy { justify-content: flex-start; padding: 26px; }
.stage-compare { margin-top: 18px; gap: 8px; }
.stage-route { padding: 14px; }
.stage-proof-list-rich { gap: 8px; margin-top: 16px; }
.stage-proof-list-rich li { padding: 9px 11px; }
.stage-panel-actions { margin-top: 18px; }
.stage-panel:hover .stage-panel-media img { transform: none; }

@media (min-width: 1200px) {
  .stage-proof-list-rich { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 960px) {
  .stage-panel { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
  .stage-panel-copy { padding: 23px 17px 26px; }
  .stage-proof-list-rich {
    display: flex;
    gap: 10px;
    margin-inline: -2px;
    padding: 2px 2px 12px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    overscroll-behavior-inline: contain;
  }
  .stage-proof-list-rich li { flex: 0 0 min(72vw, 260px); scroll-snap-align: start; }
  .stage-panel-actions { margin-top: 17px; }
}

/* Revisão editorial: enquadramentos preservam os arquivos originais. */
.middle-project img[data-photo-crop="right-portrait"] {
  aspect-ratio: 4 / 5;
  object-fit: cover;
  object-position: right center;
}
.activity-media img[data-photo-crop="right-square"] {
  aspect-ratio: 1;
  object-fit: cover;
  object-position: right center;
}
.foto-dialog[data-photo-crop="right-portrait"] .foto-inteira,
.foto-dialog[data-photo-crop="right-square"] .foto-inteira {
  object-fit: cover;
  object-position: right center;
  width: min(70vw, 56vh);
  height: min(87.5vw, 70vh);
}
.foto-dialog[data-photo-crop="right-square"] .foto-inteira {
  width: min(75vw, 70vh);
  height: min(75vw, 70vh);
}

/* Os nomes das experiências mantêm uma leitura natural em telas estreitas. */
#stage-panel-middle .stage-proof-list {
  display: flex;
  flex-wrap: wrap;
}
#stage-panel-middle .stage-proof-list li {
  flex: 1 0 auto;
}

.stage-proof-list-rich:focus-visible { outline: 3px solid #126d89; outline-offset: 4px; }