/* =========================================================
   Midas – Header (original Midas header, rebuilt for the new site)
   ========================================================= */
:root {
  --mx-blue: #1065B7;
  --mx-blue-dark: #0B4C8C;
  --mx-yellow: #FFD016;
  --mx-ink: #1B1B1F;
  --mx-muted: #6B7280;
  --mx-line: #E6EAF0;
  --mx-bar-bg: #F4F6F9;
  --mx-header-h: 92px;
}

.mx-wrap { width: 100%; max-width: 1480px; margin: 0 auto; padding: 0 24px; }

/* ---------- Top bar ---------- */
.mx-topbar { background: var(--mx-bar-bg); font-family: var(--mh-font); font-size: 15px; position: relative; z-index: 1050; }
.mx-topbar__inner { display: flex; justify-content: space-between; align-items: stretch; min-height: 38px; }
.mx-topbar ul { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; }
.mx-topbar__left {
  position: relative; background: var(--mx-blue); color: #fff; gap: 0;
  padding-right: 48px; margin-left: -24px; padding-left: 24px;
  clip-path: polygon(0 0, 100% 0, calc(100% - 22px) 100%, 0 100%);
}
.mx-topbar__left::before { /* extend blue to the left edge on wide screens */
  content: ""; position: absolute; right: 100%; top: 0; bottom: 0; width: 100vw; background: var(--mx-blue);
}
.mx-topbar__left li { display: flex; align-items: center; gap: 8px; padding: 0 18px 0 0; }
.mx-topbar__left li + li { padding-left: 18px; border-left: 1px solid rgba(255,255,255,.75); line-height: 1; }
.mx-topbar__left i { font-size: 13px; opacity: .95; }
.mx-topbar__right { gap: 18px; }
.mx-topbar__right a { color: #4B5563; transition: color .2s; display: inline-flex; align-items: center; gap: 8px; font-size: 14px; }
.mx-topbar__right a:hover { color: var(--mx-blue); }

/* ---------- Main header ---------- */
.mx-header {
  position: sticky; top: 0; z-index: 1055; background: #fff;
  border-bottom: 1px solid var(--mx-line);
  transition: box-shadow .25s ease;
  font-family: var(--mh-font);
}
.mx-header.is-stuck { box-shadow: 0 8px 24px rgba(1, 20, 44, .08); }
.mx-header__inner { display: flex; align-items: center; gap: 24px; min-height: var(--mx-header-h); }
.mx-brand { flex: 0 0 auto; display: block; }
.mx-brand img { width: 260px; height: auto; display: block; }

.mx-nav { flex: 1 1 auto; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.mx-menu { list-style: none; margin: 0 auto; padding: 0; display: flex; align-items: center; gap: 6px; }
.mx-menu > li { position: relative; }
.mx-link {
  display: inline-flex; align-items: center; gap: 6px; padding: 32px 14px;
  font-size: 17px; font-weight: 500; color: var(--mx-ink); line-height: 1;
  transition: color .2s;
}
.mx-link i { font-size: 11px; transition: transform .2s; }
.mx-link:hover, .mx-link.is-active { color: var(--mx-blue); }
.mx-drop-toggle { display: none; }

/* Dropdowns */
.mx-drop {
  list-style: none; margin: 0; padding: 10px 0; position: absolute; top: 100%; left: 0; min-width: 240px;
  background: #fff; border-top: 3px solid var(--mx-blue); border-radius: 0 0 10px 10px;
  box-shadow: 0 18px 40px rgba(1, 20, 44, .14);
  opacity: 0; visibility: hidden; transform: translateY(10px); transition: all .2s ease;
}
.mx-has-drop:hover > .mx-drop, .mx-has-drop:focus-within > .mx-drop { opacity: 1; visibility: visible; transform: translateY(0); }
.mx-has-drop:hover > .mx-link i { transform: rotate(180deg); }
.mx-drop a { display: block; padding: 9px 22px; color: var(--mx-ink); font-size: 15.5px; transition: color .2s, padding .2s, background .2s; }
.mx-drop a:hover, .mx-drop a.is-current { color: var(--mx-blue); padding-left: 28px; background: #F3F8FD; }

.mx-mega { display: grid; grid-template-columns: repeat(3, minmax(220px, 1fr)); width: 720px; left: 50%; transform: translate(-50%, 10px); padding: 14px 8px; }
.mx-has-mega:hover > .mx-mega, .mx-has-mega:focus-within > .mx-mega { transform: translate(-50%, 0); }
.mx-mega__all { grid-column: 1 / -1; border-top: 1px solid var(--mx-line); margin-top: 6px; padding-top: 6px; }
.mx-mega__all a { color: var(--mx-blue); font-weight: 700; }

/* Call + Book */
.mx-actions { display: flex; align-items: center; gap: 22px; flex: 0 0 auto; }
.mx-call { display: flex; align-items: center; gap: 12px; color: var(--mx-ink); }
.mx-call__ic {
  width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center;
  border: 1.5px solid var(--mx-blue); color: var(--mx-blue); font-size: 19px; transition: all .2s;
}
.mx-call:hover .mx-call__ic { background: var(--mx-blue); color: #fff; }
.mx-call__txt { display: flex; flex-direction: column; line-height: 1.25; }
.mx-call__txt small { font-size: 14px; color: var(--mx-muted); }
.mx-call__txt strong { font-size: 17px; font-weight: 700; color: var(--mx-ink); letter-spacing: .2px; }
.mx-book {
  display: inline-block; padding: 14px 30px; border-radius: 999px; background: var(--mx-yellow);
  color: var(--mx-ink); font-weight: 700; font-size: 16.5px; line-height: 1; border: 1px solid #E8BA00;
  transition: background .2s, transform .2s, box-shadow .2s;
}
.mx-book:hover { background: #FFDB3D; color: var(--mx-ink); transform: translateY(-1px); box-shadow: 0 8px 18px rgba(255, 208, 22, .4); }

/* Burger */
.mx-burger { display: none; margin-left: auto; width: 46px; height: 46px; border: 0; background: var(--mx-blue); border-radius: 10px; padding: 0 12px; flex-direction: column; justify-content: center; gap: 5px; }
.mx-burger span { display: block; height: 2px; background: #fff; border-radius: 2px; transition: transform .25s, opacity .25s; }
.mx-burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.mx-burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.mx-burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ---------- Mid widths ---------- */
@media (max-width: 1399.98px) {
  .mx-brand img { width: 220px; }
  .mx-link { padding: 32px 10px; font-size: 16px; }
  .mx-call__txt small { display: none; }
  .mx-actions { gap: 14px; }
  .mx-book { padding: 13px 22px; }
}
@media (max-width: 1239.98px) {
  .mx-call__txt { display: none; }
}

/* ---------- Mobile ---------- */
@media (max-width: 1099.98px) {
  :root { --mx-header-h: 76px; }
  .mx-topbar__unit, .mx-topbar__mail { display: none !important; }
  .mx-brand img { width: 190px; }
  .mx-burger { display: flex; }
  .mx-nav {
    position: fixed; top: 0; right: 0; bottom: 0; width: min(360px, 88vw); z-index: 1070;
    background: #fff; flex-direction: column; align-items: stretch; justify-content: flex-start;
    padding: 84px 0 24px; overflow-y: auto; box-shadow: -20px 0 40px rgba(1, 20, 44, .18);
    transform: translateX(100%); transition: transform .3s ease;
  }
  .mx-nav.is-open { transform: translateX(0); }
  .mx-menu { flex-direction: column; align-items: stretch; margin: 0; gap: 0; }
  .mx-menu > li { border-bottom: 1px solid var(--mx-line); display: flex; flex-wrap: wrap; align-items: center; }
  .mx-link { padding: 16px 24px; flex: 1; font-size: 17px; }
  .mx-link i { display: none; }
  .mx-drop-toggle { display: grid; place-items: center; width: 54px; height: 50px; border: 0; background: transparent; color: var(--mx-blue); }
  .mx-drop-toggle i { transition: transform .2s; }
  .mx-has-drop.is-open .mx-drop-toggle i { transform: rotate(180deg); }
  .mx-drop, .mx-mega {
    position: static; width: 100%; min-width: 0; display: none; opacity: 1; visibility: visible; transform: none !important;
    box-shadow: none; border-top: 0; border-radius: 0; background: #F6F9FC; padding: 6px 0; grid-template-columns: 1fr;
  }
  .mx-has-drop.is-open > .mx-drop { display: block; }
  .mx-drop a { padding: 10px 36px; }
  .mx-actions { flex-direction: column; align-items: stretch; padding: 24px; gap: 16px; }
  .mx-call__txt { display: flex; }
  .mx-call__txt small { display: block; }
  .mx-book { text-align: center; }
  .mx-backdrop { position: fixed; inset: 0; background: rgba(1, 20, 44, .45); z-index: 1065; opacity: 0; visibility: hidden; transition: opacity .3s; }
  .mx-backdrop.is-on { opacity: 1; visibility: visible; }
  .mx-burger { position: relative; z-index: 1075; }
}
@media (max-width: 575.98px) {
  .mx-wrap { padding: 0 16px; }
  .mx-topbar__left { margin-left: -16px; padding-left: 16px; padding-right: 36px; font-size: 13px; }
  .mx-topbar__right { gap: 14px; }
  .mx-brand img { width: 170px; }
}