/**
 * Mobile-only (<=767px) CTA button polish, site-wide.
 *
 * Audited every page's compiled Elementor CSS first: 106 of the site's
 * ~110 CTA buttons share one identical style (font-size:17px;
 * padding:14px 28px 14px 28px;border-radius:4px), each scoped by
 * Elementor per-element with no !important
 * (".elementor-{post} .elementor-element-{id} .elementor-button{...}").
 * Same pattern found repeatedly elsewhere on this install: a generic
 * override here with !important wins regardless of the per-element rule's
 * higher selector specificity, since !important always beats a
 * non-important declaration. This lets one shared rule cover essentially
 * every CTA button without touching Elementor data or any per-page file.
 *
 * Excluded on purpose:
 *   - .elementor-111 (header template) / .elementor-119 (footer template)
 *     — the header utility-bar CTA already has its own hand-tuned mobile
 *     sizing in platinum-header-mobile.css; this file must not fight it.
 *   - Buttons inside a bespoke grid that already sets its own mobile gap
 *     with a more specific selector (e.g. .tn2-city-row's 4-column city
 *     link grid) naturally win over the generic gap rule below on
 *     selector specificity, so no explicit exclusion is needed there.
 *
 * font-size/padding are reduced, not removed — buttons keep their own
 * per-element color, gradient, border-radius, and hover animation
 * (untouched, defined elsewhere) — only size/spacing changes.
 */

@media (max-width: 767px) {

	.elementor-button:not(.elementor-111 .elementor-button):not(.elementor-119 .elementor-button) {
		font-size: 15px !important;
		padding: 13px 20px !important;
	}

	/*
	 * Gap between two or more CTA buttons sitting in the same row
	 * (Elementor's own default is 20px, via --widgets-spacing on the
	 * shared parent container). :has() with a generic selector means any
	 * page's own more specific bespoke grid CSS (higher selector
	 * specificity, e.g. .tn2-city-row's 4-across city-link grid) still
	 * wins over this fallback -- this only fills in pages that never got
	 * a bespoke gap value of their own.
	 */
	.e-con-inner:has(> .elementor-widget-button + .elementor-widget-button) {
		gap: 10px !important;
		row-gap: 10px !important;
		column-gap: 10px !important;
	}
}
