/* ==========================================================================
   Responsible gambling handbook — "bailrbet-responsible-gambling" (1440) /
   "bailrbet-responsible-gambling-mobile" (390)
   ========================================================================== */

/* Intro ------------------------------------------------------------------ */
.rg-intro { background: var(--navy); }
.rg-hero__left { display: flex; flex-direction: column; gap: 16px; padding: 32px 16px; }
.rg-kicker { display: flex; align-items: center; gap: 6px; font-family: var(--font-display); font-weight: 800; font-size: 12px; line-height: 14px; text-transform: uppercase; }
.rg-kicker__a { color: var(--blue); }
.rg-kicker__b { color: var(--yellow); }
.rg-title { font-family: var(--font-display); font-weight: 900; font-size: 40px; line-height: 42px; text-transform: uppercase; color: var(--white); }
.rg-lead { font-size: 14px; line-height: 22px; color: var(--ink-4); }
.rg-quick { display: flex; flex-direction: column; gap: 14px; padding: 19px; background: var(--navy-2); border: 1px solid var(--line); }
.rg-quick__title { font-family: var(--font-display); font-weight: 800; font-size: 16px; line-height: 19px; text-transform: uppercase; color: var(--yellow); }
.rg-quick__list { display: flex; flex-direction: column; gap: 10px; }
.rg-quick__link { display: block; font-size: 13px; line-height: 17px; font-weight: 600; color: var(--white); transition: color var(--t); }
.rg-quick__link::before { content: '• '; }
.rg-quick__link:hover { color: var(--yellow); }
.rg-tools { padding: 16px; }
.rg-tools__title { display: none; }
.rg-tools__row { gap: 8px; margin: 0 -16px; padding: 0 16px; }
.rg-pill { display: inline-flex; align-items: center; height: 30px; padding: 0 11px; border-radius: 4px; border: 1px solid transparent; font-size: 11px; line-height: 14px; font-weight: 700; color: var(--white); white-space: nowrap; transition: background-color var(--t), border-color var(--t), transform var(--t); }
.rg-pill:hover { transform: translateY(-1px); }
.rg-pill--blue { background: var(--blue); }
.rg-pill--blue:hover { background: #1a5bff; }
.rg-pill--outline { border-color: var(--line); }
.rg-pill--outline:hover { border-color: var(--blue); }
.rg-pill--yellow { background: var(--yellow); color: var(--navy); }
.rg-pill--desktop { display: none; }
@media (min-width: 1024px) {
  .rg-intro { background: var(--navy-3); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 63px 0; }
  .rg-intro__inner { width: min(var(--content), 100% - 2 * var(--gutter)); margin-inline: auto; display: flex; flex-direction: column; gap: 48px; }
  .rg-hero { display: flex; align-items: flex-start; gap: 48px; }
  .rg-hero__left { flex: 1 1 0; min-width: 0; padding: 0; }
  .rg-kicker { gap: 8px; font-size: 14px; line-height: 17px; }
  .rg-title { font-size: 56px; line-height: 67px; }
  .rg-lead { font-size: 16px; line-height: 26px; }
  .rg-quick { flex: 0 0 420px; gap: 16px; padding: 23px; border-radius: 8px; }
  .rg-quick__title { font-size: 18px; line-height: 22px; }
  .rg-tools { display: flex; flex-direction: column; gap: 12px; padding: 19px; background: var(--navy-2); border: 1px solid var(--blue); border-radius: 6px; }
  .rg-tools__title { display: block; font-family: var(--font-display); font-weight: 800; font-size: 14px; line-height: 17px; color: var(--yellow); }
  .rg-tools__row { gap: 16px; margin: 0; padding: 0; overflow: visible; }
  .rg-pill { height: 36px; padding: 0 15px; font-size: 12px; line-height: 16px; }
  .rg-pill--desktop { display: inline-flex; }
}

/* Reading layout -------------------------------------------------------- */
.rg-body { background: var(--white); color: var(--legal-ink); }
.rg-body__inner { display: flex; flex-direction: column; }
.rg-rail--left { display: none; }
.rg-content { display: flex; flex-direction: column; }
.rg-rail--right { order: -1; }
.rg-side { display: flex; flex-direction: column; gap: 16px; padding: 19px; background: var(--navy-2); border: 1px solid var(--line); color: var(--ink-4); }
.rg-help { display: flex; flex-direction: column; gap: 10px; padding-bottom: 15px; border-bottom: 1px solid var(--line); }
.rg-help__title { font-family: var(--font-display); font-weight: 800; font-size: 18px; line-height: 22px; text-transform: uppercase; color: var(--yellow); }
.rg-help__text { font-size: 13px; line-height: 17px; }
.rg-help__phone { display: block; font-family: var(--font-display); font-weight: 900; font-size: 32px; line-height: 38px; color: var(--white); padding-bottom: 9px; border-bottom: 1px solid var(--line); transition: color var(--t); }
.rg-help__phone:hover { color: var(--yellow); }
.rg-help__note { font-size: 12px; line-height: 18px; }
.rg-betstop { display: flex; flex-direction: column; gap: 10px; align-items: flex-start; }
.rg-betstop__badge { display: inline-flex; padding: 2px 6px; border-radius: 2px; background: var(--blue); color: var(--white); font-family: var(--font-display); font-weight: 800; font-size: 10px; line-height: 12px; text-transform: uppercase; }
.rg-betstop__title { font-size: 13px; line-height: 17px; font-weight: 700; color: var(--white); }
.rg-betstop__text { font-size: 12px; line-height: 18px; }
.rg-betstop__link { font-size: 12px; line-height: 16px; font-weight: 700; color: var(--yellow); transition: opacity var(--t); }
.rg-betstop__link:hover { text-decoration: underline; }
@media (min-width: 1024px) {
  .rg-body__inner { width: min(var(--content), 100% - 2 * var(--gutter)); margin-inline: auto; flex-direction: row; align-items: flex-start; gap: 32px; padding: 48px 0; }
  .rg-rail--left { display: block; flex: 0 0 260px; }
  .rg-content { flex: 0 0 680px; gap: 40px; }
  .rg-rail--right { order: 0; flex: 1 1 auto; min-width: 0; }
  .rg-side { gap: 24px; padding: 0; background: transparent; border: 0; }
  .rg-help { gap: 16px; padding: 19px; border: 1px solid var(--blue); border-radius: 8px; background: var(--navy-2); }
  .rg-help__title { font-size: 20px; line-height: 24px; }
  .rg-help__phone { font-size: 28px; line-height: 34px; padding-bottom: 15px; }
  .rg-help__note { line-height: 16px; }
  .rg-betstop { gap: 12px; padding: 19px; border: 1px solid var(--line-light); border-radius: 8px; background: var(--cream); color: var(--legal-ink); }
  .rg-betstop__badge { padding: 4px 8px; border-radius: 4px; font-size: 12px; line-height: 14px; }
  .rg-betstop__title { color: var(--ink); }
  .rg-betstop__link { color: var(--blue); }
}

/* Table of contents (desktop) ------------------------------------------- */
@media (min-width: 1024px) {
  .rg-toc { display: flex; flex-direction: column; gap: 16px; padding: 19px; background: var(--cream); border: 1px solid var(--line-light); border-radius: 8px; }
  .rg-toc__title { font-family: var(--font-display); font-weight: 800; font-size: 20px; line-height: 24px; color: var(--navy); }
  .rg-toc__list { display: flex; flex-direction: column; gap: 12px; }
  .rg-toc__link { display: block; font-size: 12px; line-height: 16px; color: var(--legal-ink); }
  .rg-toc__link:hover { color: var(--blue); }
  .rg-toc__link.is-active { color: var(--blue); font-weight: 700; }
}

/* Chapters -------------------------------------------------------------- */
.rg-chapter { display: flex; flex-direction: column; gap: 14px; padding: 20px; }
.rg-chapter--m-cream { background: var(--cream); }
.rg-chapter--m-white { background: var(--white); }
.rg-chapter--m-dark { gap: 20px; padding: 19px 20px; background: var(--navy); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); color: var(--ink-4); }
.rg-chapter__title { display: flex; flex-direction: column; gap: 6px; padding-bottom: 5px; border-bottom: 1px solid var(--line-light); font-family: var(--font-display); }
.rg-chapter__num { font-weight: 800; font-size: 14px; line-height: 17px; color: var(--blue); }
.rg-chapter__heading { font-weight: 900; font-size: 22px; line-height: 26px; text-transform: uppercase; color: var(--navy); }
.rg-chapter--m-dark .rg-chapter__title { border-color: var(--line); }
.rg-chapter--m-dark .rg-chapter__num { color: var(--yellow); }
.rg-chapter--m-dark .rg-chapter__heading { color: var(--white); }
.rg-p { font-size: 13px; line-height: 20px; }
.rg-p--lead, .rg-p--lead-bold { font-size: 14px; line-height: 22px; }
.rg-p--lead-bold { font-weight: 700; }
.rg-p--note, .rg-p--note-blue { font-size: 13px; line-height: 17px; font-weight: 700; color: var(--blue); }
.rg-p--m-blue { color: var(--blue); }
.rg-p--m-blue-bold { color: var(--blue); font-weight: 700; }
.rg-sub { font-family: var(--font-display); font-weight: 800; font-size: 16px; line-height: 19px; text-transform: uppercase; color: var(--blue); }
.rg-list { display: flex; flex-direction: column; gap: var(--gap-m, 10px); }
.rg-list__item { position: relative; padding-left: 16px; font-size: 14px; line-height: 20px; }
.rg-list__item::before { content: ''; position: absolute; left: 0; top: 3px; width: 6px; height: 6px; border-radius: 50%; background: var(--blue); }
.rg-list__num { font-weight: 400; }
.rg-list--questions .rg-list__item { padding-left: 0; }
.rg-list--questions .rg-list__item::before { display: none; }
.rg-check { position: relative; display: block; padding-left: 16px; }
.rg-check::before { content: ''; position: absolute; left: 0; top: 3px; width: 6px; height: 6px; border-radius: 50%; background: var(--blue); }
.rg-assess__hint { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.rg-tool { display: flex; flex-direction: column; gap: 6px; }
.rg-tool__title { font-family: var(--font-display); font-weight: 800; font-size: 16px; line-height: 19px; text-transform: uppercase; color: var(--blue); }
.rg-tool__text { font-size: 13px; line-height: 20px; }
.rg-hotline { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 23px; text-align: center; background: var(--navy-2); border: 1px solid var(--line); border-radius: 6px; }
.rg-hotline__title { font-family: var(--font-display); font-weight: 800; font-size: 18px; line-height: 22px; text-transform: uppercase; color: var(--white); }
.rg-hotline__phone { font-family: var(--font-display); font-weight: 900; font-size: 36px; line-height: 43px; color: var(--yellow); transition: opacity var(--t); }
.rg-hotline__phone:hover { opacity: .85; }
.rg-hotline__note { font-size: 12px; line-height: 16px; color: var(--ink-4); }
@media (min-width: 1024px) {
  .rg-chapter, .rg-chapter--m-dark { gap: var(--ch-gap, 16px); padding: 32px; background: transparent; border: 0; color: var(--legal-ink); }
  .rg-chapter--cream { background: var(--cream); border-radius: 8px; }
  .rg-chapter__title { display: block; padding: 0; border: 0; }
  .rg-chapter__num { display: none; }
  .rg-chapter__heading, .rg-chapter--m-dark .rg-chapter__heading { font-weight: 800; font-size: 28px; line-height: 34px; color: var(--navy); }
  .rg-p { font-size: 14px; line-height: 22px; }
  .rg-p--lead, .rg-p--lead-bold { font-size: 15px; line-height: 24px; }
  .rg-p--note { font-size: 14px; line-height: 18px; color: var(--legal-ink); }
  .rg-p--note-blue { font-size: 14px; line-height: 18px; }
  .rg-p--m-blue, .rg-p--m-blue-bold { color: var(--legal-ink); font-weight: 400; }
  .rg-sub { font-weight: 700; font-size: 18px; line-height: 22px; text-transform: none; color: var(--navy); }
  .rg-list { gap: var(--gap, 10px); }
  .rg-list__item { padding-left: 0; }
  .rg-list__item::before { content: '• '; position: static; width: auto; height: auto; border-radius: 0; background: none; }
  .rg-list--tight .rg-list__item { line-height: 18px; }
  .rg-list--numbered .rg-list__item::before { content: none; }
  .rg-list__num { font-weight: 700; }
  .rg-check { padding-left: 0; }
  .rg-check::before { content: '• '; position: static; width: auto; height: auto; border-radius: 0; background: none; }
  .rg-tool { gap: 8px; }
  .rg-tool__title { font-size: 18px; line-height: 22px; }
  .rg-tool__text { font-size: 14px; line-height: 22px; }
  .rg-hotline { align-items: flex-start; gap: 10px; text-align: left; background: var(--white); border-color: var(--line-light); }
  .rg-hotline__title { font-size: 20px; line-height: 24px; color: var(--navy); }
  .rg-hotline__phone { color: var(--blue); }
  .rg-hotline__note { font-size: 13px; line-height: 17px; color: var(--legal-ink); }
}

/* Narrow desktop (1024–1279px): the 260 / 680 / rail columns only fit at 1280+.
   The content column flexes and the help/BetStop rail moves under it as two side-by-side cards. */
@media (min-width: 1024px) and (max-width: 1279px) {
  .rg-hero { gap: 32px; }
  .rg-quick { flex-basis: 340px; }
  .rg-body__inner { flex-wrap: wrap; gap: 32px; }
  .rg-rail--left { flex-basis: 220px; }
  .rg-content { flex: 1 1 0; min-width: 0; }
  .rg-rail--right { flex: 1 1 100%; order: 3; }
  .rg-side { position: static; flex-direction: row; align-items: stretch; }
  .rg-side > * { flex: 1 1 0; min-width: 0; }
}