/* Homepage section rail — professional scale, below header */

.mv-siderail {
	--mv-rail-w: 3.35rem;
	position: fixed;
	left: max(0.5rem, env(safe-area-inset-left, 0px));
	top: calc(var(--mv-sticky-header-h, 7.9rem) + 0.65rem);
	bottom: max(1.15rem, env(safe-area-inset-bottom, 0px));
	z-index: 35;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	gap: 0.5rem;
	padding: 0.5rem 0.42rem 0.8rem;
	width: var(--mv-rail-w);
	min-height: 0;
	border-radius: 1.75rem;
	background: rgba(7, 8, 10, 0.94);
	border: 1px solid rgba(197, 155, 96, 0.32);
	box-shadow:
		inset 0 0 0 1px rgba(255, 255, 255, 0.06),
		0 14px 32px rgba(0, 0, 0, 0.45);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transform: translateX(-8px);
	transition:
		opacity 0.35s ease,
		visibility 0.35s ease,
		transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}

.mv-siderail.is-active {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: none;
}

.mv-siderail.is-hidden {
	opacity: 0 !important;
	visibility: hidden !important;
	pointer-events: none !important;
	transform: translateX(-8px) !important;
}

.mv-siderail__mark {
	display: grid;
	place-items: center;
	flex: 0 0 auto;
	width: 2.7rem;
	height: 2.7rem;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.04);
	border: 1px solid rgba(197, 155, 96, 0.28);
	text-decoration: none !important;
	box-shadow: 0 6px 14px rgba(0, 0, 0, 0.35);
	overflow: hidden;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.mv-siderail__mark img {
	width: 86%;
	height: 86%;
	object-fit: contain;
	display: block;
}

.mv-siderail__mark:hover {
	transform: translateY(-2px) scale(1.04);
	box-shadow: 0 10px 20px rgba(0, 0, 0, 0.4);
}

.mv-siderail__stage {
	position: relative;
	flex: 1 1 auto;
	width: 100%;
	min-height: 5.5rem;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0.25rem 0;
}

.mv-siderail__track {
	position: absolute;
	left: 50%;
	top: 0.2rem;
	bottom: 0.2rem;
	width: 2px;
	transform: translateX(-50%);
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.1);
	overflow: hidden;
	z-index: 0;
}

.mv-siderail__fill {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	height: 0%;
	border-radius: inherit;
	background: linear-gradient(180deg, #e2c78e 0%, #c59b60 48%, #7a5e32 100%);
	box-shadow: 0 0 8px rgba(197, 155, 96, 0.35);
	transition: height 0.12s linear;
}

.mv-siderail__live {
	position: relative;
	z-index: 2;
	margin: 0;
	max-height: 82%;
	overflow: hidden;
	writing-mode: vertical-rl;
	transform: rotate(180deg);
	font-family: var(--mv-font-body);
	font-size: 0.52rem;
	font-weight: 600;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	line-height: 1;
	white-space: nowrap;
	color: #e1be89;
	opacity: 0;
	pointer-events: none;
	padding: 0.65rem 0.2rem;
	border-radius: 999px;
	background: linear-gradient(
		180deg,
		rgba(7, 8, 10, 0.05) 0%,
		rgba(7, 8, 10, 0.97) 16%,
		rgba(7, 8, 10, 0.99) 84%,
		rgba(7, 8, 10, 0.05) 100%
	);
	transition: opacity 0.28s ease, color 0.28s ease;
}

.mv-siderail__live.is-swap {
	opacity: 1;
}

.mv-siderail__cta {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.35rem;
	flex: 0 0 auto;
	width: 100%;
	padding: 0.2rem 0.05rem 0.15rem;
	border-radius: 12px;
	color: #f4f1eb !important;
	text-decoration: none !important;
	transition: background 0.25s ease, transform 0.25s ease;
}

.mv-siderail__cta:hover {
	background: rgba(197, 155, 96, 0.12);
	transform: translateY(-1px);
}

.mv-siderail__cta-icon {
	display: grid;
	place-items: center;
	width: 1.75rem;
	height: 1.75rem;
	border-radius: 9px;
	background: linear-gradient(155deg, #e2c78e, #c59b60);
	color: #0a0b0e;
	box-shadow: 0 5px 12px rgba(0, 0, 0, 0.35);
}

.mv-siderail__cta-icon svg {
	width: 0.85rem;
	height: 0.85rem;
}

.mv-siderail__cta-label {
	writing-mode: vertical-rl;
	transform: rotate(180deg);
	font-family: var(--mv-font-body);
	font-size: 0.52rem;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: rgba(244, 241, 235, 0.78);
	line-height: 1.05;
	white-space: nowrap;
	padding: 0.12rem 0;
}

@media (min-width: 1100px) {
	body.mv-body--home {
		--mv-rail-clearance: 7.25rem;
	}

	body.mv-body--home .mv-main .mv-container,
	body.mv-body--home .mv-footer .mv-container {
		margin-left: max(
			var(--mv-rail-clearance),
			calc((100% - min(100% - clamp(2.75rem, 10vw, 9.5rem), var(--mv-container))) / 2)
		);
		margin-right: auto;
	}
}

@media (min-width: 1100px) and (max-width: 1399px) {
	.mv-siderail {
		--mv-rail-w: 3.15rem;
		left: max(0.4rem, env(safe-area-inset-left, 0px));
	}
}

@media (min-width: 1400px) {
	.mv-siderail {
		--mv-rail-w: 3.5rem;
		left: max(0.55rem, env(safe-area-inset-left, 0px));
	}
}

@media (max-width: 1099px) {
	.mv-siderail {
		display: none !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	.mv-siderail,
	.mv-siderail__fill,
	.mv-siderail__live,
	.mv-siderail__mark,
	.mv-siderail__cta {
		transition: none !important;
	}
}