/* 260829 — HERO: o vídeo toca uma vez, congela, e o título entra por cima.
   Tipografia medida no Figma (node 697:94, frame "Desktop 1920 — MODO CLARO"):
     ANTI PIRACY      Playfair Display Regular · 120,403px · tracking −3,6121px
     CLIENT TV GLOBO  Inter Light + Inter Medium · 28px · tracking −0,84px · caixa alta
   Alinhamento à direita, branco, coluna com items-end — como no Figma.

   POR QUE UMA IMAGEM DE CONGELAMENTO, e não só tirar o `loop`:
   sem `loop` o <video> para no último quadro, mas alguns navegadores repintam
   o pôster ou um quadro preto no `ended`. Sobrepor o quadro exato (extraído do
   próprio arquivo com ffmpeg, `hero-freeze.webp`, 14 KB) garante o congelamento
   em qualquer navegador — e o vídeo pode até ser descarregado depois. */

/* ── camada do quadro congelado ─────────────────────────────────── */
body.hs-front .hs-hero-blk .hs-hero-freeze{
  position:absolute; inset:0; z-index:2;
  background-image:var(--hero-freeze);
  background-size:cover; background-position:center;
  opacity:0; transition:opacity .28s ease;
  pointer-events:none;
}
body.hs-front .hs-hero-blk.congelado .hs-hero-freeze{ opacity:1; }

/* ── o título ───────────────────────────────────────────────────── */
body.hs-front .hs-hero-blk .hs-hero-titulo{
  position:absolute; z-index:3;
  /* Figma node 697:94 no hero de 1904x929: x=971 y=216 w=686.
     left  = 971/1904        = 51,00%
     right = (1904-1657)/1904 = 12,97%   (1657 = 971+686, a borda direita do bloco)
     top   = 216/929          = 23,25%
     Medido, nao estimado — o titulo pousa exatamente onde ele desenhou. */
  left:51.0%; right:12.97%; top:23.25%;
  display:flex; flex-direction:column; align-items:flex-end; gap:0;
  text-align:right; color:#fff; white-space:nowrap;
  opacity:0; transform:translateY(14px);
  transition:opacity .7s cubic-bezier(.22,.61,.36,1), transform .7s cubic-bezier(.22,.61,.36,1);
  pointer-events:none;
}
body.hs-front .hs-hero-blk.congelado .hs-hero-titulo{
  opacity:1; transform:translateY(0);
  transition-delay:.18s;      /* deixa o congelamento assentar antes do texto entrar */
}

body.hs-front .hs-hero-blk .hs-hero-titulo-b{
  display:block; margin:0; opacity:1;
  font-family:"Playfair Display", Georgia, "Times New Roman", serif;
  font-weight:400;
  /* 120,403px em 1904 = 6,324vw — escala com a tela sem quebrar o desenho */
  font-size:clamp(38px, 6.324vw, 132px);
  letter-spacing:-.03em;      /* −3,6121px sobre 120,4px */
  line-height:1;
  text-shadow:0 4px 30px rgba(0,0,0,.45);
}
body.hs-front .hs-hero-blk .hs-hero-titulo-c{
  display:block; margin-top:.35em; opacity:1;
  font-family:Inter, system-ui, sans-serif;
  font-size:clamp(13px, 1.47vw, 30px);
  letter-spacing:-.03em; text-transform:uppercase;
  font-weight:300;            /* "Client" = Inter Light */
  text-shadow:0 2px 14px rgba(0,0,0,.5);
}
body.hs-front .hs-hero-blk .hs-hero-titulo-c strong{
  font-style:normal; font-weight:500;   /* "TV Globo" = Inter Medium */
}

/* ── acessibilidade e telas pequenas ────────────────────────────── */
@media (max-width:760px){
  body.hs-front .hs-hero-blk .hs-hero-titulo{
    left:6%; right:6%; top:auto; bottom:16%; align-items:flex-start; text-align:left;
  }
}
@media (prefers-reduced-motion:reduce){
  body.hs-front .hs-hero-blk .hs-hero-freeze,
  body.hs-front .hs-hero-blk .hs-hero-titulo{ transition:none; }
}

/* 260912 — 1003:1900/1901: título e nome na coluna esquerda indicada. */
body.hs-front .hs-hero-blk .hs-hero-titulo{left:15.625%;right:auto;top:23.25%;align-items:flex-start;text-align:left;max-width:68.75%;white-space:normal}
body.hs-front .hs-hero-blk .hs-hero-titulo-b{font-size:clamp(38px,6.324vw,132px)}
body.hs-front .hs-hero-blk .hs-hero-titulo-c{margin-top:.8em}
@media(max-width:760px){body.hs-front .hs-hero-blk .hs-hero-titulo{left:6%;right:6%;top:auto;bottom:16%;max-width:none}}