*,*:before,*:after{margin:0;padding:0;box-sizing:border-box;border:none;outline:none}a,a:link,a:visited{color:inherit;text-decoration:none}ul,li{list-style:none}img,picture,video,canvas,svg{display:block;max-width:100%}button{cursor:pointer;background-color:transparent;font:inherit}input,button,textarea,select{font:inherit}body{font-family:Poppins,sans-serif;font-weight:500;font-size:18px;background-color:#fff}p{line-height:1.6;color:#9e9aa7}h1,h2,h3,h4,h5,h6{color:#35323e;font-weight:700}.container{width:88%;max-width:1100px;margin-left:auto;margin-right:auto}.btn{background-color:#2acfcf;color:#fff;padding:10px 32px;transition:opacity .2s ease;font-weight:700}.btn.rounded{border-radius:9999px}.btn.cornered{border-radius:8px}.btn.secondary{background-color:#3b3054}.btn:hover{opacity:.8}.logo{cursor:pointer}header{background-color:#fff;margin-top:40px}header .header-mobile{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}header .header-mobile i.fa-bars{font-size:26px}header .header-desktop{display:flex;align-items:center;gap:52px;margin-bottom:64px;display:none}header .header-desktop .links{flex:1;display:flex;gap:28px}header .header-desktop .links .link{color:#9e9aa7;transition:color .2s ease;font-weight:700;cursor:pointer}header .header-desktop .links .link:hover{color:#35323e}header .header-desktop .user-actions{display:flex;align-items:center;gap:36px}header .header-desktop .user-actions .login-link{color:#9e9aa7;transition:color .2s ease;font-weight:700;cursor:pointer}header .header-desktop .user-actions .login-link:hover{color:#35323e}header .mobile-navigation{background-color:#3b3054;color:#fff;padding:36px 24px;border-radius:8px;text-align:center;font-weight:700;position:absolute;z-index:1;width:330px}header .mobile-navigation .links{display:flex;flex-direction:column;gap:32px;padding-bottom:28px;border-bottom:1px solid hsla(0,0%,75%,.7);margin-bottom:28px}header .mobile-navigation .user-actions{display:flex;flex-direction:column;gap:24px}#hero{overflow-x:hidden;padding-bottom:180px}#hero .hero-img{max-width:unset;width:500px;margin-left:24px;margin-bottom:36px}#hero .text-content{text-align:center}#hero .text-content h1{font-size:36px;line-height:1.2;overflow-y:hidden}#hero .text-content .hero-description{margin-top:8px;margin-bottom:32px}#url-shorter{background-color:#e9e8e8cc}#url-shorter .url-shorter-wrapper{position:relative;top:-80px}#url-shorter .url-shorter-wrapper .actions{background-color:#3b3054;display:flex;flex-direction:column;border-radius:8px;padding:20px;position:relative}#url-shorter .url-shorter-wrapper .actions>*:not(.bg-shorten-img){z-index:2}#url-shorter .url-shorter-wrapper .actions .bg-shorten-img{position:absolute;z-index:1;top:0;right:0}#url-shorter .url-shorter-wrapper .actions .url-input{padding:12px;border-radius:8px;margin-bottom:4px}#url-shorter .url-shorter-wrapper .actions .url-input.error{border:3px solid hsl(0,87%,67%)}#url-shorter .url-shorter-wrapper .actions .url-input.error::placeholder{opacity:.5;color:#f46262}#url-shorter .url-shorter-wrapper .actions .url-input::placeholder{color:#9e9aa7}#url-shorter .url-shorter-wrapper .actions .error-message{font-size:14px;color:#f46262;font-style:italic}#url-shorter .url-shorter-wrapper .actions .btn{margin-top:16px}#url-shorter .url-shorter-wrapper .loading{display:flex;align-items:center;justify-content:center;margin-top:24px;gap:12px}#url-shorter .url-shorter-wrapper .loading .circle{width:18px;height:18px;border:1px solid hsl(257,27%,26%);border-radius:50%;animation:animateLoading .5s ease infinite alternate}#url-shorter .url-shorter-wrapper .loading .triangle{border-left:10px solid transparent;border-right:10px solid transparent;border-bottom:20px solid hsl(257,27%,26%);animation:animateLoading .5s .2s ease infinite alternate}#url-shorter .url-shorter-wrapper .loading .square{width:16px;height:16px;border:1px solid hsl(257,27%,26%);animation:animateLoading .5s .3s ease infinite alternate}@keyframes animateLoading{0%{transform:translateY(0)}to{transform:translateY(-8px)}}#url-shorter .url-shorter-wrapper .shortened-urls{margin-top:24px;display:flex;flex-direction:column;gap:24px;font-size:16px;position:static;z-index:2}#url-shorter .url-shorter-wrapper .shortened-urls .links-wrapper{background-color:#fff;border-radius:8px;padding:16px;position:relative}#url-shorter .url-shorter-wrapper .shortened-urls .links-wrapper:before{content:"";position:absolute;left:0;top:52px;background-color:#bfbfbfb3;width:100%;height:1px}#url-shorter .url-shorter-wrapper .shortened-urls .links-wrapper .full-url{margin-bottom:24px;display:inline-block;width:28ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#url-shorter .url-shorter-wrapper .shortened-urls .links-wrapper .shortened-link{display:flex;flex-direction:column;gap:12px}#url-shorter .url-shorter-wrapper .shortened-urls .links-wrapper .shortened-link .link{color:#2acfcf}#features{background-color:#e9e8e8cc;padding-bottom:80px}#features .introduction{text-align:center;margin-bottom:96px}#features .introduction .title{font-size:28px;margin-bottom:20px}#features .features-wrapper{display:flex;flex-direction:column;gap:96px}#features .features-wrapper .feature{background-color:#fff;text-align:center;border-radius:8px;padding:0 28px 36px;position:relative}#features .features-wrapper .feature:not(:last-child):before{content:"";position:absolute;width:8px;height:56px;background-color:#2acfcf;left:50%;bottom:-56px;transform:translate(-50%)}#features .features-wrapper .feature .img-wrapper{display:inline-block;margin:-40px auto 32px;background-color:#3b3054;padding:20px;border-radius:50%}#features .features-wrapper .feature .img-wrapper .img{width:40px;height:40px}#features .features-wrapper .feature .title{margin-bottom:12px;font-size:20px}#features .features-wrapper .feature .description{font-size:16px}#get-started{background-color:#3b3054;height:300px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:16px;position:relative}#get-started>*{position:static;z-index:2}#get-started .bg-img{position:absolute;top:0;right:0}#get-started .title{color:#fff;font-size:26px}footer{background-color:#232127;padding:52px 0;font-size:15px}footer .footer-wrapper{display:flex;flex-direction:column;justify-content:center;align-items:center}footer .footer-wrapper svg.logo{margin-bottom:56px}footer .footer-wrapper svg.logo path{fill:#fff}footer .footer-wrapper .site-map{display:flex;flex-direction:column;gap:40px;text-align:center}footer .footer-wrapper .site-map a{color:#bfbfbfb3;transition:color .2s ease}footer .footer-wrapper .site-map a:hover{color:#2acfcf}footer .footer-wrapper .site-map .site-links .link-title{color:#fff;margin-bottom:20px}footer .footer-wrapper .site-map .site-links .link-wrapper{display:flex;flex-direction:column;gap:12px}footer .footer-wrapper .site-map .social-media-links{display:flex;gap:24px}@media (width > 376px){header .header-mobile{display:none}header .header-desktop{display:flex;margin-bottom:80px}#hero{display:flex;flex-direction:row-reverse;align-items:center;gap:68px}#hero .hero-img{width:700px;margin-left:0;margin-bottom:0;margin-right:-100px}#hero .text-content{text-align:left;width:52ch;margin:unset}#hero .text-content h1{font-size:75px}#hero .text-content .hero-description{font-size:22px;width:42ch}#url-shorter .url-shorter-wrapper .actions{flex-direction:row;gap:24px;align-items:center;height:168px;padding:0 56px}#url-shorter .url-shorter-wrapper .actions .url-input{margin-bottom:unset;height:64px;padding:24px;flex:6}#url-shorter .url-shorter-wrapper .actions .error-message{position:absolute;left:80px;top:124px;font-size:15px}#url-shorter .url-shorter-wrapper .actions .btn{margin-top:unset;height:64px;flex:1}#url-shorter .url-shorter-wrapper .shortened-urls{font-size:18px}#url-shorter .url-shorter-wrapper .shortened-urls .links-wrapper{display:flex;justify-content:space-between;align-items:center}#url-shorter .url-shorter-wrapper .shortened-urls .links-wrapper:before{display:none}#url-shorter .url-shorter-wrapper .shortened-urls .links-wrapper .full-url{margin-bottom:0;display:inline-block;width:48ch}#url-shorter .url-shorter-wrapper .shortened-urls .links-wrapper .shortened-link{flex-direction:row;align-items:center;justify-content:end;gap:32px;width:41ch}#url-shorter .url-shorter-wrapper .shortened-urls .links-wrapper .shortened-link .btn{width:140px}#features .introduction{margin-bottom:96px}#features .introduction .title{font-size:40px}#features .introduction .description{width:45ch;margin-left:auto;margin-right:auto}#features .features-wrapper{flex-direction:row;align-items:flex-start;gap:28px}#features .features-wrapper .feature{text-align:left}#features .features-wrapper .feature:not(:last-child):before{display:none}#features .features-wrapper .feature:nth-child(1):after{content:"";position:absolute;background-color:#2acfcf;width:28px;height:8px;top:58%;right:-28px}#features .features-wrapper .feature:nth-child(2):after{content:"";position:absolute;background-color:#2acfcf;width:28px;height:8px;top:41%;right:-28px}#features .features-wrapper .feature:nth-child(2){margin-top:44px}#features .features-wrapper .feature:nth-child(3){margin-top:88px}#features .features-wrapper .feature .title{font-size:22px}#get-started{height:250px;gap:32px}#get-started .title{color:#fff;font-size:42px}footer .footer-wrapper{flex-direction:row;align-items:unset}footer .footer-wrapper svg.logo{margin-bottom:0;margin-right:56px;flex:1}footer .footer-wrapper .site-map{flex-direction:row;text-align:left;gap:84px}footer .footer-wrapper .site-map .social-media-links svg path:hover{fill:#2acfcf}}