@import "https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,100..900;1,9..144,100..900&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap";@import "https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,100..900;1,9..144,100..900&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap";@import "https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,100..900;1,9..144,100..900&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap";@import "https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,100..900;1,9..144,100..900&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap";*{box-sizing:border-box;margin:0;padding:0}header{position:sticky;top:0}.containerNavbar{justify-content:center;width:100%;max-width:1940px;margin-top:10px;padding:0 20px;display:flex}.navbar{justify-content:space-between;align-items:center;height:100%;margin:10px;display:flex}.navbarList{justify-content:center;align-items:center;width:100%;height:100%;margin:10px;display:flex}.navbarLogo{align-items:center;font-size:1.5rem;font-style:italic;font-weight:900;text-decoration:none;display:flex}.navbarLogo img{height:36px;margin-right:20px}.navbarNav{justify-content:center;align-self:center;align-items:center;display:flex}.navList{justify-content:center;list-style:none;display:flex}.box{float:left;text-align:center;text-transform:uppercase;background:0 0;width:140px;height:auto;margin:0 5px;padding:15px;font-weight:900;transition:all .5s linear;display:block;position:relative;overflow:hidden}.box:before{content:"";box-sizing:border-box;border-bottom:4px solid #0000;border-left:4px solid #0000;width:100%;height:4px;position:absolute;bottom:0;left:0;transform:translate(100%)}.box:after{content:"";box-sizing:border-box;border-top:4px solid #0000;border-right:4px solid #0000;width:100%;height:4px;position:absolute;top:0;left:0;transform:translate(-100%)}.box:hover{box-shadow:0 5px 15px #00000080}.box:hover:before{border-color:#d96e3a;height:100%;transition:transform .3s linear,height .3s linear .3s;transform:translate(0)}.box:hover:after{border-color:#d96e3a;height:100%;transition:transform .3s linear,height .3s linear .5s;transform:translate(0)}.buttonNav{color:#fff;cursor:pointer;background:0 0;border:none;outline:none;font-family:Inter,sans-serif;font-size:16px;font-weight:500;text-decoration:none}.buttonMerc{cursor:pointer;color:#fff;background-color:#0000;border:2px solid #454545;border-radius:30px;width:135px;height:54px;font-family:Inter,sans-serif;transition:all .5s ease-in-out;position:relative;overflow:hidden}.btn-txt{z-index:1;letter-spacing:4px;font-size:16px;font-weight:800}.type1:after{content:"";visibility:hidden;z-index:-1;background-color:#d96e3a;border-radius:30px;width:10px;height:10px;transition:all .5s ease-in-out;position:absolute;top:0;left:0}.buttonMerc:hover{color:#fff;border:none;box-shadow:1px 1px 200px #252525}.type1:hover:after{visibility:visible;transform:scale(100)translate(2px)}.section-info{border-width:1px;border-color:#333;border-top-style:solid;border-bottom-style:solid;justify-content:center;align-items:center;width:100%;padding:1%;display:flex;position:absolute;bottom:0}.button-info{color:#e1e1e1;cursor:pointer;text-transform:uppercase;background:0 0;border:none;padding-inline:2%;font-family:Inter,sans-serif;font-size:16px;font-weight:500;transition-property:color;transition-duration:.4s;transition-timing-function:cubic-bezier(.25,.8,.25,1);position:relative}.button-info:focus,.button-info:hover{color:#fff}.button-info:focus:after,.button-info:hover:after{width:100%;left:0%}.button-info:after{content:"";pointer-events:none;background-color:#fff;width:0%;height:2px;transition-property:width,left;transition-duration:.4s;transition-timing-function:cubic-bezier(.25,.8,.25,1);position:absolute;bottom:-2px;left:50%}.section-landing{align-items:center;height:80vh;display:flex}.opening-sentence{color:#fff;font-family:Fraunces,serif;font-size:128px;font-weight:500}.opening-middle-sentence{color:#d96e3a;font-family:Fraunces,serif;font-size:128px;font-style:italic;font-weight:500}.second-sentence{color:#fff;margin-top:10px;font-family:Fraunces,serif;font-size:24px;font-weight:500}.section-sentences{padding:5%}.animated-button{color:#fff;cursor:pointer;background-color:#d96e3a;border-color:#0000;border-radius:100px;align-items:center;gap:4px;margin-top:10%;padding:16px 36px;font-family:Inter,sans-serif;font-size:20px;font-weight:600;transition:all .6s cubic-bezier(.23,1,.32,1);display:flex;position:relative;overflow:hidden;box-shadow:0 0 0 1px #d96e3a}.animated-button svg{fill:#fff;z-index:9;width:24px;transition:all .8s cubic-bezier(.23,1,.32,1);position:absolute}.animated-button .arr-1{right:16px}.animated-button .arr-2{left:-25%}.animated-button .circle{opacity:0;background-color:#d96e3a;border-radius:50%;width:20px;height:20px;transition:all .8s cubic-bezier(.23,1,.32,1);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.animated-button .text{z-index:1;transition:all .8s cubic-bezier(.23,1,.32,1);position:relative;transform:translate(-12px)}.animated-button:hover{color:#fff;border-radius:12px;box-shadow:0 0 0 12px #0000}.animated-button:hover .arr-1{right:-25%}.animated-button:hover .arr-2{left:16px}.animated-button:hover .text{transform:translate(12px)}.animated-button:hover svg{fill:#fff}.animated-button:active{scale:.95;box-shadow:0 0 0 4px #fff}.animated-button:hover .circle{opacity:1;width:220px;height:220px}.card{background:#fff;border-radius:32px;width:280px;height:280px;padding:3px;transition:all .5s ease-in-out;position:relative;box-shadow:0 70px 30px -50px #604b4a30}.card .mail{cursor:pointer;background:0 0;border:none;position:absolute;top:1.4rem;right:2rem}.card .mail svg{stroke:#000;stroke-width:3px}.card .mail svg:hover{stroke:#d96e3a}.card .profile-pic{z-index:1;border:0 solid #000;border-radius:29px;width:calc(100% - 6px);height:calc(100% - 6px);transition:all .5s ease-in-out .2s,z-index .5s ease-in-out .2s;position:absolute;top:3px;left:3px;overflow:hidden}.card .profile-pic img{-o-object-fit:cover;object-fit:cover;-o-object-position:0px 0px;object-position:0px 0px;width:100%;height:100%;transition:all .5s ease-in-out}.card .profile-pic svg{-o-object-fit:cover;object-fit:cover;-o-object-position:0px 0px;object-position:0px 0px;transform-origin:45% 20%;width:100%;height:100%;transition:all .5s ease-in-out}.card .bottom{z-index:2;background:#000;border-radius:29px;transition:all .5s cubic-bezier(.645,.045,.355,1);position:absolute;inset:80% 3px 3px;overflow:hidden;box-shadow:inset 0 5px 5px #604b4a30}.card .bottom .content{height:160px;position:absolute;bottom:0;left:1.5rem;right:1.5rem}.card .bottom .content .name{color:#fff;font-family:Fraunces,serif;font-size:24px;font-weight:500;display:block}.card .bottom .content .about-me{color:#fff;margin-top:1rem;font-family:Fraunces,serif;font-size:16px;font-weight:500;display:block}.card .bottom .bottom-bottom{justify-content:space-between;align-items:center;display:flex;position:absolute;bottom:1rem;left:1.5rem;right:1.5rem}.card .bottom .bottom-bottom .social-links-container{gap:1rem;display:flex}.card .bottom .bottom-bottom .social-links-container svg{fill:#fff;filter:drop-shadow(0 5px 5px #a5848222);cursor:pointer;height:20px}.card .bottom .bottom-bottom .social-links-container svg:hover{fill:#d96e3a;transform:scale(1.2)}.card .bottom .bottom-bottom .button{color:#000;cursor:pointer;background:#fff;border:none;border-radius:20px;padding:.4rem .6rem;font-family:Fraunces,serif;font-size:.6rem;font-weight:500;box-shadow:0 5px 5px #a5848222}.card .bottom .bottom-bottom .button:hover{color:#fff;background:#d96e3a}.card:hover{border-top-left-radius:55px}.card:hover .bottom{border-radius:80px 29px 29px;transition:all .5s cubic-bezier(.645,.045,.355,1) .2s;top:20%}.card:hover .profile-pic{aspect-ratio:1;z-index:3;border:7px solid #fff;border-radius:50%;width:100px;height:100px;transition:all .5s ease-in-out,z-index .5s ease-in-out .1s;top:10px;left:10px;box-shadow:0 5px 5px #604b4a30}.card:hover .profile-pic:hover{border-radius:0;transform:scale(1.3)}.card:hover .profile-pic img{-o-object-position:0px 25px;object-position:0px 25px;transition:all .5s ease-in-out .5s;transform:scale(2.5)}.card:hover .profile-pic svg{transition:all .5s ease-in-out .5s;transform:scale(2.5)}.cards-container{justify-content:center;align-items:center;min-height:80vh;display:flex}.App{background-color:#000;background-position:50%;background-repeat:no-repeat;background-size:cover;flex-direction:column;min-height:100vh;margin:0;display:flex;position:relative}
