/**
 * BIGBAT58 — Global responsive layout system
 *
 * Shared across every template. Loaded last so page landings cannot keep
 * desktop two-column layouts on mobile.
 *
 * Breakpoints: 390 · 430 · 768 · 1024 · 1440
 */

:root {
	--bb58-bp-mobile: 390px;
	--bb58-bp-mobile-lg: 430px;
	--bb58-bp-tablet: 768px;
	--bb58-bp-laptop: 1024px;
	--bb58-bp-desktop: 1440px;
	--bb58-readable-size: 1.0625rem; /* 17px */
	--bb58-readable-lh: 1.7;
	--bb58-stack-gap: 1.25rem;
	--bb58-card-gap: 0.85rem;
}

/* -------------------------------------------------------------------------
   Global readability
   ------------------------------------------------------------------------- */

body {
	font-size: var(--bb58-readable-size);
	line-height: var(--bb58-readable-lh);
}

.bb58-container,
.bb58-home-section__inner,
[class*="-landing__inner"],
[class*="-landing-section"],
.bb58-seo-flow__inner,
.bb58-gd {
	min-width: 0;
}

h1,
h2,
h3,
h4,
h5,
h6,
[class*="__heading"],
[class*="__title"],
.bb58-section__heading {
	overflow-wrap: normal;
	word-break: normal;
	hyphens: manual;
	white-space: normal;
	max-width: 100%;
}

p,
.bb58-seo-flow__body,
[class*="__copy"] p,
[class*="__intro"],
[class*="__description"],
[class*="__text"],
[class*="__excerpt"] {
	max-width: 100%;
	overflow-wrap: break-word;
	word-break: normal;
	hyphens: none;
}

/* -------------------------------------------------------------------------
   Shared card grid rhythm (equal height shells already in cards-shared.css)
   ------------------------------------------------------------------------- */

.bb58-home-categories__grid,
.bb58-home-features__grid,
.bb58-home-trust-security__grid,
.bb58-home-responsible__grid,
.bb58-home-games__grid,
.bb58-home-providers__grid,
.bb58-home-promotions__grid,
.bb58-home-guides__grid,
.bb58-home-news__grid,
.bb58-premium-benefits__grid,
.bb58-promotions-grid,
.bb58-providers-grid,
.bb58-games-grid,
.bb58-experience__features,
[class*="-landing-benefits__grid"],
[class*="-landing-commission__cards"],
[class*="-landing-why__highlights"],
[class*="-landing-features__grid"],
[class*="-landing-stats__grid"],
[class*="-landing-cards__grid"],
.bb58-home-categories__seo-grid {
	display: grid;
	gap: var(--bb58-card-gap);
	align-items: stretch;
	grid-template-columns: minmax(0, 1fr);
}

.bb58-home-categories__grid > *,
.bb58-home-features__grid > *,
.bb58-home-providers__grid > *,
.bb58-home-promotions__grid > *,
.bb58-home-games__grid > *,
.bb58-providers-grid > *,
.bb58-games-grid > *,
.bb58-promotions-grid > *,
.bb58-premium-benefits__grid > *,
.bb58-experience__features > *,
[class*="-landing-benefits__grid"] > *,
[class*="-landing-features__grid"] > *,
[class*="-landing-commission__cards"] > *,
[class*="-landing-why__highlights"] > * {
	min-width: 0;
	height: 100%;
}

/* Category tiles — near-square, never tall/narrow columns */
.bb58-home-category__link {
	aspect-ratio: 1 / 1.05;
	width: 100%;
	box-sizing: border-box;
}

.bb58-home-category__title,
.bb58-home-category__cta,
.bb58-home-category__count {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 100%;
}

.bb58-home-category__blurb {
	white-space: normal;
	overflow-wrap: break-word;
	word-break: normal;
}

/* -------------------------------------------------------------------------
   Mobile ≤767px — ALWAYS stack text above visuals/cards
   ------------------------------------------------------------------------- */

@media (max-width: 767.98px) {
	body {
		font-size: 1rem; /* 16px floor on small phones */
		line-height: var(--bb58-readable-lh);
	}

	/* Two-column → single column (landings, SEO flow, archives) */
	[class*="-landing-split__grid"],
	[class*="-landing-split--reverse"] [class*="-landing-split__grid"],
	[class*="-landing-faq__layout"],
	[class*="-landing-mission__grid"],
	[class*="-landing-support__split"],
	[class*="-landing-why__layout"],
	[class*="-landing-community__layout"],
	[class*="-landing-community__split"],
	[class*="-landing-tech__split"],
	[class*="-landing-jackpots__layout"],
	[class*="-landing-jackpots__banner"],
	.bb58-seo-flow__inner,
	.bb58-seo-flow--visual-left .bb58-seo-flow__inner,
	.bb58-seo-flow--visual-right .bb58-seo-flow__inner,
	.bb58-about-landing-mission__grid,
	.bb58-contact-landing-support__split,
	.bb58-contact-landing-why__layout,
	.bb58-gd-hero__layout,
	.bb58-gd-specs__grid {
		display: grid !important;
		grid-template-columns: minmax(0, 1fr) !important;
		gap: var(--bb58-stack-gap) !important;
		align-items: stretch !important;
	}

	/* Copy first, cards/visual second — never side-by-side */
	[class*="-landing-split__copy"],
	.bb58-seo-flow__content,
	.bb58-gd-hero__panel {
		order: 0 !important;
		width: 100% !important;
		max-width: none !important;
		min-width: 0 !important;
	}

	[class*="-landing-split__figure"],
	[class*="-landing-split__media"],
	[class*="-landing-split__aside"],
	.bb58-seo-flow__visual,
	.bb58-gd-hero__cover {
		order: 1 !important;
		width: 100% !important;
		max-width: none !important;
		min-width: 0 !important;
	}

	.bb58-seo-flow--visual-left .bb58-seo-flow__content,
	.bb58-seo-flow--visual-left .bb58-seo-flow__visual,
	.bb58-seo-flow--visual-right .bb58-seo-flow__content,
	.bb58-seo-flow--visual-right .bb58-seo-flow__visual {
		order: initial !important;
	}

	.bb58-seo-flow__content {
		order: 0 !important;
	}

	.bb58-seo-flow__visual {
		order: 1 !important;
	}

	/* Kill narrow text columns */
	[class*="-landing-split__copy"],
	[class*="-landing-split__copy"] p,
	[class*="-landing-split__copy"] .bb58-section__intro,
	.bb58-seo-flow__body,
	.bb58-seo-flow__body p,
	.bb58-seo-flow__heading,
	[class*="__copy"],
	[class*="__copy"] p {
		width: 100% !important;
		max-width: none !important;
	}

	/* Headings wrap as phrases, not one word per line */
	h1,
	h2,
	h3,
	h4,
	[class*="__heading"],
	[class*="-landing"] h2,
	[class*="-landing"] h3,
	.bb58-section__heading,
	.bb58-seo-flow__heading {
		white-space: normal !important;
		word-break: normal !important;
		overflow-wrap: break-word !important;
		hyphens: none !important;
		letter-spacing: normal;
	}

	/* Card grids — one column */
	.bb58-home-categories__grid,
	.bb58-home-features__grid,
	.bb58-home-trust-security__grid,
	.bb58-home-responsible__grid,
	.bb58-home-games__grid,
	.bb58-home-providers__grid,
	.bb58-home-promotions__grid,
	.bb58-home-guides__grid,
	.bb58-home-news__grid,
	.bb58-premium-benefits__grid,
	.bb58-promotions-grid,
	.bb58-providers-grid,
	.bb58-games-grid,
	.bb58-experience__features,
	.bb58-home-categories__seo-grid,
	[class*="-landing-benefits__grid"],
	[class*="-landing-commission__cards"],
	[class*="-landing-why__highlights"],
	[class*="-landing-features__grid"],
	[class*="-landing-stats__grid"],
	[class*="-landing-cards__grid"],
	[class*="-landing-news__grid"],
	[class*="-landing-categories__grid"],
	[class*="-landing-jackpots__grid"],
	.bb58-seo-flow__stats,
	.bb58-seo-flow__feature-list {
		grid-template-columns: minmax(0, 1fr) !important;
	}

	.bb58-home-category__link {
		aspect-ratio: 1 / 1.02;
		min-height: 0;
		padding: 1.1rem 1rem;
	}

	.bb58-experience__preview,
	.bb58-experience__preview-frame,
	.bb58-experience__preview-image {
		width: 100%;
		max-width: none;
	}

	.bb58-experience__features {
		margin-top: 1.25rem;
	}

	/* Provider / game archive cards breathe on mobile */
	.bb58-premium-provider,
	.bb58-premium-card,
	.bb58-premium-promo,
	.bb58-premium-benefits__item,
	[class*="-landing-benefits__item"],
	[class*="-landing-commission__card"] {
		width: 100%;
	}
}

/* Soften squeeze on very small phones */
@media (max-width: 429.98px) {
	.bb58-container,
	.bb58-home-section__inner,
	[class*="-landing"] .bb58-container {
		padding-inline: max(1rem, env(safe-area-inset-left, 0px)) max(1rem, env(safe-area-inset-right, 0px));
	}

	.bb58-home-category__title {
		font-size: 0.95rem;
	}

	.bb58-home-category__blurb {
		font-size: 0.72rem;
	}
}

/* -------------------------------------------------------------------------
   Tablet 768–1023 — two columns for cards; splits may stay 2-col
   ------------------------------------------------------------------------- */

@media (min-width: 768px) and (max-width: 1023.98px) {
	.bb58-home-categories__grid,
	.bb58-home-features__grid,
	.bb58-home-trust-security__grid,
	.bb58-home-responsible__grid,
	.bb58-home-games__grid,
	.bb58-home-providers__grid,
	.bb58-home-promotions__grid,
	.bb58-home-guides__grid,
	.bb58-home-news__grid,
	.bb58-premium-benefits__grid,
	.bb58-promotions-grid,
	.bb58-providers-grid,
	.bb58-games-grid,
	.bb58-experience__features,
	.bb58-home-categories__seo-grid,
	[class*="-landing-benefits__grid"],
	[class*="-landing-commission__cards"],
	[class*="-landing-why__highlights"],
	[class*="-landing-features__grid"],
	[class*="-landing-stats__grid"],
	[class*="-landing-cards__grid"],
	[class*="-landing-news__grid"],
	[class*="-landing-categories__grid"],
	[class*="-landing-jackpots__grid"] {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}

	/* Prefer stacked SEO/landing splits under laptop width for readability */
	[class*="-landing-split__grid"],
	[class*="-landing-faq__layout"],
	.bb58-seo-flow__inner,
	.bb58-seo-flow--visual-left .bb58-seo-flow__inner {
		grid-template-columns: minmax(0, 1fr) !important;
	}

	.bb58-seo-flow__content {
		order: 0 !important;
	}

	.bb58-seo-flow__visual {
		order: 1 !important;
	}
}

/* -------------------------------------------------------------------------
   Laptop ≥1024 — 3–4 column card grids
   ------------------------------------------------------------------------- */

@media (min-width: 1024px) {
	.bb58-home-categories__grid,
	.bb58-home-features__grid,
	.bb58-home-trust-security__grid,
	.bb58-premium-benefits__grid,
	.bb58-experience__features,
	[class*="-landing-benefits__grid"],
	[class*="-landing-features__grid"],
	[class*="-landing-why__highlights"] {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.bb58-home-games__grid,
	.bb58-home-providers__grid,
	.bb58-home-promotions__grid,
	.bb58-home-guides__grid,
	.bb58-home-news__grid,
	.bb58-promotions-grid,
	.bb58-providers-grid,
	.bb58-games-grid,
	[class*="-landing-commission__cards"],
	[class*="-landing-news__grid"],
	[class*="-landing-categories__grid"] {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.bb58-home-categories__seo-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	/* Desktop SEO / landing splits restored */
	.bb58-seo-flow__inner {
		grid-template-columns: minmax(0, 1.1fr) minmax(280px, 0.9fr);
	}

	.bb58-seo-flow--visual-left .bb58-seo-flow__inner {
		grid-template-columns: minmax(280px, 0.9fr) minmax(0, 1.1fr);
	}

	.bb58-seo-flow--visual-left .bb58-seo-flow__content {
		order: 2;
	}

	.bb58-seo-flow--visual-left .bb58-seo-flow__visual {
		order: 1;
	}

	[class*="-landing-split__grid"] {
		grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
	}

	[class*="-landing-split--reverse"] [class*="-landing-split__grid"] {
		grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
	}
}

/* Wide desktop polish */
@media (min-width: 1440px) {
	.bb58-home-games__grid,
	.bb58-home-providers__grid,
	.bb58-providers-grid,
	.bb58-games-grid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.bb58-seo-flow__body,
	[class*="-landing-split__copy"] p {
		font-size: 1.0625rem;
		line-height: 1.72;
	}
}

/* -------------------------------------------------------------------------
   Provider cards — uniform shell
   ------------------------------------------------------------------------- */

.bb58-premium-provider,
.bb58-home-providers__grid .bb58-premium-provider {
	display: flex;
	flex-direction: column;
	height: 100%;
}

.bb58-premium-provider__body {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	gap: 0.55rem;
}

.bb58-premium-provider__cta {
	margin-top: auto;
}

/* -------------------------------------------------------------------------
   Overflow guards
   ------------------------------------------------------------------------- */

img,
svg,
video,
iframe {
	max-width: 100%;
	height: auto;
}

.bb58-home-section,
[class*="-landing"],
.bb58-seo-flow,
.bb58-gd {
	overflow-x: clip;
}
