/* ---------- Futuristic White Glass Theme + Glow ---------- */
*{box-sizing:border-box;margin:0;padding:0}
body{
  font-family:'Inter',sans-serif;
  background:#fdfdfd;
  color:#111;
  line-height:1.6;
}

/* Header */
.header{
  background:#fff;
  border-bottom:1px solid rgba(0,0,0,0.08);
  position:sticky;top:0;z-index:100;
  backdrop-filter:blur(10px);
}
.header .container{
  max-width:1100px;margin:auto;
  display:flex;justify-content:space-between;align-items:center;
  padding:1rem 1.5rem;
}
.logo{font-weight:700;font-size:1.4rem;color:#0d1117;}
.logo span{color:#00b8d9;}
nav a{
  margin-left:1.5rem;text-decoration:none;font-weight:500;
  color:#333;transition:color .2s;
}
nav a:hover{color:#00b8d9}

/* Hero */
.hero{
  position:relative;
  overflow:hidden;
  padding:4rem 1rem 6rem;
  text-align:center;
  background:linear-gradient(135deg,#eef7ff,#fff);
}
.glow-bg{
  position:absolute;
  top:0;left:0;right:0;bottom:0;
  background:radial-gradient(circle at 20% 30%,rgba(0,184,217,0.15),transparent 60%),
             radial-gradient(circle at 80% 70%,rgba(255,77,103,0.15),transparent 60%);
  animation:glowMove 8s infinite alternate ease-in-out;
  z-index:1;
}
@keyframes glowMove{
  0%{background-position:20% 30%,80% 70%;}
  100%{background-position:40% 50%,60% 50%;}
}
.hero-content{position:relative;z-index:2;}
.hero h1{
  font-size:2.6rem;
  background:linear-gradient(90deg,#00b8d9,#ff4d67);
  -webkit-background-clip:text;
  color:transparent;
  font-weight:700;
}
.hero .updated-date{color:#666;margin-top:.5rem;font-size:0.95rem}

.hero-images{
  margin-top:2.5rem;
  display:flex;
  justify-content:center;
  gap:1.2rem;
  flex-wrap:wrap;
  position:relative;
  z-index:2;
}
.hero-images img{
  width:200px;
  height:200px;
  object-fit:cover;
  border-radius:20px;
  box-shadow:0 6px 20px rgba(0,0,0,0.1);
  transition:transform .3s;
}
.hero-images img:hover{transform:scale(1.05)}

/* Summary */
.summary{
  padding:3rem 1rem;
  text-align:center;
}
.summary h2{
  color:#00b8d9;
  font-size:1.6rem;
  margin-bottom:1rem;
}
.summary p{
  font-size:1.05rem;
  max-width:700px;
  margin:auto;
  color:#333;
}

/* Related News */
.related-news{
  background:#fafafa;
  padding:4rem 1rem;
}
.related-news .container{max-width:1100px;margin:auto;}
.related-news h2{
  text-align:center;
  color:#ff4d67;
  margin-bottom:2rem;
  font-size:1.6rem;
}
.news-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  gap:1.5rem;
}
.news-card{
  background:rgba(255,255,255,0.7);
  backdrop-filter:blur(10px);
  border:1px solid rgba(0,0,0,0.05);
  border-radius:18px;
  padding:1.2rem;
  box-shadow:0 6px 16px rgba(0,0,0,0.06);
  transition:transform .25s, box-shadow .25s;
}
.news-card:hover{
  transform:translateY(-5px);
  box-shadow:0 8px 22px rgba(0,0,0,0.1);
}
.news-card img{
  width:100%;height:160px;object-fit:cover;
  border-radius:12px;margin-bottom:.8rem;
}
.news-card a{
  font-weight:600;
  color:#0d1117;
  text-decoration:none;
}
.news-card a:hover{color:#00b8d9;}
.news-card p{
  color:#444;
  font-size:.95rem;
  margin-top:.6rem;
}

/* Footer */
.footer{
  background:#fff;
  border-top:1px solid rgba(0,0,0,0.08);
  padding:1.5rem;
  text-align:center;
  color:#555;
  font-size:0.95rem;
}
.footer .back-link{
  display:inline-block;
  margin-top:.8rem;
  color:#00b8d9;
  text-decoration:none;
  font-weight:600;
}
.footer .back-link:hover{color:#ff4d67}
.nav-dropdown{position:relative;display:inline-block;}
.nav-dropdown-content{display:none;position:absolute;background:#fff;box-shadow:0 8px 20px rgba(0,0,0,0.1);border-radius:8px;min-width:160px;padding:.5rem 0;z-index:10;}
.nav-dropdown-content a{display:block;padding:.6rem 1rem;color:#333;text-decoration:none;}
.nav-dropdown-content a:hover{background:#f0f9ff;color:#00b8d9;}
.nav-dropdown:hover .nav-dropdown-content{display:block;}