/* ==========================================================================
   Mount Hebe — Common Utilities
   ========================================================================== */

:root {
	--vh: 100dvh;
	--header-height: 105px;
}

html {
	font-size: 10px;
	/* Baskervville defaults to old-style (non-aligned) figures; force aligned
	   lining numerals globally so all numbers sit on the baseline at a uniform
	   height (matches .mh-pw-connectivity__minutes). Harmless for fonts that are
	   already lining (Inter, Noto). */
	font-variant-numeric: lining-nums;
}

/* Explicit-script utilities — force a CJK font regardless of page language
   (e.g. language-switcher labels). Per-locale font routing now lives in
   design-system.css (html[lang="zh-tc"/"zh-sc"]); the old zh-hk/zh-cn
   overrides here were dead code (wrong lang codes) and are removed. */
.tc-only, .tc-font {
	font-family: var(--mh-ff-sans-tc);
}
.sc-only, .sc-font {
	font-family: var(--mh-ff-sans-sc);
}

/* Lenis smooth scroll — hide native scrollbar, use custom */
html.lenis {
	height: auto;
}
html {
	scroll-behavior: auto !important;
	scrollbar-width: none;
}
html::-webkit-scrollbar {
	display: none;
}
.lenis.lenis-smooth {
	scroll-behavior: auto !important;
}
.lenis.lenis-smooth [data-lenis-prevent] {
	overscroll-behavior: contain;
}
.lenis.lenis-stopped {
	overflow: hidden;
}
.lenis.lenis-scrolling iframe {
	pointer-events: none;
}

/* Custom scrollbar track + thumb */
.mh-scrollbar {
	position: fixed;
	top: 0;
	right: 0;
	width: 6px;
	height: 100%;
	z-index: 150;
	pointer-events: none;
}

.mh-scrollbar__track {
	position: absolute;
	inset: 0;
	background: transparent;
	pointer-events: auto;
	cursor: pointer;
}

.mh-scrollbar__thumb {
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	min-height: 40px;
	background: rgba(147, 136, 95, 0.4);
	border-radius: 3px;
	transition: background 0.2s ease, width 0.2s ease;
	pointer-events: auto;
	cursor: grab;
}

.mh-scrollbar__thumb:hover,
.mh-scrollbar__thumb.is-dragging {
	background: rgba(147, 136, 95, 0.7);
	width: 8px;
}

.mh-scrollbar.is-hidden {
	opacity: 0;
	transition: opacity 0.3s ease;
}

/* Hide scrollbar when menu/popup is open */
html.menu-open .mh-scrollbar,
html.landing-closed + body .mh-scrollbar,
.mh-popup-overlay.active ~ .mh-scrollbar {
	display: none;
}

/* Links in body text */
p a {
	display: inline;
	color: inherit;
}

/* Perfect Scrollbar overrides */
html .ps--active-y > .ps__rail-y {
	display: block;
	opacity: 1;
	width: 5px !important;
}
html .ps .ps__rail-y.ps--clicking {
	opacity: 1;
}
.ps .ps__rail-y:hover {
    background-color: transparent !important;
}
html .ps__thumb-y {
	box-sizing: border-box;
	width: 5px !important;
	margin-right: -2px;
}
.ps__rail-y.ps--clicking .ps__thumb-y,
.ps__rail-y:focus > .ps__thumb-y,
.ps__rail-y:hover > .ps__thumb-y {
	width: 5px !important;
}

html .ps:hover > .ps__rail-y {
	opacity: 1;
}

/* White scrollbar inside landing disclaimer popup */
.mh-popup__content.ps > .ps__rail-y > .ps__thumb-y {
	background-color: rgba(255, 255, 255, 0.6);
}
.mh-popup__content.ps > .ps__rail-y:hover > .ps__thumb-y,
.mh-popup__content.ps > .ps__rail-y.ps--clicking .ps__thumb-y {
	background-color: rgba(255, 255, 255, 0.9);
}

/* Body lock */
body.fixed {
	overflow: hidden;
}

/* Orientation helpers */
@media screen and (orientation: landscape) {
	.landscape { display: block; }
	.portrait { display: none; }
}
@media screen and (orientation: portrait) {
	.landscape { display: none; }
	.portrait { display: block; }
}