/* Clear, comfortably sized navigation without changing page content. */
body,
body.expanded-navigation{background:#080c0e}
.wrap>main,.wrap>footer{animation:page-content-enter .4s ease-out both}
body.page-leaving .wrap>main,body.page-leaving .wrap>footer{animation:none;opacity:0;transform:translateY(3px);transition:opacity .26s ease,transform .26s ease;pointer-events:none}
@keyframes page-content-enter{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:none}}
.wrap>header,
.expanded-navigation .wrap>header{
  position:relative;isolation:isolate;height:auto;min-height:92px;
  padding:8px 0;display:flex;flex-direction:row;align-items:center;
  justify-content:space-between;gap:24px;
}
.wrap>header::before{
  content:"";position:absolute;z-index:-1;top:0;bottom:-28px;
  left:50%;width:100vw;transform:translateX(-50%);
  background:linear-gradient(to bottom,#fff 0,#fff calc(100% - 28px),#aebdbf calc(100% - 18px),#080c0e 100%);
  pointer-events:none;
}
.wrap>header>a{flex:0 1 300px;min-width:200px}
.wrap>header .logo{width:300px;max-width:100%;height:auto}
.wrap>header>nav,
.expanded-navigation .wrap>header>nav{
  display:flex;flex-wrap:nowrap;width:auto;align-items:center;
  justify-content:flex-end;gap:8px;font-size:16px;line-height:1.25;
}
.wrap>header>nav>a,
.wrap>header>nav>a:last-child{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:44px;padding:9px 13px;border:1px solid #a4c4c7;
  border-radius:6px;background:#f0f7f7;color:#164950;
  font-weight:600;text-align:center;white-space:nowrap;
  transition:background .16s,color .16s,border-color .16s;
}
.wrap>header>nav>a:last-child{background:#087782;border-color:#087782;color:#fff}
.wrap>header>nav>a[aria-current]{background:#163e45;border-color:#163e45;color:#fff}
.wrap>header>nav>a:hover{background:#d3eded;border-color:#087782;color:#103c43}
.wrap>header>nav>a:last-child:hover,
.wrap>header>nav>a[aria-current]:hover{background:#0d535d;color:#fff}
.wrap>header>nav>a:focus-visible{outline:3px solid #087782;outline-offset:3px}
@media(max-width:1050px){
  .wrap>header,.expanded-navigation .wrap>header{flex-direction:column;gap:4px;padding:5px 0 9px}
  .wrap>header>a{flex:none;min-width:0}
  .wrap>header .logo{width:250px}
  .wrap>header>nav,.expanded-navigation .wrap>header>nav{width:100%;justify-content:center;flex-wrap:wrap}
}
@media(max-width:700px){
  .wrap>header,.expanded-navigation .wrap>header{gap:2px;min-height:0;padding:3px 0 7px}
  .wrap>header::before{bottom:-22px;background:linear-gradient(to bottom,#fff 0,#fff calc(100% - 22px),#aebdbf calc(100% - 14px),#080c0e 100%)}
  .wrap>header .logo{width:220px}
  .wrap>header>nav,.expanded-navigation .wrap>header>nav{
    width:calc(100vw - 6px);gap:1px;font-size:12px;
    justify-content:center;flex-wrap:nowrap;letter-spacing:0
  }
  .wrap>header>nav>a,.wrap>header>nav>a:last-child{
    flex:0 1 auto;min-height:44px;padding:6px 2px;border-radius:4px
  }
  .wrap>header>nav>a[href="/"]{
    flex:0 0 32px;width:32px;padding:0;font-size:0;overflow:hidden
  }
  .wrap>header>nav>a[href="/"]::before{
    content:"";display:block;width:18px;height:18px;background:currentColor;
    -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11.5 12 4l9 7.5'/%3E%3Cpath d='M5.5 10v10h13V10M9.5 20v-6h5v6'/%3E%3C/svg%3E") center/contain no-repeat;
    mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11.5 12 4l9 7.5'/%3E%3Cpath d='M5.5 10v10h13V10M9.5 20v-6h5v6'/%3E%3C/svg%3E") center/contain no-repeat
  }
}
@media(min-width:350px) and (max-width:700px){
  .wrap>header>nav,.expanded-navigation .wrap>header>nav{font-size:13px}
  .wrap>header>nav>a:not([href="/"]){flex-grow:1;padding-left:6px;padding-right:6px}
}
@media(prefers-reduced-motion:reduce){
  .wrap>main,.wrap>footer{animation:none}
  body.page-leaving .wrap>main,body.page-leaving .wrap>footer{opacity:1;transform:none;transition:none}
  .wrap>header>nav>a{transition:none}
}
/* Keep the existing full-width trades image inside tablet viewports. */
@media(min-width:701px) and (max-width:1224px){
  .trade-cinematic{margin-left:-32px;margin-right:-32px;padding-left:32px;padding-right:32px}
}

/* Use the homepage's gradual reveal beneath the shared masthead on every visual landing section. */
.concierge-opening::before,
.trade-cinematic,
.insights-intro::before{mask-image:linear-gradient(to bottom,transparent,#000 100px)}