body{background-color:#fff;justify-content:center;align-items:center;height:100vh;margin:0;padding:0;font-family:sans-serif;display:flex;overflow:hidden}.social-container{flex-wrap:wrap;justify-content:center;gap:80px;display:flex}.btn-wrapper{border-radius:40px;width:180px;height:180px;position:relative;overflow:hidden}.btn-wrapper:before{content:"";background-color:var(--brand-color);z-index:-1;border-radius:40px;width:100%;height:100%;transition:transform .4s ease-in-out,border-radius .4s ease-in-out;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)scale(0)}.btn-wrapper:hover:before{border-radius:50%;transition:transform .8s ease-in-out,border-radius .8s ease-in-out;transform:translate(-50%,-50%)scale(2.5)}.social-btn{cursor:pointer;width:100%;height:100%;box-shadow:var(--btn-shadow);background-color:#fff;border:none;border-radius:40px;justify-content:center;align-items:center;text-decoration:none;transition:transform .4s ease-in-out,box-shadow .4s ease-in-out,background-color .4s ease-in-out;display:flex}.btn-wrapper:hover .social-btn{box-shadow:none;background-color:#0000;transform:translateY(-8px)scale(1.03)}.social-btn svg{width:90px;height:90px;transition:transform .4s ease-in-out}.btn-wrapper:hover .social-btn svg{transition:transform .8s ease-in-out;transform:scale(1.1)}.social-btn svg path{transition:fill .4s ease-in-out}.btn-wrapper:hover .social-btn svg path{fill:#fff;transition:fill .8s ease-in-out}.btn-wrapper.btn-gmail:hover .gm-blue,.btn-wrapper.btn-gmail:hover .gm-green{fill:inherit}.btn-wrapper.btn-gmail:hover .gm-red,.btn-wrapper.btn-gmail:hover .gm-yellow{fill:#fff}.btn-linkedin{--brand-color:#0077b5;--btn-shadow:0px 0px 30px 8px #0077b566}.btn-github{--brand-color:#24292e;--btn-shadow:0px 0px 30px 8px #0006}.btn-gmail{--brand-color:#ea4335;--btn-shadow:0px 0px 30px 8px #ea433566}.btn-medium{--brand-color:#000;--btn-shadow:0px 0px 30px 8px #000c}.contact-wrapper{background-color:#f9f9f9;justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:relative;overflow:hidden}.bg-shapes-container{pointer-events:none;z-index:0;width:100%;height:100%;position:absolute;top:0;left:0}.shape-wrapper{z-index:-1;opacity:.8;animation:ease-in-out infinite alternate floatContact;position:absolute}.contact-bg-shape{transform-origin:50%;width:100%;height:100%;transition:background-color .6s,transform 1.2s cubic-bezier(.25,1,.5,1)}.contact-bg-shape.hovered{transform:rotate(540deg)scale(1.25)}@keyframes floatContact{0%{transform:translate(0)rotate(0)}33%{transform:translate(30px,-50px)rotate(120deg)}66%{transform:translate(-20px,20px)rotate(240deg)}to{transform:translate(0)rotate(360deg)}}.social-container{z-index:10;position:relative}