body.mk-maintenance-active { background: #032f2c; }

.mk-maintenance-page {
	align-items: center;
	background: #032a2b;
	display: flex;
	isolation: isolate;
	justify-content: center;
	min-height: 100vh;
	overflow: hidden;
	padding: clamp(1.25rem, 4vw, 4rem);
	position: relative;
}

.mk-maintenance-page__landscape {
	inset: 0;
	overflow: hidden;
	pointer-events: none;
	position: absolute;
	z-index: -3;
}

.mk-maintenance-page__landscape img {
	bottom: -2.5rem;
	height: auto;
	left: 50%;
	max-width: none;
	min-width: 1320px;
	position: absolute;
	transform: translateX(-50%);
	width: 108%;
	-webkit-mask-image: linear-gradient(to bottom, transparent 0%, rgba(0,0,0,.22) 18%, #000 48%);
	mask-image: linear-gradient(to bottom, transparent 0%, rgba(0,0,0,.22) 18%, #000 48%);
}

.mk-maintenance-page__landscape span {
	background:
		radial-gradient(ellipse at 50% 62%, rgba(177,194,169,.08), transparent 52%),
		linear-gradient(180deg, rgba(3,42,43,.97) 0%, rgba(3,42,43,.64) 38%, rgba(2,29,29,.18) 78%, rgba(2,24,24,.28) 100%);
	inset: 0;
	position: absolute;
}

.mk-maintenance-page__pattern {
	background-image:
		linear-gradient(rgba(255,255,255,.022) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255,255,255,.022) 1px, transparent 1px);
	background-size: 48px 48px;
	inset: 0;
	-webkit-mask-image: linear-gradient(to bottom, #000, transparent 76%);
	mask-image: linear-gradient(to bottom, #000, transparent 76%);
	position: absolute;
	z-index: -2;
}

.mk-maintenance-page__card {
	-webkit-backdrop-filter: blur(14px);
	backdrop-filter: blur(14px);
	background: rgba(255,255,255,.965);
	border: 1px solid rgba(235,224,200,.88);
	border-radius: 22px;
	box-sizing: border-box;
	box-shadow: 0 34px 90px rgba(0,18,17,.46), 0 2px 8px rgba(0,18,17,.18);
	max-width: 680px;
	overflow: hidden;
	padding: clamp(2rem, 5vw, 4.25rem);
	position: relative;
	text-align: center;
	width: 100%;
}

.mk-maintenance-page__card::before {
	background: linear-gradient(90deg, #b77a1d, #e7c77f, #b77a1d);
	border-radius: 0 0 999px 999px;
	content: "";
	height: 4px;
	left: clamp(1.5rem, 8%, 3.5rem);
	position: absolute;
	right: clamp(1.5rem, 8%, 3.5rem);
	top: 0;
}

.mk-maintenance-page__logo {
	display: block;
	height: auto;
	margin: 0 auto 2rem;
	max-width: 188px;
	width: 44%;
}

.mk-maintenance-page__illustration { display: inline-grid; margin-bottom: 1.7rem; place-items: center; position: relative; }
.mk-maintenance-page__orbit { border: 1px solid rgba(8,105,94,.18); border-radius: 50%; height: 112px; position: absolute; width: 112px; }
.mk-maintenance-page__orbit::before { border: 1px dashed rgba(185,128,34,.38); border-radius: 50%; content: ""; inset: 9px; position: absolute; }
.mk-maintenance-page__orbit span { background: #c38d30; border: 3px solid #fff; border-radius: 50%; height: 12px; position: absolute; width: 12px; }
.mk-maintenance-page__orbit span:nth-child(1) { left: 4px; top: 23px; }
.mk-maintenance-page__orbit span:nth-child(2) { bottom: 3px; right: 25px; }
.mk-maintenance-page__orbit span:nth-child(3) { right: -3px; top: 42px; }

.mk-maintenance-page__icon {
	align-items: center;
	background: linear-gradient(145deg, #075e56, #023c38);
	border-radius: 18px;
	box-shadow: 0 14px 30px rgba(4,73,67,.26);
	color: #e5bd6d;
	display: flex;
	font-size: 1.8rem;
	height: 72px;
	justify-content: center;
	position: relative;
	width: 72px;
	z-index: 1;
}

.mk-maintenance-page__eyebrow {
	color: #a96f16;
	font-size: .72rem;
	font-weight: 800;
	letter-spacing: .17em;
	margin-bottom: .7rem;
	text-transform: uppercase;
}

.mk-maintenance-page h1 { color: #082f2c; font-size: clamp(1.8rem, 5vw, 3rem); font-weight: 800; letter-spacing: -.035em; line-height: 1.08; margin: 0 auto 1rem; max-width: 560px; overflow-wrap: break-word; text-wrap: balance; }
.mk-maintenance-page p { color: #5b6967; font-size: clamp(1rem, 2vw, 1.16rem); line-height: 1.65; margin: 0 auto; max-width: 520px; overflow-wrap: break-word; text-wrap: pretty; }
.mk-maintenance-page__note { align-items: center; color: #087064; display: flex; font-size: .9rem; font-weight: 800; gap: .75rem; justify-content: center; margin-top: 1.6rem; }
.mk-maintenance-page__note span { background: #d2a14a; height: 1px; width: 26px; }

.mk-maintenance-section { background: #f6f3ec; padding: clamp(3rem, 7vw, 6rem) 1rem; }
.mk-maintenance-section__inner {
	align-items: center;
	background: #fff;
	border: 1px solid #e3ddd0;
	border-radius: 18px;
	box-shadow: 0 18px 44px rgba(7,49,45,.08);
	display: flex;
	gap: clamp(1.2rem, 3vw, 2.25rem);
	margin: 0 auto;
	max-width: 820px;
	padding: clamp(1.5rem, 4vw, 2.75rem);
}
.mk-maintenance-section__icon {
	align-items: center;
	background: #063f3a;
	border-radius: 14px;
	box-shadow: 0 12px 24px rgba(6,63,58,.2);
	color: #e0b65f;
	display: flex;
	flex: 0 0 clamp(64px, 9vw, 84px);
	font-size: clamp(1.35rem, 3vw, 1.8rem);
	height: clamp(64px, 9vw, 84px);
	justify-content: center;
}
.mk-maintenance-section__label { color: #a36d1b; font-size: .68rem; font-weight: 800; letter-spacing: .14em; margin-bottom: .35rem; text-transform: uppercase; }
.mk-maintenance-section h2 { color: #082f2c; font-size: clamp(1.35rem, 3vw, 2rem); font-weight: 800; letter-spacing: -.025em; line-height: 1.15; margin: 0 0 .55rem; }
.mk-maintenance-section p { color: #63706e; line-height: 1.55; margin: 0 0 .45rem; }
.mk-maintenance-section strong { color: #087064; font-size: .86rem; }

@media (max-width: 575.98px) {
	.mk-maintenance-page { padding: .9rem; }
	.mk-maintenance-page__card { border-radius: 17px; padding: 2rem 1.2rem 2.35rem; }
	.mk-maintenance-page__card::before { left: 1.25rem; right: 1.25rem; }
	.mk-maintenance-page__logo { margin-bottom: 1.55rem; max-width: 168px; width: 52%; }
	.mk-maintenance-page__landscape img {
		bottom: 0;
		height: 76%;
		min-width: 0;
		object-fit: cover;
		object-position: center bottom;
		width: auto;
	}
	.mk-maintenance-page__landscape span {
		background: linear-gradient(180deg, rgba(3,42,43,.98) 0%, rgba(3,42,43,.7) 38%, rgba(2,28,28,.25) 100%);
	}
	.mk-maintenance-section__inner { align-items: flex-start; flex-direction: column; }
}

@media (prefers-reduced-motion: no-preference) {
	.mk-maintenance-page__icon { animation: mkMaintenanceFloat 3.2s ease-in-out infinite; }
	.mk-maintenance-page__orbit { animation: mkMaintenanceTurn 18s linear infinite; }
}

@keyframes mkMaintenanceFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }
@keyframes mkMaintenanceTurn { to { transform: rotate(360deg); } }
