/* Shared top navigation — locked 2026-09-19.
   One geometry, one typography system, one CTA treatment on every page. */
.site .topbar{
  display:flex !important;
  align-items:center !important;
  gap:28px !important;
}
.site .brand{
  width:360px !important;
  min-width:360px !important;
  display:flex !important;
  align-items:center !important;
}
.site .brand-crop{
  width:360px !important;
  height:92px !important;
}
.site .brand-logo{
  display:block !important;
  width:300px !important;
  max-width:100% !important;
  height:auto !important;
}

.site .nav{
  margin-left:auto !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:24px !important;
  color:#4a176f !important;
  font-size:15px !important;
  font-weight:700 !important;
  text-transform:uppercase !important;
  letter-spacing:.045em !important;
  line-height:1.1 !important;
  text-shadow:0 1px 0 rgba(255,255,255,.42) !important;
}
.site .nav a{
  color:inherit !important;
  text-decoration:none !important;
  padding:10px 0 8px !important;
  border-bottom:2px solid transparent !important;
  white-space:nowrap !important;
}
.site .nav a:hover,
.site .nav a:focus-visible,
.site .nav a.active{
  border-bottom-color:#f1b52a !important;
}
.site .nav .cta{
  padding:14px 24px !important;
  border:0 !important;
  border-radius:999px !important;
  background:#4a176f !important;
  color:#fff !important;
  box-shadow:0 8px 18px rgba(74,23,111,.20) !important;
}
.site .nav .cta:hover{background:#5c2282 !important}

@media (min-width:901px){
  .site:not(.home-site) .sunset-shell{position:relative !important}

  .home-site > .topbar,
  .site:not(.home-site) .sunset-shell > .topbar{
    position:absolute !important;
    top:0 !important;
    left:0 !important;
    right:0 !important;
    width:100% !important;
    max-width:none !important;
    z-index:40 !important;
    padding:18px 42px 12px !important;
    background:linear-gradient(
      180deg,
      rgba(255,247,240,.72) 0%,
      rgba(255,247,240,.34) 62%,
      rgba(255,247,240,0) 100%
    ) !important;
    background-image:linear-gradient(
      180deg,
      rgba(255,247,240,.72) 0%,
      rgba(255,247,240,.34) 62%,
      rgba(255,247,240,0) 100%
    ) !important;
    box-shadow:none !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
  }

  .site:not(.home-site) .sunset-shell > main{
    position:relative !important;
    z-index:1 !important;
  }
  .site:not(.home-site) .sunset-shell > main > .hero{
    padding-top:132px !important;
  }
}

@media (max-width:900px){
  .site .topbar{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:12px 14px 10px !important;
    flex-direction:column !important;
    justify-content:center !important;
    gap:6px !important;
    background:linear-gradient(180deg,#f4c6c4 0%,#f8d3c9 58%,#f9d9cf 100%) !important;
  }
  .site .brand{
    width:min(320px,94vw) !important;
    min-width:0 !important;
    margin:0 auto !important;
    justify-content:center !important;
  }
  .site .brand-crop{
    width:min(320px,94vw) !important;
    height:82px !important;
  }
  .site .brand-logo{
    width:min(300px,88vw) !important;
    margin:0 auto !important;
  }
  .site .nav{
    width:100% !important;
    margin:0 !important;
    justify-content:center !important;
    gap:8px 14px !important;
    flex-wrap:wrap !important;
    font-size:12.5px !important;
    letter-spacing:.035em !important;
  }
  .site .nav a{padding:8px 0 6px !important}
  .site .nav .cta{padding:11px 16px !important}
}
