/* BANDA NOVA YORK · página de links (celular primeiro). Sistema: DESIGN.md (Brand Book V2).
   Vocabulário de movimento: CORTE 56° (revelações), FEIXE (faixa vermelha a 56°), LARGURA (Archivo 62 → 125), ACENDER (barras). */
@font-face {
  font-family: "Archivo";
  src: url("/assets/fonts/archivo-latin-wdth-normal.woff2") format("woff2");
  font-weight: 100 900;
  font-stretch: 62% 125%;
  font-style: normal;
  font-display: swap;
}
:root {
  --preto: #0A0A0A;
  --grafite: #1A1A1A;
  --grafite-2: #141414;
  --cinza: #8A8A8A;
  --cinza-txt: #A6A6A6;
  --branco: #FFFFFF;
  --vermelho: #E1141E;
  --linha: rgba(255, 255, 255, .12);
  --borda: rgba(255, 255, 255, .28);
  --e-out: cubic-bezier(.16, 1, .3, 1);
  --e-cut: cubic-bezier(.77, 0, .18, 1);
  --pad: 20px;
  --w: min(100vw, 460px);
  color-scheme: dark;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; background: var(--preto); scroll-behavior: smooth; scroll-padding-top: 12px; }
body {
  margin: 0; min-height: 100svh; background: var(--preto); color: var(--branco);
  font-family: "Archivo", system-ui, -apple-system, "Segoe UI", sans-serif; font-size: 16px; line-height: 1.45; font-stretch: 100%;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility;
  overflow-x: hidden; -webkit-tap-highlight-color: transparent; touch-action: manipulation;
}
img, svg { display: block; max-width: 100%; }
a { color: inherit; }
button, input, select { font: inherit; color: inherit; }
button { background: none; border: 0; padding: 0; cursor: pointer; }
ul, ol { list-style: none; margin: 0; padding: 0; }
h1, h2, h3, p, figure { margin: 0; }
:focus-visible { outline: 2px solid var(--branco); outline-offset: 3px; }
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }
.pular { position: absolute; left: 12px; top: 12px; z-index: 50; padding: 10px 16px; background: var(--branco); color: var(--preto); font-weight: 700; text-decoration: none; transform: translateY(-160%); }
.pular:focus-visible { transform: none; }
.ico { width: 16px; height: 16px; flex: none; }

/* coluna única; no desktop fica no centro, sobre a foto desfocada */
.app { position: relative; width: 100%; max-width: 460px; margin: 0 auto; min-height: 100svh; background: var(--preto); overflow: hidden; }
@media (min-width: 600px) {
  body { background: var(--preto) url("/links/hero-fundo.webp") center / cover fixed no-repeat; }
  .app { box-shadow: 0 0 0 1px rgba(255, 255, 255, .08); }
}

/* ============================== HERO ============================== */
.hero { --hf: clamp(360px, 58svh, 560px); --sl: calc(var(--hf) * .6745); position: relative; }
.hero__foto { position: relative; height: var(--hf); overflow: hidden; background: #2a0a06; }
.hero__foto img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 42%; }
.hero__foto::before, .hero__foto::after { content: ""; position: absolute; left: 0; right: 0; pointer-events: none; }
.hero__foto::before { top: 0; height: 26%; z-index: 1; background: linear-gradient(rgba(10, 10, 10, .72), rgba(10, 10, 10, 0)); }
.hero__foto::after { bottom: 0; height: 62%; background: linear-gradient(rgba(10, 10, 10, 0) 0%, rgba(10, 10, 10, .78) 58%, var(--preto) 100%); }
.hero__feixe {
  position: absolute; top: 0; left: 0; height: var(--hf); width: calc(var(--w) * .3); background: var(--vermelho);
  transform-origin: 0 100%; transform: translateX(calc(var(--w) + var(--sl))) skewX(-34deg); pointer-events: none;
}
.hero__selo {
  position: absolute; z-index: 3; top: calc(16px + env(safe-area-inset-top)); left: var(--pad); display: inline-flex; align-items: center; gap: 8px;
  min-height: 32px; padding-left: 14px; text-decoration: none; font-size: 12px; font-weight: 600; text-shadow: 0 1px 14px rgba(10, 10, 10, .9);
}
.hero__selo::before { content: ""; position: absolute; left: 0; top: 50%; width: 4px; height: 15px; margin-top: -7.5px; background: var(--vermelho); transform: skewX(-34deg); }
.hero__selo-k { font-size: 10.5px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; font-variation-settings: "wdth" 125; }
@media (hover: hover) and (pointer: fine) { .hero__selo:hover span:last-child { text-decoration: underline; text-underline-offset: 3px; } }
.hero__in { position: relative; z-index: 2; margin-top: calc(var(--hf) * -.3); padding: 0 var(--pad); text-align: center; }
.hero__logo { line-height: 0; }
.hero__lg { position: relative; display: block; width: min(88%, 380px); margin: 0 auto; aspect-ratio: 2121 / 478.5; }
.hero__lg .lg { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero__assin {
  margin-top: 16px; font-size: 11.5px; font-weight: 600; text-transform: uppercase; letter-spacing: .22em; padding-left: .22em;
  font-variation-settings: "wdth" 125; white-space: nowrap; color: rgba(255, 255, 255, .92);
}
@media (max-width: 374px) { .hero__assin { font-size: 10.5px; letter-spacing: .18em; padding-left: .18em; } }
.hero__prox {
  position: relative; display: inline-flex; align-items: center; gap: 8px; max-width: 100%; margin-top: 22px; padding: 10px 12px 10px 22px; white-space: nowrap;
  border: 1px solid rgba(255, 255, 255, .22); text-decoration: none; font-size: 14px; line-height: 1.2;
  transition: border-color .2s, background-color .2s;
}
.hero__prox::before { content: ""; position: absolute; left: 9px; top: 50%; width: 4px; height: 15px; margin-top: -7.5px; background: var(--vermelho); transform: skewX(-34deg); }
.hero__prox-k { flex: none; font-size: 10.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; font-variation-settings: "wdth" 100; color: rgba(255, 255, 255, .78); }
.hero__prox-v { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.hero__prox-v b { font-weight: 800; }
.hero__prox .ico { flex: none; }
.hero__prox .ico { width: 12px; height: 12px; opacity: .7; }
@media (hover: hover) and (pointer: fine) { .hero__prox:hover { border-color: var(--branco); } }
.hero__prox:active { background: rgba(255, 255, 255, .06); }

/* botão principal (o mesmo do site: vermelho, cantos retos, feixe atravessando) */
.cta {
  position: relative; display: flex; align-items: center; justify-content: center; gap: 12px; width: 100%; min-height: 58px; margin-top: 16px;
  padding: 14px 14px 13px; overflow: hidden; isolation: isolate; background: var(--vermelho); color: var(--branco); text-decoration: none;
  font-weight: 800; font-size: clamp(16px, 4.9vw, 19px); line-height: 1; text-transform: uppercase; letter-spacing: .03em; font-variation-settings: "wdth" 62;
  text-wrap: balance; transition: transform .15s var(--e-out), background-color .2s, color .2s, border-color .2s;
}
.cta::after { content: ""; position: absolute; inset: -2px auto -2px 0; width: 46%; z-index: -1; background: rgba(255, 255, 255, .24); transform: translateX(-130%) skewX(-34deg); }
.cta .ico { width: 20px; height: 12px; transition: transform .25s var(--e-out); }
.cta:active { transform: scale(.985); }
.cta:active::after, .cta.is-feixe::after { animation: feixe .8s var(--e-cut) 1; }
@media (hover: hover) and (pointer: fine) {
  .cta:hover::after { animation: feixe .8s var(--e-cut) 1; }
  .cta:hover .ico { transform: translateX(4px); }
}
@keyframes feixe { from { transform: translateX(-130%) skewX(-34deg); } to { transform: translateX(260%) skewX(-34deg); } }
.cta--linha { background: transparent; border: 1.5px solid rgba(255, 255, 255, .5); }
.cta--linha::after { background: var(--vermelho); width: 60%; }
@media (hover: hover) and (pointer: fine) { .cta--linha:hover { border-color: var(--vermelho); } }
.cta--sm { width: auto; min-height: 52px; margin: 0; padding: 0 20px; font-size: 18px; }

/* ============================== LINKS ============================== */
.links { margin-top: 30px; }
.links > ul { border-top: 1px solid var(--linha); }
.links > ul > li { border-bottom: 1px solid var(--linha); }
.ln {
  position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "t i" "d i"; align-items: center;
  width: 100%; min-height: 78px; padding: 16px var(--pad) 15px; isolation: isolate; overflow: hidden; text-align: left; text-decoration: none; color: var(--branco);
}
/* ACENDER: o feixe vermelho preenche a linha a 56° no toque, no foco e no hover */
.ln::before {
  content: ""; position: absolute; top: 0; bottom: 0; left: -60px; right: -60px; z-index: -1; background: var(--vermelho);
  transform: translateX(-102%) skewX(-34deg); transition: transform .42s var(--e-cut);
}
.ln:active::before, .ln:focus-visible::before, .ln[aria-expanded="true"]::before { transform: translateX(0) skewX(-34deg); }
@media (hover: hover) and (pointer: fine) { .ln:hover::before { transform: translateX(0) skewX(-34deg); } .ln:hover .ln__d { color: var(--branco); } }
.ln:active .ln__d, .ln:focus-visible .ln__d, .ln[aria-expanded="true"] .ln__d { color: var(--branco); }
.ln:focus-visible { outline-offset: -3px; }
.ln__t { grid-area: t; font-weight: 900; font-size: 28px; line-height: .95; letter-spacing: -.004em; text-transform: uppercase; font-variation-settings: "wdth" 62; }
.ln__d { grid-area: d; min-width: 0; margin-top: 6px; font-size: 14.5px; line-height: 1.3; color: var(--cinza-txt); transition: color .2s; overflow-wrap: anywhere; }
.ln .ico { grid-area: i; margin-left: 18px; transition: transform .25s var(--e-out); }
@media (hover: hover) and (pointer: fine) { a.ln:hover .ico { transform: translate(2px, -2px); } a.ln[href^="#"]:hover .ico { transform: translateY(3px); } }
.ico--mais path { stroke: currentColor; stroke-width: 2; fill: none; }
.ico--mais .v { transform-origin: 50% 50%; transform-box: fill-box; transition: transform .3s var(--e-out); }
.ln[aria-expanded="true"] .ico--mais .v { transform: scaleY(0); }

/* atendimento: contatos diretos da equipe */
.at__corpo { background: var(--grafite-2); }
.at__corpo.is-abrindo { animation: at-in .45s var(--e-out) both; }
@keyframes at-in { from { clip-path: inset(0 0 100% 0); } to { clip-path: inset(0); } }
.at__lista { padding: 6px var(--pad) 10px; }
.at__lista li + li { border-top: 1px solid var(--linha); }
.at__c { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "n i" "f i"; align-items: center; min-height: 64px; padding: 12px 0; text-decoration: none; }
.at__n { grid-area: n; font-weight: 700; font-size: 17px; }
.at__f { grid-area: f; margin-top: 2px; font-size: 14px; color: var(--cinza-txt); font-variant-numeric: tabular-nums; }
.at__c .ico { grid-area: i; margin-left: 14px; color: var(--vermelho); }
@media (hover: hover) and (pointer: fine) { .at__c:hover .at__n { text-decoration: underline; text-underline-offset: 3px; } }

/* ============================== TÍTULOS DE SEÇÃO ============================== */
.tit { font-weight: 900; font-size: 46px; line-height: .9; letter-spacing: -.004em; text-transform: uppercase; font-variation-settings: "wdth" 62; text-wrap: balance; }

/* ============================== AGENDA ============================== */
.ag { padding: 68px var(--pad) 0; scroll-margin-top: 8px; }
.ag .tit { margin-bottom: 26px; }
.ag__grupo + .ag__grupo { margin-top: 30px; }
.ag__ano { display: flex; align-items: center; gap: 12px; margin-bottom: 4px; font-size: 12px; font-weight: 700; letter-spacing: .22em; font-variation-settings: "wdth" 125; color: var(--cinza-txt); font-variant-numeric: tabular-nums; }
.ag__ano::after { content: ""; flex: 1; height: 1px; background: var(--linha); }
.ag__it { display: grid; grid-template-columns: 62px minmax(0, 1fr) auto; align-items: center; gap: 14px; min-height: 76px; padding: 12px 0; border-bottom: 1px solid var(--linha); }
.ag__dia { display: flex; flex-direction: column; line-height: 1; }
.ag__d { font-weight: 900; font-size: 42px; line-height: .86; font-variation-settings: "wdth" 62; font-variant-numeric: tabular-nums; }
.ag__m { margin-top: 5px; font-size: 11px; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; font-variation-settings: "wdth" 125; color: var(--cinza-txt); }
.ag__info { display: flex; flex-direction: column; min-width: 0; }
.ag__cid { font-weight: 700; font-size: 18px; line-height: 1.2; overflow-wrap: anywhere; }
.ag__uf { font-weight: 400; color: var(--cinza-txt); }
.ag__tag { margin-top: 4px; font-size: 10.5px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; font-variation-settings: "wdth" 125; color: rgba(255, 255, 255, .8); }
.ag__sem { font-size: 11px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; font-variation-settings: "wdth" 125; color: var(--cinza-txt); }
.ag__prox { display: block; margin-bottom: 6px; font-size: 10.5px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; font-variation-settings: "wdth" 125; }
.ag__prox[hidden] { display: none; }
/* o próximo show acende: bloco vermelho que termina num Corte 56° */
.ag__it--prox {
  --sl: 64px; position: relative; margin: 8px calc(var(--pad) * -1) 6px; padding: 18px calc(var(--pad) + 20px) 18px var(--pad); border-bottom: 0;
  background: var(--vermelho); grid-template-columns: 62px minmax(0, 1fr) auto;
  clip-path: polygon(0 0, 100% 0, calc(100% - var(--sl)) 100%, 0 100%);
}
.ag__it--prox .ag__d { font-size: 52px; }
.ag__cont { display: block; margin-top: 8px; font-weight: 900; font-size: 30px; line-height: .9; text-transform: uppercase; font-variation-settings: "wdth" 62; }
.ag__cont[hidden] { display: none; }
.ag__it--prox .ag__m, .ag__it--prox .ag__uf, .ag__it--prox .ag__sem, .ag__it--prox .ag__tag { color: rgba(255, 255, 255, .9); }
.ag__it--prox .ag__cid { font-size: 21px; }
.ag__it--prox .ag__sem { align-self: start; margin-top: 2px; margin-right: calc(var(--sl) * .25); }
.ag__mais {
  display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 58px; border-bottom: 1px solid var(--linha);
  font-size: 12px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; font-variation-settings: "wdth" 125; text-align: left;
}
.ag__mais[hidden] { display: none; }
@media (hover: hover) and (pointer: fine) { .ag__mais:hover { color: var(--branco); text-decoration: underline; text-underline-offset: 4px; } }
.ag__mais[aria-expanded="true"] .ico--mais .v { transform: scaleY(0); }
.ag__fim { margin-top: 28px; }
.ag__fim p { font-size: 15px; color: var(--cinza-txt); }
.ag__fim .cta { margin-top: 12px; }

/* ============================== LANÇAMENTO ============================== */
.lc { padding: 68px var(--pad) 0; }
.lc .tit { margin-bottom: 20px; }
.lc__vid { position: relative; aspect-ratio: 16 / 9; margin-inline: calc(var(--pad) * -1); background: #111; overflow: hidden; }
.lc__vid::after { content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 38%; z-index: 2; background: var(--vermelho); transform: translateX(-140%) skewX(-34deg); pointer-events: none; }
.lc__vid iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.lc__play { position: absolute; inset: 0; width: 100%; height: 100%; }
.lc__play img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--e-out), filter .3s; filter: brightness(.82); }
.lc__mk { position: absolute; left: 50%; top: 50%; width: 132px; transform: translate(-50%, -50%); }
.lc__mk svg { width: 100%; height: auto; overflow: visible; }
.lc__mk .b { fill: var(--vermelho); transition: transform .4s var(--e-out); }
.lc__mk .t { fill: var(--branco); }
@media (hover: hover) and (pointer: fine) {
  .lc__play:hover img { transform: scale(1.03); filter: brightness(.95); }
  .lc__play:hover .b1 { transform: translateX(6px); } .lc__play:hover .b2 { transform: translateX(4px); } .lc__play:hover .b3 { transform: translateX(2px); }
}
.lc__play:active .b { transform: translateX(5px); }
.lc__play:focus-visible { outline-offset: -4px; }
.lc__tt { margin-top: 16px; font-weight: 800; font-size: 24px; line-height: 1; text-transform: uppercase; font-variation-settings: "wdth" 62; text-wrap: balance; }
.lc__meta { margin-top: 8px; font-size: 13.5px; color: var(--cinza-txt); }
.lc__canal { display: inline-flex; align-items: center; gap: 8px; margin-top: 14px; min-height: 44px; font-size: 15px; font-weight: 600; text-decoration: underline; text-decoration-color: rgba(255, 255, 255, .35); text-underline-offset: 4px; }
.lc__canal .ico { width: 12px; height: 12px; }
@media (hover: hover) and (pointer: fine) { .lc__canal:hover { text-decoration-color: var(--vermelho); } }

/* ============================== MOMENTOS ============================== */
.mo { padding-top: 68px; }
.mo .tit, .mo__txt { padding: 0 var(--pad); }
.mo__txt { margin-top: 12px; font-size: 15px; color: var(--cinza-txt); }
.mo__faixa {
  display: flex; gap: 12px; padding: 20px var(--pad) 8px; overflow-x: auto; overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory; scroll-padding-inline: var(--pad); scrollbar-width: none;
}
.mo__faixa::-webkit-scrollbar { display: none; }
.mo__faixa:focus-visible { outline-offset: -3px; }
.mo__it { flex: 0 0 64%; max-width: 250px; scroll-snap-align: start; }
.mo__f { display: block; aspect-ratio: 3 / 4; overflow: hidden; background: var(--bg, #1a1a1a); clip-path: polygon(14px 0, 100% 0, 100% 100%, 0 100%, 0 20.8px); }
.mo__f img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--e-out); }
@media (hover: hover) and (pointer: fine) { .mo__it:hover img { transform: scale(1.04); } }
.mo__nav { display: flex; gap: 2px; padding: 4px calc(var(--pad) - 6px) 0; }
.mo__nav[hidden] { display: none; }
.mo__nav button { display: flex; align-items: center; justify-content: center; width: 30px; height: 44px; }
.mo__nav i { display: block; width: 20px; height: 5px; background: #3a3a3a; transform: skewX(-34deg); transition: background-color .3s, width .3s var(--e-out); }
.mo__nav button[aria-current="true"] i { background: var(--vermelho); width: 26px; }
@media (hover: hover) and (pointer: fine) { .mo__nav button:hover i { background: var(--branco); } }
.mo figcaption { margin-top: 10px; font-weight: 800; font-size: 18px; line-height: 1; text-transform: uppercase; font-variation-settings: "wdth" 62; }

/* ============================== RODAPÉ ============================== */
.ft { padding: 72px var(--pad) calc(40px + env(safe-area-inset-bottom)); text-align: center; }
.ft__redes { display: flex; justify-content: center; gap: 30px; }
.ft__redes a { display: flex; flex-direction: column; align-items: center; gap: 10px; min-width: 64px; padding: 6px 0; text-decoration: none; transition: color .2s; }
.ft__redes svg { width: 26px; height: 26px; }
.ft__redes span { font-size: 10.5px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; font-variation-settings: "wdth" 125; color: var(--cinza-txt); transition: color .2s; }
@media (hover: hover) and (pointer: fine) { .ft__redes a:hover { color: var(--vermelho); } .ft__redes a:hover span { color: var(--branco); } }
.ft__redes a:active { color: var(--vermelho); }
.ft__k { margin-top: 26px; font-size: 11px; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; font-variation-settings: "wdth" 125; color: var(--cinza-txt); }
.ft__p { margin-top: 10px; font-size: 13px; color: var(--cinza-txt); }
.ft__p a { text-decoration: underline; text-underline-offset: 3px; }

/* ============================== CONTRATAÇÃO (folha) ============================== */
.bk { width: 100%; max-width: none; height: 100%; max-height: none; margin: 0; padding: 0; border: 0; background: transparent; color: var(--branco); overflow: hidden; }
.bk::backdrop { background: rgba(10, 10, 10, .74); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.bk__in {
  position: absolute; left: 50%; bottom: 0; width: min(100%, 460px); max-height: 94svh; overflow-y: auto; overscroll-behavior: contain;
  min-height: min(632px, 90svh); padding: 24px var(--pad) calc(24px + env(safe-area-inset-bottom)); background: var(--grafite-2); border-top: 3px solid var(--vermelho);
  transform: translateX(-50%);
}
.bk[open] .bk__in { animation: folha-in .5s var(--e-out) both; }
.bk.is-saindo .bk__in { animation: folha-out .28s var(--e-cut) both; }
@keyframes folha-in { from { transform: translate(-50%, 100%); } to { transform: translate(-50%, 0); } }
@keyframes folha-out { from { transform: translate(-50%, 0); } to { transform: translate(-50%, 104%); } }
@media (min-width: 600px) and (min-height: 700px) {
  .bk__in { bottom: auto; top: 50%; transform: translate(-50%, -50%); max-height: 88vh; border: 1px solid var(--linha); border-top: 3px solid var(--vermelho); }
  @keyframes folha-in { from { transform: translate(-50%, -46%); opacity: 0; } to { transform: translate(-50%, -50%); opacity: 1; } }
  @keyframes folha-out { from { transform: translate(-50%, -50%); opacity: 1; } to { transform: translate(-50%, -46%); opacity: 0; } }
}
.bk__hd { position: relative; padding-right: 56px; }
.bk__t { font-weight: 900; font-size: 27px; line-height: .95; text-transform: uppercase; font-variation-settings: "wdth" 62; text-wrap: balance; }
.bk__s { margin-top: 8px; font-size: 14.5px; line-height: 1.4; color: var(--cinza-txt); }
.bk__x { position: absolute; top: -4px; right: 0; display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 1px solid var(--borda); transition: background-color .2s, border-color .2s; }
.bk__x svg { width: 13px; height: 13px; }
@media (hover: hover) and (pointer: fine) { .bk__x:hover { background: var(--vermelho); border-color: var(--vermelho); } }
.bk__in:not([data-etapa="1"]) .bk__s { display: none; }
.bk__in:not([data-etapa="1"]) .bk__t { font-size: 20px; }
.bk__in[data-etapa="ok"] .bk__prog { display: none; }
.bk__prog { display: flex; gap: 7px; margin-top: 20px; padding-left: 4px; }
.bk__prog i { display: block; width: 28px; height: 6px; background: #3a3a3a; transform: skewX(-34deg); transition: background-color .3s; }
.bk__prog i.on { background: var(--vermelho); }
.bk__p { min-width: 0; margin: 24px 0 0; padding: 0; border: 0; }
.bk__p[hidden] { display: none; }
.bk__p.is-entrando { animation: passo-in .45s var(--e-out) both; }
@keyframes passo-in { from { opacity: 0; transform: translateX(18px); } to { opacity: 1; transform: none; } }
.bk__q { display: block; width: 100%; padding: 0; margin-bottom: 16px; font-weight: 900; font-size: 31px; line-height: .95; text-transform: uppercase; font-variation-settings: "wdth" 62; text-wrap: balance; }
.op { display: grid; gap: 8px; }
.op--2 { grid-template-columns: 1fr 1fr; }
.op__i { position: relative; display: flex; align-items: center; min-height: 54px; padding: 12px 14px; border: 1px solid var(--borda); cursor: pointer; font-size: 15px; font-weight: 600; line-height: 1.2; overflow: hidden; isolation: isolate; transition: border-color .2s, color .2s; }
.op__i--full { grid-column: 1 / -1; }
.op__i input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.op__i::before { content: ""; position: absolute; top: 0; bottom: 0; left: -40px; right: -40px; z-index: -1; background: var(--vermelho); transform: translateX(-102%) skewX(-34deg); transition: transform .38s var(--e-cut); }
.op__i:has(input:checked) { border-color: var(--vermelho); }
.op__i:has(input:checked)::before { transform: translateX(0) skewX(-34deg); }
.op__i:has(input:focus-visible) { outline: 2px solid var(--branco); outline-offset: 2px; }
@media (hover: hover) and (pointer: fine) { .op__i:hover { border-color: var(--branco); } }
.fld { position: relative; display: grid; gap: 8px; margin-bottom: 16px; }
.fld label { font-size: 11px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; font-variation-settings: "wdth" 125; color: #D2D2D2; }
.fld .opc { letter-spacing: .08em; text-transform: none; font-weight: 500; color: var(--cinza-txt); }
.fld input, .fld select {
  width: 100%; min-height: 54px; padding: 0 14px; background: #0E0E0E; color: var(--branco); border: 1px solid var(--borda); border-radius: 0;
  font-size: 16px; line-height: 1.2; -webkit-appearance: none; appearance: none; transition: border-color .2s;
}
.fld input::placeholder { color: #8f8f8f; }
.fld input:focus, .fld select:focus { border-color: var(--branco); outline: none; }
.fld input:focus-visible, .fld select:focus-visible { outline: 2px solid var(--vermelho); outline-offset: -2px; }
.fld select { padding-right: 40px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23fff' stroke-width='2'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; background-size: 12px 8px; }
.fld input[type="date"] { color-scheme: dark; }
.fld input[aria-invalid="true"] { border-color: #FF6B72; }
.sug { position: absolute; z-index: 5; left: 0; right: 0; top: 100%; max-height: 236px; overflow-y: auto; overscroll-behavior: contain; background: #0E0E0E; border: 1px solid var(--branco); border-top: 0; }
.sug[hidden] { display: none; }
.sug li { display: flex; justify-content: space-between; gap: 12px; min-height: 46px; align-items: center; padding: 10px 14px; font-size: 15.5px; cursor: pointer; }
.sug li + li { border-top: 1px solid var(--linha); }
.sug li span { color: var(--cinza-txt); font-size: 13px; font-weight: 700; letter-spacing: .12em; }
.sug li[aria-selected="true"] { background: var(--vermelho); }
.sug li[aria-selected="true"] span { color: var(--branco); }
.chk { display: flex; align-items: center; gap: 12px; min-height: 48px; font-size: 15px; cursor: pointer; }
.chk input { width: 20px; height: 20px; margin: 0; accent-color: var(--vermelho); }
.bk__err { margin-top: 6px; font-size: 14px; line-height: 1.35; color: #FF6B72; }
.bk__err:empty { display: none; }
.fld + .bk__err, .chk + .bk__err { margin: -8px 0 16px; }
.bk__nav { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 22px; }
.bk__v { min-height: 48px; padding: 0 2px; font-size: 12px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; font-variation-settings: "wdth" 125; color: #D2D2D2; text-decoration: underline; text-decoration-color: transparent; text-underline-offset: 4px; transition: text-decoration-color .2s; }
@media (hover: hover) and (pointer: fine) { .bk__v:hover { text-decoration-color: currentColor; } }
.bk__ok .cta { margin-top: 22px; }
.bk__ok .bk__v { display: block; margin: 12px auto 0; }
.bk__ok:focus { outline: none; }

/* ============================== ENTRADA (só com movimento) ============================== */
@media (prefers-reduced-motion: no-preference) {
  /* FEIXE: a faixa vermelha atravessa e revela a foto a 56° */
  .hero__foto { animation: foto-in 1s var(--e-cut) .05s both; }
  .hero__feixe { animation: feixe-in 1s var(--e-cut) .05s both; }
  @keyframes foto-in {
    from { clip-path: polygon(0 0, 0 0, calc(0px - var(--sl)) 100%, calc(0px - var(--sl)) 100%); }
    to { clip-path: polygon(0 0, calc(100% + var(--sl)) 0, 100% 100%, 0 100%); }
  }
  @keyframes feixe-in {
    from { transform: translateX(calc(0px - var(--sl))) skewX(-34deg); }
    to { transform: translateX(calc(var(--w) + var(--sl))) skewX(-34deg); }
  }
  /* CORTE: o NOVAYORK entra pela linha a 56°; as barras crescem das pontas internas; o BANDA acende */
  .lg--ny { animation: logo-in .7s var(--e-cut) .45s both; }
  .lg--bar { animation: barras-in .5s var(--e-out) .9s both; }
  .lg--banda { animation: aparece .45s ease .85s both; }
  @keyframes logo-in { from { clip-path: polygon(0 0, 0 0, -15.3% 100%, -15.3% 100%); } to { clip-path: polygon(0 0, 115.3% 0, 100% 100%, 0 100%); } }
  @keyframes barras-in { from { clip-path: inset(0 50% 0 50%); } to { clip-path: inset(0 0 0 0); } }
  @keyframes aparece { from { opacity: 0; } to { opacity: 1; } }
  /* LARGURA: a assinatura passa de 62 a 125 */
  .hero__assin { animation: largura .8s var(--e-out) .95s both; }
  @keyframes largura { from { font-variation-settings: "wdth" 62; letter-spacing: .02em; opacity: 0; } to { font-variation-settings: "wdth" 125; letter-spacing: .22em; opacity: 1; } }
  .hero__prox { animation: sobe .6s var(--e-out) .8s both; }
  .hero__selo { animation: sobe .6s var(--e-out) .9s both; }
  .hero__in > .cta { animation: sobe .6s var(--e-out) .85s both; }
  @keyframes sobe { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
  /* as linhas entram pelo Corte, uma depois da outra */
  .rv-in { animation: linha-in .6s var(--e-out) calc(1s + var(--i, 0) * 60ms) both; }
  @keyframes linha-in {
    from { clip-path: polygon(0 0, 0 0, -54px 100%, -54px 100%); }
    to { clip-path: polygon(0 0, calc(100% + 54px) 0, 100% 100%, 0 100%); }
  }
  /* rolagem: revela pelo Corte (classe .on vem do links.js) */
  .js .rv { opacity: 0; transition: opacity .6s var(--e-out) calc(var(--i, 0) * 60ms); }
  .js .rv.on { opacity: 1; }
  /* CORTE nos títulos (sem mudar a altura do bloco enquanto entram) */
  .js .tit.rv { opacity: 1; clip-path: polygon(0 0, 0 0, -40px 100%, -40px 100%); transition: clip-path .8s var(--e-cut); }
  .js .tit.rv.on { clip-path: polygon(0 0, calc(100% + 40px) 0, 100% 100%, 0 100%); }
  /* CORTE nas datas e nos momentos */
  .js .ag__it.rv, .js .mo__it.rv { opacity: 1; clip-path: polygon(0 0, 0 0, -60px 100%, -60px 100%); transition: clip-path .75s var(--e-cut) calc(var(--i, 0) * 70ms); }
  .js .ag__it.rv.on, .js .mo__it.rv.on { clip-path: polygon(0 0, calc(100% + 60px) 0, 100% 100%, 0 100%); }
  /* FEIXE no vídeo: a faixa vermelha atravessa e a imagem aparece atrás dela */
  .js .lc__vid.rv { opacity: 1; }
  .js .lc__vid.rv .lc__play { clip-path: polygon(0 0, 0 0, -40% 100%, -40% 100%); transition: clip-path .9s var(--e-cut) .05s; }
  .js .lc__vid.rv.on .lc__play { clip-path: polygon(0 0, 140% 0, 100% 100%, 0 100%); }
  .js .lc__vid.rv.on::after { animation: feixe-v .9s var(--e-cut) .05s 1 both; }
  @keyframes feixe-v { from { transform: translateX(-140%) skewX(-34deg); } to { transform: translateX(330%) skewX(-34deg); } }
  .js .ag__it--prox.rv { opacity: 1; transform: none; clip-path: polygon(0 0, 0 0, calc(0px - var(--sl)) 100%, calc(0px - var(--sl)) 100%); transition: clip-path .8s var(--e-cut); }
  .js .ag__it--prox.rv.on { clip-path: polygon(0 0, 100% 0, calc(100% - var(--sl)) 100%, 0 100%); }
  /* a foto do topo se afasta devagar com a rolagem (onde o navegador permite) */
  @supports (animation-timeline: scroll()) {
    .hero__foto img { animation: foto-par linear both; animation-timeline: scroll(root); animation-range: 0 70svh; }
    @keyframes foto-par { to { transform: translateY(14%) scale(1.06); } }
  }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .001ms !important; animation-delay: 0s !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
}
