/* =========================================================
   header.css — minimal transparent header
   ========================================================= */

.as-header {
	position: fixed;
	top: var(--banner-h);
	left: 0; right: 0;
	z-index: 1000;
	height: var(--header-h);
	background: transparent;
	color: var(--c-paper); /* default paper (dark-bg-first-section) */
	transition: background-color 0.25s, color 0.25s, border-bottom-color 0.25s;
	border-bottom: 1px solid transparent;
}

/* Text color synced with section behind header (even at scroll=0) */
.as-header.is-bg-dark  { color: var(--c-paper); }
.as-header.is-bg-paper { color: var(--c-ink); }

.as-header.is-solid-dark {
	background: var(--c-bg);
	color: var(--c-paper);
	border-bottom-color: var(--c-line-dark);
}
.as-header.is-solid-paper {
	background: var(--c-paper);
	color: var(--c-ink);
	border-bottom-color: var(--c-line-paper);
}

.as-header__inner {
	max-width: var(--container);
	margin: 0 auto;
	padding: 0 var(--gutter);
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 32px;
}

.as-header__brand {
	font-family: var(--f-display);
	font-size: 1.625rem;
	letter-spacing: -0.01em;
	line-height: 1;
	font-weight: 400;
	text-decoration: none;
}

.as-nav__list {
	display: flex;
	gap: 32px;
	align-items: center;
}
.as-nav__list a {
	position: relative;
	font-family: var(--f-body);
	font-size: 0.9375rem;
	font-weight: 500;
	text-decoration: none;
	padding-bottom: 4px;
	letter-spacing: 0.01em;
	color: inherit;
	transition: color 0.2s;
}
.as-nav__list a::after {
	content: "";
	position: absolute;
	left: 0; right: 0; bottom: 0;
	height: 1px;
	background: currentColor;
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.2s;
}
.as-nav__list a:hover::after,
.as-nav__list a:focus-visible::after { transform: scaleX(1); }
.as-nav__list a.is-active { color: var(--c-accent); }

.as-nav__cta {
	color: var(--c-accent);
}

/* Burger (mobile) */
.as-burger {
	display: none;
	width: 32px;
	height: 32px;
	flex-direction: column;
	justify-content: center;
	gap: 5px;
	padding: 4px;
}
.as-burger span {
	display: block;
	height: 1px;
	background: currentColor;
	transition: transform 0.2s, opacity 0.2s;
}
.as-burger[aria-expanded="true"] span:nth-child(1) {
	transform: translateY(3px) rotate(45deg);
}
.as-burger[aria-expanded="true"] span:nth-child(2) {
	transform: translateY(-3px) rotate(-45deg);
}

/* Mobile drawer */
.as-mobile {
	position: fixed;
	top: calc(var(--banner-h) + var(--header-h));
	left: 0; right: 0;
	background: var(--c-bg);
	color: var(--c-paper);
	padding: 32px var(--gutter-m);
	border-top: 1px solid var(--c-line-dark);
	z-index: 999;
}
.as-mobile[hidden] { display: none; }
.as-mobile ul { display: flex; flex-direction: column; gap: 24px; }
.as-mobile a {
	display: inline-block;
	font-family: var(--f-display);
	font-size: 1.75rem;
	line-height: 1;
	color: inherit;
	text-decoration: none;
}
