/* ==========================================================================
   All In Capital — site theme (layered on Bootstrap v5.3.3)
   Palette: blue hue 216 (reference blue hue 210 shifted slightly toward purple)
   ========================================================================== */

:root {
	--aic-h: 216;                                    /* master hue: 210 = pure reference blue, 216 = slight purple tint */
	--blue100: hsl(var(--aic-h) 100% 95%);           /* #e5edff */
	--blue200: hsl(var(--aic-h) 95% 88%);
	--blue400: hsl(var(--aic-h) 88% 58%);
	--blue500: hsl(var(--aic-h) 90% 45%);            /* #0b5eda */
	--blue600: hsl(var(--aic-h) 90% 32%);
	--blue700: hsl(var(--aic-h) 100% 20%);           /* #002966 */
	--blue800: hsl(var(--aic-h) 100% 14%);
	--blue900: hsl(var(--aic-h) 100% 10%);
	--violet-glow: hsl(252 80% 55%);                 /* accent used only in hero glows */

	--font-sans: "Manrope", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	--transition: .3s;
	--radius: .5rem;
	--radius-lg: 1rem;

	/* Bootstrap overrides */
	--bs-font-sans-serif: var(--font-sans);
	--bs-body-font-family: var(--font-sans);
	--bs-body-color: var(--blue700);
	--bs-body-bg: #fff;
	--bs-primary: var(--blue500);
	--bs-primary-rgb: 11, 94, 218;
	--bs-dark: var(--blue700);
	--bs-dark-rgb: 0, 41, 102;
	--bs-link-color: var(--blue500);
	--bs-link-color-rgb: 11, 94, 218;
	--bs-link-hover-color: var(--blue700);
	--bs-link-hover-color-rgb: 0, 41, 102;
	--bs-border-color: var(--blue200);
	--bs-heading-color: var(--blue700);
	--bs-border-radius: var(--radius);
	--bs-border-radius-lg: var(--radius-lg);
}

/* ---------- motion ---------- */
@keyframes fadeUp {
	from { opacity: 0; translate: 0 2rem; }
	to   { opacity: 1; translate: 0 0; }
}
@keyframes drift {
	0%   { translate: 0 0; }
	50%  { translate: 4vw -6vh; }
	100% { translate: 0 0; }
}
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: 0s !important;
		animation-delay: 0s !important;
		transition-duration: 0s !important;
		scroll-behavior: auto !important;
	}
}

/* ---------- base ---------- */
html { scroll-behavior: smooth; scrollbar-gutter: stable; }
body {
	background: linear-gradient(160deg, var(--blue800), var(--blue700) 40%, var(--blue500));
	color: var(--blue700);
	line-height: 1.6;
	min-height: 100vh;
	display: flex;
	flex-direction: column;
}
body.page-sub { background: var(--blue600); }
main { flex: 1 0 auto; display: flex; flex-direction: column; }
main > .sub { flex: 1 0 auto; }
h1, h2, h3, h4 { line-height: 1.2; text-wrap: balance; font-weight: 700; }
p { text-wrap: pretty; }
a { text-decoration: none; transition: color var(--transition); }
.btn { font-weight: 700; letter-spacing: .02em; text-transform: uppercase; font-size: .875rem; padding: .75rem 1.5rem; }
.btn-primary {
	--bs-btn-bg: var(--blue500);
	--bs-btn-border-color: var(--blue500);
	--bs-btn-hover-bg: var(--blue700);
	--bs-btn-hover-border-color: var(--blue700);
	--bs-btn-active-bg: var(--blue800);
	--bs-btn-active-border-color: var(--blue800);
	--bs-btn-focus-shadow-rgb: 11, 94, 218;
}
.btn-outline-light:hover { color: var(--blue700); }
.text-blue-500 { color: var(--blue500) !important; }
.text-blue-700 { color: var(--blue700) !important; }
.bg-blue-100 { background-color: var(--blue100) !important; }

/* ---------- header ---------- */
.site-header {
	background: #fff;
	padding-block: min(1.25rem, 2vh);
	box-shadow: 0 1px 0 var(--blue100);
}
.site-header .navbar { padding: 0; }
.site-header .navbar-brand { padding: 0; margin: 0; }
.site-header .navbar-brand img { width: 230px; height: auto; display: block; }
@media (max-width: 799.98px) { .site-header .navbar-brand img { width: 160px; } }
.site-header .nav-link {
	color: var(--blue700);
	font-weight: 700;
	font-size: .9375rem;
	letter-spacing: .06em;
	text-transform: uppercase;
	padding: .5rem 1vw;
}
.site-header .nav-link:hover,
.site-header .nav-link:focus-visible,
.site-header .nav-link.active { color: var(--blue500); }
.site-header .navbar-toggler {
	border: 0;
	padding: .5rem;
	color: var(--blue700);
}
.site-header .navbar-toggler:focus { box-shadow: 0 0 0 .2rem var(--blue100); }
.site-header .navbar-toggler-icon {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23002966' stroke-linecap='round' stroke-width='3' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
@media (max-width: 991.98px) {
	.site-header .navbar-collapse {
		margin-top: 1rem;
		padding: .5rem 0 1rem;
		border-top: 1px solid var(--blue100);
	}
	.site-header .nav-link { padding: .625rem 0; font-size: 1.0625rem; }
}

/* ---------- hero ---------- */
.hero {
	position: relative;
	overflow: hidden;
	color: #fff;
	padding-block: clamp(4rem, 12vh, 9rem) clamp(5rem, 18vh, 12rem);
	isolation: isolate;
}
.hero::before,
.hero::after {
	content: "";
	position: absolute;
	inset: auto;
	border-radius: 50%;
	filter: blur(70px);
	opacity: .55;
	z-index: -1;
	animation: drift 18s ease-in-out infinite;
	pointer-events: none;
}
.hero::before {
	width: 55vw; height: 55vw;
	right: -15vw; top: -20vh;
	background: radial-gradient(circle, var(--blue400), transparent 70%);
}
.hero::after {
	width: 40vw; height: 40vw;
	left: -10vw; bottom: -25vh;
	background: radial-gradient(circle, var(--violet-glow), transparent 70%);
	animation-delay: -9s;
	opacity: .35;
}
.hero h1 {
	color: #fff;
	font-size: clamp(2.5rem, 6.5vw, 4.5rem);
	font-weight: 500;
	letter-spacing: -.02em;
	line-height: 1.08;
	max-width: 32ch;
	margin-bottom: 2rem;
	animation: fadeUp 1s ease both;
}
.hero h1 strong { font-weight: 800; }
.hero .lead {
	font-size: clamp(1.25rem, 2.6vw, 1.75rem);
	font-weight: 300;
	max-width: 50ch;
	animation: fadeUp 1s ease both;
	animation-delay: .6s;
}
.hero .hero-actions { animation: fadeUp 1s ease both; animation-delay: 1.1s; }
.hero .eyebrow {
	display: inline-block;
	font-size: .8125rem;
	font-weight: 700;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--blue200);
	margin-bottom: 1.5rem;
	animation: fadeUp 1s ease both;
}

/* ---------- home: focus areas / stats / cta ---------- */
.band { color: #fff; padding-block: 5rem; }
.band .section-title {
	color: #fff;
	font-size: clamp(1.75rem, 3.5vw, 2.25rem);
	font-weight: 600;
	margin-bottom: 3rem;
}
.glass-card {
	height: 100%;
	padding: 2rem;
	border-radius: var(--radius-lg);
	background: hsl(var(--aic-h) 100% 100% / .08);
	border: 1px solid hsl(var(--aic-h) 100% 100% / .18);
	backdrop-filter: blur(6px);
	transition: transform var(--transition), background var(--transition);
}
.glass-card:hover { transform: translateY(-4px); background: hsl(var(--aic-h) 100% 100% / .13); }
.glass-card .icon {
	width: 3rem; height: 3rem;
	display: grid; place-items: center;
	border-radius: .75rem;
	background: hsl(var(--aic-h) 100% 100% / .14);
	margin-bottom: 1.25rem;
}
.glass-card h3 { font-size: 1.25rem; color: #fff; margin-bottom: .75rem; }
.glass-card p { color: var(--blue100); margin: 0; font-size: 1rem; }
.stat { text-align: center; }
.stat .num {
	font-size: clamp(2.5rem, 5vw, 3.5rem);
	font-weight: 800;
	letter-spacing: -.02em;
	line-height: 1;
	color: #fff;
}
.stat .label { color: var(--blue200); font-size: .875rem; letter-spacing: .12em; text-transform: uppercase; font-weight: 700; margin-top: .5rem; }
.cta-band {
	background: #fff;
	color: var(--blue700);
	border-radius: var(--radius-lg);
	padding: 3rem;
}
.cta-band h2 { font-size: clamp(1.5rem, 3vw, 2rem); font-weight: 700; }

/* ---------- sub pages ---------- */
.sub {
	background: #fff;
	min-height: 50vh;
	padding-block: 3rem 5rem;
}
.sub h1 {
	font-size: clamp(1.625rem, 3.5vw, 2rem);
	letter-spacing: .08em;
	text-transform: uppercase;
	margin-bottom: 2.5rem;
	position: relative;
	padding-bottom: 1rem;
}
.sub h1::after {
	content: "";
	position: absolute;
	left: 0; bottom: 0;
	width: 3.5rem; height: 3px;
	background: var(--blue500);
	border-radius: 2px;
}
.sub p { font-size: clamp(1.0625rem, 2.2vw, 1.25rem); }
.sub a:hover { text-decoration: underline; }
.sub .kicker { font-size: .875rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--blue500); }

/* about */
.about-pillars .pillar {
	padding: 1.5rem;
	border-radius: var(--radius);
	background: linear-gradient(to right, #fff, var(--blue100));
	border-left: 4px solid var(--blue500);
	height: 100%;
}
.about-pillars h3 { font-size: 1.0625rem; text-transform: uppercase; letter-spacing: .06em; margin-bottom: .5rem; }
.about-pillars p { font-size: 1rem; margin: 0; color: var(--blue600); }

/* team */
.team-bio {
	display: flex;
	flex-wrap: wrap;
	gap: 2.5rem;
	align-items: start;
	padding: 2rem;
	margin-top: 2.5rem;
	border-radius: var(--radius);
	background: linear-gradient(to right, #fff, var(--blue100));
}
.team-bio img {
	width: 200px;
	aspect-ratio: 1;
	border-radius: var(--radius);
	object-fit: cover;
	flex: 0 0 auto;
}
.team-bio .bio-text { flex: 1 1 40ch; }
.team-bio .name { font-size: 1.5rem; margin-bottom: .25rem; }
.team-bio .role {
	color: var(--blue700);
	font-size: .875rem;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	margin-bottom: 1rem;
}
.team-bio ul { padding-left: 1.125rem; margin: 0; }
.team-bio li { color: var(--blue600); list-style-type: square; margin-bottom: .75rem; font-size: 1.0625rem; }

/* portfolio */
.portfolio-grid {
	display: grid;
	gap: 1.5rem;
	grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
	margin-top: 1rem;
	margin-bottom: 3rem;
}
.portfolio-grid a {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
	position: relative;
	min-height: 170px;
	padding: 1rem 1.5rem;
	border: 1px solid var(--blue200);
	border-radius: var(--radius);
	box-shadow: 0 0 .25rem .25rem var(--blue100);
	color: var(--blue700);
	font-size: .875rem;
	line-height: 1.3;
	overflow: hidden;
	transition: transform var(--transition), border-color var(--transition);
}
.portfolio-grid a:has(.tag) { padding-bottom: 4.25rem; }
.portfolio-grid a:hover { border-color: var(--blue500); transform: scale(1.04); text-decoration: none; }
.portfolio-grid img { max-height: 60px; max-width: 170px; margin-bottom: .75rem; }
.portfolio-grid .tag {
	position: absolute;
	left: 0; right: 0; bottom: 0;
	padding: .5rem;
	background: var(--blue500);
	color: #fff;
	font-size: .75rem;
	font-weight: 700;
	letter-spacing: .04em;
	line-height: 1.35;
}
.portfolio-grid a.exited .tag { background: var(--blue700); }

/* press */
.press-grid {
	display: grid;
	gap: 3rem 6rem;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
}
.press-item h3 { font-size: .8125rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--blue500); margin-bottom: .25rem; }
.press-item h2 { font-size: 1.375rem; margin-bottom: .75rem; }
.press-item .source { font-size: .875rem; color: var(--blue600); margin-bottom: .75rem; }
.press-item a.more { font-weight: 700; font-size: .875rem; letter-spacing: .04em; text-transform: uppercase; }

/* contact */
.contact-form { max-width: 560px; }
.contact-form .form-control,
.contact-form .form-select {
	border-color: var(--blue200);
	padding: .75rem 1rem;
	font-size: 1rem;
}
.contact-form .form-control:focus,
.contact-form .form-select:focus {
	border-color: var(--blue500);
	box-shadow: 0 0 0 .2rem hsl(var(--aic-h) 90% 45% / .2);
}
.contact-form label { font-weight: 700; font-size: .875rem; letter-spacing: .04em; text-transform: uppercase; color: var(--blue700); }
.contact-aside { background: var(--blue100); border-radius: var(--radius); padding: 2rem; }
.contact-aside p { font-size: 1rem; margin-bottom: .5rem; }

/* ---------- footer ---------- */
.site-footer {
	color: #fff;
	padding-block: 4rem 3rem;
	text-align: center;
}
.site-footer img { width: 190px; height: auto; margin: 0 auto 1.5rem; }
.site-footer nav a {
	color: var(--blue100);
	font-weight: 700;
	font-size: .8125rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	margin: 0 .75rem;
}
.site-footer nav a:hover { color: #fff; }
.site-footer .legal { color: var(--blue200); font-size: .875rem; margin-top: 1.5rem; margin-bottom: 0; }
.site-footer .disclaimer { color: hsl(var(--aic-h) 95% 88% / .7); font-size: .75rem; max-width: 70ch; margin: 1rem auto 0; }

/* ---------- scroll reveal ---------- */
[data-fade-in] { opacity: 0; translate: 0 2rem; transition: opacity .8s ease, translate .8s ease; }
[data-fade-in].is-visible { opacity: 1; translate: 0 0; }
@media (prefers-reduced-motion: reduce) { [data-fade-in] { opacity: 1; translate: 0 0; } }
