body{
  min-height: 100dvh;
}
main{
  min-height:100dvh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:
    clamp(60px, 10vw, 120px)
    clamp(16px, 4vw, 32px)
    clamp(24px, 5vw, 40px);
}

.social-hub{
  margin-top: 20px;
}

.social-label{
  margin-bottom: 12px;

  font-size: 0.72rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;

  color: var(--text-soft);

  opacity: 0.65;
}

.social-links{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
}

.social-btn{
  padding:
    10px
    16px;

  border-radius: 999px;

  text-decoration: none;

  font-size: 0.84rem;
  font-weight: 600;

  color: var(--text);

  background:
    rgba(255,255,255,0.04);

  border:
    1px solid var(--border);

  backdrop-filter: blur(10px);

  transition:
    transform .25s ease,
    background .25s ease,
    border-color .25s ease;
}

.social-btn:hover{
  transform: translateY(-2px);

  background:
    rgba(255,255,255,0.06);

  border-color:
    color-mix(in srgb, var(--accent) 30%, var(--border));
}