/*
Theme Name: Morris & Dewett Child Theme
Description: Child theme for the Morris & Dewett website
Author: Morris & Dewett
Template: hello-elementor
Version: 2.0.0
*/

/* =============================================================================
   TABLE OF CONTENTS
   =============================================================================
   1. CSS Variables (Design Tokens)
   2. Base Styles
   3. Header Component
   4. Footer Component
   5. Badge Carousel
   ============================================================================= */

/* =============================================================================
   1. CSS VARIABLES (Design Tokens)
   ============================================================================= */
:root {
	/* Colors */
	--color-accent: #1a1a2e;
	--color-background: #0f0f1a;
	--color-text: #fff;
	--color-text-light: #f5f5f5;
	--color-grey-medium: #a0a0a0;
	--color-gold: #d4a853;
	--color-border: rgba(255, 255, 255, .08);
	--color-border-hover: rgba(255, 255, 255, .1);
	--color-overlay-dark: rgba(0, 0, 0, .3);
	--color-overlay-darker: rgba(0, 0, 0, .5);
	/* Typography */
	--font-heading: "Oswald", sans-serif;
	--font-body: "Proxima Nova", Arial, sans-serif;
	/* Spacing */
	--spacing-xs: 8px;
	--spacing-sm: 12px;
	--spacing-md: 20px;
	--spacing-base: 30px;
	--spacing-lg: 50px;
	--spacing-xl: 60px;
	/* Layout */
	--container-max: 1600px;
	--container-padding: 50px;
	--container-padding-mobile: 20px;
	/* Transitions */
	--transition-fast: .2s ease;
	--transition-base: .3s ease;
	/* Shadows */
	--shadow-sm: 0 2px 8px rgba(0, 0, 0, .2);
	--shadow-md: 0 4px 12px rgba(0, 0, 0, .3);
	--shadow-lg: 0 8px 24px rgba(0, 0, 0, .3);
	/* Border Radius */
	--radius-sm: 4px;
	--radius-md: 6px;
	--radius-lg: 8px;
	/* Header heights (for body padding) */
	--header-height: 80px;
	--header-height-mobile: 64px;
}

/* =============================================================================
   2. BASE STYLES
   ============================================================================= */

/* -----------------------------------------------------------------------------
   Custom Container System
   ----------------------------------------------------------------------------- */

/* Boxed content container - centers content at max width */
.md-container, body .md-container, main.md-container, body main.md-container, .elementor-widget-container .md-container {
	max-width: 1600px !important;
	margin-left: auto !important;
	margin-right: auto !important;
	padding-left: 50px !important;
	padding-right: 50px !important;
	box-sizing: border-box !important;
	width: 100% !important;
}

@media (max-width: 768px) {
	.md-container, body .md-container, main.md-container {
		padding-left: 20px !important;
		padding-right: 20px !important;
	}
}

/* Full-bleed wrapper - background fills viewport, content stays boxed */
.md-full-bleed {
	width: 100vw;
	position: relative;
	left: 50%;
	margin-left: -50vw;
	box-sizing: border-box;
}

/* Narrow container - for readable text blocks (prose) */
.md-container-narrow {
	max-width: 900px;
	margin-left: auto;
	margin-right: auto;
	padding-left: var(--container-padding);
	padding-right: var(--container-padding);
	box-sizing: border-box;
	width: 100%;
}

@media (max-width: 768px) {
	.md-container-narrow {
		padding-left: var(--container-padding-mobile);
		padding-right: var(--container-padding-mobile);
	}
}

/* Wide container - for hero sections, galleries */
.md-container-wide {
	max-width: 1920px;
	margin-left: auto;
	margin-right: auto;
	padding-left: var(--container-padding);
	padding-right: var(--container-padding);
	box-sizing: border-box;
	width: 100%;
}

/* -----------------------------------------------------------------------------
   Body Defaults
   ----------------------------------------------------------------------------- */
body {
	font-family: var(--font-body);
	color: var(--color-text);
	background: var(--color-background);
	margin: 0;
	padding: 0;
	line-height: 1.6;
	padding-top: var(--header-height);
}

@media (max-width: 768px) {
	body {
		padding-top: var(--header-height-mobile);
	}
}

/* =============================================================================
   3. HEADER COMPONENT
   ============================================================================= */
.site-header {
	background: var(--color-accent);
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 1000;
	border-bottom: 1px solid var(--color-border);
}

.header-container {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 15px var(--container-padding);
	max-width: var(--container-max);
	margin: 0 auto;
	gap: var(--spacing-base);
}

.header-logo {
	display: flex;
	align-items: center;
	text-decoration: none;
	flex-shrink: 0;
}

.header-logo-image {
	height: 50px;
	width: auto;
	display: block;
}

/* Desktop Navigation */
.header-nav {
	display: none;
	flex: 1;
	justify-content: center;
}

@media (min-width: 1024px) {
	.header-nav {
		display: flex;
	}
}

.header-nav-list {
	display: flex;
	align-items: center;
	gap: var(--spacing-xs);
	list-style: none;
	margin: 0;
	padding: 0;
}

.header-nav-item {
	position: relative;
}

.header-nav-item > a {
	font-family: var(--font-heading);
	font-size: 15px;
	font-weight: 700;
	color: var(--color-text);
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: 1px;
	padding: 10px 14px;
	display: block;
	transition: color var(--transition-fast);
	white-space: nowrap;
}

.header-nav-item > a:hover {
	color: var(--color-gold);
}

.header-nav-item.has-dropdown > a::after {
	content: "";
	display: inline-block;
	width: 0;
	height: 0;
	border-left: 4px solid transparent;
	border-right: 4px solid transparent;
	border-top: 4px solid currentColor;
	margin-left: 6px;
	vertical-align: middle;
}

/* Dropdown Menu */
.header-dropdown {
	position: absolute;
	top: 100%;
	left: 0;
	background: var(--color-accent);
	border: 1px solid var(--color-border-hover);
	border-radius: var(--radius-sm);
	min-width: 220px;
	padding: var(--spacing-xs) 0;
	list-style: none;
	margin: 0;
	opacity: 0;
	visibility: hidden;
	transform: translateY(10px);
	transition: all var(--transition-fast);
	box-shadow: var(--shadow-lg);
}

.header-nav-item.has-dropdown:hover .header-dropdown, .header-nav-item.has-dropdown:focus-within .header-dropdown {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.header-dropdown li {
	margin: 0;
}

.header-dropdown a {
	font-family: var(--font-body);
	font-size: 14px;
	font-weight: 500;
	color: var(--color-text);
	text-decoration: none;
	padding: 10px var(--spacing-md);
	display: block;
	transition: all var(--transition-fast);
}

.header-dropdown a:hover {
	background: rgba(255, 255, 255, .05);
	color: var(--color-gold);
}

/* Header Actions */
.header-actions {
	display: none;
	align-items: center;
	gap: var(--spacing-md);
	flex-shrink: 0;
}

@media (min-width: 1024px) {
	.header-actions {
		display: flex;
	}
}

.header-phone {
	display: flex;
	align-items: center;
	gap: var(--spacing-xs);
	font-family: var(--font-heading);
	font-size: 16px;
	font-weight: 700;
	color: var(--color-text);
	text-decoration: none;
	transition: color var(--transition-fast);
}

.header-phone:hover {
	color: var(--color-gold);
}

.phone-icon {
	width: 20px;
	height: 20px;
}

.header-cta {
	font-family: var(--font-heading);
	font-size: 14px;
	font-weight: 900;
	color: var(--color-background);
	background: var(--color-gold);
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: 1px;
	padding: var(--spacing-sm) 24px;
	border-radius: 0;
	transition: all var(--transition-fast);
	white-space: nowrap;
}

.header-cta:hover {
	background: var(--color-text);
	color: var(--color-background);
}

/* Mobile Toggle */
.header-mobile-toggle {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 5px;
	width: 40px;
	height: 40px;
	background: transparent;
	border: none;
	cursor: pointer;
	padding: var(--spacing-xs);
}

@media (min-width: 1024px) {
	.header-mobile-toggle {
		display: none;
	}
}

.hamburger-line {
	display: block;
	width: 24px;
	height: 2px;
	background: var(--color-text);
	transition: all var(--transition-base);
}

.header-mobile-toggle[aria-expanded="true"] .hamburger-line:nth-child(1) {
	transform: rotate(45deg) translate(5px, 5px);
}

.header-mobile-toggle[aria-expanded="true"] .hamburger-line:nth-child(2) {
	opacity: 0;
}

.header-mobile-toggle[aria-expanded="true"] .hamburger-line:nth-child(3) {
	transform: rotate(-45deg) translate(5px, -5px);
}

/* Mobile Navigation */
.header-mobile-nav {
	display: none;
	background: var(--color-accent);
	border-top: 1px solid var(--color-border);
	padding: var(--spacing-md);
	max-height: calc(100vh - var(--header-height));
	overflow-y: auto;
}

.header-mobile-nav:not([hidden]) {
	display: block;
}

@media (min-width: 1024px) {
	.header-mobile-nav {
		display: none !important;
	}
}

.mobile-nav-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.mobile-nav-item {
	border-bottom: 1px solid var(--color-border);
}

.mobile-nav-item > a, .mobile-dropdown-toggle {
	font-family: var(--font-heading);
	font-size: 16px;
	font-weight: 700;
	color: var(--color-text);
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: 1px;
	padding: 15px 0;
	display: block;
	width: 100%;
	text-align: left;
	background: transparent;
	border: none;
	cursor: pointer;
}

.mobile-dropdown-toggle {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.mobile-dropdown-toggle::after {
	content: "+";
	font-size: 20px;
	font-weight: 400;
	transition: transform var(--transition-fast);
}

.mobile-dropdown-toggle[aria-expanded="true"]::after {
	content: "-";
}

.mobile-dropdown {
	padding: 0 0 15px var(--spacing-md);
	list-style: none;
	margin: 0;
}

.mobile-dropdown:not([hidden]) {
	display: block;
}

.mobile-dropdown a {
	font-family: var(--font-body);
	font-size: 14px;
	font-weight: 500;
	color: var(--color-grey-medium);
	text-decoration: none;
	padding: 10px 0;
	display: block;
	transition: color var(--transition-fast);
}

.mobile-dropdown a:hover {
	color: var(--color-gold);
}

.mobile-nav-actions {
	display: flex;
	flex-direction: column;
	gap: 15px;
	margin-top: var(--spacing-md);
	padding-top: var(--spacing-md);
	border-top: 1px solid var(--color-border);
}

.mobile-phone {
	font-family: var(--font-heading);
	font-size: 20px;
	font-weight: 700;
	color: var(--color-text);
	text-decoration: none;
	text-align: center;
}

.mobile-cta {
	font-family: var(--font-heading);
	font-size: 16px;
	font-weight: 900;
	color: var(--color-background);
	background: var(--color-gold);
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: 1px;
	padding: 16px 24px;
	text-align: center;
	display: block;
}

/* Header Mobile Responsive */
@media (max-width: 768px) {
	.header-container {
		padding: var(--spacing-sm) var(--container-padding-mobile);
	}
	
	.header-logo-image {
		height: 40px;
	}
}

/* =============================================================================
   4. FOOTER COMPONENT
   ============================================================================= */

/* Outer wrapper - full viewport width, breaks out of any parent constraints */
.site-footer-wrapper {
	width: 100vw;
	position: relative;
	left: 50%;
	right: 50%;
	margin-left: -50vw;
	margin-right: -50vw;
}

/* Full-width background - stretches edge to edge */
.site-footer {
	background: var(--color-accent);
	padding: var(--spacing-xl) 0;
	margin-top: var(--spacing-xl);
	border-top: 2px solid var(--color-border);
	width: 100%;
	box-sizing: border-box;
}

/* Centered content container - boxed at 1600px max */
.footer-container {
	max-width: var(--container-max);
	margin: 0 auto;
	padding: 0 var(--container-padding);
	box-sizing: border-box;
}

/* Footer Grid */
.footer-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--spacing-xl);
	margin-bottom: var(--spacing-xl);
	padding-left: 0;
	margin-left: 0;
}

.footer-brand {
	text-align: center;
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--spacing-xs);
}

.footer-contact-form {
	width: 100%;
	max-width: 100%;
	margin: 0 auto;
	min-width: 0;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	box-sizing: border-box;
}

/* Tablet Layout (640-1023px) */
@media (min-width: 640px) and (max-width: 1023px) {
	.footer-grid {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		grid-template-rows: auto auto auto;
		gap: var(--spacing-xl);
		justify-items: center;
	}
	
	.footer-brand {
		grid-column: 1/-1;
		grid-row: 1;
		text-align: center;
		width: 100%;
	}
	
	.footer-nav:nth-of-type(1), .footer-nav:nth-of-type(2), .footer-nav:nth-of-type(3) {
		text-align: center;
	}
	
	.footer-nav:nth-of-type(1) {
		grid-column: 1;
		grid-row: 2;
		width: 100%;
	}
	
	.footer-nav:nth-of-type(2) {
		grid-column: 2;
		grid-row: 2;
		width: 100%;
	}
	
	.footer-nav:nth-of-type(3) {
		grid-column: 3;
		grid-row: 2;
		width: 100%;
	}
	
	.footer-nav:nth-of-type(1) .footer-nav-title, .footer-nav:nth-of-type(2) .footer-nav-title, .footer-nav:nth-of-type(3) .footer-nav-title {
		text-align: center;
	}
	
	.footer-nav:nth-of-type(1) .footer-nav-list, .footer-nav:nth-of-type(2) .footer-nav-list, .footer-nav:nth-of-type(3) .footer-nav-list {
		align-items: center;
	}
	
	.footer-contact-form {
		grid-column: 1/-1;
		grid-row: 3;
		width: 100%;
		max-width: 600px;
		margin: 0 auto;
	}
}

/* Desktop Layout */
@media (min-width: 1024px) {
	.footer-grid {
		grid-template-columns: 2fr repeat(3, 1fr) 2fr;
		gap: var(--spacing-xl);
	}
	
	.footer-brand {
		text-align: left;
	}
	
	.footer-contact-form {
		max-width: 100%;
		margin: 0;
	}
}

/* Footer Brand */
.footer-logo {
	font-family: var(--font-heading);
	font-size: 36px;
	font-weight: 900;
	color: var(--color-text);
	text-transform: uppercase;
	letter-spacing: 1px;
	margin: 0;
	text-align: center;
	width: 100%;
}

.footer-logo-image {
	max-width: 200px;
	height: auto;
	margin-top: 16px;
	margin-left: auto;
	margin-right: auto;
	display: block;
	opacity: .9;
	object-fit: contain;
}

/* Footer Navigation */
.footer-nav {
	display: flex;
	flex-direction: column;
	gap: var(--spacing-base);
}

.footer-nav-title {
	font-family: var(--font-heading);
	font-size: 16px;
	font-weight: 900;
	color: var(--color-text);
	text-transform: uppercase;
	letter-spacing: 1px;
	margin: 0 0 var(--spacing-xs) 0;
}

.footer-nav-list {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.footer-nav-list li {
	margin: 0;
	line-height: 1.4;
}

.footer-nav-list a {
	font-family: var(--font-body);
	font-size: 16px;
	font-weight: 400;
	color: var(--color-grey-medium);
	text-decoration: none;
	transition: color var(--transition-base);
	display: inline-block;
}

.footer-nav-list a:hover {
	color: var(--color-gold);
}

/* Footer Offices */
.footer-offices {
	width: 100%;
	margin: var(--spacing-base) 0;
	padding-left: 0;
	margin-left: 0;
	padding-top: var(--spacing-base);
	border-top: 2px solid var(--color-border);
}

.footer-offices-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--spacing-md);
}

@media (min-width: 640px) {
	.footer-offices-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (min-width: 1024px) {
	.footer-offices-grid {
		grid-template-columns: repeat(5, 1fr);
	}
}

.footer-office {
	font-family: var(--font-body);
	font-size: 16px;
	color: var(--color-grey-medium);
	line-height: 1.3;
	background: var(--color-overlay-dark);
	padding: 15px;
	border-radius: var(--radius-lg);
	border: 1px solid var(--color-border);
}

.footer-office-reviews {
	color: var(--color-gold);
	font-weight: 600;
	font-size: 16px;
	display: block;
	margin-bottom: 4px;
	margin-top: 2px;
}

.footer-map-embed {
	width: 100%;
	height: 180px;
	border: 0;
	border-radius: var(--radius-md);
	margin-top: var(--spacing-sm);
	filter: grayscale(20%) brightness(.9);
	transition: filter var(--transition-base);
	box-shadow: var(--shadow-sm);
}

.footer-map-embed:hover {
	filter: grayscale(0%) brightness(1);
}

.footer-office strong {
	font-weight: 700;
	color: var(--color-text);
	display: block;
	margin-bottom: 2px;
	font-size: 20px;
	line-height: 1.2;
	text-transform: uppercase;
	letter-spacing: 1px;
}

.footer-office address {
	font-style: normal;
	margin: 0;
	padding: 0;
	line-height: 1.2;
	display: block;
}

/* Footer Contact Form */
.footer-contact-form-header {
	margin-bottom: var(--spacing-base);
}

.footer-contact-form-title {
	font-family: var(--font-heading);
	font-size: 20px;
	font-weight: 900;
	color: var(--color-text);
	text-transform: uppercase;
	letter-spacing: 1px;
	margin: 0;
}

.footer-contact-form-element {
	display: flex;
	flex-direction: column;
	gap: var(--spacing-sm);
	width: 100%;
}

.footer-form-row {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--spacing-sm);
}

@media (min-width: 640px) {
	.footer-form-row {
		grid-template-columns: 1fr 1fr;
	}
}

.footer-contact-form-element input, .footer-contact-form-element textarea {
	background: var(--color-text);
	color: var(--color-background);
	border: none;
	padding: 10px var(--spacing-sm);
	font-family: var(--font-body);
	font-size: 14px;
	width: 100%;
	box-sizing: border-box;
}

.footer-contact-form-element textarea {
	resize: vertical;
	min-height: 80px;
}

.footer-form-consent {
	display: flex;
	flex-direction: column;
	gap: var(--spacing-xs);
}

.footer-form-consent label {
	display: flex;
	align-items: center;
	gap: var(--spacing-xs);
	font-family: var(--font-body);
	font-size: 12px;
	color: var(--color-text);
	cursor: pointer;
}

.footer-form-consent input[type="checkbox"] {
	width: auto;
	cursor: pointer;
}

.footer-consent-disclosure {
	font-family: var(--font-body);
	font-size: 11px;
	font-style: italic;
	color: var(--color-gold);
	margin: 0;
	line-height: 1.4;
}

.footer-contact-submit-button {
	background: var(--color-gold);
	color: var(--color-background);
	border: none;
	padding: 14px var(--spacing-base);
	font-family: var(--font-heading);
	font-size: 16px;
	font-weight: 900;
	text-transform: uppercase;
	letter-spacing: 2px;
	cursor: pointer;
	transition: all var(--transition-base);
	box-shadow: var(--shadow-sm);
	width: 100%;
	box-sizing: border-box;
}

.footer-contact-submit-button:hover {
	background: var(--color-text-light);
	transform: translateY(-2px);
	box-shadow: var(--shadow-md);
}

/* Footer Bottom */
.footer-divider {
	border-bottom: 2px solid var(--color-border);
	margin: var(--spacing-base) 0 var(--spacing-xl) 0;
}

.footer-bottom {
	display: flex;
	flex-direction: column;
	gap: var(--spacing-base);
	align-items: flex-start;
	padding: var(--spacing-base) var(--container-padding);
	margin: 0 calc(var(--container-padding) * -1);
	background: transparent;
	width: calc(100% + var(--container-padding) * 2);
	box-sizing: border-box;
}

@media (min-width: 768px) {
	.footer-bottom {
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
	}
}

.footer-copyright {
	font-family: var(--font-body);
	font-size: 16px;
	color: var(--color-grey-medium);
}

.footer-copyright p {
	margin: 0;
}

.footer-disclaimer-wrapper {
	width: 100%;
	margin-top: var(--spacing-sm);
	text-align: left;
	padding-left: 0;
	margin-left: 0;
}

.footer-disclaimer {
	font-family: var(--font-body);
	font-size: 17px;
	font-style: italic;
	font-weight: 400;
	color: var(--color-gold);
	margin: 0;
	text-align: left;
}

/* Footer Links */
.footer-links {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--spacing-base);
}

.footer-legal-nav {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 24px;
}

.footer-legal-nav a {
	font-family: var(--font-body);
	font-size: 16px;
	font-weight: 400;
	color: var(--color-grey-medium);
	text-decoration: none;
	transition: color var(--transition-base);
}

.footer-legal-nav a:hover {
	color: var(--color-gold);
}

/* Footer Social */
.footer-social {
	display: flex;
	align-items: center;
	gap: 16px;
}

.footer-social nav {
	display: flex;
	align-items: center;
	gap: 16px;
}

.footer-social a {
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--color-grey-medium);
	transition: color var(--transition-base);
	text-decoration: none;
}

.footer-social a:hover {
	color: var(--color-gold);
}

.social-icon {
	width: 20px;
	height: 20px;
	display: block;
}

@media (min-width: 768px) {
	.footer-links {
		gap: 24px;
	}
	
	.footer-social {
		padding-left: 16px;
		border-left: 1px solid var(--color-border);
	}
}

/* =============================================================================
   5. BADGE CAROUSEL
   ============================================================================= */
.badge-carousel-section {
	background: transparent;
	padding: var(--spacing-base) 0;
	padding-bottom: var(--header-height);
	margin: 0;
	overflow: hidden;
	width: 100%;
}

.badge-carousel-header {
	text-align: center;
	margin-bottom: var(--spacing-xl);
}

.badge-carousel-label {
	font-family: var(--font-heading);
	font-size: 28px;
	font-weight: 700;
	color: var(--color-text);
	text-transform: uppercase;
	letter-spacing: 4px;
	margin-bottom: var(--spacing-sm);
}

.badge-carousel-title {
	font-family: var(--font-heading);
	font-size: 48px;
	font-weight: 900;
	color: var(--color-text);
	text-transform: uppercase;
	letter-spacing: 4px;
	margin: 0 0 var(--spacing-md);
	text-shadow: 0 2px 8px var(--color-overlay-darker);
}

.badge-carousel-description {
	font-family: var(--font-body);
	font-size: 18px;
	color: var(--color-text);
	line-height: 1.6;
	max-width: 900px;
	margin: 0 auto;
}

.badge-carousel-description a {
	color: var(--color-gold);
	font-weight: 700;
	text-decoration: underline;
}

.badge-carousel-container {
	width: 100%;
	overflow: hidden;
	position: relative;
	padding: 0;
}

.badge-carousel-track {
	display: flex;
	gap: var(--spacing-md);
	align-items: center;
	will-change: transform;
}

.badge-item {
	flex-shrink: 0;
	width: 200px;
	height: auto;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--color-overlay-darker);
	padding: var(--spacing-md);
	border-radius: var(--radius-lg);
	border: 1px solid var(--color-border-hover);
	transition: all var(--transition-base);
	margin: 0;
}

.badge-item:hover {
	background: var(--color-border);
	border-color: var(--color-gold);
	transform: translateY(-4px);
	box-shadow: var(--shadow-lg);
}

.badge-item img {
	width: 100%;
	height: auto;
	display: block;
	filter: brightness(.95);
	transition: filter var(--transition-base);
}

.badge-item:hover img {
	filter: brightness(1.1);
}

.badge-carousel-footer {
	text-align: center;
	margin-top: var(--spacing-xl);
	padding-top: var(--spacing-base);
}

.badge-certified-by {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 15px;
	font-family: var(--font-body);
	font-size: 16px;
	color: var(--color-grey-medium);
	text-transform: uppercase;
	letter-spacing: 1px;
	margin: 0;
}

.topverdict-logo {
	height: 32px;
	width: auto;
	filter: brightness(.9);
	transition: filter var(--transition-base);
}

.topverdict-logo:hover {
	filter: brightness(1.1);
}

/* Badge Carousel Mobile */
@media (max-width: 768px) {
	.badge-carousel-title {
		font-size: 32px;
	}
	
	.badge-carousel-container {
		padding: 0 25px;
	}
	
	.badge-item {
		width: 150px;
		padding: 15px;
	}
}

/* =============================================================================
   6. PAGE CONTENT COMPONENTS
   ============================================================================= */

/* -----------------------------------------------------------------------------
   Hero Section
   ----------------------------------------------------------------------------- */

/* Reset Elementor container defaults for our content */
.elementor-widget-container .md-container, .elementor-widget-container main.md-container {
	display: block !important;
}

.hero-section-new, body .hero-section-new, .elementor-widget-container .hero-section-new, .elementor-widget-container section.hero-section-new {
	display: grid !important;
	grid-template-columns: 1fr 1fr !important;
	gap: 60px !important;
	align-items: center !important;
	padding: 60px 0 !important;
	min-height: 400px !important;
	width: 100% !important;
}

.hero-content-left, body .hero-content-left {
	display: flex !important;
	flex-direction: column !important;
	gap: 0 !important;
}

.hero-label, body .hero-label, .elementor-widget-container .hero-label {
	font-family: "Oswald", sans-serif !important;
	font-size: 32px !important;
	font-weight: 400 !important;
	color: #fff !important;
	text-transform: uppercase !important;
	letter-spacing: 4px !important;
	margin: 0 0 15px 0 !important;
}

.hero-main-headline, body .hero-main-headline, .elementor-widget-container .hero-main-headline {
	font-family: "Oswald", sans-serif !important;
	font-size: 120px !important;
	font-weight: 900 !important;
	color: #fff !important;
	text-transform: uppercase !important;
	letter-spacing: 4px !important;
	line-height: 1 !important;
	margin: 0 0 30px 0 !important;
}

.hero-separator, body .hero-separator {
	display: flex !important;
	align-items: center !important;
	gap: 12px !important;
	margin: 20px 0 !important;
}

.separator-line, body .separator-line {
	flex: 1 !important;
	height: 1px !important;
	background: rgba(255, 255, 255, .08) !important;
}

.hero-separator svg, body .hero-separator svg {
	color: #d4a853 !important;
	flex-shrink: 0 !important;
}

.hero-tagline, body .hero-tagline, body h1.hero-tagline, .elementor-widget-container h1.hero-tagline {
	font-family: "Oswald", sans-serif !important;
	font-size: 80px !important;
	font-weight: 900 !important;
	color: #c1aa85 !important;
	margin: 0 !important;
	text-transform: uppercase !important;
	letter-spacing: 2px !important;
}

.hero-image-right, body .hero-image-right, body figure.hero-image-right {
	display: flex !important;
	justify-content: center !important;
	align-items: center !important;
	margin: 0 !important;
}

.hero-image-right img, body .hero-image-right img {
	max-width: 100% !important;
	height: auto !important;
	display: block !important;
}

.hero-image-flipped, body .hero-image-flipped {
	transform: scaleX(-1) !important;
}

@media (max-width: 768px) {
	.hero-section-new {
		grid-template-columns: 1fr;
		text-align: center;
	}
	
	.hero-label {
		font-size: 20px !important;
	}
	
	.hero-main-headline {
		font-size: 60px !important;
	}
	
	.hero-tagline {
		font-size: 40px !important;
	}
	
	.hero-image-right {
		order: -1;
	}
}

/* -----------------------------------------------------------------------------
   Intro/Hook Section
   ----------------------------------------------------------------------------- */
.intro-hook-section {
	padding: var(--spacing-xl) 0;
	border-bottom: 1px solid var(--color-border);
}

.intro-hook-section p {
	font-family: var(--font-body);
	font-size: 20px;
	line-height: 1.6;
	color: var(--color-text);
	margin: 0 0 var(--spacing-base) 0;
}

.intro-hook-section p:last-child {
	margin-bottom: 0;
}

.intro-hook-section strong {
	color: var(--color-gold);
	font-weight: 700;
}

/* -----------------------------------------------------------------------------
   Table of Contents
   ----------------------------------------------------------------------------- */
.toc-image-container {
	background: var(--color-overlay-dark);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-lg);
	padding: var(--spacing-base);
	margin: var(--spacing-xl) 0;
}

.toc-image-container h3 {
	font-family: var(--font-heading);
	font-size: 20px;
	font-weight: 900;
	color: var(--color-text);
	text-transform: uppercase;
	letter-spacing: 1px;
	margin: 0 0 var(--spacing-sm) 0;
}

.toc-image-container > p {
	font-size: 14px;
	color: var(--color-grey-medium);
	margin: 0 0 var(--spacing-md) 0;
}

.toc-image-container ul {
	list-style: none;
	padding: 0;
	margin: 0;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: var(--spacing-sm);
}

.toc-image-container li {
	margin: 0;
}

.toc-image-container a {
	font-family: var(--font-body);
	font-size: 15px;
	color: var(--color-grey-medium);
	text-decoration: none;
	transition: color var(--transition-fast);
	display: block;
	padding: var(--spacing-xs) 0;
}

.toc-image-container a:hover {
	color: var(--color-gold);
}

@media (max-width: 768px) {
	.toc-image-container ul {
		grid-template-columns: 1fr;
	}
}

/* -----------------------------------------------------------------------------
   Notice/Alert Box (TL;DR summaries)
   ----------------------------------------------------------------------------- */
.notice-box {
	background: linear-gradient(135deg, rgba(193, 170, 133, .08) 0%, rgba(193, 170, 133, .03) 100%);
	border: 1px solid rgba(193, 170, 133, .3);
	border-left: 4px solid var(--color-gold);
	border-radius: var(--radius-md);
	padding: var(--spacing-base);
	margin: var(--spacing-base) 0 var(--spacing-lg) 0;
	position: relative;
}

.notice-box::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: radial-gradient(ellipse at top left, rgba(193, 170, 133, .05) 0%, transparent 50%);
	pointer-events: none;
}

.notice-box-header {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: var(--spacing-md);
}

.notice-box-title {
	font-family: var(--font-heading);
	font-size: 24px;
	font-weight: 700;
	color: var(--color-gold);
	text-transform: uppercase;
	letter-spacing: 2px;
	margin: 0;
}

.notice-box ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.notice-box li {
	font-family: var(--font-body);
	font-size: 17px;
	line-height: 1.6;
	color: var(--color-text);
	padding: 10px 0;
	border-bottom: 1px solid rgba(255, 255, 255, .05);
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 20px;
}

.notice-box li:last-child {
	border-bottom: none;
}

.notice-box .change-name {
	font-weight: 600;
	flex: 1;
}

.notice-box .change-date {
	font-family: var(--font-heading);
	font-size: 14px;
	font-weight: 700;
	color: var(--color-gold);
	text-transform: uppercase;
	letter-spacing: 1px;
	white-space: nowrap;
}

.notice-box .change-impact {
	font-size: 15px;
	color: var(--color-grey-medium);
	margin-top: 4px;
}

@media (max-width: 768px) {
	.notice-box li {
		flex-direction: column;
		gap: 8px;
	}
	
	.notice-box .change-date {
		align-self: flex-start;
	}
}

/* -----------------------------------------------------------------------------
   Content Sections
   ----------------------------------------------------------------------------- */
article > section {
	padding: var(--spacing-xl) 0;
	border-bottom: 1px solid var(--color-border);
}

article > section:last-of-type {
	border-bottom: none;
}

article h2 {
	font-family: var(--font-heading);
	font-size: 40px;
	font-weight: 900;
	color: var(--color-text);
	text-transform: uppercase;
	letter-spacing: 1px;
	margin: 0 0 var(--spacing-base) 0;
}

article h3 {
	font-family: var(--font-heading);
	font-size: 28px;
	font-weight: 700;
	color: var(--color-gold);
	margin: var(--spacing-base) 0 var(--spacing-sm) 0;
}

article p {
	font-family: var(--font-body);
	font-size: 20px;
	line-height: 1.6;
	color: var(--color-text-light);
	margin: 0 0 var(--spacing-base) 0;
}

article ul {
	padding-left: var(--spacing-base);
	margin: 0 0 var(--spacing-md) 0;
}

article li {
	font-family: var(--font-body);
	font-size: 20px;
	line-height: 1.6;
	color: var(--color-text-light);
	margin-bottom: 10px;
}

article a {
	color: var(--color-gold);
	text-decoration: underline;
	transition: color var(--transition-fast);
}

article a:hover {
	color: var(--color-text);
}

/* Speakable highlights */
.speakable {
	font-size: 19px;
	font-weight: 500;
	color: var(--color-text);
}

/* -----------------------------------------------------------------------------
   FAQ Section
   ----------------------------------------------------------------------------- */
.faq-container {
	margin: 0;
	padding: 0;
}

.faq-container > div {
	border-bottom: 1px solid var(--color-border);
}

.faq-container > div:last-child {
	border-bottom: none;
}

.faq-container dt {
	font-family: var(--font-heading);
	font-size: 18px;
	font-weight: 700;
	color: var(--color-text);
	padding: var(--spacing-md) 0;
	cursor: pointer;
	display: flex;
	justify-content: space-between;
	align-items: center;
	transition: color var(--transition-fast);
}

.faq-container dt:hover {
	color: var(--color-gold);
}

.faq-container dt::after {
	content: "+";
	font-size: 24px;
	font-weight: 400;
	color: var(--color-gold);
	flex-shrink: 0;
	margin-left: var(--spacing-md);
}

.faq-container div.open dt::after {
	content: "-";
}

.faq-container dd {
	margin: 0;
	padding: 0 0 var(--spacing-md) 0;
}

.faq-container dd p {
	margin: 0;
}

.faq-disclaimer {
	font-family: var(--font-body);
	font-size: 14px;
	font-style: italic;
	color: var(--color-grey-medium);
	margin-top: var(--spacing-base);
	padding-top: var(--spacing-base);
	border-top: 1px solid var(--color-border);
}

/* -----------------------------------------------------------------------------
   Law Changes Summary Box - Single Column
   ----------------------------------------------------------------------------- */
.law-changes-summary {
	background: #f5f5f0;
	border: 2px solid #1a1a1a;
	border-radius: var(--radius-lg);
	padding: 40px;
	margin: var(--spacing-base) 0 var(--spacing-lg) 0;
	text-align: center;
}

.law-changes-summary .notice-box-header {
	margin-bottom: 30px;
	padding-bottom: 20px;
	border-bottom: 1px solid rgba(0, 0, 0, .15);
}

.law-changes-summary .notice-box-title {
	font-family: var(--font-heading);
	font-size: 36px;
	font-weight: 900;
	color: #000;
	text-transform: uppercase;
	letter-spacing: 3px;
	margin: 0;
}

.law-changes-summary ul {
	list-style: none;
	padding: 0;
	margin: 0;
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 20px;
}

@media (max-width: 1200px) {
	.law-changes-summary ul {
		grid-template-columns: repeat(3, 1fr);
	}
}

@media (max-width: 768px) {
	.law-changes-summary ul {
		grid-template-columns: 1fr;
	}
}

.law-changes-summary li {
	font-family: var(--font-body);
	font-size: 16px;
	line-height: 1.4;
	color: #1a1a1a;
	padding: 20px 15px;
	border: 1px solid rgba(0, 0, 0, .1);
	border-radius: var(--radius-md);
	background: rgba(255, 255, 255, .5);
	text-align: center;
}

.law-changes-summary .change-date {
	font-family: var(--font-heading);
	font-size: 14px;
	font-weight: 700;
	color: #000;
	text-transform: uppercase;
	letter-spacing: 1px;
	display: block;
	margin-bottom: 8px;
}

.law-changes-summary .change-name {
	font-weight: 700;
	font-size: 17px;
	display: block;
	margin-bottom: 8px;
	color: #000;
}

.law-changes-summary .change-impact {
	font-size: 14px;
	color: #333;
	display: block;
	margin-bottom: 8px;
}

.law-changes-summary .change-bill {
	font-size: 13px;
	color: #444;
	font-style: italic;
}

/* -----------------------------------------------------------------------------
   Two-Column Law Changes Grid Layout
   ----------------------------------------------------------------------------- */
.law-changes-grid {
	display: grid;
	grid-template-columns: 1fr 380px;
	gap: 80px;
	align-items: start;
}

.law-changes-content {
	order: 1;
}

.law-changes-sidebar {
	order: 2;
	position: sticky;
	top: 100px;
}

@media (max-width: 1024px) {
	.law-changes-grid {
		grid-template-columns: 1fr;
		gap: 40px;
	}
	
	.law-changes-sidebar {
		order: -1;
		position: static;
	}
}

/* Notice Box - Light Theme */
.notice-box-light {
	background: #f5f5f0;
	border: 2px solid #1a1a1a;
	border-radius: 8px;
	padding: 35px 30px;
	position: relative;
	text-align: center;
}

.notice-box-light .notice-box-header {
	margin-bottom: 30px;
	padding-bottom: 20px;
	border-bottom: 1px solid rgba(0, 0, 0, .15);
}

.notice-box-light .notice-box-title {
	font-family: var(--font-heading);
	font-size: 42px;
	font-weight: 900;
	color: #000;
	text-transform: uppercase;
	letter-spacing: 3px;
	margin: 0;
}

.notice-box-light ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.notice-box-light li {
	font-family: var(--font-body);
	font-size: 22px;
	line-height: 1.5;
	color: #1a1a1a;
	padding: 22px 0;
	border-bottom: 1px solid rgba(0, 0, 0, .1);
	text-align: center;
}

.notice-box-light li:last-child {
	border-bottom: none;
	padding-bottom: 0;
}

.notice-box-light .change-date {
	font-family: var(--font-heading);
	font-size: 22px;
	font-weight: 700;
	color: #000;
	text-transform: uppercase;
	letter-spacing: 1px;
	display: block;
	margin-bottom: 8px;
}

.notice-box-light .change-name {
	font-weight: 700;
	font-size: 28px;
	display: block;
	margin-bottom: 8px;
	color: #000;
}

.notice-box-light .change-impact {
	font-size: 22px;
	color: #333;
	display: block;
	margin-bottom: 8px;
}

.notice-box-light .change-bill {
	font-size: 19px;
	color: #444;
	font-style: italic;
}

.notice-box-sources {
	background: #f5f5f0;
	border: 2px solid #1a1a1a;
	border-radius: 8px;
	padding: 25px;
	margin-top: 25px;
	text-align: left;
}

.notice-box-sources strong {
	font-family: var(--font-heading);
	font-size: 26px;
	font-weight: 900;
	color: #000;
	text-transform: uppercase;
	letter-spacing: 2px;
	display: block;
	margin-bottom: 15px;
}

.notice-box-sources a {
	color: #1a1a1a;
	text-decoration: underline;
	font-size: 20px;
	display: block;
	margin-bottom: 10px;
	line-height: 1.4;
}

.notice-box-sources a:hover {
	color: #000;
}

.notice-box-sources-inline {
	margin-top: 25px;
	padding-top: 20px;
	border-top: 1px solid rgba(0, 0, 0, .15);
	font-size: 15px;
	color: #333;
	text-align: center;
	line-height: 1.8;
}

.notice-box-sources-inline strong {
	font-family: var(--font-heading);
	font-size: 16px;
	font-weight: 700;
	color: #000;
	text-transform: uppercase;
	letter-spacing: 1px;
}

.notice-box-sources-inline a {
	color: #1a1a1a;
	text-decoration: underline;
	font-weight: 500;
}

.notice-box-sources-inline a:hover {
	color: #000;
}

/* -----------------------------------------------------------------------------
   Example Callout Boxes
   ----------------------------------------------------------------------------- */
.example-callout {
	border-left: 2px solid rgba(212, 168, 83, .25);
	border-right: 2px solid rgba(212, 168, 83, .25);
	padding: 20px 25px;
	margin: 20px 0 var(--spacing-base) 0;
	font-style: italic;
	background: rgba(212, 168, 83, .03);
}

.example-callout p {
	font-size: 18px;
	color: var(--color-text-light);
	margin: 0;
	font-style: italic;
}

.example-callout strong {
	color: var(--color-gold);
	font-style: normal;
}

/* -----------------------------------------------------------------------------
   Desktop-Only Images
   ----------------------------------------------------------------------------- */
.desktop-image-placeholder {
	display: none;
}

@media (min-width: 769px) {
	.desktop-image-placeholder[data-desktop-src] {
		display: block;
	}
	
	.desktop-image-placeholder img {
		width: 100%;
		height: auto;
		border-radius: var(--radius-lg);
		margin: var(--spacing-base) 0;
		filter: grayscale(50%);
		opacity: .9;
	}
}

/* -----------------------------------------------------------------------------
   Sidebar Image
   ----------------------------------------------------------------------------- */
.sidebar-image {
	margin-top: var(--spacing-base);
	border-radius: var(--radius-lg);
	overflow: hidden;
}

.sidebar-image img {
	width: 100%;
	height: auto;
	display: block;
	filter: grayscale(60%);
	opacity: .85;
}

/* =============================================================================
   7. PAGE-SPECIFIC OVERRIDES (Minden and similar pages)
   ============================================================================= */

/* -----------------------------------------------------------------------------
   Hero Section - Full Styles with Background
   ----------------------------------------------------------------------------- */
section.hero-section-new {
	display: grid !important;
	grid-template-columns: minmax(0, calc(65% - 30px)) minmax(0, calc(35% - 30px)) !important;
	gap: 60px !important;
	margin: 0 !important;
	padding: 100px 50px 20px 50px !important;
	min-height: 700px !important;
	position: relative !important;
	background-image: url("https://cdn-dekmpl.nitrocdn.com/QSxHQCkwkFNEByddOHGYxYbAjuXYOvVN/assets/images/optimized/rev-62f5a6e/morrisdewett.com/wp-content/uploads/2024/02/MD-WHITE.avif") !important;
	background-size: auto 85% !important;
	background-position: center center !important;
	background-repeat: no-repeat !important;
	background-origin: padding-box !important;
	width: 100% !important;
	max-width: 100% !important;
	box-sizing: border-box !important;
	overflow: visible !important;
	border-left: 2px solid var(--color-gold) !important;
}

section.hero-section-new.nitro-lazy {
	background-image: none !important;
}

section.hero-section-new::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, .92);
	z-index: 0;
}

header.hero-content-left {
	display: flex !important;
	flex-direction: column !important;
	justify-content: center !important;
	position: relative !important;
	z-index: 1 !important;
	min-width: 0 !important;
	max-width: 100% !important;
	box-sizing: border-box !important;
}

p.hero-label {
	font-family: var(--font-heading) !important;
	font-size: 32px !important;
	font-weight: 400 !important;
	color: var(--color-text) !important;
	text-transform: uppercase !important;
	letter-spacing: 4px !important;
	margin-bottom: 15px !important;
}

p.hero-main-headline {
	font-family: var(--font-heading) !important;
	font-size: 120px !important;
	font-weight: 900 !important;
	color: var(--color-text) !important;
	text-transform: uppercase !important;
	letter-spacing: 4px !important;
	line-height: 1 !important;
	margin: 0 0 30px 0 !important;
}

p.hero-separator {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	margin: 30px auto !important;
	gap: 15px !important;
	max-width: 800px !important;
	width: 100% !important;
}

.separator-line {
	flex: 1 !important;
	height: 1px !important;
	background: rgba(255, 255, 255, .3) !important;
}

p.hero-separator svg {
	width: 20px !important;
	height: 20px !important;
	color: var(--color-text) !important;
	flex-shrink: 0 !important;
}

h1.hero-tagline {
	font-family: var(--font-heading) !important;
	font-size: 80px !important;
	font-weight: 900 !important;
	color: var(--color-gold) !important;
	text-transform: uppercase !important;
	letter-spacing: 4px !important;
	line-height: 1.2 !important;
	margin: 30px 0 0 0 !important;
}

figure.hero-image-right {
	position: absolute !important;
	bottom: 0 !important;
	right: 0 !important;
	width: auto !important;
	height: 88% !important;
	z-index: 1 !important;
	margin: 0 !important;
	padding: 0 !important;
	line-height: 0 !important;
	display: flex !important;
	align-items: flex-end !important;
	justify-content: flex-end !important;
}

.hero-image-flipped {
	width: auto !important;
	height: 100% !important;
	object-fit: contain !important;
	object-position: bottom right !important;
	transform: scaleX(-1) !important;
	display: block !important;
}

@media (max-width: 768px) {
	section.hero-section-new {
		grid-template-columns: 1fr !important;
		gap: 40px !important;
		padding: var(--spacing-base) !important;
	}
	
	p.hero-main-headline {
		font-size: 48px !important;
	}
	
	h1.hero-tagline {
		font-size: 32px !important;
	}
	
	figure.hero-image-right {
		position: relative !important;
		width: 100% !important;
		height: 400px !important;
		margin-top: 40px !important;
	}
	
	figure.hero-image-right .hero-image-flipped {
		width: 100% !important;
		height: 100% !important;
		object-fit: contain !important;
		object-position: center bottom !important;
	}
}

/* -----------------------------------------------------------------------------
   Intro Hook Section
   ----------------------------------------------------------------------------- */
.intro-hook-section {
	background: rgba(0, 0, 0, .92) !important;
	padding: 100px 50px 60px 50px !important;
	margin: 0 !important;
	position: relative !important;
	border-bottom: 2px solid rgba(255, 255, 255, .08) !important;
	border-left: 2px solid var(--color-gold) !important;
}

.intro-hook-section p {
	font-family: var(--font-body) !important;
	font-size: 22px !important;
	line-height: 1.7 !important;
	color: var(--color-text) !important;
	margin-bottom: 24px !important;
	font-weight: 400 !important;
}

.intro-hook-section p.speakable {
	font-size: 24px !important;
	font-weight: 600 !important;
	color: var(--color-text-light) !important;
	line-height: 1.6 !important;
}

.intro-hook-section strong {
	font-weight: 700 !important;
	color: var(--color-gold) !important;
}

@media (max-width: 768px) {
	.intro-hook-section {
		padding: var(--spacing-lg) var(--spacing-base) !important;
	}
	
	.intro-hook-section p {
		font-size: 18px !important;
	}
	
	.intro-hook-section p.speakable {
		font-size: 20px !important;
	}
}

/* -----------------------------------------------------------------------------
   Table of Contents - Card Grid Style
   ----------------------------------------------------------------------------- */
nav.toc-image-container {
	background: rgba(255, 255, 255, .03) !important;
	padding: var(--spacing-lg) var(--spacing-base) !important;
	margin: 60px auto !important;
	max-width: 80% !important;
	contain: layout style paint !important;
	border: 2px solid rgba(255, 255, 255, .15) !important;
	border-radius: 12px !important;
	position: relative !important;
	z-index: 2 !important;
	box-shadow: 0 8px 32px rgba(0, 0, 0, .3), 0 0 0 1px rgba(255, 255, 255, .05) inset !important;
}

nav.toc-image-container h3 {
	margin: 0 0 12px 0 !important;
	color: var(--color-text-light) !important;
	font-size: 28px !important;
	font-weight: 900 !important;
	letter-spacing: 2px !important;
	text-transform: uppercase !important;
	text-align: left !important;
	padding-top: 0 !important;
	padding-bottom: 0 !important;
	border-bottom: none !important;
	position: relative !important;
	text-shadow: 0 2px 8px rgba(0, 0, 0, .5) !important;
}

nav.toc-image-container > p {
	margin: 0 0 var(--spacing-lg) 0 !important;
	color: var(--color-text) !important;
	font-size: 20px !important;
	font-family: var(--font-body) !important;
	font-weight: 400 !important;
	line-height: 1.6 !important;
	text-align: left !important;
}

nav.toc-image-container ul {
	list-style: none !important;
	padding: 0 !important;
	margin: 0 !important;
	display: grid !important;
	grid-template-columns: repeat(4, 1fr) !important;
	gap: 12px !important;
}

nav.toc-image-container li {
	margin: 0 !important;
	padding: 0 !important;
}

nav.toc-image-container a {
	color: var(--color-text-light) !important;
	font-weight: 500 !important;
	font-size: 16px !important;
	text-decoration: none !important;
	transition: all .2s ease !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	padding: 40px 24px !important;
	height: 112px !important;
	width: 100% !important;
	background: rgba(255, 255, 255, .05) !important;
	border: 1px solid rgba(255, 255, 255, .1) !important;
	border-radius: 8px !important;
	position: relative !important;
	line-height: 1.4 !important;
	margin-bottom: 0 !important;
	box-sizing: border-box !important;
	word-wrap: break-word !important;
	overflow-wrap: break-word !important;
	text-align: center !important;
}

nav.toc-image-container a:hover, nav.toc-image-container a:focus {
	color: #000 !important;
	background: #f5f5f5 !important;
	border-color: rgba(255, 255, 255, .3) !important;
	text-decoration: none !important;
	transform: translateY(-2px) !important;
	box-shadow: 0 4px 12px rgba(0, 0, 0, .15) !important;
}

@media (min-width: 769px) {
	nav.toc-image-container {
		padding: 50px 50px !important;
	}
	
	nav.toc-image-container h3 {
		font-size: 32px !important;
		margin-bottom: 16px !important;
		letter-spacing: 3px !important;
	}
	
	nav.toc-image-container a {
		font-size: 16px !important;
		padding: 24px 20px !important;
		height: 80px !important;
	}
}

@media (max-width: 768px) {
	nav.toc-image-container ul {
		grid-template-columns: 1fr !important;
	}
}

/* -----------------------------------------------------------------------------
   FAQ Section - Accordion Style
   ----------------------------------------------------------------------------- */
#frequently-asked-questions {
	background: rgba(0, 0, 0, .3) !important;
	padding: var(--spacing-base) !important;
	border-radius: 4px !important;
	border-top: 1px solid rgba(255, 255, 255, .4) !important;
	border-bottom: 1px solid rgba(255, 255, 255, .4) !important;
	max-width: 80% !important;
	margin-left: auto !important;
	margin-right: auto !important;
}

#frequently-asked-questions h2 {
	margin-top: 0 !important;
	padding-top: var(--spacing-base) !important;
}

#frequently-asked-questions dl.faq-container {
	margin: var(--spacing-lg) 0 !important;
	padding: 0 !important;
	background: transparent !important;
	display: grid !important;
	grid-template-columns: 1fr !important;
	gap: 0 !important;
	contain: layout style !important;
	position: relative !important;
}

#frequently-asked-questions dl.faq-container > div {
	border-top: 1px solid rgba(255, 255, 255, .1) !important;
	padding: var(--spacing-base) 0 !important;
	transition: all .3s ease !important;
}

#frequently-asked-questions dl.faq-container > div:first-child {
	border-top: none !important;
	padding-top: 0 !important;
}

#frequently-asked-questions dt {
	font-family: var(--font-body) !important;
	font-size: 18px !important;
	font-weight: 600 !important;
	color: var(--color-text) !important;
	margin: 0 !important;
	padding: 12px 16px !important;
	cursor: pointer !important;
	transition: all .2s ease !important;
	border-radius: 8px !important;
	position: relative !important;
	padding-right: 50px !important;
}

#frequently-asked-questions dt::after {
	content: "+" !important;
	position: absolute !important;
	right: 16px !important;
	top: 50% !important;
	transform: translateY(-50%) !important;
	width: 32px !important;
	height: 32px !important;
	border-radius: 50% !important;
	background: rgba(255, 255, 255, .1) !important;
	color: var(--color-grey-medium) !important;
	font-size: 20px !important;
	font-weight: 300 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	transition: all .2s ease !important;
}

#frequently-asked-questions dt:hover {
	color: #000 !important;
	background: #f5f5f5 !important;
}

#frequently-asked-questions dt:hover::after {
	background: rgba(0, 0, 0, .15) !important;
	color: #000 !important;
}

#frequently-asked-questions dl.faq-container > div.open dt {
	color: #000 !important;
	background: #f5f5f5 !important;
}

#frequently-asked-questions dl.faq-container > div.open dt::after {
	content: "-" !important;
	background: rgba(0, 0, 0, .15) !important;
	color: #000 !important;
	font-weight: 600 !important;
}

#frequently-asked-questions dl.faq-container > div.open {
	background: #f5f5f5 !important;
	border-radius: 8px !important;
	padding: var(--spacing-base) !important;
	margin-top: 8px !important;
}

#frequently-asked-questions dd {
	margin: 0 !important;
	padding: var(--spacing-base) 16px 0 !important;
	background: transparent !important;
	border-left: none !important;
	display: none !important;
}

#frequently-asked-questions dl.faq-container > div.open dd {
	display: block !important;
}

#frequently-asked-questions dd p {
	color: #333 !important;
	line-height: 1.6 !important;
	margin: 0 !important;
}

@media (min-width: 769px) {
	#frequently-asked-questions dl.faq-container {
		grid-template-columns: repeat(2, 1fr) !important;
		gap: 0 !important;
		column-gap: var(--spacing-lg) !important;
	}
	
	#frequently-asked-questions dl.faq-container > div {
		padding: var(--spacing-base) !important;
	}
}

#frequently-asked-questions .faq-disclaimer {
	margin-top: var(--spacing-base) !important;
	padding-bottom: var(--spacing-base) !important;
	font-size: 14px !important;
	color: var(--color-grey-medium) !important;
	font-style: italic !important;
	text-align: center !important;
}