:root{
	--navy:#0B1220;
	--navy-soft:#141d2e;
	--violet:#6D28D9;
	--violet-dim:#5b21b6;
	--cyan:#22D3EE;
	--cyan-muted:rgba(34,211,238,.65);
	--offwhite:#F8FAFC;
	--text:#0f172a;
	--muted:#64748b;
	--card:#ffffff;
	--border:rgba(15,23,42,.10);
	--border-strong:rgba(15,23,42,.14);
	--shadow:0 4px 24px rgba(2,6,23,.06);
	--shadow-lg:0 24px 64px rgba(2,6,23,.12);
	--body-bg:#f8fafc;
	--nav-bg:rgba(248,250,252,.78);
	--pill-bg:rgba(255,255,255,.72);
	--list-chip-bg1:#fff;
	--list-chip-bg2:#f8fafc;
	--radius-sm:10px;
	--radius-md:14px;
	--radius-lg:20px;
	--radius-xl:28px;
	--ease:cubic-bezier(.22,1,.36,1);
	--font-display:'Space Grotesk', ui-sans-serif, system-ui, sans-serif;
	--font-body:'DM Sans', ui-sans-serif, system-ui, sans-serif;
}

[data-theme="dark"]{
	color-scheme:dark;
	--navy:#f1f5f9;
	--navy-soft:#1a2332;
	--text:#e2e8f0;
	--muted:#94a3b8;
	--card:#141d2e;
	--border:rgba(255,255,255,.10);
	--border-strong:rgba(255,255,255,.16);
	--shadow:0 4px 24px rgba(0,0,0,.35);
	--shadow-lg:0 24px 64px rgba(0,0,0,.45);
	--body-bg:#0b1220;
	--nav-bg:rgba(15,23,42,.82);
	--pill-bg:rgba(30,41,59,.65);
	--list-chip-bg1:#1e293b;
	--list-chip-bg2:#0f172a;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
	margin:0;
	font-family:var(--font-body);
	font-size:17px;
	font-optical-sizing:auto;
	color:var(--text);
	background-color:var(--body-bg);
	background-image:
		radial-gradient(ellipse 120% 80% at 50% -40%, rgba(109,40,217,.08), transparent 55%),
		radial-gradient(ellipse 80% 50% at 100% 0%, rgba(34,211,238,.06), transparent 45%);
	transition:background-color .35s var(--ease), color .2s;
}
html[data-theme="dark"] body{
	background-image:
		radial-gradient(ellipse 120% 80% at 50% -40%, rgba(109,40,217,.18), transparent 55%),
		radial-gradient(ellipse 80% 50% at 100% 0%, rgba(34,211,238,.10), transparent 45%);
}
a{color:var(--violet); text-decoration:none; transition:color .2s var(--ease)}
a:hover{color:var(--violet-dim)}
.container{max-width:1120px; margin:0 auto; padding:0 clamp(20px,4vw,32px)}
.skip-link{
	position:absolute;
	left:-9999px;
	top:8px;
	z-index:100;
	padding:10px 16px;
	background:var(--navy);
	color:var(--offwhite);
	border-radius:var(--radius-sm);
	font-weight:600;
}
.skip-link:focus{left:8px}
[data-theme="dark"] .skip-link{
	background:var(--cyan);
	color:var(--body-bg);
}

.nav{
	position:sticky;
	top:0;
	z-index:50;
	backdrop-filter:saturate(180%) blur(16px);
	background:var(--nav-bg);
	border-bottom:1px solid var(--border);
	transition:background .35s var(--ease), border-color .2s;
}
.nav-inner{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:16px;
	padding:14px 0;
	flex-wrap:wrap;
}
.nav-toggle{
	display:none;
	align-items:center;
	justify-content:center;
	flex-direction:column;
	gap:5px;
	width:44px;
	height:44px;
	padding:0;
	border-radius:var(--radius-md);
	border:1px solid var(--border-strong);
	background:var(--card);
	color:var(--navy);
	cursor:pointer;
	box-shadow:var(--shadow);
	transition:transform .2s var(--ease), border-color .2s, background .2s;
}
.nav-toggle span{
	display:block;
	width:18px;
	height:2px;
	border-radius:999px;
	background:currentColor;
	transition:transform .25s var(--ease), opacity .2s var(--ease);
}
.nav-toggle:hover{
	transform:translateY(-1px);
	border-color:rgba(109,40,217,.35);
}
.nav-toggle:focus-visible{
	outline:2px solid var(--violet);
	outline-offset:2px;
}
[data-theme="dark"] .nav-toggle{
	color:var(--offwhite);
	background:var(--navy-soft);
}
.nav.nav-open .nav-toggle span:nth-child(1){
	transform:translateY(7px) rotate(45deg);
}
.nav.nav-open .nav-toggle span:nth-child(2){
	opacity:0;
}
.nav.nav-open .nav-toggle span:nth-child(3){
	transform:translateY(-7px) rotate(-45deg);
}
.nav-actions{
	display:flex;
	align-items:center;
	gap:10px;
	flex-wrap:wrap;
}
.theme-toggle{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	width:44px;
	height:44px;
	padding:0;
	border-radius:var(--radius-md);
	border:1px solid var(--border-strong);
	background:var(--card);
	color:var(--navy);
	cursor:pointer;
	box-shadow:var(--shadow);
	transition:transform .2s var(--ease), border-color .2s, background .2s;
}
.theme-toggle:hover{
	transform:translateY(-1px);
	border-color:rgba(109,40,217,.35);
}
.theme-toggle:focus-visible{
	outline:2px solid var(--violet);
	outline-offset:2px;
}
.theme-toggle .icon-sun,
.theme-toggle .icon-moon{
	width:20px;
	height:20px;
}
.theme-toggle-mobile{
	display:none;
}
.theme-toggle .icon-sun{display:none}
[data-theme="dark"] .theme-toggle .icon-sun{display:block}
[data-theme="dark"] .theme-toggle .icon-moon{display:none}
[data-theme="dark"] .theme-toggle{color:var(--offwhite); background:var(--navy-soft)}

.brand{
	display:inline-flex;
	align-items:center;
	gap:12px;
	font-family:var(--font-display);
	font-weight:700;
	font-size:1.05rem;
	letter-spacing:.04em;
	color:var(--navy);
}
.brand-mark{
	width:36px;
	height:36px;
	border-radius:10px;
	background:linear-gradient(145deg, var(--violet) 0%, #7c3bed 45%, var(--cyan) 130%);
	display:grid;
	place-items:center;
	box-shadow:0 8px 24px rgba(109,40,217,.35);
}
.brand-mark svg{width:20px; height:20px; color:#fff}
.nav-links{
	display:flex;
	gap:8px 20px;
	flex-wrap:wrap;
	justify-content:center;
	align-items:center;
}
.nav-links a{
	color:var(--muted);
	font-weight:600;
	font-size:.9rem;
	padding:6px 2px;
	position:relative;
}
.nav-links a::after{
	content:'';
	position:absolute;
	left:0; right:0; bottom:0;
	height:2px;
	background:linear-gradient(90deg, var(--violet), var(--cyan));
	transform:scaleX(0);
	transform-origin:left;
	transition:transform .35s var(--ease);
	border-radius:2px;
}
.nav-links a:hover{color:var(--navy)}
.nav-links a:hover::after{transform:scaleX(1)}
.nav-cta{
	font-weight:700;
	font-size:.875rem;
	color:var(--navy);
	background:linear-gradient(180deg, var(--list-chip-bg1), var(--list-chip-bg2));
	border:1px solid var(--border-strong);
	padding:11px 16px;
	border-radius:var(--radius-md);
	white-space:nowrap;
	box-shadow:var(--shadow);
	transition:transform .2s var(--ease), box-shadow .2s var(--ease), color .2s;
}
.nav-cta:hover{
	transform:translateY(-1px);
	box-shadow:var(--shadow-lg);
	color:var(--violet);
}
@media (max-width: 900px){
	.nav-inner{
		align-items:flex-start;
	}
	.nav-toggle{
		display:inline-flex;
		order:2;
	}
	.nav-actions{
		order:3;
		width:100%;
	}
	.nav-links{
		order:4;
		width:100%;
		flex-direction:column;
		align-items:stretch;
		gap:4px;
		padding:10px;
		border:1px solid var(--border);
		border-radius:var(--radius-lg);
		background:linear-gradient(180deg, var(--list-chip-bg1), var(--list-chip-bg2));
		box-shadow:var(--shadow);
		max-height:0;
		opacity:0;
		overflow:hidden;
		pointer-events:none;
		transform:translateY(-8px);
		transition:max-height .3s var(--ease), opacity .22s var(--ease), transform .22s var(--ease), padding .22s var(--ease), margin .22s var(--ease);
	}
	.nav.nav-open .nav-links{
		max-height:320px;
		opacity:1;
		pointer-events:auto;
		transform:translateY(0);
		margin-top:4px;
	}
	.nav:not(.nav-open) .nav-links{
		padding-top:0;
		padding-bottom:0;
		border-color:transparent;
		box-shadow:none;
	}
	.nav-links a{
		display:block;
		padding:12px 8px;
	}
	.theme-toggle-desktop{
		display:none;
	}
	.theme-toggle-mobile{
		display:inline-flex;
		width:100%;
		margin-top:4px;
		justify-content:center;
	}
	.nav-cta{
		width:100%;
		text-align:center;
		justify-content:center;
	}
}

.hero{
	padding:0;
	--parallax-media-shift:0px;
	--parallax-content-shift:0px;
	--parallax-overlay-shift:0px;
}
.hero-banner{
	width:100%;
	max-width:1600px;
	margin:0 auto;
	display:block;
}
.hero-banner > .hero-panel{
	border-radius:0;
	border-left:none;
	border-right:none;
	border-top:none;
	border-bottom:1px solid var(--border-strong);
	box-shadow:none;
	min-height:min(52vh, 640px);
}
.hero-content{
	padding:clamp(36px,6vw,64px) 0 clamp(48px,6vw,80px);
	transform:translate3d(0, var(--parallax-content-shift), 0);
	will-change:transform;
}
.motion-ready [data-reveal]{
	opacity:0;
	transform:translate3d(0, 28px, 0);
	transition:
		opacity .7s var(--ease),
		transform .7s var(--ease);
	transition-delay:var(--reveal-delay, 0ms);
}
.motion-ready [data-reveal].is-visible{
	opacity:1;
	transform:translate3d(0, 0, 0);
}
.hero-kicker{
	font-size:.8125rem;
	font-weight:700;
	text-transform:uppercase;
	letter-spacing:.14em;
	color:var(--violet);
	margin:4px 0 16px;
}
h1{
	font-family:var(--font-display);
	font-size:clamp(2.25rem,5vw,3.25rem);
	font-weight:700;
	line-height:1.08;
	margin:0 0 20px;
	letter-spacing:-.02em;
	color:var(--navy);
}
h1 .gradient{
	background:linear-gradient(105deg, var(--violet) 0%, #9333ea 40%, var(--cyan) 100%);
	-webkit-background-clip:text;
	background-clip:text;
	color:transparent;
}
h2{
	font-family:var(--font-display);
	font-size:clamp(1.65rem,3vw,2rem);
	font-weight:700;
	margin:0 0 8px;
	letter-spacing:-.02em;
	color:var(--navy);
}
h3{
	font-family:var(--font-display);
	font-size:1.125rem;
	font-weight:600;
	margin:0 0 12px;
	color:var(--navy);
}
p{line-height:1.65; color:var(--muted); margin:0 0 16px}
.lead{font-size:1.125rem; color:var(--text); font-weight:500; max-width:34em}
.pills{
	margin:22px 0 22px;
	padding:0;
	list-style:none;
	display:flex;
	flex-wrap:wrap;
	gap:10px;
}
.pills li{
	padding:10px 14px;
	border:1px solid var(--border);
	background:var(--pill-bg);
	backdrop-filter:blur(8px);
	border-radius:999px;
	color:var(--text);
	font-weight:600;
	font-size:.9rem;
}
.btns{display:flex; gap:12px; flex-wrap:wrap; margin:24px 0 24px}
.btn{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:8px;
	padding:14px 22px;
	border-radius:var(--radius-md);
	font-weight:700;
	font-size:.95rem;
	transition:transform .2s var(--ease), box-shadow .2s var(--ease);
}
.btn.primary{
	background:linear-gradient(135deg, var(--violet) 0%, #7c3bed 100%);
	color:#fff;
	border:none;
	box-shadow:0 12px 32px rgba(109,40,217,.35);
}
.btn.primary:hover{transform:translateY(-2px); box-shadow:0 16px 40px rgba(109,40,217,.42)}
.btn.secondary{
	background:var(--card);
	color:var(--navy);
	border:1px solid var(--border-strong);
	box-shadow:var(--shadow);
}
.btn.secondary:hover{transform:translateY(-2px); border-color:rgba(109,40,217,.35); color:var(--violet)}
.callout{
	background:linear-gradient(135deg, rgba(34,197,94,.08), rgba(34,211,238,.06));
	border:1px solid rgba(34,197,94,.22);
	border-radius:var(--radius-lg);
	padding:20px 22px;
}
[data-theme="dark"] .callout{
	background:linear-gradient(135deg, rgba(34,197,94,.12), rgba(34,211,238,.08));
	border-color:rgba(34,197,94,.28);
}
.callout strong{
	display:flex;
	align-items:center;
	gap:8px;
	margin-bottom:12px;
	font-family:var(--font-display);
	color:var(--navy);
	font-size:1rem;
}
.callout ul{margin:0; padding-left:20px; color:var(--muted)}
.callout li{margin-bottom:4px}

.hero-panel{
	position:relative;
	border-radius:var(--radius-xl);
	overflow:hidden;
	border:1px solid var(--border-strong);
	background:var(--navy-soft);
	box-shadow:var(--shadow-lg);
	min-height:min(380px, 52vw);
	display:flex;
	align-items:stretch;
}
.hero-panel::after{
	content:'';
	position:absolute;
	inset:0;
	pointer-events:none;
	background:linear-gradient(180deg, transparent 55%, rgba(11,18,32,.45) 100%);
	z-index:2;
	transform:translate3d(0, var(--parallax-overlay-shift), 0);
	will-change:transform;
}
[data-theme="dark"] .hero-panel::after{
	background:linear-gradient(180deg, transparent 50%, rgba(0,0,0,.5) 100%);
}
.hero-panel-inner{
	position:relative;
	z-index:1;
	width:100%;
	min-height:min(380px, 52vw);
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	transform:translate3d(0, var(--parallax-media-shift), 0) scale(1.08);
	transform-origin:center;
	will-change:transform;
}
.hero-banner .hero-panel-inner{
	min-height:inherit;
}
.hero-panel img{
	position:absolute;
	inset:0;
	width:100%;
	height:100%;
	object-fit:cover;
	object-position:right bottom;
	display:block;
}
.hero-fallback{
	display:none;
	position:absolute;
	inset:0;
	z-index:3;
	text-align:center;
	padding:40px 24px;
	min-height:280px;
	justify-content:center;
	align-items:center;
	background:linear-gradient(155deg, var(--navy-soft) 0%, var(--navy) 45%, #1e1b4b 100%);
}
.hero-fallback .orbit{
	width:120px;
	height:120px;
	margin:0 auto 16px;
	position:relative;
}
.hero-fallback .orbit-ring{
	position:absolute;
	inset:0;
	border:2px solid rgba(34,211,238,.35);
	border-radius:50%;
	animation:spin 18s linear infinite;
}
.hero-fallback .orbit-ring:nth-child(2){
	inset:12px;
	border-color:rgba(109,40,217,.4);
	animation-direction:reverse;
	animation-duration:14s;
}
.hero-fallback .orbit-core{
	position:absolute;
	left:50%;
	top:50%;
	transform:translate(-50%,-50%);
	width:48px;
	height:48px;
	background:linear-gradient(135deg, var(--cyan), var(--violet));
	border-radius:14px;
	box-shadow:0 0 40px rgba(34,211,238,.5);
}
@keyframes spin{to{transform:rotate(360deg)}}
.hero-fallback p{
	color:rgba(248,250,252,.75);
	font-size:.9rem;
	margin:0;
	max-width:260px;
}
.section{padding:clamp(48px,7vw,80px) 0}
.section.alt{
	background:rgba(255,255,255,.5);
	border-top:1px solid var(--border);
	border-bottom:1px solid var(--border);
}
[data-theme="dark"] .section.alt{
	background:rgba(255,255,255,.03);
}
.section-head{
	display:flex;
	align-items:flex-end;
	justify-content:space-between;
	gap:20px;
	margin-bottom:28px;
	flex-wrap:wrap;
}
.section-head > div:first-child{min-width:min(100%, 280px)}
.kicker{color:var(--muted); font-weight:600; font-size:.95rem; max-width:28em; line-height:1.5}
.grid-3{
	display:grid;
	grid-template-columns: repeat(3, 1fr);
	gap:20px;
}
@media (max-width: 900px){
	.grid-3{grid-template-columns:1fr}
}
.card{
	position:relative;
	background:var(--card);
	border:1px solid var(--border);
	border-radius:var(--radius-lg);
	padding:26px 24px;
	box-shadow:var(--shadow);
	transition:transform .35s var(--ease), box-shadow .35s var(--ease), border-color .2s, background .2s;
	overflow:hidden;
}
.card::before{
	content:'';
	position:absolute;
	top:0; left:0; right:0;
	height:3px;
	background:linear-gradient(90deg, var(--violet), var(--cyan));
	opacity:0;
	transition:opacity .35s var(--ease);
}
.card:hover{
	transform:translateY(-4px);
	box-shadow:var(--shadow-lg);
	border-color:rgba(109,40,217,.18);
}
.card:hover::before{opacity:1}
.card ul{margin:12px 0 0; padding-left:20px; color:var(--muted); font-size:.95rem}
.card li{margin-bottom:6px}

.list{
	display:flex;
	flex-wrap:wrap;
	gap:12px;
	padding:0;
	margin:0;
	list-style:none;
}
.list li{
	padding:12px 18px;
	border-radius:var(--radius-md);
	border:1px solid var(--border);
	background:linear-gradient(180deg, var(--list-chip-bg1), var(--list-chip-bg2));
	font-weight:600;
	color:var(--navy);
	font-size:.95rem;
	box-shadow:0 1px 2px rgba(2,6,23,.04);
}
[data-theme="dark"] .list li{box-shadow:none}

details{
	background:var(--card);
	border:1px solid var(--border);
	border-radius:var(--radius-lg);
	padding:14px 18px 18px 52px;
	margin:14px 0;
	box-shadow:var(--shadow);
	transition:box-shadow .25s var(--ease);
	position:relative;
}
details:hover{box-shadow:0 8px 32px rgba(2,6,23,.08)}
[data-theme="dark"] details:hover{box-shadow:0 8px 32px rgba(0,0,0,.35)}
details::before{
	content:'';
	position:absolute;
	left:20px;
	top:22px;
	width:10px;
	height:10px;
	border-radius:50%;
	background:linear-gradient(135deg, var(--violet), var(--cyan));
	box-shadow:0 0 0 4px rgba(109,40,217,.12);
}
details summary{
	cursor:pointer;
	font-family:var(--font-display);
	font-weight:700;
	color:var(--navy);
	list-style:none;
	padding:6px 0 4px;
}
details summary::-webkit-details-marker{display:none}
details summary::after{
	content:'';
	float:right;
	width:10px; height:10px;
	border-right:2px solid var(--muted);
	border-bottom:2px solid var(--muted);
	transform:rotate(45deg);
	margin-top:8px;
	transition:transform .3s var(--ease);
}
details[open] summary::after{transform:rotate(-135deg); margin-top:12px}
details ul{margin:12px 0 0; padding-left:20px; color:var(--muted); font-size:.95rem}

.about-values{
	margin:16px 0 0;
	padding-left:20px;
	color:var(--muted);
}
.about-values li{margin-bottom:8px}

.contact-band{
	border-radius:var(--radius-xl);
	background:linear-gradient(135deg, #0B1220 0%, #1a1444 50%, var(--navy-soft) 100%);
	border:1px solid rgba(255,255,255,.08);
	padding:clamp(32px,5vw,48px);
	position:relative;
	overflow:hidden;
	box-shadow:var(--shadow-lg);
}
.contact-band::before{
	content:'';
	position:absolute;
	top:-40%;
	right:-20%;
	width:60%;
	height:120%;
	background:radial-gradient(circle, rgba(109,40,217,.35), transparent 65%);
	pointer-events:none;
}
.contact-band .section-head{margin-bottom:20px}
.contact-band h2{color:#fff}
.contact-band .kicker{color:var(--cyan-muted)}
.contact-band p{color:rgba(248,250,252,.88); margin-bottom:12px}
.contact-band a{color:var(--cyan)}
.contact-band a:hover{color:#fff}
.contact-strong{color:#fff}
.contact-actions{display:flex; flex-wrap:wrap; gap:12px; margin-top:20px}
.contact-actions .btn.primary{
	background:#fff;
	color:#0B1220;
	box-shadow:none;
}
.contact-actions .btn.primary:hover{background:var(--cyan); color:#0B1220}
.contact-actions .btn.secondary{
	background:transparent;
	color:#fff;
	border-color:rgba(255,255,255,.28);
}
.contact-actions .btn.secondary:hover{border-color:var(--cyan); color:var(--cyan)}

.brand-appendix .card::before{display:none}
.brand-appendix .card{
	background:rgba(255,255,255,.65);
}
[data-theme="dark"] .brand-appendix .card{
	background:rgba(30,41,59,.5);
}
.logo-pre{
	margin:0;
	padding:14px 16px;
	background:#0B1220;
	color:var(--offwhite);
	border-radius:var(--radius-md);
	overflow:auto;
	font-family:ui-monospace, monospace;
	font-size:.8rem;
	line-height:1.4;
}

.footer{
	background:#0B1220;
	color:var(--offwhite);
	padding:clamp(40px,6vw,64px) 0 32px;
	margin-top:0;
}
.footer a{color:var(--cyan)}
.footer a:hover{color:#fff}
.footer-grid{
	display:grid;
	grid-template-columns: 1fr;
	gap:32px 24px;
}
.footer-brand{
	font-family:var(--font-display);
	font-weight:700;
	font-size:1.25rem;
	letter-spacing:.04em;
}
.footer-tag{opacity:.85; margin-top:8px; font-size:.95rem}
.footer-col-title{font-weight:700; margin-bottom:12px; font-size:.875rem; text-transform:uppercase; letter-spacing:.08em; opacity:.75}
.footer-col a{display:block; padding:6px 0; color:rgba(248,250,252,.85); font-weight:500}
.footer-col a:hover{color:var(--cyan)}
.hr{height:1px; background:rgba(248,250,252,.12); margin:28px 0 20px}
.small{font-size:.875rem; opacity:.7; margin:0}

.brand-kit-page h1{
	font-family:var(--font-display);
	font-size:clamp(1.65rem,3vw,2.25rem);
	font-weight:700;
	margin:0 0 8px;
	letter-spacing:-.02em;
	color:var(--navy);
}
.brand-kit-page .page-intro{
	max-width:52em;
	margin-bottom:28px;
	color:var(--muted);
}
.brand-kit-page .back-link{
	display:inline-flex;
	align-items:center;
	gap:8px;
	font-weight:700;
	margin-bottom:24px;
}

@media (prefers-reduced-motion: reduce){
	html{scroll-behavior:auto}
	.motion-ready [data-reveal]{
		opacity:1;
		transform:none;
		transition:none;
	}
	.hero-panel::after,
	.hero-panel-inner,
	.hero-content{
		transform:none;
		will-change:auto;
	}
	.hero-fallback .orbit-ring{
		animation:none;
	}
}