:root{
 --bg:#030814;
 --accent:#00f0ff;
 --accent2:#3a7bff;
 --text:#e6f1ff;
}

html{
 background:var(--bg);
 min-height:100%;
}

body{
 margin:0;
 font-family:Segoe UI, sans-serif;
 background:radial-gradient(circle at top, rgba(9,23,48,0.91) 0%, rgba(3,8,20,0.94) 48%, rgba(2,5,13,0.98) 100%);
 color:var(--text);
 overflow-x:hidden;
 min-height:100vh;
}

canvas#bg{
 position:fixed;
 top:0;
 left:0;
 width:100vw;
 height:100vh;
 z-index:0;
 opacity:0.68;
 pointer-events:none;
}

body::before{
 content:"";
 position:fixed;
 inset:0;
 z-index:0;
 pointer-events:none;
 background:linear-gradient(180deg, rgba(3,8,20,0.22), rgba(3,8,20,0.34));
}

nav,
.hero,
.container,
footer{
 position:relative;
 z-index:1;
}

nav{
 display:flex;
 justify-content:space-between;
 align-items:center;
 padding:15px 25px;
 backdrop-filter:blur(10px);
 position:sticky;
 top:0;
 background:rgba(3,8,20,0.50);
 z-index:50;
}

.nav-links{display:flex;gap:15px;position:relative;z-index:60;}
nav a{color:var(--accent);text-decoration:none;}
.burger{display:none;font-size:26px;cursor:pointer;position:relative;z-index:70;background:none;border:0;color:var(--accent);}

@media(max-width:900px){

 .nav-links{
  display:none;
  flex-direction:column;
  position:absolute;
  top:60px;
  left:0;
  width:100%;
  background:rgba(8,18,42,0.95);
  backdrop-filter:blur(12px);
  padding:20px 0;
  border-top:1px solid rgba(0,240,255,0.2);
 }

 .nav-links.active{
  display:flex;
 }

 .nav-links a{
  width:100%;
  text-align:center;
  padding:15px 0;
  font-size:1.1em;
  border-bottom:1px solid rgba(255,255,255,0.05);
 }

 .nav-links a:last-child{
  border-bottom:none;
 }

 .burger{
  display:block;
 }

}

.hero{
 text-align:center;
 padding:120px 20px 60px;
}

h1{
 font-size:3em;
 background:linear-gradient(90deg,var(--accent),var(--accent2));
 -webkit-background-clip:text;
 color:transparent;
}

.container{max-width:1100px;margin:auto;padding:20px;}
.section{margin-bottom:40px;}

.card{
 background:rgba(255,255,255,0.04);
 padding:20px;
 border-radius:12px;
 box-shadow:0 0 25px rgba(0,240,255,0.15);
 margin-bottom:20px;
 backdrop-filter:blur(3px);
}

.profile{
 display:flex;
 gap:30px;
 align-items:center;
 flex-wrap:wrap;
}

.profile img{
 width:180px;
 height:180px;
 border-radius:50%;
 border:2px solid var(--accent);
 object-fit:cover;
}

ul{line-height:1.6;}
footer{text-align:center;padding:30px;opacity:0.6;}

.pub-item{
 margin-bottom:18px;
 line-height:1.5;
 padding-left:10px;
 border-left:2px solid rgba(0,240,255,0.3);
}

.pub-item em{
 color:#9bdcff;
 font-style:italic;
}

.pub-item .doi{
 display:inline-block;
 margin-top:4px;
 font-size:0.9em;
 color:#00f0ff;
 text-decoration:none;
}

.pub-item.highlight{
 border-left:3px solid gold;
 background:rgba(255,215,0,0.05);
 padding:10px;
 border-radius:8px;
}


/* ===== Full content additions ===== */
.hero .eyebrow{
 margin:0 0 14px;
 color:#9bdcff;
 letter-spacing:0.08em;
 text-transform:uppercase;
 font-size:0.78rem;
 opacity:0.85;
}
.hero-subtitle{
 max-width:820px;
 margin:18px auto 0;
 color:rgba(230,241,255,0.82);
 font-size:1.12rem;
 line-height:1.6;
}
h2{margin-top:0;color:#dffaff;}
h3{color:#9bdcff;margin-bottom:8px;}
p{line-height:1.65;}
a{color:var(--accent);}
.intro-card{font-size:1.04rem;}
.grid{display:grid;gap:20px;}
.cards-2{grid-template-columns:repeat(2,minmax(0,1fr));}
.cards-3{grid-template-columns:repeat(3,minmax(0,1fr));}
.stat-card .stat{
 display:inline-block;
 font-size:2.2rem;
 font-weight:700;
 background:linear-gradient(90deg,var(--accent),var(--accent2));
 -webkit-background-clip:text;
 color:transparent;
 margin-bottom:6px;
}
.tag-list{display:flex;flex-wrap:wrap;gap:10px;}
.tag-list span{
 border:1px solid rgba(0,240,255,0.22);
 background:rgba(0,240,255,0.06);
 border-radius:999px;
 padding:8px 12px;
 color:#dffaff;
 font-size:0.94rem;
}
.button{
 display:inline-block;
 margin-top:8px;
 padding:10px 14px;
 border-radius:10px;
 color:#ffffff;
 background:#007bff;
 border:1px solid #007bff;
 text-decoration:none;
 font-weight:600;
 transition:background-color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}
.button:hover,
.button:focus{
 background:#0069d9;
 border-color:#0062cc;
 color:#ffffff;
}
.button.secondary{
 color:#ffffff;
 background:#007bff;
 border:1px solid #007bff;
}
.button.secondary:hover,
.button.secondary:focus-visible{
 color:#ffffff;
 background:#0069d9;
 border-color:#0062cc;
}
.footer-links{
 display:flex;
 justify-content:center;
 flex-wrap:wrap;
 gap:12px;
 margin-top:10px;
 font-size:0.95rem;
}
.footer-links a{
 color:var(--accent);
 text-decoration:none;
}
.footer-links a:hover,
.footer-links a:focus-visible{
 text-decoration:underline;
}
.timeline{display:grid;gap:18px;}
.timeline > div{
 padding-left:14px;
 border-left:2px solid rgba(0,240,255,0.28);
}
.timeline strong{color:#dffaff;}
.software-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;}
.software-list > div{
 background:rgba(255,255,255,0.025);
 border:1px solid rgba(255,255,255,0.06);
 border-radius:10px;
 padding:14px;
}
.clean-list{padding-left:20px;line-height:1.7;}
.course-grid{display:grid;grid-template-columns:1fr 1.4fr;gap:24px;}
.contact-line{font-size:1.12rem;}
.link-list{display:flex;flex-wrap:wrap;gap:12px;margin-top:12px;}

@media(max-width:900px){
 .cards-2,.cards-3,.software-list,.course-grid{grid-template-columns:1fr;}
 h1{font-size:2.25em;}
 .hero{padding:90px 18px 45px;}
}

nav a:focus-visible, .burger:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:6px;}
