/*
Theme Name: LGD2026
Theme URI: https://lovablegazelle.com/
Description: A child theme for Ollie.
Author: LGD Team
Author URI: https://lovablegazelle.com/
Template:     ollie
Version: 1.0.1
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Tags:         blog, portfolio, entertainment, grid-layout, one-column, two-columns, three-columns, four-columns, block-patterns, block-styles, custom-logo, custom-menu, editor-style, featured-images, full-site-editing, full-width-template, rtl-language-support, style-variations, template-editing, theme-options, translation-ready, wide-blocks
Text Domain: lgd2026
*/

/* =============================================
   Screen Reader Text — visually hidden but accessible
   ============================================= */
.screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	width: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
}

/* =============================================
   CTA Bar — Mobile: 50/50 buttons, no labels
   Targets .lgd-cta-bar on the inner flex row.
   ============================================= */
@media (max-width: 782px) {
	/* 50/50 side-by-side buttons */
	.lgd-cta-bar,
	.lgd-cta-bar.is-layout-flex {
		flex-direction: row !important;
		flex-wrap: nowrap !important;
		gap: 8px !important;
		padding: 8px 12px !important;
		justify-content: center !important;
	}

	/* Each button group: equal width */
	.lgd-cta-bar > .wp-block-group {
		flex: 1 1 0% !important;
		min-width: 0 !important;
		display: flex !important;
		justify-content: center;
		align-items: center;
	}

	/* Hide text labels on mobile */
	.lgd-cta-bar > .wp-block-group > .has-x-small-font-size,
	.lgd-cta-bar > .wp-block-group > p.has-x-small-font-size {
		display: none !important;
	}

	/* Kill any border-color classes leaking from block editor */
	.lgd-cta-bar .wp-block-buttons,
	.lgd-cta-bar .wp-block-buttons.has-border-color {
		width: 100%;
		border: none !important;
	}
	.lgd-cta-bar .wp-block-button {
		width: 100%;
	}
	.lgd-cta-bar .wp-block-button__link {
		width: 100%;
		display: flex !important;
		justify-content: center;
		align-items: center;
		gap: 6px;
		background: rgba(255, 255, 255, 0.15) !important;
		border: 1px solid rgba(255, 255, 255, 0.3) !important;
		border-radius: 5px !important;
		box-shadow: none !important;
		padding: 8px 12px !important;
		font-size: 0.75rem !important;
		font-weight: 700;
		line-height: 1.2;
		color: #fff !important;
		text-decoration: none;
	}

	/* Button hover on mobile */
	.lgd-cta-bar .wp-block-button__link:active {
		background: rgba(255, 255, 255, 0.25) !important;
	}

	/* Keep icons small */
	.lgd-cta-bar .wp-block-button__link-icon {
		width: 0.85em !important;
		height: 0.85em !important;
	}
}

/* Kill pink border on CTA bar buttons at all sizes */
.lgd-cta-bar .wp-block-buttons.has-border-color,
.lgd-cta-bar .wp-block-buttons.has-primary-border-color {
	border: none !important;
}

/* Navigation styling is managed by the Ollie Menu Designer plugin. */

/* =============================================
   Skip Navigation Link
   ============================================= */
.lgd-skip-link {
	position: absolute;
	left: -9999px;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
	z-index: 9999;
	padding: 0.75rem 1.5rem;
	background: #000;
	color: #fff;
	font-size: 1rem;
	font-weight: 600;
	text-decoration: none;
	border: 2px solid #FF00AA;
	border-radius: 4px;
}

.lgd-skip-link:focus {
	position: fixed;
	top: 8px;
	left: 8px;
	width: auto;
	height: auto;
	overflow: visible;
}

/* =============================================
   Header/Nav Polish (Menu Designer friendly)
   Improves ergonomics and accessibility without
   overriding Menu Designer's color/theme system.
   ============================================= */
.lgd-site-header {
	z-index: 100;
}

.lgd-site-header-nav-wrap {
	border-bottom: 1px solid var(--wp--preset--color--border-dark, #1A0011);
}

.lgd-site-header .wp-block-navigation .wp-block-navigation-item__content {
	min-height: 44px;
	display: inline-flex;
	align-items: center;
}

.lgd-site-header a:focus-visible,
.lgd-site-header button:focus-visible,
.lgd-mobile-menu a:focus-visible,
.lgd-mobile-menu button:focus-visible {
	outline: 2px solid #ffffff;
	outline-offset: 2px;
	border-radius: 4px;
}

.lgd-mobile-menu .wp-block-button__link {
	min-height: 44px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.wp-block-ollie-mega-menu__menu-container p a,
.lgd-mobile-menu p a {
	text-underline-offset: 3px;
	text-decoration-thickness: 1px;
}

.wp-block-ollie-mega-menu__menu-container p a:hover,
.wp-block-ollie-mega-menu__menu-container p a:focus-visible,
.lgd-mobile-menu p a:hover,
.lgd-mobile-menu p a:focus-visible {
	text-decoration: underline;
}

@media (prefers-reduced-motion: reduce) {
	* {
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
	}

	.wp-block-button .wp-block-button__link:hover,
	.wp-block-group:hover,
	.wp-block-cover img:hover {
		transform: none !important;
	}
}

/* =============================================
   Mobile Nav Flyout — iPhone Fit + Spacing
   Ensures bottom CTAs/social are fully visible
   and trims vertical density for small screens.
   ============================================= */
@media (max-width: 1024px) {
	body.has-modal-open .lgd-sticky-contact {
		display: none !important;
	}

	body.has-modal-open {
		padding-bottom: 0 !important;
	}

	.wp-block-navigation__responsive-container.is-menu-open {
		max-height: 100dvh;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
		padding-bottom: calc(12px + env(safe-area-inset-bottom));
	}

	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
		align-items: stretch;
		justify-content: flex-start;
		min-height: 100%;
		padding-bottom: calc(var(--wp--preset--spacing--large) + env(safe-area-inset-bottom));
	}

	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
		position: sticky;
		top: max(8px, env(safe-area-inset-top));
		z-index: 3;
	}

	.wp-block-navigation__responsive-container.is-menu-open .lgd-mobile-menu {
		gap: var(--wp--preset--spacing--small) !important;
		padding-bottom: calc(var(--wp--preset--spacing--x-large) + env(safe-area-inset-bottom));
	}

	.wp-block-navigation__responsive-container.is-menu-open .lgd-mobile-menu > .wp-block-group:not(.wp-block-social-links):not(.wp-block-buttons) {
		padding-top: var(--wp--preset--spacing--small) !important;
		padding-bottom: var(--wp--preset--spacing--small) !important;
	}

	.wp-block-navigation__responsive-container.is-menu-open .lgd-mobile-menu p.has-base-font-size {
		margin-top: 0.35rem;
		margin-bottom: 0.35rem;
		line-height: 1.35;
	}

	.wp-block-navigation__responsive-container.is-menu-open .lgd-mobile-menu .wp-block-separator {
		margin-top: 0.5rem !important;
		margin-bottom: 0.5rem !important;
	}

	.wp-block-navigation__responsive-container.is-menu-open .lgd-mobile-menu .wp-block-buttons + .wp-block-buttons {
		margin-top: 0.45rem;
	}

	.wp-block-navigation__responsive-container.is-menu-open .lgd-mobile-menu .wp-block-social-links {
		margin-top: var(--wp--preset--spacing--small) !important;
		padding-bottom: calc(var(--wp--preset--spacing--medium) + env(safe-area-inset-bottom));
	}
}

/* =============================================
   Footer — Stack + center everything on mobile
   ============================================= */
/* Sitewide: flush header→hero, section→section, and pre-footer gaps
   caused by template block-gap + trailing block margins. */
body .wp-site-blocks > * + * {
	margin-top: 0 !important;
	margin-block-start: 0 !important;
}

/* Remove gaps between full-width sections inside page content */
main.site-content > .wp-block-post-content > .alignfull + .alignfull,
main.site-content > .wp-block-post-content > .wp-block-cover + *,
main.site-content > .wp-block-post-content > * + .wp-block-cover,
main.wp-block-group > .alignfull + .alignfull,
main.wp-block-group > .wp-block-cover + *,
main.wp-block-group > * + .wp-block-cover {
	margin-block-start: 0 !important;
}

body main.site-content {
	margin-bottom: 0 !important;
	padding-bottom: 0 !important;
}

body main.site-content > .wp-block-post-content > :last-child,
body main.site-content > :last-child {
	margin-bottom: 0 !important;
}

/* Last content band should sit directly against footer sitewide. */
main .wp-block-post-content > :last-child,
main .wp-block-post-content > .alignfull:last-child,
main .wp-block-post-content > .wp-block-group.alignfull:last-child,
main .wp-block-post-content > section.alignfull:last-child {
	margin-bottom: 0 !important;
}

main .wp-block-post-content > :last-child > :last-child {
	margin-bottom: 0 !important;
}

/* Keep the final band flush to footer while preserving
   internal breathing room if block markup sets 0 bottom padding. */
main .wp-block-post-content > .alignfull:last-child[style*="padding-bottom:0"],
main .wp-block-post-content > .wp-block-group.alignfull:last-child[style*="padding-bottom:0"] {
	padding-bottom: var(--wp--preset--spacing--x-large) !important;
}

@media (max-width: 782px) {
	/* All footer content: center text */
	footer .wp-block-group,
	footer .wp-block-column {
		text-align: center;
	}

	/* Footer columns: stack vertically */
	footer .wp-block-columns {
		flex-direction: column !important;
		gap: var(--wp--preset--spacing--large);
	}

	/* Center the logo */
	footer .wp-block-site-logo {
		display: flex;
		justify-content: center;
	}

	/* Center social icons */
	footer .wp-block-social-links {
		justify-content: center !important;
	}

	/* Footer subnav row: stack + center */
	footer .wp-block-group.is-layout-flex:has(> .has-small-font-size) {
		flex-direction: column !important;
		align-items: center !important;
		gap: var(--wp--preset--spacing--small);
	}

	/* Links row within subnav */
	footer .wp-block-group.is-layout-flex:has(> .has-small-font-size) > .wp-block-group {
		flex-wrap: wrap !important;
		justify-content: center !important;
		gap: 4px 12px;
	}
}

/* =============================================
   Sticky Contact Footer
   ============================================= */
/* Base — visible on all screen sizes */
body:not(.wp-admin) {
	padding-bottom: 48px;
}

.lgd-sticky-contact {
	display: flex;
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 999;
	background: linear-gradient(to bottom, #FF00AA 0%, #000 100%);
	border-top: 2px solid #000;
	justify-content: center;
	align-items: stretch;
	height: 48px;
}

.lgd-sticky-contact a {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	color: var(--wp--preset--color--base, #fff);
	text-decoration: none;
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.02em;
	padding: 0 32px;
	transition: background 0.2s;
}

.lgd-sticky-contact a:hover,
.lgd-sticky-contact a:active {
	background: var(--wp--preset--color--primary, #FF00AA);
	color: var(--wp--preset--color--base, #fff);
}

.lgd-sticky-contact a + a {
	border-left: 2px solid rgba(255, 255, 255, 0.25);
}

.lgd-sticky-contact svg {
	width: 18px;
	height: 18px;
	fill: currentColor;
}

/* Desktop: horizontal row, icons + labels side by side */
@media (min-width: 783px) {
	.lgd-sticky-contact a {
		font-size: 0.8rem;
		padding: 0 40px;
	}
}

/* Mobile: equal-width columns, stacked icon + label */
@media (max-width: 782px) {
	body:not(.wp-admin) {
		padding-bottom: 56px;
	}

	.lgd-sticky-contact {
		height: 56px;
		justify-content: stretch;
	}

	.lgd-sticky-contact a {
		flex: 1;
		flex-direction: column;
		gap: 2px;
		font-size: 0.65rem;
		padding: 0;
	}

	.lgd-sticky-contact svg {
		width: 20px;
		height: 20px;
	}
}

/* =============================================
   Design Refresh — Hover Effects & Transitions
   ============================================= */

/* Button hover: lift + smooth transitions */
.wp-block-button__link {
	transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease, filter 0.2s ease;
}
.wp-block-button__link:hover {
	transform: translateY(-2px);
}
/* Gradient brand buttons: pink glow on hover */
.is-style-gradient-brand-shadow .wp-block-button__link:hover,
.is-style-gradient-brand .wp-block-button__link:hover {
	box-shadow: 0 8px 25px rgba(255, 0, 170, 0.4);
}
/* Outline buttons: fill with subtle pink on hover */
.is-style-outline .wp-block-button__link:hover {
	background: rgba(255, 0, 170, 0.08) !important;
}

/* Card hover lift — column-box-shadow Ollie block style */
.is-style-column-box-shadow {
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.is-style-column-box-shadow:hover {
	transform: translateY(-4px);
	box-shadow: var(--wp--preset--shadow--medium-dark) !important;
}
/* lgd-card, lgd-testimonial-card → moved to Class Manager */

/* Blockquotes & pullquotes: pink left-border accent (default) */
.wp-block-quote,
.wp-block-pullquote {
	border-left: 4px solid var(--wp--preset--color--primary, #FF00AA) !important;
	border-top: none !important;
	border-right: none !important;
	border-bottom: none !important;
	padding-left: var(--wp--preset--spacing--medium);
}

/* Single Post — Dramatic Blockquotes (black bg, white text, pink border) */
.single-post .wp-block-quote {
	background: #000;
	color: #fff;
	padding: 2rem 2rem 2rem 2.5rem;
	border-radius: 0 5px 5px 0;
	position: relative;
	margin: 2rem 0;
}
.single-post .wp-block-quote::before {
	content: "\275D";
	position: absolute;
	top: -0.5rem;
	left: 1rem;
	font-size: 3rem;
	color: var(--wp--preset--color--primary, #FF00AA);
	line-height: 1;
}
.single-post .wp-block-quote p {
	color: #fff;
}
.single-post .wp-block-quote cite {
	color: var(--wp--preset--color--pink-light, #FF80D5);
}

/* Single Post — Gradient Horizontal Rules */
.single-post .wp-block-separator {
	border: none !important;
	height: 3px !important;
	background: linear-gradient(to right, #000, var(--wp--preset--color--primary, #FF00AA)) !important;
	opacity: 1 !important;
}

/* Single Post Hero — Title readability */
.single-post .wp-block-cover .wp-block-post-title {
	text-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
}

/* Social Share Bar */
.lgd-social-share {
	display: flex;
	gap: 0.5rem;
	justify-content: center;
	padding: 1rem 0;
	flex-wrap: wrap;
}
.lgd-social-share a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: var(--wp--preset--color--tertiary, #FFD6E9);
	color: var(--wp--preset--color--main, #000);
	text-decoration: none;
	transition: background 0.2s, color 0.2s, transform 0.2s;
}
.lgd-social-share a:hover {
	background: var(--wp--preset--color--primary, #FF00AA);
	color: #fff;
	transform: translateY(-2px);
}

/* Author Box — stack on mobile */
@media (max-width: 782px) {
	.single-post [data-metadata-name="Author Card"].is-layout-flex {
		flex-direction: column !important;
		align-items: center !important;
		text-align: center;
	}
	.single-post [data-metadata-name="Author Card"] .wp-block-avatar {
		margin-bottom: var(--wp--preset--spacing--small);
	}
	.single-post [data-metadata-name="Author Card"] .wp-block-social-links {
		justify-content: center;
	}
}

/* Cover blocks: subtle image zoom on hover */
.wp-block-cover {
	overflow: hidden;
}
.wp-block-cover img {
	transition: transform 0.4s ease;
}
.wp-block-cover:hover img {
	transform: scale(1.03);
}

/* lgd-accent-card → moved to Class Manager */

/* =============================================
   Feature Spotlights — White text on gradient bgs
   ============================================= */
.has-black-pink-accent-gradient-background,
.has-black-gradient-background,
.has-hot-pink-dark-gradient-background {
	color: var(--wp--preset--color--base, #fff);
}

.has-black-pink-accent-gradient-background h2,
.has-black-pink-accent-gradient-background h3,
.has-black-pink-accent-gradient-background p,
.has-black-gradient-background h2,
.has-black-gradient-background h3,
.has-black-gradient-background p,
.has-hot-pink-dark-gradient-background h2,
.has-hot-pink-dark-gradient-background h3,
.has-hot-pink-dark-gradient-background p {
	color: var(--wp--preset--color--base, #fff);
}

/* Override main-accent (near-black) text on dark gradient backgrounds */
.has-black-pink-accent-gradient-background .has-main-accent-color,
.has-black-gradient-background .has-main-accent-color,
.has-hot-pink-dark-gradient-background .has-main-accent-color,
.has-black-pink-accent-gradient-background p.has-main-accent-color,
.has-black-gradient-background p.has-main-accent-color,
.has-hot-pink-dark-gradient-background p.has-main-accent-color {
	color: rgba(255, 255, 255, 0.8) !important;
}

/* Keep pink accent on <mark> highlights inside headings
   (these sit over the dark end of gradients, so pink works) */
.has-black-pink-accent-gradient-background .has-inline-color.has-primary-color,
.has-black-gradient-background .has-inline-color.has-primary-color,
.has-black-gradient-background .has-primary-color,
.has-black-pink-accent-gradient-background mark.has-primary-color {
	color: var(--wp--preset--color--primary, #FF00AA) !important;
}

/* Eyebrow labels on gradients that START pink — force white.
   hot-pink-dark goes #FF00AA → #CC00AA → #000. The eyebrow
   sits at the top where the bg is pink, so pink text = invisible. */
.has-hot-pink-dark-gradient-background > .wp-block-columns p.has-primary-color.has-x-small-font-size,
.has-hot-pink-dark-gradient-background p.has-primary-color.has-x-small-font-size[style*="text-transform:uppercase"],
.has-black-hot-pink-gradient-background > .wp-block-columns p.has-primary-color.has-x-small-font-size,
.has-black-hot-pink-gradient-background p.has-primary-color.has-x-small-font-size[style*="text-transform:uppercase"] {
	color: var(--wp--preset--color--base, #fff) !important;
}

/* On pink gradient sections, ALL pink text should be white */
.has-pink-gradient-background .has-primary-color {
	color: var(--wp--preset--color--base, #fff) !important;
}

/* Inline mark highlights on hot-pink-dark — use white instead
   of pink since the bg starts pink */
.has-hot-pink-dark-gradient-background mark.has-inline-color.has-primary-color {
	color: var(--wp--preset--color--base, #fff) !important;
}

/* White/light card visuals inside gradient sections — keep text dark */
.has-black-pink-accent-gradient-background .has-base-background-color h2,
.has-black-pink-accent-gradient-background .has-base-background-color h3,
.has-black-pink-accent-gradient-background .has-base-background-color p,
.has-black-gradient-background .has-base-background-color h2,
.has-black-gradient-background .has-base-background-color h3,
.has-black-gradient-background .has-base-background-color p,
.has-black-gradient-background .has-tertiary-background-color h2,
.has-black-gradient-background .has-tertiary-background-color h3,
.has-black-gradient-background .has-tertiary-background-color p,
.has-hot-pink-dark-gradient-background .has-base-background-color h2,
.has-hot-pink-dark-gradient-background .has-base-background-color h3,
.has-hot-pink-dark-gradient-background .has-base-background-color p {
	color: var(--wp--preset--color--main, #000);
}

/* Restore main-accent inside light-bg cards (overrides the gradient white override) */
.has-black-pink-accent-gradient-background .has-base-background-color .has-main-accent-color,
.has-black-gradient-background .has-tertiary-background-color .has-main-accent-color,
.has-hot-pink-dark-gradient-background .has-base-background-color .has-main-accent-color {
	color: var(--wp--preset--color--main-accent, #1A0011) !important;
}

/* =============================================
   Mega-Menu Dropdowns — Dark gradient panels
   with white text + pink accents.
   ============================================= */
.wp-block-ollie-mega-menu__menu-container a {
	color: var(--wp--preset--color--base, #fff);
}

.wp-block-ollie-mega-menu__menu-container a:hover {
	color: var(--wp--preset--color--primary, #FF00AA);
}

/* Navigation styling is managed by the Ollie Menu Designer plugin. */

/* =============================================
   Design Polish — Noise Texture on Gradients
   Adds subtle grain/depth to dark gradient
   sections so they don't feel flat.
   ============================================= */
.has-black-pink-accent-gradient-background,
.has-black-gradient-background,
.has-hot-pink-dark-gradient-background,
.has-black-hot-pink-gradient-background {
	position: relative;
	isolation: isolate;
}

.has-black-pink-accent-gradient-background::after,
.has-black-gradient-background::after,
.has-hot-pink-dark-gradient-background::after,
.has-black-hot-pink-gradient-background::after {
	content: "";
	position: absolute;
	inset: 0;
	background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.04'/%3E%3C/svg%3E");
	background-repeat: repeat;
	background-size: 256px 256px;
	pointer-events: none;
	z-index: 1;
	mix-blend-mode: overlay;
}

/* Keep content above the noise layer */
.has-black-pink-accent-gradient-background > *,
.has-black-gradient-background > *,
.has-hot-pink-dark-gradient-background > *,
.has-black-hot-pink-gradient-background > * {
	position: relative;
	z-index: 2;
}

/* =============================================
   Design Polish — Section Eyebrow Labels
   Uses Mona Sans Condensed for the uppercase
   pink category labels above headings.
   Targets: pink x-small text with uppercase transform.
   ============================================= */
p.has-primary-color.has-x-small-font-size[style*="text-transform:uppercase"] {
	font-stretch: 94%;
	letter-spacing: 0.14em;
}

/* =============================================
   Design Polish — Hero Stats Card Glow
   Pink ambient glow behind the dark stats
   card in the hero section.
   ============================================= */
.wp-block-cover .has-main-background-color[style*="border-radius:5px"] {
	box-shadow: 0 8px 40px rgba(255, 0, 170, 0.2), 0 0 80px rgba(255, 0, 170, 0.08);
}

/* =============================================
   Design Polish — Client Logo Grayscale
   Logos display muted, pop to color on hover.
   ============================================= */
.wp-block-gallery .wp-block-image img {
	filter: grayscale(100%);
	opacity: 0.6;
	transition: filter 0.3s ease, opacity 0.3s ease;
}

.wp-block-gallery .wp-block-image:hover img {
	filter: grayscale(0%);
	opacity: 1;
}

/* =============================================
   Design Polish — CTA Trust Points
   Condensed font + subtle styling for the
   checkmark trust indicators below CTA buttons.
   ============================================= */
.has-black-hot-pink-gradient-background .is-layout-flex > .has-x-small-font-size {
	font-stretch: 94%;
	opacity: 0.85;
	letter-spacing: 0.02em;
}

/* =============================================
   Contrast Fix — Pink Gradient Section
   Tertiary tint on pink gradient can lose
   contrast. Force white text on all content
   inside the pink gradient background.
   ============================================= */
.has-pink-gradient-background {
	color: var(--wp--preset--color--base, #fff);
}

.has-pink-gradient-background h2,
.has-pink-gradient-background h3,
.has-pink-gradient-background p,
.has-pink-gradient-background .has-tertiary-color {
	color: var(--wp--preset--color--base, #fff) !important;
}

/* Pink headings stay readable — use a softer white
   so subheads can differentiate from body text */
.has-pink-gradient-background h3 {
	color: rgba(255, 255, 255, 0.92) !important;
}

/* Links inside pink gradient — white with underline */
.has-pink-gradient-background a:not(.wp-element-button) {
	color: var(--wp--preset--color--base, #fff) !important;
}

/* =============================================
   Contrast Fix — Dark Gradient Sections
   Bulletproof the main-accent override.
   WP's !important on .has-main-accent-color
   can beat our earlier overrides. Use higher
   specificity + !important to guarantee white.
   ============================================= */
.has-black-pink-accent-gradient-background p.has-main-accent-color,
.has-black-gradient-background p.has-main-accent-color,
.has-hot-pink-dark-gradient-background p.has-main-accent-color,
.has-black-hot-pink-gradient-background p.has-main-accent-color,
.has-pink-black-radial-gradient-background p.has-main-accent-color,
.has-main-background-color p.has-main-accent-color,
.wp-block-cover p.has-main-accent-color,
.has-black-pink-accent-gradient-background .has-main-accent-color,
.has-black-gradient-background .has-main-accent-color,
.has-hot-pink-dark-gradient-background .has-main-accent-color,
.has-black-hot-pink-gradient-background .has-main-accent-color,
.has-pink-black-radial-gradient-background .has-main-accent-color,
.has-main-background-color .has-main-accent-color,
.wp-block-cover .has-main-accent-color {
	color: rgba(255, 255, 255, 0.75) !important;
}

/* =============================================
   Spacing Fix — Pink Gradient Section
   Has inline padding-top:10px which breaks
   the vertical rhythm. Override to match
   the standard section spacing.
   ============================================= */
.has-pink-gradient-background[style*="padding-top:10px"] {
	padding-top: var(--wp--preset--spacing--xx-large) !important;
}

/* =============================================
   Visual Rhythm — Section Separation
   Add a subtle top border between adjacent
   same-tone sections to prevent them
   from blending into each other.
   ============================================= */

/* When two tertiary sections stack, add a
   soft divider between them */
.has-tertiary-background-color + .has-tertiary-background-color {
	border-top: 1px solid var(--wp--preset--color--border-light, #F2D0E3);
}

/* When dark gradient sections stack back-to-back,
   add a subtle glow line between them */
.has-black-pink-accent-gradient-background + .has-black-gradient-background,
.has-black-gradient-background + .has-hot-pink-dark-gradient-background,
.has-black-pink-accent-gradient-background + .has-hot-pink-dark-gradient-background {
	border-top: 1px solid rgba(255, 0, 170, 0.2);
}

/* =============================================
   Homepage Feature Spotlights (Vibrant Pass)
   Stronger icon cards + cleaner bullets for
   the alternating service spotlight section.
   ============================================= */
.lgd-feature-spotlights > .wp-block-group.alignfull {
	position: relative;
	isolation: isolate;
}

/* Distinct gradient identity per spotlight band */
.lgd-feature-spotlights > .wp-block-group.alignfull:nth-child(1) {
	background: linear-gradient(142deg, #050005 0%, #1a0012 54%, #ff00aa 100%) !important;
}

.lgd-feature-spotlights > .wp-block-group.alignfull:nth-child(2) {
	background: linear-gradient(220deg, #000000 0%, #12000d 34%, #390026 70%, #ff00aa 100%) !important;
	border-top: 1px solid rgba(255, 255, 255, 0.14);
	border-bottom: 1px solid rgba(255, 255, 255, 0.14);
}

.lgd-feature-spotlights > .wp-block-group.alignfull:nth-child(3) {
	background: linear-gradient(126deg, #ff00aa 0%, #8f0064 48%, #000000 100%) !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.14);
}

.lgd-feature-spotlights > .wp-block-group.alignfull:nth-child(2) .lgd-spotlight-visual-card {
	border-color: rgba(255, 255, 255, 0.55);
	box-shadow: 0 12px 36px rgba(255, 0, 170, 0.28), 0 0 0 1px rgba(255, 255, 255, 0.1) inset;
}

.lgd-feature-spotlights .lgd-spotlight-copy {
	color: rgba(255, 255, 255, 0.9) !important;
}

.lgd-feature-spotlights .lgd-spotlight-visual-card {
	border: 1px solid rgba(255, 0, 170, 0.5);
	box-shadow: 0 10px 32px rgba(255, 0, 170, 0.22);
	background:
		radial-gradient(circle at 82% 10%, rgba(255, 0, 170, 0.14), rgba(255, 0, 170, 0) 40%),
		#ffffff;
}

.lgd-feature-spotlights .lgd-spotlight-icon img {
	width: min(100%, 460px);
	height: auto;
	margin-inline: auto;
	filter: drop-shadow(0 10px 24px rgba(255, 0, 170, 0.18));
}

.lgd-feature-spotlights .lgd-spotlight-bullets {
	list-style: none;
	margin: 0;
	padding-left: 0;
}

.lgd-feature-spotlights .lgd-spotlight-bullets li {
	position: relative;
	padding-left: 1.9rem;
	margin: 0 0 0.55rem;
	line-height: 1.5;
}

.lgd-feature-spotlights .lgd-spotlight-bullets li:last-child {
	margin-bottom: 0;
}

.lgd-feature-spotlights .lgd-spotlight-bullets li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.32em;
	width: 1.1rem;
	height: 1.1rem;
	border-radius: 999px;
	border: 2px solid var(--wp--preset--color--primary, #FF00AA);
	background: rgba(255, 0, 170, 0.12);
	box-shadow: 0 0 0 3px rgba(255, 0, 170, 0.14);
}

.lgd-feature-spotlights .lgd-spotlight-bullets li::after {
	content: "";
	position: absolute;
	left: 0.4rem;
	top: 0.63em;
	width: 0.3rem;
	height: 0.16rem;
	border-left: 2px solid var(--wp--preset--color--base, #fff);
	border-bottom: 2px solid var(--wp--preset--color--base, #fff);
	transform: rotate(-45deg);
}

/* Spotlight contrast hardening on gradient bands */
[class*="gradient-background"] .lgd-spotlight-copy,
[class*="gradient-background"] .lgd-spotlight-bullets,
[class*="gradient-background"] .lgd-spotlight-bullets li {
	color: var(--wp--preset--color--base, #fff) !important;
}

[class*="gradient-background"] .lgd-spotlight-bullets li::before {
	border-color: rgba(255, 255, 255, 0.72);
	background: linear-gradient(135deg, rgba(255, 255, 255, 0.22), rgba(255, 0, 170, 0.34));
	box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.12);
}

[class*="gradient-background"] .lgd-spotlight-bullets li::after {
	border-left-color: var(--wp--preset--color--base, #fff);
	border-bottom-color: var(--wp--preset--color--base, #fff);
}

/* =============================================
   Spacing Fix — Tertiary Section Zero Padding
   Catches any tertiary section with no top
   padding and gives it the standard spacing.
   ============================================= */
.has-tertiary-background-color[style*="padding-top:0"] {
	padding-top: var(--wp--preset--spacing--x-large) !important;
}

/* =============================================
   Polish — Separator Brand Styling
   Separators without explicit color inherit
   the section text color (black on white = harsh).
   Give all thin separators a softer brand tint.
   ============================================= */
.wp-block-separator.is-style-separator-thin:not([class*="border-light"]):not([class*="border-dark"]) {
	border-color: var(--wp--preset--color--border-light, #F2D0E3) !important;
	color: var(--wp--preset--color--border-light, #F2D0E3) !important;
}

/* Dot separators — brand pink dots */
.wp-block-separator.is-style-dots::before {
	color: var(--wp--preset--color--primary, #FF00AA) !important;
	font-family: inherit;
	letter-spacing: 1em;
}

/* =============================================
   Polish — Icon Block Normalization
   Icon blocks use 3 different dark bg colors
   (#1A0011, #0D0D0D, #0E0E0E). On light sections
   switch to pink backgrounds; on dark sections
   normalize to brand black.
   ============================================= */

/* Default: normalize icon backgrounds to brand black */
.icon-container.has-icon-background-color:not(.has-primary-background-color) {
	border-radius: 8px !important;
}

/* Light sections → icon backgrounds become pink */
.has-base-background-color .icon-container.has-icon-background-color:not(.has-primary-background-color),
.has-tertiary-background-color .icon-container.has-icon-background-color:not(.has-primary-background-color) {
	background-color: var(--wp--preset--color--primary, #FF00AA) !important;
}

/* Dark sections → icon backgrounds stay black */
[class*="gradient-background"] .icon-container.has-icon-background-color:not(.has-primary-background-color),
.has-main-background-color .icon-container.has-icon-background-color:not(.has-primary-background-color) {
	background-color: var(--wp--preset--color--main, #000) !important;
}

/* Pink icon backgrounds — keep pink, normalize radius */
.icon-container.has-primary-background-color {
	border-radius: 8px !important;
}

/* Card-context icon sizing normalization
   (scoped to main content so header/nav icons are untouched). */
main .wp-block-outermost-icon-block .icon-container {
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

main .wp-block-outermost-icon-block .icon-container.has-icon-background-color {
	min-width: 62px !important;
	min-height: 62px !important;
}

main .wp-block-outermost-icon-block .icon-container.has-icon-background-color[style*="padding-top:5px"] {
	padding-top: 8px !important;
	padding-right: 8px !important;
	padding-bottom: 8px !important;
	padding-left: 8px !important;
}

main .wp-block-outermost-icon-block .icon-container:not(.has-icon-background-color) {
	min-width: 40px !important;
}

main .wp-block-outermost-icon-block .icon-container svg {
	width: 100%;
	height: 100%;
}

/* =============================================
   Icon Color Context Rules
   Icons with backgrounds → white SVGs always.
   Standalone icons on light bg → pink SVGs.
   Standalone icons on dark bg → white SVGs.
   ============================================= */

/* Any icon WITH a background gets white SVG
   (works for both pink-bg and dark-bg icons) */
.icon-container.has-icon-background-color,
.icon-container.has-icon-background-color svg {
	color: var(--wp--preset--color--base, #fff) !important;
}

/* Standalone icons (no bg) on light sections → pink SVG */
.has-base-background-color .icon-container:not(.has-icon-background-color),
.has-tertiary-background-color .icon-container:not(.has-icon-background-color),
.has-base-background-color .icon-container:not(.has-icon-background-color) svg,
.has-tertiary-background-color .icon-container:not(.has-icon-background-color) svg {
	color: var(--wp--preset--color--primary, #FF00AA) !important;
}

/* Standalone icons (no bg) on dark sections → white SVG */
[class*="gradient-background"] .icon-container:not(.has-icon-background-color),
.has-main-background-color .icon-container:not(.has-icon-background-color),
[class*="gradient-background"] .icon-container:not(.has-icon-background-color) svg,
.has-main-background-color .icon-container:not(.has-icon-background-color) svg {
	color: var(--wp--preset--color--base, #fff) !important;
}

/* Social/link-in-bio page icons — override Ollie purple (#5A20FF)
   with brand pink on light tertiary backgrounds */
.icon-container.has-tertiary-background-color {
	background-color: var(--wp--preset--color--tertiary, #FFD6E9) !important;
}
.icon-container.has-tertiary-background-color,
.icon-container.has-tertiary-background-color svg {
	color: var(--wp--preset--color--primary, #FF00AA) !important;
}

/* Inline SVG system for pattern-level icons */
.lgd-icon {
	display: inline-flex;
	width: 1.5rem;
	height: 1.5rem;
	line-height: 1;
}

.lgd-icon svg {
	display: block;
	width: 100%;
	height: 100%;
	stroke: currentColor;
	fill: none;
	stroke-width: 1.8;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.lgd-icon--on-light {
	color: var(--wp--preset--color--main, #000);
}

.lgd-icon--on-dark {
	color: var(--wp--preset--color--base, #fff);
}

/* =============================================
   Polish — Cover Block Mobile Parallax Fix
   iOS/Safari doesn't support background-attachment:
   fixed inside overflow containers. Disable
   parallax on mobile to prevent rendering bugs.
   ============================================= */
@media (max-width: 782px) {
	.wp-block-cover.has-parallax {
		background-attachment: scroll !important;
	}
}

/* =============================================
   Polish — Ollie Button Style Harmonization
   Ollie's native outline buttons (is-style-outline)
   don't match the LGD brand. Override to match
   our outline-black style.
   ============================================= */
.wp-block-button.is-style-outline .wp-block-button__link {
	border: 2px solid currentColor;
	background: transparent;
}

/* =============================================
   Polish — Font Weight Floor
   Thin (100) and light (300) weights feel weak
   for a bold, no-BS brand. Bump minimum to 400
   on body text to maintain brand strength.
   ============================================= */
p[style*="font-weight:100"],
p[style*="font-weight:300"] {
	font-weight: 400 !important;
}

/* =============================================
   Polish — Testimonial Section Enhancement
   Large quote section — add a pink left border
   accent and subtle background lift. Targets the
   flex group containing the quote heading.
   ============================================= */
.wp-block-column > .wp-block-group.is-vertical.is-layout-flex[style*="min-height:100%"] {
	border-left: 4px solid var(--wp--preset--color--primary, #FF00AA);
	padding-left: var(--wp--preset--spacing--large);
}

/* =============================================
   Polish — Heading Hierarchy Refinement
   Ensure consistent heading spacing and
   add subtle letter-spacing to Big Shoulders
   display headings for better readability.
   ============================================= */
.has-secondary-font-family.has-xx-large-font-size,
.has-secondary-font-family.has-x-large-font-size {
	letter-spacing: -0.01em;
}

/* Medium headings (h3 level) — slightly wider
   tracking for better readability at smaller sizes */
.has-secondary-font-family.has-medium-font-size {
	letter-spacing: 0.01em;
}

/* =============================================
   Polish — Card Hover Consistency
   Ensure all bordered cards (border-light) get
   the same hover lift as box-shadow cards.
   ============================================= */
.has-border-light-border-color.has-background[style*="border-radius:5px"] {
	transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.has-border-light-border-color.has-background[style*="border-radius:5px"]:hover {
	transform: translateY(-3px);
	box-shadow: 0 8px 25px rgba(0, 0, 0, 0.06);
	border-color: var(--wp--preset--color--primary, #FF00AA) !important;
}

/* =============================================
   Layout — CTA Gradient Blocks Edge-to-Edge
   CTA sections use alignwide gradient cards
   inside white alignfull parent sections.
   Break them out to full viewport width
   so the gradient background bleeds edge-to-edge.
   Scoped to main content area (not mega-menu panels).
   ============================================= */
main .has-base-background-color.alignfull > .alignwide[class*="gradient-background"],
main .has-tertiary-background-color.alignfull > .alignwide[class*="gradient-background"],
main .has-base-background-color > .alignwide[class*="gradient-background"],
main .has-tertiary-background-color > .alignwide[class*="gradient-background"] {
	max-width: 100vw !important;
	width: 100vw;
	margin-left: calc(-50vw + 50%) !important;
	margin-right: calc(-50vw + 50%) !important;
	border-radius: 0 !important;
	padding-left: var(--wp--preset--spacing--medium) !important;
	padding-right: var(--wp--preset--spacing--medium) !important;
}

/* =============================================
   Contrast Fix — Black Text on Dark Backgrounds
   Catch any remaining has-main-color (black)
   or has-secondary-color (#0D0D0D) text inside
   gradient/dark backgrounds and force white.
   ============================================= */
.has-black-pink-accent-gradient-background .has-main-color,
.has-black-gradient-background .has-main-color,
.has-hot-pink-dark-gradient-background .has-main-color,
.has-black-hot-pink-gradient-background .has-main-color,
.has-pink-black-radial-gradient-background .has-main-color,
.has-main-background-color .has-main-color {
	color: var(--wp--preset--color--base, #fff) !important;
}

.has-black-pink-accent-gradient-background .has-secondary-color,
.has-black-gradient-background .has-secondary-color,
.has-hot-pink-dark-gradient-background .has-secondary-color,
.has-black-hot-pink-gradient-background .has-secondary-color,
.has-pink-black-radial-gradient-background .has-secondary-color,
.has-main-background-color .has-secondary-color {
	color: rgba(255, 255, 255, 0.7) !important;
}

/* CTA Cover — overlay fills full bleed with no margin gaps */
[data-metadata-name="Call To Action Cover"].wp-block-cover {
	margin-left: 0 !important;
	margin-right: 0 !important;
	width: 100% !important;
	max-width: 100% !important;
}

/* CTA Cover — extend inner section overlay to fill the full cover image */
.wp-block-cover > .wp-block-cover__inner-container > .wp-block-group.alignfull[style*="background-color"]::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: -200px;
	bottom: -200px;
	background-color: inherit;
	z-index: 0;
}
.wp-block-cover > .wp-block-cover__inner-container > .wp-block-group.alignfull[style*="background-color"] > * {
	position: relative;
	z-index: 1;
}

/* Cover blocks with dark overlays — ensure text is white */
.wp-block-cover .has-main-color,
.wp-block-cover .has-secondary-color {
	color: var(--wp--preset--color--base, #fff) !important;
}

/* Exception: inside light cards within dark sections, keep dark text */
main [class*="gradient-background"] .has-base-background-color .has-main-color,
main [class*="gradient-background"] .has-tertiary-background-color .has-main-color,
main .has-main-background-color .has-base-background-color .has-main-color,
main .has-main-background-color .has-tertiary-background-color .has-main-color {
	color: var(--wp--preset--color--main, #000) !important;
}

/* Exception: light cards inside cover blocks restore dark text.
   Cover blocks force white text on all descendants —
   white cards inside need explicit dark text reset. */
.wp-block-cover .has-base-background-color,
.wp-block-cover .has-tertiary-background-color {
	color: var(--wp--preset--color--main, #000);
}

.wp-block-cover .has-base-background-color .has-main-color,
.wp-block-cover .has-tertiary-background-color .has-main-color {
	color: var(--wp--preset--color--main, #000) !important;
}

.wp-block-cover .has-base-background-color .has-secondary-color,
.wp-block-cover .has-tertiary-background-color .has-secondary-color {
	color: var(--wp--preset--color--secondary) !important;
}

/* =============================================
   LGD Utility Classes → Moved to Class Manager
   All lgd-* utility classes are now managed via
   Ollie Pro Class Manager (loadGlobal: true).
   See: WP Admin → Appearance → Ollie → Extensions
   ============================================= */

/* =============================================
   Icon and Card Polish (Feb 2026)
   Replace emoji-style markers with inline SVGs,
   normalize icon sizing, and center key homepage
   card text for a cleaner, more intentional look.
   ============================================= */
.lgd-marker-icon,
.lgd-inline-icon {
	display: inline-flex;
	width: 1.5rem;
	height: 1.5rem;
	vertical-align: middle;
	line-height: 1;
}

.lgd-marker-icon {
	width: 1.25rem;
	height: 1.25rem;
}

.lgd-marker-icon svg,
.lgd-inline-icon svg {
	display: block;
	width: 100%;
	height: 100%;
	stroke: currentColor;
	fill: none;
	stroke-width: 1.9;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.lgd-pain-icon {
	width: 1.2rem;
	height: 1.2rem;
}

.lgd-capability-icon {
	width: clamp(2.1rem, 1vw + 1.67rem, 2.38rem);
	height: clamp(2.1rem, 1vw + 1.67rem, 2.38rem);
}

.lgd-card-icon {
	width: clamp(2.22rem, 1.15vw + 1.57rem, 2.58rem);
	height: clamp(2.22rem, 1.15vw + 1.57rem, 2.58rem);
	min-width: 2.22rem;
	min-height: 2.22rem;
}

.lgd-topic-icon {
	width: clamp(1.73rem, 0.8vw + 1.3rem, 2rem);
	height: clamp(1.73rem, 0.8vw + 1.3rem, 2rem);
}

.lgd-spotlight-marker {
	width: 0.95rem;
	height: 0.95rem;
	margin-right: 0.35rem;
	vertical-align: -0.1em;
}

/* Thinner line symbols need a little more visual weight */
.lgd-card-icon-communication,
.lgd-card-icon-strategy,
.lgd-card-icon-growth,
.lgd-card-icon-analysis,
.lgd-card-icon-nap,
.lgd-card-icon-partnership,
.lgd-capability-icon-strategy,
.lgd-capability-icon-partnership {
	width: clamp(2.21rem, 1.05vw + 1.62rem, 2.48rem);
	height: clamp(2.21rem, 1.05vw + 1.62rem, 2.48rem);
}

.lgd-capability-icon svg,
.lgd-card-icon svg,
.lgd-topic-icon svg {
	stroke-width: 2.2;
}

/* Page-specific optical icon tuning */
body.page-id-477 .lgd-card-icon {
	width: clamp(2.21rem, 1.05vw + 1.57rem, 2.43rem);
	height: clamp(2.21rem, 1.05vw + 1.57rem, 2.43rem);
}

body.page-id-477 .lgd-card-icon-communication,
body.page-id-477 .lgd-card-icon-partnership {
	width: clamp(2.38rem, 1.2vw + 1.67rem, 2.59rem);
	height: clamp(2.38rem, 1.2vw + 1.67rem, 2.59rem);
}

body.page-id-478 .lgd-card-icon {
	width: clamp(2.11rem, 1vw + 1.51rem, 2.32rem);
	height: clamp(2.11rem, 1vw + 1.51rem, 2.32rem);
}

body.page-id-478 .lgd-card-icon-wordpress,
body.page-id-478 .lgd-card-icon-ghl,
body.page-id-478 .lgd-card-icon-brand {
	width: clamp(2.05rem, 0.95vw + 1.46rem, 2.21rem);
	height: clamp(2.05rem, 0.95vw + 1.46rem, 2.21rem);
}

body.page-id-478 .lgd-card-icon-strategy,
body.page-id-478 .lgd-card-icon-growth,
body.page-id-478 .lgd-card-icon-partnership {
	width: clamp(2.27rem, 1.15vw + 1.62rem, 2.48rem);
	height: clamp(2.27rem, 1.15vw + 1.62rem, 2.48rem);
}

body.page-id-611 .lgd-card-icon {
	width: clamp(2.11rem, 1vw + 1.46rem, 2.27rem);
	height: clamp(2.11rem, 1vw + 1.46rem, 2.27rem);
}

body.page-id-611 .lgd-card-icon-profile,
body.page-id-611 .lgd-card-icon-posts {
	width: clamp(2.05rem, 0.95vw + 1.4rem, 2.18rem);
	height: clamp(2.05rem, 0.95vw + 1.4rem, 2.18rem);
}

body.page-id-611 .lgd-card-icon-reviews {
	width: clamp(1.94rem, 0.9vw + 1.3rem, 2.11rem);
	height: clamp(1.94rem, 0.9vw + 1.3rem, 2.11rem);
}

body.page-id-611 .lgd-card-icon-nap,
body.page-id-611 .lgd-card-icon-analysis {
	width: clamp(2.27rem, 1.1vw + 1.62rem, 2.43rem);
	height: clamp(2.27rem, 1.1vw + 1.62rem, 2.43rem);
}

/* Careers (779) — card icons in "Why Work" + "What We Look For" grids */
body.page-id-779 .lgd-card-icon {
	width: clamp(2.11rem, 1vw + 1.51rem, 2.32rem);
	height: clamp(2.11rem, 1vw + 1.51rem, 2.32rem);
}

/* Support (780) — card icons in "Contact" + "Resources" grids */
body.page-id-780 .lgd-card-icon {
	width: clamp(2.11rem, 1vw + 1.51rem, 2.32rem);
	height: clamp(2.11rem, 1vw + 1.51rem, 2.32rem);
}

/* Features (781) — card icons in "WordPress Done Right" grid */
body.page-id-781 .lgd-card-icon {
	width: clamp(2.11rem, 1vw + 1.51rem, 2.32rem);
	height: clamp(2.11rem, 1vw + 1.51rem, 2.32rem);
}

.has-base-background-color .lgd-marker-icon,
.has-base-background-color .lgd-inline-icon,
.has-base-background-color .lgd-card-icon,
.has-tertiary-background-color .lgd-marker-icon,
.has-tertiary-background-color .lgd-inline-icon,
.has-tertiary-background-color .lgd-card-icon {
	color: var(--wp--preset--color--primary, #ff00aa);
}

[class*="gradient-background"] .lgd-marker-icon,
[class*="gradient-background"] .lgd-inline-icon,
[class*="gradient-background"] .lgd-card-icon,
.has-main-background-color .lgd-marker-icon,
.has-main-background-color .lgd-inline-icon,
.has-main-background-color .lgd-card-icon {
	color: var(--wp--preset--color--base, #fff);
}

/* Card icon rows in flex groups */
.wp-block-group.is-layout-flex > .wp-block-paragraph:has(.lgd-marker-icon) {
	line-height: 1;
}

.lgd-accent-card > .wp-block-paragraph:has(.lgd-card-icon),
.lgd-accent-card > .wp-block-paragraph:has(.lgd-capability-icon) {
	margin: 0 0 0.6rem;
	line-height: 1;
}

/* Homepage card pass: center copy in repeated card groups */
.home .lgd-accent-card,
.home .lgd-accent-card h3,
.home .lgd-accent-card p {
	text-align: center;
}

/* Keep list-style content readable where needed */
.home .lgd-accent-card ul,
.home .lgd-accent-card ol,
.home .lgd-brand-bullets {
	text-align: left;
}

.lgd-brand-bullets {
	margin: 0;
	padding-left: 1.2em;
}

.lgd-brand-bullets li {
	margin: 0 0 0.55em;
}

.lgd-brand-bullets li::marker {
	color: var(--wp--preset--color--primary, #ff00aa);
}

/* =============================================
   White Section Rhythm + Subtle Texture
   Removes awkward top/bottom whitespace spikes
   and gives full white bands a soft brand texture.
   ============================================= */
main .has-base-background-color.alignfull {
	background-image:
		radial-gradient(circle at 14% 18%, rgba(255, 0, 170, 0.06) 0, rgba(255, 0, 170, 0) 36%),
		radial-gradient(circle at 85% 78%, rgba(0, 0, 0, 0.045) 0, rgba(0, 0, 0, 0) 34%);
	background-repeat: no-repeat;
}

main .has-base-background-color.alignfull + .has-base-background-color.alignfull {
	padding-top: clamp(2.25rem, 3vw, 3.5rem) !important;
}

/* =============================================
   Tertiary Surface Refresh
   Move tertiary away from near-white pink and
   give full-width tertiary bands more depth.
   ============================================= */
body .has-tertiary-background-color {
	background-color: var(--wp--preset--color--tertiary, #FFD6E9) !important;
}

main .has-base-background-color.alignfull > :first-child {
	margin-top: 0 !important;
}

main .has-base-background-color.alignfull > :last-child {
	margin-bottom: 0 !important;
}

@supports not selector(:has(*)) {
	.wp-block-group.is-layout-flex > .wp-block-paragraph .lgd-marker-icon {
		display: inline-flex;
	}
}

/* =============================================
   Accessibility Pass — Contrast Hardening
   Brand primary pink (#FF00AA) is below AA for
   normal text on white/light backgrounds.
   Use a darker, brand-consistent text pink
   for text-only contexts on light surfaces.
   ============================================= */
:root {
	--lgd-primary-text-accessible: #D10087;
}

/* Light surfaces: adjust pink text to AA-safe tone */
.has-base-background-color :is(h1, h2, h3, h4, h5, h6, p, li, span, a).has-primary-color:not(.wp-element-button),
.has-tertiary-background-color :is(h1, h2, h3, h4, h5, h6, p, li, span, a).has-primary-color:not(.wp-element-button) {
	color: var(--lgd-primary-text-accessible) !important;
}

/* Keep icon systems on original brand pink */
.has-base-background-color .icon-container:not(.has-icon-background-color),
.has-base-background-color .icon-container:not(.has-icon-background-color) svg,
.has-tertiary-background-color .icon-container:not(.has-icon-background-color),
.has-tertiary-background-color .icon-container:not(.has-icon-background-color) svg,
.has-base-background-color .lgd-marker-icon,
.has-base-background-color .lgd-inline-icon,
.has-tertiary-background-color .lgd-marker-icon,
.has-tertiary-background-color .lgd-inline-icon {
	color: var(--wp--preset--color--primary, #ff00aa) !important;
}

/* Pure pink backgrounds: force dark text for AA contrast */
.has-primary-background-color :is(h1, h2, h3, h4, h5, h6, p, li, span, a):not(.wp-element-button),
.has-primary-gradient-background :is(h1, h2, h3, h4, h5, h6, p, li, span, a):not(.wp-element-button) {
	color: var(--wp--preset--color--main, #000) !important;
}

/* =============================================
   Booking UX — Embed Restyle + Modal CTA
   ============================================= */
body.page-id-782 .lgd-booking-embed-shell {
	position: relative;
	overflow: hidden;
	border-radius: 16px;
	padding: clamp(8px, 1.5vw, 14px);
	border: 1px solid rgba(255, 0, 170, 0.5);
	background:
		radial-gradient(circle at 88% 9%, rgba(255, 0, 170, 0.28), rgba(255, 0, 170, 0) 44%),
		linear-gradient(145deg, rgba(6, 0, 4, 0.96), rgba(28, 0, 19, 0.9) 50%, rgba(57, 0, 42, 0.86));
	box-shadow:
		0 24px 55px rgba(0, 0, 0, 0.45),
		0 0 0 1px rgba(255, 0, 170, 0.15) inset;
}

body.page-id-782 .lgd-booking-embed-shell::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0));
	pointer-events: none;
}

body.page-id-782 .lgd-booking-embed-frame {
	display: block;
	width: 100%;
	min-height: 680px;
	border: 0;
	border-radius: 0;
	background: #000000;
}

.lgd-booking-cta {
	width: auto;
}

.lgd-booking-cta .wp-block-button__link {
	width: auto;
	min-height: 52px;
	justify-content: center;
	font-size: clamp(0.98rem, 0.22vw + 0.95rem, 1.08rem);
	font-weight: 800;
	letter-spacing: 0.01em;
}

.page-id-482 .lgd-booking-cta {
	width: 100%;
}

.page-id-482 .lgd-booking-cta .wp-block-button__link {
	width: 100%;
}

.lgd-small-team-single-cta .wp-block-button {
	width: min(620px, 92vw);
}

.lgd-small-team-single-cta .wp-block-button__link {
	width: 100%;
	font-size: clamp(1rem, 1.4vw, 1.15rem);
	padding-inline: clamp(1.2rem, 3vw, 2rem);
}

.lgd-booking-modal {
	position: fixed;
	inset: 0;
	z-index: 10050;
	display: none;
}

.lgd-booking-modal.is-open {
	display: block;
}

.lgd-booking-modal__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.72);
	backdrop-filter: blur(2px);
}

.lgd-booking-modal__panel {
	position: relative;
	width: min(980px, calc(100vw - 2rem));
	max-height: calc(100dvh - 3.5rem);
	margin: 1.75rem auto;
	padding: 0.9rem;
	border-radius: 16px;
	border: 1px solid rgba(255, 0, 170, 0.5);
	background:
		radial-gradient(circle at 88% 10%, rgba(255, 0, 170, 0.3), rgba(255, 0, 170, 0) 38%),
		linear-gradient(160deg, rgba(0, 0, 0, 0.97), rgba(34, 0, 26, 0.92));
	box-shadow: 0 28px 70px rgba(0, 0, 0, 0.58);
}

.lgd-booking-modal__close {
	position: absolute;
	top: 0.42rem;
	right: 0.42rem;
	width: 36px;
	height: 36px;
	border: 0;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.12);
	color: #fff;
	font-size: 1.3rem;
	line-height: 1;
	cursor: pointer;
}

.lgd-booking-modal__close:hover {
	background: rgba(255, 0, 170, 0.5);
}

.lgd-booking-modal__eyebrow {
	margin: 0 2.1rem 0.58rem 0.35rem;
	color: #fff;
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.11em;
	text-transform: uppercase;
}

.lgd-booking-modal__frame {
	display: block;
	width: 100%;
	height: min(76dvh, 780px);
	border: 0;
	border-radius: 12px;
	background: #fff;
}

body.has-booking-modal-open {
	overflow: hidden;
	padding-bottom: 0 !important;
}

body.has-booking-modal-open .lgd-sticky-contact {
	display: none !important;
}

@media (max-width: 782px) {
	body.page-id-782 .lgd-booking-embed-frame {
		min-height: 620px;
	}

	.lgd-booking-modal__panel {
		width: calc(100vw - 1rem);
		max-height: calc(100dvh - 1rem);
		margin: 0.5rem auto;
		padding: 0.6rem;
	}

	.lgd-booking-modal__eyebrow {
		font-size: 0.72rem;
	}

	.lgd-booking-modal__frame {
		height: calc(100dvh - 5.1rem);
	}
}

/* =============================================
   LGD Forms — [lgd_form] shortcode
   ============================================= */
.lgd-form-wrapper {
	max-width: 480px;
	margin: 0 auto;
}

.lgd-form {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--small, 1rem);
}

.lgd-form__field {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
}

.lgd-form__label {
	font-size: var(--wp--preset--font-size--small, 0.875rem);
	font-weight: 500;
	color: inherit;
}

.lgd-form__input {
	width: 100%;
	padding: 0.75rem 1rem;
	border: 1px solid var(--wp--preset--color--main-accent, #333);
	border-radius: 8px;
	background: var(--wp--preset--color--main, #000);
	color: var(--wp--preset--color--base, #fff);
	font-family: inherit;
	font-size: var(--wp--preset--font-size--base, 1rem);
	transition: border-color 0.2s ease;
}

.lgd-form__input::placeholder {
	color: var(--wp--preset--color--secondary, #888);
}

.lgd-form__input:focus {
	outline: 2px solid #D10087;
	outline-offset: 2px;
	border-color: var(--wp--preset--color--primary, #ff00aa);
}

/* Light background variant */
.has-base-background-color .lgd-form__input,
.has-tertiary-background-color .lgd-form__input {
	background: #fff;
	color: var(--wp--preset--color--main, #000);
	border-color: var(--wp--preset--color--border-light, #ddd);
}

.has-base-background-color .lgd-form__input:focus,
.has-tertiary-background-color .lgd-form__input:focus {
	border-color: var(--wp--preset--color--primary, #ff00aa);
}

/* Honeypot — visually hidden from humans */
.lgd-form__hp {
	position: absolute;
	left: -9999px;
	opacity: 0;
	height: 0;
	overflow: hidden;
}

.lgd-form__submit {
	padding: 0.85rem 2rem;
	border: none;
	border-radius: 8px;
	background: var(--wp--preset--color--primary, #ff00aa);
	color: #fff;
	font-family: var(--wp--preset--font-family--secondary, inherit);
	font-size: var(--wp--preset--font-size--base, 1rem);
	font-weight: 600;
	cursor: pointer;
	transition: opacity 0.2s ease, transform 0.1s ease;
}

.lgd-form__submit:hover {
	opacity: 0.9;
}

.lgd-form__submit:active {
	transform: scale(0.98);
}

.lgd-form__submit:disabled {
	opacity: 0.6;
	cursor: not-allowed;
}

/* Success state */
.lgd-form-success {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.75rem;
	padding: var(--wp--preset--spacing--large, 2rem);
	text-align: center;
}

.lgd-form-success__icon {
	color: var(--wp--preset--color--primary, #ff00aa);
}

.lgd-form-success p {
	font-size: var(--wp--preset--font-size--medium, 1.125rem);
	font-weight: 500;
	margin: 0;
}

/* Inline error/info messages */
.lgd-form-message {
	padding: 0.6rem 1rem;
	border-radius: 6px;
	font-size: var(--wp--preset--font-size--small, 0.875rem);
}

.lgd-form-message--error {
	background: rgba(255, 60, 60, 0.12);
	color: #ff6b6b;
}

/* =============================================
   Light Section Design Polish (Mar 2026)
   Elevates white and tertiary sections to match
   the depth and sophistication of dark gradient
   sections. CSS-only enhancements — no DB edits.
   ============================================= */

/* ----- Custom Properties ----- */
:root {
	--lgd-shadow-card: 0 1px 3px rgba(0, 0, 0, 0.06), 0 4px 14px rgba(0, 0, 0, 0.05);
	--lgd-shadow-card-hover: 0 12px 36px rgba(0, 0, 0, 0.1), 0 4px 12px rgba(0, 0, 0, 0.06);
	--lgd-shadow-card-glow: 0 10px 32px rgba(255, 0, 170, 0.12), 0 4px 12px rgba(0, 0, 0, 0.06);
	--lgd-border-subtle: rgba(242, 208, 227, 0.8);
	--lgd-glass-bg: rgba(255, 255, 255, 0.72);
	--lgd-glass-border: rgba(255, 255, 255, 0.5);
}

/* ----- 1. White Section Layered Backgrounds -----
   Visible orbs + tertiary wash for real depth on white.
   Targets both explicit white bg AND default-white sections.
   Excludes sections inside cover blocks.
   Odd/even variants add visual variety between adjacent white bands. */

/* --- 1a. Warm base + visible orbs (odd white sections) --- */
main .has-base-background-color.alignfull:not(.wp-block-cover__inner-container .has-base-background-color),
main .wp-block-group.alignfull:not([class*="background-color"]):not([class*="gradient"]):not(.wp-block-cover):not(.wp-block-cover__inner-container *) {
	background-color: #FDF8FA;
	background-image:
		linear-gradient(165deg, rgba(255, 214, 233, 0.35) 0%, rgba(255, 255, 255, 0) 45%),
		linear-gradient(345deg, rgba(255, 214, 233, 0.20) 0%, rgba(255, 255, 255, 0) 40%),
		radial-gradient(circle 500px at 10% 20%, rgba(255, 0, 170, 0.10) 0, rgba(255, 0, 170, 0) 50%),
		radial-gradient(circle 400px at 88% 75%, rgba(255, 0, 170, 0.08) 0, rgba(255, 0, 170, 0) 50%);
	background-repeat: no-repeat;
}

/* --- 1b. Even white sections — flipped wash direction for variety --- */
main .has-base-background-color.alignfull:nth-child(even):not(.wp-block-cover__inner-container .has-base-background-color),
main .wp-block-group.alignfull:nth-child(even):not([class*="background-color"]):not([class*="gradient"]):not(.wp-block-cover):not(.wp-block-cover__inner-container *) {
	background-image:
		linear-gradient(195deg, rgba(255, 214, 233, 0.28) 0%, rgba(255, 255, 255, 0) 40%),
		linear-gradient(15deg, rgba(255, 214, 233, 0.22) 0%, rgba(255, 255, 255, 0) 35%),
		radial-gradient(circle 450px at 85% 15%, rgba(255, 0, 170, 0.09) 0, rgba(255, 0, 170, 0) 50%),
		radial-gradient(circle 500px at 12% 80%, rgba(255, 0, 170, 0.07) 0, rgba(255, 0, 170, 0) 50%);
	background-repeat: no-repeat;
}

/* --- 1c. Dot pattern overlay — base (all white sections) --- */
main .has-base-background-color.alignfull:not(.wp-block-cover__inner-container .has-base-background-color)::before,
main .wp-block-group.alignfull:not([class*="background-color"]):not([class*="gradient"]):not(.wp-block-cover):not(.wp-block-cover__inner-container *)::before {
	content: "";
	position: absolute;
	inset: 0;
	background-image: radial-gradient(circle, rgba(0, 0, 0, 0.08) 1px, transparent 1px);
	background-size: 22px 22px;
	pointer-events: none;
	z-index: 0;
	opacity: 0.55;
}

/* --- 1d. Dot pattern overlay — even sections (offset grid for variety) --- */
main .has-base-background-color.alignfull:nth-child(even):not(.wp-block-cover__inner-container .has-base-background-color)::before,
main .wp-block-group.alignfull:nth-child(even):not([class*="background-color"]):not([class*="gradient"]):not(.wp-block-cover):not(.wp-block-cover__inner-container *)::before {
	background-image: radial-gradient(circle, rgba(0, 0, 0, 0.06) 1px, transparent 1px);
	background-size: 28px 28px;
	background-position: 14px 14px;
	opacity: 0.50;
}

/* Ensure white sections have positioning context for the ::before */
main .has-base-background-color.alignfull:not(.wp-block-cover__inner-container .has-base-background-color),
main .wp-block-group.alignfull:not([class*="background-color"]):not([class*="gradient"]):not(.wp-block-cover):not(.wp-block-cover__inner-container *) {
	position: relative;
	isolation: isolate;
}

/* Keep content above the dot pattern */
main .has-base-background-color.alignfull:not(.wp-block-cover__inner-container .has-base-background-color) > *,
main .wp-block-group.alignfull:not([class*="background-color"]):not([class*="gradient"]):not(.wp-block-cover):not(.wp-block-cover__inner-container *) > * {
	position: relative;
	z-index: 1;
}

/* ----- 2. Tertiary Section Enhancement -----
   Give #FFD6E9 backgrounds visible depth with
   layered gradients + inner shadow. */
main .has-tertiary-background-color.alignfull {
	position: relative;
	background-image:
		radial-gradient(ellipse 700px 400px at 15% 10%, rgba(255, 0, 170, 0.10) 0, transparent 65%),
		radial-gradient(circle 600px at 85% 85%, rgba(255, 255, 255, 0.55) 0, transparent 50%),
		radial-gradient(circle 500px at 50% 50%, rgba(255, 255, 255, 0.2) 0, transparent 60%);
	background-repeat: no-repeat;
	box-shadow: inset 0 2px 0 rgba(255, 255, 255, 0.6), inset 0 -2px 0 rgba(0, 0, 0, 0.04);
}

/* ----- 3. Section Transition Lines -----
   Replace simple border-top with gradient lines. */
.has-tertiary-background-color + .has-tertiary-background-color {
	border-top: none;
	background-image:
		linear-gradient(90deg, transparent, var(--wp--preset--color--border-light, #F2D0E3) 20%, var(--wp--preset--color--primary, #FF00AA) 50%, var(--wp--preset--color--border-light, #F2D0E3) 80%, transparent),
		radial-gradient(ellipse at 20% 10%, rgba(255, 0, 170, 0.06) 0, transparent 50%),
		radial-gradient(circle at 80% 85%, rgba(255, 255, 255, 0.4) 0, transparent 40%);
	background-size: 100% 1px, auto, auto;
	background-position: top, center, center;
	background-repeat: no-repeat;
}

/* White-to-tertiary and tertiary-to-white transitions */
main .has-base-background-color.alignfull + .has-tertiary-background-color.alignfull,
main .has-tertiary-background-color.alignfull + .has-base-background-color.alignfull {
	background-image:
		linear-gradient(90deg, transparent 5%, rgba(255, 0, 170, 0.12) 30%, rgba(255, 0, 170, 0.2) 50%, rgba(255, 0, 170, 0.12) 70%, transparent 95%);
	background-size: 100% 1px;
	background-position: top;
	background-repeat: no-repeat;
}

/* Adjacent white sections — soft gradient divider */
main .has-base-background-color.alignfull + .has-base-background-color.alignfull {
	background-image:
		linear-gradient(90deg, transparent 10%, rgba(242, 208, 227, 0.5) 30%, rgba(242, 208, 227, 0.7) 50%, rgba(242, 208, 227, 0.5) 70%, transparent 90%),
		radial-gradient(circle at 14% 18%, rgba(255, 0, 170, 0.06) 0, rgba(255, 0, 170, 0) 36%),
		radial-gradient(circle at 85% 78%, rgba(0, 0, 0, 0.045) 0, rgba(0, 0, 0, 0) 34%),
		radial-gradient(ellipse at 60% 5%, rgba(255, 0, 170, 0.03) 0, rgba(255, 0, 170, 0) 50%),
		radial-gradient(circle at 95% 25%, rgba(255, 214, 233, 0.25) 0, rgba(255, 214, 233, 0) 30%),
		radial-gradient(circle 800px at 5% 90%, rgba(255, 214, 233, 0.15) 0, rgba(255, 214, 233, 0) 100%);
	background-size: 100% 1px, auto, auto, auto, auto, auto;
	background-position: top, center, center, center, center, center;
	background-repeat: no-repeat;
}

/* ----- 4. Card Design Enhancement on Light Backgrounds -----
   Better shadows, subtle border treatment, refined hover. */
.has-border-light-border-color.has-background[style*="border-radius:5px"] {
	box-shadow: var(--lgd-shadow-card);
	border-color: var(--lgd-border-subtle) !important;
}

.has-border-light-border-color.has-background[style*="border-radius:5px"]:hover {
	box-shadow: var(--lgd-shadow-card-glow);
	border-color: rgba(255, 0, 170, 0.35) !important;
}

/* Accent cards on light sections — visible card treatment */
.has-base-background-color .lgd-accent-card,
.has-tertiary-background-color .lgd-accent-card {
	background: rgba(255, 255, 255, 0.85) !important;
	border: 1px solid rgba(242, 208, 227, 0.7) !important;
	border-radius: 8px;
	box-shadow: var(--lgd-shadow-card);
	transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

.has-base-background-color .lgd-accent-card:hover,
.has-tertiary-background-color .lgd-accent-card:hover {
	transform: translateY(-5px);
	box-shadow: var(--lgd-shadow-card-glow);
	border-color: rgba(255, 0, 170, 0.3) !important;
}

/* ----- 5. Testimonial Card Enhancement -----
   Visible card treatment with subtle gradient, shadow, and pink accent. */
.lgd-testimonial-card {
	background: linear-gradient(160deg, #ffffff 0%, #fdf8fa 40%, #faf0f5 100%) !important;
	border: 1px solid rgba(242, 208, 227, 0.5) !important;
	border-top: 3px solid var(--wp--preset--color--primary, #FF00AA) !important;
	border-radius: 10px !important;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04), 0 8px 24px rgba(255, 0, 170, 0.06);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.lgd-testimonial-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 8px 28px rgba(255, 0, 170, 0.1), 0 4px 12px rgba(0, 0, 0, 0.06);
}

/* Testimonial card profile images: centered, circular, no border */
.lgd-testimonial-card .wp-block-image,
.lgd-testimonial-card .wp-block-image.has-border-color,
.lgd-testimonial-card .wp-block-image.has-primary-border-color {
	border: 0 !important;
	text-align: center;
}
.lgd-testimonial-card .wp-block-image img {
	border: 0 !important;
	border-radius: 50% !important;
	margin-left: auto;
	margin-right: auto;
	display: block;
	object-fit: cover;
}
.lgd-testimonial-card .wp-block-image + p,
.lgd-testimonial-card .wp-block-image ~ p {
	text-align: center;
}

/* Star rating: override lgd-inline-icon size constraint for multi-icon spans */
.lgd-star-rating {
	width: auto !important;
	height: auto !important;
	gap: 2px;
	justify-content: center;
}
.lgd-testimonial-card .lgd-star-rating,
.lgd-testimonial-card p:has(.lgd-star-rating) {
	text-align: center;
	display: flex;
	justify-content: center;
}
.lgd-star-rating svg {
	width: 22px !important;
	height: 22px !important;
	fill: currentColor;
}

/* ----- 6. Typography Micro-Polish -----
   Subtle refinements for headings on light sections. */

/* Large display headings on white — very subtle text shadow for depth */
.has-base-background-color .has-secondary-font-family.has-xx-large-font-size,
.has-base-background-color .has-secondary-font-family.has-x-large-font-size {
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}

/* Eyebrow labels on light sections — refined tracking + weight */
.has-base-background-color p.has-primary-color.has-x-small-font-size[style*="text-transform:uppercase"],
.has-tertiary-background-color p.has-primary-color.has-x-small-font-size[style*="text-transform:uppercase"] {
	font-weight: 700;
	font-stretch: 90%;
	letter-spacing: 0.16em;
}

/* ----- 7. White Cards in Gradient Sections -----
   Solid white cards with clean shadow against dark gradients. */
[class*="gradient-background"] .has-base-background-color[style*="border-radius"] {
	background: #ffffff !important;
	box-shadow: 0 8px 32px rgba(0, 0, 0, 0.15);
	border: 1px solid rgba(255, 255, 255, 0.2) !important;
}

/* ----- 8. Utility: Dot Grid Pattern Class -----
   Can be added to any white section via block
   editor Additional CSS Classes field. */
.lgd-dot-grid {
	position: relative;
}

.lgd-dot-grid::before {
	content: "";
	position: absolute;
	inset: 0;
	background-image: radial-gradient(circle, rgba(0, 0, 0, 0.05) 1px, transparent 1px);
	background-size: 20px 20px;
	pointer-events: none;
	z-index: 0;
	opacity: 0.5;
}

.lgd-dot-grid > * {
	position: relative;
	z-index: 1;
}

/* ----- 9. Blockquote Enhancement on Light Sections -----
   Elevate blockquotes on white/tertiary with card treatment. */
.has-base-background-color .wp-block-quote:not(.single-post .wp-block-quote),
.has-tertiary-background-color .wp-block-quote:not(.single-post .wp-block-quote) {
	background: rgba(255, 214, 233, 0.22);
	border-radius: 0 8px 8px 0;
	padding: 1.5rem 1.75rem 1.5rem 2rem;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
}

/* ----- 10. Column-Box-Shadow Polish on Light -----
   Visible shadows + border + hover for Ollie's box-shadow cards. */
.has-base-background-color .is-style-column-box-shadow,
.has-tertiary-background-color .is-style-column-box-shadow {
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06), 0 6px 20px rgba(0, 0, 0, 0.05) !important;
	border: 1px solid rgba(242, 208, 227, 0.5);
}

.has-base-background-color .is-style-column-box-shadow:hover,
.has-tertiary-background-color .is-style-column-box-shadow:hover {
	box-shadow: 0 14px 40px rgba(0, 0, 0, 0.1), 0 0 0 1px rgba(255, 0, 170, 0.12) !important;
	border-color: rgba(255, 0, 170, 0.25);
}

/* ----- 11. White-to-Dark Section Gradient Fade -----
   Visible gradient edge where white meets dark. */
main .has-base-background-color.alignfull + [class*="gradient-background"],
main .has-tertiary-background-color.alignfull + [class*="gradient-background"] {
	position: relative;
}

main .has-base-background-color.alignfull + [class*="gradient-background"]::before,
main .has-tertiary-background-color.alignfull + [class*="gradient-background"]::before {
	content: "";
	position: absolute;
	top: -1px;
	left: 0;
	right: 0;
	height: 60px;
	background: linear-gradient(180deg, rgba(255, 214, 233, 0.15) 0%, transparent 100%);
	pointer-events: none;
	z-index: 2;
}

/* Dark-to-white: pink glow fading into the white section */
main [class*="gradient-background"] + .has-base-background-color.alignfull::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 80px;
	background: linear-gradient(180deg, rgba(255, 0, 170, 0.06) 0%, transparent 100%);
	pointer-events: none;
	z-index: 0;
}

/* ----- 12. Numbered Grid Items on White Sections -----
   Card treatment for numbered content blocks (01-06 grids)
   inside white sections — left border accent + background. */
.has-base-background-color .wp-block-columns > .wp-block-column:has(h3) {
	background: rgba(255, 255, 255, 0.95);
	border-left: 3px solid var(--wp--preset--color--primary, #FF00AA);
	border-radius: 0 6px 6px 0;
	padding: 1.25rem 1.5rem;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04), 0 3px 10px rgba(0, 0, 0, 0.03);
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.has-base-background-color .wp-block-columns > .wp-block-column:has(h3):hover {
	transform: translateY(-2px);
	box-shadow: var(--lgd-shadow-card-glow);
}

/* Alternating subtle bg tint on even numbered items */
.has-base-background-color .wp-block-columns:nth-child(even) > .wp-block-column:has(h3) {
	background: rgba(255, 214, 233, 0.08);
}

/* ----- 13. Testimonial Zone Background -----
   Give testimonial sections on white a distinct
   visual zone with a tertiary tint wash. */
.has-base-background-color .lgd-testimonial-card {
	position: relative;
}

.has-base-background-color:has(.lgd-testimonial-card) {
	background-image:
		radial-gradient(ellipse 900px 600px at 50% 50%, rgba(255, 214, 233, 0.25) 0, transparent 70%),
		radial-gradient(circle 600px at 8% 15%, rgba(255, 0, 170, 0.14) 0, rgba(255, 0, 170, 0) 60%),
		radial-gradient(circle 500px at 90% 80%, rgba(255, 0, 170, 0.10) 0, rgba(255, 0, 170, 0) 55%),
		radial-gradient(ellipse 800px 500px at 50% 0%, rgba(255, 214, 233, 0.35) 0, rgba(255, 214, 233, 0) 70%),
		radial-gradient(circle 700px at 95% 20%, rgba(255, 214, 233, 0.30) 0, rgba(255, 214, 233, 0) 65%),
		radial-gradient(circle 900px at 5% 90%, rgba(255, 214, 233, 0.25) 0, rgba(255, 214, 233, 0) 70%);
}

/* =============================================
   Active Page Indicator — Nav highlight
   Uses aria-current="page" added by WP nav block.
   ============================================= */
.lgd-site-header .wp-block-navigation-item a[aria-current="page"] {
	color: var(--wp--preset--color--primary, #FF00AA) !important;
}

/* =============================================
   WCAG 2.1 AA — Accessibility Fixes
   ============================================= */

/* A1. Global focus-visible for all interactive elements
   (header/nav already covered at line 155-162) */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[tabindex]:focus-visible {
	outline: 2px solid var(--wp--preset--color--primary, #FF00AA);
	outline-offset: 2px;
	border-radius: 2px;
}

/* On dark/gradient backgrounds, use white focus ring */
.has-black-pink-accent-gradient-background a:focus-visible,
.has-black-pink-accent-gradient-background button:focus-visible,
.has-black-gradient-background a:focus-visible,
.has-black-gradient-background button:focus-visible,
.has-hot-pink-dark-gradient-background a:focus-visible,
.has-hot-pink-dark-gradient-background button:focus-visible,
.has-black-hot-pink-gradient-background a:focus-visible,
.has-black-hot-pink-gradient-background button:focus-visible,
.has-main-background-color a:focus-visible,
.has-main-background-color button:focus-visible {
	outline-color: #fff;
}

/* A2. Social share links — minimum 44×44px touch target */
.lgd-social-share a {
	min-width: 44px;
	min-height: 44px;
}

/* A3. Sticky contact bar focus style */
.lgd-sticky-contact a:focus-visible {
	outline: 2px solid #fff;
	outline-offset: -2px;
}

/* A4. Button minimum touch target (WCAG 2.5.8) */
.wp-block-button__link {
	min-height: 44px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

/* A5. Form submit button focus ring */
.lgd-form__submit:focus-visible {
	outline: 2px solid #fff;
	outline-offset: 2px;
}