/**
 * Block-specific visual overrides
 *
 * Per-block styling that cannot be expressed in theme.json.
 * Structural / layout rules belong in theme.json; only visual
 * refinements go here.
 *
 * NOTE: Many rules use !important to override WordPress inline styles
 * injected by the block editor (layout, color, text-decoration).
 * These cannot be beaten by specificity alone. Each !important is
 * intentional and documented inline where non-obvious.
 *
 * @package eye-revolution
 */

/* -----------------------------------------------------------
NAVIGATION
----------------------------------------------------------- */

.wp-block-navigation a {
	transition: color 0.2s;
}

.wp-block-navigation a:hover {
	color: var(--er-gold-mid) !important;
}

.wp-block-navigation .current-menu-item > a,
.wp-block-navigation .current_page_item > a {
	color: var(--er-gold-mid) !important;
}

/* -----------------------------------------------------------
HEADER — full-width charcoal bar + burger overlay
----------------------------------------------------------- */

.er-site-header {
	width:         100%;
	padding-top:    0 !important;
	padding-bottom: 0 !important;
	padding-inline: max(var(--wp--preset--spacing--lg), calc((100% - var(--wp--style--global--wide-size)) / 2)) !important;
	height:        var(--er-nav-height);
	z-index:       1000;
	border-bottom: 1px solid rgba(184, 169, 106, 0.12);
	display:               grid !important;
	grid-template-columns: 1fr auto 1fr;
	align-items:           center;
}

/* Sticky header on the WP template-part wrapper */
.wp-site-blocks > header.wp-block-template-part {
	position: sticky;
	top:      0;
	z-index:  1000;
}

/* Remove parent gap between header and first content block */
.wp-site-blocks > .wp-block-template-part + * {
	margin-top: 0 !important;
}

/* Left spacer column */
.er-site-header .er-header-left {
	min-width: 0;
}

/* Right column: text links + burger, pushed right */
.er-site-header .er-header-right {
	display:         flex !important;
	justify-content: flex-end;
	align-items:     center;
	gap:             1.5rem;
}

/* Always-visible text nav (About + Contact) */
.er-header-text-nav.wp-block-navigation {
	display:     flex !important;
	align-items: center;
}

.er-header-text-nav .wp-block-navigation__container {
	display:     flex !important;
	align-items: center;
	gap:         1.25rem !important;
}

.er-header-text-nav .wp-block-navigation-item__content {
	font-size:       0.7rem !important;
	letter-spacing:  0.14em !important;
	text-transform:  uppercase !important;
	color:           var(--wp--preset--color--gold-light) !important;
	text-decoration: none !important;
	opacity:         1;
	transition:      opacity 0.2s, color 0.2s;
	white-space:     nowrap;
}

.er-header-text-nav .wp-block-navigation-item__content:hover {
	color:   var(--wp--preset--color--gold-mid) !important;
	opacity: 1;
}

/* Hide any burger the text-nav block might render */
.er-header-text-nav .wp-block-navigation__responsive-container-open {
	display: none !important;
}

/* --Wordmark (text logo) ---------------------------------- */
.er-header-wordmark {
	margin:          0 !important;
	line-height:     1 !important;
	font-family:     var(--wp--preset--font-family--alt-riviera) !important;
	font-size:       0.72rem !important;
	font-weight:     500 !important;
	letter-spacing:  0.22em !important;
	text-transform:  uppercase !important;
}

.er-header-wordmark a {
	color:           var(--wp--preset--color--gold-light) !important;
	text-decoration: none !important;
	transition:      opacity 0.2s;
}

.er-header-wordmark a:hover {
	opacity: 0.75;
}

/* --Tablet / mobile header reflow (<=768px) ---------------- */
@media (max-width: 768px) {
	.er-site-header .wp-block-navigation__responsive-container-open::after {
		display: none !important;
	}

	.er-site-header {
		grid-template-rows:    auto auto !important;
		height:                auto !important;
		padding-top:           0.875rem !important;
		padding-bottom:        0.875rem !important;
		row-gap:               0.4rem !important;
	}

	.er-site-header .er-header-left {
		grid-column: 1 !important;
		grid-row:    1 !important;
	}

	.er-site-header .er-header-wordmark {
		grid-column: 2 !important;
		grid-row:    1 !important;
		text-align:  center !important;
	}

	.er-site-header .er-header-right {
		grid-column:     1 / -1 !important;
		grid-row:        2 !important;
		justify-content: center !important;
		padding-bottom:  0.25rem !important;
	}
}

/* --Small mobile (<=480px): hide text nav entirely --------- */
@media (max-width: 480px) {
	.er-header-text-nav {
		display: none !important;
	}
}

/* --Burger button ----------------------------------------- */
.er-site-header .wp-block-navigation__responsive-container-open,
.er-site-header button.wp-block-navigation__responsive-container-open {
	background:  transparent !important;
	border:      none !important;
	padding:     8px !important;
	cursor:      pointer;
	color:       var(--wp--preset--color--off-white) !important;
	display:     flex !important;
	align-items: center;
	gap:         10px;
}

/* Branded focus rings for burger + close */
.er-site-header .wp-block-navigation__responsive-container-open:focus-visible,
.er-site-header .wp-block-navigation__responsive-container-close:focus-visible {
	outline:        2px solid var(--wp--preset--color--gold-mid) !important;
	outline-offset: 4px !important;
	box-shadow:     none !important;
}

/* Overlay nav links: subtle gold underline on keyboard focus */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:focus-visible,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-pages-list__item__link:focus-visible {
	outline:        1px solid rgba(212, 196, 138, 0.6) !important;
	outline-offset: 4px !important;
	box-shadow:     none !important;
}

/* Hide default WP burger SVG */
.er-site-header .wp-block-navigation__responsive-container-open svg,
.er-site-header button.wp-block-navigation__responsive-container-open svg {
	display: none !important;
}

/* Two gold bars (equals-sign style) */
.er-site-header .wp-block-navigation__responsive-container-open::before {
	content:       '';
	display:       block;
	width:         22px;
	height:        11px;
	border-top:    2px solid var(--wp--preset--color--gold-mid);
	border-bottom: 2px solid var(--wp--preset--color--gold-mid);
	flex-shrink:   0;
}

/* -----------------------------------------------------------
FULL-SCREEN NAV OVERLAY
----------------------------------------------------------- */

/* Hidden by default — WordPress toggles is-menu-open */
.er-site-header .wp-block-navigation__responsive-container {
	display: none;
}

@keyframes er-overlay-in {
	from { transform: translateX(-100%); opacity: 0; }
	to   { transform: translateX(0);     opacity: 1; }
}

.er-site-header .wp-block-navigation__responsive-container.is-menu-open {
	display:         flex;
	flex-direction:  column;
	align-items:     center;
	justify-content: center;
	position:        fixed;
	inset:           0;
	z-index:         9999;
	background:      var(--er-overlay-bg) !important;
	padding:         var(--wp--preset--spacing--3xl) var(--wp--preset--spacing--lg);
	animation:       er-overlay-in 400ms cubic-bezier(0.4, 0, 0.2, 1) both;
}

/* Close button */
.er-site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog {
	position: static !important;
}

.er-site-header .wp-block-navigation__responsive-container-close {
	position:   absolute !important;
	top:        1rem !important;
	right:      1.5rem !important;
	transform:  none !important;
	background: transparent !important;
	border:     none !important;
	color:      var(--er-off-white) !important;
	cursor:     pointer;
	padding:    8px !important;
}

.er-site-header .wp-block-navigation__responsive-container-close svg {
	width:  24px;
	height: 24px;
	stroke: var(--er-off-white);
	fill:   none;
}

/* Inner nav container — left-aligned */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	display:         flex !important;
	flex-direction:  column !important;
	align-items:     flex-start !important;
	justify-content: center !important;
	gap:             0 !important;
	width:           100%;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	text-align: left;
	width:      100%;
}

/* Overlay link styles */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-pages-list__item__link {
	font-family:     var(--wp--preset--font-family--alt-riviera) !important;
	font-size:       1rem !important;
	font-weight:     400 !important;
	letter-spacing:  0.12em !important;
	text-transform:  uppercase !important;
	color:           var(--er-off-white) !important;
	text-decoration: none !important;
	line-height:     1 !important;
	padding:         0.65rem 0 !important;
	display:         block;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:hover,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-pages-list__item__link:hover {
	color: var(--er-white) !important;
}

/* Active / current page link in overlay */
.wp-block-navigation__responsive-container.is-menu-open .current-menu-item .wp-block-navigation-item__content,
.wp-block-navigation__responsive-container.is-menu-open .current-menu-item .wp-block-pages-list__item__link,
.wp-block-navigation__responsive-container.is-menu-open .current_page_item .wp-block-pages-list__item__link {
	color:           var(--er-gold-light) !important;
	text-decoration: none !important;
	font-style:      normal !important;
}

/* --Overlay link stagger animation ------------------------ */

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-pages-list__item__link {
	opacity:    0;
	transition: color 0.2s;
}

.wp-block-navigation__responsive-container.is-menu-open .er-stagger-visible {
	opacity:    1;
	transition: opacity 0.22s ease, color 0.2s;
}

/* -----------------------------------------------------------
SUBNAV BAR
----------------------------------------------------------- */

.wp-site-blocks > .wp-block-template-part:has(.er-subnav-bar),
.wp-site-blocks > .er-subnav-wrapper {
	position: sticky;
	top:      var(--er-header-height, 64px);
	z-index:  998;
}

.er-subnav-bar {
	border-bottom: 1px solid rgba(184, 169, 106, 0.18);
}

.er-subnav-menu {
	display:         flex;
	flex-wrap:       wrap;
	align-items:     center;
	justify-content: center;
	gap:             0;
	list-style:      none;
	padding:         0;
	margin:          0;
}

.er-subnav-menu li {
	display:     flex;
	align-items: center;
}

/* Gold pipe separators between items */
.er-subnav-menu li + li::before {
	content:     '|';
	color:       rgba(184, 169, 106, 0.35);
	font-weight: 300;
	margin:      0 1em;
	font-size:   0.5rem;
	line-height: 1;
}

.er-subnav-menu a {
	font-size:       0.625rem;
	letter-spacing:  0.2em;
	text-transform:  uppercase;
	font-weight:     300;
	color:           rgba(245, 243, 238, 0.6);
	text-decoration: none;
	padding:         0.9rem 0;
	transition:      color 0.2s;
	display:         block;
	line-height:     1;
	white-space:     nowrap;
}

.er-subnav-menu a:hover {
	color: rgba(245, 243, 238, 1);
}

.er-subnav-menu .current-menu-item a,
.er-subnav-menu .current_page_item a {
	color:           var(--wp--preset--color--gold-light);
	text-decoration: none;
}

/* Mobile: stack vertically, hide pipes */
@media (max-width: 600px) {
	.er-subnav-menu {
		flex-direction: column;
		gap:            0;
	}

	.er-subnav-menu li + li::before {
		display: none;
	}

	.er-subnav-menu a {
		padding: 0.6rem 0;
	}
}

/* -----------------------------------------------------------
BUTTONS — solid gold, site-wide
----------------------------------------------------------- */

.wp-block-button__link,
.wp-block-button.is-style-outline .wp-block-button__link,
.wp-block-button.is-style-fill .wp-block-button__link,
.er-btn {
	background-color: var(--er-gold-mid) !important;
	border:           none !important;
	color:            var(--er-white) !important;
	padding:          0.6rem 2rem !important;
	transition:       background-color 0.25s, opacity 0.25s;
}

.wp-block-button__link:hover,
.wp-block-button.is-style-outline .wp-block-button__link:hover,
.wp-block-button.is-style-fill .wp-block-button__link:hover,
.er-btn:hover {
	background-color: var(--er-gold-hover) !important;
	color:            var(--er-white) !important;
	border:           none;
	opacity:          1;
}

/* -----------------------------------------------------------
POST CONTENT TYPOGRAPHY
----------------------------------------------------------- */

.wp-block-post-content {
	font-size:   var(--wp--preset--font-size--body);
	line-height: 1.8;
	color:       var(--er-text-body);
}

.wp-block-post-content p + p {
	margin-top: 1.25em;
}

.wp-block-post-content h2,
.wp-block-post-content h3 {
	margin-top: 2em;
}

/* --Blockquote in post content ----------------------------- */
.wp-block-post-content blockquote,
.wp-block-quote {
	border-left:    3px solid var(--er-gold-mid);
	padding-left:   var(--wp--preset--spacing--lg);
	margin-left:    0;
	font-family:    var(--er-font-display);
	font-size:      clamp(1.125rem, 2vw, 1.375rem);
	font-style:     italic;
	font-weight:    300;
	color:          var(--er-charcoal);
	line-height:    1.6;
}

/* -----------------------------------------------------------
COVER BLOCK
----------------------------------------------------------- */

.wp-block-cover__inner-container {
	width: 100%;
	box-sizing: border-box;
}

/* -----------------------------------------------------------
IMAGE BLOCK
----------------------------------------------------------- */

.wp-block-image img {
	transition: transform 0.6s ease;
}

.wp-block-image {
	overflow: hidden;
}

.wp-block-image:hover img {
	transform: scale(1.02);
	
}

/* -----------------------------------------------------------
FOOTER
----------------------------------------------------------- */

footer a {
	color:           var(--er-gold-mid);
	text-decoration: none;
	transition:      color 0.2s;
}

footer a:hover {
	color: var(--er-gold-light);
}

/* -----------------------------------------------------------
SERVICE CARD SPACING
----------------------------------------------------------- */

.wp-block-columns.alignwide .wp-block-column .wp-block-group.has-warm-white-background-color {
	row-gap: var(--wp--preset--spacing--md) !important;
}

/* --Stats bar vertical padding ----------------------------- */
.wp-block-group.has-charcoal-background-color .wp-block-columns .wp-block-column .wp-block-group {
	padding-top:    var(--wp--preset--spacing--xl) !important;
	padding-bottom: var(--wp--preset--spacing--xl) !important;
}

/* --"Trusted by" client-name strip ------------------------- */
.wp-block-group .has-text-muted-color[style*="letter-spacing:0.3em"],
.wp-block-group .has-text-muted-color[style*="letter-spacing: 0.3em"] {
	word-spacing: 0.6em;
}

/* -----------------------------------------------------------
RESPONSIVE
----------------------------------------------------------- */

@media (max-width: 600px) {
	.wp-block-group.alignfull {
		padding-left:  var(--wp--preset--spacing--md) !important;
		padding-right: var(--wp--preset--spacing--md) !important;
	}

	.wp-block-cover {
		padding-left:  var(--wp--preset--spacing--md) !important;
		padding-right: var(--wp--preset--spacing--md) !important;
	}

	.wp-block-columns {
		gap: var(--wp--preset--spacing--xl) !important;
	}
}

@media (max-width: 768px) {
	.wp-block-columns.are-vertically-aligned-top {
		flex-wrap: wrap;
	}
}