/* ═══════════════════════════════
   MRL PROD - Header mobile + burger
   ═══════════════════════════════ */

.mrl-mobile-header{
  position:fixed;
  top:0;
  left:0;
  right:0;
  height:80px;
  padding:0 18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  background:#000;
  z-index:9999;
}

.mrl-mobile-header__branding{
  display:flex;
  align-items:center;
  gap:12px;
}

.mrl-mobile-header__logo img{
  width:62px;
  height:auto;
  display:block;
}

.mrl-mobile-header__text{
  display:flex;
  flex-direction:column;
  line-height:1;
}

.expert{
  font-size:10px;
  font-weight:700;
  letter-spacing:.35em;
  color:#8b5cf6;
  text-transform:uppercase;
  margin-bottom:3px;
}

.baseline{
  font-size:13px;
  font-weight:600;
  color:#fff;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.mrl-floating-burger{
  width:52px;
  height:52px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  gap:6px;
  border:none;
  border-radius:50%;
  background:#6d28d9;
  cursor:pointer;
  box-shadow:0 10px 30px rgba(0,0,0,.3);
}

.mrl-floating-burger span{
  width:22px;
  height:2px;
  background:#fff;
  transition:.3s;
}

.mrl-floating-burger.open span:nth-child(1){
  transform:translateY(8px) rotate(45deg);
}

.mrl-floating-burger.open span:nth-child(2){
  opacity:0;
}

.mrl-floating-burger.open span:nth-child(3){
  transform:translateY(-8px) rotate(-45deg);
}

.mrl-floating-menu{
  position:fixed;
  top:80px;
  right:18px;
  z-index:9998;
  width:280px;
  display:flex;
  flex-direction:column;
  background:#111114;
  border:1px solid rgba(255,255,255,.08);
  border-radius:12px;
  overflow:hidden;
  opacity:0;
  visibility:hidden;
  transform:translateY(-10px);
  transition:.3s;
}

.mrl-floating-menu.open{
  opacity:1;
  visibility:visible;
  transform:translateY(0);
}

.mrl-floating-menu a{
  padding:14px 20px;
  color:#f4f3fa;
  text-decoration:none;
  font-size:.8rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  border-bottom:1px solid rgba(255,255,255,.08);
}

.mrl-floating-menu a:last-child{
  border-bottom:none;
}

.mrl-floating-menu a:hover{
  background:#6d28d9;
}

/* MOBILE */
@media (max-width:1100px){
  .mrl-nav{
    display:none !important;
  }

  .mrl-mobile-header{
    display:flex !important;
  }
}

/* DESKTOP */
@media (min-width:1101px){
  .mrl-mobile-header,
  .mrl-floating-menu{
    display:none !important;
  }

  .mrl-nav{
    display:flex !important;
  }
}