/* Pro Beauty Gear — theme.css
   Carregado DEPOIS do CSS de cada site. Base: tokens.css (mesma pasta).
   Regras do guia: uma família (Montserrat), títulos em caixa alta, vermelho com intenção,
   quase tudo reto, sem sombra em card, sem animação de entrada, transições de 150ms. */

/* ---------- tipografia ---------- */
html, body { font-family: var(--font-sans); }
body { -webkit-font-smoothing: antialiased; }
body p { font-size: 15px; line-height: 24px; }
button, input, select, textarea, optgroup { font-family: inherit; }

h1, h2 { text-transform: uppercase; font-weight: 800; letter-spacing: -0.005em; font-family: var(--font-sans); }
h3, h4 { font-weight: 700; font-family: var(--font-sans); }
h1 em, h2 em, h1 i, h2 i { font-style: normal; color: var(--red); }

/* eyebrows: caixa alta, .28em, régua vermelha 24x2 antes do texto */
[class*="eyebrow"], [class*="kicker"], [class*="overline"], [class*="pretitle"], [class*="pre-title"],
[class*="section-label"], [class*="section-tag"], [class*="subtitle-tag"] {
  text-transform: uppercase;
  letter-spacing: .28em !important;
  font-weight: 500;
  background-image: linear-gradient(var(--red), var(--red)) !important;
  background-repeat: no-repeat !important;
  background-size: 24px 2px !important;
  background-position: left center !important;
  padding-left: 36px !important;
}
/* eyebrow centralizado: encolhe para o texto, assim a régua fica colada nele */
[class*="eyebrow"].center, [class*="eyebrow"][style*="justify-content: center"], [class*="eyebrow"][style*="justify-content:center"],
[class*="cta-final"] :is([class*="eyebrow"], [class*="section-label"], [class*="kicker"]),
:is(.center, .text-center, [class*="lamp-content"]) > :is([class*="eyebrow"], [class*="section-label"], [class*="kicker"]) {
  display: table !important; margin-left: auto !important; margin-right: auto !important;
}
/* a régua do guia substitui o enfeite antigo do eyebrow */
[class*="eyebrow"]::before, [class*="kicker"]::before, [class*="overline"]::before { display: none !important; }

/* botões: 600 / 16px */
button, .btn, [class*="btn-"], [class*="-btn"], [class^="btn"], [class*="button"], [class*="cta-btn"], [class*="nav-cta"] {
  font-weight: 600;
  font-family: var(--font-sans);
}
.btn, [class^="btn-"], [class*=" btn-"], [class*="button"]:not(div):not(section) { font-size: 16px; }

/* ---------- forma ---------- */
img, picture, video, iframe { border-radius: 0 !important; }

/* ---------- movimento: sem entrada, só 150ms ---------- */
.reveal, [class*="reveal"], .fade-in, .fade-up, .fade-in-up, .animate-on-scroll, .anim, .aos-init, [data-aos],
.slide-up, .slide-in, .will-animate, .in-view, .is-visible, .visible, [class*="fadeIn"], [class*="fade-"] {
  opacity: 1 !important;
  transform: none !important;
  animation: none !important;
  filter: none;
}
*, *::before, *::after { transition-duration: 150ms !important; transition-delay: 0s !important; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }

/* ---------- foco de teclado ---------- */
:focus-visible { outline: none !important; box-shadow: var(--focus-ring) !important; }
header :focus-visible, nav :focus-visible, footer :focus-visible,
[class*="hero"] :focus-visible, [class*="stage"] :focus-visible, [class*="dark"] :focus-visible { box-shadow: var(--focus-ring-stage) !important; }

/* ---------- logo ---------- */
img.pbg-logo { height: 50px !important; width: auto !important; max-width: none !important; max-height: none !important; object-fit: contain; padding: 0 !important; filter: none !important; box-shadow: none !important; background: none !important; }
@media (max-width: 760px) { img.pbg-logo { height: 36px !important; } }

/* ---------- loja nova (pbg-config.js) ---------- */
a[data-shop]:not([href]) { display: none !important; }
/* alternativa sem loja: some quando o link da loja ao lado já estiver ativo */
a[data-shop][href] ~ .pbg-noshop { display: none !important; }

/* ---------- seleção ---------- */
::selection { background: var(--red); color: var(--on-red); }

/* sites "bundler": a faixa de erro de depuração (ex.: chat tawk.to bloqueado por CORS) não aparece para o visitante */
#__bundler_err { display: none !important; }

/* único brilho permitido é --glow-red (em CTA): títulos sem brilho/sombra */
h1, h2, h1 *, h2 * { text-shadow: none !important; }

/* ===== ajustes manuais deste site (_ferramentas/overrides/bm-lp-cadeira.css) ===== */
/* bm-lp-cadeira — página React (JSX). A marca do header/rodapé é texto "BARBERMAXX" + emblema no JSX:
   aqui ela é coberta visualmente pelo logo PBG (o texto continua no HTML para leitores de tela). */
.brand-mark {
  background: url("logos/pbg-logo-horizontal-on-dark.png") left center / contain no-repeat;
  width: 238px; height: 50px; gap: 0;
}
.brand-mark > * { visibility: hidden; }
.footer-brand .brand-mark { font-size: 0; }
@media (max-width: 760px) { .brand-mark { width: 171px; height: 36px; } }
/* cinza secundário (#505353 -> #313131) some no preto: usa on-stage-muted */
:root { --bm-graphite: #b0b0b0; --fg-3: #b0b0b0; }
.btn, [class*="btn--"] { text-transform: none; letter-spacing: 0; font-size: 16px; font-weight: 600; border-radius: 6px; }

/* ===== contraste medido (_ferramentas/overrides/bm-lp-cadeira.auto.css) ===== */
/* gerado por pbg-contrast.mjs: cor do texto ajustada para contraste >= 4,5:1 (3:1 em texto grande) */