/* ===================================================== */
/*                LOCAL FONT DECLARATION                 */
/* ===================================================== */

@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@200..1000&display=swap');

/* ---------- SATOSHI (OTF) ---------- */

@font-face {
	font-family: 'Satoshi';
	src: url('../fonts/satoshi/Satoshi-Light.woff2') format('woff2'),
		url('../fonts/satoshi/Satoshi-Light.woff') format('woff');
	font-weight: 300;
	font-display: swap;
}

@font-face {
	font-family: 'Satoshi';
	src: url('../fonts/satoshi/Satoshi-Regular.woff2') format('woff2'),
		url('../fonts/satoshi/Satoshi-Regular.woff') format('woff');
	font-weight: 400;
	font-display: swap;
}

@font-face {
	font-family: 'Satoshi';
	src: url('../fonts/satoshi/Satoshi-Medium.woff2') format('woff2'),
		url('../fonts/satoshi/Satoshi-Medium.woff') format('woff');
	font-weight: 500;
	font-display: swap;
}

@font-face {
	font-family: 'Satoshi';
	src: url('../fonts/satoshi/Satoshi-Bold.woff2') format('woff2'),
		url('../fonts/satoshi/Satoshi-Bold.woff') format('woff');
	font-weight: 700;
	font-display: swap;
}

@font-face {
	font-family: 'Satoshi';
	src: url('../fonts/satoshi/Satoshi-Black.woff2') format('woff2'),
		url('../fonts/satoshi/Satoshi-Black.woff') format('woff');
	font-weight: 900;
	font-display: swap;
}


/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */
@layer properties;
@layer theme,
base,
components,
utilities;

@layer theme {

	:root,
	:host {
		--font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji",
			"Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";

		/* ✅ UPDATED HERE */
		--default-font-family: 'Satoshi', sans-serif;

		--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
			"Courier New", monospace;

		/* KEEP EVERYTHING ELSE SAME */
	}
}

@layer base {

	*,
	::after,
	::before {
		box-sizing: border-box;
	}

	html,
	:host {
		font-family: var(--default-font-family);
	}

	/* ✅ UPDATED HEADING FONT */
	h1,
	h2,
	h3,
	h4,
	h5,
	h6 {
		font-size: inherit;
		font-weight: inherit;
		font-family: 'Cairo', sans-serif;
	}

}


/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */
@layer properties;
@layer theme,
base,
components,
utilities;

@layer theme {

	:root,
	:host {
		--font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji",
			"Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
		--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
			"Courier New", monospace;
		--color-black: #000;
		--color-white: #fff;

		--spacing: 0.25rem;
		--text-xs: 0.75rem;
		--text-xs--line-height: calc(1 / 0.75);
		--text-sm: 0.875rem;
		--text-sm--line-height: calc(1.25 / 0.875);
		--text-base: 1rem;
		--text-base--line-height: calc(1.5 / 1);
		--text-lg: 1.125rem;
		--text-lg--line-height: calc(1.75 / 1.125);
		--text-xl: 1.25rem;
		--text-xl--line-height: calc(1.75 / 1.25);
		--text-2xl: 24px;
		--text-2xl--line-height: 35px;
		--text-3xl: 35px;
		--text-3xl--line-height: calc(2.25 / 1.875);
		--text-4xl: 40px;
		--text-4xl--line-height: calc(2.5 / 2.25);
		--text-5xl: 60px;
		--text-5xl--line-height: 69px;
		--text-6xl: 65px;
		--text-6xl--line-height: 1.1;
		--text-7xl: 70px;
		--text-7xl--line-height: 75px;
		--text-8xl: 100px;
		--text-8xl--line-height: 110px;
		--text-9xl: 130px;
		--text-9xl--line-height: 91px;
		--font-weight-light: 300;
		--font-weight-normal: 400;
		--font-weight-medium: 500;
		--font-weight-semibold: 600;
		--font-weight-bold: 700;
		--font-weight-extrabold: 800;
		--font-weight-black: 900;
		--leading-normal: 1.5;
		--radius-md: 0.375rem;
		--radius-lg: 0.5rem;
		--radius-xl: 0.75rem;
		--radius-2xl: 20px;
		--radius-3xl: 1.5rem;
		--radius-4xl: 30px;
		--ease-in: cubic-bezier(0.4, 0, 1, 1);
		--ease-out: cubic-bezier(0, 0, 0.2, 1);
		--ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
		--default-transition-duration: 150ms;
		--default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
		--default-font-family: var(--font-sans);
		--default-mono-font-family: var(--font-mono);
		--font-base: "Satoshi", "sans-serif";
		--font-family: "Satoshi";
		--color-primary: var(--primary);
		--color-primarylight: var(--primarylight);
		--color-primarydark: var(--primarydark);
		--color-secondary: var(--secondary);
		--color-bodybg: var(--bodybg);
		--color-bodyfg: var(--bodyfg);
		--color-bodytext: var(--bodytext);
		--color-card: var(--card);
		--color-card-light: #424547;
		--color-title: var(--title);
		--color-heading: #191B1D;
		--color-dark: #1C1A1B;
		--color-textlight: #ECECDE;
		--color-bordercolor: #ECECDE;
		--color-inputborder: #E3E3E3;
		--color-social: #191B1D;
		--color-tickbg: #191B1D;
		--color-label: #fff;
		--color-progress: #070707;
		--color-darkbtn: #191B1D;
		--color-light: #FAFAFA;
		--color-bg1: #343C27;
		--color-bg2: #343B27;
		--color-bg3: #273215;
		--color-bg4: #353C29;
		--color-bglight: #F8F8F8;
		--color-lightgrey: #A6A6A6;
		--color-grey: #D4D4D4;
		--color-red: #F25749;
		--color-yellow: #FF9B43;
		--color-green: #38C069;
		--color-green-medium: #269e52;
		--color-lightpurple: #72687b;
		--color-bordergray: #E6E6E6;
		--color-bordergraylight: #F0F0F0;
		--color-textgray: #BCBCBC;
		--text-2xs: 13px;
		--text-2xs--line-height: 1;
		--text-2sm: 15px;
		--text-2sm--line-height: 19px;
		--text-2xxl: 28px;
		--text-2xxl--line-height: 34px;
		--text-2xxxl: 30px;
		--text-4xxl: 50px;
		--text-4xxl--line-height: 60px;
		--text-4xxxl: 55px;
		--text-4xxxl--line-height: 65px;
		--text-7xxl: 85px;
		--text-7xxl--line-height: 110px;
		--text-7xxxl: 80px;
		--text-7xxxl--line-height: 40px;
		--text-10xl: 140px;
		--text-10xl--line-height: 100px;
		--text-13xl: 150px;
		--text-13xl--line-height: 160px;
		--text-14xl: 200px;
		--text-14xl--line-height: 230px;
		--text-15xl: 290px;
		--text-15xl--line-height: 300px;
		--breakpoint-xs: 425px;
		--breakpoint-sm: 576px;
		--breakpoint-md: 768px;
		--breakpoint-lg: 992px;
		--breakpoint-xl: 1200px;
		--breakpoint-2xl: 1400px;
		--breakpoint-3xl: 1600px;
		--breakpoint-4xl: 1800px;
		--max-breakpoint-sm: 575px;
		--max-breakpoint-md: 768px;
		--max-breakpoint-lg: 991px;
		--max-breakpoint-xl: 1200px;
		--max-breakpoint-2xl: 1400px;
		--max-breakpoint-3xl: 1600px;
		--max-breakpoint-4xl: 1800px;
		--bg1-gradient: 180deg, #203400 0%, #1B2012 100%;
		--bg2-gradient: 180deg, #273215 0%, #1C1A1B 100%;
		--bg3-gradient: 226.32deg, rgba(169, 222, 89, 0.7) 35.89%, rgba(249, 188, 47, 0.7) 104.43%;
		--bg4-gradient: 180deg, rgba(169, 222, 89, 0.5) 0%, rgba(169, 222, 89, 0) 87%;
		--bg5-gradient: 180deg, #273215 0%, #1C1A1B 100%;
		--bg6-gradient: 180deg, rgba(255, 255, 255, 0.5) 0%, rgba(236, 236, 222, 0.5) 100%;
		--bg6-dark-gradient: 180deg, rgba(41, 48, 28, 0.5) 0%, rgba(27, 32, 18, 0.5) 100%;
		--bg7-gradient: 90deg, #8CC633 0%, #A9DE59 100%;
		--swiper-gradient: 90deg, #1F2E07 0%, rgba(31, 46, 7, 0) 30%, rgba(31, 46, 7, 0) 70%, #1F2E07 100%;
		--divider-gradient: 90deg, rgba(255, 255, 255, 0.4) 0%, rgba(255, 255, 255, 0) 100%;
		--light-gradient: rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 1) 46%, rgba(255, 255, 255, 0.3) 100%;
		--secondary-gradient: 0deg, rgba(27, 76, 64, .8) 0%, rgba(27, 76, 64, .8) 100%;
		--secondary2-gradient: 180deg, rgba(27, 76, 64, 0) 52.08%, #1b4c40 100%;
		--black-gradient: 180deg, rgba(0, 0, 0, 0.203) 0%, rgba(0, 0, 0, 0.7) 100%;
		--bg-primary-gradient: 180deg, rgba(0, 0, 0, 0) 0%, rgb(179 231 25) 98%;
		--z-index-1: 1;
		--z-index-2: 2;
		--z-index-4: 4;
		--z-index-9: 9;
		--z-index-99: 99;
		--z-index-999: 999;
		--z-index-9999: 9999;
		--z-index-99999: 99999;
		--z-index-999999: 999999;
		--radius-2lg: 10px;
		--radius-xxl: 14px;
		--radius-5xl: 40px;
		--radius-6xl: 50px;
		--animate-rotate: rotate 20s infinite linear;
		--animate-toTopFromBottom: toTopFromBottom 0.8s ease 0s 1 normal forwards running;
		--animate-ScaleInOut: ScaleInOut 30s linear infinite;
		--animate-ripple-1: ripple-1 1s infinite;
		--animate-toLeftFromRight: toLeftFromRight 0.5s forwards;
		--animate-toRightFromLeft: toRightFromLeft 0.5s forwards;
		--bg-close-icon: url("data:image/svg+xml,%3Csvg width='22' height='22' viewBox='0 0 22 22' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M21 1L1 21' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M1 1L21 21' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	}
}

@layer base {

	*,
	::after,
	::before,
	::backdrop,
	::file-selector-button {
		box-sizing: border-box;
		margin: 0;
		padding: 0;
		border: 0 solid;
	}

	html,
	:host {
		line-height: 1.5;
		-webkit-text-size-adjust: 100%;
		tab-size: 4;
		font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
		font-feature-settings: var(--default-font-feature-settings, normal);
		font-variation-settings: var(--default-font-variation-settings, normal);
		-webkit-tap-highlight-color: transparent;
	}

	hr {
		height: 0;
		color: inherit;
		border-top-width: 1px;
	}

	abbr:where([title]) {
		-webkit-text-decoration: underline dotted;
		text-decoration: underline dotted;
	}

	h1,
	h2,
	h3,
	h4,
	h5,
	h6 {
		font-size: inherit;
		font-weight: inherit;
	}

	a {
		color: inherit;
		-webkit-text-decoration: inherit;
		text-decoration: inherit;
	}

	b,
	strong {
		font-weight: bolder;
	}

	code,
	kbd,
	samp,
	pre {
		font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
		font-feature-settings: var(--default-mono-font-feature-settings, normal);
		font-variation-settings: var(--default-mono-font-variation-settings, normal);
		font-size: 1em;
	}

	small {
		font-size: 80%;
	}

	sub,
	sup {
		font-size: 75%;
		line-height: 0;
		position: relative;
		vertical-align: baseline;
	}

	sub {
		bottom: -0.25em;
	}

	sup {
		top: -0.5em;
	}

	table {
		text-indent: 0;
		border-color: inherit;
		border-collapse: collapse;
	}

	:-moz-focusring {
		outline: auto;
	}

	progress {
		vertical-align: baseline;
	}

	summary {
		display: list-item;
	}

	ol,
	ul,
	menu {
		list-style: none;
	}

	img,
	svg,
	video,
	canvas,
	audio,
	iframe,
	embed,
	object {
		display: block;
		vertical-align: middle;
	}

	img,
	video {
		max-width: 100%;
		height: auto;
	}

	button,
	input,
	select,
	optgroup,
	textarea,
	::file-selector-button {
		font: inherit;
		font-feature-settings: inherit;
		font-variation-settings: inherit;
		letter-spacing: inherit;
		color: inherit;
		border-radius: 0;
		background-color: transparent;
		opacity: 1;
	}

	:where(select:is([multiple], [size])) optgroup {
		font-weight: bolder;
	}

	:where(select:is([multiple], [size])) optgroup option {
		padding-inline-start: 20px;
	}

	::file-selector-button {
		margin-inline-end: 4px;
	}

	::placeholder {
		opacity: 1;
	}

	@supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px) {
		::placeholder {
			color: currentcolor;

			@supports (color: color-mix(in lab, red, red)) {
				color: color-mix(in oklab, currentcolor 50%, transparent);
			}
		}
	}

	textarea {
		resize: vertical;
	}

	::-webkit-search-decoration {
		-webkit-appearance: none;
	}

	::-webkit-date-and-time-value {
		min-height: 1lh;
		text-align: inherit;
	}

	::-webkit-datetime-edit {
		display: inline-flex;
	}

	::-webkit-datetime-edit-fields-wrapper {
		padding: 0;
	}

	::-webkit-datetime-edit,
	::-webkit-datetime-edit-year-field,
	::-webkit-datetime-edit-month-field,
	::-webkit-datetime-edit-day-field,
	::-webkit-datetime-edit-hour-field,
	::-webkit-datetime-edit-minute-field,
	::-webkit-datetime-edit-second-field,
	::-webkit-datetime-edit-millisecond-field,
	::-webkit-datetime-edit-meridiem-field {
		padding-block: 0;
	}

	::-webkit-calendar-picker-indicator {
		line-height: 1;
	}

	:-moz-ui-invalid {
		box-shadow: none;
	}

	button,
	input:where([type="button"], [type="reset"], [type="submit"]),
	::file-selector-button {
		appearance: button;
	}

	::-webkit-inner-spin-button,
	::-webkit-outer-spin-button {
		height: auto;
	}

	[hidden]:where(:not([hidden="until-found"])) {
		display: none !important;
	}
}

@layer utilities {
	.pointer-events-auto {
		pointer-events: auto;
	}

	.pointer-events-none {
		pointer-events: none;
	}

	.collapse {
		visibility: collapse;
	}

	.invisible {
		visibility: hidden;
	}

	.visible {
		visibility: visible;
	}

	.visible\! {
		visibility: visible !important;
	}

	.sr-only {
		position: absolute;
		width: 1px;
		height: 1px;
		padding: 0;
		margin: -1px;
		overflow: hidden;
		clip-path: inset(50%);
		white-space: nowrap;
		border-width: 0;
	}

	.\!absolute {
		position: absolute !important;
	}

	.\!relative {
		position: relative !important;
	}

	.absolute {
		position: absolute;
	}

	.fixed {
		position: fixed;
	}

	.relative {
		position: relative;
	}

	.static {
		position: static;
	}

	.sticky {
		position: sticky;
	}

	.inset-0 {
		inset: calc(var(--spacing) * 0);
	}

	.\!-top-0 {
		top: calc(var(--spacing) * -0) !important;
	}

	.\!top-1\/2 {
		top: calc(1/2 * 100%) !important;
	}

	.-top-0 {
		top: calc(var(--spacing) * -0);
	}

	.-top-0\.25 {
		top: calc(var(--spacing) * -0.25);
	}

	.-top-2 {
		top: calc(var(--spacing) * -2);
	}

	.-top-2\.5 {
		top: calc(var(--spacing) * -2.5);
	}

	.-top-5 {
		top: calc(var(--spacing) * -5);
	}

	.-top-10 {
		top: calc(var(--spacing) * -10);
	}

	.-top-13 {
		top: calc(var(--spacing) * -13);
	}

	.-top-13\.5 {
		top: calc(var(--spacing) * -13.5);
	}

	.top-0 {
		top: calc(var(--spacing) * 0);
	}

	.top-1 {
		top: calc(var(--spacing) * 1);
	}

	.top-1\/2 {
		top: calc(1/2 * 100%);
	}

	.top-2 {
		top: calc(var(--spacing) * 2);
	}

	.top-2\.5 {
		top: calc(var(--spacing) * 2.5);
	}

	.top-3 {
		top: calc(var(--spacing) * 3);
	}

	.top-3\.5 {
		top: calc(var(--spacing) * 3.5);
	}

	.top-4 {
		top: calc(var(--spacing) * 4);
	}

	.top-5 {
		top: calc(var(--spacing) * 5);
	}

	.top-\[28\%\] {
		top: 28%;
	}

	.top-\[30\%\] {
		top: 30%;
	}

	.top-\[42\%\] {
		top: 42%;
	}

	.top-\[53\%\] {
		top: 53%;
	}

	.top-\[60\%\] {
		top: 60%;
	}

	.top-\[64\.5\%\] {
		top: 64.5%;
	}

	.-right-5 {
		right: calc(var(--spacing) * -5);
	}

	.-right-10 {
		right: calc(var(--spacing) * -10);
	}

	.-right-12 {
		right: calc(var(--spacing) * -12);
	}

	.-right-12\.5 {
		right: calc(var(--spacing) * -12.5);
	}

	.-right-13 {
		right: calc(var(--spacing) * -13);
	}

	.-right-13\.5 {
		right: calc(var(--spacing) * -13.5);
	}

	.right-0 {
		right: calc(var(--spacing) * 0);
	}

	.right-0\.25 {
		right: calc(var(--spacing) * 0.25);
	}

	.right-1 {
		right: calc(var(--spacing) * 1);
	}

	.right-1\.25 {
		right: calc(var(--spacing) * 1.25);
	}

	.right-1\/2 {
		right: calc(1/2 * 100%);
	}

	.right-2 {
		right: calc(var(--spacing) * 2);
	}

	.right-2\.5 {
		right: calc(var(--spacing) * 2.5);
	}

	.right-3 {
		right: calc(var(--spacing) * 3);
	}

	.right-3\.5 {
		right: calc(var(--spacing) * 3.5);
	}

	.right-3\.75 {
		right: calc(var(--spacing) * 3.75);
	}

	.right-5 {
		right: calc(var(--spacing) * 5);
	}

	.right-8 {
		right: calc(var(--spacing) * 8);
	}

	.right-8\.25 {
		right: calc(var(--spacing) * 8.25);
	}

	.right-12 {
		right: calc(var(--spacing) * 12);
	}

	.right-12\.5 {
		right: calc(var(--spacing) * 12.5);
	}

	.right-px {
		right: 1px;
	}

	.\!-bottom-0 {
		bottom: calc(var(--spacing) * -0) !important;
	}

	.\!bottom-auto {
		bottom: auto !important;
	}

	.-bottom-6 {
		bottom: calc(var(--spacing) * -6);
	}

	.-bottom-6\.75 {
		bottom: calc(var(--spacing) * -6.75);
	}

	.-bottom-7 {
		bottom: calc(var(--spacing) * -7);
	}

	.-bottom-7\.5 {
		bottom: calc(var(--spacing) * -7.5);
	}

	.-bottom-10 {
		bottom: calc(var(--spacing) * -10);
	}

	.-bottom-15 {
		bottom: calc(var(--spacing) * -15);
	}

	.-bottom-25 {
		bottom: calc(var(--spacing) * -25);
	}

	.bottom-0 {
		bottom: calc(var(--spacing) * 0);
	}

	.bottom-1\/2 {
		bottom: calc(1/2 * 100%);
	}

	.bottom-2 {
		bottom: calc(var(--spacing) * 2);
	}

	.bottom-2\.5 {
		bottom: calc(var(--spacing) * 2.5);
	}

	.bottom-3 {
		bottom: calc(var(--spacing) * 3);
	}

	.bottom-3\.75 {
		bottom: calc(var(--spacing) * 3.75);
	}

	.bottom-5 {
		bottom: calc(var(--spacing) * 5);
	}

	.bottom-6 {
		bottom: calc(var(--spacing) * 6);
	}

	.bottom-7 {
		bottom: calc(var(--spacing) * 7);
	}

	.bottom-7\.5 {
		bottom: calc(var(--spacing) * 7.5);
	}

	.bottom-auto {
		bottom: auto;
	}

	.bottom-full {
		bottom: 100%;
	}

	.\!left-1\/2 {
		left: calc(1/2 * 100%) !important;
	}

	.\!left-7\.5 {
		left: calc(var(--spacing) * 7.5) !important;
	}

	.-left-10 {
		left: calc(var(--spacing) * -10);
	}

	.-left-12 {
		left: calc(var(--spacing) * -12);
	}

	.-left-12\.5 {
		left: calc(var(--spacing) * -12.5);
	}

	.-left-80 {
		left: calc(var(--spacing) * -80);
	}

	.left-0 {
		left: calc(var(--spacing) * 0);
	}

	.left-1 {
		left: calc(var(--spacing) * 1);
	}

	.left-1\/2 {
		left: calc(1/2 * 100%);
	}

	.left-2 {
		left: calc(var(--spacing) * 2);
	}

	.left-2\.5 {
		left: calc(var(--spacing) * 2.5);
	}

	.left-2\.25 {
		left: calc(var(--spacing) * 2.25);
	}

	.left-3 {
		left: calc(var(--spacing) * 3);
	}

	.left-3\.5 {
		left: calc(var(--spacing) * 3.5);
	}

	.left-7 {
		left: calc(var(--spacing) * 7);
	}

	.left-7\.5 {
		left: calc(var(--spacing) * 7.5);
	}

	.left-8 {
		left: calc(var(--spacing) * 8);
	}

	.left-8\.5 {
		left: calc(var(--spacing) * 8.5);
	}

	.left-8\.25 {
		left: calc(var(--spacing) * 8.25);
	}

	.left-11 {
		left: calc(var(--spacing) * 11);
	}

	.left-\[-20\%\] {
		left: -20%;
	}

	.left-\[18\%\] {
		left: 18%;
	}

	.left-\[43\%\] {
		left: 43%;
	}

	.left-\[78\%\] {
		left: 78%;
	}

	.left-\[104\%\] {
		left: 104%;
	}

	.\!z-0 {
		z-index: 0 !important;
	}

	.-z-1 {
		z-index: calc(var(--z-index-1) * -1);
	}

	.z-0 {
		z-index: 0;
	}

	.z-1 {
		z-index: var(--z-index-1);
	}

	.z-2 {
		z-index: var(--z-index-2);
	}

	.z-3 {
		z-index: 3;
	}

	.z-4 {
		z-index: var(--z-index-4);
	}

	.z-9 {
		z-index: var(--z-index-9);
	}

	.z-10 {
		z-index: 10;
	}

	.z-99 {
		z-index: var(--z-index-99);
	}

	.z-9999 {
		z-index: var(--z-index-9999);
	}

	.z-99999 {
		z-index: var(--z-index-99999);
	}

	.z-\[2\] {
		z-index: 2;
	}

	.-order-1 {
		order: calc(1 * -1);
	}

	.order-1 {
		order: 1;
	}

	.order-2 {
		order: 2;
	}

	.order-\[1\] {
		order: 1;
	}

	.order-\[2\] {
		order: 2;
	}

	.col-span-6 {
		grid-column: span 6 / span 6;
	}

	.col-span-12 {
		grid-column: span 12 / span 12;
	}

	.float-end {
		float: inline-end;
	}

	.float-left {
		float: left;
	}

	.container {
		width: 100%;

		@media (width >=425px) {
			max-width: 425px;
		}

		@media (width >=576px) {
			max-width: 576px;
		}

		@media (width >=768px) {
			max-width: 768px;
		}

		@media (width >=992px) {
			max-width: 992px;
		}

		@media (width >=1200px) {
			max-width: 1200px;
		}

		@media (width >=1400px) {
			max-width: 1400px;
		}

		@media (width >=1600px) {
			max-width: 1600px;
		}

		@media (width >=1800px) {
			max-width: 1800px;
		}
	}

	.m-0 {
		margin: calc(var(--spacing) * 0);
	}

	.m-auto {
		margin: auto;
	}

	.\!mx-20 {
		margin-inline: calc(var(--spacing) * 20) !important;
	}

	.-mx-5 {
		margin-inline: calc(var(--spacing) * -5);
	}

	.mx-2 {
		margin-inline: calc(var(--spacing) * 2);
	}

	.mx-2\.5 {
		margin-inline: calc(var(--spacing) * 2.5);
	}

	.mx-3 {
		margin-inline: calc(var(--spacing) * 3);
	}

	.mx-3\.5 {
		margin-inline: calc(var(--spacing) * 3.5);
	}

	.mx-3\.75 {
		margin-inline: calc(var(--spacing) * 3.75);
	}

	.mx-5 {
		margin-inline: calc(var(--spacing) * 5);
	}

	.mx-auto {
		margin-inline: auto;
	}

	.my-0 {
		margin-block: calc(var(--spacing) * 0);
	}

	.my-2 {
		margin-block: calc(var(--spacing) * 2);
	}

	.my-2\.5 {
		margin-block: calc(var(--spacing) * 2.5);
	}

	.my-3 {
		margin-block: calc(var(--spacing) * 3);
	}

	.my-7 {
		margin-block: calc(var(--spacing) * 7);
	}

	.my-7\.5 {
		margin-block: calc(var(--spacing) * 7.5);
	}

	.-ms-10 {
		margin-inline-start: calc(var(--spacing) * -10);
	}

	.-ms-px {
		margin-inline-start: -1px;
	}

	.ms-1 {
		margin-inline-start: calc(var(--spacing) * 1);
	}

	.ms-1\.25 {
		margin-inline-start: calc(var(--spacing) * 1.25);
	}

	.ms-4 {
		margin-inline-start: calc(var(--spacing) * 4);
	}

	.ms-15 {
		margin-inline-start: calc(var(--spacing) * 15);
	}

	.ms-auto {
		margin-inline-start: auto;
	}

	.-me-3 {
		margin-inline-end: calc(var(--spacing) * -3);
	}

	.-me-3\.25 {
		margin-inline-end: calc(var(--spacing) * -3.25);
	}

	.-me-3\.75 {
		margin-inline-end: calc(var(--spacing) * -3.75);
	}

	.me-1 {
		margin-inline-end: calc(var(--spacing) * 1);
	}

	.me-1\.25 {
		margin-inline-end: calc(var(--spacing) * 1.25);
	}

	.me-2 {
		margin-inline-end: calc(var(--spacing) * 2);
	}

	.me-2\.5 {
		margin-inline-end: calc(var(--spacing) * 2.5);
	}

	.me-2\.25 {
		margin-inline-end: calc(var(--spacing) * 2.25);
	}

	.\!mt-5 {
		margin-top: calc(var(--spacing) * 5) !important;
	}

	.\!mt-10 {
		margin-top: calc(var(--spacing) * 10) !important;
	}

	.\!mt-auto {
		margin-top: auto !important;
	}

	.-mt-25 {
		margin-top: calc(var(--spacing) * -25);
	}

	.-mt-30 {
		margin-top: calc(var(--spacing) * -30);
	}

	.-mt-50 {
		margin-top: calc(var(--spacing) * -50);
	}

	.-mt-55 {
		margin-top: calc(var(--spacing) * -55);
	}

	.mt-2 {
		margin-top: calc(var(--spacing) * 2);
	}

	.mt-2\.5 {
		margin-top: calc(var(--spacing) * 2.5);
	}

	.mt-3 {
		margin-top: calc(var(--spacing) * 3);
	}

	.mt-3\.5 {
		margin-top: calc(var(--spacing) * 3.5);
	}

	.mt-3\.75 {
		margin-top: calc(var(--spacing) * 3.75);
	}

	.mt-5 {
		margin-top: calc(var(--spacing) * 5);
	}

	.mt-7 {
		margin-top: calc(var(--spacing) * 7);
	}

	.mt-7\.5 {
		margin-top: calc(var(--spacing) * 7.5);
	}

	.mt-10 {
		margin-top: calc(var(--spacing) * 10);
	}

	.mt-11 {
		margin-top: calc(var(--spacing) * 11);
	}

	.mt-11\.75 {
		margin-top: calc(var(--spacing) * 11.75);
	}

	.mt-12 {
		margin-top: calc(var(--spacing) * 12);
	}

	.mt-12\.5 {
		margin-top: calc(var(--spacing) * 12.5);
	}

	.mt-auto {
		margin-top: auto;
	}

	.container {
		max-width: 1330px;
		--bs-gutter-x: 30px;
		--bs-gutter-y: 0;
		padding-right: calc(var(--bs-gutter-x) * .5);
		padding-left: calc(var(--bs-gutter-x) * .5);
		margin-right: auto;
		margin-left: auto;
	}

	.container-fluid {
		max-width: 1870px;
		--bs-gutter-x: 30px;
		--bs-gutter-y: 0;
		padding-right: calc(var(--bs-gutter-x) * .5);
		padding-left: calc(var(--bs-gutter-x) * .5);
		margin-right: auto;
		margin-left: auto;
	}

	.container-full {
		max-width: 1910px;
		--bs-gutter-x: 0px;
		--bs-gutter-y: 0;
		padding-right: calc(var(--bs-gutter-x) * .5);
		padding-left: calc(var(--bs-gutter-x) * .5);
		margin-right: auto;
		margin-left: auto;
	}

	.container-lg {
		max-width: 1540px;
		--bs-gutter-x: 30px;
		--bs-gutter-y: 0;
		padding-right: calc(var(--bs-gutter-x) * .5);
		padding-left: calc(var(--bs-gutter-x) * .5);
		margin-right: auto;
		margin-left: auto;
	}

	.container-md {
		max-width: 1364px;
		--bs-gutter-x: 30px;
		--bs-gutter-y: 0;
		padding-right: calc(var(--bs-gutter-x) * .5);
		padding-left: calc(var(--bs-gutter-x) * .5);
		margin-right: auto;
		margin-left: auto;
	}

	.container-sm {
		max-width: 946px;
		--bs-gutter-x: 30px;
		--bs-gutter-y: 0;
		padding-right: calc(var(--bs-gutter-x) * .5);
		padding-left: calc(var(--bs-gutter-x) * .5);
		margin-right: auto;
		margin-left: auto;
	}

	.container-xs {
		max-width: 874px;
		--bs-gutter-x: 30px;
		--bs-gutter-y: 0;
		padding-right: calc(var(--bs-gutter-x) * .5);
		padding-left: calc(var(--bs-gutter-x) * .5);
		margin-right: auto;
		margin-left: auto;
	}

	.mr-1 {
		margin-right: calc(var(--spacing) * 1);
	}

	.mr-1\.25 {
		margin-right: calc(var(--spacing) * 1.25);
	}

	.mr-1\.75 {
		margin-right: calc(var(--spacing) * 1.75);
	}

	.mr-2 {
		margin-right: calc(var(--spacing) * 2);
	}

	.mr-2\.5 {
		margin-right: calc(var(--spacing) * 2.5);
	}

	.mr-3 {
		margin-right: calc(var(--spacing) * 3);
	}

	.mr-3\.75 {
		margin-right: calc(var(--spacing) * 3.75);
	}

	.mr-4 {
		margin-right: calc(var(--spacing) * 4);
	}

	.mr-5 {
		margin-right: calc(var(--spacing) * 5);
	}

	.mr-7 {
		margin-right: calc(var(--spacing) * 7);
	}

	.mr-7\.5 {
		margin-right: calc(var(--spacing) * 7.5);
	}

	.mr-20 {
		margin-right: calc(var(--spacing) * 20);
	}

	.\!mb-3\.75 {
		margin-bottom: calc(var(--spacing) * 3.75) !important;
	}

	.-mb-0 {
		margin-bottom: calc(var(--spacing) * -0);
	}

	.-mb-0\.5 {
		margin-bottom: calc(var(--spacing) * -0.5);
	}

	.mb-0 {
		margin-bottom: calc(var(--spacing) * 0);
	}

	.mb-0\.5 {
		margin-bottom: calc(var(--spacing) * 0.5);
	}

	.mb-0\.75 {
		margin-bottom: calc(var(--spacing) * 0.75);
	}

	.mb-1 {
		margin-bottom: calc(var(--spacing) * 1);
	}

	.mb-1\.5 {
		margin-bottom: calc(var(--spacing) * 1.5);
	}

	.mb-1\.25 {
		margin-bottom: calc(var(--spacing) * 1.25);
	}

	.mb-1\.75 {
		margin-bottom: calc(var(--spacing) * 1.75);
	}

	.mb-2 {
		margin-bottom: calc(var(--spacing) * 2);
	}

	.mb-2\.5 {
		margin-bottom: calc(var(--spacing) * 2.5);
	}

	.mb-2\.25 {
		margin-bottom: calc(var(--spacing) * 2.25);
	}

	.mb-3 {
		margin-bottom: calc(var(--spacing) * 3);
	}

	.mb-3\.5 {
		margin-bottom: calc(var(--spacing) * 3.5);
	}

	.mb-3\.75 {
		margin-bottom: calc(var(--spacing) * 3.75);
	}

	.mb-4 {
		margin-bottom: calc(var(--spacing) * 4);
	}

	.mb-4\.5 {
		margin-bottom: calc(var(--spacing) * 4.5);
	}

	.mb-5 {
		margin-bottom: calc(var(--spacing) * 5);
	}

	.mb-5\.75 {
		margin-bottom: calc(var(--spacing) * 5.75);
	}

	.mb-6 {
		margin-bottom: calc(var(--spacing) * 6);
	}

	.mb-6\.25 {
		margin-bottom: calc(var(--spacing) * 6.25);
	}

	.mb-7 {
		margin-bottom: calc(var(--spacing) * 7);
	}

	.mb-7\.5 {
		margin-bottom: calc(var(--spacing) * 7.5);
	}

	.mb-8 {
		margin-bottom: calc(var(--spacing) * 8);
	}

	.mb-8\.75 {
		margin-bottom: calc(var(--spacing) * 8.75);
	}

	.mb-9 {
		margin-bottom: calc(var(--spacing) * 9);
	}

	.mb-9\.25 {
		margin-bottom: calc(var(--spacing) * 9.25);
	}

	.mb-10 {
		margin-bottom: calc(var(--spacing) * 10);
	}

	.mb-11 {
		margin-bottom: calc(var(--spacing) * 11);
	}

	.mb-11\.25 {
		margin-bottom: calc(var(--spacing) * 11.25);
	}

	.mb-12 {
		margin-bottom: calc(var(--spacing) * 12);
	}

	.mb-12\.5 {
		margin-bottom: calc(var(--spacing) * 12.5);
	}

	.mb-16 {
		margin-bottom: calc(var(--spacing) * 16);
	}

	.mb-16\.75 {
		margin-bottom: calc(var(--spacing) * 16.75);
	}

	.mb-17 {
		margin-bottom: calc(var(--spacing) * 17);
	}

	.mb-17\.5 {
		margin-bottom: calc(var(--spacing) * 17.5);
	}

	.mb-20 {
		margin-bottom: calc(var(--spacing) * 20);
	}

	.ml-1 {
		margin-left: calc(var(--spacing) * 1);
	}

	.ml-1\.25 {
		margin-left: calc(var(--spacing) * 1.25);
	}

	.ml-1\.75 {
		margin-left: calc(var(--spacing) * 1.75);
	}

	.ml-2 {
		margin-left: calc(var(--spacing) * 2);
	}

	.ml-2\.5 {
		margin-left: calc(var(--spacing) * 2.5);
	}

	.ml-5 {
		margin-left: calc(var(--spacing) * 5);
	}

	.ml-10 {
		margin-left: calc(var(--spacing) * 10);
	}

	.ml-20 {
		margin-left: calc(var(--spacing) * 20);
	}

	.ml-auto {
		margin-left: auto;
	}

	.\!block {
		display: block !important;
	}

	.\!flex {
		display: flex !important;
	}

	.block {
		display: block;
	}

	.contents {
		display: contents;
	}

	.flex {
		display: flex;
	}

	.grid {
		display: grid;
	}

	.hidden {
		display: none;
	}

	.inline {
		display: inline;
	}

	.inline-block {
		display: inline-block;
	}

	.inline-flex {
		display: inline-flex;
	}

	.list-item {
		display: list-item;
	}

	.table {
		display: table;
	}

	.table-cell {
		display: table-cell;
	}

	.\!size-1\.5 {
		width: calc(var(--spacing) * 1.5) !important;
		height: calc(var(--spacing) * 1.5) !important;
	}

	.\!size-2\.25 {
		width: calc(var(--spacing) * 2.25) !important;
		height: calc(var(--spacing) * 2.25) !important;
	}

	.\!size-auto {
		width: auto !important;
		height: auto !important;
	}

	.size-3 {
		width: calc(var(--spacing) * 3);
		height: calc(var(--spacing) * 3);
	}

	.size-3\.75 {
		width: calc(var(--spacing) * 3.75);
		height: calc(var(--spacing) * 3.75);
	}

	.size-4 {
		width: calc(var(--spacing) * 4);
		height: calc(var(--spacing) * 4);
	}

	.size-7 {
		width: calc(var(--spacing) * 7);
		height: calc(var(--spacing) * 7);
	}

	.size-7\.5 {
		width: calc(var(--spacing) * 7.5);
		height: calc(var(--spacing) * 7.5);
	}

	.size-8 {
		width: calc(var(--spacing) * 8);
		height: calc(var(--spacing) * 8);
	}

	.size-8\.5 {
		width: calc(var(--spacing) * 8.5);
		height: calc(var(--spacing) * 8.5);
	}

	.size-9 {
		width: calc(var(--spacing) * 9);
		height: calc(var(--spacing) * 9);
	}

	.size-9\.5 {
		width: calc(var(--spacing) * 9.5);
		height: calc(var(--spacing) * 9.5);
	}

	.size-10 {
		width: calc(var(--spacing) * 10);
		height: calc(var(--spacing) * 10);
	}

	.size-10\.5 {
		width: calc(var(--spacing) * 10.5);
		height: calc(var(--spacing) * 10.5);
	}

	.size-11 {
		width: calc(var(--spacing) * 11);
		height: calc(var(--spacing) * 11);
	}

	.size-11\.25 {
		width: calc(var(--spacing) * 11.25);
		height: calc(var(--spacing) * 11.25);
	}

	.size-12 {
		width: calc(var(--spacing) * 12);
		height: calc(var(--spacing) * 12);
	}

	.size-12\.5 {
		width: calc(var(--spacing) * 12.5);
		height: calc(var(--spacing) * 12.5);
	}

	.size-15 {
		width: calc(var(--spacing) * 15);
		height: calc(var(--spacing) * 15);
	}

	.size-17 {
		width: calc(var(--spacing) * 17);
		height: calc(var(--spacing) * 17);
	}

	.size-17\.5 {
		width: calc(var(--spacing) * 17.5);
		height: calc(var(--spacing) * 17.5);
	}

	.size-18 {
		width: calc(var(--spacing) * 18);
		height: calc(var(--spacing) * 18);
	}

	.size-18\.75 {
		width: calc(var(--spacing) * 18.75);
		height: calc(var(--spacing) * 18.75);
	}

	.size-20 {
		width: calc(var(--spacing) * 20);
		height: calc(var(--spacing) * 20);
	}

	.size-21 {
		width: calc(var(--spacing) * 21);
		height: calc(var(--spacing) * 21);
	}

	.size-21\.25 {
		width: calc(var(--spacing) * 21.25);
		height: calc(var(--spacing) * 21.25);
	}

	.size-29 {
		width: calc(var(--spacing) * 29);
		height: calc(var(--spacing) * 29);
	}

	.size-39 {
		width: calc(var(--spacing) * 39);
		height: calc(var(--spacing) * 39);
	}

	.size-40 {
		width: calc(var(--spacing) * 40);
		height: calc(var(--spacing) * 40);
	}

	.size-50 {
		width: calc(var(--spacing) * 50);
		height: calc(var(--spacing) * 50);
	}

	.size-\[44px\] {
		width: 44px;
		height: 44px;
	}

	.size-\[100px\] {
		width: 100px;
		height: 100px;
	}

	.size-full {
		width: 100%;
		height: 100%;
	}

	.\!h-13 {
		height: calc(var(--spacing) * 13) !important;
	}

	.\!h-15 {
		height: calc(var(--spacing) * 15) !important;
	}

	.\!h-auto {
		height: auto !important;
	}

	.\!h-full {
		height: 100% !important;
	}

	.\!h-screen {
		height: 100vh !important;
	}

	.h-0 {
		height: calc(var(--spacing) * 0);
	}

	.h-0\.5 {
		height: calc(var(--spacing) * 0.5);
	}

	.h-1\.25 {
		height: calc(var(--spacing) * 1.25);
	}

	.h-5 {
		height: calc(var(--spacing) * 5);
	}

	.h-7 {
		height: calc(var(--spacing) * 7);
	}

	.h-7\.5 {
		height: calc(var(--spacing) * 7.5);
	}

	.h-10 {
		height: calc(var(--spacing) * 10);
	}

	.h-12 {
		height: calc(var(--spacing) * 12);
	}

	.h-12\.5 {
		height: calc(var(--spacing) * 12.5);
	}

	.h-13 {
		height: calc(var(--spacing) * 13);
	}

	.h-15 {
		height: calc(var(--spacing) * 15);
	}

	.h-25 {
		height: calc(var(--spacing) * 25);
	}

	.h-26 {
		height: calc(var(--spacing) * 26);
	}

	.h-26\.25 {
		height: calc(var(--spacing) * 26.25);
	}

	.h-37 {
		height: calc(var(--spacing) * 37);
	}

	.h-37\.5 {
		height: calc(var(--spacing) * 37.5);
	}

	.h-50 {
		height: calc(var(--spacing) * 50);
	}

	.h-52 {
		height: calc(var(--spacing) * 52);
	}

	.h-52\.5 {
		height: calc(var(--spacing) * 52.5);
	}

	.h-62 {
		height: calc(var(--spacing) * 62);
	}

	.h-62\.5 {
		height: calc(var(--spacing) * 62.5);
	}

	.h-75 {
		height: calc(var(--spacing) * 75);
	}

	.h-80 {
		height: calc(var(--spacing) * 80);
	}

	.h-87 {
		height: calc(var(--spacing) * 87);
	}

	.h-87\.5 {
		height: calc(var(--spacing) * 87.5);
	}

	.h-90 {
		height: calc(var(--spacing) * 90);
	}

	.h-125 {
		height: calc(var(--spacing) * 125);
	}

	.h-375 {
		height: calc(var(--spacing) * 375);
	}

	.h-395 {
		height: calc(var(--spacing) * 395);
	}

	.h-\[calc\(100\%_-_55px\)\] {
		height: calc(100% - 55px);
	}

	.h-\[calc\(155px_\/_2\)\] {
		height: calc(155px / 2);
	}

	.h-auto {
		height: auto;
	}

	.h-full {
		height: 100%;
	}

	.h-px {
		height: 1px;
	}

	.h-screen {
		height: 100vh;
	}

	.max-h-0 {
		max-height: calc(var(--spacing) * 0);
	}

	.max-h-175 {
		max-height: calc(var(--spacing) * 175);
	}

	.max-h-200 {
		max-height: calc(var(--spacing) * 200);
	}

	.min-h-28 {
		min-height: calc(var(--spacing) * 28);
	}

	.min-h-28\.75 {
		min-height: calc(var(--spacing) * 28.75);
	}

	.min-h-37 {
		min-height: calc(var(--spacing) * 37);
	}

	.min-h-37\.5 {
		min-height: calc(var(--spacing) * 37.5);
	}

	.\!w-12\.5 {
		width: calc(var(--spacing) * 12.5) !important;
	}

	.\!w-auto {
		width: auto !important;
	}

	.\!w-full {
		width: 100% !important;
	}

	.w-0 {
		width: calc(var(--spacing) * 0);
	}

	.w-1 {
		width: calc(var(--spacing) * 1);
	}

	.w-1\/2 {
		width: calc(1/2 * 100%);
	}

	.w-1\/12 {
		width: calc(1/12 * 100%);
	}

	.w-3\.75 {
		width: calc(var(--spacing) * 3.75);
	}

	.w-7\.5 {
		width: calc(var(--spacing) * 7.5);
	}

	.w-10 {
		width: calc(var(--spacing) * 10);
	}

	.w-10\.5 {
		width: calc(var(--spacing) * 10.5);
	}

	.w-12 {
		width: calc(var(--spacing) * 12);
	}

	.w-12\.5 {
		width: calc(var(--spacing) * 12.5);
	}

	.w-14 {
		width: calc(var(--spacing) * 14);
	}

	.w-14\.5 {
		width: calc(var(--spacing) * 14.5);
	}

	.w-20 {
		width: calc(var(--spacing) * 20);
	}

	.w-20\.75 {
		width: calc(var(--spacing) * 20.75);
	}

	.w-25 {
		width: calc(var(--spacing) * 25);
	}

	.w-26 {
		width: calc(var(--spacing) * 26);
	}

	.w-26\.75 {
		width: calc(var(--spacing) * 26.75);
	}

	.w-30 {
		width: calc(var(--spacing) * 30);
	}

	.w-65 {
		width: calc(var(--spacing) * 65);
	}

	.w-75 {
		width: calc(var(--spacing) * 75);
	}

	.w-80 {
		width: calc(var(--spacing) * 80);
	}

	.w-87 {
		width: calc(var(--spacing) * 87);
	}

	.w-87\.5 {
		width: calc(var(--spacing) * 87.5);
	}

	.w-115 {
		width: calc(var(--spacing) * 115);
	}

	.w-\[1\%\] {
		width: 1%;
	}

	.w-\[80\%\] {
		width: 80%;
	}

	.w-auto {
		width: auto;
	}

	.w-fit {
		width: fit-content;
	}

	.w-full {
		width: 100%;
	}

	.w-max {
		width: max-content;
	}

	.max-w-42 {
		max-width: calc(var(--spacing) * 42);
	}

	.max-w-42\.5 {
		max-width: calc(var(--spacing) * 42.5);
	}

	.max-w-75 {
		max-width: calc(var(--spacing) * 75);
	}

	.max-w-85 {
		max-width: calc(var(--spacing) * 85);
	}

	.max-w-94\.5 {
		max-width: calc(var(--spacing) * 94.5);
	}

	.max-w-95 {
		max-width: calc(var(--spacing) * 95);
	}

	.max-w-100 {
		max-width: calc(var(--spacing) * 100);
	}

	.max-w-125 {
		max-width: calc(var(--spacing) * 125);
	}

	.max-w-140 {
		max-width: calc(var(--spacing) * 140);
	}

	.max-w-150 {
		max-width: calc(var(--spacing) * 150);
	}

	.max-w-175 {
		max-width: calc(var(--spacing) * 175);
	}

	.max-w-187 {
		max-width: calc(var(--spacing) * 187);
	}

	.max-w-187\.5 {
		max-width: calc(var(--spacing) * 187.5);
	}

	.max-w-190 {
		max-width: calc(var(--spacing) * 190);
	}

	.max-w-200 {
		max-width: calc(var(--spacing) * 200);
	}

	.max-w-230 {
		max-width: calc(var(--spacing) * 230);
	}

	.max-w-300 {
		max-width: calc(var(--spacing) * 300);
	}

	.max-w-330 {
		max-width: calc(var(--spacing) * 330);
	}

	.max-w-350 {
		max-width: calc(var(--spacing) * 350);
	}

	.max-w-full {
		max-width: 100%;
	}

	.min-w-6 {
		min-width: calc(var(--spacing) * 6);
	}

	.min-w-6\.25 {
		min-width: calc(var(--spacing) * 6.25);
	}

	.min-w-10 {
		min-width: calc(var(--spacing) * 10);
	}

	.min-w-12 {
		min-width: calc(var(--spacing) * 12);
	}

	.min-w-12\.5 {
		min-width: calc(var(--spacing) * 12.5);
	}

	.min-w-15 {
		min-width: calc(var(--spacing) * 15);
	}

	.min-w-17 {
		min-width: calc(var(--spacing) * 17);
	}

	.min-w-17\.5 {
		min-width: calc(var(--spacing) * 17.5);
	}

	.min-w-18 {
		min-width: calc(var(--spacing) * 18);
	}

	.min-w-18\.75 {
		min-width: calc(var(--spacing) * 18.75);
	}

	.min-w-20 {
		min-width: calc(var(--spacing) * 20);
	}

	.min-w-22 {
		min-width: calc(var(--spacing) * 22);
	}

	.min-w-22\.5 {
		min-width: calc(var(--spacing) * 22.5);
	}

	.min-w-23 {
		min-width: calc(var(--spacing) * 23);
	}

	.min-w-23\.5 {
		min-width: calc(var(--spacing) * 23.5);
	}

	.flex-1 {
		flex: 1;
	}

	.flex-auto {
		flex: auto;
	}

	.flex-shrink {
		flex-shrink: 1;
	}

	.shrink {
		flex-shrink: 1;
	}

	.shrink-0 {
		flex-shrink: 0;
	}

	.flex-grow {
		flex-grow: 1;
	}

	.grow {
		flex-grow: 1;
	}

	.border-collapse {
		border-collapse: collapse;
	}

	.origin-\[bottom_center\] {
		transform-origin: bottom center;
	}

	.origin-\[top_right\] {
		transform-origin: top right;
	}

	.-translate-1 {
		--tw-translate-x: calc(var(--spacing) * -1);
		--tw-translate-y: calc(var(--spacing) * -1);
		translate: var(--tw-translate-x) var(--tw-translate-y);
	}

	.-translate-1\/2 {
		--tw-translate-x: calc(calc(1/2 * 100%) * -1);
		--tw-translate-y: calc(calc(1/2 * 100%) * -1);
		translate: var(--tw-translate-x) var(--tw-translate-y);
	}

	.-translate-x-1 {
		--tw-translate-x: calc(var(--spacing) * -1);
		translate: var(--tw-translate-x) var(--tw-translate-y);
	}

	.-translate-x-1\/2 {
		--tw-translate-x: calc(calc(1/2 * 100%) * -1);
		translate: var(--tw-translate-x) var(--tw-translate-y);
	}

	.-translate-x-full {
		--tw-translate-x: -100%;
		translate: var(--tw-translate-x) var(--tw-translate-y);
	}

	.translate-x-1 {
		--tw-translate-x: calc(var(--spacing) * 1);
		translate: var(--tw-translate-x) var(--tw-translate-y);
	}

	.translate-x-1\/2 {
		--tw-translate-x: calc(1/2 * 100%);
		translate: var(--tw-translate-x) var(--tw-translate-y);
	}

	.translate-x-\[-130px\] {
		--tw-translate-x: -130px;
		translate: var(--tw-translate-x) var(--tw-translate-y);
	}

	.-translate-y-0 {
		--tw-translate-y: calc(var(--spacing) * -0);
		translate: var(--tw-translate-x) var(--tw-translate-y);
	}

	.-translate-y-0\.5 {
		--tw-translate-y: calc(var(--spacing) * -0.5);
		translate: var(--tw-translate-x) var(--tw-translate-y);
	}

	.-translate-y-1 {
		--tw-translate-y: calc(var(--spacing) * -1);
		translate: var(--tw-translate-x) var(--tw-translate-y);
	}

	.-translate-y-1\/2 {
		--tw-translate-y: calc(calc(1/2 * 100%) * -1);
		translate: var(--tw-translate-x) var(--tw-translate-y);
	}

	.-translate-y-4 {
		--tw-translate-y: calc(var(--spacing) * -4);
		translate: var(--tw-translate-x) var(--tw-translate-y);
	}

	.-translate-y-full {
		--tw-translate-y: -100%;
		translate: var(--tw-translate-x) var(--tw-translate-y);
	}

	.translate-y-full {
		--tw-translate-y: 100%;
		translate: var(--tw-translate-x) var(--tw-translate-y);
	}

	.scale-100 {
		--tw-scale-x: 100%;
		--tw-scale-y: 100%;
		--tw-scale-z: 100%;
		scale: var(--tw-scale-x) var(--tw-scale-y);
	}

	.scale-110 {
		--tw-scale-x: 110%;
		--tw-scale-y: 110%;
		--tw-scale-z: 110%;
		scale: var(--tw-scale-x) var(--tw-scale-y);
	}

	.scale-130 {
		--tw-scale-x: 130%;
		--tw-scale-y: 130%;
		--tw-scale-z: 130%;
		scale: var(--tw-scale-x) var(--tw-scale-y);
	}

	.scale-200 {
		--tw-scale-x: 200%;
		--tw-scale-y: 200%;
		--tw-scale-z: 200%;
		scale: var(--tw-scale-x) var(--tw-scale-y);
	}

	.scale-\[0\.5\] {
		scale: 0.5;
	}

	.-rotate-2 {
		rotate: calc(2deg * -1);
	}

	.-rotate-45 {
		rotate: calc(45deg * -1);
	}

	.-rotate-90 {
		rotate: calc(90deg * -1);
	}

	.-rotate-180 {
		rotate: calc(180deg * -1);
	}

	.rotate-90 {
		rotate: 90deg;
	}

	.rotate-\[-2deg\] {
		rotate: -2deg;
	}

	.rotate-\[-360deg\] {
		rotate: -360deg;
	}

	.rotate-\[90deg\] {
		rotate: 90deg;
	}

	.rotate-\[var\(--char-rotate\)\] {
		rotate: var(--char-rotate);
	}

	.\[transform\:translate\(-20\%\,_-50\%\)\] {
		transform: translate(-20%, -50%);
	}

	.transform {
		transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
	}

	.animate-ScaleInOut {
		animation: var(--animate-ScaleInOut);
	}

	.animate-rotate {
		animation: var(--animate-rotate);
	}

	.cursor-pointer {
		cursor: pointer;
	}

	.resize {
		resize: both;
	}

	.\!list-decimal {
		list-style-type: decimal !important;
	}

	.grid-cols-12 {
		grid-template-columns: repeat(12, minmax(0, 1fr));
	}

	.flex-col {
		flex-direction: column;
	}

	.flex-wrap {
		flex-wrap: wrap;
	}

	.items-baseline {
		align-items: baseline;
	}

	.items-center {
		align-items: center;
	}

	.items-end {
		align-items: flex-end;
	}

	.items-start {
		align-items: flex-start;
	}

	.items-stretch {
		align-items: stretch;
	}

	.justify-between {
		justify-content: space-between;
	}

	.justify-center {
		justify-content: center;
	}

	.justify-end {
		justify-content: flex-end;
	}

	.justify-start {
		justify-content: flex-start;
	}

	.gap-0 {
		gap: calc(var(--spacing) * 0);
	}

	.gap-0\.25 {
		gap: calc(var(--spacing) * 0.25);
	}

	.gap-1 {
		gap: calc(var(--spacing) * 1);
	}

	.gap-1\.5 {
		gap: calc(var(--spacing) * 1.5);
	}

	.gap-1\.25 {
		gap: calc(var(--spacing) * 1.25);
	}

	.gap-2 {
		gap: calc(var(--spacing) * 2);
	}

	.gap-2\.5 {
		gap: calc(var(--spacing) * 2.5);
	}

	.gap-2\.75 {
		gap: calc(var(--spacing) * 2.75);
	}

	.gap-3 {
		gap: calc(var(--spacing) * 3);
	}

	.gap-3\.5 {
		gap: calc(var(--spacing) * 3.5);
	}

	.gap-3\.25 {
		gap: calc(var(--spacing) * 3.25);
	}

	.gap-3\.75 {
		gap: calc(var(--spacing) * 3.75);
	}

	.gap-4 {
		gap: calc(var(--spacing) * 4);
	}

	.gap-4\.5 {
		gap: calc(var(--spacing) * 4.5);
	}

	.gap-5 {
		gap: calc(var(--spacing) * 5);
	}

	.gap-5\.75 {
		gap: calc(var(--spacing) * 5.75);
	}

	.gap-6 {
		gap: calc(var(--spacing) * 6);
	}

	.gap-6\.5 {
		gap: calc(var(--spacing) * 6.5);
	}

	.gap-7 {
		gap: calc(var(--spacing) * 7);
	}

	.gap-7\.5 {
		gap: calc(var(--spacing) * 7.5);
	}

	.gap-8 {
		gap: calc(var(--spacing) * 8);
	}

	.gap-8\.75 {
		gap: calc(var(--spacing) * 8.75);
	}

	.gap-9 {
		gap: calc(var(--spacing) * 9);
	}

	.gap-10 {
		gap: calc(var(--spacing) * 10);
	}

	.gap-12 {
		gap: calc(var(--spacing) * 12);
	}

	.gap-20 {
		gap: calc(var(--spacing) * 20);
	}

	.space-y-3 {
		:where(& > :not(:last-child)) {
			--tw-space-y-reverse: 0;
			margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));
			margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));
		}
	}

	.space-y-7 {
		:where(& > :not(:last-child)) {
			--tw-space-y-reverse: 0;
			margin-block-start: calc(calc(var(--spacing) * 7) * var(--tw-space-y-reverse));
			margin-block-end: calc(calc(var(--spacing) * 7) * calc(1 - var(--tw-space-y-reverse)));
		}
	}

	.space-y-7\.5 {
		:where(& > :not(:last-child)) {
			--tw-space-y-reverse: 0;
			margin-block-start: calc(calc(var(--spacing) * 7.5) * var(--tw-space-y-reverse));
			margin-block-end: calc(calc(var(--spacing) * 7.5) * calc(1 - var(--tw-space-y-reverse)));
		}
	}

	.gap-x-5 {
		column-gap: calc(var(--spacing) * 5);
	}

	.gap-y-2 {
		row-gap: calc(var(--spacing) * 2);
	}

	.gap-y-2\.5 {
		row-gap: calc(var(--spacing) * 2.5);
	}

	.self-center {
		align-self: center;
	}

	.self-end {
		align-self: flex-end;
	}

	.truncate {
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.\!overflow-visible {
		overflow: visible !important;
	}

	.overflow-auto {
		overflow: auto;
	}

	.overflow-hidden {
		overflow: hidden;
	}

	.overflow-visible {
		overflow: visible;
	}

	.overflow-x-auto {
		overflow-x: auto;
	}

	.overflow-y-auto {
		overflow-y: auto;
	}

	.\!rounded-\[1px\] {
		border-radius: 1px !important;
	}

	.rounded {
		border-radius: 0.25rem;
	}

	.rounded-2lg {
		border-radius: var(--radius-2lg);
	}

	.rounded-2xl {
		border-radius: var(--radius-2xl);
	}

	.rounded-4xl {
		border-radius: var(--radius-4xl);
	}

	.rounded-5xl {
		border-radius: var(--radius-5xl);
	}

	.rounded-\[\.25em\] {
		border-radius: .25em;
	}

	.rounded-\[8px\] {
		border-radius: 8px;
	}

	.rounded-full {
		border-radius: calc(infinity * 1px);
	}

	.rounded-lg {
		border-radius: var(--radius-lg);
	}

	.rounded-md {
		border-radius: var(--radius-md);
	}

	.rounded-xl {
		border-radius: var(--radius-xl);
	}

	.rounded-xxl {
		border-radius: var(--radius-xxl);
	}

	.rounded-e-2xl {
		border-start-end-radius: var(--radius-2xl);
		border-end-end-radius: var(--radius-2xl);
	}

	.rounded-t-2xl {
		border-top-left-radius: var(--radius-2xl);
		border-top-right-radius: var(--radius-2xl);
	}

	.rounded-tl-xxl {
		border-top-left-radius: var(--radius-xxl);
	}

	.rounded-tr-2lg {
		border-top-right-radius: var(--radius-2lg);
	}

	.rounded-tr-2xl {
		border-top-right-radius: var(--radius-2xl);
	}

	.rounded-tr-xxl {
		border-top-right-radius: var(--radius-xxl);
	}

	.rounded-br-2xl {
		border-bottom-right-radius: var(--radius-2xl);
	}

	.rounded-br-xxl {
		border-bottom-right-radius: var(--radius-xxl);
	}

	.\!border-0 {
		border-style: var(--tw-border-style) !important;
		border-width: 0px !important;
	}

	.border {
		border-style: var(--tw-border-style);
		border-width: 1px;
	}

	.border-0 {
		border-style: var(--tw-border-style);
		border-width: 0px;
	}

	.border-2 {
		border-style: var(--tw-border-style);
		border-width: 2px;
	}

	.border-4 {
		border-style: var(--tw-border-style);
		border-width: 4px;
	}

	.border-5 {
		border-style: var(--tw-border-style);
		border-width: 5px;
	}

	.border-t {
		border-top-style: var(--tw-border-style);
		border-top-width: 1px;
	}

	.border-r {
		border-right-style: var(--tw-border-style);
		border-right-width: 1px;
	}

	.border-b {
		border-bottom-style: var(--tw-border-style);
		border-bottom-width: 1px;
	}

	.border-b-2 {
		border-bottom-style: var(--tw-border-style);
		border-bottom-width: 2px;
	}

	.border-l {
		border-left-style: var(--tw-border-style);
		border-left-width: 1px;
	}

	.border-none {
		--tw-border-style: none;
		border-style: none;
	}

	.\!border-primary {
		border-color: var(--color-primary) !important;
	}

	.\!border-white {
		border-color: var(--color-white) !important;
	}

	.border-\[\#1B4C401A\] {
		border-color: #1B4C401A;
	}

	.border-\[\#383B3F\] {
		border-color: #383B3F;
	}

	.border-\[\#687B76\] {
		border-color: #687B76;
	}

	.border-\[\#D7D7D7\] {
		border-color: #D7D7D7;
	}

	.border-\[\#E6E6E6\] {
		border-color: #E6E6E6;
	}

	.border-black {
		border-color: var(--color-black);
	}

	.border-black\/10 {
		border-color: color-mix(in srgb, #000 10%, transparent);

		@supports (color: color-mix(in lab, red, red)) {
			border-color: color-mix(in oklab, var(--color-black) 10%, transparent);
		}
	}

	.border-black\/15 {
		border-color: color-mix(in srgb, #000 15%, transparent);

		@supports (color: color-mix(in lab, red, red)) {
			border-color: color-mix(in oklab, var(--color-black) 15%, transparent);
		}
	}

	.border-black\/20 {
		border-color: color-mix(in srgb, #000 20%, transparent);

		@supports (color: color-mix(in lab, red, red)) {
			border-color: color-mix(in oklab, var(--color-black) 20%, transparent);
		}
	}

	.border-bordergray {
		border-color: var(--color-bordergray);
	}

	.border-bordergraylight {
		border-color: var(--color-bordergraylight);
	}

	.border-light {
		border-color: var(--color-light);
	}

	.border-primary {
		border-color: var(--color-primary);
	}

	.border-primary\/20 {
		border-color: var(--color-primary);

		@supports (color: color-mix(in lab, red, red)) {
			border-color: color-mix(in oklab, var(--color-primary) 20%, transparent);
		}
	}

	.border-secondary {
		border-color: var(--color-secondary);
	}

	.border-transparent {
		border-color: transparent;
	}

	.border-white {
		border-color: var(--color-white);
	}

	.border-white\/5 {
		border-color: color-mix(in srgb, #fff 5%, transparent);

		@supports (color: color-mix(in lab, red, red)) {
			border-color: color-mix(in oklab, var(--color-white) 5%, transparent);
		}
	}

	.border-white\/10 {
		border-color: color-mix(in srgb, #fff 10%, transparent);

		@supports (color: color-mix(in lab, red, red)) {
			border-color: color-mix(in oklab, var(--color-white) 10%, transparent);
		}
	}

	.border-t-lightgreen {
		border-top-color: var(--color-lightpurple);
	}

	.\!bg-black\/15 {
		background-color: color-mix(in srgb, #000 15%, transparent) !important;

		@supports (color: color-mix(in lab, red, red)) {
			background-color: color-mix(in oklab, var(--color-black) 15%, transparent) !important;
		}
	}

	.\!bg-transparent {
		background-color: transparent !important;
	}

	.\!bg-white {
		background-color: var(--color-white) !important;
	}

	.\!bg-white\/30 {
		background-color: color-mix(in srgb, #fff 30%, transparent) !important;

		@supports (color: color-mix(in lab, red, red)) {
			background-color: color-mix(in oklab, var(--color-white) 30%, transparent) !important;
		}
	}

	.bg-\[\#000000c4\] {
		background-color: #000000c4;
	}

	.bg-\[\#000000cc\] {
		background-color: #000000cc;
	}

	.bg-\[\#D9D9D9\] {
		background-color: #D9D9D9;
	}

	.bg-\[\#F3F6E9\] {
		background-color: #F3F6E9;
	}

	.bg-\[\#F8F8F8\] {
		background-color: #F8F8F8;
	}

	.bg-\[\#FAFAFA\] {
		background-color: #FAFAFA;
	}

	.bg-\[\#FFBE17\] {
		background-color: #FFBE17;
	}

	.bg-\[rgba\(0\,0\,0\,0\.6\)\] {
		background-color: rgba(0, 0, 0, 0.6);
	}

	.bg-bglight {
		background-color: var(--color-bglight);
	}

	.bg-black {
		background-color: var(--color-black);
	}

	.bg-black\/10 {
		background-color: color-mix(in srgb, #000 10%, transparent);

		@supports (color: color-mix(in lab, red, red)) {
			background-color: color-mix(in oklab, var(--color-black) 10%, transparent);
		}
	}

	.bg-black\/35 {
		background-color: color-mix(in srgb, #000 35%, transparent);

		@supports (color: color-mix(in lab, red, red)) {
			background-color: color-mix(in oklab, var(--color-black) 35%, transparent);
		}
	}

	.bg-black\/50 {
		background-color: color-mix(in srgb, #000 50%, transparent);

		@supports (color: color-mix(in lab, red, red)) {
			background-color: color-mix(in oklab, var(--color-black) 50%, transparent);
		}
	}

	.bg-black\/80 {
		background-color: color-mix(in srgb, #000 80%, transparent);

		@supports (color: color-mix(in lab, red, red)) {
			background-color: color-mix(in oklab, var(--color-black) 80%, transparent);
		}
	}

	.bg-bodybg {
		background-color: var(--color-bodybg);
	}

	.bg-grey {
		background-color: var(--color-grey);
	}

	.bg-light {
		background-color: var(--color-light);
	}

	.bg-primary {
		background-color: var(--color-primary);
	}

	.bg-primarylight {
		background-color: var(--color-primarylight);
	}

	.bg-red {
		background-color: var(--color-red);
	}

	.bg-secondary {
		background-color: var(--color-secondary);
	}

	.bg-secondary\/10 {
		background-color: var(--color-secondary);

		@supports (color: color-mix(in lab, red, red)) {
			background-color: color-mix(in oklab, var(--color-secondary) 10%, transparent);
		}
	}

	.bg-transparent {
		background-color: transparent;
	}

	.bg-secondarylight {
		background-color: var(--secondarylight);
	}

	.bg-white {
		background-color: var(--color-white);
	}

	.bg-white\/5 {
		background-color: color-mix(in srgb, #fff 5%, transparent);

		@supports (color: color-mix(in lab, red, red)) {
			background-color: color-mix(in oklab, var(--color-white) 5%, transparent);
		}
	}

	.bg-white\/20 {
		background-color: color-mix(in srgb, #fff 20%, transparent);

		@supports (color: color-mix(in lab, red, red)) {
			background-color: color-mix(in oklab, var(--color-white) 20%, transparent);
		}
	}

	.bg-white\/50 {
		background-color: color-mix(in srgb, #fff 50%, transparent);

		@supports (color: color-mix(in lab, red, red)) {
			background-color: color-mix(in oklab, var(--color-white) 50%, transparent);
		}
	}

	.bg-\[image\:var\(--bg-close-icon\)\] {
		background-image: var(--bg-close-icon);
	}

	.bg-\[linear-gradient\(0deg\,rgba\(255\,255\,255\,0\)_0\.3\%\,rgba\(0\,0\,0\,0\.6\)_100\%\)\] {
		background-image: linear-gradient(0deg, rgba(255, 255, 255, 0) 0.3%, rgba(0, 0, 0, 0.6) 100%);
	}

	.bg-\[url\(\'\.\.\/images\/404\.png\'\)\] {
		background-image: url('../images/404.png');
	}

	.bg-\[url\(\'\.\.\/images\/background\/pic1\.png\'\)\] {
		background-image: url('../images/background/pic1.png');
	}

	.bg-\[url\(\'\.\.\/images\/service\/1\.png\'\)\] {
		background-image: url('../images/service/1.png');
	}

	.bg-\[url\(\'\.\.\/images\/service\/2\.png\'\)\] {
		background-image: url('../images/service/2.png');
	}

	.bg-\[url\(\'\.\.\/images\/service\/3\.png\'\)\] {
		background-image: url('../images/service/3.png');
	}

	.bg-\[url\(\'\.\.\/images\/service\/4\.png\'\)\] {
		background-image: url('../images/service/4.png');
	}

	.bg-\[url\(\'\.\.\/images\/service\/5\.png\'\)\] {
		background-image: url('../images/service/5.png');
	}

	.bg-\[url\(\'\.\.\/images\/service\/6\.png\'\)\] {
		background-image: url('../images/service/6.png');
	}

	.bg-\[url\(\.\.\/images\/blog\/details\/pic3\.png\)\] {
		background-image: url(../images/blog/details/pic3.png);
	}

	.bg-cover {
		background-size: cover;
	}

	.bg-size-\[0\] {
		background-size: 0;
	}

	.bg-center {
		background-position: center;
	}

	.bg-position-\[50\%\] {
		background-position: 50%;
	}

	.bg-no-repeat {
		background-repeat: no-repeat;
	}

	.fill-secondary {
		fill: var(--color-secondary);
	}

	.fill-white {
		fill: var(--color-white);
	}

	.stroke-secondary {
		stroke: var(--color-secondary);
	}

	.object-cover {
		object-fit: cover;
	}

	.object-center {
		object-position: center;
	}

	.p-0 {
		padding: calc(var(--spacing) * 0);
	}

	.p-1 {
		padding: calc(var(--spacing) * 1);
	}

	.p-1\.25 {
		padding: calc(var(--spacing) * 1.25);
	}

	.p-2 {
		padding: calc(var(--spacing) * 2);
	}

	.p-2\.5 {
		padding: calc(var(--spacing) * 2.5);
	}

	.p-3 {
		padding: calc(var(--spacing) * 3);
	}

	.p-3\.5 {
		padding: calc(var(--spacing) * 3.5);
	}

	.p-3\.75 {
		padding: calc(var(--spacing) * 3.75);
	}

	.p-4 {
		padding: calc(var(--spacing) * 4);
	}

	.p-4\.25 {
		padding: calc(var(--spacing) * 4.25);
	}

	.p-5 {
		padding: calc(var(--spacing) * 5);
	}

	.p-5\.5 {
		padding: calc(var(--spacing) * 5.5);
	}

	.p-7 {
		padding: calc(var(--spacing) * 7);
	}

	.p-7\.5 {
		padding: calc(var(--spacing) * 7.5);
	}

	.p-10 {
		padding: calc(var(--spacing) * 10);
	}

	.p-12 {
		padding: calc(var(--spacing) * 12);
	}

	.p-12\.5 {
		padding: calc(var(--spacing) * 12.5);
	}

	.p-\[\.25em\] {
		padding: .25em;
	}

	.\!px-0 {
		padding-inline: calc(var(--spacing) * 0) !important;
	}

	.\!px-1\.25 {
		padding-inline: calc(var(--spacing) * 1.25) !important;
	}

	.\!px-7\.5 {
		padding-inline: calc(var(--spacing) * 7.5) !important;
	}

	.px-1 {
		padding-inline: calc(var(--spacing) * 1);
	}

	.px-1\.5 {
		padding-inline: calc(var(--spacing) * 1.5);
	}

	.px-1\.75 {
		padding-inline: calc(var(--spacing) * 1.75);
	}

	.px-2 {
		padding-inline: calc(var(--spacing) * 2);
	}

	.px-2\.5 {
		padding-inline: calc(var(--spacing) * 2.5);
	}

	.px-2\.25 {
		padding-inline: calc(var(--spacing) * 2.25);
	}

	.px-2\.75 {
		padding-inline: calc(var(--spacing) * 2.75);
	}

	.px-3 {
		padding-inline: calc(var(--spacing) * 3);
	}

	.px-3\.5 {
		padding-inline: calc(var(--spacing) * 3.5);
	}

	.px-3\.75 {
		padding-inline: calc(var(--spacing) * 3.75);
	}

	.px-4 {
		padding-inline: calc(var(--spacing) * 4);
	}

	.px-4\.75 {
		padding-inline: calc(var(--spacing) * 4.75);
	}

	.px-5 {
		padding-inline: calc(var(--spacing) * 5);
	}

	.px-5\.75 {
		padding-inline: calc(var(--spacing) * 5.75);
	}

	.px-6 {
		padding-inline: calc(var(--spacing) * 6);
	}

	.px-6\.5 {
		padding-inline: calc(var(--spacing) * 6.5);
	}

	.px-15 {
		padding-inline: calc(var(--spacing) * 15);
	}

	.\!py-2\.5 {
		padding-block: calc(var(--spacing) * 2.5) !important;
	}

	.py-0 {
		padding-block: calc(var(--spacing) * 0);
	}

	.py-0\.5 {
		padding-block: calc(var(--spacing) * 0.5);
	}

	.py-0\.75 {
		padding-block: calc(var(--spacing) * 0.75);
	}

	.py-1 {
		padding-block: calc(var(--spacing) * 1);
	}

	.py-1\.5 {
		padding-block: calc(var(--spacing) * 1.5);
	}

	.py-1\.25 {
		padding-block: calc(var(--spacing) * 1.25);
	}

	.py-2 {
		padding-block: calc(var(--spacing) * 2);
	}

	.py-2\.5 {
		padding-block: calc(var(--spacing) * 2.5);
	}

	.py-2\.75 {
		padding-block: calc(var(--spacing) * 2.75);
	}

	.py-3 {
		padding-block: calc(var(--spacing) * 3);
	}

	.py-3\.5 {
		padding-block: calc(var(--spacing) * 3.5);
	}

	.py-3\.25 {
		padding-block: calc(var(--spacing) * 3.25);
	}

	.py-3\.75 {
		padding-block: calc(var(--spacing) * 3.75);
	}

	.py-4 {
		padding-block: calc(var(--spacing) * 4);
	}

	.py-4\.5 {
		padding-block: calc(var(--spacing) * 4.5);
	}

	.py-5 {
		padding-block: calc(var(--spacing) * 5);
	}

	.py-6 {
		padding-block: calc(var(--spacing) * 6);
	}

	.py-6\.5 {
		padding-block: calc(var(--spacing) * 6.5);
	}

	.py-6\.25 {
		padding-block: calc(var(--spacing) * 6.25);
	}

	.py-6\.75 {
		padding-block: calc(var(--spacing) * 6.75);
	}

	.py-7 {
		padding-block: calc(var(--spacing) * 7);
	}

	.py-7\.5 {
		padding-block: calc(var(--spacing) * 7.5);
	}

	.py-10 {
		padding-block: calc(var(--spacing) * 10);
	}

	.py-12 {
		padding-block: calc(var(--spacing) * 12);
	}

	.py-12\.5 {
		padding-block: calc(var(--spacing) * 12.5);
	}

	.py-15 {
		padding-block: calc(var(--spacing) * 15);
	}

	.py-20 {
		padding-block: calc(var(--spacing) * 20);
	}

	.py-22 {
		padding-block: calc(var(--spacing) * 22);
	}

	.py-22\.5 {
		padding-block: calc(var(--spacing) * 22.5);
	}

	.py-25 {
		padding-block: calc(var(--spacing) * 25);
	}

	.py-50 {
		padding-block: calc(var(--spacing) * 50);
	}

	.ps-1 {
		padding-inline-start: calc(var(--spacing) * 1);
	}

	.ps-1\.25 {
		padding-inline-start: calc(var(--spacing) * 1.25);
	}

	.ps-2 {
		padding-inline-start: calc(var(--spacing) * 2);
	}

	.ps-3 {
		padding-inline-start: calc(var(--spacing) * 3);
	}

	.ps-3\.75 {
		padding-inline-start: calc(var(--spacing) * 3.75);
	}

	.ps-5 {
		padding-inline-start: calc(var(--spacing) * 5);
	}

	.ps-7 {
		padding-inline-start: calc(var(--spacing) * 7);
	}

	.ps-7\.5 {
		padding-inline-start: calc(var(--spacing) * 7.5);
	}

	.ps-8 {
		padding-inline-start: calc(var(--spacing) * 8);
	}

	.ps-8\.75 {
		padding-inline-start: calc(var(--spacing) * 8.75);
	}

	.ps-9 {
		padding-inline-start: calc(var(--spacing) * 9);
	}

	.ps-9\.5 {
		padding-inline-start: calc(var(--spacing) * 9.5);
	}

	.ps-10 {
		padding-inline-start: calc(var(--spacing) * 10);
	}

	.pe-2 {
		padding-inline-end: calc(var(--spacing) * 2);
	}

	.pe-2\.5 {
		padding-inline-end: calc(var(--spacing) * 2.5);
	}

	.pe-3 {
		padding-inline-end: calc(var(--spacing) * 3);
	}

	.pe-3\.5 {
		padding-inline-end: calc(var(--spacing) * 3.5);
	}

	.pe-8 {
		padding-inline-end: calc(var(--spacing) * 8);
	}

	.pe-8\.5 {
		padding-inline-end: calc(var(--spacing) * 8.5);
	}

	.pe-34 {
		padding-inline-end: calc(var(--spacing) * 34);
	}

	.pe-34\.5 {
		padding-inline-end: calc(var(--spacing) * 34.5);
	}

	.pt-0 {
		padding-top: calc(var(--spacing) * 0);
	}

	.pt-0\.5 {
		padding-top: calc(var(--spacing) * 0.5);
	}

	.pt-1 {
		padding-top: calc(var(--spacing) * 1);
	}

	.pt-1\.25 {
		padding-top: calc(var(--spacing) * 1.25);
	}

	.pt-2 {
		padding-top: calc(var(--spacing) * 2);
	}

	.pt-2\.5 {
		padding-top: calc(var(--spacing) * 2.5);
	}

	.pt-3 {
		padding-top: calc(var(--spacing) * 3);
	}

	.pt-3\.75 {
		padding-top: calc(var(--spacing) * 3.75);
	}

	.pt-5 {
		padding-top: calc(var(--spacing) * 5);
	}

	.pt-6 {
		padding-top: calc(var(--spacing) * 6);
	}

	.pt-6\.5 {
		padding-top: calc(var(--spacing) * 6.5);
	}

	.pt-6\.25 {
		padding-top: calc(var(--spacing) * 6.25);
	}

	.pt-7 {
		padding-top: calc(var(--spacing) * 7);
	}

	.pt-7\.5 {
		padding-top: calc(var(--spacing) * 7.5);
	}

	.pt-8 {
		padding-top: calc(var(--spacing) * 8);
	}

	.pt-8\.5 {
		padding-top: calc(var(--spacing) * 8.5);
	}

	.pt-10 {
		padding-top: calc(var(--spacing) * 10);
	}

	.pt-11 {
		padding-top: calc(var(--spacing) * 11);
	}

	.pt-11\.25 {
		padding-top: calc(var(--spacing) * 11.25);
	}

	.pt-12 {
		padding-top: calc(var(--spacing) * 12);
	}

	.pt-12\.5 {
		padding-top: calc(var(--spacing) * 12.5);
	}

	.pt-15 {
		padding-top: calc(var(--spacing) * 15);
	}

	.pt-20 {
		padding-top: calc(var(--spacing) * 20);
	}

	.pt-25 {
		padding-top: calc(var(--spacing) * 25);
	}

	.pt-27 {
		padding-top: calc(var(--spacing) * 27);
	}

	.pt-27\.25 {
		padding-top: calc(var(--spacing) * 27.25);
	}

	.pt-30 {
		padding-top: calc(var(--spacing) * 30);
	}

	.pt-32 {
		padding-top: calc(var(--spacing) * 32);
	}

	.pt-32\.5 {
		padding-top: calc(var(--spacing) * 32.5);
	}

	.pt-35 {
		padding-top: calc(var(--spacing) * 35);
	}

	.pt-39 {
		padding-top: calc(var(--spacing) * 39);
	}

	.pt-40 {
		padding-top: calc(var(--spacing) * 40);
	}

	.pt-48 {
		padding-top: calc(var(--spacing) * 48);
	}

	.\!pr-1\.25 {
		padding-right: calc(var(--spacing) * 1.25) !important;
	}

	.\!pr-7\.5 {
		padding-right: calc(var(--spacing) * 7.5) !important;
	}

	.pr-1 {
		padding-right: calc(var(--spacing) * 1);
	}

	.pr-1\.25 {
		padding-right: calc(var(--spacing) * 1.25);
	}

	.pr-5 {
		padding-right: calc(var(--spacing) * 5);
	}

	.pr-5\.75 {
		padding-right: calc(var(--spacing) * 5.75);
	}

	.pr-12 {
		padding-right: calc(var(--spacing) * 12);
	}

	.pr-12\.5 {
		padding-right: calc(var(--spacing) * 12.5);
	}

	.pr-13 {
		padding-right: calc(var(--spacing) * 13);
	}

	.pr-13\.75 {
		padding-right: calc(var(--spacing) * 13.75);
	}

	.pr-25 {
		padding-right: calc(var(--spacing) * 25);
	}

	.pb-0 {
		padding-bottom: calc(var(--spacing) * 0);
	}

	.pb-2 {
		padding-bottom: calc(var(--spacing) * 2);
	}

	.pb-2\.5 {
		padding-bottom: calc(var(--spacing) * 2.5);
	}

	.pb-3 {
		padding-bottom: calc(var(--spacing) * 3);
	}

	.pb-3\.5 {
		padding-bottom: calc(var(--spacing) * 3.5);
	}

	.pb-3\.75 {
		padding-bottom: calc(var(--spacing) * 3.75);
	}

	.pb-5 {
		padding-bottom: calc(var(--spacing) * 5);
	}

	.pb-6 {
		padding-bottom: calc(var(--spacing) * 6);
	}

	.pb-6\.25 {
		padding-bottom: calc(var(--spacing) * 6.25);
	}

	.pb-7 {
		padding-bottom: calc(var(--spacing) * 7);
	}

	.pb-7\.5 {
		padding-bottom: calc(var(--spacing) * 7.5);
	}

	.pb-10 {
		padding-bottom: calc(var(--spacing) * 10);
	}

	.pb-12 {
		padding-bottom: calc(var(--spacing) * 12);
	}

	.pb-12\.5 {
		padding-bottom: calc(var(--spacing) * 12.5);
	}

	.pb-15 {
		padding-bottom: calc(var(--spacing) * 15);
	}

	.pb-15\.5 {
		padding-bottom: calc(var(--spacing) * 15.5);
	}

	.pb-25 {
		padding-bottom: calc(var(--spacing) * 25);
	}

	.pl-1 {
		padding-left: calc(var(--spacing) * 1);
	}

	.pl-1\.25 {
		padding-left: calc(var(--spacing) * 1.25);
	}

	.pl-2 {
		padding-left: calc(var(--spacing) * 2);
	}

	.pl-2\.5 {
		padding-left: calc(var(--spacing) * 2.5);
	}

	.pl-5 {
		padding-left: calc(var(--spacing) * 5);
	}

	.pl-6 {
		padding-left: calc(var(--spacing) * 6);
	}

	.pl-6\.5 {
		padding-left: calc(var(--spacing) * 6.5);
	}

	.pl-6\.25 {
		padding-left: calc(var(--spacing) * 6.25);
	}

	.pl-7 {
		padding-left: calc(var(--spacing) * 7);
	}

	.pl-7\.5 {
		padding-left: calc(var(--spacing) * 7.5);
	}

	.pl-25 {
		padding-left: calc(var(--spacing) * 25);
	}

	.text-center {
		text-align: center;
	}

	.text-left {
		text-align: left;
	}

	.text-right {
		text-align: right;
	}

	.text-start {
		text-align: start;
	}

	.align-middle {
		vertical-align: middle;
	}

	.font-base {
		font-family: var(--font-base);
	}

	.font-family {
		font-family: var(--font-family);
	}

	.text-2sm {
		font-size: var(--text-2sm);
		line-height: var(--tw-leading, var(--text-2sm--line-height));
	}

	.text-2xl {
		font-size: var(--text-2xl);
		line-height: var(--tw-leading, var(--text-2xl--line-height));
	}

	.text-2xl\/10 {
		font-size: var(--text-2xl);
		line-height: calc(var(--spacing) * 10);
	}

	.text-2xs {
		font-size: var(--text-2xs);
		line-height: var(--tw-leading, var(--text-2xs--line-height));
	}

	.text-2xxl {
		font-size: var(--text-2xxl);
		line-height: var(--tw-leading, var(--text-2xxl--line-height));
	}

	.text-2xxl\/35 {
		font-size: var(--text-2xxl);
		line-height: calc(var(--spacing) * 35);
	}

	.text-3xl {
		font-size: var(--text-3xl);
		line-height: var(--tw-leading, var(--text-3xl--line-height));
	}

	.text-4xl {
		font-size: var(--text-4xl);
		line-height: var(--tw-leading, var(--text-4xl--line-height));
	}

	.sm\:text-\[25px\]\/25 {
		@media (width >=576px) {
			font-size: 25px;
			line-height: calc(var(--spacing) * 40)
				/* 10rem = 160px */
			;
		}
	}

	.text-4xxl {
		font-size: var(--text-4xxl);
		line-height: var(--tw-leading, var(--text-4xxl--line-height));
	}

	.text-4xxxl {
		font-size: var(--text-4xxxl);
		line-height: var(--tw-leading, var(--text-4xxxl--line-height));
	}

	.text-2xl\/15 {
		font-size: var(--text-2xl)
			/* 60px */
		;
		line-height: calc(var(--spacing) * 15)
			/* 3.75rem = 60px */
		;
	}

	.text-5xl {
		font-size: var(--text-5xl);
		line-height: var(--tw-leading, var(--text-5xl--line-height));
	}

	.text-5xl\/\[1\] {
		font-size: var(--text-5xl);
		line-height: 1;
	}

	.text-6xl {
		font-size: var(--text-6xl);
		line-height: var(--tw-leading, var(--text-6xl--line-height));
	}

	.text-7xxl {
		font-size: var(--text-7xxl);
		line-height: var(--tw-leading, var(--text-7xxl--line-height));
	}

	.text-7xxl\/\[1\] {
		font-size: var(--text-7xxl);
		line-height: 1;
	}

	.text-7xxxl {
		font-size: var(--text-7xxxl);
		line-height: var(--tw-leading, var(--text-7xxxl--line-height));
	}

	.text-7xxxl\/\[1\] {
		font-size: var(--text-7xxxl);
		line-height: 1;
	}

	.text-8xl {
		font-size: var(--text-8xl);
		line-height: var(--tw-leading, var(--text-8xl--line-height));
	}

	.text-\[11px\]\/3\.25 {
		font-size: 11px;
		line-height: calc(var(--spacing) * 3.25);
	}

	.text-\[17px\]\/6 {
		font-size: 17px;
		line-height: calc(var(--spacing) * 6);
	}

	.text-base {
		font-size: var(--text-base);
		line-height: var(--tw-leading, var(--text-base--line-height));
	}

	.text-lg {
		font-size: var(--text-lg);
		line-height: var(--tw-leading, var(--text-lg--line-height));
	}

	.text-lg\/6 {
		font-size: var(--text-lg);
		line-height: calc(var(--spacing) * 6);
	}

	.text-lg\/7\.5 {
		font-size: var(--text-lg);
		line-height: calc(var(--spacing) * 7.5);
	}

	.text-lg\/8 {
		font-size: var(--text-lg);
		line-height: calc(var(--spacing) * 8);
	}

	.text-lg\/24 {
		font-size: var(--text-lg);
		line-height: calc(var(--spacing) * 24);
	}

	.text-sm {
		font-size: var(--text-sm);
		line-height: var(--tw-leading, var(--text-sm--line-height));
	}

	.text-xl {
		font-size: var(--text-xl);
		line-height: var(--tw-leading, var(--text-xl--line-height));
	}

	.text-xl\/10\.5 {
		font-size: var(--text-xl);
		line-height: calc(var(--spacing) * 10.5);
	}

	.text-xs {
		font-size: var(--text-xs);
		line-height: var(--tw-leading, var(--text-xs--line-height));
	}

	.text-xs\/\[1\] {
		font-size: var(--text-xs);
		line-height: 1;
	}

	.text-2xxxl {
		font-size: var(--text-2xxxl);
	}

	.text-\[11px\] {
		font-size: 11px;
	}

	.text-\[19px\] {
		font-size: 19px;
	}

	.text-\[25px\] {
		font-size: 25px;
	}

	.text-\[26px\] {
		font-size: 26px;
	}

	.text-\[45px\] {
		font-size: 45px;
	}

	.\!leading-7 {
		--tw-leading: calc(var(--spacing) * 7) !important;
		line-height: calc(var(--spacing) * 7) !important;
	}

	.\!leading-8\.5 {
		--tw-leading: calc(var(--spacing) * 8.5) !important;
		line-height: calc(var(--spacing) * 8.5) !important;
	}

	.leading-5 {
		--tw-leading: calc(var(--spacing) * 5);
		line-height: calc(var(--spacing) * 5);
	}

	.leading-5\.5 {
		--tw-leading: calc(var(--spacing) * 5.5);
		line-height: calc(var(--spacing) * 5.5);
	}

	.leading-5\.25 {
		--tw-leading: calc(var(--spacing) * 5.25);
		line-height: calc(var(--spacing) * 5.25);
	}

	.leading-6 {
		--tw-leading: calc(var(--spacing) * 6);
		line-height: calc(var(--spacing) * 6);
	}

	.leading-6\.75 {
		--tw-leading: calc(var(--spacing) * 6.75);
		line-height: calc(var(--spacing) * 6.75);
	}

	.leading-7 {
		--tw-leading: calc(var(--spacing) * 7);
		line-height: calc(var(--spacing) * 7);
	}

	.leading-7\.5 {
		--tw-leading: calc(var(--spacing) * 7.5);
		line-height: calc(var(--spacing) * 7.5);
	}

	.leading-8 {
		--tw-leading: calc(var(--spacing) * 8);
		line-height: calc(var(--spacing) * 8);
	}

	.leading-8\.5 {
		--tw-leading: calc(var(--spacing) * 8.5);
		line-height: calc(var(--spacing) * 8.5);
	}

	.leading-9 {
		--tw-leading: calc(var(--spacing) * 9);
		line-height: calc(var(--spacing) * 9);
	}

	.leading-9\.5 {
		--tw-leading: calc(var(--spacing) * 9.5);
		line-height: calc(var(--spacing) * 9.5);
	}

	.leading-10 {
		--tw-leading: calc(var(--spacing) * 10);
		line-height: calc(var(--spacing) * 10);
	}

	.leading-12 {
		--tw-leading: calc(var(--spacing) * 12);
		line-height: calc(var(--spacing) * 12);
	}

	.leading-15 {
		--tw-leading: calc(var(--spacing) * 15);
		line-height: calc(var(--spacing) * 15);
	}

	.leading-\[1\.4\] {
		--tw-leading: 1.4;
		line-height: 1.4;
	}

	.leading-\[2\] {
		--tw-leading: 2;
		line-height: 2;
	}

	.leading-\[27px\] {
		--tw-leading: 27px;
		line-height: 27px;
	}

	.leading-none {
		--tw-leading: 1;
		line-height: 1;
	}

	.leading-normal {
		--tw-leading: var(--leading-normal);
		line-height: var(--leading-normal);
	}

	.\!font-bold {
		--tw-font-weight: var(--font-weight-bold) !important;
		font-weight: var(--font-weight-bold) !important;
	}

	.font-bold {
		--tw-font-weight: var(--font-weight-bold);
		font-weight: var(--font-weight-bold);
	}

	.font-bold\! {
		--tw-font-weight: var(--font-weight-bold) !important;
		font-weight: var(--font-weight-bold) !important;
	}

	.font-extrabold {
		--tw-font-weight: var(--font-weight-extrabold);
		font-weight: var(--font-weight-extrabold);
	}

	.font-light {
		--tw-font-weight: var(--font-weight-light);
		font-weight: var(--font-weight-light);
	}

	.font-medium {
		--tw-font-weight: var(--font-weight-medium);
		font-weight: var(--font-weight-medium);
	}

	.font-normal {
		--tw-font-weight: var(--font-weight-normal);
		font-weight: var(--font-weight-normal);
	}

	.font-semibold {
		--tw-font-weight: var(--font-weight-semibold);
		font-weight: var(--font-weight-semibold);
	}

	.text-ellipsis {
		text-overflow: ellipsis;
	}

	.whitespace-nowrap {
		white-space: nowrap;
	}

	.\!text-bodytext {
		color: var(--color-bodytext) !important;
	}

	.\!text-secondary {
		color: var(--color-secondary) !important;
	}

	.\!text-white {
		color: var(--color-white) !important;
	}

	.text-\[\#08A36B\] {
		color: #08A36B;
	}

	.text-\[\#222\] {
		color: #222;
	}

	.text-\[\#666666\] {
		color: #666666;
	}

	.text-\[\#979797\] {
		color: #979797;
	}

	.text-black {
		color: var(--color-black);
	}

	.text-black\/50 {
		color: color-mix(in srgb, #000 50%, transparent);

		@supports (color: color-mix(in lab, red, red)) {
			color: color-mix(in oklab, var(--color-black) 50%, transparent);
		}
	}

	.text-black\/60 {
		color: color-mix(in srgb, #000 60%, transparent);

		@supports (color: color-mix(in lab, red, red)) {
			color: color-mix(in oklab, var(--color-black) 60%, transparent);
		}
	}

	.text-black\/75 {
		color: color-mix(in srgb, #000 75%, transparent);

		@supports (color: color-mix(in lab, red, red)) {
			color: color-mix(in oklab, var(--color-black) 75%, transparent);
		}
	}

	.text-bodyfg {
		color: var(--color-bodyfg);
	}

	.text-bodytext {
		color: var(--color-bodytext);
	}

	.text-dark {
		color: var(--color-dark);
	}

	.text-green {
		color: var(--color-green);
	}

	.text-grey {
		color: var(--color-grey);
	}

	.text-lightgreen {
		color: var(--color-lightpurple);
	}

	.text-lightgrey {
		color: var(--color-lightgrey);
	}

	.text-primary {
		color: var(--color-primary);
	}

	.text-primary\/80 {
		color: var(--color-primary);

		@supports (color: color-mix(in lab, red, red)) {
			color: color-mix(in oklab, var(--color-primary) 80%, transparent);
		}
	}

	.text-secondary {
		color: var(--color-secondary);
	}

	.text-secondary\/50 {
		color: var(--color-secondary);

		@supports (color: color-mix(in lab, red, red)) {
			color: color-mix(in oklab, var(--color-secondary) 50%, transparent);
		}
	}

	.text-secondary\/80 {
		color: var(--color-secondary);

		@supports (color: color-mix(in lab, red, red)) {
			color: color-mix(in oklab, var(--color-secondary) 80%, transparent);
		}
	}

	.text-textgray {
		color: var(--color-textgray);
	}

	.text-white {
		color: var(--color-white);
	}

	.text-white\/30 {
		color: color-mix(in srgb, #fff 30%, transparent);

		@supports (color: color-mix(in lab, red, red)) {
			color: color-mix(in oklab, var(--color-white) 30%, transparent);
		}
	}

	.text-white\/40 {
		color: color-mix(in srgb, #fff 40%, transparent);

		@supports (color: color-mix(in lab, red, red)) {
			color: color-mix(in oklab, var(--color-white) 40%, transparent);
		}
	}

	.text-white\/60 {
		color: color-mix(in srgb, #fff 60%, transparent);

		@supports (color: color-mix(in lab, red, red)) {
			color: color-mix(in oklab, var(--color-white) 60%, transparent);
		}
	}

	.text-white\/80 {
		color: color-mix(in srgb, #fff 80%, transparent);

		@supports (color: color-mix(in lab, red, red)) {
			color: color-mix(in oklab, var(--color-white) 80%, transparent);
		}
	}

	.text-white\/90 {
		color: color-mix(in srgb, #fff 90%, transparent);

		@supports (color: color-mix(in lab, red, red)) {
			color: color-mix(in oklab, var(--color-white) 90%, transparent);
		}
	}

	.text-yellow {
		color: var(--color-yellow);
	}

	.capitalize {
		text-transform: capitalize;
	}

	.uppercase {
		text-transform: uppercase;
	}

	.italic {
		font-style: italic;
	}

	.not-italic {
		font-style: normal;
	}

	.underline {
		text-decoration-line: underline;
	}

	.\!opacity-0 {
		opacity: 0% !important;
	}

	.\!opacity-100 {
		opacity: 100% !important;
	}

	.opacity-0 {
		opacity: 0%;
	}

	.opacity-30 {
		opacity: 30%;
	}

	.opacity-50 {
		opacity: 50%;
	}

	.opacity-60 {
		opacity: 60%;
	}

	.opacity-100 {
		opacity: 100%;
	}

	.opacity-\[\.5\] {
		opacity: .5;
	}

	.bg-blend-multiply {
		background-blend-mode: multiply;
	}

	.\!shadow-none {
		--tw-shadow: 0 0 #0000 !important;
		box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;
	}

	.shadow {
		--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
		box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
	}

	.shadow\! {
		--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)) !important;
		box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;
	}

	.shadow-\[0_0_0_3px_rgba\(27\,76\,64\,\.3\)\] {
		--tw-shadow: 0 0 0 3px var(--tw-shadow-color, rgba(27, 76, 64, .3));
		box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
	}

	.shadow-\[0_4px_4px_rgba\(0\,0\,0\,2\%\)\] {
		--tw-shadow: 0 4px 4px var(--tw-shadow-color, rgba(0, 0, 0, 2%));
		box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
	}

	.shadow-\[0px_0px_30px_var\(--primary\)\] {
		--tw-shadow: 0px 0px 30px var(--tw-shadow-color, var(--primary));
		box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
	}

	.shadow-\[0px_5px_10px_rgba\(27\,76\,64\,0\.05\)\] {
		--tw-shadow: 0px 5px 10px var(--tw-shadow-color, rgba(27, 76, 64, 0.05));
		box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
	}

	.shadow-\[inset_0px_2px_2px_rgba\(255\,255\,255\,0\.1\)\] {
		--tw-shadow: inset 0px 2px 2px var(--tw-shadow-color, rgba(255, 255, 255, 0.1));
		box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
	}

	.shadow-md {
		--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
		box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
	}

	.ring {
		--tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
		box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
	}

	.outline {
		outline-style: var(--tw-outline-style);
		outline-width: 1px;
	}

	.outline-0 {
		outline-style: var(--tw-outline-style);
		outline-width: 0px;
	}

	.outline-\[3px\] {
		outline-style: var(--tw-outline-style);
		outline-width: 3px;
	}

	.outline-lightgreen {
		outline-color: var(--color-lightpurple);
	}

	.blur {
		--tw-blur: blur(8px);
		filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );
	}

	.invert {
		--tw-invert: invert(100%);
		filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );
	}

	.filter {
		filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );
	}

	.filter\! {
		filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, ) !important;
	}

	.backdrop-blur-\[10px\] {
		--tw-backdrop-blur: blur(10px);
		-webkit-backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
		backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
	}

	.backdrop-blur-\[20px\] {
		--tw-backdrop-blur: blur(20px);
		-webkit-backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
		backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
	}

	.backdrop-blur-\[142px\] {
		--tw-backdrop-blur: blur(142px);
		-webkit-backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
		backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
	}

	.backdrop-filter {
		-webkit-backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
		backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
	}

	.transition {
		transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
		transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
		transition-duration: var(--tw-duration, var(--default-transition-duration));
	}

	.transition-\[width\,height\] {
		transition-property: width, height;
		transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
		transition-duration: var(--tw-duration, var(--default-transition-duration));
	}

	.duration-100 {
		--tw-duration: 100ms;
		transition-duration: 100ms;
	}

	.duration-200 {
		--tw-duration: 200ms;
		transition-duration: 200ms;
	}

	.duration-300 {
		--tw-duration: 300ms;
		transition-duration: 300ms;
	}

	.duration-400 {
		--tw-duration: 400ms;
		transition-duration: 400ms;
	}

	.duration-500 {
		--tw-duration: 500ms;
		transition-duration: 500ms;
	}

	.duration-1000 {
		--tw-duration: 1000ms;
		transition-duration: 1000ms;
	}

	.duration-\[all_400ms_cubic-bezier\(0\.39\,_0\.58\,_0\.57\,_1\)_0s\] {
		--tw-duration: all 400ms cubic-bezier(0.39, 0.58, 0.57, 1) 0s;
		transition-duration: all 400ms cubic-bezier(0.39, 0.58, 0.57, 1) 0s;
	}

	.ease-in {
		--tw-ease: var(--ease-in);
		transition-timing-function: var(--ease-in);
	}

	.ease-in-out {
		--tw-ease: var(--ease-in-out);
		transition-timing-function: var(--ease-in-out);
	}

	.ease-out {
		--tw-ease: var(--ease-out);
		transition-timing-function: var(--ease-out);
	}

	.content-\[\'\'\] {
		--tw-content: '';
		content: var(--tw-content);
	}

	.outline-none {
		--tw-outline-style: none;
		outline-style: none;
	}

	.select-none {
		-webkit-user-select: none;
		user-select: none;
	}

	.\[animation-direction\:reverse\] {
		animation-direction: reverse;
	}

	.\[clip-path\:inset\(0_0_0_0\)\] {
		clip-path: inset(0 0 0 0);
	}

	.\[counter-reset\:my-counter\] {
		counter-reset: my-counter;
	}

	.\[hostname\:port\] {
		hostname: port;
	}

	.\[writing-mode\:vertical-rl\] {
		writing-mode: vertical-rl;
	}

	.backface-hidden {
		backface-visibility: hidden;
	}

	.group-hover\:top-2\.5 {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				top: calc(var(--spacing) * 2.5);
			}
		}
	}

	.group-hover\:top-6\.25 {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				top: calc(var(--spacing) * 6.25);
			}
		}
	}

	.group-hover\:right-2\.5 {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				right: calc(var(--spacing) * 2.5);
			}
		}
	}

	.group-hover\:right-6\.25 {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				right: calc(var(--spacing) * 6.25);
			}
		}
	}

	.group-hover\:bottom-5\.75 {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				bottom: calc(var(--spacing) * 5.75);
			}
		}
	}

	.group-hover\:bottom-6\.25 {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				bottom: calc(var(--spacing) * 6.25);
			}
		}
	}

	.group-hover\:bottom-6\.75 {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				bottom: calc(var(--spacing) * 6.75);
			}
		}
	}

	.group-hover\:left-6\.25 {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				left: calc(var(--spacing) * 6.25);
			}
		}
	}

	.group-hover\:translate-x-0 {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				--tw-translate-x: calc(var(--spacing) * 0);
				translate: var(--tw-translate-x) var(--tw-translate-y);
			}
		}
	}

	.group-hover\:translate-x-0\.75 {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				--tw-translate-x: calc(var(--spacing) * 0.75);
				translate: var(--tw-translate-x) var(--tw-translate-y);
			}
		}
	}

	.group-hover\:translate-x-3 {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				--tw-translate-x: calc(var(--spacing) * 3);
				translate: var(--tw-translate-x) var(--tw-translate-y);
			}
		}
	}

	.group-hover\:translate-x-6\.5 {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				--tw-translate-x: calc(var(--spacing) * 6.5);
				translate: var(--tw-translate-x) var(--tw-translate-y);
			}
		}
	}

	.group-hover\:translate-x-7\.5 {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				--tw-translate-x: calc(var(--spacing) * 7.5);
				translate: var(--tw-translate-x) var(--tw-translate-y);
			}
		}
	}

	.group-hover\:-translate-y-33 {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				--tw-translate-y: calc(var(--spacing) * -33);
				translate: var(--tw-translate-x) var(--tw-translate-y);
			}
		}
	}

	.group-hover\:translate-y-0 {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				--tw-translate-y: calc(var(--spacing) * 0);
				translate: var(--tw-translate-x) var(--tw-translate-y);
			}
		}
	}

	.group-hover\:scale-110 {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				--tw-scale-x: 110%;
				--tw-scale-y: 110%;
				--tw-scale-z: 110%;
				scale: var(--tw-scale-x) var(--tw-scale-y);
			}
		}
	}

	.group-hover\:scale-\[1\.1\] {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				scale: 1.1;
			}
		}
	}

	.group-hover\:scale-\[1\.03\] {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				scale: 1.03;
			}
		}
	}

	.group-hover\:scale-\[1\] {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				scale: 1;
			}
		}
	}

	.group-hover\:rotate-0 {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				rotate: 0deg;
			}
		}
	}

	.group-hover\:rotate-\[2deg\] {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				rotate: 2deg;
			}
		}
	}

	.group-hover\:animate-toLeftFromRight {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				animation: var(--animate-toLeftFromRight);
			}
		}
	}

	.group-hover\:animate-toRightFromLeft {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				animation: var(--animate-toRightFromLeft);
			}
		}
	}

	.group-hover\:animate-toTopFromBottom {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				animation: var(--animate-toTopFromBottom);
			}
		}
	}

	.group-hover\:\!bg-primary {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				background-color: var(--color-primary) !important;
			}
		}
	}

	.group-hover\:bg-primary {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				background-color: var(--color-primary);
			}
		}
	}

	.group-hover\:bg-secondary {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				background-color: var(--color-secondary);
			}
		}
	}

	.group-hover\:bg-white {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				background-color: var(--color-white);
			}
		}
	}

	.group-hover\:bg-white\/10 {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				background-color: color-mix(in srgb, #fff 10%, transparent);

				@supports (color: color-mix(in lab, red, red)) {
					background-color: color-mix(in oklab, var(--color-white) 10%, transparent);
				}
			}
		}
	}

	.group-hover\:bg-linear-\[var\(--secondary-gradient\)\] {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				--tw-gradient-position: var(--secondary-gradient);
				background-image: linear-gradient(var(--tw-gradient-stops, var(--secondary-gradient)));
			}
		}
	}

	.group-hover\:fill-secondary {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				fill: var(--color-secondary);
			}
		}
	}

	.group-hover\:stroke-primary {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				stroke: var(--color-primary);
			}
		}
	}

	.group-hover\:stroke-secondary {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				stroke: var(--color-secondary);
			}
		}
	}

	.group-hover\:text-black\/70 {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				color: color-mix(in srgb, #000 70%, transparent);

				@supports (color: color-mix(in lab, red, red)) {
					color: color-mix(in oklab, var(--color-black) 70%, transparent);
				}
			}
		}
	}

	.group-hover\:text-bodytext {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				color: var(--color-bodytext);
			}
		}
	}

	.group-hover\:text-primary {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				color: var(--color-primary);
			}
		}
	}

	.group-hover\:text-secondary {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				color: var(--color-secondary);
			}
		}
	}

	.group-hover\:text-white {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				color: var(--color-white);
			}
		}
	}

	.group-hover\:\!opacity-100 {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				opacity: 100% !important;
			}
		}
	}

	.group-hover\:opacity-100 {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				opacity: 100%;
			}
		}
	}

	.group-hover\:backdrop-blur-\[10px\] {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				--tw-backdrop-blur: blur(10px);
				-webkit-backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
				backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
			}
		}
	}

	.group-hover\:\[clip-path\:inset\(100\%_0_100\%_0\)\] {
		&:is(:where(.group):hover *) {
			@media (hover: hover) {
				clip-path: inset(100% 0 100% 0);
			}
		}
	}

	.group-hover\/second\:animate-toTopFromBottom {
		&:is(:where(.group\/second):hover *) {
			@media (hover: hover) {
				animation: var(--animate-toTopFromBottom);
			}
		}
	}

	.selection\:bg-primary {
		& *::selection {
			background-color: var(--color-primary);
		}

		&::selection {
			background-color: var(--color-primary);
		}
	}

	.selection\:text-white {
		& *::selection {
			color: var(--color-white);
		}

		&::selection {
			color: var(--color-white);
		}
	}

	.placeholder\:text-bodytext {
		&::placeholder {
			color: var(--color-bodytext);
		}
	}

	.placeholder\:text-lightgrey {
		&::placeholder {
			color: var(--color-lightgrey);
		}
	}

	.placeholder\:text-secondary\/50 {
		&::placeholder {
			color: var(--color-secondary);

			@supports (color: color-mix(in lab, red, red)) {
				color: color-mix(in oklab, var(--color-secondary) 50%, transparent);
			}
		}
	}

	.before\:absolute {
		&::before {
			content: var(--tw-content);
			position: absolute;
		}
	}

	.before\:inset-0 {
		&::before {
			content: var(--tw-content);
			inset: calc(var(--spacing) * 0);
		}
	}

	.before\:top-0 {
		&::before {
			content: var(--tw-content);
			top: calc(var(--spacing) * 0);
		}
	}

	.before\:top-1\/2 {
		&::before {
			content: var(--tw-content);
			top: calc(1/2 * 100%);
		}
	}

	.before\:top-3 {
		&::before {
			content: var(--tw-content);
			top: calc(var(--spacing) * 3);
		}
	}

	.before\:right-1 {
		&::before {
			content: var(--tw-content);
			right: calc(var(--spacing) * 1);
		}
	}

	.before\:right-3 {
		&::before {
			content: var(--tw-content);
			right: calc(var(--spacing) * 3);
		}
	}

	.before\:left-0 {
		&::before {
			content: var(--tw-content);
			left: calc(var(--spacing) * 0);
		}
	}

	.before\:left-3\.5 {
		&::before {
			content: var(--tw-content);
			left: calc(var(--spacing) * 3.5);
		}
	}

	.before\:-z-1 {
		&::before {
			content: var(--tw-content);
			z-index: calc(var(--z-index-1) * -1);
		}
	}

	.before\:z-1 {
		&::before {
			content: var(--tw-content);
			z-index: var(--z-index-1);
		}
	}

	.before\:block {
		&::before {
			content: var(--tw-content);
			display: block;
		}
	}

	.before\:hidden {
		&::before {
			content: var(--tw-content);
			display: none;
		}
	}

	.before\:inline-block {
		&::before {
			content: var(--tw-content);
			display: inline-block;
		}
	}

	.before\:size-1\.5 {
		&::before {
			content: var(--tw-content);
			width: calc(var(--spacing) * 1.5);
			height: calc(var(--spacing) * 1.5);
		}
	}

	.before\:size-5 {
		&::before {
			content: var(--tw-content);
			width: calc(var(--spacing) * 5);
			height: calc(var(--spacing) * 5);
		}
	}

	.before\:size-6 {
		&::before {
			content: var(--tw-content);
			width: calc(var(--spacing) * 6);
			height: calc(var(--spacing) * 6);
		}
	}

	.before\:size-full {
		&::before {
			content: var(--tw-content);
			width: 100%;
			height: 100%;
		}
	}

	.before\:h-full {
		&::before {
			content: var(--tw-content);
			height: 100%;
		}
	}

	.before\:h-px {
		&::before {
			content: var(--tw-content);
			height: 1px;
		}
	}

	.before\:w-2\.5 {
		&::before {
			content: var(--tw-content);
			width: calc(var(--spacing) * 2.5);
		}
	}

	.before\:w-\[44\%\] {
		&::before {
			content: var(--tw-content);
			width: 44%;
		}
	}

	.before\:w-\[48\%\] {
		&::before {
			content: var(--tw-content);
			width: 48%;
		}
	}

	.before\:w-full {
		&::before {
			content: var(--tw-content);
			width: 100%;
		}
	}

	.before\:-translate-y-1\/2 {
		&::before {
			content: var(--tw-content);
			--tw-translate-y: calc(calc(1/2 * 100%) * -1);
			translate: var(--tw-translate-x) var(--tw-translate-y);
		}
	}

	.before\:scale-\[0\.7\] {
		&::before {
			content: var(--tw-content);
			scale: 0.7;
		}
	}

	.before\:rotate-\[-90deg\] {
		&::before {
			content: var(--tw-content);
			rotate: -90deg;
		}
	}

	.before\:rounded-full {
		&::before {
			content: var(--tw-content);
			border-radius: calc(infinity * 1px);
		}
	}

	.before\:rounded-ee-2xl {
		&::before {
			content: var(--tw-content);
			border-end-end-radius: var(--radius-2xl);
		}
	}

	.before\:bg-black\/10 {
		&::before {
			content: var(--tw-content);
			background-color: color-mix(in srgb, #000 10%, transparent);

			@supports (color: color-mix(in lab, red, red)) {
				background-color: color-mix(in oklab, var(--color-black) 10%, transparent);
			}
		}
	}

	.before\:bg-bodytext {
		&::before {
			content: var(--tw-content);
			background-color: var(--color-bodytext);
		}
	}

	.before\:bg-primary {
		&::before {
			content: var(--tw-content);
			background-color: var(--color-primarylight);
		}
	}

	.before\:bg-primarylight {
		&::before {
			content: var(--tw-content);
			background-color: var(--color-primarylight);
		}
	}

	.before\:bg-secondary {
		&::before {
			content: var(--tw-content);
			background-color: var(--color-secondary);
		}
	}

	.before\:bg-white\/5 {
		&::before {
			content: var(--tw-content);
			background-color: color-mix(in srgb, #fff 5%, transparent);

			@supports (color: color-mix(in lab, red, red)) {
				background-color: color-mix(in oklab, var(--color-white) 5%, transparent);
			}
		}
	}

	.before\:bg-\[url\(\'\.\.\/images\/background\/bg2\.png\'\)\] {
		&::before {
			content: var(--tw-content);
			background-image: url('../images/background/bg2.png');
		}
	}

	.before\:bg-cover {
		&::before {
			content: var(--tw-content);
			background-size: cover;
		}
	}

	.before\:bg-center {
		&::before {
			content: var(--tw-content);
			background-position: center;
		}
	}

	.before\:bg-no-repeat {
		&::before {
			content: var(--tw-content);
			background-repeat: no-repeat;
		}
	}

	.before\:text-center {
		&::before {
			content: var(--tw-content);
			text-align: center;
		}
	}

	.before\:font-\[\'Font_Awesome_6_Free\'\] {
		&::before {
			content: var(--tw-content);
			font-family: 'Font Awesome 6 Free';
		}
	}

	.before\:font-\[\'fontawesome\'\] {
		&::before {
			content: var(--tw-content);
			font-family: 'fontawesome';
		}
	}

	.before\:text-sm {
		&::before {
			content: var(--tw-content);
			font-size: var(--text-sm);
			line-height: var(--tw-leading, var(--text-sm--line-height));
		}
	}

	.before\:text-sm\/2\.5 {
		&::before {
			content: var(--tw-content);
			font-size: var(--text-sm);
			line-height: calc(var(--spacing) * 2.5);
		}
	}

	.before\:text-sm\/4\.5 {
		&::before {
			content: var(--tw-content);
			font-size: var(--text-sm);
			line-height: calc(var(--spacing) * 4.5);
		}
	}

	.before\:text-sm\/5 {
		&::before {
			content: var(--tw-content);
			font-size: var(--text-sm);
			line-height: calc(var(--spacing) * 5);
		}
	}

	.before\:text-sm\/7\.5 {
		&::before {
			content: var(--tw-content);
			font-size: var(--text-sm);
			line-height: calc(var(--spacing) * 7.5);
		}
	}

	.before\:text-xs {
		&::before {
			content: var(--tw-content);
			font-size: var(--text-xs);
			line-height: var(--tw-leading, var(--text-xs--line-height));
		}
	}

	.before\:leading-5 {
		&::before {
			content: var(--tw-content);
			--tw-leading: calc(var(--spacing) * 5);
			line-height: calc(var(--spacing) * 5);
		}
	}

	.before\:leading-6 {
		&::before {
			content: var(--tw-content);
			--tw-leading: calc(var(--spacing) * 6);
			line-height: calc(var(--spacing) * 6);
		}
	}

	.before\:font-black {
		&::before {
			content: var(--tw-content);
			--tw-font-weight: var(--font-weight-black);
			font-weight: var(--font-weight-black);
		}
	}

	.before\:text-lightgreen {
		&::before {
			content: var(--tw-content);
			color: var(--color-lightpurple);
		}
	}

	.before\:text-secondary {
		&::before {
			content: var(--tw-content);
			color: var(--color-secondary);
		}
	}

	.before\:text-white {
		&::before {
			content: var(--tw-content);
			color: var(--color-white);
		}
	}

	.before\:duration-500 {
		&::before {
			content: var(--tw-content);
			--tw-duration: 500ms;
			transition-duration: 500ms;
		}
	}

	.before\:content-\[\'\'\] {
		&::before {
			--tw-content: '';
			content: var(--tw-content);
		}
	}

	.before\:content-\[\'\/\'\] {
		&::before {
			--tw-content: '/';
			content: var(--tw-content);
		}
	}

	.before\:content-\[\'\\f00c\'\] {
		&::before {
			--tw-content: '\f00c';
			content: var(--tw-content);
		}
	}

	.before\:content-\[\'\\f107\'\] {
		&::before {
			--tw-content: '\f107';
			content: var(--tw-content);
		}
	}

	.after\:pointer-events-none {
		&::after {
			content: var(--tw-content);
			pointer-events: none;
		}
	}

	.after\:absolute {
		&::after {
			content: var(--tw-content);
			position: absolute;
		}
	}

	.after\:inset-0 {
		&::after {
			content: var(--tw-content);
			inset: calc(var(--spacing) * 0);
		}
	}

	.after\:top-0 {
		&::after {
			content: var(--tw-content);
			top: calc(var(--spacing) * 0);
		}
	}

	.after\:top-1\/2 {
		&::after {
			content: var(--tw-content);
			top: calc(1/2 * 100%);
		}
	}

	.after\:top-2 {
		&::after {
			content: var(--tw-content);
			top: calc(var(--spacing) * 2);
		}
	}

	.after\:right-0 {
		&::after {
			content: var(--tw-content);
			right: calc(var(--spacing) * 0);
		}
	}

	.after\:bottom-0 {
		&::after {
			content: var(--tw-content);
			bottom: calc(var(--spacing) * 0);
		}
	}

	.after\:bottom-auto {
		&::after {
			content: var(--tw-content);
			bottom: auto;
		}
	}

	.after\:-left-0\.5 {
		&::after {
			content: var(--tw-content);
			left: calc(var(--spacing) * -0.5);
		}
	}

	.after\:left-0 {
		&::after {
			content: var(--tw-content);
			left: calc(var(--spacing) * 0);
		}
	}

	.after\:left-1\/2 {
		&::after {
			content: var(--tw-content);
			left: calc(1/2 * 100%);
		}
	}

	.after\:left-\[-2px\] {
		&::after {
			content: var(--tw-content);
			left: -2px;
		}
	}

	.after\:left-\[8\%\] {
		&::after {
			content: var(--tw-content);
			left: 8%;
		}
	}

	.after\:-z-1 {
		&::after {
			content: var(--tw-content);
			z-index: calc(var(--z-index-1) * -1);
		}
	}

	.after\:-z-2 {
		&::after {
			content: var(--tw-content);
			z-index: calc(var(--z-index-2) * -1);
		}
	}

	.after\:z-0 {
		&::after {
			content: var(--tw-content);
			z-index: 0;
		}
	}

	.after\:z-1 {
		&::after {
			content: var(--tw-content);
			z-index: var(--z-index-1);
		}
	}

	.after\:block {
		&::after {
			content: var(--tw-content);
			display: block;
		}
	}

	.after\:hidden {
		&::after {
			content: var(--tw-content);
			display: none;
		}
	}

	.after\:size-4\.5 {
		&::after {
			content: var(--tw-content);
			width: calc(var(--spacing) * 4.5);
			height: calc(var(--spacing) * 4.5);
		}
	}

	.after\:size-5 {
		&::after {
			content: var(--tw-content);
			width: calc(var(--spacing) * 5);
			height: calc(var(--spacing) * 5);
		}
	}

	.after\:size-full {
		&::after {
			content: var(--tw-content);
			width: 100%;
			height: 100%;
		}
	}

	.after\:h-0 {
		&::after {
			content: var(--tw-content);
			height: calc(var(--spacing) * 0);
		}
	}

	.after\:h-0\.5 {
		&::after {
			content: var(--tw-content);
			height: calc(var(--spacing) * 0.5);
		}
	}

	.after\:h-0\.75 {
		&::after {
			content: var(--tw-content);
			height: calc(var(--spacing) * 0.75);
		}
	}

	.after\:h-12\.5 {
		&::after {
			content: var(--tw-content);
			height: calc(var(--spacing) * 12.5);
		}
	}

	.after\:h-\[66\%\] {
		&::after {
			content: var(--tw-content);
			height: 66%;
		}
	}

	.after\:h-\[74\%\] {
		&::after {
			content: var(--tw-content);
			height: 74%;
		}
	}

	.after\:h-full {
		&::after {
			content: var(--tw-content);
			height: 100%;
		}
	}

	.after\:h-px {
		&::after {
			content: var(--tw-content);
			height: 1px;
		}
	}

	.after\:max-h-90 {
		&::after {
			content: var(--tw-content);
			max-height: calc(var(--spacing) * 90);
		}
	}

	.after\:w-0 {
		&::after {
			content: var(--tw-content);
			width: calc(var(--spacing) * 0);
		}
	}

	.after\:w-6 {
		&::after {
			content: var(--tw-content);
			width: calc(var(--spacing) * 6);
		}
	}

	.after\:w-\[51\%\] {
		&::after {
			content: var(--tw-content);
			width: 51%;
		}
	}

	.after\:w-full {
		&::after {
			content: var(--tw-content);
			width: 100%;
		}
	}

	.after\:w-px {
		&::after {
			content: var(--tw-content);
			width: 1px;
		}
	}

	.after\:flex-1 {
		&::after {
			content: var(--tw-content);
			flex: 1;
		}
	}

	.after\:-translate-1\/2 {
		&::after {
			content: var(--tw-content);
			--tw-translate-x: calc(calc(1/2 * 100%) * -1);
			--tw-translate-y: calc(calc(1/2 * 100%) * -1);
			translate: var(--tw-translate-x) var(--tw-translate-y);
		}
	}

	.after\:-translate-x-1\/2 {
		&::after {
			content: var(--tw-content);
			--tw-translate-x: calc(calc(1/2 * 100%) * -1);
			translate: var(--tw-translate-x) var(--tw-translate-y);
		}
	}

	.after\:-translate-y-1\/2 {
		&::after {
			content: var(--tw-content);
			--tw-translate-y: calc(calc(1/2 * 100%) * -1);
			translate: var(--tw-translate-x) var(--tw-translate-y);
		}
	}

	.after\:translate-y-full {
		&::after {
			content: var(--tw-content);
			--tw-translate-y: 100%;
			translate: var(--tw-translate-x) var(--tw-translate-y);
		}
	}

	.after\:animate-ripple-1 {
		&::after {
			content: var(--tw-content);
			animation: var(--animate-ripple-1);
		}
	}

	.after\:rounded-2lg {
		&::after {
			content: var(--tw-content);
			border-radius: var(--radius-2lg);
		}
	}

	.after\:rounded-full {
		&::after {
			content: var(--tw-content);
			border-radius: calc(infinity * 1px);
		}
	}

	.after\:rounded-t-full {
		&::after {
			content: var(--tw-content);
			border-top-left-radius: calc(infinity * 1px);
			border-top-right-radius: calc(infinity * 1px);
		}
	}

	.after\:border {
		&::after {
			content: var(--tw-content);
			border-style: var(--tw-border-style);
			border-width: 1px;
		}
	}

	.after\:border-b {
		&::after {
			content: var(--tw-content);
			border-bottom-style: var(--tw-border-style);
			border-bottom-width: 1px;
		}
	}

	.after\:border-dashed {
		&::after {
			content: var(--tw-content);
			--tw-border-style: dashed;
			border-style: dashed;
		}
	}

	.after\:border-transparent {
		&::after {
			content: var(--tw-content);
			border-color: transparent;
		}
	}

	.after\:border-white {
		&::after {
			content: var(--tw-content);
			border-color: var(--color-white);
		}
	}

	.after\:\!bg-primary {
		&::after {
			content: var(--tw-content);
			background-color: var(--color-primary) !important;
		}
	}

	.after\:bg-\[\#00102599\] {
		&::after {
			content: var(--tw-content);
			background-color: #00102599;
		}
	}

	.after\:bg-\[\#D9D9D9\] {
		&::after {
			content: var(--tw-content);
			background-color: #D9D9D9;
		}
	}

	.after\:bg-\[\#ECECDE\] {
		&::after {
			content: var(--tw-content);
			background-color: #ECECDE;
		}
	}

	.after\:bg-bg3 {
		&::after {
			content: var(--tw-content);
			background-color: var(--color-bg3);
		}
	}

	.after\:bg-black {
		&::after {
			content: var(--tw-content);
			background-color: var(--color-black);
		}
	}

	.after\:bg-black\/10 {
		&::after {
			content: var(--tw-content);
			background-color: color-mix(in srgb, #000 10%, transparent);

			@supports (color: color-mix(in lab, red, red)) {
				background-color: color-mix(in oklab, var(--color-black) 10%, transparent);
			}
		}
	}

	.after\:bg-lightgreen {
		&::after {
			content: var(--tw-content);
			background-color: var(--color-lightpurple);
		}
	}

	.after\:bg-primary {
		&::after {
			content: var(--tw-content);
			background-color: var(--color-primary);
		}
	}

	.after\:bg-secondary {
		&::after {
			content: var(--tw-content);
			background-color: var(--color-secondary);
		}
	}

	.after\:bg-secondary\/50 {
		&::after {
			content: var(--tw-content);
			background-color: var(--color-secondary);

			@supports (color: color-mix(in lab, red, red)) {
				background-color: color-mix(in oklab, var(--color-secondary) 50%, transparent);
			}
		}
	}

	.after\:bg-linear-\(--divider-gradient\) {
		&::after {
			content: var(--tw-content);
			--tw-gradient-position: var(--divider-gradient);
			background-image: linear-gradient(var(--tw-gradient-stops, var(--divider-gradient)));
		}
	}

	.after\:bg-linear-\[var\(--bg-primary-gradient\)\] {
		&::after {
			content: var(--tw-content);
			--tw-gradient-position: var(--bg-primary-gradient);
			background-image: linear-gradient(var(--tw-gradient-stops, var(--bg-primary-gradient)));
		}
	}

	.after\:bg-linear-\[var\(--black-gradient\)\] {
		&::after {
			content: var(--tw-content);
			--tw-gradient-position: var(--black-gradient);
			background-image: linear-gradient(var(--tw-gradient-stops, var(--black-gradient)));
		}
	}

	.after\:bg-linear-\[var\(--secondary2-gradient\)\] {
		&::after {
			content: var(--tw-content);
			--tw-gradient-position: var(--secondary2-gradient);
			background-image: linear-gradient(var(--tw-gradient-stops, var(--secondary2-gradient)));
		}
	}

	.after\:bg-\[url\(\'\.\.\/images\/background\/bg5\.png\'\)\] {
		&::after {
			content: var(--tw-content);
			background-image: url('../images/background/bg5.png');
		}
	}

	.after\:bg-\[url\(\'\.\.\/images\/background\/bg7\.png\'\)\] {
		&::after {
			content: var(--tw-content);
			background-image: url('../images/background/bg7.png');
		}
	}

	.after\:bg-\[url\(\'\.\.\/images\/svg\/arrow-right\.svg\'\)\] {
		&::after {
			content: var(--tw-content);
			background-image: url('../images/svg/arrow-right.svg');
		}
	}

	.after\:bg-center {
		&::after {
			content: var(--tw-content);
			background-position: center;
		}
	}

	.after\:bg-right {
		&::after {
			content: var(--tw-content);
			background-position: right;
		}
	}

	.after\:bg-no-repeat {
		&::after {
			content: var(--tw-content);
			background-repeat: no-repeat;
		}
	}

	.after\:text-secondary {
		&::after {
			content: var(--tw-content);
			color: var(--color-secondary);
		}
	}

	.after\:opacity-0 {
		&::after {
			content: var(--tw-content);
			opacity: 0%;
		}
	}

	.after\:opacity-30 {
		&::after {
			content: var(--tw-content);
			opacity: 30%;
		}
	}

	.after\:opacity-100 {
		&::after {
			content: var(--tw-content);
			opacity: 100%;
		}
	}

	.after\:backdrop-blur-\[5px\] {
		&::after {
			content: var(--tw-content);
			--tw-backdrop-blur: blur(5px);
			-webkit-backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
			backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
		}
	}

	.after\:backdrop-blur-\[20px\] {
		&::after {
			content: var(--tw-content);
			--tw-backdrop-blur: blur(20px);
			-webkit-backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
			backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
		}
	}

	.after\:duration-300 {
		&::after {
			content: var(--tw-content);
			--tw-duration: 300ms;
			transition-duration: 300ms;
		}
	}

	.after\:duration-500 {
		&::after {
			content: var(--tw-content);
			--tw-duration: 500ms;
			transition-duration: 500ms;
		}
	}

	.after\:content-\[\'\'\] {
		&::after {
			--tw-content: '';
			content: var(--tw-content);
		}
	}

	.first\:px-0 {
		&:first-child {
			padding-inline: calc(var(--spacing) * 0);
		}
	}

	.first\:ps-0 {
		&:first-child {
			padding-inline-start: calc(var(--spacing) * 0);
		}
	}

	.first\:before\:hidden {
		&:first-child {
			&::before {
				content: var(--tw-content);
				display: none;
			}
		}
	}

	.last\:me-0 {
		&:last-child {
			margin-inline-end: calc(var(--spacing) * 0);
		}
	}

	.last\:px-0 {
		&:last-child {
			padding-inline: calc(var(--spacing) * 0);
		}
	}

	.last\:pe-0 {
		&:last-child {
			padding-inline-end: calc(var(--spacing) * 0);
		}
	}

	.hover\:z-1 {
		&:hover {
			@media (hover: hover) {
				z-index: var(--z-index-1);
			}
		}
	}

	.hover\:animate-toLeftFromRight {
		&:hover {
			@media (hover: hover) {
				animation: var(--animate-toLeftFromRight);
			}
		}
	}

	.hover\:animate-toTopFromBottom {
		&:hover {
			@media (hover: hover) {
				animation: var(--animate-toTopFromBottom);
			}
		}
	}

	.hover\:\!border-primary {
		&:hover {
			@media (hover: hover) {
				border-color: var(--color-primary) !important;
			}
		}
	}

	.hover\:\!border-secondary {
		&:hover {
			@media (hover: hover) {
				border-color: var(--color-secondary) !important;
			}
		}
	}

	.hover\:border-primary {
		&:hover {
			@media (hover: hover) {
				border-color: var(--color-primary);
			}
		}
	}

	.hover\:\!bg-secondary {
		&:hover {
			@media (hover: hover) {
				background-color: var(--color-secondary) !important;
			}
		}
	}

	.hover\:bg-dark {
		&:hover {
			@media (hover: hover) {
				background-color: var(--color-dark);
			}
		}
	}

	.hover\:bg-primary {
		&:hover {
			@media (hover: hover) {
				background-color: var(--color-primary);
			}
		}
	}

	.hover\:bg-secondary {
		&:hover {
			@media (hover: hover) {
				background-color: var(--color-secondary);
			}
		}
	}

	.hover\:bg-white {
		&:hover {
			@media (hover: hover) {
				background-color: var(--color-white);
			}
		}
	}

	.hover\:bg-cover {
		&:hover {
			@media (hover: hover) {
				background-size: cover;
			}
		}
	}

	.hover\:\!text-white {
		&:hover {
			@media (hover: hover) {
				color: var(--color-white) !important;
			}
		}
	}

	.hover\:text-black {
		&:hover {
			@media (hover: hover) {
				color: var(--color-black);
			}
		}
	}

	.hover\:text-primary {
		&:hover {
			@media (hover: hover) {
				color: var(--color-primary);
			}
		}
	}

	.hover\:text-secondary {
		&:hover {
			@media (hover: hover) {
				color: var(--color-secondary);
			}
		}
	}

	.hover\:text-white {
		&:hover {
			@media (hover: hover) {
				color: var(--color-white);
			}
		}
	}

	.hover\:underline {
		&:hover {
			@media (hover: hover) {
				text-decoration-line: underline;
			}
		}
	}

	.hover\:opacity-100 {
		&:hover {
			@media (hover: hover) {
				opacity: 100%;
			}
		}
	}

	.hover\:before\:scale-100 {
		&:hover {
			@media (hover: hover) {
				&::before {
					content: var(--tw-content);
					--tw-scale-x: 100%;
					--tw-scale-y: 100%;
					--tw-scale-z: 100%;
					scale: var(--tw-scale-x) var(--tw-scale-y);
				}
			}
		}
	}

	.hover\:before\:text-primary {
		&:hover {
			@media (hover: hover) {
				&::before {
					content: var(--tw-content);
					color: var(--color-primary);
				}
			}
		}
	}

	.hover\:after\:left-0 {
		&:hover {
			@media (hover: hover) {
				&::after {
					content: var(--tw-content);
					left: calc(var(--spacing) * 0);
				}
			}
		}
	}

	.hover\:after\:h-full {
		&:hover {
			@media (hover: hover) {
				&::after {
					content: var(--tw-content);
					height: 100%;
				}
			}
		}
	}

	.hover\:after\:w-0 {
		&:hover {
			@media (hover: hover) {
				&::after {
					content: var(--tw-content);
					width: calc(var(--spacing) * 0);
				}
			}
		}
	}

	.hover\:after\:w-full {
		&:hover {
			@media (hover: hover) {
				&::after {
					content: var(--tw-content);
					width: 100%;
				}
			}
		}
	}

	.hover\:after\:w-px {
		&:hover {
			@media (hover: hover) {
				&::after {
					content: var(--tw-content);
					width: 1px;
				}
			}
		}
	}

	.hover\:after\:translate-y-0 {
		&:hover {
			@media (hover: hover) {
				&::after {
					content: var(--tw-content);
					--tw-translate-y: calc(var(--spacing) * 0);
					translate: var(--tw-translate-x) var(--tw-translate-y);
				}
			}
		}
	}

	.hover\:after\:opacity-100 {
		&:hover {
			@media (hover: hover) {
				&::after {
					content: var(--tw-content);
					opacity: 100%;
				}
			}
		}
	}

	.focus\:border-secondary {
		&:focus {
			border-color: var(--color-secondary);
		}
	}

	.max-3xl\:pl-20 {
		@media (width < 1600px) {
			padding-left: calc(var(--spacing) * 20);
		}
	}

	.max-2xl\:flex {
		@media (width < 1400px) {
			display: flex;
		}
	}

	.max-2xl\:hidden {
		@media (width < 1400px) {
			display: none;
		}
	}

	.max-2xl\:flex-col {
		@media (width < 1400px) {
			flex-direction: column;
		}
	}

	.max-2xl\:gap-20 {
		@media (width < 1400px) {
			gap: calc(var(--spacing) * 20);
		}
	}

	.max-xl\:invisible {
		@media (width < 1200px) {
			visibility: hidden;
		}
	}

	.max-xl\:visible {
		@media (width < 1200px) {
			visibility: visible;
		}
	}

	.max-xl\:fixed {
		@media (width < 1200px) {
			position: fixed;
		}
	}

	.max-xl\:top-0 {
		@media (width < 1200px) {
			top: calc(var(--spacing) * 0);
		}
	}

	.max-xl\:-left-full {
		@media (width < 1200px) {
			left: -100%;
		}
	}

	.max-xl\:mt-2\.5 {
		@media (width < 1200px) {
			margin-top: calc(var(--spacing) * 2.5);
		}
	}

	.max-xl\:mt-5 {
		@media (width < 1200px) {
			margin-top: calc(var(--spacing) * 5);
		}
	}

	.max-xl\:mt-10 {
		@media (width < 1200px) {
			margin-top: calc(var(--spacing) * 10);
		}
	}

	.max-xl\:block {
		@media (width < 1200px) {
			display: block;
		}
	}

	.max-xl\:hidden {
		@media (width < 1200px) {
			display: none;
		}
	}

	.max-xl\:h-screen {
		@media (width < 1200px) {
			height: 100vh;
		}
	}

	.max-xl\:max-h-0 {
		@media (width < 1200px) {
			max-height: calc(var(--spacing) * 0);
		}
	}

	.max-xl\:w-125 {
		@media (width < 1200px) {
			width: calc(var(--spacing) * 125);
		}
	}

	.max-xl\:overflow-y-scroll {
		@media (width < 1200px) {
			overflow-y: scroll;
		}
	}

	.max-xl\:rounded-2xl {
		@media (width < 1200px) {
			border-radius: var(--radius-2xl);
		}
	}

	.max-xl\:rounded-4xl {
		@media (width < 1200px) {
			border-radius: var(--radius-4xl);
		}
	}

	.max-xl\:rounded-br-2lg {
		@media (width < 1200px) {
			border-bottom-right-radius: var(--radius-2lg);
		}
	}

	.max-xl\:rounded-bl-xxl {
		@media (width < 1200px) {
			border-bottom-left-radius: var(--radius-xxl);
		}
	}

	.max-xl\:bg-bodyfg {
		@media (width < 1200px) {
			background-color: var(--color-bodyfg);
		}
	}

	.max-xl\:px-5 {
		@media (width < 1200px) {
			padding-inline: calc(var(--spacing) * 5);
		}
	}

	.max-xl\:opacity-0 {
		@media (width < 1200px) {
			opacity: 0%;
		}
	}

	.max-xl\:opacity-100 {
		@media (width < 1200px) {
			opacity: 100%;
		}
	}

	.max-xl\:duration-700 {
		@media (width < 1200px) {
			--tw-duration: 700ms;
			transition-duration: 700ms;
		}
	}

	.max-xl\:before\:hidden {
		@media (width < 1200px) {
			&::before {
				content: var(--tw-content);
				display: none;
			}
		}
	}

	.max-lg\:mt-10 {
		@media (width < 992px) {
			margin-top: calc(var(--spacing) * 10);
		}
	}

	.max-lg\:mb-2\.5 {
		@media (width < 992px) {
			margin-bottom: calc(var(--spacing) * 2.5);
		}
	}

	.max-lg\:mb-7\.5 {
		@media (width < 992px) {
			margin-bottom: calc(var(--spacing) * 7.5);
		}
	}

	.max-lg\:mb-10 {
		@media (width < 992px) {
			margin-bottom: calc(var(--spacing) * 10);
		}
	}

	.max-lg\:block {
		@media (width < 992px) {
			display: block;
		}
	}

	.max-lg\:hidden {
		@media (width < 992px) {
			display: none;
		}
	}

	.max-lg\:justify-between {
		@media (width < 992px) {
			justify-content: space-between;
		}
	}

	.max-lg\:gap-7\.5 {
		@media (width < 992px) {
			gap: calc(var(--spacing) * 7.5);
		}
	}

	.max-lg\:rounded-s-2xl {
		@media (width < 992px) {
			border-start-start-radius: var(--radius-2xl);
			border-end-start-radius: var(--radius-2xl);
		}
	}

	.max-lg\:border-secondary {
		@media (width < 992px) {
			border-color: var(--color-secondary);
		}
	}

	.max-lg\:text-secondary {
		@media (width < 992px) {
			color: var(--color-secondary);
		}
	}

	.max-lg\:opacity-0 {
		@media (width < 992px) {
			opacity: 0%;
		}
	}

	.max-lg\:group-hover\:\!border-secondary {
		@media (width < 992px) {
			&:is(:where(.group):hover *) {
				@media (hover: hover) {
					border-color: var(--color-secondary) !important;
				}
			}
		}
	}

	.max-lg\:group-hover\:\!bg-secondary {
		@media (width < 992px) {
			&:is(:where(.group):hover *) {
				@media (hover: hover) {
					background-color: var(--color-secondary) !important;
				}
			}
		}
	}

	.max-lg\:group-hover\:\!text-white {
		@media (width < 992px) {
			&:is(:where(.group):hover *) {
				@media (hover: hover) {
					color: var(--color-white) !important;
				}
			}
		}
	}

	.max-md\:mt-2\.5 {
		@media (width < 768px) {
			margin-top: calc(var(--spacing) * 2.5);
		}
	}

	.max-md\:mb-2\.5 {
		@media (width < 768px) {
			margin-bottom: calc(var(--spacing) * 2.5);
		}
	}

	.max-md\:block {
		@media (width < 768px) {
			display: block;
		}
	}

	.max-md\:hidden {
		@media (width < 768px) {
			display: none;
		}
	}

	.max-md\:size-20 {
		@media (width < 768px) {
			width: calc(var(--spacing) * 20);
			height: calc(var(--spacing) * 20);
		}
	}

	.max-md\:h-400 {
		@media (width < 768px) {
			height: calc(var(--spacing) * 400);
		}
	}

	.max-md\:w-full {
		@media (width < 768px) {
			width: 100%;
		}
	}

	.max-md\:justify-between {
		@media (width < 768px) {
			justify-content: space-between;
		}
	}

	.max-md\:rounded-xxl {
		@media (width < 768px) {
			border-radius: var(--radius-xxl);
		}
	}

	.max-md\:pl-0 {
		@media (width < 768px) {
			padding-left: calc(var(--spacing) * 0);
		}
	}

	.max-md\:text-center {
		@media (width < 768px) {
			text-align: center;
		}
	}

	.max-sm\:relative {
		@media (width < 576px) {
			position: relative;
		}
	}

	.max-sm\:-top-1\.25 {
		@media (width < 576px) {
			top: calc(var(--spacing) * -1.25);
		}
	}

	.max-sm\:-left-7\.5 {
		@media (width < 576px) {
			left: calc(var(--spacing) * -7.5);
		}
	}

	.max-sm\:mx-auto {
		@media (width < 576px) {
			margin-inline: auto;
		}
	}

	.max-sm\:mt-1\.25 {
		@media (width < 576px) {
			margin-top: calc(var(--spacing) * 1.25);
		}
	}

	.max-sm\:mb-2\.5 {
		@media (width < 576px) {
			margin-bottom: calc(var(--spacing) * 2.5);
		}
	}

	.max-sm\:ml-1\.25 {
		@media (width < 576px) {
			margin-left: calc(var(--spacing) * 1.25);
		}
	}

	.max-sm\:block {
		@media (width < 576px) {
			display: block;
		}
	}

	.max-sm\:hidden {
		@media (width < 576px) {
			display: none;
		}
	}

	.max-sm\:size-12 {
		@media (width < 576px) {
			width: calc(var(--spacing) * 12);
			height: calc(var(--spacing) * 12);
		}
	}

	.max-sm\:\!w-75 {
		@media (width < 576px) {
			width: calc(var(--spacing) * 75) !important;
		}
	}

	.max-sm\:w-8 {
		@media (width < 576px) {
			width: calc(var(--spacing) * 8);
		}
	}

	.max-sm\:w-full {
		@media (width < 576px) {
			width: 100%;
		}
	}

	.max-sm\:scale-\[0\.8\] {
		@media (width < 576px) {
			scale: 0.8;
		}
	}

	.max-sm\:justify-center {
		@media (width < 576px) {
			justify-content: center;
		}
	}

	.max-sm\:gap-5 {
		@media (width < 576px) {
			gap: calc(var(--spacing) * 5);
		}
	}

	.max-sm\:gap-28 {
		@media (width < 576px) {
			gap: calc(var(--spacing) * 28);
		}
	}

	.max-sm\:rounded-tl-2lg {
		@media (width < 576px) {
			border-top-left-radius: var(--radius-2lg);
		}
	}

	.max-sm\:rounded-tr-xxl {
		@media (width < 576px) {
			border-top-right-radius: var(--radius-xxl);
		}
	}

	.max-sm\:rounded-br-xxl {
		@media (width < 576px) {
			border-bottom-right-radius: var(--radius-xxl);
		}
	}

	.max-sm\:rounded-bl-2lg {
		@media (width < 576px) {
			border-bottom-left-radius: var(--radius-2lg);
		}
	}

	.max-sm\:pt-6\.25 {
		@media (width < 576px) {
			padding-top: calc(var(--spacing) * 6.25);
		}
	}

	.max-sm\:text-center {
		@media (width < 576px) {
			text-align: center;
		}
	}

	.sm\:top-7\.5 {
		@media (width >=576px) {
			top: calc(var(--spacing) * 7.5);
		}
	}

	.sm\:-right-20\.25 {
		@media (width >=576px) {
			right: calc(var(--spacing) * -20.25);
		}
	}

	.sm\:right-7\.5 {
		@media (width >=576px) {
			right: calc(var(--spacing) * 7.5);
		}
	}

	.sm\:\!bottom-5 {
		@media (width >=576px) {
			bottom: calc(var(--spacing) * 5) !important;
		}
	}

	.sm\:-left-20\.25 {
		@media (width >=576px) {
			left: calc(var(--spacing) * -20.25);
		}
	}

	.sm\:left-3\.75 {
		@media (width >=576px) {
			left: calc(var(--spacing) * 3.75);
		}
	}

	.sm\:col-span-2 {
		@media (width >=576px) {
			grid-column: span 2 / span 2;
		}
	}

	.sm\:col-span-3 {
		@media (width >=576px) {
			grid-column: span 3 / span 3;
		}
	}

	.sm\:col-span-4 {
		@media (width >=576px) {
			grid-column: span 4 / span 4;
		}
	}

	.sm\:col-span-6 {
		@media (width >=576px) {
			grid-column: span 6 / span 6;
		}
	}

	.sm\:col-span-10 {
		@media (width >=576px) {
			grid-column: span 10 / span 10;
		}
	}

	.sm\:\!mx-5 {
		@media (width >=576px) {
			margin-inline: calc(var(--spacing) * 5) !important;
		}
	}

	.sm\:mx-10 {
		@media (width >=576px) {
			margin-inline: calc(var(--spacing) * 10);
		}
	}

	.sm\:my-5 {
		@media (width >=576px) {
			margin-block: calc(var(--spacing) * 5);
		}
	}

	.sm\:ms-0 {
		@media (width >=576px) {
			margin-inline-start: calc(var(--spacing) * 0);
		}
	}

	.sm\:ms-auto {
		@media (width >=576px) {
			margin-inline-start: auto;
		}
	}

	.sm\:-mt-25 {
		@media (width >=576px) {
			margin-top: calc(var(--spacing) * -25);
		}
	}

	.sm\:mt-12\.5 {
		@media (width >=576px) {
			margin-top: calc(var(--spacing) * 12.5);
		}
	}

	.sm\:mr-3\.75 {
		@media (width >=576px) {
			margin-right: calc(var(--spacing) * 3.75);
		}
	}

	.sm\:mr-5 {
		@media (width >=576px) {
			margin-right: calc(var(--spacing) * 5);
		}
	}

	.sm\:mr-10 {
		@media (width >=576px) {
			margin-right: calc(var(--spacing) * 10);
		}
	}

	.sm\:mb-0 {
		@media (width >=576px) {
			margin-bottom: calc(var(--spacing) * 0);
		}
	}

	.sm\:mb-2\.5 {
		@media (width >=576px) {
			margin-bottom: calc(var(--spacing) * 2.5);
		}
	}

	.sm\:mb-2\.75 {
		@media (width >=576px) {
			margin-bottom: calc(var(--spacing) * 2.75);
		}
	}

	.sm\:mb-3\.5 {
		@media (width >=576px) {
			margin-bottom: calc(var(--spacing) * 3.5);
		}
	}

	.sm\:mb-5 {
		@media (width >=576px) {
			margin-bottom: calc(var(--spacing) * 5);
		}
	}

	.sm\:mb-6\.5 {
		@media (width >=576px) {
			margin-bottom: calc(var(--spacing) * 6.5);
		}
	}

	.sm\:mb-6\.25 {
		@media (width >=576px) {
			margin-bottom: calc(var(--spacing) * 6.25);
		}
	}

	.sm\:mb-6\.75 {
		@media (width >=576px) {
			margin-bottom: calc(var(--spacing) * 6.75);
		}
	}

	.sm\:mb-7\.5 {
		@media (width >=576px) {
			margin-bottom: calc(var(--spacing) * 7.5);
		}
	}

	.sm\:mb-7\.25 {
		@media (width >=576px) {
			margin-bottom: calc(var(--spacing) * 7.25);
		}
	}

	.sm\:mb-9 {
		@media (width >=576px) {
			margin-bottom: calc(var(--spacing) * 9);
		}
	}

	.sm\:mb-9\.25 {
		@media (width >=576px) {
			margin-bottom: calc(var(--spacing) * 9.25);
		}
	}

	.sm\:mb-10 {
		@media (width >=576px) {
			margin-bottom: calc(var(--spacing) * 10);
		}
	}

	.sm\:mb-11\.25 {
		@media (width >=576px) {
			margin-bottom: calc(var(--spacing) * 11.25);
		}
	}

	.sm\:mb-12\.5 {
		@media (width >=576px) {
			margin-bottom: calc(var(--spacing) * 12.5);
		}
	}

	.sm\:mb-13\.5 {
		@media (width >=576px) {
			margin-bottom: calc(var(--spacing) * 13.5);
		}
	}

	.sm\:mb-15 {
		@media (width >=576px) {
			margin-bottom: calc(var(--spacing) * 15);
		}
	}

	.sm\:mb-17\.5 {
		@media (width >=576px) {
			margin-bottom: calc(var(--spacing) * 17.5);
		}
	}

	.sm\:mb-17\.75 {
		@media (width >=576px) {
			margin-bottom: calc(var(--spacing) * 17.75);
		}
	}

	.sm\:mb-20 {
		@media (width >=576px) {
			margin-bottom: calc(var(--spacing) * 20);
		}
	}

	.sm\:mb-30 {
		@media (width >=576px) {
			margin-bottom: calc(var(--spacing) * 30);
		}
	}

	.sm\:ml-4\.5 {
		@media (width >=576px) {
			margin-left: calc(var(--spacing) * 4.5);
		}
	}

	.sm\:ml-7\.5 {
		@media (width >=576px) {
			margin-left: calc(var(--spacing) * 7.5);
		}
	}

	.sm\:ml-auto {
		@media (width >=576px) {
			margin-left: auto;
		}
	}

	.sm\:block {
		@media (width >=576px) {
			display: block;
		}
	}

	.sm\:flex {
		@media (width >=576px) {
			display: flex;
		}
	}

	.sm\:hidden {
		@media (width >=576px) {
			display: none;
		}
	}

	.sm\:size-11\.25 {
		@media (width >=576px) {
			width: calc(var(--spacing) * 11.25);
			height: calc(var(--spacing) * 11.25);
		}
	}

	.sm\:size-15 {
		@media (width >=576px) {
			width: calc(var(--spacing) * 15);
			height: calc(var(--spacing) * 15);
		}
	}

	.sm\:size-17\.5 {
		@media (width >=576px) {
			width: calc(var(--spacing) * 17.5);
			height: calc(var(--spacing) * 17.5);
		}
	}

	.sm\:size-25 {
		@media (width >=576px) {
			width: calc(var(--spacing) * 25);
			height: calc(var(--spacing) * 25);
		}
	}

	.sm\:h-1\/2 {
		@media (width >=576px) {
			height: calc(1/2 * 100%);
		}
	}

	.sm\:h-18\.5 {
		@media (width >=576px) {
			height: calc(var(--spacing) * 18.5);
		}
	}

	.sm\:h-87\.5 {
		@media (width >=576px) {
			height: calc(var(--spacing) * 87.5);
		}
	}

	.sm\:h-112\.5 {
		@media (width >=576px) {
			height: calc(var(--spacing) * 112.5);
		}
	}

	.sm\:h-152 {
		@media (width >=576px) {
			height: calc(var(--spacing) * 152);
		}
	}

	.sm\:h-full {
		@media (width >=576px) {
			height: 100%;
		}
	}

	.sm\:w-1\/2 {
		@media (width >=576px) {
			width: calc(1/2 * 100%);
		}
	}

	.sm\:w-1\/3 {
		@media (width >=576px) {
			width: calc(1/3 * 100%);
		}
	}

	.sm\:w-85 {
		@media (width >=576px) {
			width: calc(var(--spacing) * 85);
		}
	}

	.sm\:w-134\.5 {
		@media (width >=576px) {
			width: calc(var(--spacing) * 134.5);
		}
	}

	.sm\:w-\[20\%\] {
		@media (width >=576px) {
			width: 20%;
		}
	}

	.sm\:w-\[48\%\] {
		@media (width >=576px) {
			width: 48%;
		}
	}

	.sm\:w-\[58\%\] {
		@media (width >=576px) {
			width: 58%;
		}
	}

	.sm\:w-auto {
		@media (width >=576px) {
			width: auto;
		}
	}

	.sm\:max-w-72\.5 {
		@media (width >=576px) {
			max-width: calc(var(--spacing) * 72.5);
		}
	}

	.sm\:min-w-15 {
		@media (width >=576px) {
			min-width: calc(var(--spacing) * 15);
		}
	}

	.sm\:min-w-17\.5 {
		@media (width >=576px) {
			min-width: calc(var(--spacing) * 17.5);
		}
	}

	.sm\:min-w-25 {
		@media (width >=576px) {
			min-width: calc(var(--spacing) * 25);
		}
	}

	.sm\:min-w-90 {
		@media (width >=576px) {
			min-width: calc(var(--spacing) * 90);
		}
	}

	.sm\:flex-row {
		@media (width >=576px) {
			flex-direction: row;
		}
	}

	.sm\:items-center {
		@media (width >=576px) {
			align-items: center;
		}
	}

	.sm\:justify-end {
		@media (width >=576px) {
			justify-content: flex-end;
		}
	}

	.sm\:justify-start {
		@media (width >=576px) {
			justify-content: flex-start;
		}
	}

	.sm\:gap-3\.75 {
		@media (width >=576px) {
			gap: calc(var(--spacing) * 3.75);
		}
	}

	.sm\:gap-5 {
		@media (width >=576px) {
			gap: calc(var(--spacing) * 5);
		}
	}

	.sm\:gap-7 {
		@media (width >=576px) {
			gap: calc(var(--spacing) * 7);
		}
	}

	.sm\:gap-7\.5 {
		@media (width >=576px) {
			gap: calc(var(--spacing) * 7.5);
		}
	}

	.sm\:gap-10 {
		@media (width >=576px) {
			gap: calc(var(--spacing) * 10);
		}
	}

	.sm\:gap-11\.25 {
		@media (width >=576px) {
			gap: calc(var(--spacing) * 11.25);
		}
	}

	.sm\:rounded-2lg {
		@media (width >=576px) {
			border-radius: var(--radius-2lg);
		}
	}

	.sm\:rounded-3xl {
		@media (width >=576px) {
			border-radius: var(--radius-3xl);
		}
	}

	.sm\:rounded-xxl {
		@media (width >=576px) {
			border-radius: var(--radius-xxl);
		}
	}

	.sm\:bg-size-\[100\%\] {
		@media (width >=576px) {
			background-size: 100%;
		}
	}

	.sm\:p-3\.75 {
		@media (width >=576px) {
			padding: calc(var(--spacing) * 3.75);
		}
	}

	.sm\:p-7\.5 {
		@media (width >=576px) {
			padding: calc(var(--spacing) * 7.5);
		}
	}

	.sm\:p-10 {
		@media (width >=576px) {
			padding: calc(var(--spacing) * 10);
		}
	}

	.sm\:p-12\.5 {
		@media (width >=576px) {
			padding: calc(var(--spacing) * 12.5);
		}
	}

	.sm\:p-15 {
		@media (width >=576px) {
			padding: calc(var(--spacing) * 15);
		}
	}

	.sm\:\!px-8\.5 {
		@media (width >=576px) {
			padding-inline: calc(var(--spacing) * 8.5) !important;
		}
	}

	.sm\:px-3\.75 {
		@media (width >=576px) {
			padding-inline: calc(var(--spacing) * 3.75);
		}
	}

	.sm\:px-5 {
		@media (width >=576px) {
			padding-inline: calc(var(--spacing) * 5);
		}
	}

	.sm\:px-6\.5 {
		@media (width >=576px) {
			padding-inline: calc(var(--spacing) * 6.5);
		}
	}

	.sm\:px-7\.5 {
		@media (width >=576px) {
			padding-inline: calc(var(--spacing) * 7.5);
		}
	}

	.sm\:px-7\.75 {
		@media (width >=576px) {
			padding-inline: calc(var(--spacing) * 7.75);
		}
	}

	.sm\:px-8\.75 {
		@media (width >=576px) {
			padding-inline: calc(var(--spacing) * 8.75);
		}
	}

	.sm\:px-10 {
		@media (width >=576px) {
			padding-inline: calc(var(--spacing) * 10);
		}
	}

	.sm\:py-3 {
		@media (width >=576px) {
			padding-block: calc(var(--spacing) * 3);
		}
	}

	.sm\:py-4\.5 {
		@media (width >=576px) {
			padding-block: calc(var(--spacing) * 4.5);
		}
	}

	.sm\:py-5 {
		@media (width >=576px) {
			padding-block: calc(var(--spacing) * 5);
		}
	}

	.sm\:py-5\.5 {
		@media (width >=576px) {
			padding-block: calc(var(--spacing) * 5.5);
		}
	}

	.sm\:py-6 {
		@media (width >=576px) {
			padding-block: calc(var(--spacing) * 6);
		}
	}

	.sm\:py-8\.75 {
		@media (width >=576px) {
			padding-block: calc(var(--spacing) * 8.75);
		}
	}

	.sm\:py-10 {
		@media (width >=576px) {
			padding-block: calc(var(--spacing) * 10);
		}
	}

	.sm\:py-13 {
		@media (width >=576px) {
			padding-block: calc(var(--spacing) * 13);
		}
	}

	.sm\:py-15 {
		@media (width >=576px) {
			padding-block: calc(var(--spacing) * 15);
		}
	}

	.sm\:py-20 {
		@media (width >=576px) {
			padding-block: calc(var(--spacing) * 20);
		}
	}

	.sm\:py-22\.5 {
		@media (width >=576px) {
			padding-block: calc(var(--spacing) * 22.5);
		}
	}

	.sm\:py-40 {
		@media (width >=576px) {
			padding-block: calc(var(--spacing) * 40);
		}
	}

	.sm\:py-80 {
		@media (width >=576px) {
			padding-block: calc(var(--spacing) * 80);
		}
	}

	.sm\:ps-5 {
		@media (width >=576px) {
			padding-inline-start: calc(var(--spacing) * 5);
		}
	}

	.sm\:ps-6\.25 {
		@media (width >=576px) {
			padding-inline-start: calc(var(--spacing) * 6.25);
		}
	}

	.sm\:ps-25 {
		@media (width >=576px) {
			padding-inline-start: calc(var(--spacing) * 25);
		}
	}

	.sm\:pe-7\.5 {
		@media (width >=576px) {
			padding-inline-end: calc(var(--spacing) * 7.5);
		}
	}

	.sm\:pe-17\.5 {
		@media (width >=576px) {
			padding-inline-end: calc(var(--spacing) * 17.5);
		}
	}

	.sm\:pt-9\.25 {
		@media (width >=576px) {
			padding-top: calc(var(--spacing) * 9.25);
		}
	}

	.sm\:pt-10 {
		@media (width >=576px) {
			padding-top: calc(var(--spacing) * 10);
		}
	}

	.sm\:pt-12\.5 {
		@media (width >=576px) {
			padding-top: calc(var(--spacing) * 12.5);
		}
	}

	.sm\:pt-20 {
		@media (width >=576px) {
			padding-top: calc(var(--spacing) * 20);
		}
	}

	.sm\:pt-22\.5 {
		@media (width >=576px) {
			padding-top: calc(var(--spacing) * 22.5);
		}
	}

	.sm\:pt-32\.5 {
		@media (width >=576px) {
			padding-top: calc(var(--spacing) * 32.5);
		}
	}

	.sm\:pt-40 {
		@media (width >=576px) {
			padding-top: calc(var(--spacing) * 40);
		}
	}

	.sm\:pr-8\.75 {
		@media (width >=576px) {
			padding-right: calc(var(--spacing) * 8.75);
		}
	}

	.sm\:pr-13\.75 {
		@media (width >=576px) {
			padding-right: calc(var(--spacing) * 13.75);
		}
	}

	.sm\:pr-15 {
		@media (width >=576px) {
			padding-right: calc(var(--spacing) * 15);
		}
	}

	.sm\:pb-5 {
		@media (width >=576px) {
			padding-bottom: calc(var(--spacing) * 5);
		}
	}

	.sm\:pb-7\.5 {
		@media (width >=576px) {
			padding-bottom: calc(var(--spacing) * 7.5);
		}
	}

	.sm\:pb-12\.5 {
		@media (width >=576px) {
			padding-bottom: calc(var(--spacing) * 12.5);
		}
	}

	.sm\:pb-20 {
		@media (width >=576px) {
			padding-bottom: calc(var(--spacing) * 20);
		}
	}

	.sm\:pb-25 {
		@media (width >=576px) {
			padding-bottom: calc(var(--spacing) * 25);
		}
	}

	.sm\:pl-12\.5 {
		@media (width >=576px) {
			padding-left: calc(var(--spacing) * 12.5);
		}
	}

	.sm\:sm\:text-lg {
		@media (width >=576px) {
			@media (width >=576px) {
				font-size: var(--text-lg);
				line-height: var(--tw-leading, var(--text-lg--line-height));
			}
		}
	}

	.sm\:text-2xl {
		@media (width >=576px) {
			font-size: var(--text-2xl);
			line-height: var(--tw-leading, var(--text-2xl--line-height));
		}
	}

	.sm\:text-2xxl {
		@media (width >=576px) {
			font-size: var(--text-2xxl);
			line-height: var(--tw-leading, var(--text-2xxl--line-height));
		}
	}

	.sm\:text-3xl {
		@media (width >=576px) {
			font-size: var(--text-3xl);
			line-height: var(--tw-leading, var(--text-3xl--line-height));
		}
	}

	.sm\:text-4xl {
		@media (width >=576px) {
			font-size: var(--text-4xl);
			line-height: var(--tw-leading, var(--text-4xl--line-height));
		}
	}

	.sm\:text-7xxxl {
		@media (width >=576px) {
			font-size: var(--text-7xxxl);
			line-height: var(--tw-leading, var(--text-7xxxl--line-height));
		}
	}

	.sm\:text-\[35px\]\/13 {
		@media (width >=576px) {
			font-size: 35px;
			line-height: calc(var(--spacing) * 13);
		}
	}

	.sm\:text-\[45px\]\/48 {
		@media (width >=576px) {
			font-size: 45px;
			line-height: calc(var(--spacing) * 48);
		}
	}

	.sm\:text-base {
		@media (width >=576px) {
			font-size: var(--text-base);
			line-height: var(--tw-leading, var(--text-base--line-height));
		}
	}

	.sm\:text-lg {
		@media (width >=576px) {
			font-size: var(--text-lg);
			line-height: var(--tw-leading, var(--text-lg--line-height));
		}
	}

	.sm\:text-sm {
		@media (width >=576px) {
			font-size: var(--text-sm);
			line-height: var(--tw-leading, var(--text-sm--line-height));
		}
	}

	.sm\:text-xl {
		@media (width >=576px) {
			font-size: var(--text-xl);
			line-height: var(--tw-leading, var(--text-xl--line-height));
		}
	}

	.sm\:text-xl\/7\.5 {
		@media (width >=576px) {
			font-size: var(--text-xl);
			line-height: calc(var(--spacing) * 7.5);
		}
	}

	.sm\:text-2xxxl {
		@media (width >=576px) {
			font-size: var(--text-2xxxl);
		}
	}

	.sm\:leading-15 {
		@media (width >=576px) {
			--tw-leading: calc(var(--spacing) * 15);
			line-height: calc(var(--spacing) * 15);
		}
	}

	.sm\:opacity-0 {
		@media (width >=576px) {
			opacity: 0%;
		}
	}

	.md\:order-0 {
		@media (width >=768px) {
			order: 0;
		}
	}

	.md\:col-span-4 {
		@media (width >=768px) {
			grid-column: span 4 / span 4;
		}
	}

	.md\:col-span-6 {
		@media (width >=768px) {
			grid-column: span 6 / span 6;
		}
	}

	.md\:col-span-8 {
		@media (width >=768px) {
			grid-column: span 8 / span 8;
		}
	}

	.md\:\!mt-0 {
		@media (width >=768px) {
			margin-top: calc(var(--spacing) * 0) !important;
		}
	}

	.md\:-mt-45 {
		@media (width >=768px) {
			margin-top: calc(var(--spacing) * -45);
		}
	}

	.md\:-mt-81 {
		@media (width >=768px) {
			margin-top: calc(var(--spacing) * -81);
		}
	}

	.md\:mt-0 {
		@media (width >=768px) {
			margin-top: calc(var(--spacing) * 0);
		}
	}

	.md\:mt-3\.5 {
		@media (width >=768px) {
			margin-top: calc(var(--spacing) * 3.5);
		}
	}

	.md\:mt-3\.75 {
		@media (width >=768px) {
			margin-top: calc(var(--spacing) * 3.75);
		}
	}

	.md\:mr-3\.75 {
		@media (width >=768px) {
			margin-right: calc(var(--spacing) * 3.75);
		}
	}

	.md\:mr-7\.5 {
		@media (width >=768px) {
			margin-right: calc(var(--spacing) * 7.5);
		}
	}

	.md\:mb-5 {
		@media (width >=768px) {
			margin-bottom: calc(var(--spacing) * 5);
		}
	}

	.md\:mb-7\.5 {
		@media (width >=768px) {
			margin-bottom: calc(var(--spacing) * 7.5);
		}
	}

	.md\:mb-12\.5 {
		@media (width >=768px) {
			margin-bottom: calc(var(--spacing) * 12.5);
		}
	}

	.md\:mb-21\.25 {
		@media (width >=768px) {
			margin-bottom: calc(var(--spacing) * 21.25);
		}
	}

	.md\:flex {
		@media (width >=768px) {
			display: flex;
		}
	}

	.md\:h-20 {
		@media (width >=768px) {
			height: calc(var(--spacing) * 20);
		}
	}

	.md\:h-80 {
		@media (width >=768px) {
			height: calc(var(--spacing) * 80);
		}
	}

	.md\:h-107 {
		@media (width >=768px) {
			height: calc(var(--spacing) * 107);
		}
	}

	.md\:h-127\.5 {
		@media (width >=768px) {
			height: calc(var(--spacing) * 127.5);
		}
	}

	.md\:h-221\.5 {
		@media (width >=768px) {
			height: calc(var(--spacing) * 221.5);
		}
	}

	.md\:max-h-full {
		@media (width >=768px) {
			max-height: 100%;
		}
	}

	.md\:w-1\/2 {
		@media (width >=768px) {
			width: calc(1/2 * 100%);
		}
	}

	.md\:w-\[37\%\] {
		@media (width >=768px) {
			width: 37%;
		}
	}

	.md\:w-\[50\%\] {
		@media (width >=768px) {
			width: 50%;
		}
	}

	.md\:w-\[60\%\] {
		@media (width >=768px) {
			width: 60%;
		}
	}

	.md\:w-\[63\%\] {
		@media (width >=768px) {
			width: 63%;
		}
	}

	.md\:w-\[80\%\] {
		@media (width >=768px) {
			width: 80%;
		}
	}

	.md\:w-auto {
		@media (width >=768px) {
			width: auto;
		}
	}

	.md\:max-w-72\.5 {
		@media (width >=768px) {
			max-width: calc(var(--spacing) * 72.5);
		}
	}

	.md\:min-w-85 {
		@media (width >=768px) {
			min-width: calc(var(--spacing) * 85);
		}
	}

	.md\:flex-1 {
		@media (width >=768px) {
			flex: 1;
		}
	}

	.md\:flex-row {
		@media (width >=768px) {
			flex-direction: row;
		}
	}

	.md\:gap-7\.5 {
		@media (width >=768px) {
			gap: calc(var(--spacing) * 7.5);
		}
	}

	.md\:gap-10 {
		@media (width >=768px) {
			gap: calc(var(--spacing) * 10);
		}
	}

	.md\:gap-12\.5 {
		@media (width >=768px) {
			gap: calc(var(--spacing) * 12.5);
		}
	}

	.md\:p-2\.5 {
		@media (width >=768px) {
			padding: calc(var(--spacing) * 2.5);
		}
	}

	.md\:p-12\.5 {
		@media (width >=768px) {
			padding: calc(var(--spacing) * 12.5);
		}
	}

	.md\:px-7\.5 {
		@media (width >=768px) {
			padding-inline: calc(var(--spacing) * 7.5);
		}
	}

	.md\:px-24\.5 {
		@media (width >=768px) {
			padding-inline: calc(var(--spacing) * 24.5);
		}
	}

	.md\:py-10 {
		@media (width >=768px) {
			padding-block: calc(var(--spacing) * 10);
		}
	}

	.md\:py-15 {
		@media (width >=768px) {
			padding-block: calc(var(--spacing) * 15);
		}
	}

	.md\:py-35 {
		@media (width >=768px) {
			padding-block: calc(var(--spacing) * 35);
		}
	}

	.md\:py-40 {
		@media (width >=768px) {
			padding-block: calc(var(--spacing) * 40);
		}
	}

	.md\:pe-5 {
		@media (width >=768px) {
			padding-inline-end: calc(var(--spacing) * 5);
		}
	}

	.md\:pt-0 {
		@media (width >=768px) {
			padding-top: calc(var(--spacing) * 0);
		}
	}

	.md\:pt-7\.5 {
		@media (width >=768px) {
			padding-top: calc(var(--spacing) * 7.5);
		}
	}

	.md\:pt-11\.25 {
		@media (width >=768px) {
			padding-top: calc(var(--spacing) * 11.25);
		}
	}

	.md\:pt-12\.5 {
		@media (width >=768px) {
			padding-top: calc(var(--spacing) * 12.5);
		}
	}

	.md\:pt-15 {
		@media (width >=768px) {
			padding-top: calc(var(--spacing) * 15);
		}
	}

	.md\:pb-25 {
		@media (width >=768px) {
			padding-bottom: calc(var(--spacing) * 25);
		}
	}

	.md\:pb-32\.5 {
		@media (width >=768px) {
			padding-bottom: calc(var(--spacing) * 32.5);
		}
	}

	.md\:text-start {
		@media (width >=768px) {
			text-align: start;
		}
	}

	.md\:text-2xl {
		@media (width >=768px) {
			font-size: var(--text-2xl);
			line-height: var(--tw-leading, var(--text-2xl--line-height));
		}
	}

	.md\:text-3xl {
		@media (width >=768px) {
			font-size: var(--text-3xl);
			line-height: var(--tw-leading, var(--text-3xl--line-height));
		}
	}

	.md\:text-5xl {
		@media (width >=768px) {
			font-size: var(--text-5xl);
			line-height: var(--tw-leading, var(--text-5xl--line-height));
		}
	}

	.md\:text-\[45px\]\/\[50px\] {
		@media (width >=768px) {
			font-size: 45px;
			line-height: 50px;
		}
	}

	.md\:text-\[55px\]\/58 {
		@media (width >=768px) {
			font-size: 55px;
			line-height: calc(var(--spacing) * 58);
		}
	}

	.md\:text-\[190px\]\/\[1\] {
		@media (width >=768px) {
			font-size: 190px;
			line-height: 1;
		}
	}

	.md\:text-xl {
		@media (width >=768px) {
			font-size: var(--text-xl);
			line-height: var(--tw-leading, var(--text-xl--line-height));
		}
	}

	.after\:md\:h-20 {
		&::after {
			content: var(--tw-content);

			@media (width >=768px) {
				height: calc(var(--spacing) * 20);
			}
		}
	}

	.lg\:order-1 {
		@media (width >=992px) {
			order: 1;
		}
	}

	.lg\:order-2 {
		@media (width >=992px) {
			order: 2;
		}
	}

	.lg\:order-\[0\] {
		@media (width >=992px) {
			order: 0;
		}
	}

	.lg\:col-span-3 {
		@media (width >=992px) {
			grid-column: span 3 / span 3;
		}
	}

	.lg\:col-span-4 {
		@media (width >=992px) {
			grid-column: span 4 / span 4;
		}
	}

	.lg\:col-span-5 {
		@media (width >=992px) {
			grid-column: span 5 / span 5;
		}
	}

	.lg\:col-span-6 {
		@media (width >=992px) {
			grid-column: span 6 / span 6;
		}
	}

	.lg\:col-span-7 {
		@media (width >=992px) {
			grid-column: span 7 / span 7;
		}
	}

	.lg\:col-span-8 {
		@media (width >=992px) {
			grid-column: span 8 / span 8;
		}
	}

	.lg\:col-span-9 {
		@media (width >=992px) {
			grid-column: span 9 / span 9;
		}
	}

	.lg\:float-left {
		@media (width >=992px) {
			float: left;
		}
	}

	.lg\:float-right {
		@media (width >=992px) {
			float: right;
		}
	}

	.lg\:mx-0 {
		@media (width >=992px) {
			margin-inline: calc(var(--spacing) * 0);
		}
	}

	.lg\:mx-4\.5 {
		@media (width >=992px) {
			margin-inline: calc(var(--spacing) * 4.5);
		}
	}

	.lg\:\!mt-14\.5 {
		@media (width >=992px) {
			margin-top: calc(var(--spacing) * 14.5) !important;
		}
	}

	.lg\:-mt-55 {
		@media (width >=992px) {
			margin-top: calc(var(--spacing) * -55);
		}
	}

	.lg\:mt-30\.5 {
		@media (width >=992px) {
			margin-top: calc(var(--spacing) * 30.5);
		}
	}

	.lg\:mr-10 {
		@media (width >=992px) {
			margin-right: calc(var(--spacing) * 10);
		}
	}

	.lg\:mb-0 {
		@media (width >=992px) {
			margin-bottom: calc(var(--spacing) * 0);
		}
	}

	.lg\:mb-1\.25 {
		@media (width >=992px) {
			margin-bottom: calc(var(--spacing) * 1.25);
		}
	}

	.lg\:mb-4 {
		@media (width >=992px) {
			margin-bottom: calc(var(--spacing) * 4);
		}
	}

	.lg\:mb-5 {
		@media (width >=992px) {
			margin-bottom: calc(var(--spacing) * 5);
		}
	}

	.lg\:mb-7\.5 {
		@media (width >=992px) {
			margin-bottom: calc(var(--spacing) * 7.5);
		}
	}

	.lg\:mb-10 {
		@media (width >=992px) {
			margin-bottom: calc(var(--spacing) * 10);
		}
	}

	.lg\:mb-13\.25 {
		@media (width >=992px) {
			margin-bottom: calc(var(--spacing) * 13.25);
		}
	}

	.lg\:mb-13\.75 {
		@media (width >=992px) {
			margin-bottom: calc(var(--spacing) * 13.75);
		}
	}

	.lg\:mb-15 {
		@media (width >=992px) {
			margin-bottom: calc(var(--spacing) * 15);
		}
	}

	.lg\:mb-18\.25 {
		@media (width >=992px) {
			margin-bottom: calc(var(--spacing) * 18.25);
		}
	}

	.lg\:mb-20 {
		@media (width >=992px) {
			margin-bottom: calc(var(--spacing) * 20);
		}
	}

	.lg\:mb-25 {
		@media (width >=992px) {
			margin-bottom: calc(var(--spacing) * 25);
		}
	}

	.lg\:mb-26\.5 {
		@media (width >=992px) {
			margin-bottom: calc(var(--spacing) * 26.5);
		}
	}

	.lg\:ml-10 {
		@media (width >=992px) {
			margin-left: calc(var(--spacing) * 10);
		}
	}

	.lg\:ml-auto {
		@media (width >=992px) {
			margin-left: auto;
		}
	}

	.lg\:block {
		@media (width >=992px) {
			display: block;
		}
	}

	.lg\:flex {
		@media (width >=992px) {
			display: flex;
		}
	}

	.lg\:hidden {
		@media (width >=992px) {
			display: none;
		}
	}

	.lg\:size-32\.25 {
		@media (width >=992px) {
			width: calc(var(--spacing) * 32.25);
			height: calc(var(--spacing) * 32.25);
		}
	}

	.lg\:size-auto {
		@media (width >=992px) {
			width: auto;
			height: auto;
		}
	}

	.lg\:h-128 {
		@media (width >=992px) {
			height: calc(var(--spacing) * 128);
		}
	}

	.lg\:h-200 {
		@media (width >=992px) {
			height: calc(var(--spacing) * 200);
		}
	}

	.lg\:h-full {
		@media (width >=992px) {
			height: 100%;
		}
	}

	.lg\:\!w-19\.75 {
		@media (width >=992px) {
			width: calc(var(--spacing) * 19.75) !important;
		}
	}

	.lg\:w-1\/2 {
		@media (width >=992px) {
			width: calc(1/2 * 100%);
		}
	}

	.lg\:w-1\/3 {
		@media (width >=992px) {
			width: calc(1/3 * 100%);
		}
	}

	.lg\:w-4\/6 {
		@media (width >=992px) {
			width: calc(4/6 * 100%);
		}
	}

	.lg\:w-\[37\.8\%\] {
		@media (width >=992px) {
			width: 37.8%;
		}
	}

	.lg\:w-\[40\%\] {
		@media (width >=992px) {
			width: 40%;
		}
	}

	.lg\:w-\[44\%\] {
		@media (width >=992px) {
			width: 44%;
		}
	}

	.lg\:w-\[50vw\] {
		@media (width >=992px) {
			width: 50vw;
		}
	}

	.lg\:w-\[56\%\] {
		@media (width >=992px) {
			width: 56%;
		}
	}

	.lg\:w-\[70\%\] {
		@media (width >=992px) {
			width: 70%;
		}
	}

	.lg\:w-\[71\%\] {
		@media (width >=992px) {
			width: 71%;
		}
	}

	.lg\:w-\[80\%\] {
		@media (width >=992px) {
			width: 80%;
		}
	}

	.lg\:w-auto {
		@media (width >=992px) {
			width: auto;
		}
	}

	.lg\:max-w-135 {
		@media (width >=992px) {
			max-width: calc(var(--spacing) * 135);
		}
	}

	.lg\:max-w-150 {
		@media (width >=992px) {
			max-width: calc(var(--spacing) * 150);
		}
	}

	.lg\:min-w-32\.25 {
		@media (width >=992px) {
			min-width: calc(var(--spacing) * 32.25);
		}
	}

	.lg\:flex-row {
		@media (width >=992px) {
			flex-direction: row;
		}
	}

	.lg\:items-center {
		@media (width >=992px) {
			align-items: center;
		}
	}

	.lg\:gap-0 {
		@media (width >=992px) {
			gap: calc(var(--spacing) * 0);
		}
	}

	.lg\:gap-3\.75 {
		@media (width >=992px) {
			gap: calc(var(--spacing) * 3.75);
		}
	}

	.lg\:gap-7\.5 {
		@media (width >=992px) {
			gap: calc(var(--spacing) * 7.5);
		}
	}

	.lg\:gap-22 {
		@media (width >=992px) {
			gap: calc(var(--spacing) * 22);
		}
	}

	.lg\:rounded-s-2xl {
		@media (width >=992px) {
			border-start-start-radius: var(--radius-2xl);
			border-end-start-radius: var(--radius-2xl);
		}
	}

	.lg\:rounded-s-4xl {
		@media (width >=992px) {
			border-start-start-radius: var(--radius-4xl);
			border-end-start-radius: var(--radius-4xl);
		}
	}

	.lg\:border-secondary {
		@media (width >=992px) {
			border-color: var(--color-secondary);
		}
	}

	.lg\:p-7\.25 {
		@media (width >=992px) {
			padding: calc(var(--spacing) * 7.25);
		}
	}

	.lg\:py-12\.5 {
		@media (width >=992px) {
			padding-block: calc(var(--spacing) * 12.5);
		}
	}

	.lg\:py-20 {
		@media (width >=992px) {
			padding-block: calc(var(--spacing) * 20);
		}
	}

	.lg\:py-25 {
		@media (width >=992px) {
			padding-block: calc(var(--spacing) * 25);
		}
	}

	.lg\:py-38 {
		@media (width >=992px) {
			padding-block: calc(var(--spacing) * 38);
		}
	}

	.lg\:py-50 {
		@media (width >=992px) {
			padding-block: calc(var(--spacing) * 50);
		}
	}

	.lg\:py-123 {
		@media (width >=992px) {
			padding-block: calc(var(--spacing) * 123);
		}
	}

	.lg\:ps-20 {
		@media (width >=992px) {
			padding-inline-start: calc(var(--spacing) * 20);
		}
	}

	.lg\:ps-25 {
		@media (width >=992px) {
			padding-inline-start: calc(var(--spacing) * 25);
		}
	}

	.lg\:pe-7\.5 {
		@media (width >=992px) {
			padding-inline-end: calc(var(--spacing) * 7.5);
		}
	}

	.lg\:pe-10 {
		@media (width >=992px) {
			padding-inline-end: calc(var(--spacing) * 10);
		}
	}

	.lg\:pe-12\.5 {
		@media (width >=992px) {
			padding-inline-end: calc(var(--spacing) * 12.5);
		}
	}

	.lg\:pe-22\.5 {
		@media (width >=992px) {
			padding-inline-end: calc(var(--spacing) * 22.5);
		}
	}

	.lg\:pt-0 {
		@media (width >=992px) {
			padding-top: calc(var(--spacing) * 0);
		}
	}

	.lg\:pt-7\.5 {
		@media (width >=992px) {
			padding-top: calc(var(--spacing) * 7.5);
		}
	}

	.lg\:pt-18\.75 {
		@media (width >=992px) {
			padding-top: calc(var(--spacing) * 18.75);
		}
	}

	.lg\:pt-26\.5 {
		@media (width >=992px) {
			padding-top: calc(var(--spacing) * 26.5);
		}
	}

	.lg\:pt-32\.5 {
		@media (width >=992px) {
			padding-top: calc(var(--spacing) * 32.5);
		}
	}

	.lg\:pt-36\.25 {
		@media (width >=992px) {
			padding-top: calc(var(--spacing) * 36.25);
		}
	}

	.lg\:pt-40 {
		@media (width >=992px) {
			padding-top: calc(var(--spacing) * 40);
		}
	}

	.lg\:pt-42\.25 {
		@media (width >=992px) {
			padding-top: calc(var(--spacing) * 42.25);
		}
	}

	.lg\:pt-45 {
		@media (width >=992px) {
			padding-top: calc(var(--spacing) * 45);
		}
	}

	.lg\:pr-7\.5 {
		@media (width >=992px) {
			padding-right: calc(var(--spacing) * 7.5);
		}
	}

	.lg\:pt-100 {
		@media (width >=992px) {
			padding-top: calc(var(--spacing) * 100)
				/* 25rem = 400px */
			;
		}
	}

	.lg\:pb-15 {
		@media (width >=992px) {
			padding-bottom: calc(var(--spacing) * 15);
		}
	}

	.lg\:pb-23\.75 {
		@media (width >=992px) {
			padding-bottom: calc(var(--spacing) * 23.75);
		}
	}

	.lg\:pb-35\.5 {
		@media (width >=992px) {
			padding-bottom: calc(var(--spacing) * 35.5);
		}
	}

	.lg\:pb-58\.5 {
		@media (width >=992px) {
			padding-bottom: calc(var(--spacing) * 58.5);
		}
	}

	.lg\:pl-8\.75 {
		@media (width >=992px) {
			padding-left: calc(var(--spacing) * 8.75);
		}
	}

	.lg\:pl-10 {
		@media (width >=992px) {
			padding-left: calc(var(--spacing) * 10);
		}
	}

	.lg\:text-center {
		@media (width >=992px) {
			text-align: center;
		}
	}

	.lg\:text-end {
		@media (width >=992px) {
			text-align: end;
		}
	}

	.lg\:text-4xxl {
		@media (width >=992px) {
			font-size: var(--text-4xxl);
			line-height: var(--tw-leading, var(--text-4xxl--line-height));
		}
	}

	.lg\:text-5xl {
		@media (width >=992px) {
			font-size: var(--text-5xl);
			line-height: var(--tw-leading, var(--text-5xl--line-height));
		}
	}

	.lg\:text-base {
		@media (width >=992px) {
			font-size: var(--text-base);
			line-height: var(--tw-leading, var(--text-base--line-height));
		}
	}

	.lg\:text-lg {
		@media (width >=992px) {
			font-size: var(--text-lg);
			line-height: var(--tw-leading, var(--text-lg--line-height));
		}
	}

	.lg\:text-sm {
		@media (width >=992px) {
			font-size: var(--text-sm);
			line-height: var(--tw-leading, var(--text-sm--line-height));
		}
	}

	.lg\:text-\[120px\] {
		@media (width >=992px) {
			font-size: 120px;
		}
	}

	.lg\:text-black {
		@media (width >=992px) {
			color: var(--color-black);
		}
	}

	.lg\:text-secondary {
		@media (width >=992px) {
			color: var(--color-secondary);
		}
	}

	.lg\:opacity-0 {
		@media (width >=992px) {
			opacity: 0%;
		}
	}

	.lg\:before\:block {
		@media (width >=992px) {
			&::before {
				content: var(--tw-content);
				display: block;
			}
		}
	}

	.lg\:before\:hidden {
		@media (width >=992px) {
			&::before {
				content: var(--tw-content);
				display: none;
			}
		}
	}

	.lg\:before\:w-1\/2 {
		@media (width >=992px) {
			&::before {
				content: var(--tw-content);
				width: calc(1/2 * 100%);
			}
		}
	}

	.lg\:after\:left-0 {
		@media (width >=992px) {
			&::after {
				content: var(--tw-content);
				left: calc(var(--spacing) * 0);
			}
		}
	}

	.lg\:after\:left-\[calc\(calc\(100vw_-_916px\)_\/_-2\)\] {
		@media (width >=992px) {
			&::after {
				content: var(--tw-content);
				left: calc(calc(100vw - 916px) / -2);
			}
		}
	}

	.lg\:after\:block {
		@media (width >=992px) {
			&::after {
				content: var(--tw-content);
				display: block;
			}
		}
	}

	.lg\:after\:w-screen {
		@media (width >=992px) {
			&::after {
				content: var(--tw-content);
				width: 100vw;
			}
		}
	}

	.xl\:invisible {
		@media (width >=1200px) {
			visibility: hidden;
		}
	}

	.xl\:visible {
		@media (width >=1200px) {
			visibility: visible;
		}
	}

	.xl\:absolute {
		@media (width >=1200px) {
			position: absolute;
		}
	}

	.xl\:sticky {
		@media (width >=1200px) {
			position: sticky;
		}
	}

	.xl\:\!top-0 {
		@media (width >=1200px) {
			top: calc(var(--spacing) * 0) !important;
		}
	}

	.xl\:top-0 {
		@media (width >=1200px) {
			top: calc(var(--spacing) * 0);
		}
	}

	.xl\:top-\[calc\(100\%_\+_2\.5\)\] {
		@media (width >=1200px) {
			top: calc(100% + 2.5);
		}
	}

	.xl\:right-25 {
		@media (width >=1200px) {
			right: calc(var(--spacing) * 25);
		}
	}

	.xl\:\!bottom-12\.5 {
		@media (width >=1200px) {
			bottom: calc(var(--spacing) * 12.5) !important;
		}
	}

	.xl\:bottom-14\.5 {
		@media (width >=1200px) {
			bottom: calc(var(--spacing) * 14.5);
		}
	}

	.xl\:-bottom-55\.75 {
		@media (width >=1200px) {
			bottom: calc(var(--spacing) * -55.75);
		}
	}

	.\2xl\:bottom-4\.5 {
		@media (width >=1200px) {
			bottom: calc(var(--spacing) * 4.5);
		}
	}

	.xl\:left-0 {
		@media (width >=1200px) {
			left: calc(var(--spacing) * 0);
		}
	}

	.xl\:order-1 {
		@media (width >=1200px) {
			order: 1;
		}
	}

	.xl\:order-\[2\] {
		@media (width >=1200px) {
			order: 2;
		}
	}

	.xl\:order-\[3\] {
		@media (width >=1200px) {
			order: 3;
		}
	}

	.xl\:col-span-3 {
		@media (width >=1200px) {
			grid-column: span 3 / span 3;
		}
	}

	.xl\:col-span-4 {
		@media (width >=1200px) {
			grid-column: span 4 / span 4;
		}
	}

	.xl\:col-span-5 {
		@media (width >=1200px) {
			grid-column: span 5 / span 5;
		}
	}

	.xl\:col-span-6 {
		@media (width >=1200px) {
			grid-column: span 6 / span 6;
		}
	}

	.xl\:col-span-7 {
		@media (width >=1200px) {
			grid-column: span 7 / span 7;
		}
	}

	.xl\:col-span-8 {
		@media (width >=1200px) {
			grid-column: span 8 / span 8;
		}
	}

	.xl\:col-span-9 {
		@media (width >=1200px) {
			grid-column: span 9 / span 9;
		}
	}

	.xl\:row-span-2 {
		@media (width >=1200px) {
			grid-row: span 2 / span 2;
		}
	}

	.xl\:float-left {
		@media (width >=1200px) {
			float: left;
		}
	}

	.xl\:mx-15 {
		@media (width >=1200px) {
			margin-inline: calc(var(--spacing) * 15);
		}
	}

	.xl\:mt-0\.5 {
		@media (width >=1200px) {
			margin-top: calc(var(--spacing) * 0.5);
		}
	}

	.xl\:mt-5 {
		@media (width >=1200px) {
			margin-top: calc(var(--spacing) * 5);
		}
	}

	.xl\:mr-7\.5 {
		@media (width >=1200px) {
			margin-right: calc(var(--spacing) * 7.5);
		}
	}

	.xl\:mr-13\.5 {
		@media (width >=1200px) {
			margin-right: calc(var(--spacing) * 13.5);
		}
	}

	.xl\:mr-32 {
		@media (width >=1200px) {
			margin-right: calc(var(--spacing) * 32);
		}
	}

	.xl\:mb-0 {
		@media (width >=1200px) {
			margin-bottom: calc(var(--spacing) * 0);
		}
	}

	.xl\:mb-1 {
		@media (width >=1200px) {
			margin-bottom: calc(var(--spacing) * 1);
		}
	}

	.xl\:mb-10 {
		@media (width >=1200px) {
			margin-bottom: calc(var(--spacing) * 10);
		}
	}

	.xl\:mb-12\.5 {
		@media (width >=1200px) {
			margin-bottom: calc(var(--spacing) * 12.5);
		}
	}

	.xl\:mb-15 {
		@media (width >=1200px) {
			margin-bottom: calc(var(--spacing) * 15);
		}
	}

	.xl\:mb-26\.5 {
		@media (width >=1200px) {
			margin-bottom: calc(var(--spacing) * 26.5);
		}
	}

	.xl\:mb-37\.5 {
		@media (width >=1200px) {
			margin-bottom: calc(var(--spacing) * 37.5);
		}
	}

	.xl\:ml-5 {
		@media (width >=1200px) {
			margin-left: calc(var(--spacing) * 5);
		}
	}

	.xl\:ml-10 {
		@media (width >=1200px) {
			margin-left: calc(var(--spacing) * 10);
		}
	}

	.xl\:\!hidden {
		@media (width >=1200px) {
			display: none !important;
		}
	}

	.xl\:block {
		@media (width >=1200px) {
			display: block;
		}
	}

	.xl\:flex {
		@media (width >=1200px) {
			display: flex;
		}
	}

	.xl\:hidden {
		@media (width >=1200px) {
			display: none;
		}
	}

	.xl\:h-187\.5 {
		@media (width >=1200px) {
			height: calc(var(--spacing) * 187.5);
		}
	}

	.xl\:h-200 {
		@media (width >=1200px) {
			height: calc(var(--spacing) * 200);
		}
	}

	.xl\:h-screen {
		@media (width >=1200px) {
			height: 100vh;
		}
	}


	.xl\:max-h-189\.5 {
		@media (width >=1200px) {
			max-height: calc(var(--spacing) * 189.5);
		}
	}

	.xl\:max-h-212\.5 {
		@media (width >=1200px) {
			max-height: calc(var(--spacing) * 212.5);
		}
	}

	.xl\:max-h-245\.5 {
		@media (width >=1200px) {
			max-height: calc(var(--spacing) * 245.5);
		}
	}

	.xl\:min-h-212\.5 {
		@media (width >=1200px) {
			min-height: calc(var(--spacing) * 212.5);
		}
	}

	.xl\:min-h-237\.5 {
		@media (width >=1200px) {
			min-height: calc(var(--spacing) * 237.5);
		}
	}

	.xl\:min-h-245\.5 {
		@media (width >=1200px) {
			min-height: calc(var(--spacing) * 245.5);
		}
	}

	.xl\:w-1\/3 {
		@media (width >=1200px) {
			width: calc(1/3 * 100%);
		}
	}

	.xl\:w-4\/6 {
		@media (width >=1200px) {
			width: calc(4/6 * 100%);
		}
	}

	.xl\:w-25 {
		@media (width >=1200px) {
			width: calc(var(--spacing) * 25);
		}
	}

	.xl\:w-57\.5 {
		@media (width >=1200px) {
			width: calc(var(--spacing) * 57.5);
		}
	}

	.xl\:w-\[20\%\] {
		@media (width >=1200px) {
			width: 20%;
		}
	}

	.xl\:w-\[28\%\] {
		@media (width >=1200px) {
			width: 28%;
		}
	}

	.xl\:w-\[30\%\] {
		@media (width >=1200px) {
			width: 30%;
		}
	}

	.xl\:w-\[40\%\] {
		@media (width >=1200px) {
			width: 40%;
		}
	}

	.xl\:w-\[50vw\] {
		@media (width >=1200px) {
			width: 50vw;
		}
	}

	.xl\:w-\[70\%\] {
		@media (width >=1200px) {
			width: 70%;
		}
	}

	.xl\:w-\[72\%\] {
		@media (width >=1200px) {
			width: 72%;
		}
	}

	.xl\:w-\[80\%\] {
		@media (width >=1200px) {
			width: 80%;
		}
	}

	.xl\:w-auto {
		@media (width >=1200px) {
			width: auto;
		}
	}

	.xl\:w-full {
		@media (width >=1200px) {
			width: 100%;
		}
	}

	.xl\:max-w-50 {
		@media (width >=1200px) {
			max-width: calc(var(--spacing) * 50);
		}
	}

	.xl\:max-w-140 {
		@media (width >=1200px) {
			max-width: calc(var(--spacing) * 140);
		}
	}

	.xl\:max-w-145 {
		@media (width >=1200px) {
			max-width: calc(var(--spacing) * 145);
		}
	}

	.xl\:max-w-200 {
		@media (width >=1200px) {
			max-width: calc(var(--spacing) * 200);
		}
	}

	.xl\:max-w-260 {
		@media (width >=1200px) {
			max-width: calc(var(--spacing) * 260);
		}
	}

	.xl\:min-w-60 {
		@media (width >=1200px) {
			min-width: calc(var(--spacing) * 60);
		}
	}

	.xl\:-translate-x-full {
		@media (width >=1200px) {
			--tw-translate-x: -100%;
			translate: var(--tw-translate-x) var(--tw-translate-y);
		}
	}

	.xl\:-translate-y-10 {
		@media (width >=1200px) {
			--tw-translate-y: calc(var(--spacing) * -10);
			translate: var(--tw-translate-x) var(--tw-translate-y);
		}
	}

	.xl\:rotate-\[-360deg\] {
		@media (width >=1200px) {
			rotate: -360deg;
		}
	}

	.xl\:gap-5 {
		@media (width >=1200px) {
			gap: calc(var(--spacing) * 5);
		}
	}

	.xl\:gap-8\.75 {
		@media (width >=1200px) {
			gap: calc(var(--spacing) * 8.75);
		}
	}

	.xl\:gap-10 {
		@media (width >=1200px) {
			gap: calc(var(--spacing) * 10);
		}
	}

	.xl\:gap-17\.75 {
		@media (width >=1200px) {
			gap: calc(var(--spacing) * 17.75);
		}
	}

	.xl\:gap-22 {
		@media (width >=1200px) {
			gap: calc(var(--spacing) * 22);
		}
	}

	.xl\:rounded-md {
		@media (width >=1200px) {
			border-radius: var(--radius-md);
		}
	}

	.xl\:border {
		@media (width >=1200px) {
			border-style: var(--tw-border-style);
			border-width: 1px;
		}
	}

	.xl\:border-white\/20 {
		@media (width >=1200px) {
			border-color: color-mix(in srgb, #fff 20%, transparent);

			@supports (color: color-mix(in lab, red, red)) {
				border-color: color-mix(in oklab, var(--color-white) 20%, transparent);
			}
		}
	}

	.xl\:bg-secondary {
		@media (width >=1200px) {
			background-color: var(--color-secondary);
		}
	}

	.xl\:p-0 {
		@media (width >=1200px) {
			padding: calc(var(--spacing) * 0);
		}
	}

	.xl\:p-1\.25 {
		@media (width >=1200px) {
			padding: calc(var(--spacing) * 1.25);
		}
	}

	.xl\:p-5 {
		@media (width >=1200px) {
			padding: calc(var(--spacing) * 5);
		}
	}

	.xl\:p-12\.5 {
		@media (width >=1200px) {
			padding: calc(var(--spacing) * 12.5);
		}
	}

	.xl\:p-20 {
		@media (width >=1200px) {
			padding: calc(var(--spacing) * 20);
		}
	}

	.xl\:p-21\.25 {
		@media (width >=1200px) {
			padding: calc(var(--spacing) * 21.25);
		}
	}

	.xl\:px-6\.25 {
		@media (width >=1200px) {
			padding-inline: calc(var(--spacing) * 6.25);
		}
	}

	.xl\:px-8\.75 {
		@media (width >=1200px) {
			padding-inline: calc(var(--spacing) * 8.75);
		}
	}

	.xl\:px-28\.5 {
		@media (width >=1200px) {
			padding-inline: calc(var(--spacing) * 28.5);
		}
	}

	.xl\:py-5 {
		@media (width >=1200px) {
			padding-block: calc(var(--spacing) * 5);
		}
	}

	.xl\:py-8\.25 {
		@media (width >=1200px) {
			padding-block: calc(var(--spacing) * 8.25);
		}
	}

	.xl\:py-12\.5 {
		@media (width >=1200px) {
			padding-block: calc(var(--spacing) * 12.5);
		}
	}

	.xl\:py-17 {
		@media (width >=1200px) {
			padding-block: calc(var(--spacing) * 17);
		}
	}

	.xl\:py-20 {
		@media (width >=1200px) {
			padding-block: calc(var(--spacing) * 20);
		}
	}

	.xl\:py-25 {
		@media (width >=1200px) {
			padding-block: calc(var(--spacing) * 25);
		}
	}

	.xl\:py-32\.5 {
		@media (width >=1200px) {
			padding-block: calc(var(--spacing) * 32.5);
		}
	}

	.xl\:py-35 {
		@media (width >=1200px) {
			padding-block: calc(var(--spacing) * 35);
		}
	}

	.xl\:py-36\.25 {
		@media (width >=1200px) {
			padding-block: calc(var(--spacing) * 36.25);
		}
	}

	.xl\:py-37\.5 {
		@media (width >=1200px) {
			padding-block: calc(var(--spacing) * 37.5);
		}
	}

	.xl\:ps-5 {
		@media (width >=1200px) {
			padding-inline-start: calc(var(--spacing) * 5);
		}
	}

	.xl\:ps-10 {
		@media (width >=1200px) {
			padding-inline-start: calc(var(--spacing) * 10);
		}
	}

	.xl\:ps-12\.5 {
		@media (width >=1200px) {
			padding-inline-start: calc(var(--spacing) * 12.5);
		}
	}

	.xl\:pe-7\.5 {
		@media (width >=1200px) {
			padding-inline-end: calc(var(--spacing) * 7.5);
		}
	}

	.xl\:pe-12\.5 {
		@media (width >=1200px) {
			padding-inline-end: calc(var(--spacing) * 12.5);
		}
	}

	.xl\:pe-18 {
		@media (width >=1200px) {
			padding-inline-end: calc(var(--spacing) * 18);
		}
	}

	.xl\:pe-18\.5 {
		@media (width >=1200px) {
			padding-inline-end: calc(var(--spacing) * 18.5);
		}
	}

	.xl\:pe-32\.5 {
		@media (width >=1200px) {
			padding-inline-end: calc(var(--spacing) * 32.5);
		}
	}

	.xl\:pe-72 {
		@media (width >=1200px) {
			padding-inline-end: calc(var(--spacing) * 72);
		}
	}

	.xl\:pt-12\.5 {
		@media (width >=1200px) {
			padding-top: calc(var(--spacing) * 12.5);
		}
	}

	.xl\:pt-19 {
		@media (width >=1200px) {
			padding-top: calc(var(--spacing) * 19);
		}
	}

	.xl\:pt-33 {
		@media (width >=1200px) {
			padding-top: calc(var(--spacing) * 33);
		}
	}

	.xl\:pt-35\.25 {
		@media (width >=1200px) {
			padding-top: calc(var(--spacing) * 35.25);
		}
	}

	.xl\:pt-36\.25 {
		@media (width >=1200px) {
			padding-top: calc(var(--spacing) * 36.25);
		}
	}

	.xl\:pt-37\.5 {
		@media (width >=1200px) {
			padding-top: calc(var(--spacing) * 37.5);
		}
	}

	.xl\:pt-47 {
		@media (width >=1200px) {
			padding-top: calc(var(--spacing) * 47);
		}
	}

	.xl\:pt-50 {
		@media (width >=1200px) {
			padding-top: calc(var(--spacing) * 50);
		}
	}

	.xl\:pt-51\.25 {
		@media (width >=1200px) {
			padding-top: calc(var(--spacing) * 51.25);
		}
	}

	.xl\:pt-62\.25 {
		@media (width >=1200px) {
			padding-top: calc(var(--spacing) * 62.25);
		}
	}

	.xl\:pb-0 {
		@media (width >=1200px) {
			padding-bottom: calc(var(--spacing) * 0);
		}
	}

	.xl\:pb-5 {
		@media (width >=1200px) {
			padding-bottom: calc(var(--spacing) * 5)
				/* 1.25rem = 20px */
			;
		}
	}

	.xl\:pb-10 {
		@media (width >=1200px) {
			padding-bottom: calc(var(--spacing) * 10);
		}
	}

	.xl\:pb-17\.5 {
		@media (width >=1200px) {
			padding-bottom: calc(var(--spacing) * 17.5);
		}
	}

	.xl\:pb-25 {
		@media (width >=1200px) {
			padding-bottom: calc(var(--spacing) * 25);
		}
	}

	.xl\:pb-30 {
		@media (width >=1200px) {
			padding-bottom: calc(var(--spacing) * 30);
		}
	}

	.xl\:pb-36\.25 {
		@media (width >=1200px) {
			padding-bottom: calc(var(--spacing) * 36.25);
		}
	}

	.xl\:pb-37\.5 {
		@media (width >=1200px) {
			padding-bottom: calc(var(--spacing) * 37.5);
		}
	}

	.xl\:pb-40 {
		@media (width >=1200px) {
			padding-bottom: calc(var(--spacing) * 40);
		}
	}

	.xl\:pl-7\.5 {
		@media (width >=1200px) {
			padding-left: calc(var(--spacing) * 7.5);
		}
	}

	.xl\:text-2xl {
		@media (width >=1200px) {
			font-size: var(--text-2xl);
			line-height: var(--tw-leading, var(--text-2xl--line-height));
		}
	}

	.xl\:text-2xxl {
		@media (width >=1200px) {
			font-size: var(--text-2xxl);
			line-height: var(--tw-leading, var(--text-2xxl--line-height));
		}
	}

	.xl\:text-3xl\/10 {
		@media (width >=1200px) {
			font-size: var(--text-3xl);
			line-height: calc(var(--spacing) * 10);
		}
	}

	.xl\:text-4xxxl {
		@media (width >=1200px) {
			font-size: var(--text-4xxxl);
			line-height: var(--tw-leading, var(--text-4xxxl--line-height));
		}
	}

	.xl\:text-5xl {
		@media (width >=1200px) {
			font-size: var(--text-5xl);
			line-height: var(--tw-leading, var(--text-5xl--line-height));
		}
	}

	.xl\:text-6xl {
		@media (width >=1200px) {
			font-size: var(--text-6xl);
			line-height: var(--tw-leading, var(--text-6xl--line-height));
		}
	}

	.xl\:text-7xl {
		@media (width >=1200px) {
			font-size: var(--text-7xl);
			line-height: var(--tw-leading, var(--text-7xl--line-height));
		}
	}

	.xl\:text-8xl\/25 {
		@media (width >=1200px) {
			font-size: var(--text-8xl);
			line-height: calc(var(--spacing) * 25);
		}
	}

	.xl\:text-\[34px\]\/10 {
		@media (width >=1200px) {
			font-size: 34px;
			line-height: calc(var(--spacing) * 10);
		}
	}

	.xl\:text-base {
		@media (width >=1200px) {
			font-size: var(--text-base);
			line-height: var(--tw-leading, var(--text-base--line-height));
		}
	}

	.xl\:text-lg\/6 {
		@media (width >=1200px) {
			font-size: var(--text-lg);
			line-height: calc(var(--spacing) * 6);
		}
	}

	.xl\:text-xl {
		@media (width >=1200px) {
			font-size: var(--text-xl);
			line-height: var(--tw-leading, var(--text-xl--line-height));
		}
	}

	.xl\:text-2xxxl {
		@media (width >=1200px) {
			font-size: var(--text-2xxxl);
		}
	}

	.xl\:text-white {
		@media (width >=1200px) {
			color: var(--color-white);
		}
	}

	.xl\:opacity-0 {
		@media (width >=1200px) {
			opacity: 0%;
		}
	}

	.xl\:opacity-100 {
		@media (width >=1200px) {
			opacity: 100%;
		}
	}

	.\32 xl\:-bottom-24\.25 {
		@media (width >=1400px) {
			bottom: calc(var(--spacing) * -24.25);
		}
	}

	.\32 xl\:-bottom-25 {
		@media (width >=1400px) {
			bottom: calc(var(--spacing) * -25);
		}
	}

	.\32 xl\:order-1 {
		@media (width >=1400px) {
			order: 1;
		}
	}

	.\32 xl\:order-\[2\] {
		@media (width >=1400px) {
			order: 2;
		}
	}

	.\32 xl\:order-\[3\] {
		@media (width >=1400px) {
			order: 3;
		}
	}

	.\32 xl\:col-span-3 {
		@media (width >=1400px) {
			grid-column: span 3 / span 3;
		}
	}

	.\32 xl\:col-span-6 {
		@media (width >=1400px) {
			grid-column: span 6 / span 6;
		}
	}

	.\32 xl\:\!mx-20 {
		@media (width >=1400px) {
			margin-inline: calc(var(--spacing) * 20) !important;
		}
	}

	.\32 xl\:mx-10 {
		@media (width >=1400px) {
			margin-inline: calc(var(--spacing) * 10);
		}
	}

	.\32 xl\:mx-15 {
		@media (width >=1400px) {
			margin-inline: calc(var(--spacing) * 15);
		}
	}

	.\32 xl\:mx-17 {
		@media (width >=1400px) {
			margin-inline: calc(var(--spacing) * 17);
		}
	}

	.\32 xl\:me-5 {
		@media (width >=1400px) {
			margin-inline-end: calc(var(--spacing) * 5);
		}
	}

	.\32 xl\:-mt-10 {
		@media (width >=1400px) {
			margin-top: calc(var(--spacing) * -10);
		}
	}

	.\32 xl\:mr-3\.75 {
		@media (width >=1400px) {
			margin-right: calc(var(--spacing) * 3.75);
		}
	}

	.\32 xl\:mb-33\.75 {
		@media (width >=1400px) {
			margin-bottom: calc(var(--spacing) * 33.75);
		}
	}

	.\32 xl\:ml-3\.75 {
		@media (width >=1400px) {
			margin-left: calc(var(--spacing) * 3.75);
		}
	}

	.\32 xl\:ml-25 {
		@media (width >=1400px) {
			margin-left: calc(var(--spacing) * 25);
		}
	}

	.\32 xl\:w-37\.5 {
		@media (width >=1400px) {
			width: calc(var(--spacing) * 37.5);
		}
	}

	.\32 xl\:w-\[20\%\] {
		@media (width >=1400px) {
			width: 20%;
		}
	}

	.\32 xl\:w-\[60\%\] {
		@media (width >=1400px) {
			width: 60%;
		}
	}

	.\32 xl\:w-\[65\%\] {
		@media (width >=1400px) {
			width: 65%;
		}
	}

	.\32 xl\:max-w-200 {
		@media (width >=1400px) {
			max-width: calc(var(--spacing) * 200);
		}
	}

	.\32 xl\:min-w-84 {
		@media (width >=1400px) {
			min-width: calc(var(--spacing) * 84);
		}
	}

	.\32 xl\:gap-1\.25 {
		@media (width >=1400px) {
			gap: calc(var(--spacing) * 1.25);
		}
	}

	.\32 xl\:gap-5 {
		@media (width >=1400px) {
			gap: calc(var(--spacing) * 5);
		}
	}

	.\32 xl\:gap-7\.5 {
		@media (width >=1400px) {
			gap: calc(var(--spacing) * 7.5);
		}
	}

	.\32 xl\:gap-10 {
		@media (width >=1400px) {
			gap: calc(var(--spacing) * 10);
		}
	}

	.\32 xl\:p-4 {
		@media (width >=1400px) {
			padding: calc(var(--spacing) * 4);
		}
	}

	.\32 xl\:p-11\.25 {
		@media (width >=1400px) {
			padding: calc(var(--spacing) * 11.25);
		}
	}

	.\32 xl\:px-4\.5 {
		@media (width >=1400px) {
			padding-inline: calc(var(--spacing) * 4.5);
		}
	}

	.\32 xl\:px-15 {
		@media (width >=1400px) {
			padding-inline: calc(var(--spacing) * 15);
		}
	}

	.\32 xl\:py-31\.5 {
		@media (width >=1400px) {
			padding-block: calc(var(--spacing) * 31.5);
		}
	}

	.\32 xl\:py-33 {
		@media (width >=1400px) {
			padding-block: calc(var(--spacing) * 33);
		}
	}

	.\32 xl\:py-36 {
		@media (width >=1400px) {
			padding-block: calc(var(--spacing) * 36);
		}
	}

	.\32 xl\:ps-5 {
		@media (width >=1400px) {
			padding-inline-start: calc(var(--spacing) * 5);
		}
	}

	.\32 xl\:ps-12\.75 {
		@media (width >=1400px) {
			padding-inline-start: calc(var(--spacing) * 12.75);
		}
	}

	.\32 xl\:pt-26\.25 {
		@media (width >=1400px) {
			padding-top: calc(var(--spacing) * 26.25);
		}
	}

	.\32 xl\:pt-57 {
		@media (width >=1400px) {
			padding-top: calc(var(--spacing) * 57);
		}
	}

	.\32 xl\:pt-58 {
		@media (width >=1400px) {
			padding-top: calc(var(--spacing) * 58);
		}
	}

	.\32 xl\:pb-36\.25 {
		@media (width >=1400px) {
			padding-bottom: calc(var(--spacing) * 36.25);
		}
	}

	.\32 xl\:pb-37\.5 {
		@media (width >=1400px) {
			padding-bottom: calc(var(--spacing) * 37.5);
		}
	}

	.\32 xl\:text-4xxxl {
		@media (width >=1400px) {
			font-size: var(--text-4xxxl);
			line-height: var(--tw-leading, var(--text-4xxxl--line-height));
		}
	}

	.\32 xl\:text-3xl {
		@media (width >=1400px) {
			font-size: var(--text-3xl)
				/* 35px */
			;
			line-height: var(--tw-leading, var(--text-3xl--line-height)
					/* calc(2.25 / 1.875) ≈ 1.2 */
				);
		}
	}

	.\32 xl\:text-5xl {
		@media (width >=1400px) {
			font-size: var(--text-5xl);
			line-height: var(--tw-leading, var(--text-5xl--line-height));
		}
	}

	.\32 xl\:text-7xl {
		@media (width >=1400px) {
			font-size: var(--text-7xl);
			line-height: var(--tw-leading, var(--text-7xl--line-height));
		}
	}

	.\32 xl\:text-\[55px\]\/\[65px\] {
		@media (width >=1400px) {
			font-size: 55px;
			line-height: 65px;
		}
	}

	.\32 xl\:text-\[90px\]\/\[40px\] {
		@media (width >=1400px) {
			font-size: 90px;
			line-height: 40px;
		}
	}

	.\32 xl\:after\:left-\[8\%\] {
		@media (width >=1400px) {
			&::after {
				content: var(--tw-content);
				left: 8%;
			}
		}
	}

	.\33 xl\:-bottom-44\.25 {
		@media (width >=1600px) {
			bottom: calc(var(--spacing) * -44.25);
		}
	}

	.\33 xl\:bottom-0 {
		@media (width >=1600px) {
			bottom: calc(var(--spacing) * 0);
		}
	}

	.\33 xl\:\!mx-20 {
		@media (width >=1600px) {
			margin-inline: calc(var(--spacing) * 20) !important;
		}
	}

	.\33 xl\:-mt-28 {
		@media (width >=1600px) {
			margin-top: calc(var(--spacing) * -28);
		}
	}

	.\33 xl\:block {
		@media (width >=1600px) {
			display: block;
		}
	}

	.\33 xl\:h-48\.75 {
		@media (width >=1600px) {
			height: calc(var(--spacing) * 48.75);
		}
	}

	.\33 xl\:px-7\.5 {
		@media (width >=1600px) {
			padding-inline: calc(var(--spacing) * 7.5);
		}
	}

	.\33 xl\:px-22\.5 {
		@media (width >=1600px) {
			padding-inline: calc(var(--spacing) * 22.5);
		}
	}

	.\33 xl\:ps-28 {
		@media (width >=1600px) {
			padding-inline-start: calc(var(--spacing) * 28);
		}
	}

	.\33 xl\:ps-30 {
		@media (width >=1600px) {
			padding-inline-start: calc(var(--spacing) * 30);
		}
	}

	.\33 xl\:ps-42\.5 {
		@media (width >=1600px) {
			padding-inline-start: calc(var(--spacing) * 42.5);
		}
	}

	.\33 xl\:pe-71\.5 {
		@media (width >=1600px) {
			padding-inline-end: calc(var(--spacing) * 71.5);
		}
	}

	.\33 xl\:pt-40 {
		@media (width >=1600px) {
			padding-top: calc(var(--spacing) * 40);
		}
	}

	.\33 xl\:pr-20 {
		@media (width >=1600px) {
			padding-right: calc(var(--spacing) * 20);
		}
	}

	.\33 xl\:pb-47\.75 {
		@media (width >=1600px) {
			padding-bottom: calc(var(--spacing) * 47.75);
		}
	}

	.\33 xl\:text-lg {
		@media (width >=1600px) {
			font-size: var(--text-lg);
			line-height: var(--tw-leading, var(--text-lg--line-height));
		}
	}

	.\34 xl\:translate-x-\[-213px\] {
		@media (width >=1800px) {
			--tw-translate-x: -213px;
			translate: var(--tw-translate-x) var(--tw-translate-y);
		}
	}

	.dark\:block {
		&:where(.dark, .dark *) {
			display: block;
		}
	}

	.dark\:hidden {
		&:where(.dark, .dark *) {
			display: none;
		}
	}

	.dark\:inline-block {
		&:where(.dark, .dark *) {
			display: inline-block;
		}
	}

	.dark\:\!border-primary {
		&:where(.dark, .dark *) {
			border-color: var(--color-primary) !important;
		}
	}

	.dark\:border-white {
		&:where(.dark, .dark *) {
			border-color: var(--color-white);
		}
	}

	.dark\:border-white\/5 {
		&:where(.dark, .dark *) {
			border-color: color-mix(in srgb, #fff 5%, transparent);

			@supports (color: color-mix(in lab, red, red)) {
				border-color: color-mix(in oklab, var(--color-white) 5%, transparent);
			}
		}
	}

	.dark\:border-white\/10 {
		&:where(.dark, .dark *) {
			border-color: color-mix(in srgb, #fff 10%, transparent);

			@supports (color: color-mix(in lab, red, red)) {
				border-color: color-mix(in oklab, var(--color-white) 10%, transparent);
			}
		}
	}

	.dark\:border-white\/20 {
		&:where(.dark, .dark *) {
			border-color: color-mix(in srgb, #fff 20%, transparent);

			@supports (color: color-mix(in lab, red, red)) {
				border-color: color-mix(in oklab, var(--color-white) 20%, transparent);
			}
		}
	}

	.dark\:\!bg-light {
		&:where(.dark, .dark *) {
			background-color: var(--color-light) !important;
		}
	}

	.dark\:\!bg-white\/15 {
		&:where(.dark, .dark *) {
			background-color: color-mix(in srgb, #fff 15%, transparent) !important;

			@supports (color: color-mix(in lab, red, red)) {
				background-color: color-mix(in oklab, var(--color-white) 15%, transparent) !important;
			}
		}
	}

	.dark\:bg-bg4 {
		&:where(.dark, .dark *) {
			background-color: var(--color-bg4);
		}
	}

	.dark\:bg-black\/50 {
		&:where(.dark, .dark *) {
			background-color: color-mix(in srgb, #000 50%, transparent);

			@supports (color: color-mix(in lab, red, red)) {
				background-color: color-mix(in oklab, var(--color-black) 50%, transparent);
			}
		}
	}

	.dark\:bg-bodybg {
		&:where(.dark, .dark *) {
			background-color: var(--color-bodybg);
		}
	}

	.dark\:bg-dark {
		&:where(.dark, .dark *) {
			background-color: var(--color-dark);
		}
	}

	.dark\:bg-light {
		&:where(.dark, .dark *) {
			background-color: var(--color-light);
		}
	}

	.dark\:bg-white {
		&:where(.dark, .dark *) {
			background-color: var(--color-white);
		}
	}

	.dark\:bg-white\/50 {
		&:where(.dark, .dark *) {
			background-color: color-mix(in srgb, #fff 50%, transparent);

			@supports (color: color-mix(in lab, red, red)) {
				background-color: color-mix(in oklab, var(--color-white) 50%, transparent);
			}
		}
	}

	.dark\:fill-white {
		&:where(.dark, .dark *) {
			fill: var(--color-white);
		}
	}

	.dark\:stroke-\[\#aac1bb\] {
		&:where(.dark, .dark *) {
			stroke: #aac1bb;
		}
	}

	.dark\:stroke-\[\#fff\] {
		&:where(.dark, .dark *) {
			stroke: #fff;
		}
	}

	.dark\:stroke-white {
		&:where(.dark, .dark *) {
			stroke: var(--color-white);
		}
	}

	.dark\:\!text-white {
		&:where(.dark, .dark *) {
			color: var(--color-white) !important;
		}
	}

	.dark\:text-\[\#aac1bb\] {
		&:where(.dark, .dark *) {
			color: #aac1bb;
		}
	}

	.dark\:text-bodyfg {
		&:where(.dark, .dark *) {
			color: var(--color-bodyfg);
		}
	}

	.dark\:text-bodytext {
		&:where(.dark, .dark *) {
			color: var(--color-bodytext);
		}
	}

	.dark\:text-lightgreen {
		&:where(.dark, .dark *) {
			color: var(--color-lightpurple);
		}
	}

	.dark\:text-lightgrey {
		&:where(.dark, .dark *) {
			color: var(--color-lightgrey);
		}
	}

	.dark\:text-primary {
		&:where(.dark, .dark *) {
			color: var(--color-primary);
		}
	}

	.dark\:text-secondary {
		&:where(.dark, .dark *) {
			color: var(--color-secondary);
		}
	}

	.dark\:text-title {
		&:where(.dark, .dark *) {
			color: var(--color-title);
		}
	}

	.dark\:text-white {
		&:where(.dark, .dark *) {
			color: var(--color-white);
		}
	}

	.dark\:text-white\/50 {
		&:where(.dark, .dark *) {
			color: color-mix(in srgb, #fff 50%, transparent);

			@supports (color: color-mix(in lab, red, red)) {
				color: color-mix(in oklab, var(--color-white) 50%, transparent);
			}
		}
	}

	.dark\:text-white\/60 {
		&:where(.dark, .dark *) {
			color: color-mix(in srgb, #fff 60%, transparent);

			@supports (color: color-mix(in lab, red, red)) {
				color: color-mix(in oklab, var(--color-white) 60%, transparent);
			}
		}
	}

	.dark\:text-white\/70 {
		&:where(.dark, .dark *) {
			color: color-mix(in srgb, #fff 70%, transparent);

			@supports (color: color-mix(in lab, red, red)) {
				color: color-mix(in oklab, var(--color-white) 70%, transparent);
			}
		}
	}

	.dark\:outline-white {
		&:where(.dark, .dark *) {
			outline-color: var(--color-white);
		}
	}

	.dark\:before\:bg-white {
		&:where(.dark, .dark *) {
			&::before {
				content: var(--tw-content);
				background-color: var(--color-white);
			}
		}
	}

	.dark\:before\:bg-white\/10 {
		&:where(.dark, .dark *) {
			&::before {
				content: var(--tw-content);
				background-color: color-mix(in srgb, #fff 10%, transparent);

				@supports (color: color-mix(in lab, red, red)) {
					background-color: color-mix(in oklab, var(--color-white) 10%, transparent);
				}
			}
		}
	}

	.dark\:before\:text-white {
		&:where(.dark, .dark *) {
			&::before {
				content: var(--tw-content);
				color: var(--color-white);
			}
		}
	}

	.dark\:after\:bg-primary {
		&:where(.dark, .dark *) {
			&::after {
				content: var(--tw-content);
				background-color: var(--color-primary);
			}
		}
	}

	.dark\:after\:bg-white\/10 {
		&:where(.dark, .dark *) {
			&::after {
				content: var(--tw-content);
				background-color: color-mix(in srgb, #fff 10%, transparent);

				@supports (color: color-mix(in lab, red, red)) {
					background-color: color-mix(in oklab, var(--color-white) 10%, transparent);
				}
			}
		}
	}

	.dark\:after\:mix-blend-color-burn {
		&:where(.dark, .dark *) {
			&::after {
				content: var(--tw-content);
				mix-blend-mode: color-burn;
			}
		}
	}

	.dark\:hover\:bg-bodyfg {
		&:where(.dark, .dark *) {
			&:hover {
				@media (hover: hover) {
					background-color: var(--color-bodyfg);
				}
			}
		}
	}

	.dark\:hover\:text-dark {
		&:where(.dark, .dark *) {
			&:hover {
				@media (hover: hover) {
					color: var(--color-dark);
				}
			}
		}
	}

	.dark\:hover\:text-primary {
		&:where(.dark, .dark *) {
			&:hover {
				@media (hover: hover) {
					color: var(--color-primary);
				}
			}
		}
	}

	.max-lg\:dark\:border-secondary {
		@media (width < 992px) {
			&:where(.dark, .dark *) {
				border-color: var(--color-secondary);
			}
		}
	}

	.max-lg\:dark\:text-secondary {
		@media (width < 992px) {
			&:where(.dark, .dark *) {
				color: var(--color-secondary);
			}
		}
	}

	.max-lg\:dark\:text-white {
		@media (width < 992px) {
			&:where(.dark, .dark *) {
				color: var(--color-white);
			}
		}
	}

	.\[\.swiper-slide\.swiper-slide-active\]\:\!opacity-100 {
		&:is(.swiper-slide.swiper-slide-active) {
			opacity: 100% !important;
		}
	}

	.\[\.site-header\.is-fixed_\&\]\:block {
		.site-header.is-fixed & {
			display: block;
		}
	}

	.\[\.site-header\.is-fixed_\&\]\:hidden {
		.site-header.is-fixed & {
			display: none;
		}
	}

	.\[\.tab-underline\.active_\&\]\:bg-white {
		.tab-underline.active & {
			background-color: var(--color-white);
		}
	}
}


.bg-green {
	background-color: var(--color-green)
		/* oklch(72.3% 0.219 149.579) */
	;
}

.hover\:bg-green-medium {
	&:hover {
		@media (hover: hover) {
			background-color: var(--color-green-medium)
				/* oklch(62.7% 0.194 149.214) */
			;
		}
	}
}

:root {
	--primary: #a868fe;
	--primarydark: #1B2D00;
	--primarylight: #cfb6ff;
	--secondary: #31153d;
	--secondarylight: #dbcef4;
	--bodybg: #18001f;
	--bodyfg: #fff;
	--bodytext: #687B76;
	--card: #292D32;
	--title: #fff;
	--black: #000;
}

.pxl-loader {
	background: var(--color-bodybg);
	height: 100vh;
	position: fixed;
	width: 100%;
	z-index: 999999;
	top: 0;
	left: 0;
	-webkit-transition: all 300ms cubic-bezier(0.4, 0, 1, 1);
	-khtml-transition: all 300ms cubic-bezier(0.4, 0, 1, 1);
	-moz-transition: all 300ms cubic-bezier(0.4, 0, 1, 1);
	-ms-transition: all 300ms cubic-bezier(0.4, 0, 1, 1);
	-o-transition: all 300ms cubic-bezier(0.4, 0, 1, 1);
	transition: all 300ms cubic-bezier(0.4, 0, 1, 1);
}

.pxl-loader.style-3 .loading-dot-spinner {
	position: absolute;
	width: 60px;
	height: 60px;
	border-radius: 50%;
	opacity: 0.4;
	background: var(--color-bglight);
	animation: loaderAnim 0.7s linear infinite alternate forwards;
	margin: -30px 0 0 -30px;
	top: 50%;
	left: 50%;
}

.row {
	display: flex;
	flex-wrap: wrap;
	--bs-gutter-x: 30px;
	--bs-gutter-y: 0;
	margin-top: calc(-1 * var(--bs-gutter-y));
	margin-right: calc(-.5 * var(--bs-gutter-x));
	margin-left: calc(-.5 * var(--bs-gutter-x));
}

.row>* {
	max-width: 100%;
	flex-shrink: 0;
	padding-right: calc(var(--bs-gutter-x) * .5);
	padding-left: calc(var(--bs-gutter-x) * .5);
	margin-top: var(--bs-gutter-y);
}

.card {
	display: flex;
	flex-direction: column;
}

@layer base {
	* {
		scrollbar-width: thin;
	}

	body {
		background-color: var(--color-bglight);
		font-family: var(--font-base);

		&:where(.dark, .dark *) {
			background-color: var(--color-bodybg);
		}
	}

	.page-wraper {
		background-color: var(--color-bglight);

		&:where(.dark, .dark *) {
			background-color: var(--color-bodybg);
		}
	}

	section {
		position: relative;
	}

	h1,
	.h1,
	h2,
	.h2,
	h3,
	.h {
		--tw-font-weight: var(--font-weight-bold);
		font-weight: var(--font-weight-bold);
		color: #fff;

		&:where(.dark, .dark *) {
			color: var(--color-title);
		}
	}

	h4,
	.h4,
	h5,
	.h5,
	h6,
	.h6 {
		--tw-font-weight: var(--font-weight-bold);
		font-weight: var(--font-weight-bold);
		color: #fff;

		&:where(.dark, .dark *) {
			color: var(--color-title);
		}
	}

	p {
		color: var(--color-lightpurple);

		&:where(.dark, .dark *) {
			color: var(--color-bodytext);
		}
	}
}

@layer utilities {
	.content-counter::after {
		content: "0" counter(counter-item);
	}
}

a {
	cursor: pointer;
	--tw-duration: 500ms;
	transition-duration: 500ms;
}

textarea,
input {
	outline-style: var(--tw-outline-style);
	outline-width: 0px;
	--tw-outline-style: none;
	outline-style: none;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

input[type=number] {
	-moz-appearance: textfield;
}

.theme-btn .active {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 0;
	width: 40px;
	height: 40px;
	background: #ffffff;
	border-radius: 50px;
	z-index: 1;
	transition: 0.5s;
}

#pointer-ring {
	left: 0;
	top: 0;
	width: 40px;
	height: 40px;
	display: block;
	border: 1px solid var(--primary) !important;
	position: fixed;
	border-radius: 100px;
	z-index: 999999;
	pointer-events: none;
	transition: width 0.3s, height 0.3s;
}

#pointer-ring.active {
	width: 60px;
	height: 60px;
	opacity: 0.5;
	background-color: rgba(255, 255, 255, 0.2);
	border: 0 !important;
}

.link-hover {
	position: relative;

	&:hover {
		@media (hover: hover) {
			&::after {
				content: var(--tw-content);
				right: auto;
			}
		}
	}

	&:hover {
		@media (hover: hover) {
			&::after {
				content: var(--tw-content);
				left: calc(var(--spacing) * 0);
			}
		}
	}

	&:hover {
		@media (hover: hover) {
			&::after {
				content: var(--tw-content);
				width: 100%;
			}
		}
	}
}

.link-hover::after {
	position: absolute;
	right: calc(var(--spacing) * 0);
	bottom: calc(var(--spacing) * 0);
	height: 1px;
	width: calc(var(--spacing) * 0);
	background-color: var(--color-secondary);
	--tw-duration: 500ms;
	transition-duration: 500ms;
	--tw-content: '';
	content: var(--tw-content);
}

.svg-currentcolor path {
	stroke: currentColor;
}

.stackCard {
	transform-origin: 50% -115%;
}

#videoContainer iframe,
#videoContainer video {
	width: 100%;
	height: 676px;
	border: none;
	border-radius: 8px;
}

.anime-row .num-circle {
	transition: .3s all;
}

.anime-row.active .num-circle {
	background-color: var(--primary);
	color: #000;
}

.dzFormMsg .alert-success {
	margin-bottom: calc(var(--spacing) * 2.5);
	background-color: var(--color-secondary);
	padding: calc(var(--spacing) * 5);
	color: var(--color-white);
}

.dzFormMsg .alert-danger {
	margin-bottom: calc(var(--spacing) * 2.5);
	background-color: var(--color-red);
	padding: calc(var(--spacing) * 5);
	color: var(--color-white);
}

#scrollProgress.active {
	opacity: 1;
	pointer-events: auto;
}

@font-face {
	font-family: juana;
	src: url(../fonts/juana/Fontspring-DEMO-juana-blackit.otf);
	font-weight: 800;
}

@font-face {
	font-family: juana;
	src: url(../fonts/juana/Fontspring-DEMO-juana-boldit.otf);
	font-weight: 700;
}

@font-face {
	font-family: juana;
	src: url(../fonts/juana/Fontspring-DEMO-juana-semiboldit.otf);
	font-weight: 600;
}

@font-face {
	font-family: juana;
	src: url(../fonts/juana/Fontspring-DEMO-juana-extralightit.otf);
	font-weight: 200;
}

@font-face {
	font-family: juana;
	src: url(../fonts/juana/Fontspring-DEMO-juana-lightit.otf);
	font-weight: 300;
}

@font-face {
	font-family: juana;
	src: url(../fonts/juana/Fontspring-DEMO-juana-mediumit.otf);
	font-weight: 500;
}

@font-face {
	font-family: juana;
	src: url(../fonts/juana/Fontspring-DEMO-juana-regularit.otf);
	font-weight: 400;
}

@font-face {
	font-family: juana;
	src: url(../fonts/juana/Fontspring-DEMO-juana-thinit.otf);
	font-weight: 100;
}

@keyframes rotate {
	0% {
		transform: rotate(0deg);
	}

	100% {
		transform: rotate(360deg);
	}
}

@keyframes toTopFromBottom {
	49% {
		-webkit-transform: translate(100%, -100%);
	}

	50% {
		opacity: 0;
		-webkit-transform: translate(-100%, 100%);
	}

	51% {
		opacity: 1;
	}
}

@keyframes ScaleInOut {
	0% {
		-webkit-transform: scale(1);
		transform: scale(1);
	}

	50% {
		-webkit-transform: scale(1.3);
		transform: scale(1.3);
	}

	100% {
		-webkit-transform: scale(1);
		transform: scale(1);
	}
}

@keyframes ripple-1 {
	0% {
		transform: scale(.9);
		opacity: 1;
	}

	100% {
		transform: scale(1.3);
		opacity: 0;
	}
}

@keyframes toLeftFromRight {
	49% {
		transform: translateX(100%);
	}

	50% {
		opacity: 0;
		transform: translateX(-100%);
	}

	51% {
		opacity: 1;
	}
}

@keyframes toRightFromLeft {
	49% {
		transform: translateX(-100%);
	}

	50% {
		opacity: 0;
		transform: translateX(100%);
	}

	51% {
		opacity: 1;
	}
}

@keyframes pxl-wide-menu-underline {
	0% {
		background-size: 100% 100%;
		background-position-x: 100%;
	}

	100% {
		background-size: 0 100%;
		background-position-x: 100%;
	}
}

@keyframes pxl-wide-menu-underline-hover {
	0% {
		background-position-x: 0;
		background-size: 0 100%;
	}

	100% {
		background-position-x: 0;
		background-size: 100% 100%;
	}
}

@keyframes headerSlideDown {
	0% {
		margin-top: -150px;
	}

	100% {
		margin-top: 0;
	}
}

@keyframes loaderAnim {
	100% {
		opacity: 1;
		transform: scale3d(0.5, 0.5, 1);
	}
}

@layer components {
	.btn {
		position: relative;
		display: inline-flex;
		height: calc(var(--spacing) * 13);
		align-items: center;
		overflow: hidden;
		border-radius: calc(infinity * 1px);
		padding-inline: calc(var(--spacing) * 3.75);
		padding-block: calc(var(--spacing) * 3);
		font-size: var(--text-base);
		line-height: var(--tw-leading, var(--text-base--line-height));
		--tw-leading: var(--leading-normal);
		line-height: var(--leading-normal);
		--tw-font-weight: var(--font-weight-medium);
		font-weight: var(--font-weight-medium);
		white-space: nowrap;
	}

	@media screen and (max-width: 567px) {
		.btn {
			height: calc(var(--spacing) * 12.5);
			padding-inline: calc(var(--spacing) * 3.5);
			padding-block: calc(var(--spacing) * 2);
		}
	}

	@media screen and (max-width: 768px) {
		.btn {
			font-size: var(--text-lg);
			line-height: var(--tw-leading, var(--text-lg--line-height));
		}
	}

	@media screen and (max-width: 567px) {
		.btn {
			font-size: var(--text-base);
			line-height: var(--tw-leading, var(--text-base--line-height));
		}
	}

	@keyframes anglerotate {
		from {
			--angle: 0deg;
		}

		to {
			--angle: 360deg;
		}
	}

	@property --angle {
		syntax: "<angle>";
		initial-value: 0deg;
		inherits: false;
	}

	.btn-black {
		height: calc(var(--spacing) * 10);
		background-color: var(--color-secondary);
		color: var(--color-white);
		--tw-duration: 500ms;
		transition-duration: 500ms;
	}

	.btn-black:hover {
		background-color: var(--color-primary);
		color: var(--color-secondary);
	}

	.btn-sm {
		padding-inline: calc(var(--spacing) * 3.75);
		padding-block: calc(var(--spacing) * 2.5) !important;
		font-size: var(--text-2sm);
		line-height: var(--tw-leading, var(--text-2sm--line-height));
	}

	.btn-icon {
		width: calc(var(--spacing) * 10);
		height: calc(var(--spacing) * 10);
		justify-content: center;
		padding: calc(var(--spacing) * 0);
	}

	.btn-hover::before {
		content: "";
		position: absolute;
		left: 0;
		bottom: 0;
		right: 0;
		top: 0;
		background-color: var(--heading-color);
		transform-origin: bottom left;
		-webkit-transition: all 250ms linear 0s;
		-khtml-transition: all 250ms linear 0s;
		-moz-transition: all 250ms linear 0s;
		-ms-transition: all 250ms linear 0s;
		-o-transition: all 250ms linear 0s;
		transition: all 250ms linear 0s;
		-webkit-transform: scale(0);
		-khtml-transform: scale(0);
		-moz-transform: scale(0);
		-ms-transform: scale(0);
		-o-transform: scale(0);
		transform: scale(0);
		z-index: 0;
	}

	.btn-outline.btn-hover::before {
		background-color: #191B1D;
	}

	.btn-outline.primary.btn-hover::before {
		background-color: #E3FF75;
	}

	.btn.btn-hover:hover::before {
		-webkit-transform: scale(1);
		-khtml-transform: scale(1);
		-moz-transform: scale(1);
		-ms-transform: scale(1);
		-o-transform: scale(1);
		transform: scale(1);
	}

	.btn.button--stroke:hover,
	.btn.button--stroke:hover {
		color: var(--color-primary) !important;
	}

	.hover-primary.btn.button--stroke:hover,
	.hover-primary.btn.button--stroke:hover {
		color: var(--color-secondary) !important;
	}

	.button-flair {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		pointer-events: none;
		transform: scale(0);
	}

	.button-flair:before {
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		width: 200%;
		aspect-ratio: 1 / 1;
		background-color: var(--secondary);
		border-radius: 50%;
		transform: translate(-50%, -50%);
		pointer-events: none;
	}

	.hover-primary .button-flair:before {
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		width: 200%;
		aspect-ratio: 1 / 1;
		background-color: var(--primary);
		border-radius: 50%;
		transform: translate(-50%, -50%);
		pointer-events: none;
	}

	.button--stroke:hover .button__label {
		transition: color 0.15s cubic-bezier(0.645, 0.045, 0.355, 1);
	}

	.button__label {
		position: relative;
		text-align: center;
		transition: color 0.05s cubic-bezier(0.645, 0.045, 0.355, 1);
	}

	.button--stroke:after {
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		pointer-events: none;
	}

	.button--stroke .button-flair {
		transform: scale(0);
		transform-origin: 0 0;
	}
}

.swiper-button-next::after,
.swiper-button-prev::after {
	display: none;
}

.style-1.swiper-pagination .swiper-pagination-bullet {
	margin-inline: calc(var(--spacing) * 2.5);
	margin-block: calc(var(--spacing) * 0);
	border-radius: var(--radius-md);
	background-color: #D9D9D9;
	opacity: 100%;
	--tw-duration: 500ms;
	transition-duration: 500ms;
}

.style-1.swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
	width: calc(var(--spacing) * 30);
	background-color: var(--color-primary);
}

.blog-swiper .swiper-slide:nth-child(even) .blog-card {
	@media (width >=576px) {
		padding-top: calc(var(--spacing) * 17.5);
	}
}

.pxl-swiper-thumbs {
	margin: 0 10px;
	margin-bottom: 10px;
}

.pxl-swiper-slider:not(.pxl-swiper-initialized) {
	.pxl-swiper-slider-wrap {
		visibility: hidden;
	}
}

.pxl-testimonial-carousel.layout-1 .item-inner .item-image {
	border-radius: 50%;
	overflow: hidden;
	border: 2px solid #fff;
	transition: all 350ms ease-in-out 0s;
}

.pxl-testimonial-carousel.layout-1 .pxl-swiper-slider-wrap {
	max-width: 405px;
	margin: 50px auto 37px;
	user-select: none;
}

.pxl-testimonial-carousel.layout-1 .pxl-swiper-slider-wrap .pxl-swiper-slide {
	transition: transform 0.25s ease, left 0.25s ease;
}

.pxl-testimonial-carousel.layout-1 .pxl-swiper-slider-wrap .pxl-swiper-slide .item-image {
	transform: scale(0.5073);
}

.pxl-testimonial-carousel.layout-1 .pxl-swiper-slider-wrap .pxl-swiper-slide.swiper-slide-active .item-info-wrap {
	opacity: 1;
}

.pxl-testimonial-carousel.layout-1 .pxl-swiper-slider-wrap .pxl-swiper-slide.swiper-slide-active .item-info-wrap>* {
	opacity: 1;
	transform: translateY(0);
}

.pxl-testimonial-carousel.layout-1 .pxl-swiper-slider-wrap .pxl-swiper-slide.swiper-slide-active .item-image {
	transform: scale(1);
}

.pxl-testimonial-carousel.layout-1 .pxl-swiper-slider-wrap .pxl-swiper-slide.swiper-slide-prev .item-image,
.pxl-testimonial-carousel.layout-1 .pxl-swiper-slider-wrap .pxl-swiper-slide.swiper-slide-next .item-image {
	transform: scale(0.7971);
}

.pxl-testimonial-carousel.layout-1 .pxl-swiper-slider-wrap .custom-next-after-prev {
	transform: translateX(17px);
}

.pxl-testimonial-carousel.layout-1 .pxl-swiper-slider-wrap .custom-prev-before-next {
	transform: translateX(-17px);
}

.pxl-testimonial-carousel.layout-1 .pxl-swiper-slider-wrap .item-name {
	font-size: 16px;
	line-height: 25px;
	font-weight: 600;
	color: #fff;
	text-transform: capitalize;
	margin-bottom: -3px;
}

.pxl-testimonial-carousel.layout-1 .pxl-swiper-slider-wrap .item-position {
	color: rgba(255, 255, 255, 0.5);
	font-size: 14px;
	font-weight: 500;
	text-transform: uppercase;
}

.pxl-testimonial-carousel.layout-1 .item-info-wrap {
	margin-top: 6px;
	display: flex;
	flex-direction: column;
	white-space: nowrap;
	opacity: 0;
	transition: all 350ms ease-in-out 0s;
}

.pxl-testimonial-carousel.layout-1 .item-info-wrap>* {
	opacity: 0;
	transform: translateY(10px);
	transition: all 350ms ease-in-out 0s;
}

.pxl-testimonial-carousel.layout-1 .item-info-wrap>*:nth-child(1) {
	transition-delay: 120ms;
}

.pxl-testimonial-carousel.layout-1 .item-info-wrap>*:nth-child(2) {
	transition-delay: 180ms;
}

.pxl-testimonial-carousel.layout-1 .item-description {
	max-width: 395px;
	font-weight: 300;
	color: var(--heading-color);
	display: -webkit-box;
	max-height: 3960px*px;
	font-size: 22px;
	line-height: 30px;
	overflow: hidden;
	text-overflow: ellipsis;
	-webkit-line-clamp: 6;
	-khtml-line-clamp: 6;
	-moz-line-clamp: 6;
	-ms-line-clamp: 6;
	-o-line-clamp: 6;
	line-clamp: 6;
	-webkit-box-orient: vertical;
	-khtml-box-orient: vertical;
	-moz-box-orient: vertical;
	-ms-box-orient: vertical;
	-o-box-orient: vertical;
	box-orient: vertical;
}

.pxl-testimonial-carousel.layout-1 .item-description>* {
	display: -webkit-box;
	max-height: 3960px*px;
	font-size: 22px;
	line-height: 30px;
	overflow: hidden;
	text-overflow: ellipsis;
	-webkit-line-clamp: 6;
	-khtml-line-clamp: 6;
	-moz-line-clamp: 6;
	-ms-line-clamp: 6;
	-o-line-clamp: 6;
	line-clamp: 6;
	-webkit-box-orient: vertical;
	-khtml-box-orient: vertical;
	-moz-box-orient: vertical;
	-ms-box-orient: vertical;
	-o-box-orient: vertical;
	box-orient: vertical;
}

@media (max-width: 575px) {
	.pxl-testimonial-carousel.layout-1 .swiper-slide-thumb-active .thumbs-wrap {
		opacity: 1;
	}
}

.pxl-testimonial-carousel.layout-1 .thumbs-wrap {
	background-color: #fff;
	border-radius: 30px;
	justify-content: space-between;
	overflow: hidden;
	gap: 20px;
}

@media (max-width: 575px) {
	.pxl-testimonial-carousel.layout-1 .thumbs-wrap {
		flex-direction: column;
		opacity: 0;
		transition: all 350ms ease-in-out 0s;
	}
}

.pxl-testimonial-carousel.layout-1 .thumbs-wrap .thumbs-image {
	overflow: hidden;
}

.pxl-testimonial-carousel.layout-1 .thumbs-wrap img {
	-webkit-transition: all 0.5s;
	-khtml-transition: all 0.5s;
	-moz-transition: all 0.5s;
	-ms-transition: all 0.5s;
	-o-transition: all 0.5s;
	transition: all 0.5s;
	-webkit-transform: scale(1.05) translateX(-3px);
	transform: scale(1.05) translateX(-3px);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

@media (max-width: 575px) {
	.pxl-testimonial-carousel.layout-1 .thumbs-wrap img {
		width: 100%;
		max-height: 300px;
		object-fit: cover;
	}
}

.pxl-testimonial-carousel.layout-1 .thumbs-wrap:hover img {
	-webkit-transform: scale(1) translateX(0);
	transform: scale(1) translateX(0);
}

.pxl-testimonial-carousel.layout-1 .thumbs-wrap .thumbs-content {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	padding: 42px 0 38px 40px;
	gap: 20px;
}

@media (max-width: 767px) {
	.pxl-testimonial-carousel.layout-1 .thumbs-wrap .thumbs-content {
		padding: 30px 0 25px 25px;
		gap: 0;
	}
}

@media (max-width: 767px) {
	.pxl-testimonial-carousel.layout-1 .thumbs-wrap .thumbs-content {
		padding: 30px 20px 10px 20px;
	}
}

.pxl-testimonial-carousel.layout-1 .thumbs-wrap .thumbs-name-position {
	flex-direction: column;
}

.pxl-testimonial-carousel.layout-1 .thumbs-wrap .thumbs-name {
	font-size: 24px;
	line-height: 35px;
	font-weight: 600;
	color: var(--heading-color);
	text-transform: capitalize;
}

.pxl-testimonial-carousel.layout-1 .thumbs-wrap .thumbs-position {
	color: #666666;
	font-size: 14px;
	text-transform: uppercase;
}

.pxl-testimonial-carousel.layout-1 .content-title {
	font-size: var(--text-4xl);
	line-height: calc(var(--spacing) * 40);

	@media (width >=576px) {
		font-size: 45px;
		line-height: calc(var(--spacing) * 48);
	}

	@media (width >=768px) {
		font-size: 55px;
		line-height: calc(var(--spacing) * 58);
	}

	color: #ffffff;
	max-width: 502px;
	margin: 0 auto;
	text-align: center;
	text-transform: capitalize;
	padding-top: 80px;
}

.pxl-swiper-container {
	margin-left: auto;
	margin-right: auto;
	position: relative;
	overflow: visible;
	z-index: 0;
}

.pxl-swiper-wrapper {
	position: relative;
	width: 100%;
	height: 100%;
	z-index: 1;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-transition: transform .4s linear;
	-khtml-transition: transform .4s linear;
	-moz-transition: transform .4s linear;
	-ms-transition: transform .4s linear;
	-o-transition: transform .4s linear;
	transition: transform .4s linear;
	-webkit-box-sizing: content-box;
	box-sizing: content-box;
}

.pxl-swiper-slide {
	-ms-flex-negative: 0;
	flex-shrink: 0;
	width: 100%;
	height: 100%;
	position: relative;
}

.non-swiper-slide {
	display: none;
}

.swiper-container-multirow-column>.pxl-swiper-wrapper {
	flex-wrap: wrap;
	flex-direction: column;
}

.swiper-container-multirow-column>.pxl-swiper-wrapper .pxl-swiper-slide {
	height: calc((100% - 40px)/2);
}

.swiper-container-multirow-row>.pxl-swiper-wrapper {
	flex-wrap: wrap;
	flex-direction: row;
}

.swiper-container-multirow-row>.pxl-swiper-wrapper .pxl-swiper-slide {
	height: calc((100% - 40px)/2);
}

.swiper-container-vertical>.pxl-swiper-wrapper {
	flex-direction: column;
}

.swiper-container-cube .swiper-cube-shadow {
	display: none;
	opacity: 0;
	visibility: hidden;
}

.pxl-swiper-arrows.custom {
	display: flex;
}

.pxl-swiper-arrow {
	font-size: 20px;
	width: auto;
	height: auto;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 2;
	text-align: center;
	cursor: pointer;
	-webkit-transition: all .3s ease;
	-khtml-transition: all .3s ease;
	-moz-transition: all .3s ease;
	-ms-transition: all .3s ease;
	-o-transition: all .3s ease;
	transition: all .3s ease;
}

.pxl-swiper-arrow:hover {
	color: var(--primary-color);
}

.pxl-swiper-arrow .pxl-icon {
	line-height: 1;
}

.pxl-swiper-arrow .pxl-icon span {
	-webkit-transition: all .3s ease;
	-khtml-transition: all .3s ease;
	-moz-transition: all .3s ease;
	-ms-transition: all .3s ease;
	-o-transition: all .3s ease;
	transition: all .3s ease;
}

.pxl-swiper-arrow.swiper-button-disabled {
	cursor: not-allowed;
}

.pxl-swiper-arrow-prev .cmli-noun-arrow {
	-webkit-transform: rotate(180deg);
	-khtml-transform: rotate(180deg);
	-moz-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	-o-transform: rotate(180deg);
	transform: rotate(180deg);
}

.nav-in-vertical .pxl-swiper-arrow,
.nav-out-vertical .pxl-swiper-arrow {
	position: absolute;
	top: 50%;
	-webkit-transform: translate(0, -50%);
	-khtml-transform: translate(0, -50%);
	-moz-transform: translate(0, -50%);
	-ms-transform: translate(0, -50%);
	-o-transform: translate(0, -50%);
	transform: translate(0, -50%);
}

.nav-in-vertical .pxl-swiper-arrow-prev {
	left: 30px;
}

.nav-in-vertical .pxl-swiper-arrow-next {
	right: 30px;
}

.nav-in-vertical.arrow-on-hover .pxl-swiper-arrow-prev {
	opacity: 0;
	-webkit-transform: translate(50px, -50%);
	-khtml-transform: translate(50px, -50%);
	-moz-transform: translate(50px, -50%);
	-ms-transform: translate(50px, -50%);
	-o-transform: translate(50px, -50%);
	transform: translate(50px, -50%);
	-webkit-transition: all .3s linear 0s;
	-khtml-transition: all .3s linear 0s;
	-moz-transition: all .3s linear 0s;
	-ms-transition: all .3s linear 0s;
	-o-transition: all .3s linear 0s;
	transition: all .3s linear 0s;
}

.nav-in-vertical.arrow-on-hover .pxl-swiper-arrow-next {
	opacity: 0;
	-webkit-transform: translate(-50px, -50%);
	-khtml-transform: translate(-50px, -50%);
	-moz-transform: translate(-50px, -50%);
	-ms-transform: translate(-50px, -50%);
	-o-transform: translate(-50px, -50%);
	transform: translate(-50px, -50%);
	-webkit-transition: all .3s linear 0s;
	-khtml-transition: all .3s linear 0s;
	-moz-transition: all .3s linear 0s;
	-ms-transition: all .3s linear 0s;
	-o-transition: all .3s linear 0s;
	transition: all .3s linear 0s;
}

.nav-out-vertical .pxl-swiper-arrow-prev {
	left: -23px;
}

@media (max-width: 1199px) {
	.nav-out-vertical .pxl-swiper-arrow-prev {
		left: 15px;
		opacity: 0;
		-webkit-transform: translate(-50px, -50%);
		-khtml-transform: translate(-50px, -50%);
		-moz-transform: translate(-50px, -50%);
		-ms-transform: translate(-50px, -50%);
		-o-transform: translate(-50px, -50%);
		transform: translate(-50px, -50%);
		-webkit-transition: all .3s linear 0s;
		-khtml-transition: all .3s linear 0s;
		-moz-transition: all .3s linear 0s;
		-ms-transition: all .3s linear 0s;
		-o-transition: all .3s linear 0s;
		transition: all .3s linear 0s;
	}
}

.nav-out-vertical .pxl-swiper-arrow-next {
	right: -23px;
}

.pxl-swiper-slider-thumbs .swiper-fade .swiper-slide-active {
	pointer-events: none;
}

.product-detail-thumbs .swiper-pagination .swiper-pagination-bullet {
	position: relative;
	width: calc(var(--spacing) * 1.5) !important;
	height: calc(var(--spacing) * 1.5) !important;
	background-color: color-mix(in srgb, #fff 30%, transparent) !important;

	@supports (color: color-mix(in lab, red, red)) {
		background-color: color-mix(in oklab, var(--color-white) 30%, transparent) !important;
	}

	opacity: 100% !important;
	--tw-duration: 200ms;
	transition-duration: 200ms;

	&::after {
		content: var(--tw-content);
		position: absolute;
	}

	&::after {
		content: var(--tw-content);
		top: calc(1/2 * 100%);
	}

	&::after {
		content: var(--tw-content);
		left: calc(1/2 * 100%);
	}

	&::after {
		content: var(--tw-content);
		width: calc(var(--spacing) * 4.5);
		height: calc(var(--spacing) * 4.5);
	}

	&::after {
		content: var(--tw-content);
		--tw-translate-x: calc(calc(1/2 * 100%) * -1);
		--tw-translate-y: calc(calc(1/2 * 100%) * -1);
		translate: var(--tw-translate-x) var(--tw-translate-y);
	}

	&::after {
		content: var(--tw-content);
		border-radius: calc(infinity * 1px);
	}

	&::after {
		content: var(--tw-content);
		border-style: var(--tw-border-style);
		border-width: 1px;
	}

	&::after {
		content: var(--tw-content);
		border-color: transparent;
	}

	&::after {
		--tw-content: '';
		content: var(--tw-content);
	}
}

.product-detail-thumbs .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
	background-color: var(--color-white) !important;

	&::after {
		content: var(--tw-content);
		border-color: var(--color-white);
	}
}

.swiper-pagination-bullets .swiper-pagination-bullet {
	width: calc(var(--spacing) * 2.5);
	height: calc(var(--spacing) * 2.5);
	background-color: var(--color-white);
}

.custom-accordion.style-1 .accordion-item {
	position: relative;
	margin-bottom: calc(var(--spacing) * 3.25);
	width: 100%;
	border-radius: var(--radius-2lg);
	color: var(--color-secondary);
}

.custom-accordion.style-1 .accordion-item .accordion-header {
	display: flex;
	width: 100%;
	cursor: pointer;
	align-items: center;
	justify-content: space-between;
	border-radius: var(--radius-2lg);
	background-color: var(--color-white);
	padding: calc(var(--spacing) * 5);
	padding-left: calc(var(--spacing) * 7.5);
	text-align: start;
	--tw-duration: 300ms;
	transition-duration: 300ms;
}

@media (max-width: 360px) {
	.custom-accordion.style-1 .accordion-item .accordion-header {
		padding: calc(var(--spacing) * 3);
	}
}

.custom-accordion.style-1 .accordion-item .accordion-header .arrow {
	color: var(--color-secondary);
	--tw-duration: 300ms;
	transition-duration: 300ms;
}

.accordion-content {
	max-height: calc(var(--spacing) * 0);
	overflow: hidden;
	--tw-duration: 500ms;
	transition-duration: 500ms;
}

.custom-accordion.style-1 .accordion-item .accordion-header.open {
	background-color: var(--color-primary);
}

.custom-accordion.style-1 .accordion-item .accordion-header.open .arrow.active span {
	rotate: calc(180deg * -1);
	background-color: var(--color-white);
}

.custom-accordion.style-1 .accordion-item .accordion-content .content-inner {
	padding-inline: calc(var(--spacing) * 3.75);
	padding-block: calc(var(--spacing) * 1.5);
	font-size: var(--text-base);
	line-height: var(--tw-leading, var(--text-base--line-height));
	color: var(--color-lightpurple);
	--tw-duration: 500ms;
	transition-duration: 500ms;

	@media (width >=576px) {
		padding-inline: calc(var(--spacing) * 8.75);
	}

	@media (width >=576px) {
		padding-block: calc(var(--spacing) * 5.5);
	}

	@media (width >=1200px) {
		font-size: var(--text-xl);
		line-height: var(--tw-leading, var(--text-xl--line-height));
	}

	&:where(.dark, .dark *) {
		color: var(--color-white);
	}
}

.custom-accordion.style-2 .accordion-item .accordion-header {
	display: flex;
	width: 100%;
	cursor: pointer;
	align-items: center;
	justify-content: space-between;
	border-bottom-style: var(--tw-border-style);
	border-bottom-width: 1px;
	border-color: color-mix(in srgb, #000 10%, transparent);

	@supports (color: color-mix(in lab, red, red)) {
		border-color: color-mix(in oklab, var(--color-black) 10%, transparent);
	}

	padding-block: calc(var(--spacing) * 5);
	text-align: start;
	color: var(--color-secondary);
	--tw-duration: 300ms;
	transition-duration: 300ms;

	&:where(.dark, .dark *) {
		border-color: color-mix(in srgb, #fff 10%, transparent);

		@supports (color: color-mix(in lab, red, red)) {
			border-color: color-mix(in oklab, var(--color-white) 10%, transparent);
		}
	}

	&:where(.dark, .dark *) {
		color: var(--color-white);
	}
}

.custom-accordion.style-2 .accordion-item .accordion-content .content-inner {
	border-bottom-style: var(--tw-border-style);
	border-bottom-width: 1px;
	border-color: color-mix(in srgb, #000 10%, transparent);

	@supports (color: color-mix(in lab, red, red)) {
		border-color: color-mix(in oklab, var(--color-black) 10%, transparent);
	}

	padding-block: calc(var(--spacing) * 6.5);
	font-size: var(--text-base);
	line-height: var(--tw-leading, var(--text-base--line-height));
	--tw-font-weight: var(--font-weight-light);
	font-weight: var(--font-weight-light);
	color: var(--color-bodytext);

	@media (width >=1200px) {
		font-size: var(--text-2xl);
		line-height: var(--tw-leading, var(--text-2xl--line-height));
	}
}

.custom-accordion.style-2 .accordion-item .accordion-header .arrow {
	width: calc(var(--spacing) * 7.5);
	height: calc(var(--spacing) * 7.5);
}

.custom-accordion.style-2 .accordion-item .accordion-header .arrow .fa-plus {
	display: block;
	font-size: var(--text-xl);
	line-height: var(--tw-leading, var(--text-xl--line-height));
	color: color-mix(in srgb, #000 60%, transparent);

	@supports (color: color-mix(in lab, red, red)) {
		color: color-mix(in oklab, var(--color-black) 60%, transparent);
	}

	@media (width >=576px) {
		font-size: var(--text-2xl);
		line-height: var(--tw-leading, var(--text-2xl--line-height));
	}

	&:where(.dark, .dark *) {
		color: color-mix(in srgb, #fff 60%, transparent);

		@supports (color: color-mix(in lab, red, red)) {
			color: color-mix(in oklab, var(--color-white) 60%, transparent);
		}
	}
}

.custom-accordion.style-2 .accordion-item .accordion-header .arrow .fa-minus {
	display: none;
	font-size: var(--text-2xl);
	line-height: var(--tw-leading, var(--text-2xl--line-height));
}

.custom-accordion.style-2 .accordion-item .accordion-header.open .arrow.active .fa-minus {
	display: block;
}

.custom-accordion.style-2 .accordion-item .accordion-header.open .arrow.active .fa-plus {
	display: none;
}

.accordion-content {
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.3s ease;
	background: var(--secondarylight);
	border-radius: 0 0 var(--radius-xxl) var(--radius-xxl);
}

.arrow.rotate {
	transform: rotate(90deg);
	transition: transform 0.3s ease;
}

.gl-star-rating--stars span {
	--gl-star-size: 20px;
}

.tab-title.tab-underline.active a::after,
.tab-title.tab-underline.active button::after {
	width: 100%;
}

.tab-title.tab-underline.active a {
	color: var(--color-secondary);

	&:where(.dark, .dark *) {
		color: var(--color-primary);
	}
}

.tab-content {
	display: none;
}

.tab-title button {
	cursor: pointer;
}

.tab-content.active {
	display: block;
}

.shop-tab .tab-title.active {
	background-color: var(--color-primary);
}

.dark .shop-tab .tab-title.active svg path {
	fill: var(--color-dark);
}

.clip-right-animation {
	animation-name: clipRightIn;
	animation-timing-function: cubic-bezier(0, 0.57, 0.55, 1);
}

.clip-left-animation {
	animation-name: clipLeftIn;
	animation-timing-function: cubic-bezier(0, 0.57, 0.55, 1);
}

#grow-chart g.apexcharts-series path:hover {
	fill: var(--primary);
}

.dz-hover-img canvas {
	top: 0;
	left: 0;
	width: 100% !important;
	height: 100% !important;
	position: absolute;
	border-radius: 10px;
	object-fit: contain;
}

.noUi-horizontal {
	height: calc(var(--spacing) * 1) !important;
}

.noUi-connect {
	background-color: var(--color-lightpurple) !important;

	&:where(.dark, .dark *) {
		background-color: var(--color-light) !important;
	}
}

.noUi-target {
	border-radius: 0 !important;
	border-style: var(--tw-border-style) !important;
	border-width: 0px !important;
	background-color: color-mix(in srgb, #000 15%, transparent) !important;

	@supports (color: color-mix(in lab, red, red)) {
		background-color: color-mix(in oklab, var(--color-black) 15%, transparent) !important;
	}

	--tw-shadow: 0 0 #0000 !important;
	box-shadow: var(--tw-inset-shadow),
	var(--tw-inset-ring-shadow),
	var(--tw-ring-offset-shadow),
	var(--tw-ring-shadow),
	var(--tw-shadow) !important;

	&:where(.dark, .dark *) {
		background-color: color-mix(in srgb, #fff 15%, transparent) !important;

		@supports (color: color-mix(in lab, red, red)) {
			background-color: color-mix(in oklab, var(--color-white) 15%, transparent) !important;
		}
	}
}

.noUi-horizontal .noUi-handle {
	width: calc(var(--spacing) * 2.25) !important;
	height: calc(var(--spacing) * 2.25) !important;
	border-radius: 1px !important;
	border-style: var(--tw-border-style) !important;
	border-width: 0px !important;
	outline-style: var(--tw-outline-style);
	outline-width: 3px;
	outline-color: var(--color-lightpurple);

	&::before {
		content: var(--tw-content);
		display: none;
	}

	&::after {
		content: var(--tw-content);
		display: none;
	}

	&:where(.dark, .dark *) {
		outline-color: var(--color-white);
	}
}

.noUi-touch-area {
	background-color: var(--color-white);

	&:where(.dark, .dark *) {
		background-color: var(--color-dark);
	}
}

.noUi-tooltip {
	display: none;
}

.noUi-horizontal .noUi-handle {
	top: calc(var(--spacing) * -0.75);
	right: calc(var(--spacing) * 0.25);
}

.form-check span::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 28px;
	height: 28px;
	background-color: transparent;
	border: 1px solid var(--secondary);
	border-radius: 50%;
	opacity: 0.2;
	transform: translate(-50%, -50%) scale(0);
	z-index: -1;
	transition-duration: 0.5s;
}

.dark .form-check span::after {
	border: 1px solid var(--color-white);
}

.form-check .form-check-input:checked+span::after {
	transform: translate(-50%, -50%) scale(1);
}

.dark .product-size .btn-check:checked+label {
	color: var(--secondary) !important;
	background: #fff;
}

.light .product-size .btn-check:checked+label {
	background: var(--secondary) !important;
	color: #fff;
}

.product-size.light .btn-check:checked+label {
	border-color: var(--color-light) !important;
	color: #fff;
}

.bookmark-btn .form-check-input:checked+.form-check-label {
	color: var(--color-darkbtn);
	background-color: var(--primary);
	border-color: var(--primary);
}

.form-check-input {
	width: 1.125em;
	height: 1.125em;
	border: 2px solid #D7D7D7;
	margin: 4px;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	vertical-align: top;
	background-image: var(--tw-form-check-bg-image);
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	border-radius: 4px;
}

.form-check-input:checked[type="checkbox"] {
	--tw-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23000000' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
}

.form-check-input:checked {
	background-color: var(--primary);
	border-color: var(--primary);
}

.show-pass.active::after {
	opacity: 0;
}

.custom-select {
	position: relative;
}

.align-right+div .select-items {
	right: 0;
}

.select-selected {
	cursor: pointer;
	position: relative;
	font-size: 14px !important;
	display: flex;
	align-items: center;
	user-select: none;
}

.list-selected .custom-select .select-selected {
	height: calc(var(--spacing) * 12.5);
	width: 100%;
	cursor: pointer;
	padding-block: calc(var(--spacing) * 3.5);
	padding-right: calc(var(--spacing) * 7.5) !important;
	font-size: var(--text-base);
	line-height: var(--tw-leading, var(--text-base--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--color-secondary) !important;
	--tw-duration: 300ms;
	transition-duration: 300ms;

	&:where(.dark, .dark *) {
		color: var(--color-white) !important;
	}
}

.list-selected .select-selected:after {
	margin-top: -12px !important;
}

.select-selected span {
	display: none;
}

.dark .select-selected:after {
	border-right: 0;
	border-top: 0;
}

.light .select-selected:after {
	border-right: 0;
	border-top: 0;
}

.select-selected:after {
	content: "";
	position: absolute;
	right: 15px;
	width: 8px;
	height: 8px;
	transform: rotate(135deg);
	margin-top: -4px;
	transition: .3s all;
}

.select-selected.select-active:after {
	transform: rotate(-45deg);
	margin-top: 4px;
}

.dark .select-items {
	background-color: var(--color-secondary);
	color: var(--color-white);
}

.light .select-items {
	background-color: white;
}

.custom-select.right .select-items {
	right: auto;
	left: 0;
}

.select-items {
	position: absolute;
	width: 100%;
	z-index: 99;
	max-height: 320px;
	overflow-y: auto;
	display: block;
	opacity: 1;
	visibility: visible;
	transform: translateY(0px);
	max-width: 400px;
	scrollbar-width: thin;
	transition: .3s all;
	box-shadow: rgba(17, 12, 46, 0.15) 0px 48px 100px 0px;
	left: 0;
	border-radius: 10px;
}

@media screen and (max-width: 992px) {
	.select-items {
		right: -64px;
	}
}

.select-item {
	padding: 5px 20px;
	cursor: pointer;
	font-size: 14px;
	user-select: none;
}

.select-item.active {
	background-color: var(--primary);
	color: var(--color-dark);
}

.select-item:hover {
	background-color: #eee;
	color: var(--color-dark);
}

.select-items.select-hide {
	opacity: 0;
	visibility: hidden;
	transform: translateY(15px);
}

.custom-select .select-selected {
	height: calc(var(--spacing) * 12.5);
	width: 100%;
	cursor: pointer;
	padding-inline: calc(var(--spacing) * 0) !important;
	padding-block: calc(var(--spacing) * 3.5);
	font-size: var(--text-base);
	line-height: var(--tw-leading, var(--text-base--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--color-secondary);

	@supports (color: color-mix(in lab, red, red)) {
		color: color-mix(in oklab, var(--color-secondary) 50%, transparent);
	}

	--tw-duration: 300ms;
	transition-duration: 300ms;
}

.custom-select .select-selected:after {
	content: "\f107";
	font-family: "fontawesome";
	position: absolute;
	right: 8px;
	width: 8px;
	height: 8px;
	transition: .3s all;
	transform: rotate(0);
	margin-top: -10px;
}

.status-modal {
	z-index: var(--z-index-99999);
	overflow: hidden;
	background-color: #000000c4;
	--tw-backdrop-blur: blur(10px);
	-webkit-backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
	backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
}

.status-modal .modal-content .status-wrapper .status-swiper .swiper-slide .status-top-box {
	position: absolute;
	top: calc(var(--spacing) * 0);
	left: calc(var(--spacing) * 0);
	z-index: 10;
	display: flex;
	width: 100%;
	height: 100%;
	justify-content: space-between;
	padding-inline: calc(var(--spacing) * 5);
	padding-top: calc(var(--spacing) * 7.5);
	color: var(--color-white);
}

.status-modal .status-pagination {
	position: absolute;
	top: calc(var(--spacing) * 0);
	bottom: auto !important;
	left: calc(1/2 * 100%) !important;
	z-index: 10;
	display: flex;
	height: auto;
	width: 100% !important;
	--tw-translate-x: calc(calc(1/2 * 100%) * -1);
	--tw-translate-y: calc(calc(1/2 * 100%) * -1);
	translate: var(--tw-translate-x) var(--tw-translate-y);
	justify-content: space-between;
	padding-block: calc(var(--spacing) * 2.5);
}

.status-modal .status-pagination .swiper-pagination-bullet {
	position: relative;
	height: calc(var(--spacing) * 1.25);
	width: 100%;
	overflow: hidden;
	border-radius: var(--radius-2lg);
	background-color: color-mix(in srgb, #fff 20%, transparent);

	@supports (color: color-mix(in lab, red, red)) {
		background-color: color-mix(in oklab, var(--color-white) 20%, transparent);
	}
}

.swiper-pagination-bullet-active:after {
	width: 100%;
	--tw-duration: 500ms;
	transition-duration: 500ms;
}

.status-modal .status-pagination .swiper-pagination-bullet:after {
	position: absolute;
	top: calc(var(--spacing) * 0);
	left: calc(var(--spacing) * 0);
	width: 100%;
	height: 100%;
	background-color: var(--color-white);
	--tw-duration: 300ms;
	transition-duration: 300ms;
	--tw-content: '';
	content: var(--tw-content);
}

.modal-content {
	pointer-events: auto;
	position: relative;
	display: flex;
	width: 100%;
	flex-direction: column;
	border-radius: var(--radius-4xl);
	background-color: var(--color-white);
}

.status-modal .modal-content .status-wrapper .status-swiper .swiper-slide .status-top-box:after {
	position: absolute;
	top: calc(var(--spacing) * 0);
	left: calc(var(--spacing) * 0);
	z-index: calc(var(--z-index-1) * -1);
	width: 100%;
	height: 100%;
	border-radius: var(--radius-4xl);
	background-image: linear-gradient(0deg, rgba(255, 255, 255, 0) 0.3%, rgba(0, 0, 0, 0.6) 100%);
	opacity: 60%;
	--tw-content: '';
	content: var(--tw-content);
}

.status-modal .btn-close {
	position: absolute;
	top: calc(var(--spacing) * 0);
	right: calc(var(--spacing) * 0);
	z-index: 10;
	width: 44px;
	height: 44px;
	border-radius: .25em;
	background-image: var(--bg-close-icon);
	background-position: center;
	background-repeat: no-repeat;
	padding: .25em;
	color: var(--color-white);
	opacity: .5;
}

.alignwide .btn-Video {
	position: absolute;
	top: calc(1/2 * 100%);
	left: calc(1/2 * 100%);
	z-index: 10;
	margin: calc(var(--spacing) * 0);
	width: calc(var(--spacing) * 20);
	height: calc(var(--spacing) * 20);
	--tw-translate-x: calc(calc(1/2 * 100%) * -1);
	--tw-translate-y: calc(calc(1/2 * 100%) * -1);
	translate: var(--tw-translate-x) var(--tw-translate-y);
	cursor: pointer;
	border-radius: calc(infinity * 1px);
	border-style: var(--tw-border-style);
	border-width: 0px;
	background-color: #000000cc;
	color: var(--color-white);

	@media (width >=576px) {
		width: calc(var(--spacing) * 25);
		height: calc(var(--spacing) * 25);
	}
}

.full-sidenav {
	z-index: 10;
	padding: calc(var(--spacing) * 5);

	@media (width < 1200px) {
		visibility: hidden;
	}

	@media (width < 1200px) {
		position: fixed;
	}

	@media (width < 1200px) {
		top: calc(var(--spacing) * 0);
	}

	@media (width < 1200px) {
		left: -100%;
	}

	@media (width < 1200px) {
		height: 100vh;
	}

	@media (width < 1200px) {
		width: calc(var(--spacing) * 125);
	}

	@media (width < 1200px) {
		overflow-y: scroll;
	}

	@media (width < 1200px) {
		background-color: var(--color-bodyfg);
	}

	@media (width < 1200px) {
		opacity: 0%;
	}

	@media (width < 1200px) {
		--tw-duration: 700ms;
		transition-duration: 700ms;
	}

	@media (width < 576px) {
		width: calc(var(--spacing) * 75) !important;
	}

	@media (width >=576px) {
		padding: calc(var(--spacing) * 10);
	}

	@media (width >=1200px) {
		padding: calc(var(--spacing) * 0);
	}
}

.full-sidenav.show {
	@media (width < 1200px) {
		visibility: visible;
	}

	@media (width < 1200px) {
		left: calc(var(--spacing) * 0);
	}

	@media (width < 1200px) {
		opacity: 100%;
	}
}

.menu-btn .toogle-btn span:nth-child(1) {
	width: calc(var(--spacing) * 6.25);
}

.menu-btn .toogle-btn span:nth-child(2) {
	width: calc(var(--spacing) * 7.5);
}

.menu-btn .toogle-btn span:nth-child(3) {
	width: calc(var(--spacing) * 3.75);
}

.menu-btn.open .toogle-btn span:nth-child(1) {
	margin: calc(var(--spacing) * 0);
	width: calc(var(--spacing) * 7.5);
	rotate: 45deg;
}

.menu-btn.open .toogle-btn span:nth-child(2) {
	margin: calc(var(--spacing) * 0);
	opacity: 0%;
}

.menu-btn.open .toogle-btn span:nth-child(3) {
	margin: calc(var(--spacing) * 0);
	width: calc(var(--spacing) * 7.5);
	rotate: calc(45deg * -1);
}

.menu-btn.open::after {
	position: fixed;
	top: calc(var(--spacing) * 0);
	right: calc(var(--spacing) * -5);
	left: calc(var(--spacing) * 0);
	margin-left: calc(var(--spacing) * 5);
	width: 100%;
	transform-origin: top right;
	--tw-scale-x: 100%;
	--tw-scale-y: 100%;
	--tw-scale-z: 100%;
	scale: var(--tw-scale-x) var(--tw-scale-y);
	background-color: rgba(0, 0, 0, 0.6);
	--tw-shadow: 0 0 0 1000px var(--tw-shadow-color, rgba(0, 0, 0, 0.6));
	box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
	--tw-duration: 500ms;
	transition-duration: 500ms;
	--tw-content: '';
	content: var(--tw-content);
}

.site-header .navbar {
	padding-bottom: calc(var(--spacing) * 5);

	@media (width >=1200px) {
		padding-bottom: calc(var(--spacing) * 0);
	}

	@media (width >=1200px) {
		color: var(--color-white);
	}
}

@media (max-width: 1200px) {
	.site-header .navbar>.sub-menu-down>.sub-menu>li>a {
		border-bottom-style: var(--tw-border-style);
		border-bottom-width: 1px;
		border-color: color-mix(in srgb, #000 10%, transparent);

		@supports (color: color-mix(in lab, red, red)) {
			border-color: color-mix(in oklab, var(--color-black) 10%, transparent);
		}

		padding-inline: calc(var(--spacing) * 7.5) !important;
		padding-block: calc(var(--spacing) * 2.5) !important;
	}
}

.site-header .navbar>li>a {
	position: relative;
	display: block;
	width: 100%;
	padding-inline: calc(var(--spacing) * 5);
	padding-block: calc(var(--spacing) * 2.5);
	font-size: var(--text-lg);
	line-height: var(--tw-leading, var(--text-lg--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);

	&:hover {
		@media (hover: hover) {
			color: var(--color-primary);
		}
	}

	@media (width >=1200px) {
		color: var(--color-white);
	}
}

.site-header .navbar .sub-menu-down>a {
	padding-right: calc(var(--spacing) * 8.5);
}

.site-header .navbar>li>a:after {
	position: absolute;
	bottom: calc(var(--spacing) * 0);
	left: calc(1/2 * 100%);
	height: calc(var(--spacing) * 0.5);
	width: calc(var(--spacing) * 0);
	--tw-translate-x: calc(calc(1/2 * 100%) * -1);
	--tw-translate-y: calc(calc(1/2 * 100%) * -1);
	translate: var(--tw-translate-x) var(--tw-translate-y);
	background-color: var(--color-primary);
	--tw-duration: 500ms;
	transition-duration: 500ms;
	--tw-content: '';
	content: var(--tw-content);
}

@media (min-width: 1200px) {
	.site-header .navbar>li:hover>a:after {
		position: absolute;
		bottom: calc(var(--spacing) * 0);
		left: calc(1/2 * 100%);
		height: calc(var(--spacing) * 0.5);
		width: calc(var(--spacing) * 3.75);
		--tw-translate-x: calc(calc(1/2 * 100%) * -1);
		--tw-translate-y: calc(calc(1/2 * 100%) * -1);
		translate: var(--tw-translate-x) var(--tw-translate-y);
		background-color: var(--color-primary);
		--tw-content: '';
		content: var(--tw-content);
	}
}

@media (min-width: 1200px) {
	.site-header.header-2 .navbar>li>a {
		display: block;
		width: 100%;
		padding-inline: calc(var(--spacing) * 5);
		padding-block: calc(var(--spacing) * 2.5);
		font-size: var(--text-lg);
		line-height: var(--tw-leading, var(--text-lg--line-height));
		--tw-font-weight: var(--font-weight-medium);
		font-weight: var(--font-weight-medium);
		color: var(--color-secondary);

		&:hover {
			@media (hover: hover) {
				color: var(--color-primary);
			}
		}

		&:where(.dark, .dark *) {
			color: var(--color-white);
		}
	}
}

.site-header.header-2 .navbar .sub-menu-down>a {
	padding-right: calc(var(--spacing) * 8.5);
}

.site-header.header-4 .navbar .sub-menu-down>a {
	padding-right: calc(var(--spacing) * 8.5);
}

@media (min-width: 1200px) {
	.site-header.header-4 .navbar>li>a {
		display: block;
		width: 100%;
		padding-inline: calc(var(--spacing) * 5);
		padding-block: calc(var(--spacing) * 2.5);
		font-size: var(--text-lg);
		line-height: var(--tw-leading, var(--text-lg--line-height));
		--tw-font-weight: var(--font-weight-medium);
		font-weight: var(--font-weight-medium);
		color: var(--color-secondary);

		&:hover {
			@media (hover: hover) {
				color: var(--color-primary);
			}
		}

		&:where(.dark, .dark *) {
			color: var(--color-white);
		}
	}
}

@media (min-width: 1200px) {
	.style-3.site-header .navbar>li>a {
		display: block;
		width: 100%;
		padding-inline: calc(var(--spacing) * 5);
		padding-block: calc(var(--spacing) * 2.5);
		font-size: var(--text-lg);
		line-height: var(--tw-leading, var(--text-lg--line-height));
		--tw-font-weight: var(--font-weight-medium);
		font-weight: var(--font-weight-medium);

		&:hover {
			@media (hover: hover) {
				color: var(--color-white);
			}
		}
	}
}

@media (max-width: 1400px) {
	.site-header .navbar>li>a {
		font-size: var(--text-base);
		line-height: var(--tw-leading, var(--text-base--line-height));
	}
}

@media (max-width: 1199px) {
	.site-header .navbar>li>a {
		border-bottom-style: var(--tw-border-style);
		border-bottom-width: 1px;
		border-color: color-mix(in srgb, #000 20%, transparent);

		@supports (color: color-mix(in lab, red, red)) {
			border-color: color-mix(in oklab, var(--color-black) 20%, transparent);
		}

		padding-inline: calc(var(--spacing) * 0) !important;
		padding-block: calc(var(--spacing) * 3.5);
		font-size: var(--text-xl);
		line-height: var(--tw-leading, var(--text-xl--line-height));
		color: var(--color-secondary);
	}
}

@media (max-width: 1200px) {
	.site-header .navbar>li>a.dz-open i {
		rotate: 90deg;
	}
}

.site-header .navbar>li:hover>.sub-menu {
	@media (width >=1200px) {
		visibility: visible;
	}

	@media (width >=1200px) {
		--tw-translate-y: calc(var(--spacing) * 0);
		translate: var(--tw-translate-x) var(--tw-translate-y);
	}

	@media (width >=1200px) {
		opacity: 100%;
	}
}

.site-header .navbar .sub-menu {
	--tw-duration: 500ms;
	transition-duration: 500ms;

	@media (width < 1200px) {
		max-height: calc(var(--spacing) * 0);
	}

	@media (width < 1200px) {
		overflow: hidden;
	}

	@media (width >=1200px) {
		visibility: hidden;
	}

	@media (width >=1200px) {
		position: absolute;
	}

	@media (width >=1200px) {
		top: calc(100% + 2.5);
	}

	@media (width >=1200px) {
		left: calc(var(--spacing) * 0);
	}

	@media (width >=1200px) {
		width: calc(var(--spacing) * 65.5);
	}

	@media (width >=1200px) {
		--tw-translate-y: calc(var(--spacing) * -10);
		translate: var(--tw-translate-x) var(--tw-translate-y);
	}

	@media (width >=1200px) {
		border-radius: var(--radius-md);
	}

	@media (width >=1200px) {
		border-style: var(--tw-border-style);
		border-width: 1px;
	}

	@media (width >=1200px) {
		border-color: color-mix(in srgb, #fff 20%, transparent);

		@supports (color: color-mix(in lab, red, red)) {
			border-color: color-mix(in oklab, var(--color-white) 20%, transparent);
		}
	}

	@media (width >=1200px) {
		background-color: var(--color-secondary);
	}

	@media (width >=1200px) {
		padding: calc(var(--spacing) * 1.25);
	}

	@media (width >=1200px) {
		color: var(--color-white);
	}

	@media (width >=1200px) {
		opacity: 0%;
	}
}

.site-header .navbar>.sub-menu-down .sub-menu>li>a {
	display: block;
	width: 100%;
	padding-inline: calc(var(--spacing) * 2.5);
	padding-block: calc(var(--spacing) * 1.25);
	font-size: var(--text-2sm);
	line-height: var(--tw-leading, var(--text-2sm--line-height));
	--tw-font-weight: var(--font-weight-normal);
	font-weight: var(--font-weight-normal);

	&:hover {
		@media (hover: hover) {
			color: var(--color-primary);
		}
	}

	@media (width >=1200px) {
		color: var(--color-white);
	}
}

.site-header .sub-menu li>.sub-menu {
	visibility: hidden;
	top: calc(var(--spacing) * 0);
	left: 104%;
	opacity: 0%;
}

.site-header .sub-menu li:hover>.sub-menu {
	visibility: visible;
	--tw-translate-y: calc(var(--spacing) * 0);
	translate: var(--tw-translate-x) var(--tw-translate-y);
	opacity: 100%;
}

.sub-menu-down,
.sub-menu-down a {
	position: relative;
}

.is-fixed:not(.sticky-no) .main-bar-wraper {
	position: fixed;
	top: calc(var(--spacing) * 0);
	left: calc(var(--spacing) * 0);
	width: 100%;
	background-color: color-mix(in srgb, #000 50%, transparent);

	@supports (color: color-mix(in lab, red, red)) {
		background-color: color-mix(in oklab, var(--color-black) 50%, transparent);
	}

	--tw-backdrop-blur: blur(10px);
	-webkit-backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
	backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
	animation: 0.95s ease 0s normal forwards 1 running headerSlideDown;
}

.header-2.is-fixed .main-bar-wraper {
	position: fixed;
	top: calc(var(--spacing) * 0);
	left: calc(var(--spacing) * 0);
	width: 100%;
	/*padding-top: calc(var(--spacing) * 0.75);*/
	background-color: color-mix(in srgb, #fff 50%, transparent);

	@supports (color: color-mix(in lab, red, red)) {
		background-color: color-mix(in oklab, var(--color-white) 50%, transparent);
	}

	--tw-backdrop-blur: blur(10px);
	-webkit-backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
	backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );

	&:where(.dark, .dark *) {
		background-color: color-mix(in srgb, #000 50%, transparent);

		@supports (color: color-mix(in lab, red, red)) {
			background-color: color-mix(in oklab, var(--color-black) 50%, transparent);
		}
	}

	animation: 0.95s ease 0s normal forwards 1 running headerSlideDown;
}

.header-4.is-fixed:not(.sticky-no) .main-bar-wraper {
	position: fixed;
	top: calc(var(--spacing) * 0);
	left: calc(var(--spacing) * 0);
	width: 100%;
	background-color: color-mix(in srgb, #fff 50%, transparent);

	@supports (color: color-mix(in lab, red, red)) {
		background-color: color-mix(in oklab, var(--color-white) 50%, transparent);
	}

	--tw-backdrop-blur: blur(10px);
	-webkit-backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
	backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );

	&:where(.dark, .dark *) {
		background-color: color-mix(in srgb, #000 50%, transparent);

		@supports (color: color-mix(in lab, red, red)) {
			background-color: color-mix(in oklab, var(--color-black) 50%, transparent);
		}
	}

	animation: 0.95s ease 0s normal forwards 1 running headerSlideDown;
}

.header-light.is-fixed:not(.sticky-no) .main-bar-wraper {
	background-color: color-mix(in srgb, #000 50%, transparent);

	@supports (color: color-mix(in lab, red, red)) {
		background-color: color-mix(in oklab, var(--color-black) 50%, transparent);
	}

	animation: 0.95s ease 0s normal forwards 1 running headerSlideDown;
}

.site-header.is-fixed {
	height: calc(var(--spacing) * 25);
	--tw-duration: 500ms;
	transition-duration: 500ms;
}

.site-header.is-fixed .overlay-navbar {
	display: none;
}

.site-header.is-fixed .main-bar-wraper .container-fluid>div {
	padding-block: calc(var(--spacing) * 2.5);
}

.site-header .marquee-wrap {
	position: relative;
	z-index: 101;
}

.site-header.is-fixed .marquee-wrap {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	width: 100%;
	margin: 0;
	z-index: 102;
}

.site-header.is-fixed .marquee-wrap .w-full {
	border-radius: 0;
}

.site-header.is-fixed .main-bar-wraper {
	top: 3rem;
}

.header-2.is-fixed .main-bar-wraper {
	top: 3rem;
}

body.menu-btn-open {
	height: 100vh !important;
	overflow: hidden;
}

.style-3.site-header.header-2.is-fixed:not(.sticky-no) .main-bar-wraper {
	background-color: color-mix(in srgb, #000 50%, transparent);

	@supports (color: color-mix(in lab, red, red)) {
		background-color: color-mix(in oklab, var(--color-black) 50%, transparent);
	}

	&:where(.dark, .dark *) {
		background-color: color-mix(in srgb, #fff 50%, transparent);

		@supports (color: color-mix(in lab, red, red)) {
			background-color: color-mix(in oklab, var(--color-white) 50%, transparent);
		}
	}
}

.header-3.is-fixed:not(.sticky-no) .main-bar-wraper {
	background-color: color-mix(in srgb, #fff 50%, transparent);

	@supports (color: color-mix(in lab, red, red)) {
		background-color: color-mix(in oklab, var(--color-white) 50%, transparent);
	}

	&:where(.dark, .dark *) {
		background-color: color-mix(in srgb, #000 50%, transparent);

		@supports (color: color-mix(in lab, red, red)) {
			background-color: color-mix(in oklab, var(--color-black) 50%, transparent);
		}
	}
}

.header-3.site-header .navbar>li>a {
	color: var(--color-secondary);

	&:where(.dark, .dark *) {
		color: var(--color-white);
	}
}

.sub-menu .mega-menu-down .mega-mega li a {
	position: absolute !important;
	width: 100%;
	padding-inline: calc(var(--spacing) * 2.5);
	padding-block: calc(var(--spacing) * 0.5);
}

.sub-menu .mega-menu-down .mega-mega {
	visibility: visible;
	opacity: 0%;
	--tw-duration: 500ms;
	transition-duration: 500ms;
}

@media (max-width: 1199px) {
	.site-header .sub-menu>.sub-menu-down>.sub-menu {
		visibility: visible;
		opacity: 100%;
	}

	.site-header .sub-menu>.sub-menu-down>.sub-menu a {
		border-bottom-style: var(--tw-border-style);
		border-bottom-width: 1px;
		border-color: color-mix(in srgb, #000 10%, transparent);

		@supports (color: color-mix(in lab, red, red)) {
			border-color: color-mix(in oklab, var(--color-black) 10%, transparent);
		}

		padding-inline: calc(var(--spacing) * 7.5) !important;
		padding-block: calc(var(--spacing) * 2.5) !important;
	}
}

.text-char {
	position: absolute;
	top: calc(var(--spacing) * 2);
	left: calc(1 / 2 * 100%);
	display: block;
	height: calc(100px / 2);
	width: calc(var(--spacing) * 0);
	transform-origin: bottom center;
	rotate: var(--char-rotate);
	padding-top: calc(var(--spacing) * 0);
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-sm--line-height));
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--color-lightpurple);
	text-transform: uppercase;
}

.main-banner .text-char {
	color: var(--color-white) !important;
}

.skrollable .counter {
	position: absolute;
	top: calc(1 / 2 * 100%);
	left: calc(1 / 2 * 100%);
	--tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
	--tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
	translate: var(--tw-translate-x) var(--tw-translate-y);
	font-size: var(--text-4xl);
	line-height: var(--tw-leading, var(--text-6xl--line-height));
	--tw-font-weight: var(--font-weight-extrabold);
	font-weight: var(--font-weight-extrabold);
	color: var(--color-secondary);
	text-transform: uppercase;
}

.item-title a {
	display: inline;
	width: fit-content;
	color: var(--secondary);
	background-position-y: -3px;
	background-image: linear-gradient(transparent calc(100% - 1px), var(--secondary) 1px);
	background-repeat: no-repeat;
	animation: .6s cubic-bezier(.215, .61, .355, 1) pxl-wide-menu-underline forwards;
}

@keyframes pxl-wide-menu-underline {
	0% {
		background-size: 100% 100%;
		background-position-x: 100%;
	}

	100% {
		background-size: 0 100%;
		background-position-x: 100%;
	}
}

@keyframes pxl-wide-menu-underline-hover {
	0% {
		background-position-x: 0;
		background-size: 0 100%;
	}

	100% {
		background-position-x: 0;
		background-size: 100% 100%;
	}
}

.item-title a:hover {
	color: inherit;
	animation: .6s cubic-bezier(.215, .61, .355, 1) pxl-wide-menu-underline-hover forwards;
}

.my-list-item {
	counter-increment: my-counter;
}

.my-list-item::before {
	content: counter(my-counter) ". ";
}

.site-filters .filters .active {
	background-color: var(--color-primary);
}

.product-gallery-swiper .swiper-slide.swiper-slide-thumb-active img {
	border-color: var(--color-black);
}

.pxl-history-carousel.layout-1 {
	position: relative;
	-webkit-user-select: none;
	user-select: none;
}

.pxl-history-carousel.layout-1 .content-item {
	text-align: center;
}

.pxl-history-carousel.layout-1 .item-title {
	margin-bottom: calc(var(--spacing) * 3);
	font-size: var(--text-2xxl);
	line-height: var(--tw-leading, var(--text-2xxl--line-height));
	--tw-font-weight: var(--font-weight-semibold);
	font-weight: var(--font-weight-semibold);
}

@media (max-width: 575px) {
	.pxl-history-carousel.layout-1 .item-title {
		font-size: var(--text-2xl);
		line-height: var(--tw-leading, var(--text-2xl--line-height));
	}
}

.pxl-history-carousel.layout-1 .item-des,
.pxl-history-carousel.layout-1 .item-des>* {
	margin-inline: auto;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 6;
	max-width: calc(var(--spacing) * 94.5);
	overflow: hidden;
	font-size: var(--text-lg);
	line-height: var(--tw-leading, var(--text-lg--line-height));
	--tw-leading: calc(var(--spacing) * 6);
	line-height: calc(var(--spacing) * 6);
	--tw-font-weight: var(--font-weight-normal);
	font-weight: var(--font-weight-normal);
	text-overflow: ellipsis;
}

@media (max-width: 575px) {
	.pxl-history-carousel.layout-1 .item-des {
		max-width: calc(var(--spacing) * 82.5);
		font-size: var(--text-base);
		line-height: var(--tw-leading, var(--text-base--line-height));
		--tw-leading: calc(var(--spacing) * 5.5);
		line-height: calc(var(--spacing) * 5.5);
	}
}

.pxl-history-carousel.layout-1 .pxl-button-more {
	margin-top: calc(var(--spacing) * 13);
}

@media (max-width: 575px) {
	.pxl-history-carousel.layout-1 .pxl-button-more {
		margin-top: calc(var(--spacing) * 8.75);
	}
}

.pxl-history-carousel.layout-1 .pxl-button-more .pxl-icon {
	display: flex;
	overflow: hidden;
}

.pxl-history-carousel.layout-1 .pxl-button-more .btn-primary {
	gap: calc(var(--spacing) * 1.25);
}

.pxl-history-carousel.layout-1 .pxl-button-more .btn-primary:hover i {
	animation: toTopFromBottom 0.4s forwards;
}

.pxl-history-carousel.layout-1 .item-inner {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.pxl-history-carousel.layout-1 .pxl-swiper-container {
	padding-inline: calc(var(--spacing) * 6);
	padding-block: calc(var(--spacing) * 8.75);
}

.pxl-history-carousel.layout-1 .item-slide {
	position: absolute;
	top: 64.5%;
	left: calc(1/2 * 100%);
	display: flex;
	height: auto;
	width: calc(var(--spacing) * 115);
	--tw-translate-x: calc(calc(1/2 * 100%) * -1);
	--tw-translate-y: calc(calc(1/2 * 100%) * -1);
	translate: var(--tw-translate-x) var(--tw-translate-y);
	transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
	align-items: center;
	justify-content: center;
	overflow: hidden;
	padding: calc(var(--spacing) * 0);
	transition-property: width, height;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration));
	--tw-duration: 1000ms;
	transition-duration: 1000ms;
}

.pxl-swiper-wrapper {
	position: relative;
	z-index: var(--z-index-1);
	box-sizing: content-box;
	display: flex;
	width: 100%;
	height: 100%;
	--tw-duration: 400ms;
	transition-duration: 400ms;
}

.align-items-center {
	align-items: center;
}

.elementor *,
.elementor :after,
.elementor :before {
	box-sizing: border-box;
}

.pxl-history-carousel.layout-1 .pxl-swiper-wrapper {
	position: relative;
	top: calc(var(--spacing) * 0);
	left: calc(var(--spacing) * 0);
	z-index: var(--z-index-2);
	margin-bottom: calc(var(--spacing) * -231.75);
	height: calc(var(--spacing) * 395);
	overflow: visible;
}

@media (max-width: 1199px) {
	.pxl-history-carousel.layout-1 .pxl-swiper-wrapper {
		margin-bottom: calc(var(--spacing) * -241.5);
	}
}

@media (max-width: 991px) {
	.pxl-history-carousel.layout-1 .pxl-swiper-wrapper {
		margin-bottom: calc(var(--spacing) * -246.5);
	}
}

@media (max-width: 767px) {
	.pxl-history-carousel.layout-1 .pxl-swiper-wrapper {
		margin-bottom: calc(var(--spacing) * -262.5);
		height: calc(var(--spacing) * 375);
	}

	.pxl-history-carousel.layout-1 .pxl-swiper-wrapper .item-slide:nth-child(even) .item-image {
		opacity: 0 !important;
		transition: all 300ms ease-in-out 0s;
	}
}

.pxl-history-carousel.layout-1 .box-pev-next {
	position: absolute;
	bottom: 20%;
	left: calc(1/2 * 100%);
	z-index: 10;
	--tw-translate-x: calc(calc(1/2 * 100%) * -1);
	translate: var(--tw-translate-x) var(--tw-translate-y);
	transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
	text-align: center;
}

@media (max-width: 767px) {
	.pxl-history-carousel.layout-1 .box-pev-next {
		bottom: calc(var(--spacing) * 0);
	}
}

.pxl-history-carousel .box-pev-next .text-pev-next {
	background-color: var(--color-bglight);
	color: var(--color-bodytext);

	&:where(.dark, .dark *) {
		background-color: var(--color-bodybg);
	}
}

.pxl-history-carousel.layout-1 .box-pev-next .text-pev-next {
	position: relative;
	display: inline-block;
	border-radius: 0.25rem;
	padding-inline: calc(var(--spacing) * 1.5);
	font-size: var(--text-xs);
	line-height: var(--tw-leading, var(--text-xs--line-height));
	--tw-leading: 2;
	line-height: 2;
	--tw-font-weight: var(--font-weight-medium);
	font-weight: var(--font-weight-medium);
	color: var(--color-bodytext);
	text-transform: uppercase;
}

.pxl-history-carousel.layout-1 .box-pev-next .text-pev-next::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, 0);
	width: 158px;
	height: 1px;
	z-index: -1;
}

.light .pxl-history-carousel.layout-1 .box-pev-next .text-pev-next::after {
	background: linear-gradient(90deg, rgba(25, 27, 29, 0) 0%, rgb(87 87 90 / 40%) 50.5%, rgba(25, 27, 29, 0) 100%);
}

.dark .pxl-history-carousel.layout-1 .box-pev-next .text-pev-next::after {
	background: linear-gradient(90deg, rgba(25, 27, 29, 0) 0%, rgb(242 242 255 / 40%) 50.5%, rgba(25, 27, 29, 0) 100%);
}

.pxl-history-carousel.layout-1 .pxl-swiper-dots {
	margin-top: calc(var(--spacing) * 5);
	display: flex;
	justify-content: center;
}

.pxl-history-carousel.layout-1 .thumb-item {
	width: auto;
	--tw-scale-x: 100%;
	--tw-scale-y: 100%;
	--tw-scale-z: 100%;
	scale: var(--tw-scale-x) var(--tw-scale-y);
	transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
	opacity: 60%;
}

.pxl-history-carousel.layout-1 .thumb-item .item-year {
	font-size: var(--text-lg);
	line-height: var(--tw-leading, var(--text-lg--line-height));
	--tw-leading: calc(var(--spacing) * 7.5);
	line-height: calc(var(--spacing) * 7.5);
	color: var(--color-secondary);

	&:where(.dark, .dark *) {
		color: #aac1bb;
	}
}

@media (max-width: 575px) {
	.pxl-history-carousel.layout-1 .thumb-item .item-year {
		font-size: var(--text-base);
		line-height: var(--tw-leading, var(--text-base--line-height));
	}
}

.pxl-history-carousel.layout-1 .thumb-item.active {
	--tw-scale-x: 100%;
	--tw-scale-y: 100%;
	--tw-scale-z: 100%;
	scale: var(--tw-scale-x) var(--tw-scale-y);
	opacity: 100%;
}

.pxl-history-carousel.layout-1 .thumb-item.active .item-year {
	font-size: var(--text-2xxl);
	line-height: var(--tw-leading, var(--text-2xxl--line-height));
}

@media (max-width: 575px) {
	.pxl-history-carousel.layout-1 .thumb-item.active .item-year {
		font-size: var(--text-2xl);
		line-height: var(--tw-leading, var(--text-2xl--line-height));
	}
}

.pxl-history-carousel.layout-1 .pxl-thumbs-wrapper {
	gap: calc(var(--spacing) * 6.25);
}

.pxl-history-carousel.layout-1 .pxl-swiper-thumbs {
	max-width: calc(var(--spacing) * 52.5);
}

.pxl-history-carousel.layout-1 .pxl-swiper-slider-thumbs {
	margin-top: calc(var(--spacing) * 3.5);
}

.pxl-history-carousel.layout-1 .pxl-carousel-inner {
	padding-top: calc(var(--spacing) * 19.5);
}

@media (max-width: 991px) {
	.pxl-history-carousel.layout-1 .pxl-carousel-inner {
		padding-top: calc(var(--spacing) * 7.5);
	}
}

@media (max-width: 575px) {
	.pxl-history-carousel.layout-1 .pxl-carousel-inner {
		padding-top: calc(var(--spacing) * 0);
	}
}

.pxl-team-list .project::before,
.pxl-team-list .project::after {
	pointer-events: none;
	position: absolute;
	left: calc(1/2 * 100%);
	z-index: var(--z-index-1);
	display: none;
	height: calc(var(--spacing) * 0);
	width: 100%;
	--tw-translate-x: calc(calc(1/2 * 100%) * -1);
	translate: var(--tw-translate-x) var(--tw-translate-y);
	background-repeat: no-repeat;
	--tw-content: '';
	content: var(--tw-content);

	@media (width >=576px) {
		display: block;
	}

	transition: height 0.35s cubic-bezier(0.785, 0.135, 0.15, 0.86);
}

.pxl-team-list .project::before {
	bottom: calc(1/2 * 100%);
	background-color: var(--color-primarylight);
}

.pxl-team-list .project::after {
	top: calc(1/2 * 100%);
	background-color: var(--color-primarylight);
}

.pxl-team-list .project:hover::before,
.pxl-team-list .project:hover::after {
	height: 51%;

	@media (width >=576px) {
		height: calc(1/2 * 100%);
	}
}

.tooltip-arrow::before {
	content: "";
	position: absolute;
	background: 0 0;
	border: 7px solid transparent;
	z-index: 10;
	margin-bottom: 0;
	top: auto;
	bottom: -14px;
	transition: 0.3s;
	left: auto;
	right: 50%;
	transform: translateX(50%);
	border-top-color: var(--secondary);
}

.ct:hover .content {
	opacity: 100%;
}

.service-card {
	position: relative;
	width: 100%;
	overflow: hidden;
	--tw-duration: 500ms;
	transition-duration: 500ms;

	@media (width >=992px) {
		width: 37.8%;
	}
}

.service-card.active {
	@media (width >=992px) {
		width: 62.2%;
	}
}

.service-card.active .service-img:after {
	opacity: 70%;
}

.service-card.active .content {
	left: calc(1/2 * 100%);
	--tw-translate-x: calc(calc(1/2 * 100%) * -1);
	translate: var(--tw-translate-x) var(--tw-translate-y);
}

.service-card.active .service-text {
	left: -20%;
	--tw-translate-x: -100%;
	translate: var(--tw-translate-x) var(--tw-translate-y);
}

.pricing-wrapper {
	border-radius: var(--radius-2xl);

	&::after {
		content: var(--tw-content);
		position: absolute;
	}

	&::after {
		content: var(--tw-content);
		top: calc(var(--spacing) * 0);
	}

	&::after {
		content: var(--tw-content);
		right: calc(var(--spacing) * 0);
	}

	&::after {
		content: var(--tw-content);
		z-index: calc(var(--z-index-1) * -1);
	}

	&::after {
		content: var(--tw-content);
		width: 100%;
		height: 100%;
	}

	&::after {
		content: var(--tw-content);
		background-image: url('../images/background/bg7.png');
	}

	&::after {
		content: var(--tw-content);
		background-position: right;
	}

	&::after {
		content: var(--tw-content);
		background-repeat: no-repeat;
	}

	&::after {
		content: var(--tw-content);
		opacity: 0%;
	}

	&::after {
		content: var(--tw-content);
		--tw-duration: 300ms;
		transition-duration: 300ms;
	}

	&::after {
		--tw-content: '';
		content: var(--tw-content);
	}
}

.pricing-wrapper.active {
	--tw-translate-y: calc(var(--spacing) * -10);
	translate: var(--tw-translate-x) var(--tw-translate-y);
	background-color: var(--color-primary);
	--tw-duration: 300ms;
	transition-duration: 300ms;

	&::after {
		content: var(--tw-content);
		opacity: 100%;
	}
}

.pricing-wrapper.active .badge {
	display: inline-block;
}

.pricing-wrapper.active .title,
.pricing-wrapper.active .title span {
	color: var(--color-secondary);
}

.pricing-wrapper.active p,
.pricing-wrapper.active h4 {
	color: var(--color-secondary);
}

.pricing-wrapper.active .list-items li {
	color: var(--color-secondary);
}

.pricing-wrapper.active .list-items li::before {
	background-color: color-mix(in srgb, #000 10%, transparent);

	@supports (color: color-mix(in lab, red, red)) {
		background-color: color-mix(in oklab, var(--color-black) 10%, transparent);
	}

	background-image: none;
	color: var(--color-secondary);
}

.pricing-wrapper.active .btn {
	background-color: var(--color-secondary);
	background-image: none;
	color: var(--color-white);
}

@property --tw-translate-x {
	syntax: "*";
	inherits: false;
	initial-value: 0;
}

@property --tw-translate-y {
	syntax: "*";
	inherits: false;
	initial-value: 0;
}

@property --tw-translate-z {
	syntax: "*";
	inherits: false;
	initial-value: 0;
}

@property --tw-scale-x {
	syntax: "*";
	inherits: false;
	initial-value: 1;
}

@property --tw-scale-y {
	syntax: "*";
	inherits: false;
	initial-value: 1;
}

@property --tw-scale-z {
	syntax: "*";
	inherits: false;
	initial-value: 1;
}

@property --tw-rotate-x {
	syntax: "*";
	inherits: false;
}

@property --tw-rotate-y {
	syntax: "*";
	inherits: false;
}

@property --tw-rotate-z {
	syntax: "*";
	inherits: false;
}

@property --tw-skew-x {
	syntax: "*";
	inherits: false;
}

@property --tw-skew-y {
	syntax: "*";
	inherits: false;
}

@property --tw-space-y-reverse {
	syntax: "*";
	inherits: false;
	initial-value: 0;
}

@property --tw-border-style {
	syntax: "*";
	inherits: false;
	initial-value: solid;
}

@property --tw-leading {
	syntax: "*";
	inherits: false;
}

@property --tw-font-weight {
	syntax: "*";
	inherits: false;
}

@property --tw-shadow {
	syntax: "*";
	inherits: false;
	initial-value: 0 0 #0000;
}

@property --tw-shadow-color {
	syntax: "*";
	inherits: false;
}

@property --tw-shadow-alpha {
	syntax: "<percentage>";
	inherits: false;
	initial-value: 100%;
}

@property --tw-inset-shadow {
	syntax: "*";
	inherits: false;
	initial-value: 0 0 #0000;
}

@property --tw-inset-shadow-color {
	syntax: "*";
	inherits: false;
}

@property --tw-inset-shadow-alpha {
	syntax: "<percentage>";
	inherits: false;
	initial-value: 100%;
}

@property --tw-ring-color {
	syntax: "*";
	inherits: false;
}

@property --tw-ring-shadow {
	syntax: "*";
	inherits: false;
	initial-value: 0 0 #0000;
}

@property --tw-inset-ring-color {
	syntax: "*";
	inherits: false;
}

@property --tw-inset-ring-shadow {
	syntax: "*";
	inherits: false;
	initial-value: 0 0 #0000;
}

@property --tw-ring-inset {
	syntax: "*";
	inherits: false;
}

@property --tw-ring-offset-width {
	syntax: "<length>";
	inherits: false;
	initial-value: 0px;
}

@property --tw-ring-offset-color {
	syntax: "*";
	inherits: false;
	initial-value: #fff;
}

@property --tw-ring-offset-shadow {
	syntax: "*";
	inherits: false;
	initial-value: 0 0 #0000;
}

@property --tw-outline-style {
	syntax: "*";
	inherits: false;
	initial-value: solid;
}

@property --tw-blur {
	syntax: "*";
	inherits: false;
}

@property --tw-brightness {
	syntax: "*";
	inherits: false;
}

@property --tw-contrast {
	syntax: "*";
	inherits: false;
}

@property --tw-grayscale {
	syntax: "*";
	inherits: false;
}

@property --tw-hue-rotate {
	syntax: "*";
	inherits: false;
}

@property --tw-invert {
	syntax: "*";
	inherits: false;
}

@property --tw-opacity {
	syntax: "*";
	inherits: false;
}

@property --tw-saturate {
	syntax: "*";
	inherits: false;
}

@property --tw-sepia {
	syntax: "*";
	inherits: false;
}

@property --tw-drop-shadow {
	syntax: "*";
	inherits: false;
}

@property --tw-drop-shadow-color {
	syntax: "*";
	inherits: false;
}

@property --tw-drop-shadow-alpha {
	syntax: "<percentage>";
	inherits: false;
	initial-value: 100%;
}

@property --tw-drop-shadow-size {
	syntax: "*";
	inherits: false;
}

@property --tw-backdrop-blur {
	syntax: "*";
	inherits: false;
}

@property --tw-backdrop-brightness {
	syntax: "*";
	inherits: false;
}

@property --tw-backdrop-contrast {
	syntax: "*";
	inherits: false;
}

@property --tw-backdrop-grayscale {
	syntax: "*";
	inherits: false;
}

@property --tw-backdrop-hue-rotate {
	syntax: "*";
	inherits: false;
}

@property --tw-backdrop-invert {
	syntax: "*";
	inherits: false;
}

@property --tw-backdrop-opacity {
	syntax: "*";
	inherits: false;
}

@property --tw-backdrop-saturate {
	syntax: "*";
	inherits: false;
}

@property --tw-backdrop-sepia {
	syntax: "*";
	inherits: false;
}

@property --tw-duration {
	syntax: "*";
	inherits: false;
}

@property --tw-ease {
	syntax: "*";
	inherits: false;
}

@property --tw-content {
	syntax: "*";
	inherits: false;
	initial-value: "";
}

@layer properties {
	@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {

		*,
		::before,
		::after,
		::backdrop {
			--tw-translate-x: 0;
			--tw-translate-y: 0;
			--tw-translate-z: 0;
			--tw-scale-x: 1;
			--tw-scale-y: 1;
			--tw-scale-z: 1;
			--tw-rotate-x: initial;
			--tw-rotate-y: initial;
			--tw-rotate-z: initial;
			--tw-skew-x: initial;
			--tw-skew-y: initial;
			--tw-space-y-reverse: 0;
			--tw-border-style: solid;
			--tw-leading: initial;
			--tw-font-weight: initial;
			--tw-shadow: 0 0 #0000;
			--tw-shadow-color: initial;
			--tw-shadow-alpha: 100%;
			--tw-inset-shadow: 0 0 #0000;
			--tw-inset-shadow-color: initial;
			--tw-inset-shadow-alpha: 100%;
			--tw-ring-color: initial;
			--tw-ring-shadow: 0 0 #0000;
			--tw-inset-ring-color: initial;
			--tw-inset-ring-shadow: 0 0 #0000;
			--tw-ring-inset: initial;
			--tw-ring-offset-width: 0px;
			--tw-ring-offset-color: #fff;
			--tw-ring-offset-shadow: 0 0 #0000;
			--tw-outline-style: solid;
			--tw-blur: initial;
			--tw-brightness: initial;
			--tw-contrast: initial;
			--tw-grayscale: initial;
			--tw-hue-rotate: initial;
			--tw-invert: initial;
			--tw-opacity: initial;
			--tw-saturate: initial;
			--tw-sepia: initial;
			--tw-drop-shadow: initial;
			--tw-drop-shadow-color: initial;
			--tw-drop-shadow-alpha: 100%;
			--tw-drop-shadow-size: initial;
			--tw-backdrop-blur: initial;
			--tw-backdrop-brightness: initial;
			--tw-backdrop-contrast: initial;
			--tw-backdrop-grayscale: initial;
			--tw-backdrop-hue-rotate: initial;
			--tw-backdrop-invert: initial;
			--tw-backdrop-opacity: initial;
			--tw-backdrop-saturate: initial;
			--tw-backdrop-sepia: initial;
			--tw-duration: initial;
			--tw-ease: initial;
			--tw-content: "";
		}
	}
}


/* ============== Client Section ==============  */

.client-section h5 {
	color: var(--color-secondary);
	padding-top: calc(var(--spacing) * 10);
}

.tw-mb-16 {
	margin-block-end: 2rem;
}

.swiper {
	margin-left: auto;
	margin-right: auto;
	position: relative;
	overflow: hidden;
	list-style: none;
	padding: 0;
	z-index: 1;
	display: block
}

.swiper-vertical>.swiper-wrapper {
	flex-direction: column
}

.swiper-wrapper {
	position: relative;
	width: 100%;
	height: 100%;
	z-index: 1;
	display: flex;
	transition-property: transform;
	transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial);
	box-sizing: content-box
}

.swiper-android .swiper-slide,
.swiper-ios .swiper-slide,
.swiper-wrapper {
	transform: translate3d(0px, 0, 0)
}


.left-right-gradient::before,
.left-right-gradient::after {
	position: absolute;
	content: "";
	width: 48px;
	height: 100%;
	inset-inline-start: 0;
	inset-block-start: 0;
	background: linear-gradient(90deg, #f8f8f8, #fffcfc00);
	z-index: 2;
}

.left-right-gradient::after {
	background: linear-gradient(90deg, #fffcfc00, #f8f8f8);
	inset-inline-start: auto;
	inset-inline-end: 0;
}

.gradient-width-200::before,
.gradient-width-200::after {
	width: 180px;
}

/* ============= Video Section =============  */
.video-section {
	padding: 80px;
	text-align: center;
}

.video-heading {
	font-size: clamp(28px, 3vw, 40px);
	margin-bottom: 60px;
	opacity: 0.9;
}

.max-w-\[1080px\] {
	max-width: 1080px;
}

/* Wrapper */
.video-wrapper {
	position: sticky;
	top: 120px;
	height: 420px;
	display: flex;
	justify-content: center;
	align-items: center;
	will-change: contents;
}

/* Cards */
.video-card {
	position: absolute;
	width: 650px;
	height: 360px;
	border-radius: 22px;
	overflow: hidden;
	background: #ddd;
	transition: transform 0.6s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.6s ease-out, filter 0.6s ease-out;
	will-change: transform, opacity;
}

/* VIDEO */
.video-card video {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* INITIAL STATE (slightly zoomed out) */
.video-card.center {
	z-index: 3;
	transform: scale(0.9);
	border: 2px solid rgba(255, 0, 0, 0.4);
}

/* SIDE CARDS INITIAL */
.video-card.left,
.video-card.right {
	z-index: 1;
	transform: scale(0.9);
	opacity: 0;
	filter: blur(4px);
}

/* ================ STEP 1: ZOOM EFFECT ============*/
.video-wrapper.zoomed .center {
	transform: scale(1);
}

/* ========================= */
/* STEP 2: SPLIT ANIMATION */
/* ========================= */
.video-wrapper.active .center {
	transform: scale(1.3);
}

.video-wrapper.active .left {
	transform: translateX(-380px) scale(0.85);
	opacity: 0.5;
	filter: blur(2px);
	width: 200px;
}

.video-wrapper.active .right {
	transform: translateX(380px) scale(0.85);
	opacity: 0.5;
	filter: blur(2px);
	width: 200px;
}

/* Play Button */
.play-btn {
	width: 70px;
	height: 70px;
	background: rgba(255, 0, 0, 0.25);
	backdrop-filter: blur(10px);
	border-radius: 50%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	cursor: pointer;
	transition: transform 0.3s ease-out;
	will-change: transform;
}

.play-btn:hover {
	transform: translate(-50%, -50%) scale(1.1);
}

.play-btn::after {
	content: "";
	position: absolute;
	left: 28px;
	top: 22px;
	border-left: 18px solid red;
	border-top: 12px solid transparent;
	border-bottom: 12px solid transparent;
}

/* Hide play button when playing */
.video-card.playing .play-btn {
	opacity: 0;
	pointer-events: none;
}

/* Responsive */
@media (max-width: 768px) {
	.video-card {
		width: 90%;
		height: 220px;
	}

	.video-wrapper.active .left,
	.video-wrapper.active .right {
		display: none;
	}
}

/* ================ point list icons ================   */

.icon-circle {
	width: 30px;
	height: 30px;
	background: #2a2a2a;
	/* grey circle */
	border-radius: 50%;

	display: flex;
	align-items: center;
	justify-content: center;

	padding: 6px;
	/* spacing around icon */
}

/* Optional: make SVG scale nicely */
.icon-circle svg {
	width: 18px;
	height: 18px;
}


/* ================Feature  SECTION  =================== */


:root {
	--card-bg: #ebdcff;
	--cta-bg: #31153d;
	--text-light: #9b9b9b;
	--radius: 18px;
	--angle: 0deg;
}

.feature-section {
	/* padding: clamp(5px, 2vw, 50px); */
	text-align: center;
}

/* TITLE */
.feature-section .section-title {
	/* font-size: clamp(22px, 3vw, 42px); */
}

/* =========================
   GRID
========================= */
.feature-section .feature-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 26px;
	align-items: stretch;
}

/* =========================
   CARD
========================= */
.feature-section .card {
	position: relative;
	padding: 28px;
	border-radius: var(--radius);
	background: var(--card-bg);
	transition: 0.3s ease;
	z-index: 1;
	gap: 12px;
}

/* ICON */
.feature-section .card .icon {
	width: 70px;
	height: 70px;
	border-radius: 50%;
	background: linear-gradient(122deg, #a363f9, transparent);
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 14px;
	font-size: 18px;
	transition: 0.3s ease;
}

.feature-section .card .icon img {
	width: 100%;
	height: auto;
	padding: 8px;
}

/* TEXT */
.feature-section .card h3 {
	font-size: clamp(20px, 2.5vh, 30px);
	margin-bottom: 8px;
	font-weight: 700;
	color: #333;
}

.feature-section .card p {
	font-size: clamp(16px, 2vh, 28px);
	color: #444444;
	line-height: 1.4;
}

/* =========================
   HOVER EFFECTS
========================= */
.feature-section .card:hover {
	transform: translateY(-6px);
}

.feature-section .card:hover .icon {
	transform: scale(1.08);
}

/* =========================
   GRADIENT BORDER (CLEAN)
========================= */
.feature-section .card.bordergradient::before {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: var(--radius);
	padding: 1.5px;
	background: conic-gradient(from var(--angle), #31153d, rgba(40, 40, 46, 0.2), transparent, #7a3595);
	/* SHOW ONLY BORDER */
	-webkit-mask:
		linear-gradient(#000 0 0) content-box,
		linear-gradient(#000 0 0);
	-webkit-mask-composite: xor;
	mask-composite: exclude;

	opacity: 0;
	transition: 0.3s ease;
}

/* HOVER ACTIVATE BORDER */
.feature-section .card.bordergradient:hover::before {
	opacity: 1;
	animation: rotate 4s linear infinite;
}

/* =========================
   CTA CARD
========================= */
.feature-section .cta-card {
	grid-column: span 2;
	background: var(--cta-bg);
	border-radius: var(--radius);
	padding: 0px;

	display: grid;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 0;
}

/* CTA TEXT */
.feature-section .cta-card h3 {
	font-size: clamp(20px, 2.5vw, 30px);
	font-weight: 500;
}

/* BUTTON */
.feature-section .cta-card .cta-btn {
	display: flex;
	align-items: center;
	gap: 12px;

	background: #eee;
	padding: 14px 28px;
	border-radius: 50px;
	border: none;

	cursor: pointer;
	font-size: 15px;
	transition: 0.3s ease;
}

/* BUTTON ARROW */
.feature-section .cta-card .cta-btn .arrow {
	background: #fff;
	width: 32px;
	height: 32px;
	border-radius: 50%;

	display: flex;
	align-items: center;
	justify-content: center;
}

/* BUTTON HOVER */
.feature-section .cta-card .cta-btn:hover {
	transform: scale(1.05);
}

/* =========================
   ANIMATION
========================= */
@keyframes rotate {
	to {
		--angle: 360deg;
	}
}

/* =========================
   RESPONSIVE
========================= */
@media (max-width: 1024px) {
	.feature-section .feature-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.feature-section .cta-card {
		grid-column: span 2;
	}
}

@media (max-width: 600px) {
	.feature-section .feature-grid {
		grid-template-columns: 1fr;
	}

	.feature-section .cta-card {
		grid-column: span 1;
	}

	.feature-section .section-title {
		line-height: 1.4;
	}
}

.feature-section .cta-card img {
	width: 100%;
	height: 360px;
	object-fit: cover;
	border-radius: 12px;
}

@media (max-width: 1280px) {
	.feature-section .cta-card img {
		height: 300px;
	}
}

@media (max-width: 768px) {
	.feature-section .cta-card img {
		height: 250px;
	}
}

@media (max-width: 480px) {
	.feature-section .cta-card img {
		height: 200px;
	}
}

/* ======== Services Section =========== */

.cardStacking {
	background: #f8f8f8;
	position: relative;
	min-height: 200vh;
	overflow: visible;
	margin: 100px auto;
}

.cardStacking .section-padding {
	overflow: visible;
}

.cardStacking .container {
	margin: auto;
	padding: 0 20px;
	overflow: visible;
}

/* ===== WRAPPER ===== */
.cardStacking .wrapper {
	position: relative;
	display: grid;
	grid-template-columns: minmax(300px, 38%) 1fr;
	column-gap: 80px;
	align-items: start;
	overflow: visible;
}

/* ===== LEFT SIDE ===== */
.cardStacking .left {
	position: sticky;
	top: 120px;
	align-self: start;
	max-height: calc(100vh - 140px);
	overflow: visible;
	z-index: 999;
}

.cardStacking .right {
	position: relative;
	z-index: 1;
}

.cardStacking .stickyBox {
	position: relative;
	padding: 24px;
	border-radius: 12px;
	width: 100%;
	height: fit-content;
}

.cardStacking .left .stickyBox {
	max-height: inherit;
	overflow: hidden;
}

.cardStacking .left .stickyBox:hover {
	overflow: auto;
}

/* ===== TEXT ===== */
.cardStacking .stickyBox h2 {
	font-size: clamp(22px, 3vw, 48px);
	font-weight: bold;
	margin-bottom: 10px;
	line-height: 1.2;
}

.cardStacking .stickyBox p {
	font-size: clamp(14px, 1.5vw, 18px);
	color: #666;
	margin: 20px 0;
	line-height: 1.7;
}

/* LEFT stat boxes */
.left .stat-box {
	background: #fff;
	padding: 20px;
	border-radius: 16px;
	box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
}

.left .stat-box h3 {
	font-size: 32px;
	font-weight: bold;
	color: #000;
}

.left .stat-box p {
	font-size: 14px;
	color: #555;
	margin-bottom: 0;
}

.gap-6 {
	gap: 24px;
}

/* ===== STACK CARDS ===== */
.cardStacking .stackCard {
	position: relative;
	margin-bottom: 100px;
}

/* ===== CARD DESIGN ===== */
.cardStacking .card {
	width: 100%;
	border-radius: 20px;
	overflow: hidden;
	background: linear-gradient(rgb(52 28 58), rgb(18 9 24));
	color: #fff;
	box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
	position: relative;
	z-index: 1;
}

.cardStacking .cardContent {
	display: flex;
	align-items: center;
	padding: 0px;
	gap: 20px;
}

.cardStacking .text {
	flex: 1;
	padding: 30px;
}

.cardStacking .text h4 {
	font-size: clamp(18px, 2vw, 28px);
	margin-bottom: 10px;
	line-height: 1.3;
}

.cardStacking .text p {
	font-size: clamp(13px, 1.2vw, 16px);
	color: rgba(255, 255, 255, 0.6);
	margin-bottom: 15px;
	line-height: 1.6;
}

.cardStacking .text span {
	color: #c56eff;
	font-size: 14px;
}

.cardStacking .image {
	width: 250px;
	height: 280px;
	border-radius: 0px;
	overflow: hidden;
	flex-shrink: 0;
	padding: 0;
}

.cardStacking .image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Read More link */
.text-primary {
	color: rgb(214 176 255);
}

.font-semibold {
	font-weight: 600;
}

.mt-2 {
	margin-top: 8px;
}

.inline-block {
	display: inline-block;
}

/* ===== TABLET (max 992px) ===== */
@media (max-width: 992px) {
	.cardStacking .wrapper {
		display: block;
	}

	.cardStacking .left,
	.cardStacking .right {
		width: 100%;
	}

	.cardStacking .left {
		position: relative;
		top: auto;
		max-height: none;
		align-self: auto;
	}

	.cardStacking .left .stickyBox {
		overflow: visible;
	}

	.cardStacking .cardContent {
		flex-direction: row;
	}

	.cardStacking .stickyBox h2 {
		font-size: clamp(22px, 4vw, 40px);
	}

	.cardStacking .stickyBox p {
		font-size: clamp(14px, 2vw, 18px);
	}

	.cardStacking .image {
		width: 200px;
		height: 240px;
	}
}

/* ===== MOBILE (max 768px) ===== */
@media (max-width: 768px) {
	.cardStacking {
		margin: 20px auto;
		min-height: unset;
	}

	.cardStacking .stickyBox {
		padding: 16px;
	}

	.cardStacking .stickyBox h2 {
		font-size: clamp(20px, 6vw, 32px);
	}

	.cardStacking .stickyBox p {
		font-size: clamp(13px, 3.5vw, 16px);
		margin: 15px 0;
	}

	.cardStacking .cardContent {
		flex-direction: column;
	}

	.cardStacking .image {
		width: 100%;
		height: 200px;
		margin-top: 0;
	}

	.cardStacking .text {
		padding: 20px;
	}

	.cardStacking .text h4 {
		font-size: clamp(16px, 5vw, 22px);
	}

	.cardStacking .text p {
		font-size: clamp(13px, 3.5vw, 15px);
	}

	.cardStacking .stackCard {
		margin-bottom: 30px;
	}
}

/* ===== SMALL MOBILE (max 480px) ===== */
@media (max-width: 480px) {
	.cardStacking {
		margin: 50px auto;
		min-height: unset;
	}

	.cardStacking .stickyBox h2 {
		font-size: clamp(18px, 7vw, 26px);
	}

	.cardStacking .stickyBox p {
		font-size: 18px;
	}

	.cardStacking .text h4 {
		font-size: clamp(15px, 5.5vw, 20px);
	}

	.cardStacking .text p {
		font-size: 17px;
	}

	.cardStacking .image {
		height: 180px;
	}
}

/* ================ Review Section ================ */
.reviewSwiper {
	padding-bottom: 30px;
}

/* BOX LOOK */
.reviewSwiper-wrapper {
	background: #fff;
	padding: 60px 70px;
	border-radius: 20px;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
}

/* NAME */
.review-name {
	color: #111;
	transition: 0.3s;
}

/* ARROWS */
.review-arrow {
	color: #bbb;
	font-size: 20px;
	transition: all 0.3s ease;
	position: relative;
}

/* 🔥 HOVER EFFECT (ATTRACTIVE) */
.review-arrow:hover {
	color: #000;
	transform: translateX(4px);
}

.review-prev:hover {
	transform: translateX(-4px);
}

/* PAGINATION */
.reviewSwiper .swiper-pagination {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-top: 30px;
	max-width: 900px;
	padding: 0 64px
}

/* DOT */
.reviewSwiper .swiper-pagination-bullet {
	width: 10px;
	height: 10px;
	background: #b566d7a3;
	opacity: 1;
	border-radius: 50%;
	transition: all 0.35s ease;
}

/* ACTIVE (CUSTOM CONTROLLED) */
.reviewSwiper .swiper-pagination-bullet.custom-active {
	width: 34px;
	height: 10px;
	border-radius: 20px;
	background: #ab5bce;
}

/* EXTRA SMOOTH ANIMATION */
.reviewSwiper .swiper-pagination-bullet {
	transform: scale(0.9);
}

.reviewSwiper .swiper-pagination-bullet.custom-active {
	transform: scale(1);
}

.review-inner {
	padding: 0 64px;
	max-width: 900px;
	margin: 0 auto;
	/* CENTER ALIGN */
}

.review-inner h4 {
	color: #111;
	margin-bottom: 5px;
	font-weight: 600;
}

.review-star {
	color: #F9BC2F;
}


/* =====Service CARD DESIGN ===== */
.cardStacking .card {
	width: 100%;
	border-radius: 20px;
	overflow: hidden;
	background: linear-gradient(rgb(52 28 58), rgb(18 9 24));
	color: #fff;
	box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
}

.cardStacking .cardContent {
	display: flex;
	align-items: center;
	padding: 0px;
	gap: 20px;
}

.cardStacking .text {
	flex: 1;
	padding: 30px;
}

.cardStacking .text h4 {
	font-size: 28px;
	margin-bottom: 10px;
}

.cardStacking .text p {
	color: rgba(255, 255, 255, 0.6);
	margin-bottom: 15px;
}

.cardStacking .text span {
	color: #6eff6e;
	font-size: 14px;
}

.cardStacking .image {
	width: 250px;
	height: 280px;
	border-radius: 0px;
	overflow: hidden;
	flex-shrink: 0;
	padding: 0;
}

.cardStacking .image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Read More link */
.text-primary {
	color: rgb(214 176 255);
}

.font-semibold {
	font-weight: 600;
}

.mt-2 {
	margin-top: 8px;
}

.inline-block {
	display: inline-block;
}

/* ===== STACK ORDER ===== */
.cardStacking .card {
	position: relative;
	z-index: 1;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 992px) {
	.cardStacking .wrapper {
		flex-direction: column;
	}

	.cardStacking .left,
	.cardStacking .right {
		width: 100%;
	}

	/* disable sticky on mobile */
	.cardStacking .left {
		position: relative;
		top: 0;
		align-self: auto;
	}

	.cardStacking .cardContent {
		flex-direction: column;
	}

	.cardStacking .image {
		width: 100%;
		height: 200px;
		margin-top: 20px;
	}

	.cardStacking .stickyBox h2 {
		font-size: 38px;
	}
}

/* ================ Review Section ================ */
.reviewSwiper {
	padding-bottom: 65px;
}

/* BOX LOOK */
.reviewSwiper-wrapper {
	background: #fff;
	padding: 60px 70px;
	border-radius: 20px;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
}

/* NAME */
.review-name {
	color: #111;
	transition: 0.3s;
}

/* ARROWS */
.review-arrow {
	color: #bbb;
	font-size: 20px;
	transition: all 0.3s ease;
	position: relative;
}

.review-arrow:hover {
	color: #000;
	transform: translateX(4px);
}

.review-prev:hover {
	transform: translateX(-4px);
}

/* PAGINATION */
.reviewSwiper .swiper-pagination {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-top: 30px;
	max-width: 900px;
	padding: 0 64px;
}

/* DOT */
.reviewSwiper .swiper-pagination-bullet {
	width: 10px;
	height: 10px;
	background: #b566d7a3;
	opacity: 1;
	border-radius: 50%;
	transition: all 0.35s ease;
	transform: scale(0.9);
}

/* ACTIVE */
.reviewSwiper .swiper-pagination-bullet.custom-active {
	width: 34px;
	height: 10px;
	border-radius: 20px;
	background: #ab5bce;
	transform: scale(1);
}

/* REVIEW INNER */
.review-inner {
	padding: 0 64px;
	max-width: 900px;
	margin: 0 auto;
}

.review-inner h4 {
	color: #111;
	margin-bottom: 5px;
	font-weight: 600;
}

.review-star {
	color: #F9BC2F;
}

/* ===== TABLET (max 1024px) ===== */
@media (max-width: 1024px) {
	.review-inner {
		padding: 0 40px;
	}

	.reviewSwiper .swiper-pagination {
		padding: 0 40px;
	}

	.reviewSwiper {
		padding-bottom: 55px;
	}
}

/* ===== TABLET SMALL (max 768px) ===== */
@media (max-width: 768px) {
	.review-inner {
		padding: 0 24px;
	}

	.reviewSwiper .swiper-pagination {
		padding: 0 24px;
		max-width: 100%;
	}

	.reviewSwiper {
		padding-bottom: 50px;
	}

	.reviewSwiper-wrapper {
		padding: 40px 24px;
	}
}

/* ===== MOBILE (max 480px) ===== */
@media (max-width: 480px) {
	.review-inner {
		padding: 0 16px;
	}

	.reviewSwiper .swiper-pagination {
		padding: 0 16px;
		gap: 6px;
	}

	.reviewSwiper {
		padding-bottom: 40px;
	}

	.reviewSwiper-wrapper {
		padding: 30px 16px;
	}

	.review-arrow {
		font-size: 16px;
	}
}

/* =========== Footer and CTA Section ===========  */
:root {
	--bg-white: #ffffff;
	--bg-dark: #1c1c1c;
	--pink-bg: #f2dedd;
	--text-light: #ffffff;
	--text-muted: #999999;
	--text-dark: #111111;
	--watermark-color: rgba(255, 255, 255, 0.045);
	--border-color: rgba(255, 255, 255, 0.1);
}

.section-wrap {
	position: relative;
}

/* White strip = upper half of CTA card region */
.white-strip {
	background: var(--bg-white);
	height: 140px;
	/* half the card height */
}

/* Dark block = lower half of CTA card + full footer */
.dark-block {
	background: var(--bg-dark);
	position: relative;
}

/* ════════════════════════════
       CTA CARD  — absolute, straddles the boundary
    ════════════════════════════ */
.cta-float {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	padding: 0 60px;
	z-index: 20;
	/* card is ~180px tall; white-strip is 140px → card starts 0px above boundary */
}

.cta-card {
	background: url(../images/background/bg2.jpg) center/cover no-repeat;
	background-position: sticky;
	border-radius: 18px;
	padding: 52px 60px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 32px;
	flex-wrap: wrap;
}

.cta-heading {
	font-size: clamp(1.75rem, 3.2vw, 2.9rem);
	font-weight: 700;
	color: var(--text-light);
	line-height: 1.18;
	max-width: 680px;
}

.cta-left {
	display: flex;
	flex-direction: column;
	gap: 16px;
	flex: 1;
}

.cta-text {
	font-size: clamp(1rem, 1.5vw, 1.1rem);
	color: var(--text-light);
	line-height: 1.6;
	max-width: 450px;
	margin: 0;
}

.cta-btn {
	display: inline-flex;
	align-items: center;
	background: rgb(172 128 201);
	border-radius: 50px;
	overflow: hidden;
	backdrop-filter: blur(10px);
	border: none;
	cursor: pointer;
	text-decoration: none;
	transition: background 0.22s;
	flex-shrink: 0;
}

.cta-btn:hover {
	background: rgba(228, 199, 255, 0.78);
	border: 1px solid rgb(172 128 201);
}

.cta-btn-label {
	font-size: 0.95rem;
	font-weight: 500;
	color: var(--text-dark);
	padding: 16px 28px;
	white-space: nowrap;
}

.cta-btn-icon {
	width: 48px;
	height: 48px;
	border-radius: 50%;
	background: var(--text-dark);
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 4px;
	flex-shrink: 0;
	transition: background 0.22s;
}

.cta-btn:hover .cta-btn-icon {
	background: #2a2a2a;
}

.cta-btn-icon svg {
	width: 16px;
	height: 16px;
	stroke: #fff;
	fill: none;
	stroke-width: 2.3;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.footer-push {
	height: 200px;
	/* matches cta card height + comfortable gap */
}

.footer-cols-wrap {
	padding: 0 60px;
	position: relative;
	z-index: 2;
}

.footer-cols {
	display: grid;
	grid-template-columns: 1.6fr 1fr 1fr 1fr 1fr;
	gap: 40px;
	align-items: start;
}

/* Logo placeholder */
.logo-placeholder {
	width: 160px;
	height: 110px;
	background: #272727;
	border-radius: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 1px solid rgba(255, 255, 255, 0.07);
}

.logo-placeholder svg {
	opacity: 0.3;
}

/* Column headers */
.col-head {
	font-family: 'Syne', sans-serif;
	font-size: 0.85rem;
	font-weight: 700;
	color: #fff;
	margin-bottom: 20px;
	display: flex;
	align-items: center;
	gap: 7px;
}

.col-head .flag {
	display: inline-block;
	width: 13px;
	height: 13px;
	background: #fff;
	clip-path: polygon(0 0, 62% 0, 100% 50%, 62% 100%, 0 100%);
	flex-shrink: 0;
}

/* Column links */
.foot-col ul {
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.foot-col ul li a {
	font-size: 0.855rem;
	color: var(--text-muted);
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	transition: color 0.22s, gap 0.22s;
	position: relative;
	overflow: hidden;
}

.foot-col ul li a:hover {
	color: #fff;
	gap: 10px;
}

/* Arrow icon — hidden by default, slides in on hover */
.foot-col ul li a .link-arrow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	transform: translate(-6px, 4px) rotate(-45deg);
	transition: opacity 0.22s ease, transform 0.22s ease;
	flex-shrink: 0;
}

.foot-col ul li a:hover .link-arrow {
	opacity: 1;
	transform: translate(0, 0) rotate(-45deg);
}

.foot-col ul li a .link-arrow svg {
	width: 11px;
	height: 11px;
	stroke: #fff;
	fill: none;
	stroke-width: 2.2;
	stroke-linecap: round;
	stroke-linejoin: round;
}

/* "About Us" special arrow chip stays visible always */
.arrow-chip {
	font-size: 0.68rem;
	background: rgba(255, 255, 255, 0.1);
	border-radius: 3px;
	padding: 1px 5px;
	color: #bbb;
	transition: background 0.2s, color 0.2s;
}

.foot-col ul li a:hover .arrow-chip {
	background: rgba(255, 255, 255, 0.22);
	color: #fff;
}

/* ════════════════════════════
       WATERMARK — gradient fade
    ════════════════════════════ */
.watermark {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 90px;
	font-size: clamp(72px, 15vw, 200px);
	font-weight: 800;
	/* gradient: bright white top → nearly invisible bottom */
	background: linear-gradient(to bottom,
			rgba(255, 255, 255, 0.07) 0%,
			rgba(255, 255, 255, 0.04) 40%,
			rgba(255, 255, 255, 0.01) 75%,
			rgba(255, 255, 255, 0.0) 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
	letter-spacing: -3px;
	line-height: 1;
	white-space: nowrap;
	text-align: center;
	pointer-events: none;
	user-select: none;
	z-index: 1;
}

/* ════════════════════════════
       FOOTER BOTTOM BAR
    ════════════════════════════ */
.footer-bottom {
	margin-top: 100px;
	padding: 0 60px;
	position: relative;
	z-index: 2;
}

.bottom-row {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 48px;
	flex-wrap: wrap;
	padding-bottom: 26px;
}

.tagline {
	font-size: 1rem;
	color: var(--text-muted);
	line-height: 1.78;
	max-width: 968px;
	flex: 1;
}

.social-row {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-shrink: 0;
	padding-top: 2px;
}

.soc {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.09);
	border: 1.5px solid rgba(255, 255, 255, 0.16);
	display: flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	transition: background 0.2s, transform 0.2s;
}

.soc:hover {
	background: rgba(255, 255, 255, 0.2);
	transform: translateY(-2px);
}

.soc svg {
	width: 15px;
	height: 15px;
	fill: #fff;
}

.divider {
	border: none;
	border-top: 1px solid var(--border-color);
}

.copyright {
	text-align: center;
	padding: 22px 0 30px;
	font-size: 1rem;
	color: var(--text-muted);
}

/* ════════════════════════════
       RESPONSIVE
    ════════════════════════════ */
@media (max-width: 1080px) {

	.cta-float,
	.footer-cols-wrap,
	.footer-bottom {
		padding-left: 40px;
		padding-right: 40px;
	}

	.footer-cols {
		grid-template-columns: 1fr 1fr 1fr 1fr;
	}

	.logo-col {
		grid-column: 1 / -1;
	}

	.watermark {
		bottom: 150px;
	}
}

@media (max-width: 768px) {
	.white-strip {
		height: 110px;
	}

	.footer-push {
		height: 220px;
	}

	.cta-float,
	.footer-cols-wrap,
	.footer-bottom {
		padding-left: 20px;
		padding-right: 20px;
	}

	.cta-card {
		padding: 36px 28px;
		flex-direction: column;
		align-items: flex-start;
	}

	.footer-cols {
		grid-template-columns: 1fr 1fr;
		gap: 28px;
	}

	.logo-col {
		grid-column: 1 / -1;
	}

	.bottom-row {
		flex-direction: column;
	}

	.watermark {
		bottom: 250px;
	}
}

@media (max-width: 480px) {
	.footer-cols {
		grid-template-columns: 1fr 1fr;
	}

	.cta-card {
		align-items: center;
		text-align: center;
	}

	.watermark {
		bottom: 340px;
	}
}


/* ================ How We Work Section ================ */

/* ── ROW WRAPPERS ── */
.icon-cards-row {
	display: flex;
	align-items: stretch;
	gap: 20px;
	margin-bottom: 50px;
}

/* ── CARDS ── */
.card.bordergradient {
	flex: 1;
	min-height: 350px;
	border-radius: 16px;
}

.card.bordergradient .p-40 {
	padding: 40px 50px 0 40px;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}

.card.bordergradient img {
	display: block;
	margin: 0 auto 10px;
}

/* ── HEADING + ARROWS BOX ── */
.icon-cards-intro {
	display: flex;
	flex-direction: column;
	flex: 1;
	min-height: 350px;
}

/* ── BOTTOM CTA BOX ── */
.icon-cards-bottom {
	border-radius: 16px;
	padding: 40px;
	text-align: center;
}

/* ════════════════════════════
   RESPONSIVE — 1024px
════════════════════════════ */
@media (max-width: 1024px) {
	.icon-cards-row {
		flex-wrap: wrap;
		gap: 16px;
	}

	.card.bordergradient {
		flex: 1 1 calc(50% - 16px);
		min-height: 300px;
	}

	.icon-cards-intro {
		flex: 1 1 100%;
		min-height: auto;
	}
}

/* ════════════════════════════
   RESPONSIVE — 768px
════════════════════════════ */
@media (max-width: 768px) {
	.icon-cards-row {
		flex-direction: column;
		gap: 16px;
		margin-bottom: 30px;
	}

	.card.bordergradient {
		flex: 1 1 100%;
		min-height: auto;
		width: 100%;
	}

	.card.bordergradient .p-40 {
		padding: 28px 24px 20px;
	}

	.icon-cards-intro {
		min-height: auto;
	}

	.icon-cards-bottom {
		padding: 28px 20px;
	}
}

/* ════════════════════════════
   RESPONSIVE — 480px
════════════════════════════ */
@media (max-width: 480px) {
	.card.bordergradient .p-40 {
		padding: 20px 16px 16px;
	}

	.card.bordergradient img {
		width: 150px;
	}

	.icon-cards-bottom {
		padding: 20px 16px;
		border-radius: 12px;
	}
}

/* ===================== Marque Section ===================== */

@keyframes marquee {
	0% {
		transform: translateX(0);
	}

	100% {
		transform: translateX(-50%);
	}
}

.animate-marquee {
	animation: marquee 30s linear infinite;
}

.animate-marquee:hover {
	animation-play-state: paused;
}

/* ====================== Thank you ========================= */

@keyframes fadeUp {
	from {
		opacity: 0;
		transform: translateY(26px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes scaleIn {
	from {
		opacity: 0;
		transform: scale(.6);
	}

	to {
		opacity: 1;
		transform: scale(1);
	}
}

@keyframes ripple {
	0% {
		transform: scale(1);
		opacity: .5;
	}

	100% {
		transform: scale(2.8);
		opacity: 0;
	}
}

@keyframes float {

	0%,
	100% {
		transform: translateY(0);
	}

	50% {
		transform: translateY(-10px);
	}
}

@keyframes tickDraw {
	to {
		stroke-dashoffset: 0;
	}
}

@keyframes gradShift {

	0%,
	100% {
		background-position: 0% 50%;
	}

	50% {
		background-position: 100% 50%;
	}
}

.thankyou-fu1 {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: rgba(214, 166, 254, .15);
	border: 1px solid rgba(214, 166, 254, .45);
	border-radius: 999px;
	padding: 5px 16px;
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .06em;
	color: #1B4C40;
	margin-bottom: 32px;
	animation: fadeUp .6s ease both .10s;
}

.thankyou-fu2 {
	animation: fadeUp .6s ease both .26s;
}

.thankyou-fu3 {
	animation: fadeUp .6s ease both .42s;
}

.thankyou-fu4 {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 12px;
	width: 100%;
	margin-bottom: 44px;
	animation: fadeUp .6s ease both .58s;
}

.thankyou-fu5 {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	background: #1B4C40;
	color: #fff;
	border: 2px solid #1B4C40;
	border-radius: 50px;
	padding: 13px 28px 13px 14px;
	font-weight: 700;
	font-size: .95rem;
	text-decoration: none;
	transition: all .3s;
	animation: fadeUp .6s ease both .74s;
}


.thankyou-fus span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: #D6A6FE;
	flex-shrink: 0;
}

.thankyou-icon-wrap {
	position: relative;
	width: 108px;
	height: 108px;
	margin-bottom: 36px;
	animation:
		scaleIn .6s cubic-bezier(.34, 1.56, .64, 1) both .05s,
		float 3.6s ease-in-out 1.2s infinite;
}

.thankyou-ripple {
	position: absolute;
	inset: 0;
	border-radius: 50%;
	border: 2px solid #D6A6FE;
	animation: ripple 2.4s ease-out infinite;
}

.thankyou-ripple:nth-child(2) {
	animation-delay: .8s;
}

.thankyou-ripple:nth-child(3) {
	animation-delay: 1.6s;
}

.thankyou-tick {
	stroke-dasharray: 62;
	stroke-dashoffset: 62;
	animation: tickDraw .55s ease forwards .42s;
}

.thankyou-heading {
	font-size: clamp(2.6rem, 8vw, 4.2rem);
	line-height: 1.1;
	margin-bottom: 16px;
	background: linear-gradient(135deg, #31153D 0%, #662f8b 50%, #713E8A 100%);
	background-size: 200% 200%;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
	animation: gradShift 4s ease infinite;
}

.thankyou-dot-bg {
	background-image: radial-gradient(circle, rgba(214, 166, 254, .28) 1.5px, transparent 1.5px);
	background-size: 26px 26px;
}

.thankyou-glow-blob {
	position: absolute;
	top: -128px;
	left: -128px;
	width: 320px;
	height: 320px;
	border-radius: 50%;
	background: #D6A6FE;
	opacity: .08;
	filter: blur(80px);
	pointer-events: none;
}

.thankyou-glow-blob-second {
	position: absolute;
	bottom: -80px;
	right: -80px;
	width: 384px;
	height: 384px;
	border-radius: 50%;
	background: #1B4C40;
	opacity: .05;
	filter: blur(90px);
	pointer-events: none;
}

.thankyou-content {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	width: 100%;
	max-width: 628px;
}

.thankyou-badge-content {
	display: inline-block;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: #D6A6FE;
	flex-shrink: 0;
}

.thankyou-tick-wrap {
	position: absolute;
	inset: 0;
	border-radius: 50%;
	background: #D6A6FE;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 8px 32px rgba(214, 166, 254, .45);
}

.thankyou-connect-soon {
	font-size: clamp(1.05rem, 3vw, 1.3rem);
	font-weight: 700;
	color: #1B4C40;
	margin-bottom: 10px;
}

.thankyou-supporting {
	font-size: clamp(.9rem, 2.5vw, 1.05rem);
	color: rgba(27, 76, 64, .55);
	line-height: 1.75;
	margin-bottom: 44px;
}

.thankyou-stat {
	border: 1px solid rgba(27, 76, 64, .1);
	border-radius: 16px;
	padding: 18px 12px;
	background: #fff;
	text-align: center;
	transition: box-shadow .3s, transform .3s;
}

.thankyou-stat h3 {
	font-size: clamp(1.4rem, 4vw, 2rem);
	font-weight: 900;
	color: #1B4C40;
	margin-bottom: 4px;
}

.thankyou-stat p {
	font-size: .75rem;
	font-weight: 600;
	color: rgba(27, 76, 64, .5);
}

/* ── Google Translate bar suppressor ── */
.goog-te-banner-frame { display: none !important; }
body { top: 0 !important; }

/* ── Flag images ── */
.flag-img {
  width: 22px;
  height: 15px;
  border-radius: 2px;
  object-fit: cover;
  display: block;
  flex-shrink: 0;
}

/* ── Wrapper ── */
.lang-switcher {
  position: relative;
  display: inline-flex;
  align-items: center;
}

/* ── Trigger button ── */
.lang-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  background: transparent;
  border: 1.5px solid rgb(26 8 36 / 25%);
  border-radius: 999px;
  padding: 5px 12px 5px 8px;
  font-size: 13px;
  font-weight: 600;
  transition: border-color 0.2s, background 0.2s;
  white-space: nowrap;
  user-select: none;
}
.lang-btn:hover {
  border-color: rgba(255, 255, 255, 0.6);
  background: rgba(255, 255, 255, 0.08);
}
.lang-btn .lang-label,
.lang-btn .chevron {
  color : var(--color-secondary);
}
.lang-btn .chevron {
  font-size: 9px;
  opacity: 0.7;
  margin-left: 2px;
  transition: transform 0.2s;
}
.lang-switcher.open .chevron {
  transform: rotate(180deg);
}

/* ── Dropdown panel ── */
.lang-dropdown {
  display: none;
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  min-width: 175px;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.15);
  overflow: hidden;
  z-index: 9999;
  border: 1px solid #eee;
}
.lang-switcher.open .lang-dropdown {
  display: block;
}
.lang-dropdown-header {
  padding: 10px 14px 6px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #999;
}

/* ── Individual option ── */
.lang-option {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 14px;
  cursor: pointer;
  font-size: 13px;
  font-weight: 500;
  color: #333;
  transition: background 0.15s;
  border: none;
  background: none;
  width: 100%;
  text-align: left;
}
.lang-option:hover { background: #f5f5f5; }
.lang-option.active {
  background: #fdf3ff;
  color: #4c2359;
  font-weight: 700;
}
.lang-option .opt-name { flex: 1; }
.lang-option .opt-check {
  color: #4c2359;
  font-size: 12px;
  opacity: 0;
}
.lang-option.active .opt-check { opacity: 1; }

   /* Hide Google Translate toolbar */
   .goog-te-banner-frame,
   .goog-te-banner-frame.skiptranslate,
   .goog-te-ftab-float {
      display: none !important;
      visibility: hidden !important;
   }
   body {
      top: 0 !important;
      position: static !important;
   }
   .skiptranslate {
      display: none !important;
   }

   /* ─────────────────────────────────────────────
       FORM CARD
       ───────────────────────────────────────────── */
:root {
  --fv-purple:     #31153d;
  --fv-purple-h:   #250e2f;
  --fv-line:       #d4c9e0;
  --fv-focus:      #31153d;
  --fv-err-line:   #e53e3e;
  --fv-ph:         #a090b0;
  --fv-text:       #1e0a2e;
  --fv-white:      #ffffff;
  --fv-bg:         #f5f1fb;
  --fv-err-bg:     #fff5f5;
  --fv-err-brd:    #fc8181;
  --fv-err-txt:    #742a2a;
  --fv-ok-bg:      #f0fff4;
  --fv-ok-brd:     #68d391;
  --fv-ok-txt:     #22543d;
  /* site base font */
  --fv-body:  'Roboto', sans-serif;
  --fv-head:  'Red Hat Display', 'Roboto', sans-serif;
}
 
 
/* ══════════════════════════════════════════════════════════════
   1.  NUKE BREVO'S NATIVE PHONE ROW — MULTIPLE SELECTORS
   Brevo's main.js re-inserts / makes visible .sib-sms-input
   after the DOM loads. We kill it at every possible selector
   with !important and also via JS in DOMContentLoaded.
   ══════════════════════════════════════════════════════════════ */
.sib-sms-input,
.sib-sms-input *,
.sib-sms-tooltip,
div[data-attributename="SMS"],
.sib-sms-field .sib-sms-input {
  display:    none !important;
  visibility: hidden !important;
  height:     0 !important;
  overflow:   hidden !important;
  pointer-events: none !important;
}
 
/* keep the wrapper alive so Brevo doesn't error, but collapse it */
.sib-sms-input-wrapper {
  display: block;
  overflow: visible;
}
 
 
/* ══════════════════════════════════════════════════════════════
   2.  SHARED FIELD WRAPPER  (.eos-field)
   Every field in both forms is wrapped in .eos-field.
   Provides consistent vertical rhythm.
   ══════════════════════════════════════════════════════════════ */
.eos-field {
  margin-bottom: 24px;   /* gap between fields */
  position: relative;
}
 
.eos-field:last-of-type { margin-bottom: 0; }
 
 
/* ══════════════════════════════════════════════════════════════
   3.  UNDERLINE INPUT  — applied to BOTH forms
   Main form   → #sib-container .input
   Modal form  → .m-inp
   ══════════════════════════════════════════════════════════════ */
 
/* ── main form ── */
#sib-container .input {
  display:     block !important;
  width:       100% !important;
  border:      none !important;
  border-bottom: 1.5px solid var(--fv-line) !important;
  border-radius: 0 !important;
  background:  transparent !important;
  padding:     10px 0 10px !important;
  font-family: var(--fv-body) !important;
  font-size:   14px !important;
  color:       var(--fv-text) !important;
  outline:     none !important;
  box-shadow:  none !important;
  transition:  border-color .2s !important;
  -webkit-appearance: none;
  appearance: none;
}
 
#sib-container .input:focus          { border-bottom-color: var(--fv-focus) !important; }
#sib-container .input.eos-invalid    { border-bottom-color: var(--fv-err-line) !important; }
#sib-container .input::placeholder   { color: var(--fv-ph) !important; font-family: var(--fv-body) !important; }
#sib-container textarea.input        { resize: none !important; min-height: 56px !important; }
#sib-container select.input {
  cursor: pointer !important;
  padding-right: 22px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='11' viewBox='0 0 24 24' fill='none' stroke='%23a090b0' stroke-width='2.5'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 4px center !important;
}
 
/* ── modal form ── */
.m-inp {
  display:     block;
  width:       100%;
  border:      none;
  border-bottom: 1.5px solid var(--fv-line);
  border-radius: 0;
  background:  transparent;
  padding:     10px 0 10px;
  font-family: var(--fv-body);
  font-size:   14px;
  color:       var(--fv-text);
  outline:     none;
  box-shadow:  none;
  transition:  border-color .2s;
  -webkit-appearance: none;
  appearance: none;
}
 
.m-inp:focus        { border-bottom-color: var(--fv-focus); }
.m-inp.eos-invalid  { border-bottom-color: var(--fv-err-line); }
.m-inp::placeholder { color: var(--fv-ph); font-family: var(--fv-body); }
textarea.m-inp      { resize: none; min-height: 52px; }
 
 
/* ══════════════════════════════════════════════════════════════
   4.  INLINE ERROR SPAN  (.eos-err)
   ══════════════════════════════════════════════════════════════ */
.eos-err {
  display:     none;
  font-family: var(--fv-body);
  font-size:   11.5px;
  color:       var(--fv-err-txt);
  margin-top:  4px;
  line-height: 1.4;
}
 
 
/* ══════════════════════════════════════════════════════════════
   5.  PHONE ROW  (shared by both forms)
   One row: [ 🏳 +966 ▼ ] | [ Phone Number input ]
   ══════════════════════════════════════════════════════════════ */
.custom-phone-row {
  display:     flex;
  align-items: flex-end;
  gap:         0;
  width:       100%;
}
 
/* ── flag button ── */
.flag-wrap { position: relative; flex-shrink: 0; }
 
.flag-btn {
  display:     flex;
  align-items: center;
  gap:         6px;
  padding:     10px 10px 10px 0;
  border:      none;
  border-bottom: 1.5px solid var(--fv-line);
  background:  transparent;
  cursor:      pointer;
  font-family: var(--fv-body);
  font-size:   13.5px;
  font-weight: 500;
  color:       var(--fv-text);
  white-space: nowrap;
  transition:  border-color .2s;
  line-height: 1;
}
 
.flag-btn:hover,
.flag-wrap.open .flag-btn {
  border-bottom-color: var(--fv-focus);
  outline: none;
}
 
.flag-btn img       { width: 22px; height: 15px; object-fit: cover; border-radius: 2px; }
.flag-btn .dial-txt { font-size: 13.5px; font-weight: 500; }
.flag-btn .arr      { font-size: 9px; color: var(--fv-ph); margin-left: 2px; transition: transform .2s; }
.flag-wrap.open .arr { transform: rotate(180deg); }
 
/* thin visual separator */
.phone-sep {
  width:        1px;
  height:       18px;
  background:   var(--fv-line);
  align-self:   flex-end;
  margin-bottom: 10px;
  flex-shrink:  0;
}
 
/* phone number input part */
.phone-num-wrap { flex: 1; padding-left: 10px; }
.phone-num-wrap .input  { padding-left: 0 !important; } /* main form */
.phone-num-wrap .m-inp  { padding-left: 0; }             /* modal */
 
/* ── flag dropdown ── */
.fd-dropdown {
  display:    none;
  position:   absolute;
  top:        calc(100% + 4px);
  left:       0;
  width:      268px;
  max-height: 272px;
  overflow-y: auto;
  background: var(--fv-white);
  border:     1px solid #e5dcf2;
  border-radius: 12px;
  box-shadow: 0 12px 36px rgba(49,21,61,.16);
  z-index:    9999;
}
 
.flag-wrap.open .fd-dropdown { display: block; }
 
.fd-search {
  padding:  8px 10px;
  position: sticky;
  top:      0;
  background: var(--fv-white);
  border-bottom: 1px solid #ebe4f5;
}
 
.fd-search input {
  width:       100%;
  padding:     6px 10px;
  border:      1px solid #e5dcf2;
  border-radius: 7px;
  font-size:   12px;
  font-family: var(--fv-body);
  outline:     none;
  color:       var(--fv-text);
}
 
.fd-search input:focus { border-color: var(--fv-purple); }
 
.fd-option {
  display:     flex;
  align-items: center;
  gap:         9px;
  padding:     8px 14px;
  cursor:      pointer;
  font-size:   13px;
  font-family: var(--fv-body);
  color:       var(--fv-text);
  transition:  background .1s;
}
 
.fd-option:hover    { background: var(--fv-bg); }
.fd-option.selected { background: var(--fv-bg); font-weight: 500; }
.fd-option img      { width: 22px; height: 15px; object-fit: cover; border-radius: 2px; flex-shrink: 0; }
.fd-option .opt-name { flex: 1; }
.fd-option .opt-dial { color: var(--fv-ph); font-size: 12px; }
 
 
/* ══════════════════════════════════════════════════════════════
   6.  MAIN FORM CONTAINER  (#sib-container)
   ══════════════════════════════════════════════════════════════ */
.form-wrap { width: 100%; max-width: 540px; }
 
#sib-container {
  background:    var(--fv-white) !important;
  border-radius: 18px !important;
  box-shadow:    0 6px 32px rgba(49,21,61,.09) !important;
  padding:       42px 44px 38px !important;
  border:        1px solid #ebe4f5 !important;
  max-width:     100% !important;
  text-align:    left !important;
  direction:     ltr !important;
}
 
.form-heading {
  font-family: var(--fv-head);
  font-size:   30px;
  font-weight: 800;
  color:       var(--fv-purple);
  line-height: 1.2;
  margin-bottom: 0;
}
 
/* strip all Brevo internal padding — our .eos-field handles spacing */
#sib-container .sib-form-block,
#sib-container .sib-input,
#sib-container .sib-select,
#sib-container .sib-sms-field,
#sib-container .sib-captcha,
#sib-container .form__entry,
#sib-container .form__label-row,
#sib-container .entry__field,
#sib-container .entry_block {
  padding: 0 !important;
  margin:  0 !important;
}
 
/* Brevo's own error labels — hidden; we use .eos-err */
#sib-container .entry__error { display: none !important; }
 
/* feedback banners */
.sib-form-message-panel {
  display: none;
  border-radius: 8px;
  padding: 10px 14px;
  margin-bottom: 16px;
  border: 1px solid;
  font-size: 13px;
  font-family: var(--fv-body);
}
#error-message   { background: var(--fv-err-bg); border-color: var(--fv-err-brd); color: #742a2a; }
#success-message { background: var(--fv-ok-bg);  border-color: var(--fv-ok-brd);  color: var(--fv-ok-txt); }
.sib-form-message-panel__text { display: flex; align-items: flex-start; gap: 8px; }
.sib-notification__icon { width: 16px; height: 16px; flex-shrink: 0; margin-top: 1px; }
 
/* contact form custom banners */
#c-success { display:none; background: var(--fv-ok-bg);  border:1px solid var(--fv-ok-brd);  border-radius:8px; padding:10px 14px; margin-bottom:14px; font-size:13px; font-family:var(--fv-body); color:var(--fv-ok-txt); }
#c-error   { display:none; background: var(--fv-err-bg); border:1px solid var(--fv-err-brd); border-radius:8px; padding:10px 14px; margin-bottom:14px; font-size:13px; font-family:var(--fv-body); color:var(--fv-err-txt); }
 
/* submit button */
#sib-container .sib-form-block__button,
#c-submit-btn {
  display:       flex !important;
  align-items:   center !important;
  justify-content: center !important;
  width:         100% !important;
  padding:       15px 24px !important;
  font-family:   var(--fv-head) !important;
  font-size:     15px !important;
  font-weight:   700 !important;
  color:         var(--fv-white) !important;
  background:    var(--fv-purple) !important;
  border:        none !important;
  border-radius: 50px !important;
  cursor:        pointer !important;
  box-shadow:    0 4px 18px rgba(49,21,61,.26) !important;
  transition:    background .22s, transform .18s, box-shadow .22s !important;
  letter-spacing: .2px !important;
}
 
#sib-container .sib-form-block__button:hover,
#c-submit-btn:hover {
  background:  var(--fv-purple-h) !important;
  transform:   translateY(-2px) !important;
  box-shadow:  0 8px 26px rgba(49,21,61,.34) !important;
}
 
#sib-container .sib-form-block__button:active,
#c-submit-btn:active  { transform: translateY(0) !important; }
#c-submit-btn:disabled { opacity: .6; cursor: not-allowed; transform: none !important; }
.sib-hide-loader-icon  { display: none !important; }
 
 
/* ══════════════════════════════════════════════════════════════
   7.  MODAL
   ══════════════════════════════════════════════════════════════ */
#brochureModal {
  display:     none;
  position:    fixed;
  inset:       0;
  z-index:     99999;
  background:  rgba(10,4,18,.62);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  align-items:  center;
  justify-content: center;
  padding:     20px;
}
 
#brochureModal.open { display: flex; }
 
.modal-card {
  display:    flex;
  width:      100%;
  max-width:  860px;
  min-height: 540px;
  background: var(--fv-white);
  border-radius: 22px;
  overflow:   hidden;
  box-shadow: 0 28px 80px rgba(10,4,18,.36);
  position:   relative;
  animation:  mIn .34s cubic-bezier(.34,1.46,.64,1) both;
}
 
@keyframes mIn {
  from { opacity:0; transform:scale(.9) translateY(18px); }
  to   { opacity:1; transform:scale(1)  translateY(0); }
}
 
.modal-img {
  flex:     0 0 42%;
  position: relative;
  overflow: hidden;
  background: #e8e0f0;
}
 
.modal-img img {
  width:100%; height:100%;
  object-fit:cover; object-position:center top;
  display:block;
}
 
.modal-img-fallback {
  display:none; width:100%; height:100%;
  background:linear-gradient(155deg, var(--fv-purple) 0%, #6b2fa0 100%);
  flex-direction:column; align-items:center; justify-content:center;
  gap:12px; color:rgba(255,255,255,.88); padding:32px; text-align:center;
}
.modal-img-fallback .fi { font-size:64px; }
.modal-img-fallback p   { font-size:14px; line-height:1.6; }
 
.modal-close {
  position:absolute; top:16px; right:18px;
  width:34px; height:34px;
  background:#f0eaf8; border:none; border-radius:50%;
  cursor:pointer; font-size:15px; color:var(--fv-purple);
  display:flex; align-items:center; justify-content:center;
  z-index:10; box-shadow:0 2px 8px rgba(49,21,61,.12);
  transition:background .2s, transform .2s;
}
.modal-close:hover { background:#e0d5f0; transform:rotate(90deg); }
 
.modal-form {
  flex:1;
  padding:36px 38px 34px;
  overflow-y:auto;
}
 
.modal-offer-badge {
  display:inline-block;
  padding:4px 14px;
  background:#f0eaf8; color:#5a3a7a;
  border-radius:50px;
  font-size:11px; font-weight:700;
  font-family:var(--fv-body);
  letter-spacing:.9px; text-transform:uppercase;
  margin-bottom:10px;
}
 
.modal-title {
  font-family:var(--fv-head);
  font-size:24px; font-weight:800;
  color:var(--fv-text); line-height:1.2;
  margin-bottom:24px;
}
 
/* modal banners */
#b-error  { display:none; background:var(--fv-err-bg); border:1px solid var(--fv-err-brd); border-radius:7px; padding:9px 13px; font-size:12px; margin-bottom:14px; font-family:var(--fv-body); color:var(--fv-err-txt); }
#b-success{ display:none; background:var(--fv-ok-bg);  border:1px solid var(--fv-ok-brd);  border-radius:7px; padding:9px 13px; font-size:12px; margin-bottom:14px; font-family:var(--fv-body); color:var(--fv-ok-txt); }
 
/* modal submit */
.m-submit-btn {
  display:flex; align-items:center; justify-content:center;
  width:100%; padding:15px 24px; margin-top:6px;
  font-family:var(--fv-head); font-size:15px; font-weight:700; letter-spacing:.2px;
  color:var(--fv-white); background:var(--fv-purple);
  border:none; border-radius:50px; cursor:pointer;
  box-shadow:0 4px 18px rgba(49,21,61,.26);
  transition:background .22s, transform .18s, box-shadow .22s;
}
.m-submit-btn:hover    { background:var(--fv-purple-h); transform:translateY(-2px); box-shadow:0 8px 26px rgba(49,21,61,.34); }
.m-submit-btn:active   { transform:translateY(0); }
.m-submit-btn:disabled { opacity:.6; cursor:not-allowed; transform:none; }
 
 
/* ══════════════════════════════════════════════════════════════
   8.  RESPONSIVE
   ══════════════════════════════════════════════════════════════ */
@media (max-width:680px) {
  .modal-card { flex-direction:column; max-width:440px; min-height:unset; }
  .modal-img  { flex:0 0 200px; }
  .modal-form { padding:26px 22px 28px; }
  #sib-container { padding:30px 22px 26px !important; }
}
 
@media (max-width:400px) {
  .form-heading { font-size:25px; }
  .modal-title  { font-size:21px; }
}