﻿ *{margin:0;padding:0;box-sizing:border-box;font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;}
        body{background:#f5f6fa;overflow-x:hidden;}
        header{position:fixed;top:0;left:0;width:100%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.1);z-index:1000;transition:all .3s;}
        header.scrolled{box-shadow:0 6px 20px rgba(0,0,0,.2);background:#f8f9ff;}
        .container{max-width:1200px;margin:auto;padding:0 20px;display:flex;align-items:center;justify-content:space-between;height:70px;}
        .logo img{height:50px;}
        .desktop-nav-wrapper{display:flex;align-items:center;gap:20px;}
        nav.desktop-nav{display:flex;align-items:center;gap:20px;}
        nav.desktop-nav ul{list-style:none;display:flex;gap:15px;margin:0;padding:0;}
        nav.desktop-nav ul li{position:relative;z-index:100;}
        nav.desktop-nav a{color:#333;font-size:16px;font-weight:500;text-decoration:none;padding:8px 15px;position:relative;transition:0.3s;display:inline-block;}
        nav.desktop-nav > ul > li > a::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:0;background:#2E81FA;transition: width 0.6s ease;}
        nav.desktop-nav > ul > li > a:hover::after{width:100%;}
        nav.desktop-nav > ul > li > a:hover{color:#2E81FA;}
        nav.desktop-nav .submenu{position:absolute;top:calc(100% + 2px);left:0;min-width:250px;background:#fff;border-left:4px solid #2E81FA;box-shadow:0 12px 25px rgba(0,0,0,0.15);border-radius:6px;opacity:0;visibility:hidden;transform:translateY(-10px);transition:all 0.3s ease;display:flex;flex-direction:column;}
        nav.desktop-nav li:hover>.submenu{opacity:1;visibility:visible;transform:translateY(0);}
        nav.desktop-nav .submenu li a{display:block;padding:10px 15px;color:#333;position:relative;z-index:1;transition:all 0.3s;white-space:nowrap;}
        nav.desktop-nav .submenu li a::before{content:"";position:absolute;top:0;left:0;width:0;height:100%;background:#2E81FA;z-index:-1;transition:width 0.3s ease;}
        nav.desktop-nav .submenu li a:hover::before{width:100%;}
        nav.desktop-nav .submenu li a:hover{color:#fff;font-weight:bold;}
        nav.desktop-nav .submenu li a:hover .dropdown-icon{color:#fff;}
        nav.desktop-nav .submenu .submenu{position:absolute;top:0;left:100%;min-width:250px;background:#fff;border-left:4px solid #2E81FA;border-radius:6px;box-shadow:0 8px 18px rgba(0,0,0,0.15);opacity:0;visibility:hidden;transform:translateX(-10px);transition:all 0.3s ease;display:flex;flex-direction:column;}
        nav.desktop-nav .submenu li:hover>.submenu{opacity:1;visibility:visible;transform:translateX(0);}
        nav.desktop-nav .dropdown-icon{font-size:11px;margin-left:5px;color:#333;transition:0.3s;}
        nav.desktop-nav ul li:hover > a .dropdown-icon{color:#2E81FA;}
        nav.desktop-nav .submenu li a:hover .dropdown-icon{color:#fff;}
        nav.desktop-nav ul li:hover > .dropdown-icon{transform:rotate(180deg);}
        .nav-btn{background:#2E81FA;color:#fff;padding:10px 25px;border-radius:50px;font-weight:500;text-decoration:none;transition:.3s;box-shadow:0 4px 12px rgba(0,0,0,.3);margin-left:auto;}
        .nav-btn:hover{transform:scale(1.05);background:#0040ff;box-shadow:0 8px 25px rgba(0,0,255,.4);}
        .mobile-menu-icon{display:none;font-size:28px;cursor:pointer;color:#2E81FA;transition:.3s;}
        .mobile-menu-icon:hover{color:#0040ff; transform:scale(1.2);}
        nav.mobile-nav{display:none;}
        @media(max-width:991px){
          nav.desktop-nav{display:none;}
          .mobile-menu-icon{display:block;}
          nav.mobile-nav{display:flex; flex-direction:column; position:fixed; top:0; left:0; width:100%; height:100%;background:rgba(0,0,0,0.95); overflow-y:auto; z-index:1001; transform:translateX(-100%); transition:.3s;}
          nav.mobile-nav.active{transform:translateX(0);}
          nav.mobile-nav > ul{background:#fff; flex-direction:column; gap:0; list-style:none; margin:0; padding-top:70px;}
          nav.mobile-nav ul li{border-bottom:1px solid #ddd; position:relative;}
          nav.mobile-nav ul li a{padding:15px 20px; font-size:16px; display:flex; justify-content:space-between; align-items:center; text-decoration:none;color:#333; position:relative; overflow:visible; z-index:1; transition:color .3s;}
          nav.mobile-nav ul li a::before{content:""; position:absolute; top:0; left:-100%; width:100%; height:100%; background:#2E81FA; z-index:-1; transition:all .6s ease;}
          nav.mobile-nav ul li a:hover::before{left:0;}
          nav.mobile-nav ul li a:hover{color:#fff; z-index:1;}
          .mobile-submenu{display:none; flex-direction:column; overflow:hidden; transition:max-height .3s ease, background .3s ease; background:#f0f4ff; border-radius:6px;}
          .mobile-submenu.open{display:flex;}
          .mobile-submenu li a{padding-left:35px; font-size:16px; font-weight:500; color:#2E81FA;}
          .mobile-submenu .mobile-submenu li a{padding-left:50px; font-style:italic; color:#2E81FA;}
          .close-menu{position:absolute; top:15px; right:15px; font-size:50px; cursor:pointer; color:#2E81FA; transition:.3s;}
          .close-menu:hover{color:#0040ff; transform:rotate(90deg) scale(1.4);}
          .mobile-dropdown-icon{font-size:14px; margin-left:10px; transition:transform .3s; color:#2E81FA;}
          .mobile-dropdown-icon.open{transform:rotate(-180deg);}
          .mobile-nav .nav-btn{margin:15px auto; display:block; text-align:center; border-radius:50px; background:#2E81FA; padding:10px 25px; transition:.3s;}
          .mobile-nav .nav-btn:hover{background:#0040ff; transform:scale(1.05);}
        }