@charset "UTF-8";html{font-size:62.5%;box-sizing:border-box;scroll-behavior:smooth}body{width:100%;min-height:100vh;font-family:Alata,sans-serif;font-size:1.5rem;font-weight:400;line-height:.9;display:flex;flex-direction:column}@media (width > 1440.98px){.wrapper{min-width:1440px;margin:0 auto}}@font-face{font-family:Alata;src:url(/My-practices-in-the-frontend-mentor/demo/junior/loopstudios-landing-page-demo/assets/Alata-Regular-CoX9Ek0D.ttf);font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Josefin;src:url(/My-practices-in-the-frontend-mentor/demo/junior/loopstudios-landing-page-demo/assets/JosefinSans-Light-CSbVnX16.ttf);font-style:normal;font-weight:300;font-display:wrap}*{padding:0;margin:0}*,*:before,*:after{box-sizing:border-box}a,a:link,a:visited,a:hover{text-decoration:none;cursor:pointer}aside,nav,footer,header,section,main{display:block}ul,ol{list-style:none}li{list-style-type:none}img{vertical-align:top;max-width:100%;height:auto}svg{max-width:100%;height:auto}address{font-style:normal}input,textarea,button,select{font-family:inherit;font-size:inherit;color:inherit;background-color:transparent}input::-ms-clear{display:none}button,input[type=submit]{display:inline-block;box-shadow:none;background:none;cursor:pointer}input[type=file]{max-width:100%}input[type=text]:focus,textarea[type=text]:focus,button[type=button]:focus,select:focus{outline:none}button{border:none}.no-display{display:none}.diaply-block{display:block}.header{display:flex;justify-content:space-between;align-items:center}.header__logo{z-index:1050}@media (width <= 767.98px){.header__logo{width:24rem}}.main{background-color:#fff;padding:16rem clamp(3.2rem,-.2815533981px + 8.6084142395vw,16.5rem) 19rem;display:flex;flex-direction:column;gap:18.5rem}.footer{width:100%;background-color:#000;padding:clamp(2.4rem,22.0582524272px + .5177993528vw,3.2rem) clamp(3.2rem,-1.4951456311px + 8.932038835vw,17rem);display:flex;flex-direction:row;justify-content:space-between}@media (width <= 767.98px){.footer{flex-direction:column;align-items:center;justify-content:center;gap:4.8rem}}.footer__nav{display:flex;align-items:flex-start;flex-direction:column;gap:3.2rem}@media (width <= 767.98px){.footer__nav{align-items:center}}@media (width <= 767.98px){.footer__nav .nav--footer .nav__list{display:flex;flex-direction:column;gap:2.4rem}}.footer__social-links{display:flex;align-items:flex-end;flex-direction:column;gap:3.2rem}@media (width <= 767.98px){.footer__social-links{align-items:center}}.footer__social-links-list{display:flex;flex-direction:row;gap:1.4rem}.footer__social-links-item{position:relative;padding-bottom:.8rem}@media (width > 767.98px){.footer__social-links-item:after{content:"";position:absolute;bottom:0;left:50%;width:0;height:2px;background-color:#fff;transform:translate(-50%);transition:width .2s ease-in-out}}@media (width > 767.98px) and (any-hover: hover){.footer__social-links-item:hover:after{width:100%}}@media (width > 767.98px) and (any-hover: none){.footer__social-links-item:active:after{width:100%}}.footer__copyright-text{color:#6c757d}.burger{display:none;flex-direction:column;justify-content:space-between;width:28px;height:20px;background:none;border:none;cursor:pointer;z-index:1050;transition:transform .3s ease-in-out,z-index 0s .3s}.burger span{display:block;height:3px;width:100%;background:#fff;border-radius:2px;transition:.3s}@media (width <= 767.98px){.burger{display:flex}}.burger.active span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}.burger.active span:nth-child(2){opacity:0}.burger.active span:nth-child(3){transform:rotate(-45deg) translate(6px,-6px)}.card-item{position:relative;overflow:hidden;transition:.2s ease-in-out}.card-item img{width:100%;height:100%;object-fit:cover;transition:opacity .2s ease-in-out}.card-item__title{position:absolute;bottom:clamp(1.5rem,10.145631068px + 1.2944983819vw,3.5rem);left:clamp(1.5rem,8.932038835px + 1.6181229773vw,4rem);width:16.5rem;color:#fff;text-transform:uppercase;font-family:Josefin,sans-serif;font-size:clamp(2.4rem,22.0582524272px + .5177993528vw,3.2rem);font-weight:400;transition:color .2s ease-in-out}.card-item:hover{cursor:pointer}.card-item:hover img{opacity:.5}.card-item:hover .card-item__title{color:#000}.hero{width:100%;height:100%;aspect-ratio:1440/650;background-image:url(/My-practices-in-the-frontend-mentor/demo/junior/loopstudios-landing-page-demo/assets/image-hero-D9sr8Aqg.jpg);background-size:cover;background-repeat:no-repeat;display:flex;flex-direction:column;gap:clamp(5rem,-159.2307692308px + 20.4326923077vw,13.5rem);padding:6.5rem clamp(3.5rem,-10.7746478873px + 12.20657277vw,16.5rem)}@media (width <= 767.98px){.hero{aspect-ratio:750/1300;background-image:url(/My-practices-in-the-frontend-mentor/demo/junior/loopstudios-landing-page-demo/assets/image-hero-DJ8qrPq3.jpg);background-size:100% auto;background-position:center top;background-repeat:no-repeat;gap:32rem}}.hero__content{max-width:clamp(32rem,-492.3076923077px + 79.3269230769vw,65rem);border:.2rem solid #ffffff;padding:3.2rem;display:flex;justify-content:space-between;flex-direction:column}@media (width <= 767.98px){.hero__content{max-width:100%;align-self:center}}.hero__title{color:#fff;text-transform:uppercase;font-family:Josefin,sans-serif;font-size:clamp(3.2rem,-71.3846153846px + 10.0961538462vw,7.4rem);font-weight:400}@media (width <= 767.98px){.hero__title{font-size:4.4rem}}@media (width <= 767.98px){.nav{position:fixed;top:0;right:-100%;width:100%;height:100vh;display:flex;align-items:center;background-color:#000;padding:2rem 3.2rem;transition:right .3s ease-in-out}.nav.active{right:0}.nav.active~.burger{z-index:1050;transition-delay:.3s}}.nav__list{display:flex;justify-content:space-between;align-items:center;flex-direction:row;gap:clamp(1.2rem,7.145631068px + 1.2944983819vw,3.2rem)}@media (width <= 767.98px){.nav__list{flex-direction:column;align-items:flex-start;gap:3.2rem}}.nav__link{position:relative;color:#fff;font-weight:400;padding-bottom:.8rem}@media (width > 767.98px){.nav__link:after{content:"";position:absolute;bottom:0;left:50%;width:0;height:2px;background-color:#fff;transform:translate(-50%);transition:width .2s ease-in-out}}@media (width > 767.98px) and (any-hover: hover){.nav__link:hover:after{width:100%}}@media (width > 767.98px) and (any-hover: none){.nav__link:active:after{width:100%}}@media (width <= 767.98px){.nav__link{text-transform:uppercase;font-family:Josefin,sans-serif;font-size:clamp(3.2rem,27.145631068px + 1.2944983819vw,5.2rem)}}.nav__link:before{content:" ";position:absolute;inset:-14px}.about{position:relative;width:100%;display:flex;flex-direction:row}@media (width <= 767.98px){.about{flex-direction:column;gap:3.2rem}}.about__image{align-self:flex-start}.about__content{position:absolute;bottom:-85px;right:-60px;max-width:60rem;background-color:#fff;padding:clamp(2.4rem,9.1941747573px + 3.9482200647vw,8.5rem);display:flex;flex-direction:column;gap:3.2rem}@media (width <= 767.98px){.about__content{position:static;text-align:center}}.about__title{font-family:Josefin,sans-serif;font-size:clamp(3.2rem,27.145631068px + 1.2944983819vw,5.2rem);font-weight:400;text-transform:uppercase}.about__text{color:#6c757d;font-weight:500;line-height:1.5}.creations{display:flex;flex-direction:column;gap:8.5rem}@media (width <= 767.98px){.creations{align-items:center}}.creations__header{display:flex;justify-content:space-between;align-items:center}@media (width <= 767.98px){.creations__header{justify-content:center}}.creations__title{font-family:Josefin,sans-serif;font-weight:500;text-transform:uppercase;font-size:clamp(3.8rem,35.572815534px + .6472491909vw,4.8rem)}.creations__see-all-button{font-family:Josefin,sans-serif;font-weight:500;text-transform:uppercase;font-size:1.5rem;font-weight:700;letter-spacing:.15rem;border:2px solid #000000;padding:1.2rem 4.2rem;transition:all .2s ease-in-out}@media (any-hover: hover){.creations__see-all-button:hover{background-color:#000;color:#fff}}@media (any-hover: none){.creations__see-all-button:active{background-color:#000;color:#fff}}@media (width <= 767.98px){.creations__see-all-button{display:none}}.creations__see-all-button--mobile{display:none}@media (width <= 767.98px){.creations__see-all-button--mobile{display:block}}.creations__cards{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(2,1fr);gap:24px}@media (width <= 767.98px){.creations__cards{display:flex;flex-direction:column}}