@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700;800&display=swap');

:root{
  --brand-blue:#223280;
  --text-on-brand:#ffffff;
  --border:#eef1f5;
  --ink:#222222;
  --ink-subtle:#7a8896;
  --shadow:0 8px 24px rgba(0,0,0,.12);
  --ring:0 0 0 .14rem rgba(34,50,128,.35);
}

.topbar{
  background:linear-gradient(0deg, rgba(0,0,0,.05), rgba(0,0,0,.05)) , var(--brand-blue);
  color:var(--text-on-brand);
  box-shadow:inset 0 -1px rgba(255,255,255,.08);
  position:relative;
  z-index:1200;
  isolation:isolate;
}

.topbar, .topbar *{
  font-family:'Montserrat', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif !important;
  font-size:16px !important;
  line-height:1 !important;
  font-weight:400 !important;
  letter-spacing:0 !important;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

.topbar :where(.fa, .fa-solid, .fa-regular, .fa-brands){
  font-family:"Font Awesome 6 Free" !important;
  font-weight:900 !important;
}
.topbar :where(.fa-regular){ font-weight:400 !important; }
.topbar :where(.fa-brands){ font-family:"Font Awesome 6 Brands" !important; font-weight:400 !important; }

.topbar__inner{
  min-height:36px;
  padding:6px max(10px, env(safe-area-inset-left,0));
  padding-right:max(10px, env(safe-area-inset-right,0));
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:8px;
}

.topbar__center{
  grid-column:2;
  text-align:center;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.topbar__right{
  grid-column:3;
  justify-self:end;
}

.topbar__lang{
  display:inline-flex;
  align-items:center;
  gap:8px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.15);
  border-radius:8px;
  color:var(--text-on-brand) !important;
  cursor:pointer;
  padding:4px 10px !important;
  font-weight:800 !important;
  line-height:1 !important;
  transition:background .2s ease,border-color .2s ease, transform .15s ease;
  will-change:transform;
}
.topbar__lang:hover{ background:rgba(255,255,255,.12); }
.topbar__lang:active{ transform:translateY(1px); }
.topbar__lang:focus-visible{ outline:none; box-shadow:var(--ring); }

.topbar__lang i{
  font-size:12px !important;
  line-height:1 !important;
  transition:transform .2s ease;
}
.topbar__lang[aria-expanded="true"] i{ transform:rotate(180deg); }

.topbar__lang.dropdown-toggle::after{ display:none; }

.topbar .dropdown-menu{
  width:100%;
  min-width:auto;
  padding:6px 0;
  border:1px solid rgba(0,0,0,.08);
  border-radius:.5rem;
  box-shadow:var(--shadow);
  z-index:2000;
  opacity:0;
  transform:translateY(-4px);
  transition:opacity .15s ease, transform .15s ease;
}
.topbar .dropdown-menu.show{
  opacity:1;
  transform:translateY(0);
}
.topbar .dropdown-item{
  font-weight:700 !important;
  padding:.45rem .95rem;
  display:flex; align-items:center; gap:.5rem;
}
.topbar .dropdown-item:hover,
.topbar .dropdown-item:focus{
  background:rgba(34,50,128,.08);
  color:#111 !important;
}

@media (max-width:600px){
  .topbar__inner{ min-height:32px; padding:4px 8px; }
  .topbar__center{ font-size:13px !important; }
}

.navbar-main{
  background:#fff;
  border-bottom:1px solid var(--border);
  padding-block:1rem;
  position:sticky;
  top:0;
  z-index:1020;
  font-family:'Montserrat', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  transition:box-shadow .2s ease, border-color .2s ease;
}
.navbar-main.is-scrolled{
  box-shadow:0 6px 14px rgba(0,0,0,.06);
  border-color:transparent;
}

.navbar-main .brand-text{
  font-weight:700;
  color:var(--ink-subtle);
  letter-spacing:.2px;
  white-space:nowrap;
}


.navbar-main .nav-link{
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.18em;
  color:var(--ink);
  padding:9px 20px;
  position:relative;
}
.navbar-main .nav-link:hover,
.navbar-main .nav-link:focus{ color:var(--brand-blue); }
.navbar-main .nav-link:focus-visible{ outline:none; box-shadow:var(--ring); border-radius:6px; }

@media (min-width:992px){
  .navbar-main .navbar-nav{ gap:2.25rem; }
  .navbar-main .nav-link::after{
    content:""; position:absolute; left:20px; right:20px; bottom:6px;
    height:2px; background:var(--brand-blue);
    transform:scaleX(0); transform-origin:left; transition:transform .18s ease;
  }
  .navbar-main .nav-link:hover::after{ transform:scaleX(1); }
}

.btn-cta{
  background:var(--brand-blue); color:#fff; border:0;
  border-radius:10px;
  padding:.65rem 1.05rem;
  font-weight:400;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-size:12px; line-height:1;
  transition:filter .2s ease, transform .15s ease;
}
.btn-cta:hover{ filter:brightness(.96); color:#fff; }
.btn-cta:active{ transform:translateY(1px); }
.btn-cta:focus-visible{ outline:none; box-shadow:var(--ring); }

.navbar-toggler{ border-color:#cfd6df; }
.navbar-toggler:focus{ box-shadow:0 0 0 .15rem rgba(34,50,128,.2); }
.navbar-toggler-icon{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath stroke='rgba(30,41,59,0.85)' stroke-width='2' stroke-linecap='round' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}

@media (max-width:991.98px){
  .navbar-main .nav-link{ padding:9px 14px; }
  .btn-cta{ width:100%; margin-top:.25rem; }
}

@media (prefers-reduced-motion:reduce){
  *{ transition:none !important; animation:none !important; }
}