/**
 * EVO-WIDGET-GIF — mobile-only Integrate banner (Figma two-zone card).
 * Top: copy + CTAs. Bottom: GIF visual band (~45% card height, hub crop).
 */

@media (max-width: 700px) {
	.elementor-widget-evoport-gif {
		--evo-gif-mobile-visual-h: 234px;
	}

	.elementor-widget-evoport-gif > .elementor-widget-container {
		padding: 0 !important;
		margin: 0 !important;
	}

	.elementor-widget-evoport-gif .evo-gif-banner {
		padding: 40px 16px;
		box-sizing: border-box;
	}

	/* Stacked card — auto height, no desktop overlay bg */
	.elementor-widget-evoport-gif .evo-gif-banner__frame,
	.elementor-widget-evoport-gif .evo-gif-banner__frame[style] {
		position: relative;
		display: flex !important;
		flex-direction: column !important;
		align-items: stretch;
		width: 100%;
		max-width: none;
		height: auto !important;
		min-height: 0 !important;
		margin: 0;
		border-radius: 16px;
		overflow: hidden;
		isolation: isolate;
		background-color: #b68f71 !important;
		background-image: none !important;
	}

	/* Zone 1 — content only */
	.elementor-widget-evoport-gif .evo-gif-banner__content,
	.elementor-widget-evoport-gif .evo-gif-banner__content[style] {
		position: relative !important;
		inset: auto !important;
		top: auto !important;
		right: auto !important;
		bottom: auto !important;
		left: auto !important;
		order: 1;
		z-index: 2;
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		width: 100% !important;
		max-width: none !important;
		padding: 24px 16px 28px;
		box-sizing: border-box;
		pointer-events: auto;
		text-align: left;
		background: #b68f71;
		flex: 0 0 auto;
	}

	.elementor-widget-evoport-gif .evo-gif-banner__copy {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		gap: 0;
		width: 100%;
		max-width: none;
		pointer-events: auto;
	}

	.elementor-widget-evoport-gif .evo-gif-banner__title,
	.elementor-widget-evoport-gif .evo-gif-banner h2.evo-gif-banner__title {
		margin: 0 0 20px !important;
		font-family: var(--evo-font-heading, "Manrope", sans-serif) !important;
		font-size: 28px !important;
		font-weight: 500 !important;
		line-height: 1.2 !important;
		letter-spacing: -0.01em !important;
		color: #fff !important;
		text-align: left;
	}

	.elementor-widget-evoport-gif .evo-gif-banner__desc {
		margin: 0 0 33px !important;
		font-family: var(--evo-font-body, "Helvetica Neue", Helvetica, Arial, sans-serif) !important;
		font-size: 14px !important;
		font-weight: 400 !important;
		line-height: 1.25 !important;
		letter-spacing: 0.04em !important;
		color: #fff !important;
		max-width: none;
	}

	.elementor-widget-evoport-gif .evo-gif-banner__actions {
		display: flex;
		flex-direction: row !important;
		flex-wrap: wrap;
		align-items: center;
		justify-content: flex-start;
		gap: 8px !important;
		width: 100%;
		max-width: 100%;
		margin: 0 !important;
	}

	.elementor-widget-evoport-gif .evo-gif-banner__actions--single {
		justify-content: center !important;
	}

	.elementor-widget-evoport-gif .evo-gif-banner__btn--outline,
	.elementor-widget-evoport-gif .evo-gif-banner .evo-btn {
		width: auto !important;
		min-height: 44px;
		height: 44px;
		padding: 12px 24px !important;
		font-family: var(--evo-font-button, "Manrope", sans-serif) !important;
		font-size: 12px !important;
		font-weight: 500 !important;
		line-height: 20px !important;
		border-radius: 8px !important;
		justify-content: center;
		flex: 0 0 auto;
		box-sizing: border-box;
	}

	.elementor-widget-evoport-gif .evo-gif-banner__btn--outline {
		color: #fff !important;
		border: 1px solid currentColor !important;
		background: transparent !important;
		background-image: none !important;
		box-shadow: none !important;
	}

	.elementor-widget-evoport-gif .evo-gif-banner .evo-btn {
		background: #fff !important;
		color: #1a1814 !important;
		border: 1px solid #fff !important;
	}

	.elementor-widget-evoport-gif .evo-gif-banner .evo-btn::after,
	.elementor-widget-evoport-gif .evo-gif-banner .evo-btn::before {
		display: none;
	}

	/* Zone 2 — Figma GIF band (~234px / ~45% of 517px card) */
	.elementor-widget-evoport-gif .evo-gif-banner__visual {
		order: 2;
		position: relative;
		z-index: 1;
		display: block;
		width: 100%;
		height: var(--evo-gif-mobile-visual-h, 234px);
		min-height: var(--evo-gif-mobile-visual-h, 234px);
		flex: 0 0 var(--evo-gif-mobile-visual-h, 234px);
		overflow: hidden;
		background: #b68f71;
		line-height: 0;
	}

	.elementor-widget-evoport-gif .evo-gif-banner__visual .evo-gif-banner__bg,
	.elementor-widget-evoport-gif .evo-gif-banner__visual .evo-gif-banner__bg[style] {
		position: absolute !important;
		inset: 0 !important;
		top: 0 !important;
		right: 0 !important;
		bottom: 0 !important;
		left: 0 !important;
		z-index: 0;
		display: block !important;
		width: 100% !important;
		height: 100% !important;
		max-width: none !important;
		max-height: none !important;
		margin: 0 !important;
		padding: 0 !important;
		transform: none !important;
		object-fit: cover !important;
		object-position: 84% 72% !important;
		pointer-events: none;
	}
}