/* 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-01.css) ===== */
/* Família "Voyager" (mesmo template): bm-sales, bm-lp-01, vgr-voyager, vgranding02
   Palco: nav, hero, vitrine (lamp), "why", CTA final, rodapé. Conteúdo branco: destaque, coleções (#f2f2f2), sobre. */
:root { --blue: #fb222b; --blue-dark: #d9141d; --blue-light: #fb222b; --success: #fb222b; --gray-400: #b0b0b0; --gray-300: #b0b0b0; }
.footer-copy { color: var(--on-stage-muted); }
.hero-image-badge-val { color: var(--on-stage); }

nav { background: var(--stage); border-bottom-color: var(--stage-line); }
.nav-cta { background: var(--red); text-transform: none; letter-spacing: 0; font-size: 16px; font-weight: 600; border-radius: 6px; }
.nav-cta:hover { background: var(--red-hover); }

/* botões: Title Case, 600/16px, CTA vermelho */
.btn-primary { background: var(--red); color: var(--on-red); box-shadow: none; text-transform: none; letter-spacing: 0; font-size: 16px; font-weight: 600; border-radius: 6px; }
.btn-primary:hover { background: var(--red-hover); box-shadow: none; transform: none; }
.btn-ghost { font-size: 16px; color: var(--on-stage-soft); }
.hero-title .accent { color: var(--red); }
.hero-badge { color: var(--on-stage-soft); background: transparent; border-color: var(--stage-line); border-radius: 4px; }
.hero-badge::before { animation: none; }
.hero-image-badge { border-radius: 0; box-shadow: none; }
.hero-image-glow, .hero-bg { display: none; }

/* vitrine: sem fachos/orbes de luz (só o filete vermelho fica, como régua) */
.lamp-beams { height: 120px; transform: none; }
.lamp-beam-l, .lamp-beam-r, .lamp-glow-orb, .lamp-glow-inner, .lamp-blur-base { display: none; }
.lamp-line { box-shadow: none; filter: none; background: var(--red); width: 96px; }
.lamp-content { transform: none; }
.product-card:hover { transform: none; }

/* seções de conteúdo claras (variáveis do site mudam só dentro delas) */
.featured, #collections, .about {
  --gray-900: #ffffff; --gray-800: #f2f2f2; --gray-700: #ececec; --gray-600: #d9d8d9;
  --gray-400: #56606e; --gray-300: #56606e; --gray-200: #56606e; --white: #0a0a0a; --black: #ffffff;
  color: var(--ink);
}
.featured { background: var(--surface); }
#collections { background: var(--surface-sunken); }
.collection-card { background: var(--surface); border-color: var(--line); }
.collection-card:hover { transform: none; background: var(--surface); border-color: var(--ink); }
.collection-card:hover .coll-icon { transform: none; }
.coll-icon, .why-icon-wrap { background: transparent; }
.coll-icon::before { display: none; }
.coll-icon svg, .why-icon-wrap svg { filter: none; color: var(--red); }
.featured-corner { color: var(--on-red); background: var(--red); }
.featured .section-label, #collections .section-label, .about .section-label { color: var(--ink-muted); }
.spec-box { background: var(--surface); border-color: var(--line); }
.spec-val { color: var(--ink); }
.about { background: var(--surface); }
.about-title { color: var(--ink); }
.about-text { color: var(--ink-muted); }
.btn-white { background: var(--ink-fill); color: var(--on-ink-fill); text-transform: none; letter-spacing: 0; font-size: 16px; font-weight: 600; border-radius: 6px; }
.btn-white:hover { background: var(--ink-fill); opacity: .85; transform: none; }
.about-logo.pbg-logo { height: 50px !important; }

/* "why": palco, sem brilho */
.why-section::before { display: none; }
.why-card { background: var(--stage-raised); border-color: var(--stage-line); }
.why-card:hover { transform: none; border-color: var(--on-stage); }
.why-status::before { box-shadow: none; animation: none; }
.why-progress-fill { box-shadow: none; }
.why-pill { color: var(--on-stage); border-radius: 4px; }

/* CTA final e rodapé no palco */
.cta-final { background: var(--stage-raised); border-top-color: var(--stage-line); }
footer { background: var(--stage); border-top-color: var(--stage-line); }

/* rótulo branco sobre vermelho: mínimo 16px/600 (par oficial 3,9:1); link vermelho pequeno no claro vira ink */
.btn-primary, .nav-cta { font-size: 16px !important; }
.featured-corner { font-size: 16px; font-weight: 700; }
.coll-link { color: var(--ink); }
.why-section { padding-top: 96px; }

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

