/* =====================================================
   Header CSS (Scoped to fm- classes only)
   File: /theme/css/header.css
   ===================================================== */

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

/* Page loader */
.se-pre-con{
  position:fixed;
  left:0;
  top:0;
  width:100%;
  height:100%;
  z-index:9999;
  background:#fff url('/assets/images/page-loader.gif') center no-repeat;
}

/* Navbar */
#mainNav.fm-navbar{
  position:fixed;
  top:0;
  left:0;
  right:0;
  z-index:1000;
  background:rgba(255,255,255,.9);
  backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(0,0,0,.05);
  transition:all .25s ease;
}

#mainNav.fm-navbar.fm-scrolled{
  background:#fff;
  box-shadow:0 6px 18px rgba(0,0,0,.08);
}

.fm-navbar-inner{
  max-width:1220px;
  margin:0 auto;
  padding:12px 16px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}

/* Logo */
.fm-logo img{
  height:48px;
  width:auto;
  display:block;
}

/* Desktop Menu */
.fm-menu-wrapper{
  display:flex;
  align-items:center;
  gap:24px;
}

.fm-menu{
  display:flex;
  gap:18px;
  list-style:none;
  margin:0;
  padding:0;
}

.fm-menu>li{position:relative;}

.fm-menu>li>a{
  position:relative;
  font-size:13px;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.08em;
  text-decoration:none;
  color:#222;
  padding:6px 4px;
  font-family:'Open Sans', Arial, sans-serif;
  transition:color .2s ease;
}

.fm-menu>li>a::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-4px;
  width:0;
  height:2px;
  background:linear-gradient(90deg,#fec107,#f94141);
  transition:width .25s ease;
}

.fm-menu>li:hover>a,
.fm-menu>li.fm-active>a{
  color:#f19107;
}

.fm-menu>li:hover>a::after,
.fm-menu>li.fm-active>a::after{
  width:100%;
}

/* Dropdown */
.fm-submenu{
  position:absolute;
  top:110%;
  left:0;
  min-width:210px;
  background:#fff;
  border-radius:10px;
  box-shadow:0 18px 40px rgba(15,23,42,.18);
  padding:10px 0;
  opacity:0;
  visibility:hidden;
  transform:translateY(6px);
  transition:all .2s ease;
  list-style:none;
  margin:0;
  z-index:20;
}

.fm-menu>li:hover .fm-submenu{
  opacity:1;
  visibility:visible;
  transform:translateY(0);
}

.fm-submenu li a{
  display:block;
  padding:8px 16px;
  font-size:13px;
  color:#444;
  text-decoration:none;
  transition:all .15s ease;
}

.fm-submenu li a:hover{
  background:rgba(254,193,7,.09);
  color:#f19107;
  padding-left:20px;
}

/* CTA */
.fm-cta{
  padding:9px 18px;
  border-radius:999px;
  font-size:13px;
  font-weight:700;
  text-transform:uppercase;
  background:linear-gradient(135deg,#fec107,#f94141);
  color:#222;
  text-decoration:none;
  box-shadow:0 10px 20px rgba(249,65,65,.32);
  transition:all .15s ease;
  white-space:nowrap;
  font-family:'Open Sans', Arial, sans-serif;
}

.fm-cta:hover{
  transform:translateY(-1px);
  box-shadow:0 14px 30px rgba(249,65,65,.4);
}

/* Mobile Toggle */
.fm-toggle{
  display:none;
  width:40px;
  height:40px;
  border-radius:999px;
  border:1px solid rgba(148,163,184,.7);
  background:rgba(255,255,255,.9);
  cursor:pointer;
  align-items:center;
  justify-content:center;
}

.fm-toggle-lines{
  width:18px;
  height:14px;
  position:relative;
}

.fm-toggle-line{
  position:absolute;
  left:0;
  right:0;
  height:2px;
  background:#111827;
  transition:all .2s ease;
}

.fm-toggle-line:nth-child(1){top:0;}
.fm-toggle-line:nth-child(2){top:6px;}
.fm-toggle-line:nth-child(3){bottom:0;}

.fm-toggle.fm-open .fm-toggle-line:nth-child(1){
  top:6px;
  transform:rotate(45deg);
}

.fm-toggle.fm-open .fm-toggle-line:nth-child(2){
  opacity:0;
}

.fm-toggle.fm-open .fm-toggle-line:nth-child(3){
  bottom:6px;
  transform:rotate(-45deg);
}

/* Responsive */
@media (max-width:991px){

  .fm-toggle{display:inline-flex;}

  .fm-menu-wrapper{
    position:fixed;
    top:68px;
    left:0;
    right:0;
    background:#fff;
    padding:12px 16px 18px;
    flex-direction:column;
    gap:16px;
    transform:translateY(-16px);
    opacity:0;
    visibility:hidden;
    transition:all .2s ease;
  }

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

  .fm-menu{
    flex-direction:column;
    align-items:flex-start;
    gap:6px;
  }

  .fm-submenu{
    position:static;
    box-shadow:none;
    border-radius:0;
    opacity:1;
    visibility:visible;
    transform:none;
  }

  .fm-cta{
    align-self:stretch;
    text-align:center;
  }
}