/*
Brand Skin for BD333
This file controls the visual color identity for the BD333 Bengali brand-entry website.
Prefer changing CSS variables here instead of rewriting core layout CSS.
*/

:root {
	--wpbbs-primary: #24306E;
	--wpbbs-primary-dark: #080B1C;
	--wpbbs-secondary: #14B8A6;
	--wpbbs-secondary-dark: #0F766E;
	--wpbbs-accent: #F7C948;
	--wpbbs-bg: #F4F7FB;
	--wpbbs-surface: #ffffff;
	--wpbbs-text: #111827;
	--wpbbs-muted: #516277;
	--wpbbs-border: #D7DEEA;
	--wpbbs-footer: #080B1C;
	--wpbbs-footer-soft: #24306E;
}

.wpbbs-hero {
	background:
		radial-gradient(circle at 78% 18%, rgba(247, 201, 72, 0.18), transparent 28%),
		linear-gradient(135deg, #080B1C 0%, #20275A 54%, #24306E 100%);
}

.wpbbs-hero h1,
.wpbbs-hero p,
.wpbbs-hero .wpbbs-eyebrow {
	color: #fff;
}

.wpbbs-hero .wpbbs-hero-stat {
	z-index: 3;
}

.wpbbs-hero .wpbbs-hero-stat p {
	color: var(--wpbbs-text);
}

.wpbbs-highlight-card--blue,
.wpbbs-highlight-card--red {
	background: #fff;
}

.wpbbs-intro {
	background: linear-gradient(90deg, rgba(11, 59, 143, 0.06), rgba(226, 27, 45, 0.04)), var(--wpbbs-bg);
}

.wpbbs-games {
	background: #f5f8ff;
}

.wpbbs-payment {
	background: #fff;
}

.wpbbs-home-article {
	background: linear-gradient(180deg, #fff, #f6f9ff);
}

.wpbbs-home-article__shell {
	max-width: 940px;
	margin: 0 auto;
	padding: clamp(1.25rem, 3vw, 2.5rem);
	border: 1px solid rgba(11, 59, 143, 0.12);
	border-radius: 18px;
	background: #fff;
	box-shadow: 0 18px 50px rgba(7, 21, 37, 0.08);
}

.wpbbs-home-article__head {
	margin-bottom: 1.5rem;
}

.wpbbs-home-article__content {
	display: grid;
	gap: 1.25rem;
}

.wpbbs-home-article__content section {
	padding-top: 1rem;
	border-top: 1px solid var(--wpbbs-border);
}

.wpbbs-home-article__content h3 {
	color: var(--wpbbs-primary);
}

.wpbbs-footer__col li::marker {
	color: #fff;
}

.wpbbs-game-card:nth-child(2n)::before {
	background: linear-gradient(90deg, var(--wpbbs-secondary), var(--wpbbs-accent));
}

.wpbbs-game-card:nth-child(3n)::before {
	background: linear-gradient(90deg, #0B3B8F, var(--wpbbs-primary));
}

.wpbbs-floating-actions a:first-child {
	background: var(--wpbbs-secondary);
}

.wpbbs-floating-actions a:last-child {
	background: var(--wpbbs-primary);
}