@import url('../../../assets/css/variables.css');

/** START MIXED TYPOGRAPHY **/

.elementor-widget-se_mixed_typography,
.elementor-widget-se_mixed_typography > .elementor-widget-container {
	overflow: visible !important;
}

.se-mixed-typography {
	display: flex;
	position: relative;
	top: 0;
	/*
	 * The custom property avoids WebKit's custom-font baseline differences and
	 * also supersedes legacy Elementor post CSS after this widget is updated.
	 */
	align-items: var(--se-mixed-vertical-align, baseline) !important;
	justify-content: center;
	flex-wrap: nowrap;
	width: 100%;
	margin: 0;
	padding: 48px 0;
	column-gap: 18px;
}

.se-mixed-typography__script,
.se-mixed-typography__primary {
	display: inline-block;
	flex: 0 0 auto;
	margin: 0;
	padding: 0;
	white-space: nowrap;
	line-height: 1;
}

.se-mixed-typography__script {
	position: relative;
	top: var(--se-mixed-script-offset, 0px) !important;
	color: var(--color-text);
	font-family: var(--font-above-beyond);
	font-size: 128px;
	font-weight: 400;
	line-height: 1 !important;
	transform: none !important;
}

.se-mixed-typography__primary {
	color: var(--color-text);
	font-family: var(--font-primary);
	font-size: 72px;
	font-weight: 400;
}

@media (max-width: 1024px) {
	.se-mixed-typography {
		padding-block: 32px;
		column-gap: 14px;
	}

	.se-mixed-typography__script {
		font-size: 96px;
	}

	.se-mixed-typography__primary {
		font-size: 54px;
	}
}

@media (max-width: 768px) {
	.se-mixed-typography {
		padding-block: 24px;
		column-gap: 10px;
	}

	.se-mixed-typography__script {
		font-size: 64px;
	}

	.se-mixed-typography__primary {
		font-size: 34px;
	}
}

/*
 * WebKit can position custom script glyphs differently inside the same line
 * box. Keep that correction independent so Chromium alignment is unaffected.
 */
@supports (font: -apple-system-body) and (-webkit-appearance: none) {
	.se-mixed-typography {
		top: var(--se-mixed-safari-group-offset, 20px) !important;
	}

	.se-mixed-typography__script {
		top: calc(
			var(--se-mixed-script-offset, 0px) +
			var(--se-mixed-script-safari-offset, 0px)
		) !important;
	}
}

/** END MIXED TYPOGRAPHY **/
