/* ===== BetStop ===== */

/* Hero */
.bs-hero { padding: 80px 0; border-bottom: 1px solid var(--c-line); }
.bs-hero__inner { display: flex; flex-direction: column; gap: 32px; }
.bs-hero__head { display: flex; flex-direction: column; gap: 8px; }
.bs-hero__title .display__line { font-size: 96px; line-height: 90px; letter-spacing: -2px; }
.bs-hero__sub { font: 700 36px/42px var(--f-osw); color: var(--c-paper); }
.bs-hero__accent { color: var(--c-orange); }
.bs-hero__text { font: 400 18px/26px var(--f-plex); color: var(--c-gray); }
.bs-hero__cta-group { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.bs-hero__cta { height: 52px; padding: 0 32px; }
.bs-hero__note { font: 400 12px/var(--lh-plex) var(--f-plex); color: var(--c-gray); }

/* One registration, three clear outcomes */
.bs-outcomes { background: var(--c-paper); color: var(--c-ink); padding: 80px 0; }
.bs-outcomes__inner { display: flex; flex-direction: column; gap: 48px; }
.bs-outcomes__title { display: flex; flex-direction: column; gap: 4px; font: 700 48px/var(--lh-osw) var(--f-osw); color: var(--c-ink); }
.bs-outcomes__title-line { display: block; }
.bs-outcomes__title-line--accent { color: var(--c-orange); }
.bs-outcomes__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
.bs-outcomes__item { display: flex; min-width: 0; }
.bs-card { flex: 1; background: #fff; border: 1px solid var(--c-ink); padding: 24px; display: flex; flex-direction: column; align-items: flex-start; gap: 16px; transition: transform var(--t-med) var(--ease-out), box-shadow var(--t-med) var(--ease-out); }
.bs-card:hover { transform: translateY(-3px); box-shadow: 0 18px 32px -20px rgba(17, 16, 21, .45); }
.bs-card__num { font: 700 48px/var(--lh-osw) var(--f-osw); color: var(--c-orange); }
.bs-card__title { align-self: stretch; font: 700 18px/var(--lh-osw) var(--f-osw); color: var(--c-ink); }
.bs-card__text { align-self: stretch; font: 400 14px/22px var(--f-plex); color: var(--c-gray); }
.bs-card__link { font-size: 14px; letter-spacing: 0; }

/* A real break from wagering */
.bs-break { background: var(--c-bg); border-bottom: 1px solid var(--c-line); padding: 80px 0; }
.bs-break__inner { display: flex; align-items: flex-start; gap: 48px; }
.bs-break__left { width: 400px; flex: none; display: flex; flex-direction: column; gap: 24px; }
.bs-break__title { font: 700 40px/var(--lh-osw) var(--f-osw); color: #fff; }
.bs-break__title-mobile { display: none; }
.bs-break__text { font: 400 14px/22px var(--f-plex); color: var(--c-gray); }
.bs-break__cta { align-self: flex-start; letter-spacing: 0; }
.bs-break__right { flex: 1; min-width: 0; }
.bs-articles { background: rgba(255, 255, 255, .04); border: 2px solid var(--c-line); padding: 32px; display: flex; flex-direction: column; gap: 24px; }
.bs-articles__block { display: flex; flex-direction: column; gap: 8px; }
.bs-articles__title { font: 700 16px/var(--lh-osw) var(--f-osw); color: #fff; }
.bs-articles__text { font: 400 14px/22px var(--f-plex); color: var(--c-gray); }
.bs-articles__rule { height: 1px; background: var(--c-line); margin: 0; }
.bs-articles__highlight { border-left: 1px solid var(--c-orange); padding: 4px 0 4px 16px; font: 500 15px/22px var(--f-plex); color: #fff; }

@media (max-width: 1099px) {
  .bs-hero { padding: 64px 0; }
  .bs-hero__title .display__line { font-size: 72px; line-height: 68px; letter-spacing: -1.5px; }
  .bs-hero__sub { font-size: 30px; line-height: 36px; }
  .bs-outcomes { padding: 64px 0; }
  .bs-outcomes__title { font-size: 40px; }
  .bs-outcomes__grid { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 24px; }
  .bs-break { padding: 64px 0; }
  .bs-break__inner { flex-direction: column; gap: 40px; }
  .bs-break__left, .bs-break__right { width: 100%; }
}

@media (max-width: 767px) {
  .bs-hero { padding: 56px 0 48px; border-bottom: 0; }
  .bs-hero__inner { gap: 24px; }
  .bs-hero__head { gap: 12px; }
  .bs-hero__title .display__line { font-size: 48px; line-height: 52px; letter-spacing: 0; }
  .bs-hero__sub { font-size: 28px; line-height: 34px; }
  .bs-hero__text { font-size: 16px; line-height: 24px; }
  .bs-hero__cta-group { align-items: stretch; }
  .bs-hero__cta { width: 100%; padding: 0 24px; font-size: 14px; color: #000; }
  .bs-hero__note { line-height: 18px; }

  .bs-outcomes { padding: 48px 0; }
  .bs-outcomes__inner { gap: 32px; }
  .bs-outcomes__title { font-size: 30px; line-height: 36px; }
  .bs-outcomes__grid { grid-template-columns: 1fr; gap: 10px; }
  .bs-card:hover { transform: none; box-shadow: none; }
  .bs-card__num { font-size: 36px; }
  .bs-card__title { font-size: 16px; }
  .bs-card__text { color: var(--c-gray-2); }
  .bs-card__link { font-size: 13px; }

  .bs-break { background: var(--c-surface); border-bottom: 0; padding: 48px 0; }
  .bs-break__inner { gap: 24px; }
  .bs-break__title { font-size: 30px; line-height: 36px; color: var(--c-paper); }
  .bs-break__title-full { display: none; }
  .bs-break__title-mobile { display: flex; flex-direction: column; gap: 2px; }
  .bs-break__cta { align-self: stretch; height: 52px; letter-spacing: 1px; color: #fff; }
  .bs-articles { background: none; border: 0; padding: 0; gap: 0; }
  .bs-articles__rule { display: none; }
  .bs-articles__block { padding: 16px 0; border-bottom: 1px solid var(--c-line); }
  .bs-articles__title { font-size: 14px; }
  .bs-articles__text { font-size: 13px; line-height: 20px; }
  .bs-articles__highlight { margin-top: 24px; font-size: 14px; line-height: 20px; color: var(--c-paper); }
}