/* Client review fixes, October 2026: sideways scrolling and tap targets. */

/* Fixed-width Elementor widgets (420px / 400px) sat in no-wrap rows whose other column could not shrink,
   so at 1024-1366px the row ran past the screen. Let both columns shrink. */
.e-con:has(> .elementor-widget__width-420px) > *,
.e-con:has(> .elementor-widget__width-400px) > * { min-width: 0; }
@media (min-width: 1025px) and (max-width: 1400px) {
	.elementor-widget__width-420px { width: min(420px, 36%) !important; flex-shrink: 1; }
	.elementor-widget__width-400px { width: min(400px, 36%) !important; flex-shrink: 1; }
}
@media (max-width: 1024px) {
	.elementor-widget__width-420px,
	.elementor-widget__width-400px { max-width: 100%; flex-shrink: 1; }
	.e-con:has(> .elementor-widget__width-420px),
	.e-con:has(> .elementor-widget__width-400px) { flex-wrap: wrap; }
}

/* Series guides: the "Talk to a designer" row with the form. */
.gd-talk > * { min-width: 0; }
.gd-talk .kd-gd-form { flex: 0 1 488px; max-width: 100%; }
@media (max-width: 1100px) {
	.gd-talk { flex-wrap: wrap; }
	.gd-talk .kd-gd-form { flex: 1 1 100%; }
}

/* Small phones: long buttons wrap instead of running past the edge. */
@media (max-width: 480px) {
	.elementor-button, .cbtn, .spacer-btn .cbtn { max-width: 100%; white-space: normal; text-align: center; }
	.elementor-button .elementor-button-text { white-space: normal; }
	.kd-hp-card { max-width: calc(100vw - 40px); }
}

/* Safety net: nothing may widen the page (the off-screen mobile menu included). clip keeps sticky elements working. */
html, body { overflow-x: clip; }

/* Phone and email links at least 24px tall (WCAG 2.2 target size). */
.elementor a[href^="tel:"],
.elementor a[href^="mailto:"],
.kd-sr a[href^="tel:"],
.kd-sr a[href^="mailto:"] { display: inline-flex; align-items: center; min-height: 24px; }

/* Homepage: a photo container fixed at 894px stays inside narrower screens. */
.elementor-element-bc1a724 { max-width: 100%; }

/* Long email addresses wrap on small phones instead of running past the edge. */
a[href^="mailto:"] { overflow-wrap: anywhere; }
