/* === Shared Base Styles (main.css) === */
* { margin:0; padding:0; box-sizing:border-box; }
html, body { height:100%; overflow-x:hidden; font-family: Arial, sans-serif; scroll-behavior:smooth; }

/* Header / Nav */
header { display:flex; justify-content:space-between; align-items:center;
  background:#fff; color:#0E162F; position:fixed; top:0; left:0; width:100%;
  padding:1vh 2vw; z-index:1000; border-bottom:0.1vw solid rgba(0,0,0,0.08);
}
.logo img { height:6vh; }
.desktop-logo { display:block; }
.mobile-logo { display:none; }
nav { display:flex; align-items:center; }
nav ul { list-style:none; display:flex; justify-content:flex-end; width:auto; font-size:large; font-weight:bold; padding-top:1vh; }
nav ul li { padding:0 20px; display:inline; }
nav ul li a { text-decoration:none; color:#0E162F; }
nav ul li a:hover { color:#AFCBE5; }
.menu-icon { display:none; flex-direction:column; cursor:pointer; }
.menu-icon div { width:25px; height:3px; background:#0E162F; margin:4px; transition:all .3s ease; }

/* Mobile Nav */
@media (max-width:768px){
  .menu-icon{ display:flex; }
  nav ul{ position:absolute; top:60px; left:-100%; flex-direction:column; width:100%;
    background:#fff; transition:left .3s ease; z-index:999; padding-top:0;
  }
  nav ul li{ width:100%; text-align:center; padding:15px 0; }
  nav ul.active{ left:0; }
  .desktop-logo{ display:none; }
  .mobile-logo{ display:block; height:7vh; }
}

/* Background Canvas + Frosted Backdrop */
canvas#wavyBackground{ position:fixed; top:0; left:0; width:100%; height:100%; z-index:-4; }
.blurry-backdrop{ position:fixed; inset:0; -webkit-backdrop-filter: blur(30px); backdrop-filter: blur(30px); z-index:-3; }

/* Glass panel base */
.glass-container{ background: rgba(255,255,255,.7); border-radius:10px; border:1px solid rgba(255,255,255,.25);
  box-shadow:0 4px 8px rgba(0,0,0,.1); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
}

/* Utility */
img[loading="lazy"]{ background: #f4f6f8; }


/* Polished nav hover */
nav ul li a {
    position: relative;
    transition: color 0.3s ease;
}
nav ul li a::after {
    content: "";
    position: absolute;
    bottom: -4px;
    left: 0;
    width: 0%;
    height: 2px;
    background-color: #AFCBE5;
    transition: width 0.3s ease;
}
nav ul li a:hover::after {
    width: 100%;
}


/* Card polish */
.research-item, .student-card, .professor-card, .alumni-card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.research-item:hover, .student-card:hover, .professor-card:hover, .alumni-card:hover {
    transform: translateY(-5px) scale(1.02);
    box-shadow: 0 8px 20px rgba(0,0,0,0.15);
}


/* Logo background transparency */
.logo img{ background: transparent !important; image-rendering:auto; }