.site-header { position: sticky; z-index: 100; top: 0; padding: var(--space-3) var(--gutter) 0; background: linear-gradient(to bottom, rgb(245 241 232 / 96%), rgb(245 241 232 / 78%), transparent); }
.site-header__shell { width: min(100%, var(--container-max)); margin-inline: auto; border: var(--border-subtle); border-radius: var(--radius-card); background: rgb(255 253 248 / 96%); box-shadow: var(--shadow-floating); backdrop-filter: blur(12px); }
.site-header__row { display: flex; min-width: 0; min-height: 4.5rem; align-items: center; gap: var(--space-4); padding: var(--space-3) var(--space-4); }
.site-header__brand { display: inline-flex; min-width: 0; flex: 0 1 12rem; align-items: center; gap: var(--space-3); color: var(--color-charcoal); text-decoration: none; }
.site-header__logo { width: 2.625rem; height: 2.625rem; flex: 0 0 2.625rem; object-fit: contain; }
.site-header__brand-text { display: grid; min-width: 0; line-height: 1; }
.site-header__brand-name { overflow: hidden; font-size: .84rem; font-weight: var(--weight-semibold); letter-spacing: .06em; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.site-header__brand-subtitle { margin-top: .26rem; color: var(--color-slate-muted); font-size: .61rem; font-weight: var(--weight-semibold); letter-spacing: var(--tracking-label); text-transform: uppercase; white-space: nowrap; }
.site-header__nav { min-width: 0; flex: 1 1 auto; }
.site-header__nav-list { display: flex; min-width: 0; align-items: center; justify-content: center; gap: .28rem; margin: 0; padding: 0; list-style: none; }
.site-header__nav-list li, .site-header__nav-list li + li { margin: 0; padding: 0; }
.site-header__nav-link { display: inline-flex; min-height: 2.75rem; align-items: center; padding: .5rem .56rem; border-bottom: 2px solid transparent; color: var(--color-charcoal); font-size: .67rem; font-weight: var(--weight-semibold); letter-spacing: .07em; line-height: 1; text-decoration: none; text-transform: uppercase; white-space: nowrap; transition: border-color var(--transition-fast), color var(--transition-fast), transform var(--transition-fast); }
.site-header__nav-link:hover, .site-header__nav-link[aria-current="page"] { border-color: var(--color-paprika-red); color: var(--color-lagoon-blue); transform: translateY(-1px); }
.site-header__nav-link--mobile { display: none; }
.site-header__actions { display: flex; flex: 0 0 auto; align-items: center; gap: var(--space-2); }
.site-header__cta { min-height: 2.75rem; padding: .78rem .85rem; font-size: .65rem; white-space: nowrap; }
.site-header__toggle { display: none; width: 2.75rem; height: 2.75rem; padding: .65rem; border: var(--border-structural); border-radius: var(--radius-architectural); background: var(--color-limestone-100); }
.site-header__toggle-line { display: block; width: 100%; height: 2px; margin: 3px 0; background: var(--color-charcoal); transition: transform var(--transition-fast), opacity var(--transition-fast); }
.site-header__marker-line { display: flex; min-height: 1.8rem; align-items: center; gap: var(--space-3); padding: .28rem var(--space-4); border-top: var(--border-subtle); overflow: hidden; }
.site-header__marker-label, .site-header__marker-keyword { font-size: .62rem; font-weight: var(--weight-semibold); letter-spacing: var(--tracking-label); line-height: 1; text-transform: uppercase; white-space: nowrap; }
.site-header__marker-label { color: var(--color-slate-muted); }
.site-header__marker-keyword { color: var(--color-lagoon-blue); transition: opacity 500ms ease, transform 500ms ease; }
.site-header__marker-keyword.is-changing { opacity: 0; transform: translateY(5px); }
@media (max-width: 1080px) { .site-header__nav-link { padding-inline: .35rem; font-size: .61rem; } .site-header__brand { flex-basis: 10.8rem; } }
@media (max-width: 899px) { .site-header { padding-top: var(--space-2); } .site-header__row { min-height: 4rem; padding: var(--space-2) var(--space-3); } .site-header__brand { flex-basis: auto; } .site-header__logo { width: 2.375rem; height: 2.375rem; flex-basis: 2.375rem; } .site-header__brand-name { font-size: .76rem; } .site-header__cta { padding-inline: .7rem; } .site-header__toggle { display: block; } .site-header__nav { position: absolute; top: calc(100% + .5rem); right: var(--gutter); left: var(--gutter); display: none; max-height: min(70vh, 34rem); overflow-y: auto; border: var(--border-subtle); border-radius: var(--radius-card); background: var(--color-limestone-100); box-shadow: var(--shadow-floating); } .site-header__nav.is-open { display: block; } .site-header__nav-list { display: grid; justify-content: stretch; gap: 0; padding: var(--space-2); } .site-header__nav-link { min-height: 3rem; justify-content: space-between; padding: var(--space-3); border-bottom: var(--border-structural); font-size: var(--font-size-label); } .site-header__nav-list li:last-child .site-header__nav-link { border-bottom: 0; } .site-header__nav-link--mobile { display: inline-flex; } }
@media (max-width: 480px) { .site-header__brand-subtitle { display: none; } .site-header__brand-name { font-size: .72rem; } .site-header__cta { padding-inline: .58rem; font-size: .58rem; } .site-header__marker-line { padding-inline: var(--space-3); } }
@media (prefers-reduced-motion: reduce) { .site-header__marker-keyword, .site-header__nav-link, .site-header__toggle-line { transition: none; } }