:root {

	--wbb-primary: #b42318;
	--wbb-primary-dark: #8f1c14;
	--wbb-primary-light: #fff1ef;

	--wbb-accent: #e7b341;

	--wbb-text: #171717;
	--wbb-text-soft: #333333;
	--wbb-muted: #6b7280;

	--wbb-white: #ffffff;
	--wbb-black: #111111;

	--wbb-border: #e5e7eb;
	--wbb-border-dark: #d1d5db;

	--wbb-surface: #ffffff;
	--wbb-surface-soft: #f7f7f7;

	--wbb-topbar: #171717;

	--wbb-shadow:
		0 4px 18px rgba(0, 0, 0, .06);

	--wbb-shadow-hover:
		0 8px 25px rgba(0, 0, 0, .12);
}


/* =========================================================
   SITE HEADER
========================================================= */

.site-header {

	position: relative;

	z-index: 9999;

	width: 100%;

	background: var(--wbb-white);

	color: var(--wbb-text);

	border-bottom: 1px solid var(--wbb-border);

}


/* =========================================================
   TOP NEWS BAR
========================================================= */

.wbb-topbar {

	width: 100%;

	min-height: 36px;

	background: var(--wbb-topbar);

	color: #ffffff;

	border-bottom: 1px solid #292929;

	font-size: 12px;

	line-height: 1.4;

}


.wbb-topbar-inner {

	min-height: 36px;

	display: flex;

	align-items: center;

	justify-content: space-between;

	gap: 20px;

}


/* =========================================================
   TOP LEFT
========================================================= */

.wbb-top-left {

	flex: 1 1 auto;

	min-width: 0;

	display: flex;

	align-items: center;

	gap: 10px;

	overflow: hidden;

}


/* =========================================================
   LATEST NEWS LABEL
========================================================= */

.wbb-top-label {

	display: inline-flex;

	align-items: center;

	gap: 7px;

	flex: 0 0 auto;

	color: #ffffff;

	font-size: 11px;

	font-weight: 800;

	text-transform: uppercase;

	letter-spacing: .04em;

	white-space: nowrap;

}


/* =========================================================
   LIVE DOT
========================================================= */

.wbb-live-dot {

	position: relative;

	display: inline-block;

	width: 7px;

	height: 7px;

	flex: 0 0 7px;

	border-radius: 50%;

	background: #ef4444;

	box-shadow: 0 0 0 3px rgba(239, 68, 68, .14);

}


.wbb-live-dot::after {

	content: "";

	position: absolute;

	inset: -3px;

	border-radius: 50%;

	border: 1px solid rgba(239, 68, 68, .55);

	animation: wbbLivePulse 1.8s infinite;

}


@keyframes wbbLivePulse {

	0% {

		transform: scale(.8);

		opacity: .9;

	}

	70% {

		transform: scale(1.45);

		opacity: 0;

	}

	100% {

		transform: scale(1.45);

		opacity: 0;

	}

}


/* =========================================================
   TOP DIVIDER
========================================================= */

.wbb-top-divider {

	width: 1px;

	height: 15px;

	flex: 0 0 1px;

	background: rgba(255, 255, 255, .20);

}


/* =========================================================
   TOP WELCOME / NEWS TEXT
========================================================= */

.wbb-top-welcome {

	display: block;

	min-width: 0;

	overflow: hidden;

	text-overflow: ellipsis;

	white-space: nowrap;

	color: #d1d5db;

	font-size: 11px;

	font-weight: 500;

}


/* =========================================================
   TOP RIGHT
========================================================= */

.wbb-top-right {

	flex: 0 0 auto;

	display: flex;

	align-items: center;

	justify-content: flex-end;

	gap: 14px;

	min-width: 0;

}


/* =========================================================
   TOP LINKS
========================================================= */

.wbb-top-link {

	display: inline-flex;

	align-items: center;

	gap: 5px;

	color: #d1d5db;

	font-size: 11px;

	font-weight: 600;

	line-height: 1;

	text-decoration: none;

	white-space: nowrap;

	transition:
		color .2s ease,
		transform .2s ease;

}


.wbb-top-link:hover {

	color: #ffffff;

	transform: translateY(-1px);

}


/* =========================================================
   TOP ICON
========================================================= */

.wbb-top-icon {

	display: inline-flex;

	align-items: center;

	justify-content: center;

	color: #f59e0b;

	font-size: 11px;

	line-height: 1;

}


/* =========================================================
   EMAIL
========================================================= */

.wbb-email-link > span:last-child {

	max-width: 220px;

	overflow: hidden;

	text-overflow: ellipsis;

	white-space: nowrap;

}


/* =========================================================
   SOCIAL DIVIDER
========================================================= */

.wbb-social-divider {

	margin-left: 1px;

}


/* =========================================================
   SOCIAL ICONS
========================================================= */

.wbb-socials {

	display: flex;

	align-items: center;

	gap: 5px;

}


.wbb-social {

	width: 24px;

	height: 24px;

	display: inline-flex;

	align-items: center;

	justify-content: center;

	border: 1px solid rgba(255,255,255,.20);

	border-radius: 50%;

	background: rgba(255,255,255,.06);

	color: #d1d5db;

	font-size: 10px;

	font-weight: 800;

	line-height: 1;

	text-decoration: none;

	transition:
		background-color .2s ease,
		border-color .2s ease,
		color .2s ease,
		transform .2s ease,
		box-shadow .2s ease;

}


.wbb-social:hover {

	background: var(--wbb-primary);

	border-color: var(--wbb-primary);

	color: #ffffff;

	transform: translateY(-2px);

	box-shadow:
		0 5px 15px rgba(180,35,24,.28);

}


/* =========================================================
   MAIN HEADER
========================================================= */

.wbb-main-header {

	position: relative;

	width: 100%;

	background: #ffffff;

	box-shadow: var(--wbb-shadow);

}


/* =========================================================
   HEADER INNER
========================================================= */

.wbb-header-inner {

	min-height: 82px;

	display: flex;

	align-items: center;

	gap: 25px;

}


/* =========================================================
   BRAND
========================================================= */

.wbb-brand {

	flex: 1 1 auto;

	display: flex;

	align-items: center;

	gap: 12px;

	min-width: 0;

}


/* =========================================================
   LOGO / SITE ICON
========================================================= */

.wbb-logo {

	width: 54px;

	height: 54px;

	flex: 0 0 54px;

	display: flex;

	align-items: center;

	justify-content: center;

	overflow: hidden;

}


.wbb-logo .custom-logo-link,
.wbb-site-icon a {

	width: 54px;

	height: 54px;

	display: flex;

	align-items: center;

	justify-content: center;

	overflow: hidden;

	border-radius: 10px;

}


/* =========================================================
   CUSTOM LOGO
========================================================= */

.wbb-logo .custom-logo {

	display: block;

	width: 54px;

	height: 54px;

	max-width: 54px;

	max-height: 54px;

	object-fit: contain;

	border-radius: 10px;

}


/* =========================================================
   SITE ICON FALLBACK
========================================================= */

.wbb-site-icon {

	position: relative;

	border-radius: 10px;

}


.wbb-site-icon img {

	display: block;

	width: 54px;

	height: 54px;

	object-fit: cover;

	border-radius: 10px;

	box-shadow:
		0 3px 12px rgba(0,0,0,.12);

}


/* =========================================================
   BRAND TEXT
========================================================= */

.wbb-brand-text {

	flex: 1 1 auto;

	min-width: 0;

	max-width: 330px;

}


/* =========================================================
   SITE NAME
========================================================= */

.wbb-site-name {

	display: block;

	max-width: 100%;

	margin: 0;

	padding: 0;

	color: var(--wbb-text);

	font-family:
		Arial,
		Helvetica,
		sans-serif;

	font-size: 23px;

	font-weight: 850;

	line-height: 1.1;

	letter-spacing: -.025em;

	overflow: hidden;

	text-overflow: ellipsis;

	white-space: nowrap;

	text-decoration: none;

	transition:
		color .2s ease;

}


.wbb-site-name a {

	color: inherit;

	text-decoration: none;

}


.wbb-site-name:hover,
.wbb-site-name a:hover {

	color: var(--wbb-primary);

}


/* =========================================================
   TAGLINE
========================================================= */

.wbb-tagline {

	display: block;

	max-width: 100%;

	margin-top: 5px;

	color: var(--wbb-muted);

	font-size: 11px;

	font-weight: 500;

	line-height: 1.3;

	overflow: hidden;

	text-overflow: ellipsis;

	white-space: nowrap;

}


/* =========================================================
   PRIMARY NAVIGATION
========================================================= */

.wbb-primary-nav {

	flex: 0 1 auto;

	min-width: 0;

	display: flex;

	align-items: center;

	justify-content: center;

}


/* WordPress menu */

.wbb-primary-nav ul {

	margin: 0;

	padding: 0;

	list-style: none;

}


.wbb-primary-nav > div > ul,
.wbb-primary-nav > ul {

	display: flex;

	align-items: center;

	gap: 2px;

}


/* =========================================================
   NAV ITEM
========================================================= */

.wbb-primary-nav li {

	position: relative;

	margin: 0;

	padding: 0;

}


/* =========================================================
   NAV LINK
========================================================= */

.wbb-primary-nav a {

	position: relative;

	display: flex;

	align-items: center;

	justify-content: center;

	min-height: 42px;

	padding: 9px 12px;

	border-radius: 6px;

	color: #262626;

	font-size: 13px;

	font-weight: 700;

	line-height: 1.2;

	white-space: nowrap;

	text-decoration: none;

	transition:
		color .2s ease,
		background-color .2s ease;

}


/* =========================================================
   NAV HOVER RED NEWS STYLE
========================================================= */

.wbb-primary-nav a::after {

	content: "";

	position: absolute;

	left: 12px;

	right: 12px;

	bottom: 4px;

	height: 2px;

	border-radius: 99px;

	background: var(--wbb-primary);

	transform: scaleX(0);

	transform-origin: center;

	transition:
		transform .2s ease;

}


.wbb-primary-nav a:hover {

	color: var(--wbb-primary);

	background: #fff7f6;

}


.wbb-primary-nav a:hover::after {

	transform: scaleX(1);

}


/* =========================================================
   ACTIVE NAV
========================================================= */

.wbb-primary-nav
.current-menu-item > a,
.wbb-primary-nav
.current-menu-ancestor > a,
.wbb-primary-nav
.current_page_item > a {

	color: var(--wbb-primary);

	background: #fff7f6;

}


.wbb-primary-nav
.current-menu-item > a::after,
.wbb-primary-nav
.current-menu-ancestor > a::after,
.wbb-primary-nav
.current_page_item > a::after {

	transform: scaleX(1);

}


/* =========================================================
   DROPDOWN MENU
========================================================= */

.wbb-primary-nav .sub-menu {

	position: absolute;

	top: calc(100% + 8px);

	left: 0;

	z-index: 10000;

	min-width: 210px;

	margin: 0;

	padding: 7px;

	background: #ffffff;

	border: 1px solid var(--wbb-border);

	border-radius: 8px;

	box-shadow:
		0 15px 35px rgba(0,0,0,.13);

	opacity: 0;

	visibility: hidden;

	transform: translateY(6px);

	transition:
		opacity .18s ease,
		visibility .18s ease,
		transform .18s ease;

}


.wbb-primary-nav li:hover > .sub-menu,
.wbb-primary-nav li:focus-within > .sub-menu {

	opacity: 1;

	visibility: visible;

	transform: translateY(0);

}


.wbb-primary-nav .sub-menu li {

	width: 100%;

}


.wbb-primary-nav .sub-menu a {

	width: 100%;

	min-height: 38px;

	justify-content: flex-start;

	padding: 9px 11px;

	border-radius: 5px;

	font-size: 12px;

	font-weight: 600;

	white-space: normal;

}


.wbb-primary-nav .sub-menu a::after {

	display: none;

}


.wbb-primary-nav .sub-menu a:hover {

	background: #fff3f1;

	color: var(--wbb-primary);

}


/* =========================================================
   HEADER ACTIONS
========================================================= */

.wbb-header-actions {

	flex: 0 0 auto;

	display: flex;

	align-items: center;

	gap: 8px;

}


/* =========================================================
   SEARCH BUTTON
========================================================= */

.wbb-search-button {

	width: 40px;

	height: 40px;

	display: inline-flex;

	align-items: center;

	justify-content: center;

	padding: 0;

	border: 1px solid var(--wbb-border);

	border-radius: 6px;

	background: #ffffff;

	color: #262626;

	cursor: pointer;

	transition:
		background-color .2s ease,
		border-color .2s ease,
		color .2s ease,
		transform .2s ease,
		box-shadow .2s ease;

}


.wbb-search-button:hover {

	background: var(--wbb-primary);

	border-color: var(--wbb-primary);

	color: #ffffff;

	transform: translateY(-1px);

	box-shadow:
		0 6px 16px rgba(180,35,24,.20);

}


/* =========================================================
   CALL BUTTON
========================================================= */

.wbb-call-button {

	min-height: 40px;

	display: inline-flex;

	align-items: center;

	justify-content: center;

	gap: 6px;

	padding: 0 15px;

	border: 1px solid var(--wbb-primary);

	border-radius: 6px;

	background: var(--wbb-primary);

	color: #ffffff;

	font-size: 12px;

	font-weight: 800;

	line-height: 1;

	text-decoration: none;

	box-shadow:
		0 4px 12px rgba(180,35,24,.14);

	transition:
		background-color .2s ease,
		border-color .2s ease,
		transform .2s ease,
		box-shadow .2s ease;

}


.wbb-call-button:hover {

	background: var(--wbb-primary-dark);

	border-color: var(--wbb-primary-dark);

	color: #ffffff;

	transform: translateY(-2px);

	box-shadow:
		0 8px 20px rgba(180,35,24,.23);

}


/* =========================================================
   MOBILE MENU BUTTON
========================================================= */

.wbb-menu-button {

	width: 40px;

	height: 40px;

	display: none;

	flex-direction: column;

	align-items: center;

	justify-content: center;

	gap: 5px;

	padding: 7px;

	border: 1px solid var(--wbb-border);

	border-radius: 6px;

	background: #ffffff;

	color: #222222;

	cursor: pointer;

	transition:
		background-color .2s ease,
		color .2s ease,
		border-color .2s ease;

}


.wbb-menu-button:hover {

	background: var(--wbb-primary);

	border-color: var(--wbb-primary);

	color: #ffffff;

}


.wbb-menu-button span {

	display: block;

	width: 18px;

	height: 2px;

	border-radius: 99px;

	background: currentColor;

	transition:
		transform .2s ease,
		opacity .2s ease;

}


/* =========================================================
   HAMBURGER TO X
========================================================= */

.wbb-menu-button[aria-expanded="true"]
span:nth-child(1) {

	transform:
		translateY(7px)
		rotate(45deg);

}


.wbb-menu-button[aria-expanded="true"]
span:nth-child(2) {

	opacity: 0;

}


.wbb-menu-button[aria-expanded="true"]
span:nth-child(3) {

	transform:
		translateY(-7px)
		rotate(-45deg);

}


/* =========================================================
   SEARCH PANEL
========================================================= */

.wbb-search-panel {

	position: absolute;

	left: 0;

	right: 0;

	z-index: 9998;

	width: 100%;

	padding: 18px 0;

	background: #f8f8f8;

	border-top: 1px solid var(--wbb-border);

	border-bottom: 1px solid var(--wbb-border);

	box-shadow:
		0 12px 25px rgba(0,0,0,.08);

}


.wbb-search-panel[hidden] {

	display: none;

}


.wbb-search-inner {

	display: flex;

	align-items: center;

	gap: 18px;

}


.wbb-search-title {

	flex: 0 0 auto;

	color: var(--wbb-text);

	font-size: 13px;

	font-weight: 800;

	white-space: nowrap;

}


.wbb-search-panel form {

	flex: 1 1 auto;

	display: flex;

	max-width: 750px;

	margin: 0 auto;

}


.wbb-search-panel input[type="search"] {

	width: 100%;

	min-height: 44px;

	padding: 10px 14px;

	border: 1px solid var(--wbb-border-dark);

	border-radius: 6px;

	background: #ffffff;

	color: var(--wbb-text);

	font-size: 13px;

	outline: none;

	box-sizing: border-box;

	transition:
		border-color .2s ease,
		box-shadow .2s ease;

}


.wbb-search-panel input[type="search"]:focus {

	border-color: var(--wbb-primary);

	box-shadow:
		0 0 0 3px rgba(180,35,24,.10);

}


/* =========================================================
   MOBILE NAVIGATION
========================================================= */

.wbb-mobile-nav {

	display: none;

	width: 100%;

	background: #ffffff;

	border-top: 1px solid var(--wbb-border);

	box-shadow:
		0 14px 30px rgba(0,0,0,.10);

}


.wbb-mobile-nav[aria-hidden="false"] {

	display: block;

}


.wbb-mobile-nav ul {

	list-style: none;

	margin: 0;

	padding: 8px 0 14px;

}


.wbb-mobile-nav li {

	margin: 0;

	padding: 0;

}


.wbb-mobile-nav a {

	display: flex;

	align-items: center;

	justify-content: space-between;

	gap: 10px;

	padding: 12px 10px;

	border-bottom: 1px solid #f0f0f0;

	color: #222222;

	font-size: 14px;

	font-weight: 700;

	line-height: 1.35;

	text-decoration: none;

	transition:
		background-color .2s ease,
		color .2s ease,
		padding-left .2s ease;

}


.wbb-mobile-nav a:hover {

	background: #fff5f3;

	color: var(--wbb-primary);

	padding-left: 15px;

}


.wbb-mobile-nav
.current-menu-item > a,
.wbb-mobile-nav
.current-menu-ancestor > a {

	color: var(--wbb-primary);

	background: #fff5f3;

}


/* =========================================================
   MOBILE SUBMENU
========================================================= */

.wbb-mobile-nav .sub-menu {

	display: none;

	margin: 0;

	padding: 0 0 5px 12px;

	background: #fafafa;

}


.wbb-mobile-nav
.menu-item-has-children.is-open
> .sub-menu {

	display: block;

}


.wbb-mobile-nav .sub-menu a {

	padding-top: 10px;

	padding-bottom: 10px;

	font-size: 12.5px;

	font-weight: 600;

}


/* =========================================================
   FOCUS ACCESSIBILITY
========================================================= */

.wbb-search-button:focus-visible,
.wbb-call-button:focus-visible,
.wbb-menu-button:focus-visible,
.wbb-primary-nav a:focus-visible,
.wbb-mobile-nav a:focus-visible,
.wbb-top-link:focus-visible,
.wbb-social:focus-visible,
.wbb-site-name:focus-visible,
.wbb-site-name a:focus-visible {

	outline: 2px solid var(--wbb-accent);

	outline-offset: 3px;

}


/* =========================================================
   TABLET / SMALL DESKTOP
========================================================= */

@media (max-width: 1100px) {

	.wbb-header-inner {

		gap: 14px;

	}

	.wbb-brand-text {

		max-width: 240px;

	}

	.wbb-primary-nav a {

		padding-left: 8px;

		padding-right: 8px;

		font-size: 11.5px;

	}

	.wbb-call-button {

		padding-left: 11px;

		padding-right: 11px;

	}

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 980px) {

	.wbb-primary-nav {

		display: none;

	}

	.wbb-menu-button {

		display: inline-flex;

	}

	.wbb-brand-text {

		max-width: none;

	}

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 640px) {

	/* TOPBAR */

	.wbb-topbar {

		min-height: 34px;

	}

	.wbb-topbar-inner {

		min-height: 34px;

	}

	.wbb-top-left {

		flex: 1 1 auto;

		gap: 7px;

	}

	.wbb-top-label {

		font-size: 9px;

	}

	.wbb-top-welcome {

		font-size: 9px;

	}

	.wbb-top-divider {

		height: 12px;

	}

	.wbb-top-right {

		gap: 7px;

	}

	.wbb-email-link,
	.wbb-top-right > .wbb-top-link {

		display: none;

	}

	.wbb-social-divider {

		display: none;

	}

	.wbb-socials {

		gap: 4px;

	}

	.wbb-social {

		width: 22px;

		height: 22px;

		font-size: 9px;

	}


	/* HEADER */

	.wbb-header-inner {

		min-height: 68px;

		gap: 8px;

	}


	/* LOGO */

	.wbb-logo {

		width: 46px;

		height: 46px;

		flex-basis: 46px;

	}

	.wbb-logo .custom-logo-link,
	.wbb-site-icon a {

		width: 46px;

		height: 46px;

	}

	.wbb-logo .custom-logo {

		width: 46px;

		height: 46px;

		max-width: 46px;

		max-height: 46px;

	}

	.wbb-site-icon img {

		width: 46px;

		height: 46px;

	}


	/* BRAND */

	.wbb-brand {

		gap: 9px;

	}


	.wbb-brand-text {

		max-width: none;

	}


	.wbb-site-name {

		font-size: 18px;

	}

	.wbb-tagline {

		margin-top: 3px;

		font-size: 9px;

	}


	/* ACTIONS */

	.wbb-header-actions {

		gap: 5px;

	}

	.wbb-search-button,
	.wbb-menu-button {

		width: 37px;

		height: 37px;

	}

	.wbb-call-button {

		width: 37px;

		height: 37px;

		min-height: 37px;

		padding: 0;

		border-radius: 6px;

	}

	.wbb-call-button span:last-child {

		display: none;

	}


	/* MOBILE NAV */

	.wbb-mobile-nav {

		position: absolute;

		top: 100%;

		left: 0;

		right: 0;

		z-index: 9997;

	}


	/* SEARCH */

	.wbb-search-inner {

		display: block;

	}

	.wbb-search-title {

		margin-bottom: 8px;

	}

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 480px) {

	.wbb-top-left {

		max-width: 65%;

	}

	.wbb-top-welcome {

		display: none;

	}

	.wbb-top-divider {

		display: none;

	}

	.wbb-top-label {

		font-size: 9px;

	}

	.wbb-top-right {

		margin-left: auto;

	}


	.wbb-header-inner {

		min-height: 64px;

	}

	.wbb-site-name {

		font-size: 16px;

	}

	.wbb-tagline {

		font-size: 8.5px;

	}

	.wbb-logo {

		width: 42px;

		height: 42px;

		flex-basis: 42px;

	}

	.wbb-logo .custom-logo-link,
	.wbb-site-icon a {

		width: 42px;

		height: 42px;

	}

	.wbb-logo .custom-logo {

		width: 42px;

		height: 42px;

		max-width: 42px;

		max-height: 42px;

	}

	.wbb-site-icon img {

		width: 42px;

		height: 42px;

	}

	.wbb-search-button,
	.wbb-menu-button,
	.wbb-call-button {

		width: 35px;

		height: 35px;

	}

}


/* =========================================================
   VERY SMALL MOBILE
========================================================= */

@media (max-width: 360px) {

	.wbb-site-name {

		font-size: 15px;

	}

	.wbb-tagline {

		font-size: 8px;

	}

	.wbb-header-actions {

		gap: 4px;

	}

	.wbb-search-button,
	.wbb-menu-button,
	.wbb-call-button {

		width: 33px;

		height: 33px;

	}

}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

	.wbb-live-dot::after,
	.wbb-top-link,
	.wbb-social,
	.wbb-site-name,
	.wbb-primary-nav a,
	.wbb-primary-nav .sub-menu,
	.wbb-search-button,
	.wbb-call-button,
	.wbb-menu-button,
	.wbb-mobile-nav a {

		animation: none;

		transition: none;

	}

}