/* Clássico Ridegood — reproduz o visual atual do ridegood.com.br (Wix):
   header preto, faixas pretas alternadas com branco, títulos largos em caixa alta
   (Lulo Clean no original → Syncopate aqui), corpo leve (Avenir → Nunito Sans),
   botões pílula branco/preto, tag vermelha "Lançamento". */
:root {
  --font-display: 'Syncopate', 'Arial Black', sans-serif;
  --font-body: 'Nunito Sans', 'Avenir', 'Helvetica Neue', sans-serif;
  --font-num: 'Syncopate', sans-serif;
  --bg: #ffffff; --bg-2: #f5f5f3; --fg: #000000; --fg-2: #5c574e; --line: #e6e6e2;
  --brand: #000000; --brand-fg: #ffffff; --accent: #ff4040;
  --dark: #000000; --dark-fg: #ffffff; --dark-fg-2: #a8a8a4;
  --radius: 4px; --radius-btn: 999px;
  --h1: clamp(30px, 4.6vw, 58px); --h2: clamp(22px, 2.8vw, 34px); --kicker-ls: .2em;
}
body { font-weight: 300; }
h1, h2, h3 { text-transform: uppercase; letter-spacing: .02em; line-height: 1.15; }
.card-title, .trust b, .dica h3, .chamado h2 { text-transform: none; font-family: var(--font-body); font-weight: 700; }
.kicker { font-weight: 700; color: var(--accent); }

/* header preto como no original */
.site-header { background: #000; color: #fff; border-bottom: 0; }
.menu a { font-weight: 700; font-size: 13px; letter-spacing: .06em; }
.menu a:hover, .menu a[aria-current] { background: rgba(255,255,255,.1); }
@media (max-width: 980px) { .menu { background: #000; } .menu a { border-color: rgba(255,255,255,.15); } }

/* hero: título branco, 1ª linha bold caixa alta, 2ª linha leve */
.hero { min-height: min(80vh, 720px); }
.hero::before { background: linear-gradient(180deg, rgba(0,0,0,.25), rgba(0,0,0,.1) 60%, rgba(0,0,0,.45)); }
.hero-l1 { font-weight: 700; letter-spacing: .14em; }
.hero-l2 { font-family: var(--font-body); font-weight: 300; text-transform: none; letter-spacing: .04em; font-size: .9em; }
.hero .lead { color: #fff; text-shadow: 0 1px 12px rgba(0,0,0,.7); font-weight: 400; }
.hero h1 { text-shadow: 0 2px 16px rgba(0,0,0,.45); }
.hero .btn-primary { background: #fff; color: #000; border-color: #fff; }
.hero .btn-ghost { color: #fff; }
@media (max-width: 560px) {
  :root { --h1: clamp(20px, 6.2vw, 28px); }
  .hero-l1 { letter-spacing: .06em; }
  .hero-l2 { font-size: 1.1em; }
}

/* faixa preta "A BIKE DAS BIKES" */
.sec-urban { background: #000; color: #fff; padding-top: var(--sec-y) !important; }
.sec-urban .sec-head { text-align: center; margin-inline: auto; }
.sec-urban .lead { color: #c9c9c4; margin-inline: auto; }
.sec-urban .card { background: #000; border-color: #2a2a2a; color: #fff; }
.sec-urban .card-img { background: #111; }
.sec-urban .card-stats span, .sec-urban .preco small, .sec-urban .card-resumo { color: #a8a8a4; }
.sec-urban .btn-sm { background: #fff; color: #000; }

/* destaques alternando branco / preto */
.spot .lead { max-width: 46ch; }
.spot:nth-of-type(odd) .spot-txt h2 { font-size: clamp(22px, 2.6vw, 32px); }
.spot .btn-primary { background: #000; color: #fff; }
.spot .btn-ghost { border-color: #000; }
.sec.spot-inv { background: #000; color: #fff; padding-bottom: var(--sec-y); }
.spot-inv .lead, .spot-inv .specs-inline span, .spot-inv .kicker { color: #c9c9c4; }
.spot-inv .btn-primary { background: #fff; color: #000; border-color: #fff; }
.spot-inv .btn-ghost { color: #fff; border-color: #fff; }
.spot-img img { border-radius: 0; }

/* grade de produtos: fundo branco, cards sem borda, preço em caixa alta */
.sec-lineup .sec-head { text-align: center; margin-inline: auto; }
.sec-lineup .card { border: 0; }
.sec-lineup .card-img { aspect-ratio: 1; background: #fff; }
.sec-lineup .card-img img { object-fit: contain; padding: 8%; }
.card-title { font-size: 15px; }
.preco b { font-size: 15px; letter-spacing: .02em; }
.btn-sm { background: #000; color: #fff; }
.btn-primary:hover { background: #222; }

.sec-trust li { border: 0; border-top: 2px solid #000; border-radius: 0; padding-inline: 0; }
.sec-seminovos { background: var(--bg-2); padding-top: var(--sec-y) !important; }
.sec-cta { background: #000; }
.sec-cta .btn-primary { background: #fff; color: #000; border-color: #fff; }

.page-head { background: #000; color: #fff; text-align: center; }
.page-head .lead { color: #c9c9c4; margin-inline: auto; }
.page-head .kicker { color: #ff4040; }
.pdp-info h1 { font-size: clamp(22px, 2.6vw, 34px); }
.pdp-preco b { font-size: 26px; }
.est { border-radius: 0; }
.site-footer { border-top: 1px solid #222; }