.social-card{background:var(--card-inner-bg);cursor:pointer;border-radius:8px;justify-content:center;align-items:center;width:220px;height:220px;transition:transform .4s;display:flex;position:relative;overflow:hidden;box-shadow:0 18px 45px #00000073}.social-card .background{z-index:0;opacity:0;background:radial-gradient(circle at 50% 115%,var(--social-glow),transparent 70%);transition:opacity .5s;position:absolute;inset:0}.social-card:hover .background{opacity:1}.social-card .logo{z-index:2;font-size:var(--fs-label);color:var(--text-label);line-height:1.5;transition:opacity .3s,transform .3s;position:absolute}.social-card:hover .logo{opacity:0;transform:scale(.85)}.social-card .box{z-index:3;color:#fff;opacity:0;border-radius:16px;justify-content:center;align-items:center;width:50px;height:50px;transition:top .5s cubic-bezier(.2,.8,.2,1),left .5s cubic-bezier(.2,.8,.2,1),transform .5s cubic-bezier(.2,.8,.2,1),opacity .4s,box-shadow .2s,filter .2s;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)scale(.4)}.social-card .icon{justify-content:center;align-items:center;display:flex}.social-card .svg{fill:#fff;width:24px;height:24px}.social-card .box1{background:#000}.social-card .box2{background:#0a66c2}.social-card .box3{background:#181717}.social-card .box4{display:none}.social-card:hover .box1{opacity:1;top:58%;left:24%;transform:translate(-50%,-50%)rotate(-20deg)scale(1)}.social-card:hover .box2{opacity:1;top:30%;left:50%;transform:translate(-50%,-50%)rotate(0)scale(1)}.social-card:hover .box3{opacity:1;top:58%;left:76%;transform:translate(-50%,-50%)rotate(20deg)scale(1)}.social-card .box1:hover,.social-card .box2:hover,.social-card .box3:hover{z-index:5;filter:brightness(1.08);transform:translate(-50%,-50%)rotate(0)scale(1.16);box-shadow:0 12px 26px #00000073;transition-delay:0s!important}@media (prefers-reduced-motion:reduce){.social-card,.social-card .background,.social-card .logo,.social-card .box{transition:none}}.contact-social{width:calc(100% + 16px);margin-bottom:-8px}.contact-social .social-card{width:100%;height:130px;box-shadow:none;border:1px solid var(--border-card);transition:border-color .2s,transform .4s}.contact-social .social-card:hover{border-color:var(--hairline-strong)}.contact-card:has(.social-card:hover) .contact-hover-layer{opacity:0!important}
