/* The one masthead, shared by every page.

   The door builder shipped with its own bar - logo badge, centred links, white CALL
   button - which is the main reason the doors page read as a separate tool. These
   rules restyle that strip to be identical to the landing page's nav. Everything
   below the header keeps the builder's own styling. */

.site-header{
  position:sticky;top:0;z-index:90;
  display:flex !important;align-items:center;justify-content:space-between;
  height:auto;margin:0;padding:14px 4vw;
  background:rgba(15,14,12,.9);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(244,241,236,.14);
  box-shadow:none;
}
.site-header::before,.site-header::after{display:none !important}

.site-header .brand{
  font-family:'Fraunces',Georgia,serif;font-weight:400;
  font-size:1.05rem;letter-spacing:.12em;text-transform:none;
  color:#efeae2;display:inline-flex;align-items:center;gap:0;
}
.site-header .brand img{display:none !important}

.site-header .nav-right{display:flex;align-items:center;gap:26px}
.site-header .nav-link{
  font-family:'Inter',system-ui,sans-serif;
  font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;
  color:#efeae2;opacity:.85;padding:0;border:0;background:none;
}
.site-header .nav-link:hover{opacity:1;color:#efeae2}
.site-header .nav-link::after{display:none !important}
.site-header .nav-link[aria-current="page"]{color:#c8955c;opacity:1}

.site-header .header-cta{
  font-family:'Inter',system-ui,sans-serif;
  font-size:.78rem;font-weight:600;letter-spacing:.14em;
  border:1px solid rgba(255,255,255,.5);border-radius:99px;
  padding:9px 20px;background:none;color:#efeae2;box-shadow:none;
}
.site-header .header-cta:hover{background:#efeae2;color:#0f0e0c}

/* The builder's own stylesheet makes this bar sticky, which is right: it stays at the
   top without needing the page padded underneath it. Forcing it to fixed and padding
   the body just exposed the body background above the bar. */

@media(max-width:860px){
  .site-header{padding:12px 5vw}
}

/* The home and booking pages swap their inline links for the Menu button at
   1180px. This bar was doing it at 860, so between those widths the doors page
   showed BOTH - the links wrapping onto a second row next to a Menu button -
   and looked like a different site. Same breakpoint, same behaviour. */
@media(max-width:1180px){
  .site-header .nav-link{display:none}
}