/*
Theme Name: Betheme Child
Theme URI: https://themes.muffingroup.com/betheme
Author: Muffin group
Author URI: https://muffingroup.com
Description: Child Theme for Betheme
Template: betheme
Version: 1.6.2
*/

/* --- Whiterdays design tokens (brief) --- */
.whiterdays-brand {
	--wd-primary: #1e3a8a;
	--wd-gold: #d4af37;
	--wd-silver: #c0c0c0;
	--wd-black: #0a0a0a;
	--wd-white: #ffffff;
	--wd-section-pad-y: 80px;
	--wd-section-pad-x: 0;
	--wd-headline-mb: 16px;
	--wd-text-mb: 20px;
	--wd-card-gap: 24px;
	--wd-font-heading: "Montserrat", "Poppins", system-ui, sans-serif;
	--wd-font-heading-lux: "Playfair Display", Georgia, serif;
	--wd-font-body: "Inter", "Poppins", system-ui, sans-serif;
}

body.whiterdays-brand {
	font-family: var(--wd-font-body);
}

.whiterdays-brand h1,
.whiterdays-brand h2,
.whiterdays-brand h3,
.whiterdays-brand h4,
.whiterdays-brand h5,
.whiterdays-brand h6,
.whiterdays-brand .title,
.whiterdays-brand .heading {
	font-family: var(--wd-font-heading);
}

/* Section rhythm helper — add class "wd-section" in BeBuilder section → Wrap → Class */
.whiterdays-brand .wd-section {
	padding-top: var(--wd-section-pad-y);
	padding-bottom: var(--wd-section-pad-y);
}

@media (max-width: 959px) {
	.whiterdays-brand {
		--wd-section-pad-y: 48px;
	}
}

@media (max-width: 767px) {
	.whiterdays-brand {
		--wd-section-pad-y: 32px;
	}
}

/* Header CTA buttons (menu item classes from bootstrap) */
.whiterdays-brand #menu ul.menu > li.wd-header-cta > a {
	border-radius: 4px;
	font-weight: 600;
	padding: 0.55em 1.1em;
	transition: opacity 0.2s ease, background 0.2s ease;
}

.whiterdays-brand li.wd-header-cta-primary > a {
	background: var(--wd-primary) !important;
	color: var(--wd-white) !important;
	border: 1px solid var(--wd-primary);
}

.whiterdays-brand li.wd-header-cta-primary > a:hover {
	opacity: 0.92;
}

.whiterdays-brand li.wd-header-cta-secondary > a {
	background: transparent !important;
	color: var(--wd-gold) !important;
	border: 1px solid var(--wd-gold);
}

.whiterdays-brand li.wd-header-cta-secondary > a:hover {
	background: rgba(212, 175, 55, 0.12) !important;
}