/* =Child-Theme responsive styles starts here
-------------------------------------------------------------- */

/**
 * The Elementor image carousel (element cec1502) is positioned outside its
 * container on small screens. That doubles the layout viewport width and also
 * pushes the fixed cookie banner below the visual viewport.
 *
 * The carousel is decorative and expensive on mobile, so hide only this
 * instance below Elementor's mobile breakpoint. Desktop and tablet layouts
 * stay unchanged.
 */
@media (max-width: 767px) {
	body.home .elementor-element.elementor-element-cec1502 {
		display: none !important;
	}

	/**
	 * The four-column comparison table in this article has an intrinsic width
	 * of about 620px. Keep the comparison readable with its own horizontal
	 * scroll area instead of widening the complete 412px page.
	 */
	body.postid-3689 .elementor-widget-theme-post-content table {
		display: block;
		box-sizing: border-box;
		width: 100%;
		max-width: 100%;
		overflow-x: auto;
		overscroll-behavior-inline: contain;
		-webkit-overflow-scrolling: touch;
	}
}
