* { box-sizing: border-box; }

body, html {
  margin: 0; padding: 0;
  width: 100%; min-height: 100vh;
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  overflow-x: hidden;
  background-color: #000000;
}

#nill-link-hub {
  display: flex; flex-direction: column; align-items: center;
  padding: 50px 20px; min-height: 100vh; width: 100%;
  background: linear-gradient(270deg, #000000, #ef4523, #000000);
  background-size: 600% 600%;
  animation: abstractGradient 12s ease infinite;
  position: relative;
}

@keyframes abstractGradient {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

.profile-header { text-align: center; margin-bottom: 25px; width: 100%; }

.profile-pic {
  width: 90px; height: 90px; border-radius: 50%;
  /* Pulls from your GitHub file */
  background: #333 url('profile-pic.png') center/cover;
  margin: 0 auto; border: 2px solid #fff; box-shadow: 0 0 25px rgba(0,0,0,0.6);
}

.logo-wrapper { margin: 15px auto 0; display: flex; justify-content: center; }
.nill-logo { width: 90px; height: auto; filter: drop-shadow(0px 4px 8px rgba(0, 0, 0, 0.8)); }

.link-container { width: 100%; max-width: 500px; padding-bottom: 60px; }
.section-title { color: #fff; font-size: 11px; letter-spacing: 4px; text-align: center; margin-bottom: 20px; margin-top: 15px; opacity: 0.9; }

.nill-button {
  display: flex; align-items: center; justify-content: center;
  background: #fff; color: #000;
  text-align: center; text-decoration: none;
  padding: 18px; margin-bottom: 12px; border-radius: 10px;
  font-weight: 700; font-size: 15px;
  transition: transform 0.1s ease, background 0.2s ease;
  box-shadow: 0 4px 15px rgba(0,0,0,0.3);
}

.button-row { display: flex; gap: 12px; margin-bottom: 12px; }
.button-row .nill-button { flex: 1; margin-bottom: 0; font-size: 13px; }

.flip {
  background: rgba(0, 0, 0, 0.7); backdrop-filter: blur(10px);
  color: #fff; border: 1px solid rgba(255,255,255,0.8);
}

.nill-button:hover { background: #ef4523; color: #fff; border-color: #ef4523; }
.nill-button:active { transform: scale(0.95); }

.bio-column {
  background: rgba(0, 0, 0, 0.7); backdrop-filter: blur(10px);
  color: #fff; padding: 30px; border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  line-height: 1.6; font-size: 15px; text-align: left;
  margin-bottom: 25px;
}

.bio-column h4 { color: #ef4523; margin: 25px 0 10px 0; text-transform: uppercase; font-size: 17px; }
.bio-column ul { margin: 10px 0 20px 20px; padding: 0; }
.bio-column li { margin-bottom: 8px; }