:root{--white-color: #FFFFFF;--gray-color: #BBBBBB;--accent-color: #5F413C;--accent-hover-color: #503632;--background-color: #080B0E;--red-color: #850C1B;--dark-red-color: #7E1221;--green-color: #01502e;--black-color: #434145;--light-gray-color: #D7D2CF;--blue-color: #023860;--red-gradient: linear-gradient(170deg, #850C1B 33.34%, rgba(246, 21, 53, .2) 92.01%);--dark-red-gradient: linear-gradient(170deg, #7E1221 33.34%, rgba(167, 58, 73, .2) 92.01%);--green-gradient: linear-gradient(170deg, #002416 33.34%, rgba(0, 144, 113, .2) 92.01%);--black-gradient: linear-gradient(170deg, #6F6F71 33.34%, rgba(67, 65, 69, .2) 92.01%);--gray-gradient: linear-gradient(170deg, #D7D2CF 33.34%, rgba(239, 239, 239, .2) 92.01%);--blue-gradient: linear-gradient(170deg, #023860 33.34%, rgba(16, 46, 72, .2) 92.01%)}*{margin:0;padding:0}html{scroll-behavior:smooth}body{color:var(--white-color);background-color:var(--background-color);font-family:Roboto,sans-serif}li{list-style:none}.container{max-width:1200px;margin:0 auto}.button{display:flex;justify-content:center;align-items:center;width:162px;height:61px;text-align:center;border-radius:30px;background:var(--accent-color);border:none;outline:none;cursor:pointer;transition:background .3s ease;text-decoration:none;font-family:Roboto,sans-serif;color:var(--white-color);font-size:18px;font-weight:500}.button:hover{background:var(--accent-hover-color)}.button-transition{display:flex;justify-content:center;align-items:center;background:transparent;border:2px solid var(--accent-color);transition:all .3s ease;color:var(--white-color);text-decoration:none}.button-transition:hover{color:var(--white-color);background:var(--accent-color)}.button:disabled{background:var(--gray-color);cursor:not-allowed}.title{font-size:45px;font-weight:700;text-align:center}.header{padding-top:35px;padding-bottom:36px;border-bottom:2px solid var(--accent-color)}.header .container{display:flex;justify-content:flex-start;align-items:center}.header .logo{width:113px;height:23px;margin-right:334px}.header .logo__img{width:100%;height:100%}.header .nav__list{display:flex;gap:40px;align-items:center}.header .nav__link{position:relative;color:var(--gray-color);font-size:16px;font-weight:400;text-decoration:none;transition:color .3s ease;line-height:1}.header .nav__link:hover{color:var(--white-color)}.header .nav__link:after{content:"";position:absolute;display:block;left:0;bottom:-3px;width:0;height:1px;background-color:var(--white-color);transition:width .3s ease-out}.header .nav__link:hover:after,.header .nav__link:focus:after{width:100%}.info{padding-top:120px;padding-bottom:120px}.info .container{display:flex;justify-content:space-between;align-items:center}.info__block{display:flex;flex-direction:column;gap:30px;max-width:661px;padding-top:101px}.info__block .info__title{color:var(--white-color);font-size:55px;font-weight:700}.info__block .info__desc{max-width:673px;color:var(--gray-color);font-size:18px;font-weight:400}.info__block .info__btn{display:flex;gap:30px}.info__images{position:relative;flex-shrink:0;width:508px;height:535px}.info__images .info__bg{position:absolute;inset:0;background-image:url(/coffee-code/assets/big-coffee-Bf89T0aw.png);background-size:cover;background-position:center;filter:blur(200px);z-index:1}.info__images .info__img{width:100%;height:100%;z-index:2}.advantages{padding-bottom:120px}.advantages__block{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:30px}.advantages__block .advantages__desc{color:var(--gray-color);font-size:18px;font-weight:400;max-width:855px;padding-bottom:50px}.advantages__info{display:flex;gap:45px}.advantages__info .advantages__images{position:relative;width:588px;height:450px;flex-shrink:0}.advantages__info .advantages__images .advantages__img--bg{position:absolute;inset:0;background-image:url(/coffee-code/assets/coffee-Djjxh_KC.png);background-size:cover;background-position:center;animation:blurIn 5s ease-in-out forwards infinite;z-index:-1}@keyframes blurIn{0%{filter:blur(0)}50%{filter:blur(15px)}to{filter:blur(0)}}.advantages__info .advantages__images .advantages__img{width:100%;height:100%;z-index:2}.advantages__info .advantages__list{padding-top:120px;display:flex;flex-direction:column;gap:30px;max-width:570px}.advantages__info .advantages__list .advantages__item{position:relative;display:flex;gap:15px;align-items:center}.advantages__info .advantages__list .advantages__item .advantages__circle{width:50px;height:50px;border-radius:50%;border:2px solid var(--accent-color);flex-shrink:0}.advantages__info .advantages__list .advantages__item .advantages__number{position:absolute;top:14px;left:20px;color:var(--accent-color);text-align:center;font-size:25px;font-weight:500}.advantages__info .advantages__list .advantages__item .advantages__text{color:var(--white-color);font-size:18px;font-weight:500}.products__cards{display:grid;grid-template-columns:repeat(3,384px);row-gap:30px;column-gap:24px;padding-bottom:120px}.filter{padding-top:50px;padding-bottom:50px}.filter__block{display:flex;gap:60px;justify-content:center}.card__block .card{display:flex;flex-direction:column;align-items:center;border-radius:20px;padding:10px 10px 30px;box-sizing:border-box}.card__block .card__header{background-color:var(--white-color);padding:25px 32px;border-radius:15px;flex-shrink:0;width:300px;height:300px}.card__block .card__body{padding-top:20px;text-align:center}.card__block .card__body .body__title{font-size:20px;font-weight:400}.card__block .card__body .body__desc{padding-top:12px;color:var(--gray-color);font-size:16px;font-weight:400;max-width:265px}.card__block .card__footer{display:flex;gap:55px;padding-top:20px;padding-left:20px;padding-right:20px}.card__block .card__footer .footer__info{display:flex;flex-direction:column;justify-content:center;gap:15px}.card__block .card__footer .footer__info .info__weight{font-size:18px;font-weight:500}.card__block .card__footer .footer__info .info__price{font-size:18px;font-weight:500;width:115px}.order{position:relative;text-align:center}.order .container{display:flex;align-items:center;flex-direction:column;justify-content:center}.order__title{color:#fff;font-size:45px;font-weight:700;padding-bottom:20px}.order__desc{color:var(--gray-color);font-size:16px;font-weight:400;line-height:130%;padding-bottom:50px}.order__form .form__group{position:relative;box-sizing:border-box;transition:all .2s ease;border-radius:30px;height:80px;border:2px solid var(--accent-color);margin-bottom:15px;width:306px}.order__form .form__label{position:absolute;left:23px;top:29px;font-size:16px;transition:all .2s ease;color:var(--gray-color);cursor:text}.order__form .form__input:focus~.form__label,.order__form .form__input:not(:focus):valid~.form__label,.order__form .form__input:not(:placeholder-shown)~.form__label{top:12px}.order__form .form__input:valid,.order__form .form__input:focus,.order__form .form__input:not(:placeholder-shown){margin-top:40px;height:auto}.order__form .form__input{width:100%;height:100%;color:var(--white-color);font-size:18px;border:none;outline:none;background:transparent;padding:0 20px;box-sizing:border-box}.order__form .button-big{height:80px;width:100%}.order .order__circle--left{display:flex;justify-content:center;align-items:center;width:310px;height:310px;flex-shrink:0;border-radius:310px;border:2px solid var(--accent-color);position:absolute;bottom:192px;left:calc(50% - 600px)}.order .circle__img--left{animation:onTop1 5s forwards infinite}@keyframes onTop1{0%{transform:translateY(0)}50%{transform:translateY(5px)}to{transform:translateY(0)}}.order .order__circle--right{display:flex;justify-content:center;align-items:center;width:310px;height:310px;flex-shrink:0;border-radius:310px;border:2px solid var(--accent-color);position:absolute;bottom:0;right:calc(50% - 600px)}.order .circle__img--right{animation:onTop2 5s forwards infinite;animation-delay:2s}@keyframes onTop2{0%{transform:translateY(0)}50%{transform:translateY(5px)}to{transform:translateY(0)}}.footer{margin-top:120px;border-top:1px solid var(--accent-color)}.footer .container{display:flex;justify-content:space-between;align-items:center}.footer .logo{padding-top:30px;padding-bottom:30px}.footer__rights{color:var(--gray-color);font-size:16px;font-weight:400}