



.unified-header {
 position:fixed;
 top:0;
 left:0;
 right:0;
 height:80px;
 background:linear-gradient(to bottom, rgba(10, 10, 15, 0.98), rgba(10, 10, 15, 0.95));
 backdrop-filter:blur(20px);
 -webkit-backdrop-filter:blur(20px);
 border-bottom:1px solid rgba(79, 172, 254, 0.3);
 z-index:10000;
 transition:all 0.3s ease;
 box-shadow:0 2px 20px rgba(0, 0, 0, 0.3);
}


.unified-header.scrolled {
 background:rgba(10, 10, 15, 0.99);
 box-shadow:0 5px 30px rgba(0, 0, 0, 0.6);
}

.header-container {
 width:100%;
 max-width:100%;
 margin:0 auto;
 height:100%;
 display:flex;
 align-items:center;
 justify-content:space-between;
 padding:0 40px;
}


@media (min-width:1920px) {
 .header-container {
 padding:0 60px;
 }
}

@media (min-width:2560px) {
 .header-container {
 padding:0 80px;
 }
}


.unified-header .logo {
 flex-shrink:0;
 display:flex;
 align-items:center;
}

.unified-header .logo a {
 display:block;
 text-decoration:none;
}

.unified-header .logo img {
 height:55px;
 width:auto;
 transition:all 0.3s ease;
 filter:drop-shadow(0 0 10px rgba(79, 172, 254, 0.3));
}

.unified-header .logo:hover img {
 transform:scale(1.05);
 filter:drop-shadow(0 0 15px rgba(79, 172, 254, 0.5));
}


.pc-nav {
 display:none !important;
}

.pc-nav::-webkit-scrollbar {
 display:none;
}

.nav-list {
 list-style:none;
 display:flex;
 align-items:center;
 gap:0;
 margin:0;
 padding:0;
}

.nav-item {
 position:relative;
}

.nav-link {
 display:flex;
 align-items:center;
 padding:0 20px;
 height:80px;
 color:rgba(255, 255, 255, 0.9);
 text-decoration:none;
 transition:all 0.3s ease;
 font-size:15px;
 font-weight:500;
 position:relative;
}

@media (min-width:1440px) {
 .nav-link {
 padding:0 25px;
 font-size:16px;
 }
}

@media (min-width:1920px) {
 .nav-link {
 padding:0 30px;
 font-size:17px;
 }
}

.nav-link::before {
 content:'';
 position:absolute;
 bottom:0;
 left:50%;
 width:0;
 height:3px;
 background:linear-gradient(90deg, #4facfe, #00f2fe);
 transition:all 0.3s ease;
 transform:translateX(-50%);
 border-radius:2px;
}

.nav-link:hover::before {
 width:80%;
}

.nav-link:hover {
 color:#4facfe;
 background:rgba(79, 172, 254, 0.05);
}

.nav-item.active .nav-link {
 color:#4facfe;
}

.nav-item.active > .nav-link::after {
 content:'';
 position:absolute;
 bottom:0;
 left:50%;
 width:80%;
 height:3px;
 background:linear-gradient(90deg, #4facfe, #00f2fe);
 transform:translateX(-50%);
 border-radius:2px;
 animation:pulse 2s infinite;
}

.nav-link.has-dropdown {
 position:relative;
}

.nav-link.has-dropdown::after {
 content:'▼';
 margin-left:5px;
 font-size:10px;
 transition:transform 0.3s ease;
 opacity:0.7;
}

.nav-item:hover .nav-link.has-dropdown::after {
 transform:rotate(180deg);
}

.sub-menu {
 position:absolute;
 top:100%;
 left:0;
 background:rgba(10, 10, 15, 0.98);
 backdrop-filter:blur(20px);
 -webkit-backdrop-filter:blur(20px);
 border:1px solid rgba(79, 172, 254, 0.2);
 border-radius:8px;
 min-width:200px;
 opacity:0;
 visibility:hidden;
 transform:translateY(-10px);
 transition:all 0.3s ease;
 box-shadow:0 10px 30px rgba(0, 0, 0, 0.5);
}

.nav-item:hover .sub-menu {
 opacity:1;
 visibility:visible;
 transform:translateY(0);
}

.sub-menu-item {
 list-style:none;
}

.sub-menu-link {
 display:block;
 padding:12px 20px;
 color:rgba(255, 255, 255, 0.9);
 text-decoration:none;
 transition:all 0.3s ease;
 border-bottom:1px solid rgba(79, 172, 254, 0.1);
}

.sub-menu-item:last-child .sub-menu-link {
 border-bottom:none;
}

.sub-menu-link:hover {
 color:#4facfe;
 background:rgba(79, 172, 254, 0.05);
 padding-left:25px;
}


.mobile-menu-btn {
 display:flex;
 flex-direction:column;
 justify-content:center;
 align-items:center;
 width:40px;
 height:40px;
 background:transparent;
 border:none;
 cursor:pointer;
 padding:0;
 transition:all 0.3s ease;
}

.mobile-menu-btn span {
 display:block;
 width:25px;
 height:3px;
 background:#4facfe;
 margin:3px 0;
 transition:all 0.3s ease;
 border-radius:2px;
 box-shadow:0 0 5px rgba(79, 172, 254, 0.5);
}

.mobile-menu-btn span:nth-child(1) {
 transform-origin:0 0;
}

.mobile-menu-btn span:nth-child(2) {
 width:20px;
}

.mobile-menu-btn span:nth-child(3) {
 transform-origin:0 100%;
}

.mobile-menu-btn:hover {
 transform:scale(1.1);
}

.mobile-menu-btn.active span:nth-child(1) {
 transform:rotate(45deg) translate(2px, -2px);
}

.mobile-menu-btn.active span:nth-child(2) {
 opacity:0;
 transform:scale(0);
}

.mobile-menu-btn.active span:nth-child(3) {
 transform:rotate(-45deg) translate(2px, 2px);
}


.mobile-nav {
 position:fixed;
 top:80px;
 left:0;
 right:0;
 background:rgba(10, 10, 15, 0.98);
 backdrop-filter:blur(20px);
 -webkit-backdrop-filter:blur(20px);
 border-bottom:1px solid rgba(79, 172, 254, 0.2);
 transform:translateY(-100%);
 opacity:0;
 visibility:hidden;
 transition:all 0.3s ease;
 z-index:9999;
 box-shadow:0 5px 20px rgba(0, 0, 0, 0.5);
}

.mobile-nav.active {
 transform:translateY(0);
 opacity:1;
 visibility:visible;
}

.mobile-nav-list {
 list-style:none;
 margin:0;
 padding:20px 0;
}

.mobile-nav-item {
 list-style:none;
}

.mobile-nav-link {
 display:block;
 padding:15px 40px;
 color:rgba(255, 255, 255, 0.9);
 text-decoration:none;
 transition:all 0.3s ease;
 font-size:16px;
 font-weight:500;
 border-bottom:1px solid rgba(79, 172, 254, 0.1);
}

@media (min-width:1024px) {
 .mobile-nav {
 display:none;
 }
}

@media (min-width:1024px) {
 .mobile-nav-link {
 padding:12px 40px;
 font-size:15px;
 }
}

@media (min-width:1024px) {
 .mobile-nav-link:hover {
 background:rgba(79, 172, 254, 0.05);
 }
}

.mobile-nav-link:hover {
 color:#4facfe;
 background:rgba(79, 172, 254, 0.05);
 padding-left:50px;
}

.mobile-nav-link.has-sub::after {
 content:'▶';
 float:right;
 margin-top:2px;
 font-size:12px;
 transition:transform 0.3s ease;
 opacity:0.7;
}

.mobile-nav-link.has-sub.active::after {
 transform:rotate(90deg);
}

.mobile-nav-item.active > .mobile-nav-link {
 color:#4facfe;
 background:rgba(79, 172, 254, 0.1);
}

.mobile-sub-menu {
 background:rgba(5, 5, 10, 0.95);
 border-top:1px solid rgba(79, 172, 254, 0.1);
 max-height:0;
 overflow:hidden;
 transition:max-height 0.3s ease;
}

.mobile-sub-menu.active {
 max-height:300px;
}

.mobile-sub-link {
 display:block;
 padding:12px 60px;
 color:rgba(255, 255, 255, 0.8);
 text-decoration:none;
 transition:all 0.3s ease;
 font-size:14px;
}

.mobile-sub-link:hover {
 color:#4facfe;
 background:rgba(79, 172, 254, 0.05);
 padding-left:70px;
}


.overlay {
 position:fixed;
 top:0;
 left:0;
 right:0;
 bottom:0;
 background:rgba(0, 0, 0, 0.5);
 opacity:0;
 visibility:hidden;
 transition:all 0.3s ease;
 z-index:9998;
 backdrop-filter:blur(5px);
 -webkit-backdrop-filter:blur(5px);
}

.overlay.active {
 opacity:1;
 visibility:visible;
}


body {
 padding-top:80px;
}

.content-wrapper {
 min-height:calc(100vh - 80px);
}

#animation-reducer {
 display:none;
}


@media (max-width:1023px) {
 .nav-list {
 display:none;
 }
 
 .nav-link {
 display:none;
 }
}

@media (max-width:768px) {
 .unified-header {
 height:70px;
 }
 
 .header-container {
 padding:0 20px;
 }
 
 .unified-header .logo img {
 height:45px;
 }
 
 .nav-link {
 display:none;
 }
 
 .mobile-menu-btn {
 width:35px;
 height:35px;
 }
 
 .mobile-menu-btn span {
 width:22px;
 height:2px;
 }
 
 .mobile-nav {
 top:70px;
 }
 
 body {
 padding-top:70px;
 }
}

@media (max-width:480px) {
 .unified-header {
 height:60px;
 }
 
 .header-container {
 padding:0 15px;
 }
 
 .unified-header .logo img {
 height:40px;
 }
 
 .mobile-menu-btn {
 width:30px;
 height:30px;
 }
 
 .mobile-menu-btn span {
 width:20px;
 height:2px;
 }
 
 .mobile-menu-btn span:nth-child(1) {
 margin-top:2px;
 }
 
 .mobile-menu-btn span:nth-child(3) {
 margin-bottom:2px;
 }
 
 .mobile-nav {
 top:60px;
 }
 
 .mobile-nav-link {
 padding:12px 30px;
 font-size:15px;
 }
 
 body {
 padding-top:60px;
 }
}


@keyframes fadeIn {
 from {
 opacity:0;
 transform:translateY(-10px);
 }
 to {
 opacity:1;
 transform:translateY(0);
 }
}

.nav-item.active .nav-link::before {
 content:'';
 position:absolute;
 bottom:0;
 left:50%;
 width:80%;
 height:3px;
 background:linear-gradient(90deg, #4facfe, #00f2fe);
 transform:translateX(-50%);
 border-radius:2px;
 animation:pulse 2s infinite;
}

@keyframes pulse {
 0%, 100% {
 opacity:1;
 box-shadow:0 0 5px rgba(79, 172, 254, 0.5);
 }
 50% {
 opacity:0.7;
 box-shadow:0 0 15px rgba(79, 172, 254, 0.8);
 }
}


.unified-header::after {
 content:'';
 position:absolute;
 bottom:0;
 left:0;
 right:0;
 height:1px;
 background:linear-gradient(90deg, 
 transparent 0%, 
 rgba(79, 172, 254, 0.3) 20%, 
 rgba(79, 172, 254, 0.8) 50%, 
 rgba(79, 172, 254, 0.3) 80%, 
 transparent 100%);
 animation:glow-line 3s ease-in-out infinite;
}

@keyframes glow-line {
 0%, 100% {
 opacity:0.3;
 transform:scaleX(0.8);
 }
 50% {
 opacity:1;
 transform:scaleX(1);
 }
} 