/* ============================================================================
   BIMBLASTER Design System — C4 "Posição de mercado" (v1.0 · ago/2026)
   CSS de produção derivado de site/ds2-concepts/d-mercado/preview.html.
   Especificação completa: site/ds2-concepts/d-mercado/conceito.md
   Em uso: LP /desenvolvimento-plugins-revit/ (post 1301) — TESTE do design
   novo em produção. A LP de consultoria (1254) permanece no DS v1.2.

   ORDEM DAS CAMADAS (garantida pela ORDEM DO ARQUIVO, nunca por @layer):
     0. @font-face · 1. reset · 2. tokens · 3. base · 4. componentes · 5. utilities
   ⚠️ SEM @layer: o tema declara `* { margin:0; padding:0; font-family:'Poppins' }`
   fora de camada, e estilo sem camada vence qualquer @layer (armadilha 2).

   CONTRATO DE ESPECIFICIDADE (mesmo do bimblaster-ds-v2.css):
     reset/base  → `.bb :where(el)`  = (0,1,0)  ← :where() zera o elemento
     componentes → `.bb-algo`        = (0,1,0)  ← vencem por virem depois
     comp c/ el  → `.bb .bb-algo el` = (0,2,1)
     utilities   → `.bb .bb-mt-4`    = (0,2,0)  ← vêm por último
   Cor de rótulo de botão e de link usa 2 classes (`.bb .bb-btn--x`) por
   segurança extra (armadilha 12 do v1).

   REGRA DE OURO C4: âmbar (--bb-amber-*) é EXCLUSIVO de CTA de conversão.
   O rótulo do CTA âmbar é TINTA PETRÓLEO (#052029, 8,42:1 AAA), NUNCA branco —
   diferente do DS v1. Positivo/checks = petróleo (não existe verde de sucesso).
   Todos os pares texto/fundo passam AA 4,5:1 (tabela no conceito.md). 0 exceções.

   Nas LPs este arquivo entra INLINE no topo do bloco wp:html via
   site/build-lp.sh (o placeholder declara data-css="bimblaster-ds-c4.css").
   ============================================================================ */

/* ---------- FONTES (self-hosted, subset latin, LGPD ok) ---------- */
/* Servidas de /wp-content/uploads/bb/fonts/ (cache 1 ano). Ambas VARIÁVEIS:
   um woff2 por família cobre toda a faixa de peso (Archivo 400–800;
   IBM Plex Sans v23 é variável no Google Fonts — 400/500/600 no mesmo arquivo).
   Preload por LP no mu-plugin bb-perf.php (1301 → Archivo/Plex). */
@font-face {
  font-family: "Archivo";
  font-style: normal;
  font-weight: 400 800;
  font-stretch: 100%;
  font-display: swap;
  src: url(/wp-content/uploads/bb/fonts/archivo-400-800.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+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "IBM Plex Sans";
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url(/wp-content/uploads/bb/fonts/plex-sans-400-600.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+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ---------- FALLBACKS MÉTRICOS (anti-CLS) ---------- */
/* Arial local reescalada para imitar as métricas da webfont (calculado com
   fonttools sobre os woff2 reais: size-adjust = largura média ponderada da
   webfont / da Arial; overrides = (métrica hhea / upm) / size-adjust). */
@font-face {
  font-family: "Archivo Fallback";
  src: local("Arial");
  size-adjust: 101.88%;
  ascent-override: 86.18%;
  descent-override: 20.61%;
  line-gap-override: 0%;
}
@font-face {
  font-family: "IBM Plex Sans Fallback";
  src: local("Arial");
  size-adjust: 101.22%;
  ascent-override: 101.26%;
  descent-override: 27.17%;
  line-gap-override: 0%;
}

/* ---------- RESET (escopado em .bb) ---------- */
.bb, .bb *, .bb *::before, .bb *::after { box-sizing: border-box; }
.bb *, .bb *::before, .bb *::after { margin: 0; padding: 0; font-family: inherit; }
.bb :where(img, svg) { display: block; max-width: 100%; height: auto; }
.bb :where(ul[class], ol[class]) { list-style: none; }
.bb :where(a) { color: inherit; }

/* ---------- TOKENS ---------- */
:root {
  /* Petróleo — a marca (matiz 191–195, fora do corredor navy 204–230 do setor) */
  --bb-petro-950: #052029;
  --bb-petro-900: #07303c;
  --bb-petro-800: #0a4253;
  --bb-petro-700: #0d5568;
  --bb-petro-600: #116a80;
  --bb-petro-500: #1a8299;
  --bb-petro-400: #38a0b6;
  --bb-petro-300: #74c9dc;
  --bb-petro-100: #d5edf4;
  --bb-petro-50:  #eaf6f9;

  /* Âmbar — EXCLUSIVO de conversão (rótulo sempre em tinta petróleo) */
  --bb-amber-300: #ffd98a;
  --bb-amber-400: #ffc44d;
  --bb-amber-500: #f5a800;
  --bb-amber-600: #d98c00;
  --bb-amber-700: #9c6400;

  /* Neutros quentes — o "papel" do sistema */
  --bb-paper-50:  #faf8f4;
  --bb-paper-100: #f3f0e8;
  --bb-paper-200: #e7e2d7;
  --bb-white: #ffffff;

  /* Tintas (casta petróleo) */
  --bb-ink-900: #12222a;
  --bb-ink-700: #3b4950;
  --bb-ink-500: #5e6b71;

  /* Neutros sobre petróleo */
  --bb-mist-200: #c4dce4;
  --bb-mist-400: #92afb8;

  /* Semânticos (não existe verde de sucesso: positivo é petróleo) */
  --bb-alert-600: #b3261e;
  --bb-whatsapp: #25d366;

  /* Tipografia fluida (390px → 1440px) */
  --bb-font-head: "Archivo", "Archivo Fallback", "Helvetica Neue", system-ui, sans-serif;
  --bb-font-body: "IBM Plex Sans", "IBM Plex Sans Fallback", system-ui, sans-serif;
  --bb-font-mono: ui-monospace, "SF Mono", "IBM Plex Mono", Menlo, monospace;
  --bb-text-display: clamp(2.5rem, 1.9rem + 2.48vw, 4.125rem);   /* 40 → 66 */
  --bb-text-h1: clamp(2.125rem, 1.8rem + 1.33vw, 3rem);          /* 34 → 48 */
  --bb-text-h2: clamp(1.75rem, 1.57rem + 0.76vw, 2.25rem);       /* 28 → 36 */
  --bb-text-h3: clamp(1.3125rem, 1.24rem + 0.29vw, 1.5rem);      /* 21 → 24 */
  --bb-text-lead: clamp(1.1875rem, 1.12rem + 0.29vw, 1.375rem);  /* 19 → 22 */
  --bb-text-body: clamp(1.0625rem, 1.04rem + 0.1vw, 1.125rem);   /* 17 → 18 */
  --bb-text-small: 0.9375rem;                                    /* 15 */

  /* Espaço e forma — raios curtos, de instrumento técnico */
  --bb-space-section: clamp(4rem, 2.7rem + 5.33vw, 7.5rem);      /* 64 → 120 */
  --bb-radius-sm: 6px;
  --bb-radius: 10px;
  --bb-radius-lg: 18px;
  --bb-container: 1200px;

  /* Sombras com tinta petróleo */
  --bb-shadow-sm: 0 1px 2px rgba(5,32,41,.06), 0 2px 8px rgba(5,32,41,.06);
  --bb-shadow-md: 0 1px 2px rgba(5,32,41,.05), 0 6px 16px rgba(5,32,41,.08), 0 18px 40px rgba(5,32,41,.08);
  --bb-shadow-lg: 0 2px 4px rgba(5,32,41,.06), 0 12px 28px rgba(5,32,41,.12), 0 32px 72px rgba(5,32,41,.16);
  --bb-shadow-cta: 0 1px 2px rgba(120,72,0,.24), 0 6px 18px rgba(180,110,0,.28);
}

/* ---------- BASE ---------- */
.bb {
  font-family: var(--bb-font-body);
  font-size: var(--bb-text-body);
  line-height: 1.65;
  color: var(--bb-ink-700);
  background: var(--bb-white);
  -webkit-font-smoothing: antialiased;
  overflow-x: clip;
}
.bb :where(h1, h2, h3) {
  font-family: var(--bb-font-head);
  color: var(--bb-ink-900);
  line-height: 1.2;
  text-wrap: balance;
}
.bb :where(h1) { font-size: var(--bb-text-h1); font-weight: 800; letter-spacing: -0.018em; }
.bb :where(h2) { font-size: var(--bb-text-h2); font-weight: 700; letter-spacing: -0.014em; }
.bb :where(h3) { font-size: var(--bb-text-h3); font-weight: 600; letter-spacing: -0.008em; }
.bb :where(p) { text-wrap: pretty; }
/* Link de conteúdo (sem classe): petróleo sublinhado — 8,35:1 no branco */
.bb :where(a:not([class])) {
  color: var(--bb-petro-700);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.bb ::selection { background: var(--bb-petro-800); color: var(--bb-white); }
.bb :focus-visible { outline: 3px solid var(--bb-petro-500); outline-offset: 2px; border-radius: 4px; }
@media (prefers-reduced-motion: reduce) {
  .bb *, .bb *::before, .bb *::after { transition-duration: 0s !important; }
}

/* ---------- LAYOUT ---------- */
.bb-container {
  max-width: var(--bb-container);
  margin-inline: auto;
  padding-inline: clamp(20px, 4vw, 32px);
}
.bb-section { padding-block: var(--bb-space-section); }
.bb-section--tint { background: var(--bb-paper-100); }
/* .bb-section--navy (markup legado do v1): sem estilo próprio no C4 —
   o dark de CTA fica todo em .bb-cta-final. */

/* Eyebrow com marcador quadrado (índice de prancha, não pílula) */
.bb-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font: 600 0.8125rem/1 var(--bb-font-body);
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--bb-petro-600);
  margin-bottom: 18px;
}
.bb-eyebrow::before {
  content: "";
  width: 9px; height: 9px;
  border: 2px solid var(--bb-petro-500);
  border-radius: 2px;
}
.bb-center .bb-eyebrow { justify-content: center; }

/* Parágrafo de apoio sob o h2 da seção (medida de leitura confortável) */
.bb-intro { max-width: 62ch; margin-top: 14px; }
.bb-center .bb-intro { margin-inline: auto; }

/* ---------- BOTÕES ---------- */
.bb-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font: 600 1.0625rem/1 var(--bb-font-head);
  padding: 17px 28px;
  border-radius: var(--bb-radius);
  text-decoration: none;
  border: 0;
  cursor: pointer;
  transition: background .18s ease, box-shadow .18s ease, transform .18s ease, color .18s ease;
}

/* Primário — âmbar com RÓTULO EM TINTA PETRÓLEO (8,42:1 AAA; nunca branco) */
.bb .bb-btn--primary {
  background: linear-gradient(180deg, var(--bb-amber-400) 0%, var(--bb-amber-500) 78%);
  color: var(--bb-petro-950);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.5), var(--bb-shadow-cta);
}
.bb .bb-btn--primary:hover {
  background: linear-gradient(180deg, var(--bb-amber-500) 0%, var(--bb-amber-600) 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.34), 0 2px 6px rgba(120,72,0,.26), 0 12px 26px rgba(180,110,0,.34);
  transform: translateY(-2px);
}
.bb .bb-btn--primary:active { transform: translateY(0); }

/* Secundário — anel petróleo no claro; no dark vira anel mist */
.bb .bb-btn--secondary {
  background: transparent;
  color: var(--bb-petro-700);
  box-shadow: inset 0 0 0 2px var(--bb-petro-600);
}
.bb .bb-btn--secondary:hover {
  background: var(--bb-petro-800);
  color: var(--bb-white);
  box-shadow: inset 0 0 0 2px var(--bb-petro-800), var(--bb-shadow-sm);
  transform: translateY(-2px);
}
.bb-cta-final .bb-btn--secondary { color: var(--bb-white); box-shadow: inset 0 0 0 2px rgba(196,220,228,.5); }
.bb-cta-final .bb-btn--secondary:hover {
  background: var(--bb-white);
  color: var(--bb-petro-900);
  box-shadow: inset 0 0 0 2px var(--bb-white);
}

/* WhatsApp — rótulo escuro (8,50:1) */
.bb .bb-btn--whatsapp { background: var(--bb-whatsapp); color: var(--bb-petro-950); }
.bb .bb-btn--whatsapp:hover {
  background: #1fbd5b;
  box-shadow: 0 6px 18px rgba(37,211,102,.32);
  transform: translateY(-2px);
}

/* Link */
.bb .bb-btn--link {
  font: 600 1rem/1 var(--bb-font-head);
  color: var(--bb-petro-700);
  padding: 6px 0;
  border-radius: 3px;
  background: none;
}
.bb .bb-btn--link:hover { text-decoration: underline; text-underline-offset: 5px; }
.bb-cta-final .bb-btn--link { color: var(--bb-petro-300); }

/* Microcopy sob o CTA — no C4 o hero é CLARO (tinta), o CTA final é dark (mist) */
.bb .bb-cta-note {
  font: 500 var(--bb-text-small)/1.5 var(--bb-font-body);
  color: var(--bb-ink-500);
  margin-top: 16px;
}
.bb-cta-final .bb-cta-note { color: var(--bb-mist-200); margin-inline: auto; }

/* ---------- HERO (claro: papel quente + brilhos radiais) ---------- */
.bb-hero {
  position: relative;
  background:
    radial-gradient(46rem 30rem at 88% -18%, rgba(26,130,153,.20), transparent 64%),
    radial-gradient(34rem 24rem at -8% 6%, rgba(245,168,0,.10), transparent 62%),
    linear-gradient(180deg, var(--bb-paper-50) 0%, #fcfbf8 74%, var(--bb-white) 100%);
  /* padding-bottom folgado: a laje de credibilidade sobrepõe o hero */
  padding-block: clamp(3.5rem, 2.4rem + 4.5vw, 6rem) clamp(6rem, 4rem + 8vw, 9.5rem);
  overflow: clip;
}
.bb-hero h1 {
  font-size: var(--bb-text-display);
  font-weight: 800;
  letter-spacing: -0.022em;
  line-height: 1.1;
  color: var(--bb-petro-950);
  max-width: 19ch;
}
.bb-hero__lead {
  font-size: var(--bb-text-lead);
  line-height: 1.6;
  color: var(--bb-ink-700);
  max-width: 56ch;
  margin-top: 22px;
}
.bb-hero__actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 34px; }
.bb-hero__proof {
  margin-top: 34px;
  padding-top: 22px;
  border-top: 1px solid var(--bb-paper-200);
  font: 500 0.8125rem/1.7 var(--bb-font-body);
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--bb-ink-500);
  max-width: 64ch;
}

/* ---------- CREDIBILIDADE (laje petróleo sobreposta ao hero) ---------- */
.bb-credwrap { position: relative; z-index: 2; margin-top: clamp(-4.5rem, -3vw - 2.5rem, -3rem); }
.bb-credbar {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 26px 20px;
  background:
    radial-gradient(28rem 16rem at 88% -30%, rgba(26,130,153,.42), transparent 62%),
    linear-gradient(150deg, var(--bb-petro-900) 0%, var(--bb-petro-950) 100%);
  border-radius: var(--bb-radius-lg);
  box-shadow: var(--bb-shadow-lg);
  padding: clamp(28px, 4vw, 44px) clamp(22px, 3vw, 40px);
}
.bb-credbar div { padding-left: 18px; border-left: 2px solid rgba(116,201,220,.42); }
.bb-credbar strong {
  display: block;
  font: 800 clamp(1.6875rem, 1.35rem + 1.4vw, 2.375rem)/1.1 var(--bb-font-head);
  letter-spacing: -0.02em;
  color: var(--bb-white);
}
.bb-credbar span {
  display: block;
  margin-top: 8px;
  font-size: var(--bb-text-small);
  line-height: 1.5;
  color: var(--bb-mist-200);
}

/* ---------- GRADES ---------- */
.bb-grid-2 { display: grid; gap: 20px; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
.bb-grid-3 { display: grid; gap: 20px; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }

/* ---------- CARDS (ficha técnica: canto 10px, borda de papel) ---------- */
.bb-card {
  background: var(--bb-white);
  border: 1px solid var(--bb-paper-200);
  border-radius: var(--bb-radius);
  padding: 28px 26px;
  transition: box-shadow .2s ease, transform .2s ease, border-color .2s ease;
}
.bb-card:hover { box-shadow: var(--bb-shadow-md); transform: translateY(-3px); border-color: var(--bb-petro-100); }
.bb-card h3 { margin-bottom: 10px; }
.bb-card--shadow { box-shadow: var(--bb-shadow-sm); }
.bb-card--pain { border-left: 3px solid var(--bb-alert-600); }
/* positivo é petróleo (não existe verde de sucesso no C4) */
.bb-card--gain { border-left: 3px solid var(--bb-petro-500); }

/* Badge de card (petróleo sobre petro-50 — âmbar jamais) */
.bb-badge {
  display: inline-block;
  font: 600 0.6875rem/1 var(--bb-font-body);
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--bb-petro-700);
  border: 1px solid var(--bb-petro-100);
  background: var(--bb-petro-50);
  border-radius: 3px;
  padding: 7px 10px;
  margin-bottom: 14px;
}

/* ---------- LISTAS COM CHECK (desenhado em CSS, sem glifo) ---------- */
.bb-check { display: grid; gap: 14px; }
.bb-check li { position: relative; padding-left: 36px; }
.bb-check li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.34em;
  width: 22px;
  height: 22px;
  border-radius: 4px;
  background: var(--bb-petro-50);
  border: 1px solid var(--bb-petro-100);
}
.bb-check li::after {
  content: "";
  position: absolute;
  left: 7px;
  top: 0.62em;
  width: 8px;
  height: 4px;
  border-left: 2px solid var(--bb-petro-600);
  border-bottom: 2px solid var(--bb-petro-600);
  rotate: -45deg;
}
.bb-check--pain li::before { background: rgba(179,38,30,.07); border-color: rgba(179,38,30,.28); }
.bb-check--pain li::after {
  left: 6px;
  top: 0.5em;
  width: 10px;
  height: 10px;
  border: 0;
  rotate: 0deg;
  background:
    linear-gradient(45deg, transparent 44%, var(--bb-alert-600) 44%, var(--bb-alert-600) 56%, transparent 56%),
    linear-gradient(-45deg, transparent 44%, var(--bb-alert-600) 44%, var(--bb-alert-600) 56%, transparent 56%);
}

/* ---------- ÍNDICE DE ROTINAS (portfólio: marcador quadrado de prancha) ---------- */
/* Lista compacta de rotinas dentro de .bb-card; o marcador repete o quadrado
   do eyebrow (vocabulário de índice de prancha do C4), menor e vazado. */
.bb-routines { display: grid; gap: 12px; }
.bb-routines li {
  position: relative;
  padding-left: 22px;
  font-size: var(--bb-text-small);
  line-height: 1.6;
}
.bb-routines li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.5em;
  width: 8px;
  height: 8px;
  border: 2px solid var(--bb-petro-500);
  border-radius: 2px;
}

/* ---------- PASSOS (numeração monoespaçada + filete, leitura de prancha) ---------- */
.bb-steps {
  display: grid;
  gap: 24px 20px;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  counter-reset: step;
}
.bb-step {
  counter-increment: step;
  border-top: 2px solid var(--bb-petro-500);
  padding-top: 18px;
}
.bb-step::before {
  content: "0" counter(step);
  display: block;
  font: 600 0.875rem/1 var(--bb-font-mono);
  letter-spacing: .04em;
  color: var(--bb-petro-600);
  margin-bottom: 14px;
}
.bb-step h3 { margin-bottom: 8px; }
.bb-step p { font-size: var(--bb-text-small); line-height: 1.6; }

/* ---------- FAQ (details/summary nativo) ---------- */
.bb-faq { max-width: 860px; margin-inline: auto; }
.bb-faq details { border-bottom: 1px solid var(--bb-paper-200); }
.bb-faq summary {
  font: 600 var(--bb-text-h3)/1.35 var(--bb-font-head);
  letter-spacing: -0.008em;
  color: var(--bb-ink-900);
  padding: 20px 44px 20px 0;
  cursor: pointer;
  list-style: none;
  position: relative;
}
.bb-faq summary::-webkit-details-marker { display: none; }
.bb-faq summary::after {
  content: "+";
  position: absolute; right: 4px; top: 50%;
  translate: 0 -50%;
  font: 400 1.6rem/1 var(--bb-font-mono);
  color: var(--bb-petro-600);
  transition: rotate .2s ease;
}
.bb-faq details[open] summary::after { rotate: 45deg; }
.bb-faq details[open] summary { color: var(--bb-petro-700); }
.bb-faq details p { padding: 0 0 22px; max-width: 68ch; }

/* ---------- TIME (cards de perfil dentro de .bb-grid-2) ---------- */
.bb-team__card { display: flex; flex-direction: column; align-items: flex-start; }
/* Foto: moldura sobre papel quente (regra de imagem do conceito) e canto de
   ficha técnica. 2 classes para vencer o max-width:100% do reset com folga. */
.bb .bb-author__photo {
  width: 100%;
  max-width: 160px;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  object-position: top;
  border-radius: var(--bb-radius);
  border: 1px solid var(--bb-paper-200);
  box-shadow: var(--bb-shadow-sm);
  margin-bottom: 20px;
}
.bb-team__role {
  margin-top: 6px;
  font: 600 var(--bb-text-small)/1.4 var(--bb-font-body);
  color: var(--bb-petro-600);
}
.bb-team__card .bb-btn--link { margin-top: auto; padding-top: 20px; }

/* ---------- CTA FINAL (superfície petróleo com brilho radial) ---------- */
.bb-cta-final {
  text-align: center;
  color: var(--bb-white);
  background:
    radial-gradient(44rem 26rem at 78% -22%, rgba(26,130,153,.36), transparent 62%),
    radial-gradient(34rem 22rem at 6% 118%, rgba(13,85,104,.5), transparent 60%),
    linear-gradient(160deg, var(--bb-petro-900) 0%, var(--bb-petro-950) 100%);
}
.bb-cta-final h2 { color: var(--bb-white); max-width: 24ch; margin-inline: auto; }
.bb-cta-final p { color: var(--bb-mist-200); max-width: 58ch; margin: 18px auto 0; }
.bb-cta-final .bb-btn { margin-top: 30px; }

/* ---------- FOOTER (petro-950) ---------- */
.bb-footer {
  background: var(--bb-petro-950);
  color: var(--bb-mist-400);
  padding-block: 34px;
  font-size: var(--bb-text-small);
  text-align: center;
}
.bb .bb-footer a { color: var(--bb-mist-200); }

/* ---------- UTILITIES ---------- */
.bb .bb-mt-2 { margin-top: 16px; }
.bb .bb-mt-3 { margin-top: 24px; }
.bb .bb-mt-4 { margin-top: 32px; }
.bb .bb-mt-6 { margin-top: 48px; }
.bb-center { text-align: center; }
.bb-narrow { max-width: 720px; margin-inline: auto; }

/* Reveal com scroll (progressive enhancement, só opacity/transform) */
@media (prefers-reduced-motion: no-preference) {
  @supports (animation-timeline: view()) {
    .bb-reveal {
      animation: bb-fade-up linear both;
      animation-timeline: view();
      animation-range: entry 0% entry 35%;
    }
    @keyframes bb-fade-up {
      from { opacity: 0; transform: translateY(24px); }
      to { opacity: 1; transform: none; }
    }
  }
}

/* ---------- FIX EXTERNO: AdSense Auto Ads ---------- */
/* Slot unfilled não pode reservar altura (vão branco no mobile). Esconder
   slot UNFILLED é permitido pelo Google; preenchido não pode ser escondido. */
ins.adsbygoogle[data-ad-status="unfilled"] { display: none !important; }