.logo-container {
     display: flex;
     align-items: center;
 }

 /* Ultra Modern Navigation */
 .ultra-modern-nav {
     background: rgba(13, 17, 23, 0.95);
     backdrop-filter: blur(20px);
     border-bottom: 1px solid rgba(0, 168, 255, 0.2);
     box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
     transition: all 0.3s ease;
 }

 .ultra-modern-nav::before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     height: 2px;
     background: linear-gradient(90deg, #00a8ff, #00d2d3, #2ed573, #00a8ff);
     background-size: 200% 100%;
     animation: navGradientFlow 4s ease-in-out infinite;
 }

 @keyframes navGradientFlow {

     0%,
     100% {
         background-position: 0% 50%;
     }

     50% {
         background-position: 100% 50%;
     }
 }

 .modern-brand {
     position: relative;
     overflow: hidden;
 }

 .logo-container {
     position: relative;
 }

 .brand-glow {
     position: absolute;
     top: -10px;
     left: -10px;
     right: -10px;
     bottom: -10px;
     background: radial-gradient(circle, rgba(0, 168, 255, 0.1) 0%, transparent 70%);
     border-radius: 50%;
     opacity: 0;
     transition: opacity 0.3s ease;
     animation: brandPulse 3s ease-in-out infinite;
 }

 .modern-brand:hover .brand-glow {
     opacity: 1;
 }

 @keyframes brandPulse {

     0%,
     100% {
         transform: scale(1);
         opacity: 0.3;
     }

     50% {
         transform: scale(1.1);
         opacity: 0.6;
     }
 }

 .brand-text {
     font-family: 'Montserrat', sans-serif;
     font-size: 26px;
     font-weight: 800;
     background: linear-gradient(45deg, #00a8ff, #00d2d3, #2ed573);
     background-size: 200% 100%;
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     background-clip: text;
     text-transform: uppercase;
     letter-spacing: 3px;
     margin: 0;
     position: relative;
     animation: brandGradientShift 3s ease-in-out infinite;
     filter: drop-shadow(0 0 10px rgba(0, 168, 255, 0.3));
 }

 @keyframes brandGradientShift {

     0%,
     100% {
         background-position: 0% 50%;
     }

     50% {
         background-position: 100% 50%;
     }
 }

 .modern-brand:hover .brand-text {
     animation: brandHover 0.6s ease-out;
 }

 @keyframes brandHover {
     0% {
         transform: scale(1);
     }

     50% {
         transform: scale(1.05) rotateY(5deg);
     }

     100% {
         transform: scale(1);
     }
 }