/* ============================================================
   Bet105 Marketing Page — consolidated stylesheet
   All rules scoped under .bet105-marketing-page so they cannot
   bleed into the host theme.
   ============================================================ */

/* ---- Design tokens ---------------------------------------- */
.bet105-marketing-page {
	--c-royal-blue-100: #eaf2fb;
	--c-royal-blue-500: #3083dc;
	--c-royal-blue-600: #2669b0;
	--c-black-200: #cccccc;
	--c-black-300: #b2b2b2;
	--c-black-400: #7f7f7f;
	--c-black-750: #262626;
	--c-black-800: #1a1a1a;
	--c-black-850: #111111;
	--c-black-900: #0a0a0a;
	--c-green-400: #7faa80;
	--c-red-400:   #e17f7f;

	--font-display: "General Sans", system-ui, -apple-system, sans-serif;
	--font-body:    "IBM Plex Sans", system-ui, -apple-system, sans-serif;

	--fs-xs:   0.761rem;
	--fs-sm:   0.876rem;
	--fs-base: 1.141rem;
	--fs-md:   1.256rem;
	--fs-lg:   1.5rem;
	--fs-xl:   2.281rem;
	--fs-2xl:  4.659rem;
	--fs-3xl:  5rem;
	--fs-4xl:  7.5rem;

	--sp-4:   0.25rem;
	--sp-8:   0.5rem;
	--sp-12:  0.75rem;
	--sp-16:  1rem;
	--sp-20:  1.25rem;
	--sp-24:  1.5rem;
	--sp-32:  2rem;
	--sp-48:  3rem;
	--sp-64:  4rem;
	--sp-80:  5rem;
	--sp-96:  6rem;
	--sp-100: 10rem;

	background-color: var(--c-black-800);
	color: var(--c-black-200);
	font-family: var(--font-body);
	font-size: var(--fs-lg);
	line-height: 1.5;
	overflow-x: hidden;        /* contain section bleed-out backgrounds */
}

.bet105-marketing-page * {
	box-sizing: border-box;
}

.bet105-marketing-page h1,
.bet105-marketing-page h2,
.bet105-marketing-page h3 {
	font-family: var(--font-display);
	font-weight: 700;
	color: var(--c-royal-blue-100);
	line-height: 1;
	margin: 0;
}

.bet105-marketing-page p {
	margin: 0;
}

.bet105-marketing-page a {
	color: var(--c-royal-blue-500);
	text-decoration: none;
}

.bet105-marketing-page a:hover {
	color: var(--c-royal-blue-600);
}

/* ---- Shared button --------------------------------------- */
.bet105-marketing-page .bet105-join-now {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 16px 20px;
	border-radius: var(--sp-12);
	font-family: var(--font-body);
	font-weight: 700;
	font-size: var(--fs-lg);
	line-height: 1;
	letter-spacing: -0.01em;
	text-decoration: none;
	transition: background-color 0.15s ease, color 0.15s ease, transform 0.05s ease;
	cursor: pointer;
	min-width: 214px;
	box-sizing: border-box;
}

.bet105-marketing-page .bet105-join-now:active {
	transform: translateY(1px);
}

.bet105-marketing-page .bet105-join-now--primary {
	background-color: var(--c-royal-blue-600);
	color: var(--c-royal-blue-100);
}

.bet105-marketing-page .bet105-join-now--primary:hover {
	background-color: var(--c-royal-blue-500);
	color: var(--c-royal-blue-100);
}

.bet105-marketing-page .bet105-join-now--secondary {
	background-color: var(--c-black-750);
	color: var(--c-black-200);
	font-weight: 400;
}

.bet105-marketing-page .bet105-join-now--secondary:hover {
	background-color: var(--c-black-800);
	color: var(--c-royal-blue-100);
}

.bet105-marketing-page .bet105-join-now--small {
	background-color: var(--c-royal-blue-500);
	color: var(--c-royal-blue-100);
	font-size: var(--fs-sm);
	padding: 13px 35px;
	min-width: 0;
	border-radius: 10px;
}

.bet105-marketing-page .bet105-join-now--small:hover {
	background-color: var(--c-royal-blue-600);
}

/* ---- Hero ------------------------------------------------- */
.bet105-marketing-page .bet105-hero {
	display: grid;
	grid-template-columns: 587px 429px;
	gap: 81px;
	align-items: center;
	max-width: 1097px;
	margin-inline: auto;
	padding-block: var(--sp-80);
	padding-inline: 0;
	position: relative;
	isolation: isolate;
}

/* The separate "Hero Package" section is desktop-hidden by default — only
   visible on mobile/tablet via the @media (max-width: 1097px) rule below.
   The inline .bet105-hero__panel inside .bet105-hero handles desktop. */
.bet105-marketing-page .bet105-hero-package {
	display: none;
}

/* Decorative competition-art bg — full viewport width via breakout technique.
   height: calc(100% + 120px) makes the bg fluidly match the hero's actual
   height (+ the 120px overshoot above the section). Avoids the panel
   overflowing past a fixed-height bg when the hero stacks at narrow tablet. */
.bet105-marketing-page .bet105-hero::before {
	content: "";
	position: absolute;
	left: 50%;
	top: -120px;
	transform: translateX(-50%);
	width: 100vw;
	height: calc(100% + 120px);
	background-image: url("../images/bg-competition.png");
	background-size: cover;
	background-position: center;
	opacity: 0.62;
	z-index: -1;
	pointer-events: none;
	box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
}

.bet105-marketing-page .bet105-hero__brand {
	display: inline-block;
	width: 87px;
	height: 21px;
	vertical-align: baseline;
	transform: translateY(2px);   /* nudges baseline alignment with body text */
}

.bet105-marketing-page .bet105-hero__content {
	display: flex;
	flex-direction: column;
	gap: var(--sp-32);
	max-width: 587px;
}

.bet105-marketing-page .bet105-hero__headline {
	font-size: var(--fs-3xl);
	letter-spacing: -0.01em;
	color: var(--c-royal-blue-100);
}

.bet105-marketing-page .bet105-hero__headline-line { display: block; }
.bet105-marketing-page .bet105-hero__headline-accent { color: var(--c-royal-blue-500); }

.bet105-marketing-page .bet105-hero__body {
	font-size: var(--fs-lg);
	color: var(--c-royal-blue-100);
	max-width: 504px;
	line-height: 1.3;
	text-shadow: 0px 4px 9.1px rgba(0, 0, 0, 0.51);
}

.bet105-marketing-page .bet105-hero__ctas {
	display: flex;
	gap: var(--sp-32);
	flex-wrap: wrap;
}

.bet105-marketing-page .bet105-hero__panel {
	background-color: rgba(17, 17, 17, 0.73);
	border-radius: 19px;
	padding: var(--sp-32);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	min-height: 538px;
	width: 100%;
	max-width: 429px;
}

.bet105-marketing-page .bet105-hero__panel-header {
	display: flex;
	gap: 28px;
	align-items: center;
	width: 100%;
	max-width: 361px;
	justify-content: space-between;
}

.bet105-marketing-page .bet105-hero__panel-eyebrow {
	font-size: var(--fs-lg);
	color: var(--c-black-300);
	line-height: 1.23;
	letter-spacing: -0.01em;
	flex: 1;
	max-width: 200px;

}

/* Inject "The " prefix on desktop + tablet so the eyebrow reads
   "The Ultimate Winners Package". Mobile overrides this to content: none
   below so the eyebrow reads just "Ultimate Winners Package". */
.bet105-marketing-page .bet105-hero__panel-eyebrow::before {
	content: "The ";
}

.bet105-marketing-page .bet105-hero__amount {
	font-family: var(--font-body);
	font-weight: 700;
	font-size: var(--fs-4xl);
	color: var(--c-royal-blue-100);
	line-height: 1;
	width: 100%;
	max-width: 361px;
}

.bet105-marketing-page .bet105-hero__amount-caption {
	font-size: var(--fs-md);
	color: var(--c-black-300);
	line-height: 1.74;
	width: 100%;
	max-width: 361px;
	text-align: right
}

.bet105-marketing-page .bet105-hero__rebates {
	display: grid;
	grid-template-columns: repeat(2, 176px);
	gap: 12px;
	margin-top: var(--sp-12);
}

.bet105-marketing-page .bet105-rebate {
	background-color: var(--c-black-900);
	border-radius: 9px;
	padding: 15px 25px;
	display: flex;
	flex-direction: column;
	gap: 5px;
	align-items: flex-start;
	justify-content: top;
	text-align: left;
	min-height: 125px;
}

.bet105-marketing-page .bet105-rebate__title  { font-weight: 700; font-size: var(--fs-base); color: var(--c-royal-blue-100); letter-spacing: -0.01em; line-height: 1; }
.bet105-marketing-page .bet105-rebate__day    { font-size: var(--fs-sm); color: var(--c-black-400); line-height: 1; }
.bet105-marketing-page .bet105-rebate__percent{ font-weight: 700; font-size: var(--fs-xl); color: var(--c-royal-blue-500); letter-spacing: -0.01em; line-height: 1; }
.bet105-marketing-page .bet105-rebate__caption{ font-size: var(--fs-sm); color: var(--c-black-300); line-height: 1; }

/* Description + per-card CTA: mobile-only — hidden on desktop and tablet. */
.bet105-marketing-page .bet105-rebate__description { display: none; }
.bet105-marketing-page .bet105-rebate__cta { display: none; }

/* ---- Value Prop ------------------------------------------ */
.bet105-marketing-page .bet105-value-prop {
	max-width: 1087px;
	margin-inline: auto;
	padding: var(--sp-100) 0;
	display: flex;
	flex-direction: column;
	gap: var(--sp-32);
}

.bet105-marketing-page .bet105-value-prop__copy {
	display: block;
}

.bet105-marketing-page .bet105-value-prop__heading {
	font-family: var(--font-display);
	font-weight: 700;
	font-size: 4rem;            /* 64px */
	letter-spacing: -0.01em;
	line-height: 1;
	max-width: 650px;
	color: var(--c-royal-blue-500);
	margin: 0;
}

.bet105-marketing-page .bet105-value-prop__heading-lead   { color: var(--c-royal-blue-100); }
.bet105-marketing-page .bet105-value-prop__heading-accent { color: var(--c-royal-blue-500); }

.bet105-marketing-page .bet105-value-prop__tagline {
	font-family: var(--font-body);
	font-size: 1.25rem;         /* 20px */
	color: var(--c-black-300);
	line-height: 1.15;
	letter-spacing: -0.01em;
}

.bet105-marketing-page .bet105-value-prop__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 22px;
	margin-top: var(--sp-32);
}

.bet105-marketing-page .bet105-value-prop__cell {
	background-color: var(--c-black-900);
	border-right: 1px solid var(--c-black-800);
	border-radius: 9px;
	padding: var(--sp-32);
	display: flex;
	flex-direction: column;
	gap: var(--sp-4);
	min-height: 284px;
}

.bet105-marketing-page .bet105-value-prop__cell--last { border-right: none; }

/* Infinite-carousel clones are injected by JS; hide them outside their carousel breakpoints. */
.bet105-marketing-page .bet105-value-prop__cell.is-clone { display: none; }
.bet105-marketing-page .bet105-hero-package .bet105-rebate.is-clone { display: none; }

.bet105-marketing-page .bet105-value-prop__cell-number {
	font-family: var(--font-body);
	font-size: --fs-sm;         
	color: var(--c-black-400);
	letter-spacing: -0.01em;
	line-height: 1;
}

.bet105-marketing-page .bet105-value-prop__cell-title {
	font-family: var(--font-body);
	font-weight: 700;
	font-size: 2.5rem;          /* 40px */
	color: var(--c-royal-blue-100);
	letter-spacing: -0.01em;
	line-height: 1;
	margin: 0;
}

.bet105-marketing-page .bet105-value-prop__cell-body {
	font-family: var(--font-body);
	font-size: 1.2rem;
	color: var(--c-black-300);
	letter-spacing: -0.01em;
}

/* Smooth in-page scroll, scoped to pages that contain the marketing template
   via :has() so it can't bleed into the rest of the host theme. */
:where(html):has(.bet105-marketing-page) {
	scroll-behavior: smooth;
}

/* ---- Entrance animations -------------------------------- */
/* Any element marked [data-animate] starts hidden + translated down, then
   animates into place when JS adds .is-visible. Staggers via
   [data-animate-delay="200"] (ms).
   Note: no `will-change` — it triggers iOS Safari compositing that can
   intercept touch events on child elements with overflow:auto. */
.bet105-marketing-page [data-animate] {
	opacity: 0;
	transform: translateY(24px);
	transition: opacity 0.6s cubic-bezier(0.22, 1, 0.36, 1),
	            transform 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}

.bet105-marketing-page [data-animate].is-visible {
	opacity: 1;
	transform: translateY(0);
}

.bet105-marketing-page [data-animate-delay="100"] { transition-delay: 100ms; }
.bet105-marketing-page [data-animate-delay="150"] { transition-delay: 150ms; }
.bet105-marketing-page [data-animate-delay="200"] { transition-delay: 200ms; }
.bet105-marketing-page [data-animate-delay="250"] { transition-delay: 250ms; }
.bet105-marketing-page [data-animate-delay="300"] { transition-delay: 300ms; }
.bet105-marketing-page [data-animate-delay="350"] { transition-delay: 350ms; }
.bet105-marketing-page [data-animate-delay="400"] { transition-delay: 400ms; }

@media (prefers-reduced-motion: reduce) {
	.bet105-marketing-page [data-animate],
	.bet105-marketing-page [data-animate].is-visible {
		opacity: 1;
		transform: none;
		transition: none;
	}
}

/* ---- Hover micro-interactions --------------------------- */
/* Buttons: lift + shadow on hover. */
.bet105-marketing-page .bet105-join-now {
	transition: background-color 0.15s ease, color 0.15s ease,
	            transform 0.15s ease, box-shadow 0.15s ease;
}

.bet105-marketing-page .bet105-join-now:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 20px rgba(48, 131, 220, 0.25);
}

.bet105-marketing-page .bet105-join-now:active {
	transform: translateY(0);
	box-shadow: 0 2px 6px rgba(48, 131, 220, 0.2);
}

/* Cards: subtle lift on hover. */
.bet105-marketing-page .bet105-value-prop__cell,
.bet105-marketing-page .bet105-rebate,
.bet105-marketing-page .bet105-winners__row,
.bet105-marketing-page .bet105-winners__mini,
.bet105-marketing-page .bet105-crypto__line {
	transition: transform 0.2s ease, background-color 0.2s ease;
}

.bet105-marketing-page .bet105-value-prop__cell:hover,
.bet105-marketing-page .bet105-rebate:hover,
.bet105-marketing-page .bet105-winners__row:hover,
.bet105-marketing-page .bet105-winners__mini:hover,
.bet105-marketing-page .bet105-crypto__line:hover {
	transform: translateY(-2px);
	background-color: var(--c-black-850);
}

@media (prefers-reduced-motion: reduce) {
	.bet105-marketing-page .bet105-join-now:hover,
	.bet105-marketing-page .bet105-value-prop__cell:hover,
	.bet105-marketing-page .bet105-rebate:hover,
	.bet105-marketing-page .bet105-winners__row:hover,
	.bet105-marketing-page .bet105-winners__mini:hover,
	.bet105-marketing-page .bet105-crypto__line:hover {
		transform: none;
		box-shadow: none;
	}
}

/* ---- Comparison Table ------------------------------------ */
.bet105-marketing-page .bet105-compare {
	max-width: 1094px;
	margin-inline: auto;
	padding: var(--sp-96) 0;
	position: relative;
	isolation: isolate;
	scroll-margin-top: var(--sp-80);  /* keeps target below any fixed host-theme header */
}

/* Full-viewport-width black-900 backdrop behind the comparison panel. */
.bet105-marketing-page .bet105-compare::before {
	content: "";
	position: absolute;
	left: 50%;
	top: 0;
	transform: translateX(-50%);
	width: 100vw;
	height: 100%;
	background-color: var(--c-black-900);
	z-index: -1;
	pointer-events: none;
}

.bet105-marketing-page .bet105-compare__title {
	font-size: var(--fs-3xl);
	letter-spacing: -0.01em;
	margin-bottom: var(--sp-32);
	text-align:center;
}

.bet105-marketing-page .bet105-compare__title-accent {
	color: var(--c-royal-blue-500);
}

/* Header row — borderless, transparent, bold text. Sits above the table. */
.bet105-marketing-page .bet105-compare__header {
	display: grid;
	grid-template-columns: 1.7fr 1fr 0.9fr;
	padding: 1px 16px 34px 11px;
	font-weight: 700;
	font-size: var(--fs-lg);
	letter-spacing: -0.01em;
	color: var(--c-royal-blue-100);
}

.bet105-marketing-page .bet105-compare__header-col { font-family: var(--font-body); }

.bet105-marketing-page .bet105-compare__header-logo {
	height: 24px;
	width: auto;
	display: inline-block;
	vertical-align: middle;
}

.bet105-marketing-page .bet105-compare__table {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border-radius: 9px;
}

.bet105-marketing-page .bet105-compare__row {
	display: grid;
	grid-template-columns: 1.7fr 1fr 0.9fr;
	gap: var(--sp-16);
	padding: var(--sp-16);
	align-items: center;
	font-size: var(--fs-lg);
	color: var(--c-royal-blue-100);
}

.bet105-marketing-page .bet105-compare__row:nth-child(odd)  { background-color: var(--c-black-850); }
.bet105-marketing-page .bet105-compare__row:nth-child(even) { background-color: var(--c-black-900); }

.bet105-marketing-page .bet105-compare__row--first {
	border-top-left-radius: 9px;
	border-top-right-radius: 9px;
	padding-top: 9px;
}

.bet105-marketing-page .bet105-compare__variable {
	font-family: var(--font-body);
	font-weight: 400;
	color: var(--c-royal-blue-100);
	letter-spacing: -0.01em;
}

.bet105-marketing-page .bet105-compare__variable-label--mobile { display: none; }

.bet105-marketing-page .bet105-compare__value {
	display: inline-flex;
	gap: 6px;
	align-items: center;
	color: var(--c-royal-blue-100);
}

.bet105-marketing-page .bet105-compare__value-text {
	font-family: var(--font-body);
	font-weight: 700;
	letter-spacing: -0.01em;
	white-space: nowrap;
}

.bet105-marketing-page .bet105-compare__value-text--muted {
	font-weight: 400;
	font-size: var(--fs-base);
}

.bet105-marketing-page .bet105-compare__icon {
	flex-shrink: 0;
}

.bet105-marketing-page .bet105-compare__cta {
	margin-top: var(--sp-64);
	display: flex;
	justify-content: center;
}

/* ---- Winners Package ------------------------------------- */
/* Outer section — hosts the full-viewport-width bg-competition art. */
.bet105-marketing-page .bet105-winners {
	position: relative;
	isolation: isolate;
	padding-block: var(--sp-100);
	overflow: hidden;
}

/* Bg-competition art — spans the full viewport behind the panel. */
.bet105-marketing-page .bet105-winners::before {
	content: "";
	position: absolute;
	inset: 0;
	background-image: url("../images/bg-competition.png");
	background-size: cover;
	background-position: center;
	opacity: 0.62;
	z-index: -1;
	pointer-events: none;
}


/* Inner panel — centered 1148px max, dark mask, holds the actual content. */
.bet105-marketing-page .bet105-winners__panel {
	max-width: 1148px;
	margin-inline: auto;
	padding: var(--sp-32) ;
	display: flex;
	gap: var(--sp-16);
	align-items: flex-start;
	background-color: rgba(10, 10, 10, 0.53);
	border-radius: 9px;
}


.bet105-marketing-page .bet105-winners__copy {
	display: flex;
	flex-direction: column;
	gap: 26px;
	width: 407px;
	flex-shrink: 0;
}

.bet105-marketing-page .bet105-winners__heading {
	font-family: var(--font-display);
	font-weight: 700;
	line-height: 1;
	letter-spacing: -0.01em;
	color: var(--c-royal-blue-500);
	margin: 0;
}

.bet105-marketing-page .bet105-winners__heading-lead {
	color: var(--c-royal-blue-100);
	font-size: 4rem;            /* 64px */
}

.bet105-marketing-page .bet105-winners__heading-amount {
	color: var(--c-royal-blue-100);
	font-size: 7.1875rem;       /* 115px */
}

.bet105-marketing-page .bet105-winners__heading-accent {
	color: var(--c-royal-blue-500);
	font-size: 4rem;            /* 64px */
}

.bet105-marketing-page .bet105-winners__heading-lead,
.bet105-marketing-page .bet105-winners__heading-amount,
.bet105-marketing-page .bet105-winners__heading-accent {
	display: inline;
}

.bet105-marketing-page .bet105-winners__body {
	font-size: var(--fs-md);
	color: var(--c-black-100);
	line-height: 1.1;
	letter-spacing: -0.01em;
	max-width: 352px;
}

.bet105-marketing-page .bet105-winners__table {
	display: flex;
	flex-direction: column;
	gap: 10px;
	flex: 1;
	min-width: 0;
}

.bet105-marketing-page .bet105-winners__row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--sp-24);
	background-color: var(--c-black-850);
	border-radius: 9px;
	padding: var(--sp-16);
	min-height: 87px;
}

.bet105-marketing-page .bet105-winners__row-info {
	display: flex;
	flex-direction: column;
	gap: 7px;
	min-width: 0;
}

.bet105-marketing-page .bet105-winners__row-label {
	font-family: var(--font-body);
	font-size: var(--fs-base);
	color: var(--c-black-300);
	letter-spacing: -0.01em;
	line-height: 1;
}

.bet105-marketing-page .bet105-winners__row-name {
	font-family: var(--font-body);
	font-weight: 700;
	font-size: 2rem;            /* 32px */
	color: var(--c-royal-blue-100);
	letter-spacing: -0.01em;
	line-height: 1;
}

.bet105-marketing-page .bet105-winners__row-rate {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	justify-content: center;
	gap: 3px;
	min-width: 117px;
	text-align: right;
}

.bet105-marketing-page .bet105-winners__row-percent {
	font-family: var(--font-body);
	font-weight: 700;
	font-size: 2.25rem;         /* 36px */
	color: var(--c-royal-blue-500);
	letter-spacing: -0.01em;
	line-height: 1;
}

.bet105-marketing-page .bet105-winners__row-caption {
	font-family: var(--font-body);
	font-size: var(--fs-base);
	color: var(--c-black-300);
	letter-spacing: -0.01em;
	line-height: 1;
}

.bet105-marketing-page .bet105-winners__mini-row {
	display: flex;
	gap: 26px;
	margin-top: 9px;
}

.bet105-marketing-page .bet105-winners__mini {
	background-color: var(--c-black-850);
	border-radius: 9px;
	padding: var(--sp-16);
	display: flex;
	flex-direction: column;
	gap: 7px;
	flex: 1;
	min-width: 0;
	min-height: 114px;
}

.bet105-marketing-page .bet105-winners__mini-label {
	font-family: var(--font-body);
	font-size: var(--fs-base);
	color: var(--c-black-300);
	letter-spacing: -0.01em;
	line-height: 1;
}

.bet105-marketing-page .bet105-winners__mini-percent {
	font-family: var(--font-body);
	font-weight: 700;
	font-size: 2.25rem;         /* 36px */
	color: var(--c-royal-blue-500);
	letter-spacing: -0.01em;
	line-height: 1;
}

.bet105-marketing-page .bet105-winners__mini-caption {
	font-family: var(--font-body);
	font-size: var(--fs-base);
	color: var(--c-black-300);
	letter-spacing: -0.01em;
	line-height: 1;
}

/* ---- Crypto Callout -------------------------------------- */
.bet105-marketing-page .bet105-crypto {
	max-width: 1099px;
	margin-inline: auto;
	padding: var(--sp-100) 0;
	display: grid;
	grid-template-columns: 1fr 319px;
	gap: 108px;
	align-items: center;
	position: relative;
	isolation: isolate;
}

/* Full-viewport-width black-900 backdrop behind the crypto callout. */
.bet105-marketing-page .bet105-crypto::before {
	content: "";
	position: absolute;
	left: 50%;
	top: 0;
	transform: translateX(-50%);
	width: 100vw;
	height: 100%;
	background-color: var(--c-black-900);
	z-index: -1;
	pointer-events: none;
}

.bet105-marketing-page .bet105-crypto__copy {
	display: flex;
	flex-direction: column;
	gap: 11px;
	max-width: 734px;
}

.bet105-marketing-page .bet105-crypto__heading {
	font-family: var(--font-display);
	font-weight: 700;
	font-size: 4rem;            /* 64px */
	letter-spacing: -0.01em;
	line-height: 1;
	color: var(--c-royal-blue-100);
	margin: 0;
	width:700px
}

.bet105-marketing-page .bet105-crypto__heading-lead   { color: var(--c-royal-blue-100); }
.bet105-marketing-page .bet105-crypto__heading-accent { color: var(--c-royal-blue-500); }
.bet105-marketing-page .bet105-crypto__heading--mobile  { display: none; }
.bet105-marketing-page .bet105-crypto__heading--desktop { display: inline; }

.bet105-marketing-page .bet105-crypto__body {
	font-family: var(--font-body);
	font-size: 1.5rem;          /* 24px */
	color: var(--c-black-300);
	letter-spacing: -0.01em;
	line-height: 1.2;
}

.bet105-marketing-page .bet105-crypto__lines {
	display: flex;
	flex-direction: column;
	gap: 0;
}

/* CTA only renders on mobile (Figma desktop has no crypto CTA). */
.bet105-marketing-page .bet105-crypto__cta {
	display: none;
}

.bet105-marketing-page .bet105-crypto__line {
	display: flex;
	gap: 12px;
	align-items: center;
	background-color: var(--c-black-900);
	border-radius: 9px;
	padding: 11px 8px;
	min-height: 64px;
}

.bet105-marketing-page .bet105-crypto__line + .bet105-crypto__line { margin-top: 0; }

.bet105-marketing-page .bet105-crypto__logo {
	width: 42px;
	height: 42px;
	flex-shrink: 0;
	display: block;
}

.bet105-marketing-page .bet105-crypto__line-text {
	display: flex;
	flex-direction: column;
	gap: 0;
	min-width: 0;
}

.bet105-marketing-page .bet105-crypto__line-name {
	font-family: var(--font-body);
	font-weight: 700;
	font-size: 1.25rem;         /* 20px */
	color: var(--c-royal-blue-100);
	letter-spacing: -0.01em;
	line-height: 1;
}

.bet105-marketing-page .bet105-crypto__line-caption {
	font-family: var(--font-body);
	font-size: 1rem;         /* 12px */
	color: var(--c-black-400);
	letter-spacing: -0.01em;
	line-height: 1;
	margin-top: 4px;
}

/* ---- Closing CTA ----------------------------------------- */
.bet105-marketing-page .bet105-closing {
	max-width: 1114px;
	margin-inline: auto;
	padding: var(--sp-96) var(--sp-32);
	display: grid;
	grid-template-columns: 1fr 1fr;
	align-items: center;
	gap: var(--sp-32);
}

/* Globe — left column */
.bet105-marketing-page .bet105-closing__globe {
	aspect-ratio: 1;
	width: 100%;
}

.bet105-marketing-page .bet105-closing__globe-canvas {
	width: 100%;
	height: 100%;
	display: block;
}

/* Content — right column: heading + CTA stacked */
.bet105-marketing-page .bet105-closing__content {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--sp-48);
}

.bet105-marketing-page .bet105-closing__heading {
	font-family: var(--font-display);
	font-weight: 700;
	font-size: 6rem;
	color: var(--c-royal-blue-100);
	letter-spacing: -0.01em;
	line-height: 1;
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: center;
	gap: 0.25em;
}

.bet105-marketing-page .bet105-closing__word { color: var(--c-royal-blue-100); }
.bet105-marketing-page .bet105-closing__accent { color: var(--c-royal-blue-500); }

.bet105-marketing-page .bet105-closing__logo {
	height: 0.75em;          /* scales with the 128px headline (~96px tall) */
	width: auto;
	display: inline-block;
	vertical-align: baseline;
}

/* ---- Responsive ------------------------------------------ */

/* Inline padding for sections whose max-widths + padding exceed viewport. */
@media (max-width: 1180px) {
	.bet105-marketing-page .bet105-winners { padding-inline: var(--sp-32); }
}

@media (max-width: 1161px) {
	.bet105-marketing-page .bet105-hero { padding-inline: var(--sp-32); }
}

/* Tablet hero scaling — the desktop 587px+429px grid is exactly 1097px wide
   plus 32px section padding each side = 1161px total. Below 1097px viewport
   (but still tablet, not mobile), shrink the grid columns so they fit.
   Min: hero panel stays at 429px (its visual minimum). Content column scales. */
@media (min-width: 601px) and (max-width: 1097px) {
	.bet105-marketing-page .bet105-hero {
		grid-template-columns: minmax(0, 1fr) minmax(0, 429px);
		gap: var(--sp-48);
	}
	.bet105-marketing-page .bet105-hero__content {
		max-width: 100%;
	}

	/* Value-prop: explicit 2×2 grid at tablet, centered on the section,
	   with shrunk title size so longer labels ("Reduced Juice", "Instant
	   Crypto") don't wrap awkwardly inside the narrower cells. */
	.bet105-marketing-page .bet105-value-prop__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: var(--sp-32);
		max-width: 700px;
		margin-inline: auto;
	}
	.bet105-marketing-page .bet105-value-prop__cell {
		text-align: center;
		min-height: 240px;
		padding: var(--sp-24);
	}
	.bet105-marketing-page .bet105-value-prop__cell-title {
		font-size: 2rem;          /* was 40px → 32px */
		line-height: 1.1;
	}
	.bet105-marketing-page .bet105-value-prop__cell-body {
		text-align: center;
	}

	/* Side padding for the three sections that would otherwise touch the
	   viewport edges at tablet widths. .bet105-compare in particular has
	   padding: var(--sp-96) 0 by default (no horizontal padding), so its
	   content sits flush against the screen edges below desktop width. */
	.bet105-marketing-page .bet105-compare,
	.bet105-marketing-page .bet105-value-prop,
	.bet105-marketing-page .bet105-crypto {
		padding-inline: var(--sp-32);
	}

	/* Comparison table: shrink row font so the Bet105 and Most Books column
	   values (e.g. "Low-No Rollover", "Rollover-heavy") fit on one line and
	   the columns stay vertically aligned with the header. */
	.bet105-marketing-page .bet105-compare__header,
	.bet105-marketing-page .bet105-compare__row {
		font-size: var(--fs-base);
	}
	.bet105-marketing-page .bet105-compare__value-text {
		font-size: var(--fs-base);
	}
	.bet105-marketing-page .bet105-compare__value-text--muted {
		font-size: var(--fs-sm);
	}
}

/* Narrow tablet (601-900px): stack the hero, winners, and crypto sections
   since their side-by-side layouts get too cramped at this width. */
@media (min-width: 601px) and (max-width: 900px) {
	.bet105-marketing-page .bet105-hero {
		grid-template-columns: 1fr;
		gap: var(--sp-48);
		justify-items: center;
	}
	.bet105-marketing-page .bet105-hero__panel {
		margin-inline: auto;
	}

	.bet105-marketing-page .bet105-winners__panel {
		flex-wrap: wrap;
	}
	.bet105-marketing-page .bet105-winners__copy,
	.bet105-marketing-page .bet105-winners__table {
		flex: 1 1 100%;
		max-width: 100%;
	}

	/* Crypto: stack the lines column below the copy at narrow tablet so the
	   five crypto/payment cards are visible (the fixed 319px column gets
	   squeezed off-screen otherwise). */
	.bet105-marketing-page .bet105-crypto {
		grid-template-columns: 1fr;
		gap: var(--sp-48);
	}
}

/* Mobile only: hero collapses to just its content. The inline panel is
   hidden; the separate .bet105-hero-package section takes over with its own
   full-viewport-width black-900 backdrop. Tablet keeps the desktop side-by-
   side layout. */
@media (max-width: 600px) {
	.bet105-marketing-page .bet105-hero {
		display: block;
	}
	.bet105-marketing-page .bet105-hero__content { max-width: 100%; }

	.bet105-marketing-page .bet105-hero > .bet105-hero__panel {
		display: none;
	}

	/* Hero-package: own full-viewport-width black-900 backdrop. */
	.bet105-marketing-page .bet105-hero-package {
		display: block;
		position: relative;
		isolation: isolate;
		padding-inline: var(--sp-32);
		padding-block: var(--sp-48);
	}

	.bet105-marketing-page .bet105-hero-package::before {
		content: "";
		position: absolute;
		left: 50%;
		top: 0;
		transform: translateX(-50%);
		width: 100vw;
		height: 100%;
		background-color: var(--c-black-900);
		z-index: -1;
		pointer-events: none;
	}

	/* Panel inside the package: deconstructed (no boxed bg), left-aligned.
	   Small gap so amount + eyebrow stack tightly as a single combined header
	   per Figma's "$2000 Ultimate Winners Package" text treatment. The rebates
	   below get their own larger margin-top for visual separation. */
	.bet105-marketing-page .bet105-hero-package .bet105-hero__panel {
		background-color: transparent;
		border-radius: 0;
		padding: 0;
		min-height: 0;
		max-width: 1097px;
		width: 100%;
		margin-inline: auto;
		gap: var(--sp-4);
	}

	/* Hide Activate button (Figma drops it on these viewports). */
	.bet105-marketing-page .bet105-hero-package .bet105-hero__panel-header .bet105-join-now--small {
		display: none;
	}

	/* Panel header + eyebrow + amount: all left-aligned. */
	.bet105-marketing-page .bet105-hero-package .bet105-hero__panel-header {
		max-width: none;
		justify-content: flex-start;
	}

	.bet105-marketing-page .bet105-hero-package .bet105-hero__panel-eyebrow {
		max-width: 290px;
		font-size: var(--fs-lg);
		line-height: 1.2;
		text-align: left;
		flex: none;
	}

	/* Drop the "The" prefix on mobile — eyebrow reads "Ultimate Winners
	   Package" (cleaner with the smaller $2000 above it). */
	.bet105-marketing-page .bet105-hero-package .bet105-hero__panel-eyebrow::before {
		content: none;
	}

	.bet105-marketing-page .bet105-hero-package .bet105-hero__amount {
		font-size: var(--fs-lg);   /* match eyebrow size: 24px */
		text-align: left;
		max-width: none;
		order: 1;
		line-height: 1.2;
	}

	.bet105-marketing-page .bet105-hero-package .bet105-hero__panel-header { order: 2; }
	.bet105-marketing-page .bet105-hero-package .bet105-hero__amount-caption { display: none; }
	.bet105-marketing-page .bet105-hero-package .bet105-hero__rebates { order: 3; }

	/* Rebates → horizontal scroll-snap carousel (auto-advance via JS).
	   width: 100% is critical — without it the element sizes to its content's
	   intrinsic width (4 cards × 70vw) and overflows the parent, leaving
	   nothing to scroll inside it. */
	.bet105-marketing-page .bet105-hero-package .bet105-hero__rebates {
		display: flex;
		grid-template-columns: none;
		gap: var(--sp-12);
		overflow-x: auto;
		overflow-y: hidden;
		scroll-snap-type: x mandatory;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
		padding-inline: 15vw;
		margin-inline: calc(var(--sp-32) * -1);
		margin-top: var(--sp-16);
		width: 100vw;
		overscroll-behavior-x: contain;
	}
	.bet105-marketing-page .bet105-hero-package .bet105-hero__rebates::-webkit-scrollbar {
		display: none;
	}

	/* Rebate cards use the value-prop section bg color (--c-black-800) so they
	   stand out against the hero-package's darker black-900 backdrop. */
	.bet105-marketing-page .bet105-hero-package .bet105-rebate {
		flex: 0 0 70vw;
		scroll-snap-align: center;
		scroll-snap-stop: always;
		background-color: var(--c-black-800);
		border-radius: 9px;
		padding: var(--sp-32);
		min-height: 284px;
		justify-content: center;
		align-items: center;
		text-align: center;
		gap: var(--sp-8);
	}
	.bet105-marketing-page .bet105-hero-package .bet105-rebate__title {
		font-size: var(--fs-lg);
		line-height: 1.2;
	}
	.bet105-marketing-page .bet105-hero-package .bet105-rebate__percent {
		font-size: 4rem;
		line-height: 1.39;
	}
	.bet105-marketing-page .bet105-hero-package .bet105-rebate__day,
	.bet105-marketing-page .bet105-hero-package .bet105-rebate__caption {
		display: none;
	}
	.bet105-marketing-page .bet105-hero-package .bet105-rebate__description {
		display: block;
		font-family: var(--font-body);
		font-size: 1rem;
		font-weight: 400;
		color: var(--c-black-300);
		letter-spacing: -0.01em;
		line-height: 1.2;
		max-width: 200px;
		margin: 0;
	}
	.bet105-marketing-page .bet105-hero-package .bet105-rebate__cta {
		display: inline-flex;
		margin-top: var(--sp-8);
		min-width: 0;
		padding: 10px 14px;
		font-size: var(--fs-base);
		background-color: var(--c-royal-blue-500);
	}
	.bet105-marketing-page .bet105-hero-package .bet105-rebate__cta:hover {
		background-color: var(--c-royal-blue-600);
	}
}

/* Tablet (601-900px): shrink sizes only, no layout changes. Keeps the
   desktop side-by-side layout but scales fonts down to fit. */
@media (max-width: 900px) {
	.bet105-marketing-page .bet105-value-prop__cell { border-right: none; }
	.bet105-marketing-page .bet105-closing__heading { font-size: 4.5rem; }
	.bet105-marketing-page .bet105-value-prop__heading,
	.bet105-marketing-page .bet105-crypto__heading { font-size: 3rem; }
	.bet105-marketing-page .bet105-hero__amount { font-size: 5rem; }
	.bet105-marketing-page .bet105-winners__heading-amount { font-size: 5.5rem; }
	.bet105-marketing-page .bet105-winners__heading-lead,
	.bet105-marketing-page .bet105-winners__heading-accent { font-size: 3rem; }
}

/* Phone landscape / small tablet — mobile restructure per Figma mobile design. */
@media (max-width: 600px) {
	/* Value-prop section: tighter top padding, side padding, smaller heading. */
	.bet105-marketing-page .bet105-value-prop {
		padding: var(--sp-96) var(--sp-24);
		gap: 25px;
	}
	.bet105-marketing-page .bet105-value-prop__heading {
		font-size: 2.25rem;
	}

	/* Show carousel clones inside their carousel breakpoints. */
	.bet105-marketing-page .bet105-value-prop__cell.is-clone { display: flex; }
	.bet105-marketing-page .bet105-hero-package .bet105-rebate.is-clone { display: flex; }

	/* Value-prop becomes a horizontal swipe carousel on mobile only. Tablet
	   keeps the desktop 4-column grid. */
	.bet105-marketing-page .bet105-value-prop__grid {
		display: flex;
		grid-template-columns: none;
		gap: var(--sp-16);
		overflow-x: auto;
		overflow-y: hidden;
		scroll-snap-type: x mandatory;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
		padding-inline: 15vw;
		width: 100vw;
		margin-inline: calc(var(--sp-24) * -1);
		margin-top: 0;
	}
	.bet105-marketing-page .bet105-value-prop__grid::-webkit-scrollbar {
		display: none;
	}
	.bet105-marketing-page .bet105-value-prop__cell {
		flex: 0 0 70vw;
		scroll-snap-align: center;
		scroll-snap-stop: always;
	}

	/* Crypto stacks single-column on mobile only. */
	.bet105-marketing-page .bet105-crypto {
		grid-template-columns: 1fr;
		gap: var(--sp-32);
		padding: var(--sp-96) var(--sp-24);
	}
	.bet105-marketing-page .bet105-crypto__copy { max-width: 100%; }
	.bet105-marketing-page .bet105-crypto__heading { width: auto; max-width: 100%; }
	.bet105-marketing-page .bet105-crypto__heading--desktop { display: none; }
	.bet105-marketing-page .bet105-crypto__heading--mobile  { display: inline; }
	.bet105-marketing-page .bet105-crypto__body { display: none; }
	.bet105-marketing-page .bet105-crypto__line-name { font-size: 1rem; }
	.bet105-marketing-page .bet105-crypto__lines { gap: var(--sp-8); }
	.bet105-marketing-page .bet105-crypto__line { background-color: rgba(10, 10, 10, 0.65); }

	/* Hero panel min-height removed on mobile (no longer needed for boxed look). */
	.bet105-marketing-page .bet105-hero__panel {
		min-height: 0;
	}

	/* Hero headline shrinks for very narrow mobile. */
	.bet105-marketing-page .bet105-hero__headline {
		font-size: 3.5rem;
	}

	/* Mirror value-prop's mobile sizing on the hero rebates. */
	.bet105-marketing-page .bet105-hero-package .bet105-rebate { flex: 0 0 85vw; }
	.bet105-marketing-page .bet105-hero-package .bet105-hero__rebates { padding-inline: 7.5vw; }

	/* Flip Comparison before Value Prop on mobile via CSS Grid.
	   Why grid instead of flex column: same `grid-row` ordering, but
	   `grid-template-columns: minmax(0, 1fr)` clamps the COLUMN width.
	   IMPORTANT: minmax(0, 1fr) only constrains the column track — grid
	   ITEMS still default to `min-width: auto` and can grow to their
	   intrinsic content size. We must explicitly set min-width: 0 at every
	   level of the flex/grid chain that wraps a horizontal-overflow carousel,
	   otherwise the carousel's content forces ancestors wide and the swipe
	   only reaches the first couple of cells. */
	.bet105-marketing-page {
		display: grid;
		grid-template-columns: minmax(0, 1fr);
	}
	.bet105-marketing-page > * {
		min-width: 0;
	}
	.bet105-marketing-page .bet105-value-prop__grid,
	.bet105-marketing-page .bet105-hero-package .bet105-hero__panel,
	.bet105-marketing-page .bet105-hero-package .bet105-hero__rebates {
		min-width: 0;
	}
	.bet105-marketing-page .bet105-hero          { grid-row: 1; }
	.bet105-marketing-page .bet105-hero-package  { grid-row: 2; }
	.bet105-marketing-page .bet105-compare       { grid-row: 3; }
	.bet105-marketing-page .bet105-value-prop    { grid-row: 4; }
	.bet105-marketing-page .bet105-winners       { grid-row: 5; }
	.bet105-marketing-page .bet105-crypto        { grid-row: 6; }
	.bet105-marketing-page .bet105-closing       { grid-row: 7; }

	/* Winners Package hidden on mobile — its content lives in .bet105-hero-package. */
	.bet105-marketing-page .bet105-winners {
		display: none;
	}
	.bet105-marketing-page .bet105-compare__header,
	.bet105-marketing-page .bet105-compare__row {
		grid-template-columns: 1.4fr 1fr 1fr;
		gap: var(--sp-12);
		font-size: var(--fs-sm);
	}
	.bet105-marketing-page .bet105-compare__value-text { white-space: normal; }

	/* Same compact size for both columns on mobile so values stay aligned. */
	.bet105-marketing-page .bet105-compare__value-text,
	.bet105-marketing-page .bet105-compare__value-text--muted {
		font-size: var(--fs-s);
	}

	/* Shrink the bet105 logo in the header so it doesn't crowd the
	   "Most Books" column on narrow screens. */
	.bet105-marketing-page .bet105-compare__header-logo {
		height: 16px;
	}

	/* Hide the "Variable" header label on mobile per Figma (the column still
	   occupies space; only the text is invisible). */
	.bet105-marketing-page .bet105-compare__header-col--variable {
		visibility: hidden;
	}

	/* Swap each row's variable label to its short mobile version. */
	.bet105-marketing-page .bet105-compare__variable-label--desktop { display: none; }
	.bet105-marketing-page .bet105-compare__variable-label--mobile  { display: inline; }

	/* Tighter mobile rows — Figma shows rows at ~25px tall with compact
	   padding and small (12×12) check/cross icons. */
	.bet105-marketing-page .bet105-compare__header {
		padding: 1px var(--sp-12) var(--sp-16);
	}
	.bet105-marketing-page .bet105-compare__row {
		padding: var(--sp-8) var(--sp-12);
		opacity: 0.8;
		border-radius: 9px;
	}
	/* Add a small gap between rows on mobile so they read as separate cards. */
	.bet105-marketing-page .bet105-compare__table {
		gap: var(--sp-8);
		overflow: visible;
	}
	.bet105-marketing-page .bet105-compare__icon {
		width: 12px;
		height: 12px;
	}
	.bet105-marketing-page .bet105-compare__value {
		gap: 4px;
	}

	/* Hide the Join Now CTA below the comparison table on mobile. */
	.bet105-marketing-page .bet105-compare__cta {
		display: none;
	}

	/* Side padding so the comparison panel doesn't touch the screen edges. */
	.bet105-marketing-page .bet105-compare {
		padding-inline: var(--sp-24);
	}

	/* Mobile heading sizes per Figma — compare title + crypto heading both 36px,
	   hero headline bumps up to 64px to match the design (was 44px).
	   Compare title left-aligned (was centered on desktop). */
	.bet105-marketing-page .bet105-compare__title {
		font-size: 2.25rem;
		text-align: left;
	}
	.bet105-marketing-page .bet105-crypto__heading { font-size: 2.25rem; }
	.bet105-marketing-page .bet105-hero__headline { font-size: 4rem; }
	.bet105-marketing-page .bet105-closing__heading { font-size: 3rem; }

	/* Closing: single column, globe on top at reduced size */
	.bet105-marketing-page .bet105-closing {
		grid-template-columns: 1fr;
		gap: var(--sp-32);
	}
	.bet105-marketing-page .bet105-closing__globe {
		width: 60vw;
		max-width: 280px;
		margin-inline: auto;
	}
	.bet105-marketing-page .bet105-closing__content {
		align-items: center;
		text-align: center;
	}
	.bet105-marketing-page .bet105-closing__heading {
		justify-content: center;
	}

	/* Crypto Callout: CTA visible on mobile only (Figma adds it).
	   Sized to match the hero section's compact primary CTA (107×37 per Figma). */
	.bet105-marketing-page .bet105-crypto__cta {
		display: inline-flex;
		align-self: center;
		justify-self: center;
		margin-top: var(--sp-32);
		min-width: 0;
		width: 107px;
		padding: 10px 14px;
		font-size: var(--fs-base);
	}

	/* Hero on mobile is content-only (panel is in .bet105-hero-package below). */
	.bet105-marketing-page .bet105-hero__content {
		align-items: center;
		text-align: center;
		gap: var(--sp-24);
	}
	.bet105-marketing-page .bet105-hero__headline {
		text-align: center;
	}
	.bet105-marketing-page .bet105-hero__body {
		font-size: 1rem;                  /* 16px */
		line-height: 1.2;
		text-align: center;
		max-width: 290px;
		text-shadow: none;
	}
	/* Scale the inline bet105 logo down to fit the smaller mobile body text. */
	.bet105-marketing-page .bet105-hero__brand {
		width: 56px;
		height: auto;
		transform: translateY(1px);
	}
	.bet105-marketing-page .bet105-hero__ctas {
		justify-content: center;
	}

	/* ---- Hero secondary CTA removed on mobile ---- */
	.bet105-marketing-page .bet105-hero__ctas .bet105-join-now--secondary {
		display: none;
	}

	/* Compact primary CTA per Figma (107×37). */
	.bet105-marketing-page .bet105-hero__ctas .bet105-join-now--primary {
		min-width: 0;
		width: 107px;
		padding: 10px 14px;
		font-size: var(--fs-base);
	}

	/* ---- Hero panel becomes its own "Ultimate Winners Package" carousel section ---- */
	.bet105-marketing-page .bet105-hero__panel {
		background-color: transparent;
		border-radius: 0;
		padding: 0;
		min-height: 0;
		max-width: none;
		width: 100%;
		gap: var(--sp-24);
		align-items: center;
	}

	.bet105-marketing-page .bet105-hero__panel-header .bet105-join-now--small {
		display: none;
	}

	.bet105-marketing-page .bet105-hero__panel-header {
		max-width: none;
		justify-content: center;
	}

	/* "$2000 Ultimate Winners Package" reads as a single combined section header.
	   Order: amount on top, eyebrow below. Both centered, similar visual weight. */
	.bet105-marketing-page .bet105-hero__panel-header {
		order: 2;
	}
	.bet105-marketing-page .bet105-hero__amount {
		order: 1;
		font-size: 3rem;
		text-align: center;
		max-width: none;
	}
	.bet105-marketing-page .bet105-hero__amount-caption { display: none; }
	.bet105-marketing-page .bet105-hero__rebates { order: 3; }

	.bet105-marketing-page .bet105-hero__panel-eyebrow {
		max-width: 290px;
		font-size: var(--fs-lg);
		line-height: 1.2;
		text-align: center;
		flex: none;
	}

	/* ---- Hero rebates → horizontal scroll-snap carousel ---- */
	.bet105-marketing-page .bet105-hero__rebates {
		display: flex;
		grid-template-columns: none;
		gap: var(--sp-12);
		overflow-x: auto;
		overflow-y: hidden;
		scroll-snap-type: x mandatory;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
		padding-inline: 15vw;
		margin-inline: calc(var(--sp-32) * -1);
		margin-top: var(--sp-16);
	}
	.bet105-marketing-page .bet105-hero__rebates::-webkit-scrollbar {
		display: none;
	}

	/* Each rebate card per Figma: 278px wide, 317px tall, 46px vertical padding,
	   centered content with title / large % / description / Join Now button. */
	.bet105-marketing-page .bet105-rebate {
		flex: 0 0 70vw;
		scroll-snap-align: center;
		scroll-snap-stop: always;
		min-height: 317px;
		padding: 46px var(--sp-24);
		justify-content: center;
		align-items: center;
		text-align: center;
		gap: var(--sp-8);
		border-radius: 15px;
	}
	.bet105-marketing-page .bet105-rebate__title {
		font-size: var(--fs-lg);          /* 24px */
		line-height: 1.2;
	}
	.bet105-marketing-page .bet105-rebate__percent {
		font-size: 4rem;                  /* 64px */
		line-height: 1.39;
	}

	/* Hide desktop-only day + short caption, show mobile description. */
	.bet105-marketing-page .bet105-rebate__day,
	.bet105-marketing-page .bet105-rebate__caption {
		display: none;
	}
	.bet105-marketing-page .bet105-rebate__description {
		display: block;
		font-family: var(--font-body);
		font-size: 1rem;                  /* 16px */
		font-weight: 400;
		color: var(--c-black-300);
		letter-spacing: -0.01em;
		line-height: 1.2;
		max-width: 200px;
		margin: 0;
	}

	/* Per-card Join Now button. */
	.bet105-marketing-page .bet105-rebate__cta {
		display: inline-flex;
		margin-top: var(--sp-8);
		min-width: 0;
		padding: 10px 14px;
		font-size: var(--fs-base);
		background-color: var(--c-royal-blue-500);
	}
	.bet105-marketing-page .bet105-rebate__cta:hover {
		background-color: var(--c-royal-blue-600);
	}

	/* ---- Comparison + Crypto: swap solid black-900 backdrop for comp bg ---- */
	.bet105-marketing-page .bet105-compare::before,
	.bet105-marketing-page .bet105-crypto::before {
		background-color: transparent;
		background-image: url("../images/bg-competition.png");
		background-size: cover;
		background-position: center;
		opacity: 0.62;
	}

	/* Mobile: drop the 100vw breakout for the crypto bg — it gets offset when
	   the host theme wraps the page in a padded container. Pin to the section. */
	.bet105-marketing-page .bet105-crypto::before {
		left: 0;
		right: 0;
		width: auto;
		transform: none;
	}

	/* ---- Winners Package: table becomes the same horizontal carousel as hero rebates ---- */
	.bet105-marketing-page .bet105-winners__panel {
		flex-direction: column;
		padding: var(--sp-24);
	}

	.bet105-marketing-page .bet105-winners__copy {
		width: 100%;
	}

	.bet105-marketing-page .bet105-winners__table {
		display: flex;
		flex-direction: row;
		gap: var(--sp-12);
		overflow-x: auto;
		overflow-y: hidden;
		scroll-snap-type: x mandatory;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
		padding-inline: 15vw;
		margin-inline: calc(var(--sp-32) * -1);
		max-width: none;
		width: auto;
		flex: 0 0 auto;
	}
	.bet105-marketing-page .bet105-winners__table::-webkit-scrollbar {
		display: none;
	}

	/* Each main rebate row → vertical carousel card */
	.bet105-marketing-page .bet105-winners__row {
		flex: 0 0 70vw;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		text-align: center;
		scroll-snap-align: center;
		scroll-snap-stop: always;
		min-height: 220px;
		padding: var(--sp-24);
		gap: var(--sp-12);
	}
	.bet105-marketing-page .bet105-winners__row-info {
		align-items: center;
		text-align: center;
	}
	.bet105-marketing-page .bet105-winners__row-rate {
		align-items: center;
		text-align: center;
		min-width: 0;
	}

	/* Mini-row → its own carousel card holding the two minis side by side */
	.bet105-marketing-page .bet105-winners__mini-row {
		flex: 0 0 70vw;
		flex-direction: column;
		gap: var(--sp-12);
		scroll-snap-align: center;
		scroll-snap-stop: always;
		margin-top: 0;
	}
	.bet105-marketing-page .bet105-winners__mini {
		min-height: 0;
		align-items: center;
		text-align: center;
		padding: var(--sp-16);
	}
}

/* Phone portrait — smallest target. Stack everything, shrink type. */
@media (max-width: 480px) {
	.bet105-marketing-page .bet105-hero__headline { font-size: 4rem; }
	.bet105-marketing-page .bet105-hero__amount { font-size: 3rem; }
	.bet105-marketing-page .bet105-hero__panel-eyebrow { font-size: var(--fs-md); }
	.bet105-marketing-page .bet105-winners__heading-amount { font-size: 4rem; }
	.bet105-marketing-page .bet105-winners__heading-lead,
	.bet105-marketing-page .bet105-winners__heading-accent { font-size: 2.25rem; }
	/* Winners row alignment handled by the carousel rules at <=600px. */
	.bet105-marketing-page .bet105-closing__heading { font-size: 2.25rem; }
	.bet105-marketing-page .bet105-closing__logo { height: 0.65em; }
}