/* BRUNO DEV.AI V3 · base: fontes self-hosted, reset, tipografia, botoes, links, foco, midia e reveals.
   Tokens em src/tokens.css (gerado). Framing de midia em src/media.css (gerado do MEDIA_FRAMING_MANIFEST).
   Luxury = restraint: nenhum titulo acima de 68px; ouro so como acento; sem gradiente decorativo, glass ou glow. */

/* ---------- Fontes (OFL, self-hosted; latin-ext so baixa se a pagina usar esses codepoints) ---------- */
@font-face { font-family: 'Newsreader'; font-style: normal; font-weight: 300 400; font-display: swap;
  src: url('/assets/fonts/bd-newsreader-roman-latin.woff2') format('woff2');
  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+2190-2199, U+2212, U+2215, U+2248, U+2264-2265, U+25B6, U+25CF, U+FEFF, U+FFFD; }
@font-face { font-family: 'Newsreader'; font-style: normal; font-weight: 300 400; font-display: swap;
  src: url('/assets/fonts/bd-newsreader-roman-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, 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: 'Newsreader'; font-style: italic; font-weight: 300; font-display: swap;
  src: url('/assets/fonts/bd-newsreader-italic-latin.woff2') format('woff2');
  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+2190-2199, U+2212, U+2215, U+2248, U+2264-2265, U+25B6, U+25CF, U+FEFF, U+FFFD; }
@font-face { font-family: 'Newsreader'; font-style: italic; font-weight: 300; font-display: swap;
  src: url('/assets/fonts/bd-newsreader-italic-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, 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: 'Archivo'; font-style: normal; font-weight: 400 600; font-display: swap;
  src: url('/assets/fonts/bd-archivo-latin.woff2') format('woff2');
  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+2190-2199, U+2212, U+2215, U+2248, U+2264-2265, U+25B6, U+25CF, U+FEFF, U+FFFD; }
@font-face { font-family: 'Archivo'; font-style: normal; font-weight: 400 600; font-display: swap;
  src: url('/assets/fonts/bd-archivo-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, 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: 'JetBrains Mono'; font-style: normal; font-weight: 400; font-display: swap;
  src: url('/assets/fonts/bd-jetbrainsmono-latin.woff2') format('woff2');
  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+2190-2199, U+2212, U+2215, U+2248, U+2264-2265, U+25B6, U+25CF, U+FEFF, U+FFFD; }
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 400; font-display: swap;
  src: url('/assets/fonts/bd-jetbrainsmono-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, 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; }
/* Fallbacks com metricas do pipeline V3 (size-adjust) para o swap nao deslocar layout. */
@font-face { font-family: 'Newsreader Fallback'; src: local('Times New Roman'), local('TimesNewRomanPSMT');
  size-adjust: 99.52%; ascent-override: 73.85%; descent-override: 26.63%; line-gap-override: 0%; }
@font-face { font-family: 'Archivo Fallback'; src: local('Arial'), local('ArialMT');
  size-adjust: 101.74%; ascent-override: 86.30%; descent-override: 20.64%; line-gap-override: 0%; }
@font-face { font-family: 'JetBrains Mono Fallback'; src: local('Courier New'), local('CourierNewPSMT');
  size-adjust: 99.98%; ascent-override: 102.02%; descent-override: 30%; line-gap-override: 0%; }

/* ---------- Reset e base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { background: var(--v-bg); color: var(--v-ink); -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: var(--v-header-h); }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body {
  margin: 0; background: var(--v-bg); color: var(--v-ink);
  font-family: 'Archivo', 'Archivo Fallback', 'Helvetica Neue', Arial, sans-serif; font-weight: 400;
  font-size: var(--v-fs-body); line-height: var(--v-lh-body);
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility;
  overflow-x: hidden;
}
img, video, picture, svg { display: block; max-width: 100%; }
img { height: auto; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
h1, h2, h3, h4, p, ul, ol, dl, dd, figure { margin: 0; }
ul, ol { padding: 0; list-style: none; }
::selection { background: var(--v-gold); color: var(--v-bg); }

/* ---------- Tipografia (Newsreader = editorial · Archivo = executiva · Mono = so sistema/metadado) ---------- */
.serif { font-family: 'Newsreader', 'Newsreader Fallback', 'Iowan Old Style', Georgia, serif; font-optical-sizing: auto; }
.mono { font-family: 'JetBrains Mono', 'JetBrains Mono Fallback', ui-monospace, Menlo, monospace; font-weight: 400; }
.h1, .h2, .h3 { font-family: 'Newsreader', 'Newsreader Fallback', 'Iowan Old Style', Georgia, serif; font-weight: 300; text-wrap: balance; }
.h1 { font-size: var(--v-fs-h1); line-height: var(--v-lh-h1); letter-spacing: -0.022em; }
.h2 { font-size: var(--v-fs-h2); line-height: var(--v-lh-h2); letter-spacing: -0.015em; }
.h3 { font-size: var(--v-fs-h3); line-height: var(--v-lh-h3); letter-spacing: -0.015em; }
.it { font-style: italic; color: var(--v-ink-2); }
p { text-wrap: pretty; }

/* Eyebrow: Archivo 500 12/caps/.2em ouro, com numero mono e regua (ou so regua no hero). */
.eyebrow { display: flex; align-items: center; gap: 14px; font-size: var(--v-fs-eyebrow); font-weight: 500; letter-spacing: .2em; text-transform: uppercase; color: var(--v-gold); }
.eyebrow-n { font-family: 'JetBrains Mono', 'JetBrains Mono Fallback', ui-monospace, monospace; letter-spacing: .06em; }
.eyebrow-rule { flex: none; width: 24px; height: 1px; background: var(--v-gold); }
.label { font-size: var(--v-fs-micro); font-weight: 500; letter-spacing: .2em; text-transform: uppercase; color: var(--v-muted); }

/* ---------- Botoes e links (alvos: botao 56h, CTA de header 46h, menu 48) ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 14px; min-height: var(--v-btn-h); padding: 0 30px;
  font-size: var(--v-fs-ui); font-weight: 600; letter-spacing: .12em; text-transform: uppercase; line-height: 1.2; text-align: center;
  transition: background-color var(--v-dur-button-hover) ease, border-color var(--v-dur-button-hover) ease, color var(--v-dur-button-hover) ease;
}
.btn--primary { background: var(--v-ink); color: var(--v-bg); }
.btn--primary:hover { background: var(--v-gold-hover); }
.btn--secondary { border: 1px solid var(--v-line-strong); color: var(--v-ink); font-weight: 500; }
.btn--secondary:hover { border-color: var(--v-ink); }
.link-u {
  display: inline-flex; align-items: center; min-height: 24px; padding-bottom: 6px; border-bottom: 1px solid var(--v-gold-underline);
  font-size: var(--v-fs-ui); font-weight: 500; letter-spacing: .12em; text-transform: uppercase; line-height: 1.2;
  transition: color var(--v-dur-button-hover) ease;
}
a.link-u:hover, a:hover .link-u { color: var(--v-gold-hover); }
.link-plain { font-size: var(--v-fs-ui); font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--v-ink-3); display: inline-flex; align-items: center; min-height: 24px; }
.link-plain:hover { color: var(--v-ink); }
.status { display: inline-flex; align-items: center; gap: 8px; font-size: var(--v-fs-eyebrow); font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: var(--v-ink-3); }
.dot { flex: none; width: 6px; height: 6px; border-radius: 50%; background: var(--v-gold); }
@media (pointer: coarse) { .link-u, .link-plain { min-height: var(--v-touch-min); padding-bottom: 0; } }

/* ---------- Foco, skip, utilitarios ---------- */
:focus { outline: none; }
:focus-visible { outline: 2px solid var(--v-ink); outline-offset: 3px; }
.btn--primary:focus-visible { outline-color: var(--v-ink); }
.skip { position: absolute; left: 16px; top: 12px; z-index: 300; padding: 12px 18px; background: var(--v-ink); color: var(--v-bg); font-size: var(--v-fs-ui); font-weight: 600; letter-spacing: .12em; text-transform: uppercase; transform: translateY(-160%); }
.skip:focus-visible { transform: none; outline-color: var(--v-gold); }
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
[hidden] { display: none !important; }
.wrap { padding-inline: var(--v-m); }
.grid { display: grid; grid-template-columns: repeat(var(--v-cols), minmax(0, 1fr)); column-gap: var(--v-g); }

/* ---------- ArtDirectedMedia (framing por asset em src/media.css) ---------- */
.adm { position: relative; overflow: hidden; background: var(--v-surface-3); }
.adm > .adm-m, .adm > picture > .adm-m { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; }
.adm > picture { position: absolute; inset: 0; }
/* Midia de case: NATURAL_RATIO puro (width/height do arquivo; nunca corta, nunca distorce). */
.nat { width: 100%; height: auto; }
.logo { height: var(--v-logo-h); width: auto; max-width: none; object-fit: contain; object-position: center; } /* logo oficial inteiro: canvas transparente preservado, nunca recortado */

/* ---------- Reveals (reveal.js liga data-reveal-on; SAVE DATA nao oculta nada) ---------- */
:root[data-reveal-on][data-motion="full"] [data-reveal]:not(.is-in) { opacity: 0; }
:root[data-reveal-on][data-motion="full"] [data-reveal="media"]:not(.is-in) .adm-m { transform: scale(1.02); }
:root[data-reveal-on][data-motion="full"] [data-reveal] { transition: opacity 900ms var(--v-ease-premium); }
:root[data-reveal-on][data-motion="full"] [data-reveal="media"] .adm-m { transition: transform 900ms var(--v-ease-premium); }
:root[data-reveal-on][data-motion="reduced"] [data-reveal]:not(.is-in) { opacity: 0; }
:root[data-reveal-on][data-motion="reduced"] [data-reveal] { transition: opacity var(--v-dur-reduced) linear; }
