/* =========================================================
   KARMASBOX LINKS PAGE
   Purple / black social hub
   ========================================================= */

.kb-links-page{
  width:100%;
  min-width:0;
  padding:26px 0 44px;
}

.kb-links-shell{
  width:min(760px, calc(100% - 28px));
  margin:0 auto;
  padding:34px;
  border:1px solid rgba(167,139,250,.18);
  border-radius:22px;
  background:
    radial-gradient(circle at 50% 0%, rgba(139,92,246,.17), transparent 42%),
    linear-gradient(180deg, rgba(18,13,28,.98), rgba(7,6,10,.98));
  box-shadow:
    0 22px 70px rgba(0,0,0,.42),
    0 0 34px rgba(139,92,246,.08),
    inset 0 1px 0 rgba(255,255,255,.035);
}

.kb-links-brand{
  text-align:center;
  margin-bottom:28px;
}

.kb-links-logo{
  display:block;
  width:min(250px, 70vw);
  max-height:150px;
  object-fit:contain;
  margin:0 auto 16px;
  filter:drop-shadow(0 0 22px rgba(139,92,246,.20));
}

.kb-links-kicker{
  margin-bottom:7px;
  color:#a78bfa;
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.22em;
  text-transform:uppercase;
}

.kb-links-brand h1{
  margin:0;
  color:#fff;
  font-size:clamp(2rem, 5vw, 3rem);
  line-height:1;
  letter-spacing:-.035em;
}

.kb-links-brand p{
  max-width:560px;
  margin:12px auto 0;
  color:rgba(255,255,255,.66);
  font-size:.96rem;
  line-height:1.6;
}

.kb-links-list{
  display:grid;
  gap:11px;
}

.kb-social-link{
  position:relative;
  display:grid;
  grid-template-columns:52px minmax(0,1fr) 24px;
  align-items:center;
  gap:14px;
  min-height:78px;
  padding:12px 18px 12px 14px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.085);
  border-radius:14px;
  background:
    linear-gradient(90deg, rgba(139,92,246,.07), rgba(139,92,246,.015) 48%, transparent),
    rgba(7,7,10,.90);
  color:#fff;
  text-decoration:none;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
  transition:
    transform .16s ease,
    border-color .16s ease,
    box-shadow .16s ease,
    background .16s ease;
}

.kb-social-link::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:3px;
  background:#8b5cf6;
  opacity:.70;
}

.kb-social-link:hover,
.kb-social-link:focus-visible{
  transform:translateY(-2px);
  border-color:rgba(167,139,250,.42);
  background:
    linear-gradient(90deg, rgba(139,92,246,.14), rgba(139,92,246,.035) 52%, transparent),
    rgba(9,8,13,.97);
  box-shadow:
    0 12px 28px rgba(0,0,0,.26),
    0 0 22px rgba(139,92,246,.10);
}

.kb-social-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:52px;
  height:52px;
  border:1px solid rgba(167,139,250,.24);
  border-radius:12px;
  background:rgba(139,92,246,.10);
  color:#fff;
  font-size:1.45rem;
  font-weight:950;
  box-shadow:inset 0 0 18px rgba(139,92,246,.055);
}

.kb-social-copy{
  min-width:0;
}

.kb-social-copy strong{
  display:block;
  margin-bottom:3px;
  color:#fff;
  font-size:1rem;
  font-weight:900;
  letter-spacing:.01em;
}

.kb-social-copy small{
  display:block;
  overflow:hidden;
  color:rgba(255,255,255,.58);
  font-size:.78rem;
  line-height:1.35;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.kb-social-arrow{
  color:#a78bfa;
  font-size:1.8rem;
  font-weight:500;
  line-height:1;
  transition:transform .16s ease, color .16s ease;
}

.kb-social-link:hover .kb-social-arrow{
  transform:translateX(3px);
  color:#fff;
}

.kb-social-link--instagram::before{ background:#c084fc; }
.kb-social-link--youtube::before{ background:#a78bfa; }
.kb-social-link--facebook::before{ background:#7c3aed; }

.kb-social-link.is-placeholder{
  cursor:default;
}

.kb-social-link.is-placeholder:hover{
  transform:none;
}

.kb-links-footer{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  margin-top:24px;
  color:rgba(255,255,255,.48);
  font-size:.74rem;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.kb-links-dot{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#8b5cf6;
  box-shadow:0 0 12px rgba(139,92,246,.65);
}

@media (max-width:640px){
  .kb-links-page{
    padding-top:18px;
  }

  .kb-links-shell{
    width:min(100% - 18px, 760px);
    padding:24px 15px;
    border-radius:17px;
  }

  .kb-links-brand{
    margin-bottom:22px;
  }

  .kb-social-link{
    grid-template-columns:46px minmax(0,1fr) 18px;
    gap:11px;
    min-height:70px;
    padding:10px 13px 10px 11px;
  }

  .kb-social-icon{
    width:46px;
    height:46px;
    font-size:1.25rem;
  }

  .kb-social-copy small{
    white-space:normal;
  }
}