/* Inter Tight (variável, local): versão da Inter para títulos grandes, mais compacta. Só carrega no tema ice. */
@font-face { font-family: "Inter Tight"; font-style: normal; font-weight: 100 900; font-display: swap; src: url("../fonts/inter-tight-latin-ext-wght.woff2") format("woff2-variations"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Inter Tight"; font-style: normal; font-weight: 100 900; font-display: swap; src: url("../fonts/inter-tight-latin-wght.woff2") format("woff2-variations"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

/* Tema "ice" (NOME HISTÓRICO): hoje = BRANCO + DOURADO + PRETO. Foi criado como "branco, azul gelo e preto" e o João redefiniu (2026-10-09) para
   branco, dourado e preto; o nome/slug `ice` ficou para não quebrar referências. Mantém o dourado original do logo (#D2A833) e usa um
   creme (--ice-100..300) como superfície clara alternada. Só carrega em páginas com body.tn-theme-ice. */
body.tn-theme-ice {
  --ice-100: #fbf7ea; --ice-200: #f4eacb; --ice-300: #ead9a2; --ice-500: #d2a833; --ice-700: #a9831f;
  --tn-color-gold-dark: #8c6b14;               /* dourado escuro p/ texto pequeno sobre claro (contraste ≥ 4,5:1) */
  --tn-bg-deep: #0b0b0c; --tn-bg-primary: #131416; --tn-surface-1: #131416; --tn-surface-2: #1b1c1f;
  --tn-bg-soft: var(--ice-100); --tn-ink: #0b0b0c; --tn-ink-secondary: #3a3f46; --tn-ink-muted: #6b7280;
  --tn-border-active: rgba(210, 168, 51, 0.5);
  --tn-header-h: 5.25rem;
  --tn-font-display: "Inter Tight", "Inter", "Inter Fallback", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  background: #fff; color: var(--tn-ink);
}
body.tn-theme-ice .tn-btn { background: var(--tn-bg-deep); color: #fff; }
@media (hover: hover) and (pointer: fine) { body.tn-theme-ice .tn-btn:hover { background: #26282c; } }

/* ===== Header: pílula flutuante de vidro ===== */
body.tn-theme-ice.tn-header-solid { padding-block-start: 0; }
body.tn-theme-ice .tn-header,
body.tn-theme-ice .tn-header.is-scrolled[data-mode],
body.tn-theme-ice.tn-header-solid .tn-header,
body.tn-theme-ice .tn-header.is-open { block-size: auto; padding-block-start: 0.75rem; background: none; border-color: transparent; backdrop-filter: none; -webkit-backdrop-filter: none; pointer-events: none; }
.tn-theme-ice .tn-header[data-mode="light"] { --pill-bg: rgba(255, 255, 255, 0.72); --pill-border: rgba(11, 11, 12, 0.1); color: var(--tn-ink); }
.tn-theme-ice .tn-header[data-mode="dark"] { --pill-bg: rgba(11, 11, 12, 0.6); --pill-border: rgba(255, 255, 255, 0.16); color: #fff; }
.tn-theme-ice .tn-header .tn-header__bar { position: relative; isolation: isolate; pointer-events: auto; block-size: 3.75rem; padding-inline: 1.5rem; }
/* O vidro fica num pseudo-elemento: backdrop-filter no próprio .bar viraria o bloco de contenção do menu mobile (position:fixed). */
.tn-theme-ice .tn-header .tn-header__bar::before { content: ""; position: absolute; inset: 0; z-index: -1; border: 1px solid var(--pill-border); border-radius: 999px; background: var(--pill-bg); backdrop-filter: blur(18px) saturate(1.5); -webkit-backdrop-filter: blur(18px) saturate(1.5); box-shadow: 0 10px 30px -14px rgba(0, 0, 0, 0.25); }
@media (min-width: 900px) {
  .tn-theme-ice .tn-header .tn-header__bar { display: grid; grid-template-columns: 1fr auto 1fr; }
  .tn-theme-ice .tn-header__nav { display: contents; }
  .tn-theme-ice .tn-header__list { justify-self: center; gap: clamp(1.25rem, 2.5vw, 2.5rem); }
  .tn-theme-ice .tn-header .tn-header__cta { justify-self: end; }
}
.tn-theme-ice .tn-header .tn-header__cta { background: transparent; color: inherit; border: 1px solid currentColor; border-radius: 999px; min-block-size: 2.5rem; padding-inline: 1.15rem; font-weight: 500; }
.tn-theme-ice .tn-header .tn-header__cta::after { content: "→"; margin-inline-start: 0.5rem; }
@media (hover: hover) and (pointer: fine) {
  .tn-theme-ice .tn-header[data-mode="light"] .tn-header__cta:hover { background: var(--tn-bg-deep); color: #fff; }
  .tn-theme-ice .tn-header[data-mode="dark"] .tn-header__cta:hover { background: #fff; color: var(--tn-bg-deep); }
}
@media (max-width: 899px) {
  .tn-theme-ice .tn-header__nav { pointer-events: auto; }
  .tn-theme-ice .tn-header.is-open { color: #fff; --pill-bg: rgba(11, 11, 12, 0.85); --pill-border: rgba(255, 255, 255, 0.16); }
  .tn-theme-ice .tn-header.is-open .tn-header__brand .tn-logo--on-dark { display: block; }
}

/* ===== VSL no tema gelo ===== */
.tn-theme-ice .tn-vsl { background: var(--ice-100); }
.tn-theme-ice .tn-vsl__media::before { background: var(--ice-300); }
.tn-theme-ice .tn-vsl__play { background: #fff; color: var(--tn-bg-deep); }
.tn-theme-ice .tn-vsl__bar i { background: var(--ice-300); }

/* Logo menor dentro da pílula */
.tn-theme-ice .tn-header__brand { inline-size: clamp(6.5rem, 5.5rem + 2vw, 7.5rem); }

/* Títulos em peso médio */
.tn-theme-ice .tn-vsl__title { font-weight: 600; }

.tn-theme-ice .tn-vsl__title { font-family: var(--tn-font-display); }
