/* Roamly header v2: a calm, editorial desktop navigation with viewport-safe menus. */
.site-header{
  background:rgba(251,250,247,.86);
  border-bottom:1px solid rgba(176,204,204,.45);
  box-shadow:0 10px 30px rgba(8,47,73,.06);
  backdrop-filter:blur(18px) saturate(1.15);
}
.site-header .brand{font-size:1.42rem;color:#082f49}
.site-header .brand-mark{width:36px;height:36px;border-radius:12px;background:linear-gradient(145deg,#0f766e,#082f49);box-shadow:0 8px 18px rgba(8,47,73,.18)}
.site-header .site-nav{
  margin-left:0!important;
  width:100%;
  align-self:center;
  padding:.28rem;
  border:1px solid rgba(180,207,207,.52);
  border-radius:16px;
  background:rgba(255,255,255,.55);
  box-shadow:inset 0 1px rgba(255,255,255,.9);
}
.site-header .nav-direct,.site-header .nav-trigger,.site-header .nav-account{
  min-height:42px;
  border-radius:11px;
  transition:background .18s ease,color .18s ease,box-shadow .18s ease,transform .18s ease;
}
.site-header .nav-direct,.site-header .nav-trigger{color:#3c5e6b;font-weight:780}
.site-header .nav-direct:hover,.site-header .nav-trigger:hover,.site-header .nav-group.is-current>.nav-trigger{color:#087f78;background:#e8f7f4}
.site-header .nav-trigger[aria-expanded=true]{color:#087f78;background:#dff4ef;box-shadow:inset 0 0 0 1px rgba(15,118,110,.1)}
.site-header .nav-account{background:#082f49;color:#fff;box-shadow:0 8px 18px rgba(8,47,73,.16)}
.site-header .nav-account:hover{background:#0f766e;color:#fff;transform:translateY(-1px)}
.site-header .icon-btn{border-radius:12px;color:#16485c;background:rgba(255,255,255,.65);border:1px solid rgba(180,207,207,.56);font-size:1.2rem;transition:.18s ease}
.site-header .icon-btn:hover{background:#e8f7f4;color:#087f78;transform:translateY(-1px)}

/* Fixed positioning keeps menus above every page section and inside the viewport. */
@media(min-width:901px){
  .site-header .nav-menu{
    position:absolute!important;
    top:calc(100% + .65rem)!important;
    left:0!important;
    width:min(440px,calc(100vw - 32px))!important;
    max-height:min(580px,calc(100vh - 104px));
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:.32rem;
    padding:.7rem;
    border:1px solid rgba(160,196,195,.5);
    border-radius:20px;
    background:rgba(255,255,255,.97);
    box-shadow:0 24px 70px rgba(8,47,73,.2),0 2px 0 rgba(255,255,255,.9) inset;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(-7px) scale(.985)!important;
    transform-origin:top center;
    transition:opacity .16s ease,visibility .16s ease,transform .16s ease;
  }
  /* JS upgrades this to viewport-safe positioning when available. The
     absolute fallback keeps an older/stale tab anchored to its trigger. */
  .site-header[data-menu-positioned="1"] .nav-menu{
    position:absolute!important;
    top:calc(100% + .65rem)!important;
    left:0!important;
    right:auto!important;
  }
  /* Open menus are click-controlled. Hover alone must not open a panel that
     disappears while the pointer travels from the trigger to the panel. */
  .site-header .nav-group:hover .nav-menu:not(.is-open){
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transform:translateY(-7px) scale(.985)!important;
  }
  .site-header .nav-menu.is-open{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:translateY(0) scale(1)!important;
  }
  .site-header .nav-group:last-of-type .nav-menu,
  .site-header[data-menu-positioned="1"] .nav-group:last-of-type .nav-menu{
    left:auto!important;
    right:0!important;
  }
  .site-header .nav-menu.is-open,.site-header .nav-group:hover .nav-menu,.site-header .nav-group:focus-within .nav-menu{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translateY(0) scale(1)!important;
  }
  .site-header .nav-menu-label{
    grid-column:1/-1;
    padding:.35rem .65rem .55rem;
    color:#6b8791;
    font-size:.68rem;
    font-weight:900;
    letter-spacing:.13em;
    text-transform:uppercase;
  }
  .site-header .nav-menu a{
    position:relative;
    display:grid;
    grid-template-columns:30px minmax(0,1fr);
    align-items:start;
    min-width:0;
    min-height:66px;
    padding:.72rem .65rem;
    border:1px solid transparent;
    border-radius:14px;
    color:#173f54;
    text-decoration:none;
  }
  .site-header .nav-menu a:hover,.site-header .nav-menu a:focus-visible{background:#eef9f7;border-color:#cce9e4;outline:none}
  .site-header .nav-menu a span:not(.nav-item-icon){grid-column:2;display:block;color:#173f54;font-size:.88rem;font-weight:820;line-height:1.2}
  .site-header .nav-menu a small{grid-column:2;display:block;margin-top:.23rem;color:#718891;font-size:.72rem;line-height:1.35}
  .site-header .nav-menu a:after{content:'↗';position:absolute;right:.55rem;top:.65rem;color:#87a29f;font-size:.75rem;opacity:0;transition:opacity .15s ease,transform .15s ease}
  .site-header .nav-menu a:hover:after,.site-header .nav-menu a:focus-visible:after{opacity:1;transform:translate(1px,-1px)}
  .site-header .nav-item-icon{grid-column:1;grid-row:1 / span 2;display:grid!important;place-items:center;width:26px;height:26px;border-radius:9px;background:#e4f6f2;color:#0f766e;font-size:.85rem;font-weight:900}
  .site-header .nav-menu a:nth-of-type(3):last-child{grid-column:1/-1}
}

@media(min-width:901px) and (max-width:1220px){
  .site-header .site-nav{padding:.2rem}
  .site-header .nav-direct,.site-header .nav-trigger,.site-header .nav-account{font-size:.76rem;padding-inline:.45rem}
  .site-header .nav-account{padding-inline:.7rem}
}

@media(max-width:900px){
  .site-header .site-nav{
    margin-left:0!important;
    width:auto;
    padding:.6rem;
    border:1px solid rgba(160,196,195,.5);
    border-radius:18px;
    background:rgba(255,255,255,.98);
    box-shadow:0 18px 45px rgba(8,47,73,.18);
  }
  .site-header .nav-menu{
    position:static!important;
    width:auto!important;
    max-height:none;
    display:none!important;
    grid-template-columns:1fr;
    transform:none!important;
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    padding:.35rem;
    box-shadow:none;
    border:0;
    background:#f3faf8;
  }
  .site-header .nav-menu.is-open{display:grid!important}
  .site-header .nav-menu-label{grid-column:1/-1}
  .site-header .nav-menu a{display:grid;grid-template-columns:28px minmax(0,1fr);min-width:0;padding:.65rem;border-radius:12px}
  .site-header .nav-item-icon{grid-column:1;grid-row:1 / span 2;display:grid;place-items:center}
  .site-header .nav-menu a span:not(.nav-item-icon),.site-header .nav-menu a small{grid-column:2}
}

@media(prefers-reduced-motion:reduce){.site-header .nav-direct,.site-header .nav-trigger,.site-header .nav-account,.site-header .icon-btn,.site-header .nav-menu{transition:none}}
