@import url("https://fonts.googleapis.com/css2?family=Gantari:wght@400;500;700&family=League+Spartan:wght@400;700&display=swap");

@font-face {
	font-family: Gantari;
	src: url('../fonts/Gantari-Regular.ttf');
	src: url('../fonts/Gantari-Regular.ttf?') format('ttf'),
		url('../fonts/Gantari-Regular.woff') format('woff'),
		url('../fonts/Gantari-Regular.otf') format('otf'),
		url('../fonts/Gantari-Regular.svg') format('svg');
	font-weight: 400;
	font-style: normal;
}

@font-face {
	font-family: Gantari;
	src: url('../fonts/Gantari-Medium.ttf');
	src: url('../fonts/Gantari-Medium.ttf?') format('ttf'),
		url('../fonts/Gantari-Medium.woff') format('woff'),
		url('../fonts/Gantari-Medium.otf') format('otf'),
		url('../fonts/Gantari-Medium.svg') format('svg');
	font-weight: 500;
	font-style: normal;
}

@font-face {
	font-family: Gantari;
	src: url('../fonts/Gantari-Bold.ttf');
	src: url('../fonts/Gantari-Bold.ttf?') format('ttf'),
		url('../fonts/Gantari-Bold.woff') format('woff'),
		url('../fonts/Gantari-Bold.otf') format('otf'),
		url('../fonts/Gantari-Bold.svg') format('svg');
	font-weight: 700;
	font-style: normal;
}

@font-face {
	font-family: 'League Spartan';
	src: url('../fonts/LeagueSpartan-Regular.ttf');
	src: url('../fonts/LeagueSpartan-Regular.ttf?') format('ttf'),
		url('../fonts/LeagueSpartan-Regular.woff') format('woff'),
		url('../fonts/LeagueSpartan-Regular.otf') format('otf'),
		url('../fonts/LeagueSpartan-Regular.svg') format('svg');
	font-weight: 400;
	font-style: normal;
}

@font-face {
	font-family: 'League Spartan';
	src: url('../fonts/LeagueSpartan-Bold.ttf');
	src: url('../fonts/LeagueSpartan-Bold.ttf?') format('ttf'),
		url('../fonts/LeagueSpartan-Bold.woff') format('woff'),
		url('../fonts/LeagueSpartan-Bold.otf') format('otf'),
		url('../fonts/LeagueSpartan-Bold.svg') format('svg');
	font-weight: 700;
	font-style: normal;
}


body {
	font-family: Gantari;
	font-size: 16px;
	font-weight: 400;
	font-style: normal;
	color: #ffffff;
}


.wrapper {
	padding: 50px calc((100% - 1440px) / 2);
	background: url(../images/pattern.png) left top / auto repeat,
		radial-gradient(57.18% 57.18% at 50% 126.34%, #2B0081 0%, rgba(43, 0, 129, 0.05) 85%, rgba(43, 0, 129, 0) 100%),
		linear-gradient(180deg, #000000 -12.87%, rgba(43, 0, 129, 0.8) 30.48%, #0C0011 69.86%),
		#1E1E1E;
	overflow: hidden;
}


.wrapper header {
	height: 123px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	position: relative;
	top: 0;
	left: 0;
}

.wrapper header div {
	display: flex;
	column-gap: 50px;
}

.wrapper header div a {
	font-size: 18px;
	line-height: 22px;
	letter-spacing: -0.02em;
	color: #ffffff;
}

.wrapper header div a.active {
	position: relative;
	top: 0;
	left: 0;
	font-weight: 700;
}

.wrapper header div a.active::after {
	content: url(../images/marker.png);
	position: absolute;
	left: calc(50% - 11px);
	bottom: -45px;
}

.wrapper header a.logo {
	width: 150px;
	height: 123px;
	background: url(../images/logo.png) center / 100% no-repeat;
	position: absolute;
	top: 0;
	left: calc(50% - 75px);
}


.wrapper main {
	padding: 121px 0 118px calc(50% - 7px);
	position: relative;
	top: 0;
	left: 0;
}

.wrapper main .left {
	position: absolute;
	top: 81px;
	left: 0;
	width: 603px;
	height: 643px;
	z-index: 0;
}

.wrapper main .left .left-phone {
	position: absolute;
	top: 18.2%;
	left: 4.48%;
	width: 46.77%;
	height: 79.47%;
	transform: rotate(6.58deg);
	animation: leftPhoneVisible .6s ease forwards, leftPhoneFloat 1.1s ease-in-out .6s alternate infinite;
}

@keyframes leftPhoneVisible {
	from {
		transform: translateX(-1200px);
	}

	to {
		transform: rotate(6.58deg);
	}
}

@keyframes leftPhoneFloat {
	from {
		top: 18.2%;
	}

	to {
		top: 16%;
	}
}

.wrapper main .left .phone-shadow {
	position: absolute;
	top: 11.51%;
	left: 35.49%;
	width: 41.29%;
	height: 77.92%;
	transform: rotate(-23.02deg);
	animation: phoneShadowVisible .6s ease forwards, phoneShadowPulse 1.4s ease-in-out .6s alternate infinite;
}

@keyframes phoneShadowVisible {
	from {
		transform: scale(0.001);
	}

	to {
		transform: rotate(-23.02deg);
	}
}

@keyframes phoneShadowPulse {
	from {
		transform: scale(1) rotate(-23.02deg);
	}

	to {
		transform: scale(0.8) rotate(-23.02deg);
	}
}

.wrapper main .left .right-phone {
	position: absolute;
	top: 1.24%;
	left: 15.26%;
	width: 102.16%;
	height: 81.34%;
	transform: rotate(-5deg);
	animation: rightPhoneVisible .6s ease forwards, rightPhoneFloat 1.4s ease-in-out .6s alternate infinite;
}

@keyframes rightPhoneVisible {
	from {
		transform: translateY(-1200px);
	}

	to {
		transform: rotate(-5deg);
	}
}

@keyframes rightPhoneFloat {
	from {
		top: 1.24%;
	}

	to {
		top: -2%;
	}
}

.wrapper main .right {
	display: flex;
	flex-direction: column;
	row-gap: 170px;
	position: relative;
	top: 0;
	left: 0;
	z-index: 1;
}

.wrapper main .right .up {
	display: flex;
	flex-direction: column;
	row-gap: 30px;
}

.wrapper main .right .up h1 {
	font-family: 'League Spartan';
	font-weight: 700;
	font-size: 60px;
	line-height: 70px;
	letter-spacing: -0.03em;
	text-transform: uppercase;
}

.wrapper main .right .up p {
	font-size: 24px;
	line-height: 29px;
}

.wrapper main .right .down {
	display: flex;
	flex-direction: column;
	row-gap: 50px;
}

.wrapper main .right .down .buttons {
	display: flex;
	column-gap: 50px;
}

.wrapper main .right .down .buttons a {
	width: 202px;
	height: 60px;
}

.wrapper main .right .down .buttons a.google-play-button {
	background: url(../images/google-play-button.png) center / 100% no-repeat;
}

.wrapper main .right .down .buttons a.app-store-button {
	background: url(../images/app-store-button.png) center / 100% no-repeat;
}


.wrapper footer {
	display: flex;
	column-gap: 40px;
	line-height: 20px;
	letter-spacing: -0.02em;
	align-items: center;
}

.wrapper footer a.monochrome-logo {
	width: 100px;
	height: 77px;
	background: url(../images/monochrome-logo.png) center / 100% no-repeat;
}


.wrapper .test {
	display: flex;
	flex-direction: column;
	row-gap: 50px;
	align-items: flex-start;
}


.wrapper .contact {
	padding: 20px 0 81px;
	display: flex;
	flex-direction: column;
	row-gap: 50px;
}

.wrapper .contact .contact-header {
	display: flex;
	flex-direction: column;
	row-gap: 30px;
}

.wrapper .contact .contact-header h2 {
	font-family: 'League Spartan';
	font-weight: 700;
	font-size: 25px;
	line-height: 36px;
	letter-spacing: -0.03em;
	text-transform: uppercase;
}

.wrapper .contact .contact-header p {
	line-height: 19px;
}

.wrapper .contact form {
	display: flex;
	flex-direction: column;
	align-self: center;
	max-width: 500px;
	row-gap: 60px;
	width: 100%;
}

.wrapper .contact form .fields {
	display: flex;
	flex-direction: column;
	row-gap: 40px;
}

.wrapper .contact form .fields .text-field {
	display: flex;
	flex-direction: column;
	row-gap: 10px;
}

.wrapper .contact form .fields .text-field label {
	font-weight: 500;
	font-size: 18px;
	line-height: 22px;
	padding-left: 14px;
}

.wrapper .contact form .fields .text-field label span {
	color: #F6FF00;
}

.wrapper .contact form .fields .input-wrapper {
	width: 100%;
	background: transparent;
	position: relative;
	top: 0;
	left: 0;
	background: rgba(0, 0, 0, 0.3);
	backdrop-filter: blur(3px);
	border-radius: 40px;
}

.wrapper .contact form .fields .input-wrapper.textarea {
	border-radius: 20px;
}

.wrapper .contact form .fields .input-wrapper::after {
	content: '';
	position: absolute;
	inset: 0;
	background: url(../images/input-border-gradient.png) center / 100% 100% no-repeat;
	z-index: 1;
	border-radius: 40px;
	padding: 3px;
	mask-image: linear-gradient(#000 0 0), linear-gradient(#000 0 0);
	mask-clip: content-box, padding-box;
	mask-composite: exclude;
	-webkit-mask-image: linear-gradient(#000 0 0), linear-gradient(#000 0 0);
	-webkit-mask-clip: content-box, padding-box;
	-webkit-mask-composite: xor;
}

.wrapper .contact form .fields .input-wrapper.textarea::after {
	border-radius: 20px;
}

.wrapper .contact form .fields .input-wrapper input,
.wrapper .contact form .fields .input-wrapper textarea {
	width: 100%;
	background: transparent;
	height: 50px;
	font-size: 16px;
	line-height: 19px;
	color: #FFFFFF;
	padding: 0 15px;
	position: relative;
	top: 0;
	left: 0;
	z-index: 2;
}

.wrapper .contact form .fields .input-wrapper textarea {
	resize: none;
	padding: 20px;
	overflow: hidden;
	min-height: 99px;
}

.wrapper .contact form .fields .input-wrapper input::placeholder,
.wrapper .contact form .fields .input-wrapper textarea::placeholder {
	font-size: 16px;
	line-height: 19px;
	color: #FFFFFF;
}

.wrapper .contact form .fields .captcha-field {
	display: flex;
	column-gap: 30px;
	padding-top: 10px;
	align-items: center;
}

.wrapper .contact form .fields .captcha-field .input-wrapper {
	width: 151px;
}


.wrapper .contact form button {
	width: 206px;
	height: 66px;
	font-family: 'League Spartan';
	font-size: 16px;
	line-height: 66px;
	text-align: center;
	letter-spacing: -0.04em;
	text-transform: uppercase;
	color: #FFFFFF;
	background: rgba(145, 0, 255, 0.1);
	backdrop-filter: blur(3px);
	border-radius: 40px;
	position: relative;
	top: 0;
	left: 0;
}

.wrapper .contact form button::after {
	content: '';
	position: absolute;
	inset: 0;
	background: url(../images/submit-border-details.png) center / 100% 100% no-repeat,
		url(../images/submit-border.png) center / 100% 100% no-repeat;
}


.wrapper .info {
	padding: 20px 0 130px;
	display: flex;
	flex-direction: column;
	row-gap: 30px;
}

.wrapper .info h2 {
	font-family: 'League Spartan';
	font-weight: 700;
	font-size: 25px;
	line-height: 36px;
	letter-spacing: -0.03em;
	text-transform: uppercase;
}

.wrapper .info .content {
	display: flex;
	flex-direction: column;
	row-gap: 30px;
}

.wrapper .info .content .block {
	display: flex;
	flex-direction: column;
	row-gap: 20px;
}

.wrapper .info .content .block h3 {
	font-weight: 700;
	font-size: 18px;
	line-height: 20px;
	letter-spacing: -0.02em;
}

.wrapper .info .content .block h4 {
	font-weight: 700;
	line-height: 20px;
	letter-spacing: -0.02em;
}

.wrapper .info .content .block p {
	line-height: 20px;
	letter-spacing: -0.02em;
}

.wrapper .info .content .block .list {
	display: flex;
	flex-direction: column;
}

.wrapper .info .content .block .list .row {
	line-height: 19px;
	letter-spacing: -0.02em;
	padding: 7px 15px;
	display: flex;
	column-gap: 10px;
}

.wrapper .info .content .block .list .row::before {
	content: url(../images/list-marker.png);
}


@media (max-width: 1500px) {

	.wrapper {
		padding: 50px 30px;
	}

	.wrapper main {
		padding: 120px 0 203px calc(50% - 7px);
	}

}

@media (max-width: 1350px) {

	.wrapper main {
		padding: 120px 0 153px calc(50% - 17px);
	}

	.wrapper main .left {
		width: 483px;
		height: 514px;
	}

	.wrapper main .right {
		row-gap: 120px;
	}

	.wrapper main .right .up h1 {
		font-size: 52px;
		line-height: 70px;
		letter-spacing: -0.03em;
	}

	.wrapper main .right .up p {
		font-size: 24px;
		line-height: 29px;
	}

	.wrapper main .right .up p br {
		display: none;
	}

	.wrapper main .right .down p {
		font-size: 24px;
		line-height: 29px;
	}

}

@media (max-width: 1200px) {

	.wrapper .contact {
		padding: 20px 0 61px;
	}

	.wrapper .info {
		padding: 20px 0 110px;
	}

}

@media (max-width: 1160px) {

	.wrapper main {
		padding: 120px 0 114px calc(50% - 50px);
	}

	.wrapper main .right {
		row-gap: 200px;
	}

	.wrapper main .right .up h1 {
		font-size: 42px;
		line-height: 50px;
		letter-spacing: -0.03em;
	}

	.wrapper main .right .up p {
		font-size: 22px;
		line-height: 26px;
	}

	.wrapper main .right .down p {
		font-size: 22px;
		line-height: 26px;
	}

}

@media (max-width: 1024px) {

	.wrapper .info {
		padding: 20px 0 100px;
	}

}

@media (max-width: 960px) {

	.wrapper main {
		padding: 614px 0 105px;
	}

	.wrapper main .left {
		top: 30px;
		left: calc(50% - 257px);
	}

	.wrapper main .right {
		row-gap: 120px;
		align-items: center;
	}

	.wrapper main .right .up {
		row-gap: 50px;
		align-items: center;
	}

	.wrapper main .right .up h1 {
		font-size: 60px;
		line-height: 60px;
		letter-spacing: -0.03em;
		text-align: center;
	}

	.wrapper main .right .up p {
		text-align: center;
	}

	.wrapper main .right .down p {
		text-align: center;
	}

}


@media (max-width: 768px) {

	.wrapper {
		padding: 50px 20px;
	}

	.wrapper header {
		padding-top: 123px;
		max-width: 447px;
		height: 246px;
		margin: 0 auto;
	}

	.wrapper header .left {
		width: 100%;
		justify-content: space-between;
	}

	.wrapper header .right {
		position: absolute;
		left: 50%;
		transform: translateX(-50%);
	}

	.wrapper .info h2 {
		text-align: center;
	}

	.wrapper .contact .contact-header h2 {
		text-align: center;
	}

	.wrapper .contact .contact-header p {
		text-align: center;
	}

}

@media (max-width: 700px) {

	.wrapper main {
		padding: 500px 0 40px;
	}

	.wrapper main .right {
		row-gap: 40px;
	}

	.wrapper main .right .up {
		row-gap: 18px;
	}

	.wrapper main .right .down {
		row-gap: 28px;
		margin-top: 8px;
	}

	.wrapper main .right .down .buttons {
		margin-top: 8px;
		column-gap: 20px;
	}

	.wrapper main .right .down .buttons a {
		width: 140px;
		height: 42px;
	}
}

@media (max-width: 480px) {

	.wrapper main .right .up h1 br {
		display: block;
	}

	.wrapper .contact {
		padding: 20px 0 120px;
	}

	.wrapper .contact form .fields .captcha-field {
		justify-content: center;
	}

	.wrapper .contact form button {
		align-self: center;
	}

	.wrapper footer {
		width: 100%;
		column-gap: 0;
		justify-content: space-between;
	}

}

@media (max-width: 440px) {

	.wrapper main {
		padding: 500px 0 40px;
	}

	.wrapper main .right .up h1 {
		font-size: 44px;
		line-height: 44px;
	}

	.wrapper footer {
		flex-direction: column;
		row-gap: 20px;
		align-items: center;
		text-align: center;
	}

}

@media (max-width: 380px) {

	.wrapper {
		padding: 50px 10px;
	}

	.wrapper header .right {
		transform: translateX(calc(-50% - 8.2px));
	}

	.wrapper .contact form .fields .captcha-field {
		row-gap: 30px;
		flex-wrap: wrap;
	}

	.wrapper .contact form .fields .captcha-field .input-wrapper {
		width: 100%;
	}

	.wrapper .info {
		padding: 20px 10px 100px;
	}

}

/* Mobile navigation and viewport-first landing page */
.menu-toggle,
.mobile-sidebar,
.sidebar-overlay {
	display: none;
}

@media (max-width: 768px) {
	body.menu-open {
		overflow: hidden;
	}

	.wrapper {
		min-height: 100dvh;
		padding: 18px 18px 24px;
	}

	.wrapper header {
		height: 74px;
		padding: 0;
		margin: 0;
		max-width: none;
		justify-content: center;
	}

	.wrapper header>.left,
	.wrapper header>.right {
		display: none;
	}

	.wrapper header a.logo {
		width: 82px;
		height: 68px;
		left: 50%;
		transform: translateX(-50%);
		background-size: contain;
	}

	.menu-toggle {
		display: flex;
		position: fixed;
		top: calc(18px + env(safe-area-inset-top));
		left: 18px;
		z-index: 50;
		width: 42px;
		height: 42px;
		border: 1px solid rgba(255, 255, 255, .28);
		border-radius: 12px;
		background: rgba(14, 0, 28, .72);
		backdrop-filter: blur(10px);
		flex-direction: column;
		justify-content: center;
		align-items: center;
		gap: 5px;
	}

	.menu-toggle span {
		display: block;
		width: 19px;
		height: 2px;
		border-radius: 2px;
		background: #fff;
	}

	.sidebar-overlay {
		display: block;
		position: fixed;
		inset: 0;
		z-index: 70;
		background: rgba(0, 0, 0, .62);
		opacity: 0;
		visibility: hidden;
		transition: opacity .25s ease, visibility .25s ease;
	}

	.mobile-sidebar {
		display: flex;
		position: fixed;
		inset: 0 auto 0 0;
		z-index: 80;
		width: min(82vw, 320px);
		padding: calc(28px + env(safe-area-inset-top)) 24px 28px;
		background: linear-gradient(180deg, #210045, #09000f 78%);
		box-shadow: 18px 0 50px rgba(0, 0, 0, .45);
		transform: translateX(-105%);
		transition: transform .28s ease;
		flex-direction: column;
		align-items: flex-start;
	}

	.menu-open .sidebar-overlay {
		opacity: 1;
		visibility: visible;
	}

	.menu-open .mobile-sidebar {
		transform: translateX(0);
	}

	.sidebar-close {
		position: absolute;
		top: calc(15px + env(safe-area-inset-top));
		right: 16px;
		font-size: 34px;
		line-height: 1;
		color: #fff;
		background: transparent;
	}

	.sidebar-logo {
		display: block;
		width: 112px;
		height: 90px;
		margin: 4px 0 30px;
		background: url(../images/logo.png) center / contain no-repeat;
	}

	.mobile-sidebar nav {
		display: flex;
		width: 100%;
		flex-direction: column;
		gap: 8px;
	}

	.mobile-sidebar nav a {
		padding: 15px 4px;
		border-bottom: 1px solid rgba(255, 255, 255, .13);
		font-size: 18px;
		color: #fff;
	}

	.wrapper .info,
	.wrapper .contact {
		padding-top: 20px;
	}
}

@media (max-width: 768px) {
	.home-page {
		height: 100dvh;
		overflow: hidden;
	}

	.home-page .wrapper {
		height: 100dvh;
		min-height: 560px;
		display: grid;
		grid-template-rows: 74px minmax(0, 1fr) auto;
		padding-top: max(12px, env(safe-area-inset-top));
		padding-bottom: max(10px, env(safe-area-inset-bottom));
	}

	.home-page .wrapper main {
		min-height: 0;
		padding: 0;
		display: grid;
		grid-template-rows: minmax(180px, 42%) minmax(0, 1fr);
		gap: clamp(8px, 1.8vh, 18px);
	}

	.home-page .wrapper main>.left {
		position: relative;
		top: auto;
		left: auto;
		width: min(78vw, 310px);
		height: 100%;
		min-height: 180px;
		margin: 0 auto;
		transform: translateX(-1%);
	}

	.home-page .wrapper main .left .left-phone {
		top: 14%;
		left: 3%;
		width: 43%;
		height: auto;
	}

	.home-page .wrapper main .left .phone-shadow {
		top: 9%;
		left: 33%;
		width: 39%;
		height: auto;
	}

	.home-page .wrapper main .left .right-phone {
		top: 0;
		left: 14%;
		width: 92%;
		height: auto;
	}

	.home-page .wrapper main>.right {
		row-gap: clamp(10px, 2vh, 18px);
		align-items: center;
		justify-content: space-between;
		min-height: 0;
	}

	.home-page .wrapper main .right .up {
		row-gap: clamp(6px, 1.2vh, 11px);
		align-items: center;
	}

	.home-page .wrapper main .right .up h1 {
		font-size: clamp(27px, 8.2vw, 42px);
		line-height: .94;
		text-align: center;
	}

	.home-page .wrapper main .right .up h1 br {
		display: block;
	}

	.home-page .wrapper main .right .up p {
		max-width: 355px;
		font-size: clamp(12px, 3.45vw, 15px);
		line-height: 1.28;
		text-align: center;
	}

	.home-page .wrapper main .right .up p br {
		display: none;
	}

	.home-page .wrapper main .right .down {
		width: 100%;
		row-gap: clamp(7px, 1.3vh, 12px);
		align-items: center;
	}

	.home-page .wrapper main .right .down p {
		font-size: clamp(13px, 3.7vw, 16px);
		line-height: 1.2;
		text-align: center;
	}

	.home-page .wrapper main .right .down .buttons {
		width: 100%;
		justify-content: center;
		column-gap: 10px;
	}

	.home-page .wrapper main .right .down .buttons a {
		width: min(43vw, 166px);
		height: auto;
		aspect-ratio: 202 / 60;
		background-size: contain;
	}

	.home-page .wrapper footer {
		min-height: 30px;
		padding-top: 7px;
		justify-content: center;
		font-size: 10px;
		line-height: 1.2;
		text-align: center;
		opacity: .72;
	}

	.home-page .wrapper footer .monochrome-logo {
		display: none;
	}
}

@media (max-width: 768px) and (max-height: 700px) {
	.home-page .wrapper {
		grid-template-rows: 58px minmax(0, 1fr) 22px;
	}

	.home-page .wrapper header {
		height: 58px;
	}

	.home-page .wrapper header a.logo {
		width: 65px;
		height: 54px;
	}

	.home-page .wrapper main {
		grid-template-rows: minmax(145px, 38%) minmax(0, 1fr);
	}

	.home-page .wrapper main>.left {
		width: min(66vw, 255px);
		min-height: 145px;
	}

	.home-page .wrapper main .right .up h1 {
		font-size: clamp(24px, 7.3vw, 34px);
	}

	.home-page .wrapper main .right .up p {
		font-size: clamp(11px, 3vw, 13px);
	}

	.home-page .wrapper footer {
		font-size: 9px;
		padding-top: 3px;
	}
}

@media (max-width: 360px) {
	.home-page .wrapper {
		padding-left: 10px;
		padding-right: 10px;
	}

	.home-page .wrapper main .right .down .buttons a {
		width: 44vw;
	}
}

@media (prefers-reduced-motion: reduce) {

	.home-page .left-phone,
	.home-page .phone-shadow,
	.home-page .right-phone {
		animation: none !important;
	}
}


/* Final mobile hero spacing and typography refinements */
@media (max-width: 768px) {
	.home-page .wrapper main>.right {
		justify-content: flex-start;
		row-gap: clamp(12px, 2vh, 20px);
	}

	.home-page .wrapper main .right .up {
		row-gap: clamp(8px, 1.4vh, 13px);
	}

	.home-page .wrapper main .right .up h1 {
		font-family: "League Spartan", sans-serif;
		font-weight: 700;
		font-size: clamp(30px, 9vw, 44px);
		line-height: .95;
		letter-spacing: -0.03em;
	}

	.home-page .wrapper main .right .up p {
		font-family: Gantari, sans-serif;
		max-width: 370px;
		font-size: clamp(13px, 3.7vw, 16px);
		line-height: 1.3;
	}

	.home-page .wrapper main .right .down {
		row-gap: 0;
		margin-top: 0;
	}
}

.form-success-toast {
	position: fixed;
	left: 50%;
	bottom: max(24px, env(safe-area-inset-bottom));
	z-index: 120;
	width: min(calc(100% - 32px), 430px);
	padding: 16px 20px;
	border: 1px solid rgba(255, 255, 255, .24);
	border-radius: 14px;
	background: rgba(28, 0, 58, .96);
	box-shadow: 0 14px 40px rgba(0, 0, 0, .45);
	font-family: Gantari, sans-serif;
	font-size: 15px;
	line-height: 1.35;
	text-align: center;
	color: #fff;
	opacity: 0;
	visibility: hidden;
	transform: translate(-50%, 16px);
	transition: opacity .22s ease, transform .22s ease, visibility .22s ease;
}

.form-success-toast.is-visible {
	opacity: 1;
	visibility: visible;
	transform: translate(-50%, 0);
}

/* Keep the desktop footer clear of the absolutely positioned device artwork. */
@media (min-width: 961px) {
	.home-page .wrapper main {
		min-height: 760px;
	}

	.home-page .wrapper footer {
		position: relative;
		z-index: 3;
	}
}

@media (min-width: 961px) and (max-height: 850px) {
	.home-page .wrapper main {
		min-height: 720px;
	}
}