/*
 * HIMEL.OS v6.3 visual system
 * One 1300px content grid, a true viewport hero, and the official blue/cyan
 * identity across the public experience. Loaded after himel-os.css.
 */
.hos3 {
	--hos3-container: 1300px;
	--hos3-gutter: clamp(20px, 4vw, 56px);
	--hos3-edge: max(var(--hos3-gutter), calc((100vw - var(--hos3-container)) / 2));
	--hos3-accent: #08bdfd !important;
	--hos3-warm: #61f7fc !important;
	--hos3-blue: #0756d8;
	--hos3-cyan: #61f7fc;
	--hos3-night: #020713;
	--hos3-navy: #06152f;
	--hos3-paper: #f3f8fc;
	--hos3-ink: #07152c;
	background: var(--hos3-night);
}

.hos3 ::selection {
	background: rgba(8, 189, 253, .3);
	color: #fff;
}

.hos3 :is(h1, h2, h3) {
	text-wrap: balance;
}

.hos3 :is(p, li) {
	text-wrap: pretty;
}

/* The floating navigation follows the same 1300px geometry as the page. */
.hos3-header {
	left: 50%;
	right: auto;
	width: min(calc(100% - (var(--hos3-gutter) * 2)), var(--hos3-container));
	transform: translateX(-50%);
	border-color: rgba(97, 247, 252, .2);
	border-radius: 20px;
	background:
		radial-gradient(circle at 88% 0, rgba(97, 247, 252, .1), transparent 30%),
		linear-gradient(120deg, rgba(3, 9, 24, .94), rgba(5, 24, 51, .86));
	box-shadow: 0 24px 80px rgba(0, 5, 25, .46), inset 0 1px rgba(255, 255, 255, .055);
}

.hos3-header.is-scrolled {
	background: rgba(3, 10, 24, .94);
	border-color: rgba(97, 247, 252, .3);
}

.hos3-nav a {
	padding: 10px 9px;
	border: 1px solid transparent;
	border-radius: 9px;
}

.hos3-nav a:hover,
.hos3-nav a[aria-current="page"] {
	border-color: rgba(97, 247, 252, .22);
	background: rgba(8, 189, 253, .08);
}

.hos3-call-lift,
.hos3-primary-action,
.hos3-floor-cta a,
.hos3-lobby-routing__actions button:first-child,
.hos3-intake-desk__actions button:first-child {
	border-color: rgba(97, 247, 252, .4) !important;
	background: linear-gradient(112deg, #0756d8 0%, #0da0f8 56%, #61f7fc 115%) !important;
	color: #031126 !important;
	box-shadow: 0 17px 48px rgba(8, 143, 244, .22), inset 0 1px rgba(255, 255, 255, .36) !important;
}

/* The lobby is exactly one viewport on desktop. Its content and hardware sit
 * on the same 1300px grid while the 3D environment remains full bleed. */
.hos3-lobby-hero {
	height: 100vh;
	height: 100svh;
	min-height: 720px;
	background:
		radial-gradient(circle at 72% 36%, rgba(13, 160, 248, .2), transparent 31%),
		radial-gradient(circle at 25% 70%, rgba(97, 247, 252, .08), transparent 28%),
		linear-gradient(135deg, #020510 0%, #06142c 55%, #020b18 100%) !important;
}

.hos3-lobby-hero:before {
	background:
		linear-gradient(90deg, rgba(2, 6, 18, .98) 0%, rgba(3, 9, 24, .88) 39%, rgba(3, 9, 24, .2) 70%, rgba(3, 9, 24, .72)),
		linear-gradient(0deg, rgba(2, 7, 18, .78), transparent 37%) !important;
}

.hos3-lobby-hero__scene {
	left: clamp(42%, calc(50% - 50px), 50%);
}

.hos3-lobby-hero__copy {
	width: min(760px, calc(100% - (var(--hos3-edge) * 2) - 260px));
	padding: clamp(116px, 14vh, 166px) 0 58px var(--hos3-edge);
}

.hos3-lobby-hero h1,
.hos3-lobby-hero h1 .hos3-split-line,
.hos3-floor-hero__copy h1,
.hos3-floor-hero__copy h1 .hos3-split-line {
	background: linear-gradient(105deg, #ffffff 0%, #dffcff 31%, #61f7fc 63%, #0da0f8 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent !important;
}

.hos3-lobby-hero h1 {
	max-width: 820px;
	font-size: clamp(58px, 5.9vw, 94px);
	font-weight: 620;
	line-height: .91;
	letter-spacing: -.072em;
	filter: drop-shadow(0 18px 42px rgba(0, 5, 25, .42));
}

.hos3-lobby-hero__lead {
	max-width: 680px !important;
	color: #aec1d5 !important;
	font-size: clamp(15px, 1.2vw, 18px) !important;
	line-height: 1.68;
	margin-top: 18px;
}

.hos3-lift-guide {
	margin-block: 22px 16px;
}

.hos3-lobby-hero__actions {
	margin-top: 22px;
}

.hos3-lobby-hero__proof {
	margin-top: 24px;
}

.hos3-lift-guide,
.hos3-lobby-hero__proof {
	border-color: rgba(97, 247, 252, .18) !important;
	background: rgba(4, 16, 37, .72) !important;
	box-shadow: inset 0 1px rgba(255, 255, 255, .035);
	backdrop-filter: blur(16px);
}

.hos3-lobby-hero__proof > div {
	background: rgba(3, 13, 31, .82);
}

.hos3-lobby-hero__ticker {
	padding-inline: var(--hos3-edge);
	border-color: rgba(97, 247, 252, .13);
	background: rgba(2, 8, 20, .9);
}

.hos3-lobby-hero__scroll {
	right: var(--hos3-edge);
}

.hos3-hero-scanner {
	right: var(--hos3-edge);
	border-color: rgba(97, 247, 252, .42);
	box-shadow: 0 44px 110px rgba(0, 3, 18, .78), inset 0 0 0 1px rgba(255, 255, 255, .05), 0 0 54px rgba(8, 189, 253, .12);
}

/* Every main section shares one content width; backgrounds remain full bleed. */
.hos3 :is(
	.hos3-dispatch,
	.hos3-lobby-statement,
	.hos61-trust,
	.hos61-process,
	.hos3-home-diagnostics,
	.hos3-home-cases,
	.hos3-lobby-routing,
	.hos3-floor-hero,
	.hos3-condition-board,
	.hos3-diagnostic-manifest,
	.hos3-department-directory,
	.hos3-scanner-stage,
	.hos3-reading-room,
	.hos3-diagnostics-disclaimer,
	.hos3-editorial-principle,
	.hos3-knowledge-index,
	.hos3-knowledge-paths,
	.hos3-vault-context,
	.hos3-vault,
	.hos3-vault-aftercare,
	.hos3-operator-profile,
	.hos3-capability-matrix,
	.hos3-operating-values,
	.hos3-intake-desk,
	.hos3-care-protocol,
	.hos3-floor-cta,
	.hos3-footer
) {
	padding-inline: var(--hos3-edge);
}

.hos3-floor-hero {
	min-height: min(900px, 100svh);
	grid-template-columns: 120px minmax(0, 1fr) minmax(330px, .62fr);
	gap: clamp(28px, 4.5vw, 72px);
}

.hos3-floor-hero__copy h1 {
	font-size: clamp(58px, 5.7vw, 94px);
	font-weight: 620;
}

.hos3-section-heading {
	gap: clamp(40px, 7vw, 105px);
	margin-bottom: clamp(38px, 5vw, 68px);
}

.hos3-section-heading h2 {
	font-size: clamp(42px, 4.8vw, 72px);
	font-weight: 610;
}

/* Polished cards: coherent depth, larger usable targets, and one brand glow. */
.hos3 :is(.hos3-dispatch-card, .hos3-department-card) {
	--department-accent: #0da0f8 !important;
}

.hos3-dispatch-card,
.hos3-department-card,
.hos3-case-card,
.hos3-article-card,
.hos61-process__grid article,
.hos61-trust__grid article,
.hos3-capability-matrix article {
	border-color: rgba(8, 126, 196, .17);
	border-radius: 26px;
	box-shadow: 0 24px 72px rgba(4, 32, 65, .08), inset 0 1px rgba(255, 255, 255, .45);
}

.hos3-case-card {
	background: linear-gradient(145deg, #0a1c39, #030a18 74%);
	box-shadow: 0 28px 85px rgba(0, 4, 20, .42), inset 0 1px rgba(255, 255, 255, .04);
}

.hos3-case-card:hover,
.hos3-article-card:hover,
.hos3-department-card:hover,
.hos3-dispatch-card:hover {
	border-color: rgba(97, 247, 252, .48);
	box-shadow: 0 38px 100px rgba(0, 15, 46, .3), 0 0 44px rgba(8, 189, 253, .08);
}

.hos3-case-card__chrome i,
.hos3-case-card__chrome i:nth-child(2),
.hos3-case-card__chrome i:nth-child(3) {
	background: #08bdfd;
	box-shadow: 0 0 9px rgba(8, 189, 253, .5);
}

.hos3-case-card__chrome i:nth-child(2) { opacity: .68; }
.hos3-case-card__chrome i:nth-child(3) { opacity: .4; }

.hos3-case-card__copy h3,
.hos3-article-card h3,
.hos3-department-card h3 {
	letter-spacing: -.045em;
}

.hos3-case-card__open,
.hos3-vault__filters button,
.hos3-lobby-routing__actions button,
.hos3-intake-desk__actions button {
	min-height: 48px;
}

.hos3-case-card__open:focus-visible,
.hos3-vault__filters button:focus-visible {
	outline: 2px solid #61f7fc;
	outline-offset: 3px;
}

.hos3-lobby-routing {
	background: linear-gradient(112deg, #0756d8 0%, #0a8fe9 55%, #08bdfd 100%);
	color: #fff;
}

.hos3-lobby-routing p {
	color: rgba(239, 251, 255, .78);
}

.hos3-footer {
	grid-template-columns: minmax(340px, 1.2fr) minmax(210px, .65fr) minmax(250px, .7fr);
	background: linear-gradient(160deg, #020610, #06142b) !important;
}

/* Dedicated project/article templates use the same 1300px system. */
.hos-single {
	--hos-single-container: 1300px;
	--hos-single-gutter: clamp(20px, 4vw, 56px);
	--hos-single-edge: max(var(--hos-single-gutter), calc((100vw - var(--hos-single-container)) / 2));
}

.hos-single__header {
	padding-inline: var(--hos-single-edge);
}

.hos-single__hero,
.hos-single__story,
.hos-single__related,
.hos-single__closing,
.hos-single__footer,
.hos-article__hero {
	padding-inline: var(--hos-single-edge);
}

.hos-single__hero {
	min-height: min(900px, 100svh);
	grid-template-columns: minmax(0, .9fr) minmax(440px, 1.1fr);
	gap: clamp(44px, 6vw, 90px);
}

.hos-single__hero h1,
.hos-article__hero h1 {
	background: linear-gradient(105deg, #fff, #dffcff 35%, #61f7fc 68%, #0da0f8);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

.hos-article__cover {
	max-width: 1300px;
}

/* Laptop-height tuning keeps the 100vh lobby intentional rather than cramped. */
@media (min-width: 921px) and (max-height: 820px) {
	.hos3-header { min-height: 66px; top: 12px; }
	.hos3-lobby-hero__copy { padding-top: 112px; padding-bottom: 62px; }
	.hos3-lobby-hero h1 { font-size: clamp(54px, 5.8vw, 82px); }
	.hos3-lobby-hero__lead { margin-top: 17px; line-height: 1.55; }
	.hos3-lift-guide { margin-top: 18px !important; }
	.hos3-lobby-hero__actions { margin-top: 18px; }
	.hos3-lobby-hero__proof { margin-top: 22px; }
	.hos3-lobby-hero__proof > div { padding-block: 10px; }
	.hos3-hero-scanner { transform: translateY(-44%) scale(.84); transform-origin: right center; }
	.hos3-hero-scanner.is-prompted { transform: translateY(-44%) scale(.9); }
}

@media (max-width: 1260px) {
	.hos3-lobby-hero__copy {
		width: min(720px, 61vw);
	}
	.hos3-hero-scanner {
		right: var(--hos3-gutter);
	}
	.hos3-floor-hero {
		grid-template-columns: 90px minmax(0, 1fr) 310px;
	}
	.hos3-footer {
		grid-template-columns: 1fr 1fr;
	}
}

@media (max-width: 920px) {
	.hos3 {
		--hos3-gutter: clamp(18px, 5vw, 34px);
		--hos3-edge: var(--hos3-gutter);
	}
	.hos3-header {
		width: calc(100% - 24px);
		transform: translateX(-50%);
	}
	.hos3-lobby-hero {
		height: auto;
		min-height: 1080px;
		max-height: none;
	}
	.hos3-lobby-hero__copy {
		width: 100%;
		padding: 128px var(--hos3-edge) 560px;
	}
	.hos3-lobby-hero h1 {
		max-width: 760px;
		font-size: clamp(52px, 10.5vw, 76px);
	}
	.hos3-lobby-hero__scene {
		inset: 43% -14% 48px -14%;
	}
	.hos3-hero-scanner {
		right: 14%;
		top: 56%;
	}
	.hos3-floor-hero {
		display: block;
		min-height: 900px;
	}
	.hos3-floor-hero__copy h1 {
		font-size: clamp(52px, 10.5vw, 78px);
	}
	.hos3-footer {
		grid-template-columns: 1fr 1fr;
	}
	.hos-single {
		--hos-single-edge: clamp(20px, 5vw, 38px);
	}
	.hos-single__hero {
		grid-template-columns: 1fr;
		min-height: 0;
	}
}

@media (max-width: 560px) {
	.hos3 {
		--hos3-gutter: 16px;
		--hos3-edge: 18px;
	}
	.hos3-header {
		width: calc(100% - 20px);
		border-radius: 15px;
	}
	.hos3-lobby-hero {
		min-height: 1110px;
	}
	.hos3-lobby-hero__copy {
		padding: 106px 18px 545px;
	}
	.hos3-lobby-hero h1 {
		font-size: clamp(45px, 13vw, 61px);
		line-height: .94;
	}
	.hos3-lobby-hero__lead {
		font-size: 14px !important;
	}
	.hos3-lobby-hero__scene {
		inset: 50% -48% 44px -48%;
	}
	.hos3-hero-scanner {
		right: 50%;
		top: 52%;
		transform: translate(50%, -50%) scale(.78);
	}
	.hos3-hero-scanner.is-prompted {
		transform: translate(50%, -50%) scale(.84);
	}
	.hos3-lobby-hero__proof {
		grid-template-columns: repeat(3, 1fr);
	}
	.hos3-lobby-hero__proof > div {
		display: block;
		padding: 12px 9px;
	}
	.hos3-lobby-hero__proof strong { font-size: 18px; }
	.hos3-lobby-hero__proof span { font-size: 6px; }
	.hos3-section-heading h2 {
		font-size: clamp(36px, 10.8vw, 50px);
	}
	.hos3-case-card,
	.hos3-dispatch-card,
	.hos3-department-card,
	.hos3-article-card {
		border-radius: 20px;
	}
	.hos3-case-card__copy {
		padding: 21px 18px 24px;
	}
	.hos3-footer {
		grid-template-columns: 1fr;
	}
	.hos-single {
		--hos-single-edge: 18px;
	}
	.hos-single__hero-media,
	.hos-single__hero-media img {
		min-height: 330px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.hos3 :is(.hos3-case-card, .hos3-article-card, .hos3-department-card, .hos3-dispatch-card):hover {
		transform: none;
	}
}

/* v6.4: restrained CV controls and editable operator imagery. */
.hos3-lobby-hero__actions > .hos3-cv-action {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 0 15px;
	border: 1px solid rgba(97, 247, 252, .26) !important;
	border-radius: 999px;
	background: rgba(5, 20, 43, .72);
	box-shadow: inset 0 1px rgba(255, 255, 255, .04);
}

.hos3-lobby-hero__actions > .hos3-cv-action:hover {
	border-color: rgba(97, 247, 252, .58) !important;
	background: rgba(8, 189, 253, .12);
}

.hos3-operator-profile__visual > div > img {
	position: relative;
	z-index: 1;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center top;
}

.hos3-operator-profile__copy > div .hos3-operator-cv {
	border-color: rgba(8, 126, 196, .26);
	background: linear-gradient(115deg, #087ec4, #08bdfd 60%, #61f7fc);
	color: #031126;
}

.hos-article__author img {
	width: 42px;
	height: 42px;
	border: 1px solid rgba(97, 247, 252, .28);
	border-radius: 12px;
	object-fit: cover;
	object-position: center top;
}

.hos-article__author span,
.hos-article__author small {
	display: block;
}

.hos-article__author small {
	margin-top: 4px;
	color: #6f89a7;
	font-size: 9px;
	letter-spacing: .035em;
}

@media (max-width: 560px) {
	.hos3-lobby-hero__actions > .hos3-cv-action {
		width: 100%;
	}
	.hos3-floor-hero__copy > div > a,
	.hos3-floor-hero__copy > div > button {
		min-height: 44px;
		text-align: left;
	}
}