/* =============================================================================
   Sens — ajustes de diseño
   ============================================================================= */

/* --- 1. CTA buttons on mobile (Marcela, 2026-10-06: most visitors are on mobile) ----------------
   Theme styles 1 ("Pide tu cita", orange) and 2 ("Pide información", purple) are often placed side
   by side in a horizontal wrapper (.w-hwrapper, flex nowrap). On phones they got squeezed and the
   label broke into 2–4 lines. On small screens we stack them, comfortable width, centred. */
@media (max-width: 600px) {
	.w-hwrapper:has(> .w-btn-wrapper > .us-btn-style_1),
	.w-hwrapper:has(> .w-btn-wrapper > .us-btn-style_2) {
		flex-wrap: wrap !important;
		justify-content: center !important;
		row-gap: 12px !important;
	}
	.w-hwrapper > .w-btn-wrapper:has(> .us-btn-style_1),
	.w-hwrapper > .w-btn-wrapper:has(> .us-btn-style_2) {
		flex: 1 1 100% !important;
		max-width: 100% !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
		text-align: center;
	}
	/* stand-alone wrappers (stacked in a column) are shrink-to-fit by default: make them span the
	   column so every CTA pair looks the same on mobile, whatever builder element holds it */
	.w-btn-wrapper:has(> .us-btn-style_1),
	.w-btn-wrapper:has(> .us-btn-style_2) {
		display: block !important;
		width: 100% !important;
		text-align: center !important;
	}
	.w-btn-wrapper > .w-btn.us-btn-style_1,
	.w-btn-wrapper > .w-btn.us-btn-style_2 {
		display: inline-flex !important;
		width: 100%;
		max-width: 340px;
		justify-content: center;
		font-size: 16px !important;
		line-height: 1.25 !important;
		padding-left: 1.2em !important;
		padding-right: 1.2em !important;
		white-space: normal;
	}
}
/* consistent 12px gap when two CTA wrappers are stacked as separate builder elements */
@media (max-width: 600px) {
	.w-btn-wrapper:is(:has(> .us-btn-style_1), :has(> .us-btn-style_2)) + .w-btn-wrapper:is(:has(> .us-btn-style_1), :has(> .us-btn-style_2)) {
		margin-top: 12px !important;
	}
}
/* very narrow phones (≤360px wide): a touch smaller so short labels stay on one line */
@media (max-width: 360px) {
	.w-btn-wrapper > .w-btn.us-btn-style_1,
	.w-btn-wrapper > .w-btn.us-btn-style_2 {
		font-size: 15px !important;
		padding-left: 1em !important;
		padding-right: 1em !important;
	}
}

/* --- 2. Same shape & size for buttons with per-element design overrides -------------------------
   Theme button styles were harmonised in Theme Options (pill, 17px/600). Some builder elements
   (e.g. the home "topic" buttons: Ansiedad, Duelo…) carry their own Design-options CSS
   (.us_custom_xxxx { border-radius / padding !important }) — normalise shape & padding here,
   keeping their own colours. */
.l-main .w-btn[class*="us-btn-style_"][class*="us_custom_"]:not(.sens-btn) {
	/* some of these carry a fixed height in their Design options: centre the label vertically */
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	border-radius: 2em !important;
	padding: 0.85em 1.4em !important;
	font-size: 16px !important;
	font-weight: 600 !important;
	line-height: 1.2 !important;
}
@media (max-width: 600px) {
	.l-main .w-btn[class*="us-btn-style_"]:not(.sens-btn) { font-size: 16px !important; }
}