*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{font-family:'Barlow',system-ui,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
a:hover{color:oklch(0.68 0.17 52)}
.disp{font-family:'Barlow Condensed',sans-serif}

/* ---------- header / nav ---------- */
.site-header{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:16px clamp(20px,5vw,72px);background:rgba(11,31,56,.97);backdrop-filter:blur(6px);border-bottom:1px solid rgba(255,255,255,.08)}
.hero-header{position:relative;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:flex;align-items:center;gap:2px}
.brand img {height:24px;width:auto;display:block}
.brand-mark{font-size:28px;font-weight:700;letter-spacing:.04em;color:#fff}
.brand-rule{width:1px;height:18px;background:rgba(255,255,255,.28)}
.brand-sub{font-size:6px;font-weight:600;letter-spacing:.32em;color:oklch(0.74 0.16 54);text-transform:uppercase;padding-top:10px}
.nav{display:flex;gap:clamp(14px,1.8vw,32px);font-size:15px;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.nav a{color:rgba(234,241,249,.62)}
.nav a:hover{color:oklch(0.8 0.14 56)}
.nav a.active{color:#fff;border-bottom:2px solid oklch(0.72 0.17 52);padding-bottom:2px}
.nav-toggle{display:none;width:48px;height:48px;margin-right:-10px;flex-direction:column;align-items:center;justify-content:center;gap:6px;background:none;border:0;cursor:pointer}
.nav-toggle span{display:block;width:26px;height:2px;background:#fff;transition:transform .25s ease,opacity .2s ease}
.open .nav-toggle span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.open .nav-toggle span:nth-child(2){opacity:0}
.open .nav-toggle span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}

@media (max-width:860px){
  .nav-toggle{display:flex}
  .nav{position:absolute;top:100%;left:0;right:0;flex-direction:column;gap:0;background:#0b1f38;border-bottom:1px solid rgba(255,255,255,.1);max-height:0;overflow:hidden;transition:max-height .3s ease;z-index:60}
  .nav{background:#0b1f38 !important;box-shadow:0 18px 30px -16px rgba(0,0,0,.6)}
  .open .nav{max-height:60vh}
  .nav a{display:flex;align-items:center;min-height:52px;padding:0 clamp(20px,5vw,72px);border-top:1px solid rgba(255,255,255,.07);font-size:17px;color:#eaf1f9}
  .nav a.active{border-bottom:0;color:oklch(0.8 0.14 56)}
}

/* ---------- responsive layout overrides ---------- */
@media (max-width:1100px){
  .hero{grid-template-columns:1fr !important;min-height:auto !important}
  .hero-media{min-height:min(60vw,340px) !important}
  .hero-copy{padding:clamp(36px,7vh,72px) 0 !important}
}
@media (max-width:860px){
  .m-stack{grid-template-columns:1fr !important}
  .svc-media{min-height:min(58vw,260px) !important}
  .gal-wide{grid-column:span 1 !important}
  .m-col{flex-direction:column !important;align-items:flex-start !important}
}
@media (max-width:520px){
  .site-footer-row{align-items:flex-start !important}
}