/* =========================================================
   SITE HEADER
========================================================= */

.mcg-header {
	position: fixed;
	inset-block-start: 0;
	inset-inline: 0;
	z-index: var(--mcg-z-header);
	background: transparent;
	transition: background var(--mcg-dur-base) var(--mcg-ease), backdrop-filter var(--mcg-dur-base) var(--mcg-ease), border-color var(--mcg-dur-base) var(--mcg-ease);
	border-bottom: 1px solid transparent;
}

.mcg-header[data-scrolled="true"] {
	background: rgba(10, 10, 10, 0.6);
	backdrop-filter: blur(16px) saturate(140%);
	-webkit-backdrop-filter: blur(16px) saturate(140%);
	border-bottom-color: var(--mcg-border);
}

.mcg-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 1.1rem var(--mcg-gutter);
}

.mcg-header__actions { display: flex; align-items: center; gap: 1rem; }

.mcg-grid-toggle {
	width: 42px;
	height: 42px;
	border: 1px solid var(--mcg-border-strong);
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: border-color var(--mcg-dur-fast) var(--mcg-ease);
}
.mcg-grid-toggle:hover { border-color: var(--mcg-orange); color: var(--mcg-orange); }

/* Hamburger — mobile only (see responsive.css for display swap) */
.mcg-hamburger {
	width: 24px;
	height: 18px;
	position: relative;
	display: none;
}
.mcg-hamburger span {
	position: absolute;
	inset-inline: 0;
	height: 2px;
	background: var(--mcg-text);
	transition: transform var(--mcg-dur-base) var(--mcg-ease), opacity var(--mcg-dur-fast) var(--mcg-ease);
}
.mcg-hamburger span:nth-child(1) { top: 0; }
.mcg-hamburger span:nth-child(2) { top: 8px; }
.mcg-hamburger span:nth-child(3) { top: 16px; }
.mcg-hamburger[aria-expanded="true"] span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
.mcg-hamburger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.mcg-hamburger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }

/* ---------- Desktop vertical icon rail ---------- */
.mcg-rail {
	position: fixed;
	inset-block: 0;
	inset-inline-start: 0;
	width: var(--mcg-rail-width);
	z-index: var(--mcg-z-rail);
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
	padding-block: 6.5rem 2rem;
	border-right: 1px solid var(--mcg-border);
}

.mcg-rail__list {
	display: flex;
	flex-direction: column;
	gap: 1.75rem;
	align-items: center;
}

.mcg-rail__item a {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.35rem;
	font-size: 1.05rem;
	color: var(--mcg-text-dim);
	transition: color var(--mcg-dur-fast) var(--mcg-ease);
}
.mcg-rail__item.is-active a,
.mcg-rail__item a:hover { color: var(--mcg-orange); }

.mcg-rail__label {
	font-size: 0.55rem;
	letter-spacing: var(--mcg-ls-eyebrow);
	text-transform: uppercase;
	writing-mode: horizontal-tb;
	opacity: 0;
	position: absolute;
	inset-inline-start: 100%;
	margin-inline-start: 0.75rem;
	white-space: nowrap;
	background: var(--mcg-bg-card);
	padding: 0.3rem 0.6rem;
	border-radius: var(--mcg-radius-sm);
	pointer-events: none;
	transition: opacity var(--mcg-dur-fast) var(--mcg-ease), transform var(--mcg-dur-fast) var(--mcg-ease);
	transform: translateX(-4px);
}
.mcg-rail__item a:hover .mcg-rail__label { opacity: 1; transform: translateX(0); }

.mcg-rail__social { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; }
.mcg-rail__social .mcg-social-list { flex-direction: column; }
.mcg-rail__social-label {
	writing-mode: vertical-rl;
	font-size: 0.6rem;
	letter-spacing: var(--mcg-ls-eyebrow);
	color: var(--mcg-text-dim);
	text-transform: uppercase;
	margin-bottom: 0.5rem;
}

/* ---------- Mobile fullscreen menu ---------- */
.mcg-mobile-menu {
	position: fixed;
	inset: 0;
	z-index: var(--mcg-z-mobile-menu);
	visibility: hidden;
	pointer-events: none;
}
.mcg-mobile-menu.is-open { visibility: visible; pointer-events: auto; }

.mcg-mobile-menu__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(6, 6, 6, 0.7);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	opacity: 0;
	transition: opacity var(--mcg-dur-base) var(--mcg-ease);
}
.mcg-mobile-menu.is-open .mcg-mobile-menu__backdrop { opacity: 1; }

.mcg-mobile-menu__panel {
	position: absolute;
	inset-block: 0;
	inset-inline-start: 0;
	width: min(88vw, 420px);
	background: var(--mcg-bg-alt);
	padding: 1.5rem 1.75rem 2rem;
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
	transform: translateX(-100%);
	transition: transform var(--mcg-dur-slow) var(--mcg-ease);
	overflow-y: auto;
}
.mcg-mobile-menu.is-open .mcg-mobile-menu__panel { transform: translateX(0); }

.mcg-mobile-menu__top { display: flex; align-items: center; justify-content: space-between; }
.mcg-mobile-menu__close { font-size: 1.25rem; }

.mcg-mobile-menu__list li a {
	display: flex;
	align-items: center;
	gap: 0.9rem;
	padding: 0.9rem 0;
	font-family: var(--mcg-font-display);
	font-size: 1.1rem;
	letter-spacing: var(--mcg-ls-wide);
	color: var(--mcg-text-muted);
	border-bottom: 1px solid var(--mcg-border);
}
.mcg-mobile-menu__list li a i:last-child { margin-inline-start: auto; font-size: 0.85rem; }
.mcg-mobile-menu__list li.is-active a,
.mcg-mobile-menu__list li a:hover { color: var(--mcg-orange); }

.mcg-mobile-menu__cta {
	background: linear-gradient(160deg, rgba(255, 90, 31, 0.18), rgba(255, 90, 31, 0.03));
	border: 1px solid var(--mcg-orange-dim);
	border-radius: var(--mcg-radius-md);
	padding: 1.25rem;
}
.mcg-mobile-menu__cta p {
	font-family: var(--mcg-font-display);
	text-transform: uppercase;
	font-size: 0.95rem;
	margin-bottom: 0.75rem;
}

.mcg-mobile-menu__social { display: flex; flex-direction: column; gap: 0.75rem; }
.mcg-mobile-menu__social span {
	font-size: var(--mcg-fs-small);
	letter-spacing: var(--mcg-ls-eyebrow);
	text-transform: uppercase;
	color: var(--mcg-text-dim);
}

.mcg-mobile-menu__copyright {
	margin-top: auto;
	font-size: 0.75rem;
	color: var(--mcg-text-dim);
}
