/* K to Z accessibility layer. Loaded after Elementor so these win without !important wars. */

/* Brand link blue, one shade deeper so text on white (and white on it) clears WCAG AA 4.5:1. */
body.elementor-kit-11 { --e-global-color-b9e84dd: #0379B5; }

/* Home "Your Ideal Living Space" band: navy headline type on the original blue already passes
   for large bold text, and fails on the deeper blue, so this band keeps the original. */
body.elementor-kit-11 .elementor-111 .elementor-element-96cb0d7 { --e-global-color-b9e84dd: #048BD1; }

/* Skip-link target: no focus ring box around the whole page when the skip link lands. */
.ktoz-main:focus { outline: none; }

/* Headings moved up a level to keep the outline in order keep their old size. */
.ktoz-h2 { font-size: 2rem; }
.ktoz-h3 { font-size: 1.75rem; }
.ktoz-h4 { font-size: 1.5rem; }
.ktoz-h5 { font-size: 1.25rem; }
.ktoz-h6 { font-size: 1rem; }

/* Links inside running text are underlined, so color is not the only clue. */
.ktoz-main .elementor-widget-text-editor p a,
.ktoz-main .elementor-widget-text-editor li a,
.ktoz-main .elementor-widget-theme-post-content p a,
.ktoz-main .elementor-widget-theme-post-content li a { text-decoration: underline; text-underline-offset: 2px; }

/* Blog cards: date, excerpt and "Read more" darkened just enough to read. */
.elementor-posts .elementor-post__meta-data,
.elementor-posts .elementor-post-date { color: #6B6B6B; }
.elementor-posts .elementor-post__excerpt p { color: #666666; }
body .elementor-posts .elementor-post .elementor-post__text .elementor-post__read-more { color: #2F7A6F; }

/* Visible keyboard focus everywhere (some Elementor widgets remove it). Two-tone ring, white
   inside navy, so it shows on white pages, the navy bars and the blue menu panels alike. */
a:focus-visible, button:focus-visible, [role="button"]:focus-visible, [tabindex]:focus-visible,
input:focus-visible, select:focus-visible, textarea:focus-visible {
	outline: 3px solid #002F5C;
	outline-offset: 2px;
	box-shadow: 0 0 0 2px #FFFFFF;
}
.ktoz-main:focus-visible { outline: none; box-shadow: none; }

/* Mega menu (Interior / Outdoor Living): its open/close button has no visible size, so the
   visible pill shows the keyboard focus ring instead. */
.e-n-menu-title:has(.e-n-menu-dropdown-icon:focus-visible) {
	outline: 3px solid #FFFFFF;
	outline-offset: 3px;
}

/* Reflow at 320px (WCAG 1.4.10): a word too long for the screen (an email, a link) wraps instead
   of pushing the page sideways. Only on narrow screens, so desktop type is untouched. */
@media (max-width: 480px) {
	body { overflow-wrap: break-word; }
	/* Google Reviews carousel arrows sit 20px outside the slider: tuck them inside the edge. */
	.elementor-widget-premium-google-reviews a.carousel-arrow.carousel-next { right: 0; }
	.elementor-widget-premium-google-reviews a.carousel-arrow.carousel-prev { left: 0; }
}

/* Blog tables: header cells (made from bold cells) keep the left alignment they had. */
.ktoz-main .wp-block-table th { text-align: start; }