/* MoonBytes social links - tech neon edition */
:root{
  --mb-neon-cyan:#00eaff;
  --mb-neon-blue:#3b82ff;
  --mb-neon-violet:#8b5cf6;
  --mb-neon-pink:#ff3dbf;
  --mb-neon-lime:#b8ff2c;
  --mb-social-bg: rgba(8,10,18,.88);
  --mb-social-border: rgba(81,105,255,.28);
  --mb-social-text: #f5fbff;
  --mb-social-muted: #9fb0c7;
  --mb-social-card: rgba(12,16,28,.82);
  --mb-panel-glow: 0 0 0 1px rgba(122,142,255,.10), 0 0 34px rgba(0,234,255,.10), 0 0 72px rgba(139,92,246,.10), 0 18px 48px rgba(0,0,0,.36);
}

.mb-social-footer,
.mb-social-hub,
.mb-social-dock{
  position:relative;
  overflow:hidden;
  isolation:isolate;
}

.mb-social-footer::before,
.mb-social-hub::before,
.mb-social-dock::before{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:inherit;
  padding:1px;
  background:linear-gradient(120deg, rgba(0,234,255,.7), rgba(139,92,246,.8), rgba(255,61,191,.65), rgba(0,234,255,.7));
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
          mask-composite:exclude;
  opacity:.6;
  pointer-events:none;
}

.mb-social-footer::after,
.mb-social-hub::after,
.mb-social-dock::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:
    radial-gradient(circle at 12% 18%, rgba(0,234,255,.14), transparent 26%),
    radial-gradient(circle at 84% 24%, rgba(255,61,191,.12), transparent 28%),
    radial-gradient(circle at 70% 86%, rgba(139,92,246,.14), transparent 30%),
    linear-gradient(180deg, rgba(255,255,255,.03), transparent 28%);
  z-index:-1;
  pointer-events:none;
}

.mb-social-footer{
  margin-top:1.35rem;
  display:grid;
  grid-template-columns:minmax(240px,1.35fr) auto auto;
  gap:1rem;
  align-items:center;
  padding:1.1rem 1.15rem;
  border:1px solid rgba(67,85,200,.34);
  border-radius:1.4rem;
  background:
    linear-gradient(180deg, rgba(7,10,19,.96), rgba(9,12,24,.92)),
    linear-gradient(135deg, rgba(0,234,255,.06), rgba(139,92,246,.08));
  box-shadow:var(--mb-panel-glow);
}
.mb-social-footer-copy{min-width:0;position:relative;z-index:1;}
.mb-social-eyebrow,
.mb-social-label{
  font-size:.68rem;
  text-transform:uppercase;
  letter-spacing:.22em;
  color:#8bd7ff;
  text-shadow:0 0 10px rgba(0,234,255,.26);
  display:block;
}
.mb-social-footer-title{
  margin:.38rem 0 .18rem;
  font-size:1.08rem;
  line-height:1.2;
  color:#fff;
  text-shadow:0 0 18px rgba(0,234,255,.12);
}
.mb-social-footer-text{
  margin:0;
  color:#b6c7dc;
  font-size:.93rem;
  line-height:1.45;
}
.mb-social-links{
  display:flex;
  flex-wrap:wrap;
  gap:.72rem;
  position:relative;
  z-index:1;
}
.mb-social-link{
  --mb-glow: rgba(0,234,255,.22);
  --mb-border-hover: rgba(0,234,255,.78);
  --mb-text-hover: #fff;
  width:2.82rem;
  height:2.82rem;
  border-radius:9999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(123,145,255,.24);
  background:
    linear-gradient(180deg, rgba(17,22,40,.92), rgba(9,13,26,.96)),
    linear-gradient(135deg, rgba(0,234,255,.08), rgba(139,92,246,.10));
  color:var(--mb-social-text);
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease, color .22s ease, background .22s ease, filter .22s ease;
  box-shadow:0 0 0 1px rgba(255,255,255,.02), 0 10px 24px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.06);
  animation:mbSocialIn .55s ease both;
  backdrop-filter:blur(8px);
}
.mb-social-link:hover{
  transform:translateY(-3px) scale(1.06);
  border-color:var(--mb-border-hover);
  color:var(--mb-text-hover);
  filter:brightness(1.08);
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--mb-glow) 72%, transparent),
    0 0 20px var(--mb-glow),
    0 0 36px color-mix(in srgb, var(--mb-glow) 70%, transparent),
    0 12px 28px rgba(0,0,0,.34),
    inset 0 0 18px color-mix(in srgb, var(--mb-glow) 20%, transparent);
}
.mb-social-link:focus-visible{
  outline:none;
  border-color:var(--mb-border-hover);
  box-shadow:0 0 0 3px color-mix(in srgb, var(--mb-glow) 22%, transparent),0 0 22px var(--mb-glow),0 0 36px color-mix(in srgb, var(--mb-glow) 66%, transparent);
}
.mb-social-link svg{width:1.12rem;height:1.12rem;display:block;}
.mb-social-link[data-disabled="true"]{opacity:.45;cursor:not-allowed;}
.mb-social-link[data-disabled="true"]:hover{transform:none;border-color:rgba(123,145,255,.24);color:var(--mb-social-text);box-shadow:0 10px 24px rgba(0,0,0,.28);}

.mb-social-link.is-instagram,
.mb-social-card.is-instagram{ --mb-glow: rgba(255,61,191,.44); --mb-border-hover: rgba(255,93,202,.94); --mb-text-hover:#ffe2f5; }
.mb-social-link.is-tiktok,
.mb-social-card.is-tiktok{ --mb-glow: rgba(0,234,255,.42); --mb-border-hover: rgba(72,255,246,.98); --mb-text-hover:#dffffd; }
.mb-social-link.is-youtube,
.mb-social-card.is-youtube{ --mb-glow: rgba(255,47,47,.42); --mb-border-hover: rgba(255,84,84,.95); --mb-text-hover:#ffe0e0; }
.mb-social-link.is-x,
.mb-social-card.is-x{ --mb-glow: rgba(255,255,255,.26); --mb-border-hover: rgba(255,255,255,.82); --mb-text-hover:#fff; }
.mb-social-link.is-facebook,
.mb-social-card.is-facebook{ --mb-glow: rgba(59,130,255,.40); --mb-border-hover: rgba(115,175,255,.96); --mb-text-hover:#e3efff; }

.mb-social-cta{
  position:relative;
  z-index:1;
  white-space:nowrap;
  padding:.88rem 1.05rem;
  border-radius:999px;
  border:1px solid rgba(0,234,255,.35);
  background:linear-gradient(135deg, rgba(10,18,39,.95), rgba(31,21,68,.95));
  color:#fff;
  text-decoration:none;
  font-weight:700;
  letter-spacing:.02em;
  box-shadow:0 0 18px rgba(0,234,255,.12), inset 0 1px 0 rgba(255,255,255,.08);
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease, filter .2s ease;
}
.mb-social-cta:hover{
  transform:translateY(-2px);
  filter:brightness(1.08);
  box-shadow:0 0 18px rgba(0,234,255,.18), 0 0 30px rgba(139,92,246,.16), 0 12px 26px rgba(0,0,0,.28);
  border-color:rgba(107,240,255,.72);
}

.mb-social-dock{
  position:fixed;
  right:1rem;
  top:50%;
  transform:translateY(-50%);
  z-index:60;
  display:flex;
  flex-direction:column;
  gap:.8rem;
  padding:.92rem;
  border:1px solid rgba(67,85,200,.38);
  border-radius:1.45rem;
  background:linear-gradient(180deg, rgba(8,10,18,.92), rgba(8,10,20,.82));
  backdrop-filter:blur(12px);
  box-shadow:var(--mb-panel-glow);
}
.mb-social-dock-toggle{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  min-height:2.8rem;
  padding:.7rem .92rem;
  border-radius:999px;
  border:1px solid rgba(0,234,255,.28);
  background:linear-gradient(135deg, rgba(0,234,255,.11), rgba(139,92,246,.16) 50%, rgba(255,61,191,.12));
  color:#fff;
  font:inherit;
  font-weight:800;
  letter-spacing:.02em;
  cursor:pointer;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07), 0 0 18px rgba(0,234,255,.08);
}
.mb-social-dock-toggle span{ text-shadow:0 0 12px rgba(0,234,255,.16); }
.mb-social-dock-links{display:flex;flex-direction:column;gap:.72rem;}
.mb-social-dock.is-collapsed .mb-social-dock-links{display:none;}
.mb-social-dock .mb-social-link.is-compact{width:2.5rem;height:2.5rem;}

.mb-social-hub{
  margin:1.6rem auto;
  width:min(1180px, calc(100% - 2rem));
  padding:1.2rem;
  border:1px solid rgba(67,85,200,.34);
  border-radius:1.55rem;
  background:
    linear-gradient(180deg, rgba(8,11,19,.95), rgba(10,12,24,.92)),
    linear-gradient(135deg, rgba(0,234,255,.05), rgba(139,92,246,.06));
  box-shadow:var(--mb-panel-glow);
}
.mb-social-hub__copy{position:relative;z-index:1;}
.mb-social-hub__copy h2{
  margin:.34rem 0 .35rem;
  color:#fff;
  line-height:1.1;
  text-shadow:0 0 22px rgba(0,234,255,.08);
}
.mb-social-hub__copy p{
  margin:0 0 1rem;
  color:#b9cade;
  max-width:58rem;
}
.mb-social-hub__grid{display:grid;grid-template-columns:repeat(5, minmax(0, 1fr));gap:.9rem;position:relative;z-index:1;}
.mb-social-card{
  --mb-glow: rgba(0,234,255,.22);
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:.84rem;
  min-width:0;
  padding:1rem;
  border-radius:1.2rem;
  border:1px solid rgba(109,126,255,.22);
  background:
    linear-gradient(180deg, rgba(17,22,40,.82), rgba(10,13,26,.94)),
    linear-gradient(135deg, rgba(0,234,255,.06), rgba(139,92,246,.08));
  color:#fff;
  text-decoration:none;
  transition:transform .22s ease, border-color .22s ease, box-shadow .22s ease, filter .22s ease;
  box-shadow:0 12px 24px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.05);
}
.mb-social-card:hover{
  transform:translateY(-3px);
  filter:brightness(1.05);
  border-color:var(--mb-border-hover);
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--mb-glow) 46%, transparent),
    0 0 22px color-mix(in srgb, var(--mb-glow) 55%, transparent),
    0 16px 32px rgba(0,0,0,.28);
}
.mb-social-card__icon{
  width:2.7rem;
  height:2.7rem;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.08);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05), 0 0 14px color-mix(in srgb, var(--mb-glow) 20%, transparent);
}
.mb-social-card__icon svg{width:1.18rem;height:1.18rem;display:block;}
.mb-social-card__body{min-width:0;display:flex;flex-direction:column;gap:.2rem;}
.mb-social-card__body strong{font-size:.99rem;line-height:1.15;}
.mb-social-card__body span{font-size:.82rem;color:var(--mb-social-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.mb-social-card__cta{font-size:.78rem;font-weight:800;letter-spacing:.04em;color:#dffaff;text-transform:uppercase;text-shadow:0 0 10px rgba(0,234,255,.18);}

@media (max-width: 1200px){
  .mb-social-hub__grid{grid-template-columns:repeat(3, minmax(0, 1fr));}
}
@media (max-width: 900px){
  .mb-social-footer{grid-template-columns:1fr;align-items:flex-start;}
  .mb-social-dock{
    left:50%;
    right:auto;
    top:auto;
    bottom:1rem;
    transform:translateX(-50%);
    flex-direction:column;
    align-items:stretch;
    width:min(calc(100vw - 1rem), 430px);
    padding:.78rem;
    border-radius:1.25rem;
  }
  .mb-social-dock-links{flex-direction:row;justify-content:center;flex-wrap:wrap;}
  .mb-social-hub__grid{grid-template-columns:repeat(2, minmax(0, 1fr));}
}
@media (max-width: 640px){
  .mb-social-hub{width:min(100%, calc(100% - 1rem));padding:1rem;}
  .mb-social-hub__grid{grid-template-columns:1fr;}
  .mb-social-links{gap:.55rem;}
  .mb-social-link{width:2.5rem;height:2.5rem;}
  .mb-social-card{grid-template-columns:auto 1fr;}
  .mb-social-card__cta{grid-column:2;}
}
@keyframes mbSocialIn{
  from{opacity:0;transform:translateY(8px) scale(.96)}
  to{opacity:1;transform:translateY(0) scale(1)}
}