@total_onion/onion-library 3.0.49 → 3.2.0

package/components/fields-core-typography-mixins-v3/core-typography-mixins-v3.scss

@@ -1,1080 +0,0 @@
-@use '../fields-core-functions-v3/core-functions-v3';
-@use '../fields-core-mixins-v3/core-mixins-v3';
-@use '../../breakpoints';
-
-@mixin h-xl-size {
-	font-size: clamp(
-		var(--h-xl-font-size-min-desktop, 10px),
-		core-functions-v3.fontSize(var(--h-xl-desktop, 280)),
-		var(--h-xl-font-size-max-desktop, 180px)
-	);
-	line-height: var(--h-xl-line-height);
-	letter-spacing: var(--h-xl-letter-spacing);
-}
-@mixin h-xl {
-	letter-spacing: var(--h-xl-letter-spacing);
-	line-height: var(--h-xl-line-height);
-	font-family: var(--h-xl-font-family);
-	--default-font-weight: var(--h-xl-default-font-weight);
-	font-weight: var(--default-font-weight);
-	strong,
-	b {
-		font-weight: var(--h-xl-bold-font-weight);
-	}
-	font-size: clamp(
-		var(--h-xl-font-size-min-mobile, 10px),
-		core-functions-v3.fontSize(var(--h-xl-mobile, 44), 'mobile'),
-		var(--h-xl-font-size-max-mobile, 180px)
-	);
-	@include core-mixins-v3.device(breakpoints.$tabPortrait) {
-		font-size: clamp(
-			var(--h-xl-font-size-min-mobile, 10px),
-			core-functions-v3.fontSize(var(--h-xl-portrait, 44), 'portrait'),
-			var(--h-xl-font-size-max-mobile, 180px)
-		);
-	}
-	@include core-mixins-v3.device(breakpoints.$tabLandscape) {
-		font-size: clamp(
-			var(--h-xl-font-size-min-desktop, 10px),
-			core-functions-v3.fontSize(var(--h-xl-landscape, 70), 'landscape'),
-			var(--h-xl-font-size-max-desktop, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$desktop) {
-		@include h-xl-size();
-	}
-}
-@mixin h-l-size {
-	font-size: clamp(
-		var(--h-l-font-size-min-desktop, 10px),
-		core-functions-v3.fontSize(var(--h-l-desktop, 220)),
-		var(--h-l-font-size-max-desktop, 180px)
-	);
-	letter-spacing: var(--h-l-letter-spacing);
-	line-height: var(--h-l-line-height);
-}
-@mixin h-l {
-	letter-spacing: var(--h-l-letter-spacing);
-	line-height: var(--h-l-line-height);
-	font-family: var(--h-l-font-family);
-	--default-font-weight: var(--h-l-default-font-weight);
-	font-weight: var(--h-l-default-font-weight);
-
-	strong,
-	b {
-		font-weight: var(--h-l-bold-font-weight);
-	}
-
-	font-size: clamp(
-		var(--h-l-font-size-min-mobile, 10px),
-		core-functions-v3.fontSize(var(--h-l-mobile, 32), 'mobile'),
-		var(--h-l-font-size-max-mobile, 180px)
-	);
-
-	@include core-mixins-v3.device(breakpoints.$tabPortrait) {
-		font-size: clamp(
-			var(--h-l-font-size-min-mobile, 10px),
-			core-functions-v3.fontSize(var(--h-l-portrait, 32), 'portrait'),
-			var(--h-l-font-size-max-mobile, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$tabLandscape) {
-		font-size: clamp(
-			var(--h-l-font-size-min-desktop, 10px),
-			core-functions-v3.fontSize(var(--h-l-landscape, 44), 'landscape'),
-			var(--h-l-font-size-max-desktop, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$desktop) {
-		@include h-l-size();
-	}
-}
-@mixin h-m-size {
-	font-size: clamp(
-		var(--h-m-font-size-min-desktop, 10px),
-		core-functions-v3.fontSize(var(--h-m-desktop, 32)),
-		var(--h-m-font-size-max-desktop, 180px)
-	);
-	letter-spacing: var(--h-m-letter-spacing);
-	line-height: var(--h-m-line-height);
-}
-@mixin h-m {
-	letter-spacing: var(--h-m-letter-spacing);
-	line-height: var(--h-m-line-height);
-	font-family: var(--h-m-font-family);
-	--default-font-weight: var(--h-m-default-font-weight);
-	font-weight: var(--default-font-weight);
-
-	strong,
-	b {
-		font-weight: var(--h-m-bold-font-weight);
-	}
-
-	font-size: clamp(
-		var(--h-m-font-size-min-mobile, 10px),
-		core-functions-v3.fontSize(var(--h-m-mobile, 24)),
-		var(--h-m-font-size-max-mobile, 180px)
-	);
-
-	@include core-mixins-v3.device(breakpoints.$tabPortrait) {
-		font-size: clamp(
-			var(--h-m-font-size-min-mobile, 10px),
-			core-functions-v3.fontSize(var(--h-m-portrait, 24)),
-			var(--h-m-font-size-max-mobile, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$tabLandscape) {
-		font-size: clamp(
-			var(--h-m-font-size-min-desktop, 10px),
-			core-functions-v3.fontSize(var(--h-m-landscape, 32)),
-			var(--h-m-font-size-max-desktop, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$desktop) {
-		@include h-m-size();
-	}
-}
-@mixin h-s-size {
-	font-size: clamp(
-		var(--h-s-font-size-min-desktop, 10px),
-		core-functions-v3.fontSize(var(--h-s-desktop, 24)),
-		var(--h-s-font-size-max-desktop, 180px)
-	);
-	letter-spacing: var(--h-s-letter-spacing);
-	line-height: var(--h-s-line-height);
-}
-@mixin h-s {
-	letter-spacing: var(--h-s-letter-spacing);
-	line-height: var(--h-s-line-height);
-	font-family: var(--h-s-font-family);
-	--default-font-weight: var(--h-s-default-font-weight);
-	font-weight: var(--default-font-weight);
-
-	strong,
-	b {
-		font-weight: var(--h-s-bold-font-weight);
-	}
-
-	font-size: clamp(
-		var(--h-s-font-size-min-mobile, 10px),
-		core-functions-v3.fontSize(var(--h-s-mobile, 20), 'mobile'),
-		var(--h-s-font-size-max-mobile, 180px)
-	);
-
-	@include core-mixins-v3.device(breakpoints.$tabPortrait) {
-		font-size: clamp(
-			var(--h-s-font-size-min-mobile, 10px),
-			core-functions-v3.fontSize(var(--h-s-portrait, 20), 'portrait'),
-			var(--h-s-font-size-max-mobile, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$tabLandscape) {
-		font-size: clamp(
-			var(--h-s-font-size-min-desktop, 10px),
-			core-functions-v3.fontSize(var(--h-s-landscape, 24), 'landscape'),
-			var(--h-s-font-size-max-desktop, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$desktop) {
-		@include h-s-size();
-	}
-}
-@mixin h-xs-size {
-	font-size: clamp(
-		var(--h-xs-font-size-min-desktop, 10px),
-		core-functions-v3.fontSize(var(--h-xs-desktop, 18)),
-		var(--h-xs-font-size-max-desktop, 180px)
-	);
-	letter-spacing: var(--h-xs-letter-spacing);
-	line-height: var(--h-xs-line-height);
-}
-@mixin h-xs {
-	letter-spacing: var(--h-xs-letter-spacing);
-	line-height: var(--h-xs-line-height);
-	font-family: var(--h-xs-font-family);
-	--default-font-weight: var(--h-xs-default-font-weight);
-	font-weight: var(--default-font-weight);
-
-	strong,
-	b {
-		font-weight: var(--h-xs-bold-font-weight);
-	}
-
-	font-size: clamp(
-		var(--h-xs-font-size-min-mobile, 10px),
-		core-functions-v3.fontSize(var(--h-xs-mobile, 14), 'mobile'),
-		var(--h-xs-font-size-max-mobile, 180px)
-	);
-
-	@include core-mixins-v3.device(breakpoints.$tabPortrait) {
-		font-size: clamp(
-			var(--h-xs-font-size-min-mobile, 10px),
-			core-functions-v3.fontSize(var(--h-xs-portrait, 14), 'portrait'),
-			var(--h-xs-font-size-max-mobile, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$tabLandscape) {
-		font-size: clamp(
-			var(--h-xs-font-size-min-desktop, 10px),
-			core-functions-v3.fontSize(var(--h-xs-landscape, 18), 'landscape'),
-			var(--h-xs-font-size-max-desktop, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$desktop) {
-		@include h-xs-size();
-	}
-}
-@mixin h-xxs-size {
-	font-size: clamp(
-		var(--h-xxs-font-size-min-desktop, 10px),
-		core-functions-v3.fontSize(var(--h-xxs-desktop, 16)),
-		var(--h-xxs-font-size-max-desktop, 180px)
-	);
-	letter-spacing: var(--h-xxs-letter-spacing);
-	line-height: var(--h-xxs-line-height);
-}
-@mixin h-xxs {
-	letter-spacing: var(--h-xxs-letter-spacing);
-	line-height: var(--h-xxs-line-height);
-	font-family: var(--h-xxs-font-family);
-	--default-font-weight: var(--h-xxs-default-font-weight);
-	font-weight: var(--default-font-weight);
-
-	strong,
-	b {
-		font-weight: var(--h-xxs-bold-font-weight);
-	}
-
-	font-size: clamp(
-		var(--h-xxs-font-size-min-mobile, 10px),
-		core-functions-v3.fontSize(var(--h-xxs-mobile, 12), 'mobile'),
-		var(--h-xxs-font-size-max-mobile, 180px)
-	);
-
-	@include core-mixins-v3.device(breakpoints.$tabPortrait) {
-		font-size: clamp(
-			var(--h-xxs-font-size-min-mobile, 10px),
-			core-functions-v3.fontSize(var(--h-xxs-portrait, 12), 'portrait'),
-			var(--h-xxs-font-size-max-mobile, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$tabLandscape) {
-		font-size: clamp(
-			var(--h-xxs-font-size-min-desktop, 10px),
-			core-functions-v3.fontSize(var(--h-xxs-landscape, 16), 'landscape'),
-			var(--h-xxs-font-size-max-desktop, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$desktop) {
-		@include h-xxs-size();
-	}
-}
-@mixin h-xxxs-size {
-	font-size: clamp(
-		var(--h-xxxs-font-size-min-desktop, 10px),
-		core-functions-v3.fontSize(var(--h-xxxs-desktop, 12)),
-		var(--h-xxxs-font-size-max-desktop, 180px)
-	);
-	letter-spacing: var(--h-xxxs-letter-spacing);
-	line-height: var(--h-xxxs-line-height);
-}
-@mixin h-xxxs {
-	letter-spacing: var(--h-xxxs-letter-spacing);
-	line-height: var(--h-xxxs-line-height);
-	font-family: var(--h-xxxs-font-family);
-	--default-font-weight: var(--h-xxxs-default-font-weight);
-	font-weight: var(--default-font-weight);
-
-	strong,
-	b {
-		font-weight: var(--h-xxxs-bold-font-weight);
-	}
-
-	font-size: clamp(
-		var(--h-xxxs-font-size-min-mobile, 10px),
-		core-functions-v3.fontSize(var(--h-xxxs-mobile, 10), 'mobile'),
-		var(--h-xxxs-font-size-max-mobile, 180px)
-	);
-
-	@include core-mixins-v3.device(breakpoints.$tabPortrait) {
-		font-size: clamp(
-			var(--h-xxxs-font-size-min-mobile, 10px),
-			core-functions-v3.fontSize(var(--h-xxxs-portrait, 10), 'portrait'),
-			var(--h-xxxs-font-size-max-mobile, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$tabLandscape) {
-		font-size: clamp(
-			var(--h-xxxs-font-size-min-desktop, 10px),
-			core-functions-v3.fontSize(
-				var(--h-xxxs-landscape, 12),
-				'landscape'
-			),
-			var(--h-xxxs-font-size-max-desktop, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$desktop) {
-		@include h-xxxs-size();
-	}
-}
-
-@mixin sh-xxxl-size {
-	font-size: clamp(
-		var(--sh-xxxl-font-size-min-desktop, 10px),
-		core-functions-v3.fontSize(var(--sh-xxxl-desktop, 70)),
-		var(--sh-xxxl-font-size-max-desktop, 180px)
-	);
-	letter-spacing: var(--sh-xxxl-letter-spacing);
-	line-height: var(--sh-xxxl-line-height);
-}
-
-@mixin sh-xxxl {
-	letter-spacing: var(--sh-xxxl-letter-spacing);
-	line-height: var(--sh-xxxl-line-height);
-	font-family: var(--sh-xxxl-font-family);
-	--default-font-weight: var(--sh-xxxl-default-font-weight);
-	font-weight: var(--default-font-weight);
-
-	strong,
-	b {
-		font-weight: var(--sh-xxxl-bold-font-weight);
-	}
-
-	font-size: clamp(
-		var(--sh-xxxl-font-size-min-mobile, 10px),
-		core-functions-v3.fontSize(var(--sh-xxxl-mobile, 60)),
-		var(--sh-xxxl-font-size-max-mobile, 180px)
-	);
-
-	@include core-mixins-v3.device(breakpoints.$desktop) {
-		@include sh-xxxl-size();
-	}
-}
-
-@mixin sh-xxl-size {
-	font-size: clamp(
-		var(--sh-xxl-font-size-min-desktop, 10px),
-		core-functions-v3.fontSize(var(--sh-xxl-desktop, 52)),
-		var(--sh-xxl-font-size-max-desktop, 180px)
-	);
-	letter-spacing: var(--sh-xxl-letter-spacing);
-	line-height: var(--sh-xxl-line-height);
-}
-
-@mixin sh-xxl {
-	letter-spacing: var(--sh-xxl-letter-spacing);
-	line-height: var(--sh-xxl-line-height);
-	font-family: var(--sh-xxl-font-family);
-	--default-font-weight: var(--sh-xxl-default-font-weight);
-	font-weight: var(--default-font-weight);
-
-	strong,
-	b {
-		font-weight: var(--sh-xxl-bold-font-weight);
-	}
-
-	font-size: clamp(
-		var(--sh-xxl-font-size-min-mobile, 10px),
-		core-functions-v3.fontSize(var(--sh-xxl-mobile, 40)),
-		var(--sh-xxl-font-size-max-mobile, 180px)
-	);
-
-	@include core-mixins-v3.device(breakpoints.$desktop) {
-		@include sh-xxl-size();
-	}
-}
-
-@mixin sh-xl-size {
-	font-size: clamp(
-		var(--sh-xl-font-size-min-desktop, 10px),
-		core-functions-v3.fontSize(var(--sh-xl-desktop, 52)),
-		var(--sh-xl-font-size-max-desktop, 180px)
-	);
-	letter-spacing: var(--sh-xl-letter-spacing);
-	line-height: var(--sh-xl-line-height);
-}
-@mixin sh-xl {
-	letter-spacing: var(--sh-xl-letter-spacing);
-	line-height: var(--sh-xl-line-height);
-	font-family: var(--sh-xl-font-family);
-	--default-font-weight: var(--sh-xl-default-font-weight);
-	font-weight: var(--default-font-weight);
-
-	strong,
-	b {
-		font-weight: var(--sh-xl-bold-font-weight);
-	}
-
-	font-size: clamp(
-		var(--sh-xl-font-size-min-mobile, 10px),
-		core-functions-v3.fontSize(var(--sh-xl-mobile, 44)),
-		var(--sh-xl-font-size-max-mobile, 180px)
-	);
-
-	@include core-mixins-v3.device(breakpoints.$tabPortrait) {
-		font-size: clamp(
-			var(--sh-xl-font-size-min-mobile, 10px),
-			core-functions-v3.fontSize(var(--sh-xl-portrait, 44), 'portrait'),
-			var(--sh-xl-font-size-max-mobile, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$tabLandscape) {
-		font-size: clamp(
-			var(--sh-xl-font-size-min-desktop, 10px),
-			core-functions-v3.fontSize(var(--sh-xl-landscape, 70), 'landscape'),
-			var(--sh-xl-font-size-max-desktop, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$desktop) {
-		@include sh-xl-size();
-	}
-}
-@mixin sh-l-size {
-	font-size: clamp(
-		var(--sh-l-font-size-min-desktop, 10px),
-		core-functions-v3.fontSize(var(--sh-l-desktop, 44)),
-		var(--sh-l-font-size-max-desktop, 180px)
-	);
-	letter-spacing: var(--sh-l-letter-spacing);
-	line-height: var(--sh-l-line-height);
-}
-@mixin sh-l {
-	letter-spacing: var(--sh-l-letter-spacing);
-	line-height: var(--sh-l-line-height);
-	font-family: var(--sh-l-font-family);
-	--default-font-weight: var(--sh-l-default-font-weight);
-	font-weight: var(--default-font-weight);
-
-	strong,
-	b {
-		font-weight: var(--sh-l-bold-font-weight);
-	}
-
-	font-size: clamp(
-		var(--sh-l-font-size-min-mobile, 10px),
-		core-functions-v3.fontSize(var(--sh-l-mobile, 32)),
-		var(--sh-l-font-size-max-mobile, 180px)
-	);
-
-	@include core-mixins-v3.device(breakpoints.$tabPortrait) {
-		font-size: clamp(
-			var(--sh-l-font-size-min-mobile, 10px),
-			core-functions-v3.fontSize(var(--sh-l-portrait, 32)),
-			var(--sh-l-font-size-max-mobile, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$tabLandscape) {
-		font-size: clamp(
-			var(--sh-l-font-size-min-desktop, 10px),
-			core-functions-v3.fontSize(var(--sh-l-landscape, 44)),
-			var(--sh-l-font-size-max-desktop, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$desktop) {
-		@include sh-l-size();
-	}
-}
-@mixin sh-m-size {
-	font-size: clamp(
-		var(--sh-m-font-size-min-desktop, 10px),
-		core-functions-v3.fontSize(var(--sh-m-desktop, 30)),
-		var(--sh-m-font-size-max-desktop, 180px)
-	);
-	letter-spacing: var(--sh-m-letter-spacing);
-	line-height: var(--sh-m-line-height);
-}
-@mixin sh-m {
-	letter-spacing: var(--sh-m-letter-spacing);
-	line-height: var(--sh-m-line-height);
-	font-family: var(--sh-m-font-family);
-	--default-font-weight: var(--sh-m-default-font-weight);
-	font-weight: var(--default-font-weight);
-
-	strong,
-	b {
-		font-weight: var(--sh-m-bold-font-weight);
-	}
-
-	font-size: clamp(
-		var(--sh-m-font-size-min-mobile, 10px),
-		core-functions-v3.fontSize(var(--sh-m-mobile, 24)),
-		var(--sh-m-font-size-max-mobile, 180px)
-	);
-
-	@include core-mixins-v3.device(breakpoints.$tabPortrait) {
-		font-size: clamp(
-			var(--sh-m-font-size-min-mobile, 10px),
-			core-functions-v3.fontSize(var(--sh-m-portrait, 24)),
-			var(--sh-m-font-size-max-mobile, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$tabLandscape) {
-		font-size: clamp(
-			var(--sh-m-font-size-min-desktop, 10px),
-			core-functions-v3.fontSize(var(--sh-m-landscape, 32)),
-			var(--sh-m-font-size-max-desktop, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$desktop) {
-		@include sh-m-size();
-	}
-}
-@mixin sh-s-size {
-	font-size: clamp(
-		var(--sh-s-font-size-min-desktop, 10px),
-		core-functions-v3.fontSize(var(--sh-s-desktop, 26)),
-		var(--sh-s-font-size-max-desktop, 180px)
-	);
-	letter-spacing: var(--sh-s-letter-spacing);
-	line-height: var(--sh-s-line-height);
-}
-@mixin sh-s {
-	letter-spacing: var(--sh-s-letter-spacing);
-	line-height: var(--sh-s-line-height);
-	font-family: var(--sh-s-font-family);
-	--default-font-weight: var(--sh-s-default-font-weight);
-	font-weight: var(--default-font-weight);
-
-	strong,
-	b {
-		font-weight: var(--sh-s-bold-font-weight);
-	}
-
-	font-size: clamp(
-		var(--sh-s-font-size-min-mobile, 10px),
-		core-functions-v3.fontSize(var(--sh-s-mobile, 20)),
-		var(--sh-s-font-size-max-mobile, 180px)
-	);
-
-	@include core-mixins-v3.device(breakpoints.$tabPortrait) {
-		font-size: clamp(
-			var(--sh-s-font-size-min-mobile, 10px),
-			core-functions-v3.fontSize(var(--sh-s-portrait, 20)),
-			var(--sh-s-font-size-max-mobile, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$tabLandscape) {
-		font-size: clamp(
-			var(--sh-s-font-size-min-desktop, 10px),
-			core-functions-v3.fontSize(var(--sh-s-landscape, 24)),
-			var(--sh-s-font-size-max-desktop, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$desktop) {
-		@include sh-s-size();
-	}
-}
-@mixin sh-xs-size {
-	font-size: clamp(
-		var(--sh-xs-font-size-min-desktop, 10px),
-		core-functions-v3.fontSize(var(--sh-xs-desktop, 18)),
-		var(--sh-xs-font-size-max-desktop, 180px)
-	);
-	letter-spacing: var(--sh-xs-letter-spacing);
-	line-height: var(--sh-xs-line-height);
-}
-@mixin sh-xs {
-	letter-spacing: var(--sh-xs-letter-spacing);
-	line-height: var(--sh-xs-line-height);
-	font-family: var(--sh-xs-font-family);
-	--default-font-weight: var(--sh-xs-default-font-weight);
-	font-weight: var(--default-font-weight);
-
-	strong,
-	b {
-		font-weight: var(--sh-xs-bold-font-weight);
-	}
-
-	font-size: clamp(
-		var(--sh-xs-font-size-min-mobile, 10px),
-		core-functions-v3.fontSize(var(--sh-xs-mobile, 14)),
-		var(--sh-xs-font-size-max-mobile, 180px)
-	);
-
-	@include core-mixins-v3.device(breakpoints.$tabPortrait) {
-		font-size: clamp(
-			var(--sh-xs-font-size-min-mobile, 10px),
-			core-functions-v3.fontSize(var(--sh-xs-portrait, 14)),
-			var(--sh-xs-font-size-max-mobile, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$tabLandscape) {
-		font-size: clamp(
-			var(--sh-xs-font-size-min-desktop, 10px),
-			core-functions-v3.fontSize(var(--sh-xs-landscape, 18)),
-			var(--sh-xs-font-size-max-desktop, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$desktop) {
-		@include sh-xs-size();
-	}
-}
-@mixin sh-xxs-size {
-	font-size: clamp(
-		var(--sh-xxs-font-size-min-desktop, 10px),
-		core-functions-v3.fontSize(var(--sh-xxs-desktop, 16)),
-		var(--sh-xxs-font-size-max-desktop, 180px)
-	);
-	letter-spacing: var(--sh-xxs-letter-spacing);
-	line-height: var(--sh-xxs-line-height);
-}
-@mixin sh-xxs {
-	letter-spacing: var(--sh-xxs-letter-spacing);
-	line-height: var(--sh-xxs-line-height);
-	font-family: var(--sh-xxs-font-family);
-	--default-font-weight: var(--sh-xxs-default-font-weight);
-	font-weight: var(--default-font-weight);
-
-	strong,
-	b {
-		font-weight: var(--sh-xxs-bold-font-weight);
-	}
-
-	font-size: clamp(
-		var(--sh-xxs-font-size-min-mobile, 10px),
-		core-functions-v3.fontSize(var(--sh-xxs-mobile, 12)),
-		var(--sh-xxs-font-size-max-mobile, 180px)
-	);
-
-	@include core-mixins-v3.device(breakpoints.$tabPortrait) {
-		font-size: clamp(
-			var(--sh-xxs-font-size-min-mobile, 10px),
-			core-functions-v3.fontSize(var(--sh-xxs-portrait, 12)),
-			var(--sh-xxs-font-size-max-mobile, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$tabLandscape) {
-		font-size: clamp(
-			var(--sh-xxs-font-size-min-desktop, 10px),
-			core-functions-v3.fontSize(var(--sh-xxs-landscape, 16)),
-			var(--sh-xxs-font-size-max-desktop, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$desktop) {
-		@include sh-xxs-size();
-	}
-}
-@mixin p-l-size {
-	font-size: clamp(
-		var(--p-l-font-size-min-desktop, 10px),
-		core-functions-v3.fontSize(var(--p-l-desktop, 20)),
-		var(--p-l-font-size-max-desktop, 180px)
-	);
-	line-height: var(--paragraph-large-line-height);
-	letter-spacing: var(--paragraph-large-letter-spacing);
-}
-@mixin p-l {
-	line-height: var(--paragraph-large-line-height);
-	letter-spacing: var(--paragraph-large-letter-spacing);
-	font-family: var(--paragraph-large-font-family);
-
-	strong,
-	b {
-		font-weight: var(--paragraph-bold-font-weight);
-	}
-
-	&:has(.font-tertiary) {
-		line-height: calc(
-			var(--paragraph-line-height) *
-				var(--global-line-height-multiplier-tertiary)
-		);
-	}
-
-	em {
-		font-style: italic;
-	}
-
-	font-size: clamp(
-		var(--p-l-font-size-min-mobile, 10px),
-		core-functions-v3.fontSize(var(--p-l-mobile, 18), 'mobile'),
-		var(--p-l-font-size-max-mobile, 180px)
-	);
-
-	@include core-mixins-v3.device(breakpoints.$tabPortrait) {
-		font-size: clamp(
-			var(--p-l-font-size-min-mobile, 10px),
-			core-functions-v3.fontSize(var(--p-l-portrait, 18), 'portrait'),
-			var(--p-l-font-size-max-mobile, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$tabLandscape) {
-		font-size: clamp(
-			var(--p-l-font-size-min-desktop, 10px),
-			core-functions-v3.fontSize(var(--p-l-landscape, 20), 'landscape'),
-			var(--p-l-font-size-max-desktop, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$desktop) {
-		@include p-l-size();
-	}
-}
-
-@mixin p-size {
-	font-size: clamp(
-		var(--p-font-size-min-desktop, 10px),
-		core-functions-v3.fontSize(var(--p-desktop, 18)),
-		var(--p-font-size-max-desktop, 180px)
-	);
-}
-@mixin p {
-	line-height: var(--paragraph-line-height);
-	letter-spacing: var(--paragraph-letter-spacing);
-	font-family: var(--paragraph-font-family);
-	--default-font-weight: var(--paragraph-default-font-weight);
-	font-weight: var(--default-font-weight);
-
-	strong,
-	b {
-		font-weight: var(--paragraph-bold-font-weight);
-	}
-
-	&:has(.font-tertiary) {
-		line-height: calc(
-			var(--paragraph-line-height) *
-				var(--global-line-height-multiplier-tertiary)
-		);
-	}
-
-	em {
-		font-style: italic;
-	}
-
-	font-size: clamp(
-		var(--p-font-size-min-mobile, 10px),
-		core-functions-v3.fontSize(var(--p-mobile, 16)),
-		var(--p-font-size-max-mobile, 180px)
-	);
-
-	@include core-mixins-v3.device(breakpoints.$tabPortrait) {
-		font-size: clamp(
-			var(--p-font-size-min-mobile, 10px),
-			core-functions-v3.fontSize(var(--p-portrait, 16)),
-			var(--p-font-size-max-mobile, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$tabLandscape) {
-		font-size: clamp(
-			var(--p-font-size-min-desktop, 10px),
-			core-functions-v3.fontSize(var(--p-landscape, 18)),
-			var(--p-font-size-max-desktop, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$desktop) {
-		@include p-size();
-	}
-}
-@mixin p-s-size {
-	font-size: clamp(
-		var(--p-s-font-size-min-desktop, 10px),
-		core-functions-v3.fontSize(var(--p-s-desktop, 16)),
-		var(--p-s-font-size-max-desktop, 180px)
-	);
-}
-@mixin p-s {
-	line-height: var(--paragraph-small-line-height);
-	letter-spacing: var(--paragraph-letter-spacing);
-	font-family: var(--paragraph-font-family);
-
-	strong,
-	b {
-		font-weight: var(--paragraph-bold-font-weight);
-	}
-
-	&:has(.font-tertiary) {
-		line-height: calc(
-			var(--paragraph-line-height) *
-				var(--global-line-height-multiplier-tertiary)
-		);
-	}
-
-	em {
-		font-style: italic;
-	}
-
-	font-size: clamp(
-		var(--p-s-font-size-min-mobile, 10px),
-		core-functions-v3.fontSize(var(--p-s-mobile, 14), 'mobile'),
-		var(--p-s-font-size-max-mobile, 180px)
-	);
-
-	@include core-mixins-v3.device(breakpoints.$tabPortrait) {
-		font-size: clamp(
-			var(--p-s-font-size-min-mobile, 10px),
-			core-functions-v3.fontSize(var(--p-s-portrait, 14), 'portrait'),
-			var(--p-s-font-size-max-mobile, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$tabLandscape) {
-		font-size: clamp(
-			var(--p-s-font-size-min-desktop, 10px),
-			core-functions-v3.fontSize(var(--p-s-landscape, 16), 'landscape'),
-			var(--p-s-font-size-max-desktop, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$desktop) {
-		@include p-s-size();
-	}
-}
-@mixin p-xs-size {
-	font-size: clamp(
-		var(--p-xs-font-size-min-desktop, 10px),
-		core-functions-v3.fontSize(var(--p-xs-desktop, 14)),
-		var(--p-xs-font-size-max-desktop, 180px)
-	);
-}
-@mixin p-xs {
-	line-height: var(--paragraph-extra-small-line-height);
-	letter-spacing: var(--paragraph-letter-spacing);
-	font-family: var(--paragraph-extra-small-line-height);
-
-	strong,
-	b {
-		font-weight: var(--paragraph-bold-font-weight);
-	}
-
-	&:has(.font-tertiary) {
-		line-height: calc(
-			var(--paragraph-extra-small-line-height) *
-				var(--global-line-height-multiplier-tertiary)
-		);
-	}
-
-	em {
-		font-style: italic;
-	}
-
-	font-size: clamp(
-		var(--p-xs-font-size-min-mobile, 10px),
-		core-functions-v3.fontSize(var(--p-xs-mobile, 12)),
-		var(--p-xs-font-size-max-mobile, 180px)
-	);
-
-	@include core-mixins-v3.device(breakpoints.$tabPortrait) {
-		font-size: clamp(
-			var(--p-xs-font-size-min-mobile, 10px),
-			core-functions-v3.fontSize(var(--p-xs-portrait, 12)),
-			var(--p-xs-font-size-max-mobile, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$tabLandscape) {
-		font-size: clamp(
-			var(--p-xs-font-size-min-desktop, 10px),
-			core-functions-v3.fontSize(var(--p-xs-landscape, 14)),
-			var(--p-xs-font-size-max-desktop, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$desktop) {
-		@include p-xs-size();
-	}
-}
-@mixin p-xs-size {
-	font-size: clamp(
-		var(--p-xs-font-size-min-desktop, 10px),
-		core-functions-v3.fontSize(var(--p-xs-desktop, 12)),
-		var(--p-xs-font-size-max-desktop, 180px)
-	);
-}
-@mixin p-xs {
-	line-height: var(--paragraph-extra-small-line-height);
-	letter-spacing: var(--paragraph-letter-spacing);
-	font-family: var(--paragraph-font-family);
-
-	strong,
-	b {
-		font-weight: var(--paragraph-bold-font-weight);
-	}
-
-	&:has(.font-tertiary) {
-		line-height: calc(
-			var(--paragraph-extra-small-line-height) *
-				var(--global-line-height-multiplier-tertiary)
-		);
-	}
-
-	em {
-		font-style: italic;
-	}
-
-	font-size: clamp(
-		var(--p-xs-font-size-min-mobile, 10px),
-		core-functions-v3.fontSize(var(--p-xs-mobile, 12)),
-		var(--p-xs-font-size-max-mobile, 180px)
-	);
-
-	@include core-mixins-v3.device(breakpoints.$tabPortrait) {
-		font-size: clamp(
-			var(--p-xs-font-size-min-mobile, 10px),
-			core-functions-v3.fontSize(var(--p-xs-portrait, 12)),
-			var(--p-xs-font-size-max-mobile, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$tabLandscape) {
-		font-size: clamp(
-			var(--p-xs-font-size-min-desktop, 10px),
-			core-functions-v3.fontSize(var(--p-xs-landscape, 12)),
-			var(--p-xs-font-size-max-desktop, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$desktop) {
-		@include p-xs-size();
-	}
-}
-@mixin p-xxs-size {
-	font-size: clamp(
-		var(--p-xxs-font-size-min-desktop, 10px),
-		core-functions-v3.fontSize(var(--p-xxs-desktop, 10)),
-		var(--p-xxs-font-size-max-desktop, 180px)
-	);
-}
-@mixin p-xxs {
-	line-height: var(--paragraph-extra-extra-small-line-height);
-	letter-spacing: var(--paragraph-letter-spacing);
-	font-family: var(--paragraph-font-family);
-
-	strong,
-	b {
-		font-weight: var(--paragraph-bold-font-weight);
-	}
-
-	&:has(.font-tertiary) {
-		line-height: calc(
-			var(--paragraph-line-height) *
-				var(--global-line-height-multiplier-tertiary)
-		);
-	}
-
-	em {
-		font-style: italic;
-	}
-
-	font-size: clamp(
-		var(--p-xxs-font-size-min-mobile, 10px),
-		core-functions-v3.fontSize(var(--p-xxs-mobile, 10)),
-		var(--p-xxs-font-size-max-mobile, 180px)
-	);
-
-	@include core-mixins-v3.device(breakpoints.$tabPortrait) {
-		font-size: clamp(
-			var(--p-xxs-font-size-min-mobile, 10px),
-			core-functions-v3.fontSize(var(--p-xxs-portrait, 10)),
-			var(--p-xxs-font-size-max-mobile, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$tabLandscape) {
-		font-size: clamp(
-			var(--p-xxs-font-size-min-desktop, 10px),
-			core-functions-v3.fontSize(var(--p-xxs-landscape, 10)),
-			var(--p-xxs-font-size-max-desktop, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$desktop) {
-		@include p-xxs-size();
-	}
-}
-@mixin p-xxxs-size {
-	font-size: clamp(
-		var(--p-xxxs-font-size-min-desktop, 10px),
-		core-functions-v3.fontSize(var(--p-xxxs-desktop)),
-		var(--p-xxxs-font-size-max-desktop, 180px)
-	);
-}
-@mixin p-xxxs {
-	line-height: var(--paragraph-line-height);
-	letter-spacing: var(--paragraph-letter-spacing);
-	font-family: var(--paragraph-font-family);
-
-	strong,
-	b {
-		font-weight: var(--paragraph-bold-font-weight);
-	}
-
-	&:has(.font-tertiary) {
-		line-height: calc(
-			var(--paragraph-line-height) *
-				var(--global-line-height-multiplier-tertiary)
-		);
-	}
-
-	em {
-		font-style: italic;
-	}
-
-	font-size: clamp(
-		var(--p-xxxs-font-size-min-mobile, 10px),
-		core-functions-v3.fontSize(var(--p-xxxs-mobile)),
-		var(--p-xxxs-font-size-max-mobile, 180px)
-	);
-
-	@include core-mixins-v3.device(breakpoints.$tabPortrait) {
-		font-size: clamp(
-			var(--p-xxxs-font-size-min-mobile, 10px),
-			core-functions-v3.fontSize(var(--p-xxxs-portrait)),
-			var(--p-xxxs-font-size-max-mobile, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$tabLandscape) {
-		font-size: clamp(
-			var(--p-xxxs-font-size-min-desktop, 10px),
-			core-functions-v3.fontSize(var(--p-xxxs-landscape)),
-			var(--p-xxxs-font-size-max-desktop, 180px)
-		);
-	}
-
-	@include core-mixins-v3.device(breakpoints.$desktop) {
-		@include p-xxxs-size();
-	}
-}
-@mixin fontPrimary() {
-	font-family: var(--primary-font-family), sans-serif;
-	--font-size-multiplier: var(--global-font-multiplier-primary);
-}
-@mixin fontSecondary() {
-	font-family: var(--secondary-font-family), sans-serif;
-	--font-size-multiplier: var(--global-font-multiplier-secondary);
-}
-@mixin fontTertiary() {
-	font-family: var(--tertiary-font-family), sans-serif;
-	--font-size-multiplier: var(--global-font-multiplier-tertiary);
-}
-@mixin fontQuaternary() {
-	font-family: var(--quaternary-font-family), sans-serif;
-	--font-size-multiplier: var(--global-font-multiplier-quaternary);
-}