/* header: floating "split island" - centered logo, Home/About left, Contact right */
.site-header{position:relative;z-index:10;padding:16px 0 0;background:transparent}
.site-header .container{position:relative;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:18px;max-width:900px;min-height:0;padding:12px 14px 12px 20px;border:1px solid rgba(255,255,255,.35);border-radius:999px;background:rgba(255,255,255,.94);box-shadow:0 16px 35px rgba(24,36,55,.33);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.site-header .logo{grid-column:2;grid-row:1;justify-self:center;padding:0 12px;line-height:0}
.site-header .logo img{width:100px;height:auto}
.site-header nav{display:contents}
.site-header .nav-side{grid-column:1;grid-row:1;display:flex;align-items:center;gap:5px}
.site-header nav a{padding:11px 16px;border-radius:999px;text-decoration:none;font-weight:700;font-size:.88rem;line-height:1.6;color:var(--dark);transition:.2s}
.site-header nav a:hover,.site-header nav a:focus-visible{background:var(--yellow);color:var(--dark)}
.site-header nav a[aria-current]{background:var(--yellow);color:var(--dark)}
.site-header nav a.btn-contact{grid-column:3;grid-row:1;justify-self:end;color:var(--dark)}
.site-header nav a.btn-contact:hover,.site-header nav a.btn-contact:focus-visible,.site-header nav a.btn-contact[aria-current]{background:linear-gradient(115deg,#22a2ff,#1e6cff);color:#fff}
.menu-toggle{display:none;background:transparent;border:0;-webkit-tap-highlight-color:transparent;border-radius:9px;padding:8px 11px;cursor:pointer;color:var(--dark)}
@media(max-width:921px){
 .site-header .container{display:flex;padding:10px 14px;margin:0 16px;max-width:none}
 .site-header .logo{padding:0 6px}
 .site-header nav{display:flex;visibility:hidden;pointer-events:none;position:absolute;z-index:-1;left:auto;right:0;width:150px;top:calc(100% + 14px);flex-direction:column;align-items:stretch;gap:8px;padding:0;background:transparent;clip-path:inset(0 -40px -60px -40px);transition:visibility 0s .6s}
 .site-header.open nav{visibility:visible;pointer-events:auto;z-index:4;transition:visibility 0s}
 .site-header nav a{opacity:0;padding:9px 16px;transform:translateY(calc(-1 * (var(--i,0) * 60px + 80px)));background:#fff;box-shadow:0 8px 20px rgba(21,34,56,.28);text-align:center;transition:opacity .2s,transform .3s,background .2s,color .2s}
 .site-header.open nav a{opacity:1;transform:none;transition:opacity .01s linear,transform .5s cubic-bezier(.25,.8,.4,1.05),background .2s,color .2s}
 .site-header .nav-side a:nth-child(1){--i:0}
 .site-header .nav-side a:nth-child(2){--i:1}
 .site-header nav>a.btn-contact{--i:2}
 .site-header nav a:hover,.site-header nav a:focus-visible,.site-header nav a[aria-current]{background:var(--yellow)}
 .site-header nav a.btn-contact:hover,.site-header nav a.btn-contact:focus-visible,.site-header nav a.btn-contact[aria-current]{background:linear-gradient(115deg,#22a2ff,#1e6cff)}
 .site-header .nav-side{display:contents}
 .menu-toggle{display:block;margin-left:auto}
}
@media(min-width:922px){.site-header .container{margin:0 auto}}

/* home page: island floats over the full-screen hero */
.home .site-header,.has-hero .site-header{position:absolute;top:0;left:0;right:0}

/* sliding highlight (JS adds .has-pill and the .nav-pill span on desktop) */
.site-header .nav-side{position:relative}
.site-header .nav-side a{position:relative;z-index:1}
.nav-pill{position:absolute;top:0;bottom:0;left:0;width:0;border-radius:999px;background:var(--yellow);opacity:0;pointer-events:none;z-index:0;transition:transform .4s cubic-bezier(.3,1.35,.5,1),width .4s cubic-bezier(.3,1.35,.5,1),background-color .25s,opacity .2s}
.nav-pill.on{opacity:1}
.site-header .nav-side.has-pill a:hover,.site-header .nav-side.has-pill a:focus-visible,.site-header .nav-side.has-pill a[aria-current]{background:transparent}
@media(prefers-reduced-motion:reduce){.nav-pill{transition:none}}
