/*
 * Exceed Digital Innovations: website audit fixes (October 2026).
 * Loaded after style.css. Remove this file and its enqueue in functions.php to roll back.
 */

/* Visible keyboard focus (WCAG 2.4.7). Mouse clicks don't show it. */
:focus-visible {
	outline: 3px solid #f4511e;
	outline-offset: 2px;
}

/* Mobile menu: the toggle is a transparent checkbox over the hamburger icon. */
.mobile-menu-toggle:focus-visible + .hamb {
	outline: 3px solid #f4511e;
	outline-offset: 6px;
	border-radius: 2px;
}

/* Skip to content link, visible only when focused. */
.skip-link {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 10000;
	padding: 12px 16px;
	background: #fff;
	color: #0c0c0d;
	font-weight: 600;
	text-decoration: none;
}

.skip-link:focus {
	left: 16px;
	top: 16px;
}

/* Smaller hero image on phones (only where the default hero background is used).
   The homepage hero has no inline background; WOW.js adds an inline style for its animation. */
@media (max-width: 767px) {
	.home #hero,
	[style*="hero-background.webp"] {
		background-image: url('../img/hero-background-mobile.webp') !important;
	}
}

/* Gallery images keep their aspect ratio before they load, so the grid doesn't shift. */
#filtergallery .masonry-item img,
#singlegallery .masonry-item img {
	height: auto;
}

/* Visually hidden text for screen readers (form labels). */
.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* Top section of each page shows immediately (no WOW.js fade-in), so the main heading
   paints right away on phones. The fade-in stays on every other section. */
#hero.wow,
#singlehero.wow {
	visibility: visible !important;
	animation-name: none !important;
}