html {
  scroll-behavior: smooth;
}
body {
  background:
    radial-gradient(circle at 20% 10%, rgba(16,185,129,0.16), transparent 24%),
    radial-gradient(circle at 80% 20%, rgba(16,185,129,0.10), transparent 20%),
    radial-gradient(circle at 50% 80%, rgba(16,185,129,0.08), transparent 22%),
    linear-gradient(180deg, #020807 0%, #04110c 45%, #020807 100%);
  color: #e8fff4;
  overflow-x: hidden;
}
.glass {
  background: rgba(6, 17, 12, 0.62);
  border: 1px solid rgba(255,255,255,0.08);
  backdrop-filter: blur(18px);
}
.grid-bg {
  background-image:
    linear-gradient(rgba(34,197,94,0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(34,197,94,0.05) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: radial-gradient(circle at center, black 38%, transparent 85%);
}
.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: all .8s cubic-bezier(.2,.8,.2,1);
}
.reveal.show {
  opacity: 1;
  transform: translateY(0);
}
.line-glow {
  box-shadow:
    0 0 12px rgba(16,185,129,0.5),
    0 0 32px rgba(16,185,129,0.15);
}
.nav-link {
  position: relative;
}
.nav-link::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -6px;
  width: 0;
  height: 1px;
  background: rgba(52, 211, 153, 0.95);
  transition: width .25s ease;
}
.nav-link:hover::after {
  width: 100%;
}
.project-card,
.skill-card,
.fact-card,
.timeline-card {
  transition:
    transform .3s ease,
    border-color .3s ease,
    box-shadow .3s ease;
}
.project-card:hover,
.skill-card:hover,
.fact-card:hover,
.timeline-card:hover {
  transform: translateY(-6px);
  border-color: rgba(16,185,129,0.35);
  box-shadow:
    0 0 0 1px rgba(16,185,129,0.14),
    0 24px 80px rgba(0,0,0,0.48),
    0 0 35px rgba(16,185,129,0.10);
}
.floating-btn {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 50;
  transform: translateY(0);
  transition: all .3s ease;
}
.floating-btn.showing {
  opacity: 1;
  pointer-events: auto;
}
.floating-btn.hidden-state {
  opacity: 0;
  pointer-events: none;
  transform: translateY(18px);
}
::-webkit-scrollbar {
  width: 10px;
}
::-webkit-scrollbar-track {
  background: rgba(0,0,0,0.25);
}
::-webkit-scrollbar-thumb {
  background: rgba(16,185,129,0.35);
  border-radius: 999px;
}
::-webkit-scrollbar-thumb:hover {
  background: rgba(16,185,129,0.55);
}
input,
textarea,
button {
  transition:
    border-color .25s ease,
    background-color .25s ease,
    transform .25s ease,
    box-shadow .25s ease;
}
input:focus,
textarea:focus {
  box-shadow:
    0 0 0 1px rgba(16,185,129,0.2),
    0 0 20px rgba(16,185,129,0.08);
}
button:active {
  transform: scale(0.98);
}

@media (max-width: 768px) {
  .floating-btn {
    right: 14px;
    bottom: 14px;
  }
}