.site-header { position: fixed; z-index: 10; top: 0; right: 0; left: 0; box-sizing: border-box; display: flex; align-items: center; justify-content: space-between; height: 94px; padding: 0 clamp(1rem, 8vw, 7rem); background: transparent; transition: background-color 180ms ease, box-shadow 180ms ease; }
.site-header--solid { background: rgba(251, 248, 241, .96); box-shadow: 0 8px 28px rgba(6, 40, 79, .14); backdrop-filter: blur(12px); }
.site-header__brand { display: grid; align-items: center; }
.site-header__logo { grid-area: 1 / 1; width: 90px; height: auto; transition: opacity 180ms ease; }
.site-header__logo--color, .site-header--solid .site-header__logo--light { opacity: 0; }
.site-header--solid .site-header__logo--color { opacity: 1; }
.site-header__cta { border: 1px solid var(--orange); border-radius: 999px; padding: .72rem 1rem; background: var(--orange); color: var(--white); font-size: .75rem; font-weight: 700; text-decoration: none; }
@media (min-width: 769px) { .site-header__cta { padding-inline: 1.4rem; font-size: .86rem; } }