ctions, p + .hero-actions,
.value-chips + .btn, .value-chips + .btns,
.impact-list + .btn, .impact-list + .btns { margin-top: 26px; }
/* ---------- Header / Nav ---------- */
.site-header {
position: fixed; top: 0; left: 0; right: 0; z-index: 100;
transition: padding .3s var(--ease), background .3s var(--ease), box-shadow .3s var(--ease);
padding: 16px 0;
}
.site-header.scrolled {
background: rgba(255,255,255,.93);
backdrop-filter: blur(18px) saturate(1.2);
-webkit-backdrop-filter: blur(18px) saturate(1.2);
box-shadow: 0 10px 30px -18px rgba(33,42,107,.4);
padding: 10px 0;
border-bottom: 1px solid rgba(255,255,255,.6);
}
.nav { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.brand { display: flex; align-items: center; gap: 12px; }
.brand img { height: 46px; width: auto; transition: height .3s var(--ease); }
.site-header.scrolled .brand img { height: 40px; }
/* Logo swaps by state: white over the hero, colour once scrolled */
.brand
===SPLIT===
ct li { display: flex; gap: 12px; font-size: .95rem; margin-bottom: 14px; align-items: flex-start; }
.foot-contact svg { width: 18px; height: 18px; flex: none; margin-top: 3px; color: var(--sky); }
.footer-bottom { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding-top: 26px; flex-wrap: wrap; font-size: .86rem; }
.footer-bottom .credit-link { color: rgba(255,255,255,.9); text-decoration: underline; text-underline-offset: 2px; }
.footer-bottom .credit-link:hover { color: #fff; }
.foot-legal { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.foot-legal a { font-size: .86rem; color: rgba(255,255,255,.72); }
.foot-legal a:hover { color: #fff;
Written by
MukhtarAashury