/* ============================================================
   ladbible.css — faithful clean recreation of a ladbible.com article
   Real brand facts from their own CSS: Druk display faces (Anton is
   the condensed-heavy stand-in), almost-black #111, watermelon red
   #f24149 / tangerine #ed3900 accents. Logo is their real SVG.
   ============================================================ */
body.ladbible {
  --brand: #f24149;            /* LADbible watermelon red (--color-watermelon-red) */
  --brand-ink: #ffffff;
  --paper: #ffffff;
  --ink: #111111;              /* --color-almost-black */
  --muted: #6b7076;
  --rule: #e9eaec;
  --lb-display: "Anton", "Archivo Black", sans-serif;
  font-family: "Archivo", system-ui, sans-serif;
  font-size: 17.5px;
  line-height: 1.65;
  color: var(--ink);
}

/* ---- header ---- */
.lb-top {
  max-width: 1240px; margin: 0 auto;
  display: flex; align-items: center; gap: 28px;
  padding: 14px 28px;
  border-bottom: 1px solid var(--rule);
}
.lb-logo { display: block; flex: none; }
.lb-logo img { display: block; height: 34px; width: auto; }
.lb-nav { display: flex; align-items: center; gap: 24px; overflow-x: auto; scrollbar-width: none; }
.lb-nav::-webkit-scrollbar { display: none; }
.lb-nav a {
  text-decoration: none; color: var(--ink); white-space: nowrap;
  font-weight: 600; font-size: 15px;
}
.lb-nav a:hover, .lb-nav a.active { color: var(--brand); }
.lb-spacer { flex: 1; }
.lb-search, .lb-burger { width: 22px; height: 22px; color: var(--ink); flex: none; }

/* ---- article ---- */
.lb-main { max-width: 780px; margin: 0 auto; padding: 30px 24px 80px; }
.lb-tag { margin: 0 0 14px; }
.lb-tag a {
  display: inline-block; text-decoration: none;
  background: var(--brand); color: #fff;
  font-weight: 700; font-size: 12.5px; letter-spacing: .04em; text-transform: uppercase;
  padding: 6px 12px; border-radius: 999px;
}
.lb-h1 {
  font-family: var(--lb-display); font-weight: 400;
  font-size: clamp(34px, 5vw, 52px); line-height: 1.06; letter-spacing: .005em;
  margin: 0 0 14px; color: var(--ink);
  text-transform: none;
}
.lb-stand { margin: 0 0 22px; font-size: 19px; line-height: 1.5; color: #4a4f55; font-weight: 500; }

.lb-byline { display: flex; align-items: center; gap: 13px; padding: 14px 0; border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); margin: 0 0 22px; }
.lb-avatar { width: 44px; height: 44px; border-radius: 50%; overflow: hidden; flex: none; }
.lb-byline .who b { display: block; font-weight: 700; font-size: 15px; }
.lb-byline .who span { display: block; font-size: 12.5px; color: var(--muted); }
.lb-share { display: flex; gap: 9px; }
.lb-share i {
  width: 34px; height: 34px; border-radius: 50%;
  background: var(--ink); color: #fff;
  display: inline-flex; align-items: center; justify-content: center;
}
.lb-share i:hover { background: var(--brand); }
.lb-share svg { width: 16px; height: 16px; }

.lb-hero { margin: 0 0 8px; }
.lb-hero img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; object-position: 45% 42%; background: #dfe6ee; border-radius: 6px; }
.lb-hero figcaption { padding: 9px 2px 0; font-size: 12.5px; color: var(--muted); line-height: 1.45; }
.lb-hero .credit { color: #9aa0a6; white-space: nowrap; }

/* ---- body ---- */
.lb-body { padding-top: 14px; }
.lb-body p { margin: 0 0 20px; }
.lb-body p.lead { font-weight: 500; font-size: 19px; }
.lb-body .xhead {
  font-family: var(--lb-display); font-weight: 400;
  font-size: 27px; line-height: 1.15; letter-spacing: .005em; margin: 30px 0 14px;
}
.lb-pull {
  margin: 28px 0; padding: 4px 0 4px 20px; border-left: 4px solid var(--brand);
  font-weight: 700; font-size: 21px; line-height: 1.4; color: var(--ink);
}

/* ---- rewarded gate, skinned to LADbible's design system ---- */
body.ladbible .gate-eyebrow { color: var(--brand); font-family: "Archivo", sans-serif; font-size: 12.5px; font-weight: 800; letter-spacing: .1em; }
body.ladbible .reward-locker { border-radius: 12px; }
body.ladbible .reward-locker .lock-badge { display: none; }
body.ladbible .reward-locker h3 {
  font-family: var(--lb-display); font-weight: 400;
  font-size: clamp(26px, 3.4vw, 34px); line-height: 1.08; letter-spacing: .005em;
  color: var(--ink); margin: 2px 0 10px;
}
body.ladbible .reward-locker p { font-family: "Archivo", sans-serif; font-size: 15px; line-height: 1.55; color: #4a4f55; max-width: none; margin: 0 0 22px; }
body.ladbible .rv-cta {
  background: var(--brand); color: #fff; border-radius: 999px;
  padding: 16px 26px; font-family: "Archivo", sans-serif;
  font-weight: 700; font-size: 15px; letter-spacing: .01em;
  box-shadow: none;
}
body.ladbible .rv-cta:hover { background: #e3313a; filter: none; transform: none; }
body.ladbible .rv-cta svg { display: none; }
body.ladbible .rv-later { font-family: "Archivo", sans-serif; color: #4a4f55; font-weight: 600; font-size: 13.5px; }
body.ladbible .reward-locker .rv-foot { display: none; }
body.ladbible .lk-side h4 { font-family: "Archivo", sans-serif; text-transform: uppercase; letter-spacing: .08em; font-size: 12px; font-weight: 800; color: var(--ink); }
body.ladbible .lk-side li { font-family: "Archivo", sans-serif; font-size: 15px; color: var(--ink); }
body.ladbible .lk-side li svg { color: var(--brand); }
body.ladbible .gate-fine { font-family: "Archivo", sans-serif; color: #8a9096; font-size: 12.5px; }
body.ladbible .rv-floating .txt, body.ladbible .rv-floating button { font-family: "Archivo", sans-serif; }
body.ladbible .rv-floating button { background: var(--brand); color: #fff; border-radius: 999px; font-weight: 700; }

/* ---- responsive ---- */
@media (max-width: 860px) {
  .lb-nav { display: none; }
}