html {
   font-size: 20px;
   line-height: auto;
   -webkit-text-size-adjust: 100%;
   overflow-y: scroll;
   scroll-behavior: smooth;
}
@media (max-width: 1800px) {
   html {
      font-size: 20px;
   }
}
@media (max-width: 1400px) {
   html {
      font-size: 1.95vw;
   }
}
@media (max-width: 1024px) {
   html {
      font-size: 2.6vw;
   }
}
@media (orientation: portrait) and (max-width: 768px) {
   html {
      font-size: 6.25vw;
   }
}
@media (orientation: landscape) and (max-width: 768px) {
   html {
      font-size: 3vw;
   }
}

body {
   background-color: #fff;
   color: #000;
   font-family: "Open Sans", Serif;
   scrollbar-gutter: stable;
}

body.filters-opened {
   overflow: hidden;
}

h1,
.h1 {
   position: relative;
   font-weight: 700;
   font-size: 1.8rem;
   letter-spacing: -0.03em;
}
@media (max-width: 1024px) {
   h1,
   .h1 {
      font-size: 1.2rem;
   }
}
h2,
.h2 {
   position: relative;
   font-weight: 500;
   font-size: 1.2rem;
   letter-spacing: -0.03em;
}
@media (max-width: 768px) {
   h2,
   .h2 {
      font-size: 1rem;
   }
}

h3,
.h3 {
   position: relative;
   font-weight: 700;
   font-size: 1.2rem;
}
@media (max-width: 1400px) {
   h3,
   .h3 {
      font-size: 0.8rem;
   }
}
@media (max-width: 768px) {
   h3,
   .h3 {
      font-size: 0.6rem;
   }
}

h4,
.h4 {
   position: relative;
   font-weight: 500;
   font-size: 0.8rem;
}
@media (max-width: 1400px) {
   h4,
   .h4 {
      font-size: 0.7rem;
   }
}
@media (max-width: 1024px) {
   h4,
   .h4 {
      font-size: 0.6rem;
   }
}
@media (max-width: 768px) {
   h4,
   .h4 {
      font-size: 0.5rem;
   }
}

h5,
.h5 {
   position: relative;
   font-weight: 500;
   font-size: 0.8rem;
}
@media (max-width: 1400px) {
   h5,
   .h5 {
      font-size: 0.7rem;
   }
}
@media (max-width: 1024px) {
   h5,
   .h5 {
      font-size: 0.6rem;
   }
}
@media (max-width: 768px) {
   h5,
   .h5 {
      font-size: 0.5rem;
   }
}

h6,
.h6 {
   position: relative;
   font-weight: 500;
   font-size: 0.8rem;
}
@media (max-width: 1024px) {
   h6,
   .h6 {
      font-size: 0.7rem;
   }
}
@media (max-width: 768px) {
   h6,
   .h6 {
      font-size: 0.5rem;
   }
}

p,
li,
a,
span {
   position: relative;
   font-weight: 500;
   font-size: 1rem;
   line-height: 1.5;
   letter-spacing: -0.03em;
}
@media (max-width: 1400px) {
   p,
   li,
   a,
   span {
      font-size: 0.8rem;
   }
}
@media (max-width: 1024px) {
   p,
   li,
   a,
   span {
      font-size: 0.7rem;
   }
}
@media (max-width: 768px) {
   p,
   li,
   a,
   span {
      font-size: 0.6rem;
   }
}

.grid {
   display: grid;
   grid-template-columns: repeat(8, 1fr);
   column-gap: 1.2rem;
}
@media (max-width: 768px) {
   .grid {
      grid-template-columns: repeat(4, 1fr);
      column-gap: 0.2rem;
   }
}

div {
   height: fit-content;
}

.container {
   max-width: 78rem;
   margin: 0 auto;
}
@media (max-width: 1800px) {
   .container {
      max-width: 65rem;
   }
}
@media (max-width: 1400px) {
   .container {
      max-width: none;
      margin: 0;
      padding: 0 2.5rem;
   }
}
@media (max-width: 768px) {
   .container {
      padding: 0 1rem;
   }
}

.wrapper {
   min-height: 100%;
   width: 100%;
   overflow: hidden;
}

.overlay,
.filters-overlay {
   display: none;
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   z-index: 1;
}

.overlay.active,
.filters-overlay.active {
   display: block;
}

main.main {
   min-height: 100%;
   width: 100%;
   margin-top: 4.8rem;
   overflow: hidden;
}
@media (max-width: 1400px) {
   main.main {
      margin-top: 4.4rem;
   }
}
@media (max-width: 768px) {
   main.main {
      margin-top: 6.2rem;
   }
}

.section {
   margin-bottom: 11rem;
}
@media (max-width: 1800px) {
   .section {
      margin-bottom: 10rem;
   }
}
@media (max-width: 1400px) {
   .section {
      margin-bottom: 8rem;
   }
}
@media (max-width: 1024px) {
   .section {
      margin-bottom: 6rem;
   }
}
@media (max-width: 768px) {
   .section {
      margin-bottom: 5rem;
   }
}

.img-wrapper {
   display: flex;
   justify-content: center;
   align-items: center;
}

img {
   width: 100%;
   height: 100%;
   object-fit: contain;
}

.header:has(.header__burger-menu.opened) {
   height: 100vh;
   background: #fff;
   overflow-y: auto;
}
.header:has(.header__burger-menu.opened) .header__menu {
   display: none;
   height: 0;
   width: 0;
}
.header:has(.header__burger-menu.opened) .header__search {
   display: none;
   height: 0;
   width: 0;
}

.header {
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   padding-top: 1rem;
   padding-bottom: 1rem;
   z-index: 3;
}
@media (max-width: 768px) {
   .header {
      background: #fff;
   }
}
.header__holder {
   display: flex;
   justify-content: space-between;
   align-items: center;
   position: relative;
}
@media (max-width: 1024px) {
   .header__holder {
      gap: 0.8rem;
      flex-wrap: wrap;
   }
}
@media (max-width: 768px) {
   .header__holder {
      row-gap: 0.6rem;
   }
}
.header__logo {
   height: 2.3rem;
}
@media (max-width: 1400px) {
   .header__logo {
      height: 1.6rem;
   }
}
@media (max-width: 1024px) {
   .header__logo {
      height: 2.1rem;
   }
}
@media (max-width: 768px) {
   .header__logo {
      height: 1.5rem;
   }
}
.header__logo a {
   width: fit-content;
}
.header__logo img {
   width: auto;
}
.header__menu-element {
   background: #f5f5f5;
   border-radius: 90px;
   padding: 0 1.6rem;
   height: 2.8rem;
   display: flex;
   align-items: center;
}
@media (max-width: 1400px) {
   .header__menu-element {
      height: 2.4rem;
      padding: 0 0.8rem;
   }
}
@media (max-width: 1024px) {
   .header__menu-element {
      padding: 0 1.2rem;
   }
}
@media (max-width: 768px) {
   .header__menu-element {
      padding: 0 0.5rem;
      height: 1.8rem;
   }
}
.header__menu {
   gap: 3rem;
   overflow: hidden;
}
@media (max-width: 1400px) {
   .header__menu {
      gap: 1rem;
   }
}
@media (max-width: 1024px) {
   .header__menu {
      order: 2;
   }
}
.header__menu-bar {
   position: relative;
   height: 100%;
   display: flex;
   align-items: center;
}
.header__menu-list {
   display: flex;
   justify-content: space-between;
   align-items: center;
   gap: 2.4rem;
   display: flex;
   justify-content: center;
   align-items: center;
}
@media (max-width: 1400px) {
   .header__menu-list {
      gap: 1rem;
   }
}
.header__menu-item a {
   font-weight: 600;
   font-size: 0.8rem;
   letter-spacing: -0.03em;
   color: #292522;
   transition-delay: 0.1s;
   transition: color 0.1s ease;
}
@media (max-width: 1400px) {
   .header__menu-item a {
      font-size: 0.7rem;
   }
}
.header__menu-item a.selected {
   text-decoration: underline;
   text-underline-offset: 4px;
}
.header__menu-item a.active {
   color: #fff;
}
.header__menu-links {
   display: flex;
   justify-content: space-between;
   align-items: center;
   gap: 0.8rem;
}
@media (max-width: 768px) {
   .header__menu-links {
      gap: 1rem;
   }
}
.header__menu-link {
   height: 1.1rem;
   position: relative;
}
@media (max-width: 768px) {
   .header__menu-link {
      height: 0.8rem;
   }
}
.header__menu-cart-quantity {
   position: absolute;
   top: 0;
   right: 0;
   transform: translate(70%, -65%);
   font-size: 0.5rem;
   font-weight: 400;
   color: #fff;
   line-height: 1;
   padding: 0.2rem 0.4rem;
   background: #f23c20;
   border-radius: 12px;
}
@media (max-width: 1024px) {
   .header__menu-cart-quantity {
      transform: translate(70%, -55%);
      font-size: 0.4rem;
      padding: 0.1rem 0.2rem;
   }
}
.header__search {
   padding-right: 2.8rem;
   position: relative;
   max-width: 22.5rem;
   flex-shrink: 1;
}
@media (max-width: 1800px) {
   .header__search {
      max-width: 9.5rem;
   }
}
@media (max-width: 1400px) {
   .header__search {
      max-width: 7rem;
   }
}
@media (max-width: 1024px) {
   .header__search {
      max-width: none;
      flex-grow: 1;
      order: 1;
   }
}
@media (max-width: 768px) {
   .header__search {
      flex-basis: 100%;
      order: 4;
      padding-right: 1.8rem;
      padding-left: 0.8rem;
   }
}
.header__search::after {
   content: "";
   width: 1.2rem;
   height: 1.2rem;
   position: absolute;
   top: 50%;
   right: 0.8rem;
   transform: translateY(-50%);
   background: url(../images/search-icon.svg) no-repeat center/contain;
}
@media (max-width: 768px) {
   .header__search::after {
      width: 0.8rem;
      height: 0.8rem;
      right: 0.5rem;
   }
}
.header__input {
   font-weight: 600;
   font-size: 0.8rem;
   letter-spacing: -0.03em;
   color: #292522;
   background: none;
   border: none;
   width: 100%;
}
@media (max-width: 1400px) {
   .header__input {
      font-size: 0.7rem;
   }
}
@media (max-width: 768px) {
   .header__input {
      font-size: 0.6rem;
   }
}
.header__btn {
   height: 100%;
   font-weight: 600;
   font-size: 0.8rem;
   letter-spacing: -0.03em;
   color: #292522;
   display: flex;
   justify-content: center;
   align-items: center;
}
@media (max-width: 1400px) {
   .header__btn {
      font-size: 0.7rem;
   }
}
.header__menu-drop-down {
   position: absolute;
   top: 100%;
   left: 0;
   background: #1e5540;
   border-radius: 24px;
   padding: 0;
   overflow: hidden;
   transition: left 0.3s ease, padding 0.3s ease, height 0.3s ease;
   box-sizing: content-box;
}
.header__menu-drop-down.active {
   padding: 1.6rem 1.2rem;
}
.header__drop-down-list {
   display: flex;
   flex-direction: column;
   gap: 1.2rem;
   visibility: hidden;
   opacity: 0;
   height: 0;
   transition: opacity 0.1s ease, visibility 0.1s ease;
}
.header__drop-down-list.active {
   visibility: visible;
   opacity: 1;
   height: auto;
}
.header__drop-down-item a {
   font-weight: 600;
   font-size: 0.8rem;
   letter-spacing: -0.03em;
   color: #fff;
}
.header__drop-down-item a.selected {
   text-decoration: underline;
   text-underline-offset: 4px;
}
.header__burger {
   padding: 0.6rem;
   height: fit-content;
   order: 3;
}
@media (max-width: 768px) {
   .header__burger {
      padding: 0 0.5rem;
      height: 1.8rem;
      display: flex;
      justify-content: center;
      align-items: center;
   }
}
.header__burger path {
   transition: transform 0.3s ease;
   transform: translate(0) rotateZ(0deg);
}
.header__burger.opened path {
   transform-origin: center;
}
.header__burger.opened #header__burger-top-line {
   transform: translate(3px, -1px) rotateZ(45deg);
}
.header__burger.opened #header__burger-bottom-line {
   transform: translate(3px, 3px) rotateZ(-45deg);
}
.header__burger-menu {
   display: none;
   flex-basis: 100%;
   min-height: 100%;
   order: 5;
}
.header__burger-menu.opened {
   display: block;
}
.header__burger-menu.opened .accrodion-holder {
   padding-top: 3rem;
   padding-right: 0.6rem;
}
.header__burger-menu.opened .header__mobile-list {
   display: flex;
   flex-direction: column;
   gap: 1rem;
}
.header__burger-menu.opened .header__mobile-item a {
   font-weight: 600;
   font-size: 0.7rem;
   letter-spacing: -0.03em;
   color: #292522;
}

.underline {
   position: absolute;
   background: #1e5540;
   top: 50%;
   transform: translateY(-50%);
   border-radius: 22px;
   transition: width 0.3s ease, left 0.3s ease;
}

@media (max-width: 1024px) {
   .header-pc {
      display: none;
   }
}

.header-mobile {
   display: none;
}
@media (max-width: 1024px) {
   .header-mobile {
      display: block;
   }
}

.header-mobile.header__burger {
   display: none;
}
@media (max-width: 1024px) {
   .header-mobile.header__burger {
      display: flex;
   }
}

.accordion-header {
   display: flex;
   align-items: center;
   justify-content: space-between;
   width: 100%;
   text-align: left;
   color: #292522;
   background: none;
   border: none;
   transition: margin 0.5s ease;
}

.accordion-header.opened {
   margin-bottom: 1.5rem;
}

.accordion-item--no-open {
   width: 100%;
}

.accordion-item--no-open a {
   text-align: left;
   color: #292522;
   font-weight: 600;
   font-size: 0.8rem;
   letter-spacing: -0.03em;
}

.accordion-title {
   flex-basis: 95%;
   font-weight: 600;
   font-size: 0.8rem;
   letter-spacing: -0.03em;
}

@media (max-width: 768px) {
   .accordion-title {
      flex-basis: 88%;
   }
}
.accordion-bullet {
   flex-basis: 5%;
   display: flex;
   justify-content: flex-end;
}

@media (max-width: 768px) {
   .accordion-bullet {
      flex-basis: 12%;
   }
}
.accordion-bullet path {
   transform-origin: center;
   transform: rotateZ(0deg);
   opacity: 1;
   transition: transform 0.3s ease, opacity 0.3s ease;
}

.accordion-bullet.opened #accordion-bullet-hor {
   transform: rotateZ(90deg);
}
.accordion-bullet.opened #accordion-bullet-vert {
   transform: rotateZ(90deg);
   opacity: 0;
}

.accordion-content {
   overflow: hidden;
   margin-bottom: 0.8rem;
   height: 0;
   transition: all 0.5s ease;
   color: #292522;
   display: flex;
   justify-content: space-between;
   flex-wrap: wrap;
   row-gap: 1.5rem;
   column-gap: 0.5rem;
   padding: 0 0.6rem;
}

@media (max-width: 768px) {
   .accordion-content {
      row-gap: 1rem;
   }
}
.border-btn {
   display: flex;
   gap: 0.8rem;
   border: 1px solid #000;
   border-radius: 90px;
   align-items: center;
   justify-content: space-between;
   min-width: 11rem;
   height: 2.2rem;
   background: #fff;
   color: #000;
}
.border-btn p {
   padding: 0.6rem 0 0.6rem 1.5rem;
   font-weight: 400;
   font-size: 0.7rem;
}
@media (max-width: 768px) {
   .border-btn p {
      font-size: 0.6rem;
   }
}
.border-btn div {
   height: 100%;
   aspect-ratio: 1/1;
   background: #000;
   border-radius: 50%;
   padding: 0.5rem;
}
@media (max-width: 768px) {
   .border-btn div {
      padding: 0.7rem;
   }
}

.categories {
   display: flex;
   gap: 1.2rem;
   height: 6.5rem;
}
@media (max-width: 1024px) {
   .categories {
      height: 4.5rem;
   }
}
@media (max-width: 768px) {
   .categories {
      flex-direction: column;
      gap: 0.8rem;
      height: auto;
   }
}

.category {
   height: 100%;
   flex: 1 0 0;
   display: flex;
   align-items: flex-end;
   gap: 1.2rem;
   border: 1px solid rgba(0, 0, 0, 0.5);
   border-radius: 24px;
   padding: 1rem;
   background: #fff;
}
@media (max-width: 1024px) {
   .category {
      padding: 1rem 0.6rem;
      gap: 0.5rem;
   }
}
@media (max-width: 768px) {
   .category {
      width: 100%;
      height: 4rem;
      padding: 0.8rem 1.2rem;
      gap: 0.8rem;
   }
}

.category-img-holder {
   height: 100%;
   min-width: 0;
}
@media (max-width: 768px) {
   .category-img-holder {
      flex-basis: 10%;
   }
}
.category-img-holder img {
   min-width: 0;
}

.category-title {
   margin-bottom: 0.5rem;
}
@media (max-width: 1024px) {
   .category-title {
      margin-bottom: 0;
   }
}
@media (max-width: 768px) {
   .category-title {
      margin-bottom: 0.4rem;
   }
}

.slick-list.draggable {
   width: 100%;
}

.slick-track {
   margin: 0;
   display: flex;
}

.slick-initialized .slick-slide {
   display: flex;
   height: auto;
}

.bg-slider__header {
   display: flex;
   justify-content: space-between;
   margin-bottom: 2rem;
}
@media (max-width: 768px) {
   .bg-slider__header {
      margin-bottom: 1.6rem;
      align-items: center;
   }
}
.bg-slider__btns {
   display: flex;
   gap: 0.8rem;
   height: 2.2rem;
}
.bg-slider__btn {
   aspect-ratio: 1/1;
   height: 100%;
   padding: 0.5rem;
   background: #1e5540;
   border: none;
   border-radius: 50%;
}
.bg-slider__container {
   display: flex;
}
.bg-slider__inner {
   margin: 0 0.6rem;
   display: flex;
   justify-content: space-between;
   border-radius: 32px;
   overflow: hidden;
   height: 100%;
   width: 100%;
}
@media (max-width: 1024px) {
   .bg-slider__inner {
      border-radius: 16px;
   }
}
@media (max-width: 768px) {
   .bg-slider__inner {
      margin: 0 0.1rem;
   }
}
.bg-slider__slide {
   flex: 1 1 50%;
   height: 13rem;
}
@media (max-width: 1024px) {
   .bg-slider__slide {
      height: 8rem;
   }
}
@media (max-width: 768px) {
   .bg-slider__slide {
      height: 6rem;
   }
}
.bg-slider__slide-info {
   background: #1e5540;
   flex: 1 1 0;
   padding: 2.4rem;
   height: 100%;
   display: flex;
   flex-direction: column;
   justify-content: space-between;
   gap: 1rem;
}
@media (max-width: 1800px) {
   .bg-slider__slide-info {
      padding: 2.9rem 1.2rem;
   }
}
@media (max-width: 1024px) {
   .bg-slider__slide-info {
      padding: 1rem;
   }
}
@media (max-width: 768px) {
   .bg-slider__slide-info {
      padding: 0.8rem;
      gap: 0;
   }
}
.bg-slider__slide-title {
   color: #fff;
}
.bg-slider__slide-img {
   flex-shrink: 0;
   height: 100%;
   aspect-ratio: 1/1;
}
.bg-slider__slide-img img {
   object-fit: cover;
   object-position: center;
}

.border-slider__header {
   display: flex;
   justify-content: space-between;
   margin-bottom: 2rem;
}
@media (max-width: 768px) {
   .border-slider__header {
      margin-bottom: 1.6rem;
      align-items: center;
   }
}
.border-slider__btns {
   display: flex;
   gap: 0.8rem;
   height: 2.2rem;
}
.border-slider__btn {
   aspect-ratio: 1/1;
   height: 100%;
   padding: 0.5rem;
   background: #1e5540;
   border: none;
   border-radius: 50%;
}
.border-slider__container {
   display: flex;
}
.border-slider__inner {
   margin: 0 0.6rem;
   display: flex;
   justify-content: space-between;
   overflow: hidden;
   height: 100%;
   width: 100%;
}
@media (max-width: 768px) {
   .border-slider__inner {
      margin: 0 0.1rem;
   }
}
.border-slider__slide {
   flex: 1 1 50%;
}

.beer-card {
   width: 100%;
   height: 100%;
}
.beer-card__picture-block {
   aspect-ratio: 1/1;
   position: relative;
   margin-bottom: 0.8rem;
}
@media (max-width: 768px) {
   .beer-card__picture-block {
      margin-bottom: 0.5rem;
   }
}
.beer-card__img {
   clip-path: url(#clip-path);
   position: relative;
   border-radius: 24px;
}
@media (max-width: 1400px) {
   .beer-card__img {
      clip-path: url(#clip-path-mobile);
   }
}
.beer-card__border {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   z-index: 1;
   pointer-events: none;
}
@media (max-width: 1400px) {
   .beer-card__border--pc {
      display: none;
   }
}
.beer-card__border--mobile {
   display: none;
}
@media (max-width: 1400px) {
   .beer-card__border--mobile {
      display: block;
   }
}
.beer-card__like,
.star-fill-icon {
   position: absolute;
   top: 0.8rem;
   right: 0.8rem;
   height: 1.6rem;
   width: 1.6rem;
   background: none;
   border: none;
}
.beer-card__like svg,
.star-fill-icon svg {
   width: 100%;
   height: 100%;
   object-fit: contain;
}
.star-fill-icon path {
   fill: #292522;
}
@media (max-width: 768px) {
   .beer-card__like {
      height: 1.4rem;
      width: 1.4rem;
      top: 0.6rem;
      right: 0.6rem;
   }
}
.beer-card__quant {
   position: absolute;
   top: 0.6rem;
   left: 0.6rem;
   font-weight: 400;
   font-size: 0.5rem;
   padding: 0.4rem;
   background: none;
   background: #fff;
   border-radius: 0.4rem;
   line-height: 1;
   width: fit-content;
}
@media (max-width: 768px) {
   .beer-card__quant {
      top: 0.4rem;
      left: 0.4rem;
      padding: 0.2rem;
      border-radius: 0.2rem;
      font-size: 0.4rem;
   }
}
.beer-card__to-cart {
   position: absolute;
   bottom: 0;
   right: 0;
   padding: 0.5rem;
   height: 2.4rem;
   width: 2.4rem;
   border-radius: 12px;
   background: #292522;
}
.beer-card__to-cart {
   color: #fff;
}
@media (max-width: 768px) {
   .beer-card__to-cart {
      padding: 0.4rem;
      height: 2.2rem;
      width: 2.2rem;
      font-size: 0.8rem;
   }
}
.beer-card__list {
   flex: 1;
   display: flex;
   flex-direction: column;
   gap: 0.8rem;
   padding: 0 0.5rem;
}
@media (max-width: 768px) {
   .beer-card__list {
      gap: 0.5rem;
      padding: 0;
   }
}
.beer-card__item {
   font-weight: 600;
   font-size: 0.8rem;
}
@media (max-width: 1024px) {
   .beer-card__item {
      font-size: 0.7rem;
   }
}
@media (max-width: 768px) {
   .beer-card__item {
      font-size: 0.5rem;
   }
}
.beer-card__item span,
.beer-card__item p {
   font-size: inherit;
}
.beer-card__title span {
   font-weight: 700;
}
.beer-card__brewery span {
   font-weight: 700;
}
.beer-card__params {
   display: flex;
}
.beer-card__params .beer-card__param {
   padding: 0 0.5rem;
   border-right: 1px solid rgba(0, 0, 0, 0.5);
}
@media (max-width: 1400px) {
   .beer-card__params .beer-card__param {
      padding: 0 0.2rem;
      font-size: 0.6rem;
   }
}
@media (max-width: 768px) {
   .beer-card__params .beer-card__param {
      padding: 0 0.2rem;
      font-size: 0.45rem;
   }
}
.beer-card__param:first-child {
   padding-left: 0;
}
.beer-card__param:last-child {
   border-right: 0;
   padding-right: 0;
}
.beer-card__price-block {
   display: flex;
   justify-content: space-between;
   align-items: end;
}
.beer-card__price-item.beer-card__price {
   font-weight: 700;
   font-size: 1.2rem;
   letter-spacing: -0.03em;
   position: relative;
   color: #292522;
}
.beer-card__price-item.beer-card__price:has(.beer-card__price-old) {
   color: #f23c20;
}
.beer-card__price-item.beer-card__price-old {
   font-weight: 600;
   font-size: 0.8rem;
   letter-spacing: -0.03em;
   opacity: 0.5;
   text-decoration: line-through;
   position: absolute;
   display: block;
   top: 0;
   right: 0;
   transform: translate(100%, -20%);
   color: #292522;
}
@media (max-width: 1024px) {
   .beer-card__price-item.beer-card__price-old {
      font-size: 0.7rem;
   }
}
@media (max-width: 768px) {
   .beer-card__price-item.beer-card__price-old {
      font-size: 0.5rem;
   }
}
.beer-card__volume {
   font-weight: 400;
   font-size: 0.8rem;
   color: #292522;
   padding: 0 0.5rem 0.2rem 0;
}
@media (max-width: 1024px) {
   .beer-card__volume {
      font-size: 0.7rem;
   }
}
@media (max-width: 768px) {
   .beer-card__volume {
      font-size: 0.5rem;
   }
}
.beer-card {
   display: flex;
   flex-direction: column;
}
.beer-card__list {
   height: 100%;
}
.beer-card__price-block {
   flex: 1;
}

.bg-btn,
.outer-btn {
   width: fit-content;
   border-radius: 90px;
   padding: 0.6rem 1.5rem;
   background: #fff;
   font-family: "Open Sans", serif;
   font-weight: 500;
   font-size: 0.6rem;
   color: #000;
}
@media (max-width: 768px) {
   .bg-btn,
   .outer-btn {
      padding: 0.5rem 1.2rem;
      font-size: 0.5rem;
   }
}

.footer {
   overflow: hidden;
   background: #1e5540;
   padding-top: 2.5rem;
}
@media (max-width: 768px) {
   .footer {
      padding-top: 2rem;
   }
}
@media (max-width: 1400px) {
   .footer__holder {
      row-gap: 2rem;
   }
}
@media (max-width: 768px) {
   .footer__holder {
      row-gap: 3rem;
   }
}
.footer p,
.footer a,
.footer li {
   color: #f9f9f9;
}
.footer__col-1 {
   grid-column: 1/3;
   display: flex;
   flex-direction: column;
   gap: 2rem;
}
@media (max-width: 1800px) {
   .footer__col-1 {
      grid-column: 1/4;
   }
}
@media (max-width: 1024px) {
   .footer__col-1 {
      gap: 1rem;
   }
}
@media (max-width: 768px) {
   .footer__col-1 {
      grid-column: 1/-1;
   }
}
.footer__home {
   display: flex;
   gap: 1rem;
   align-items: center;
   justify-content: space-between;
}
.footer__logo {
   height: 2.5rem;
}
.footer__descriptor {
   font-weight: 600;
   font-size: 0.7rem;
   letter-spacing: -0.03em;
}
@media (max-width: 1024px) {
   .footer__descriptor {
      font-size: 0.6rem;
   }
}
.footer__contacts {
   display: flex;
   width: 100%;
}
@media (max-width: 1024px) {
   .footer__contacts {
      flex-direction: column;
      gap: 1rem;
   }
}
.footer__contacts-item {
   flex: 1;
}
.footer__contacts-title {
   font-family: "Open Sans", serif;
   font-weight: 500;
   font-size: 0.7rem;
   margin-bottom: 0.6rem;
}
@media (max-width: 1024px) {
   .footer__contacts-title {
      margin-bottom: 0.4rem;
   }
}
.footer__contacts-info {
   font-weight: 600;
   font-size: 1rem;
   letter-spacing: -0.03em;
}
.footer__contacts-list {
   display: flex;
   gap: 0.4rem;
   height: 2rem;
}
.footer__contacts-list li {
   height: 100%;
   aspect-ratio: 1/1;
}
.footer__col-2 {
   grid-column: 5/7;
}
@media (max-width: 768px) {
   .footer__col-2 {
      grid-column: 1/3;
   }
}
.footer__menu-list {
   display: flex;
   flex-direction: column;
   gap: 0.8rem;
}
.footer__menu-item a {
   font-weight: 400;
   font-size: 1rem;
}
@media (max-width: 1024px) {
   .footer__menu-item a {
      font-size: 0.8rem;
   }
}
@media (max-width: 768px) {
   .footer__menu-item a {
      font-size: 0.7rem;
   }
}
.footer__col-3 {
   grid-column: 7/-1;
}
@media (max-width: 768px) {
   .footer__col-3 {
      grid-column: 3/-1;
   }
}
.footer__form-holder {
   grid-column: 1/4;
   margin-top: 6rem;
}
@media (max-width: 1800px) {
   .footer__form-holder {
      grid-column: 1/5;
   }
}
@media (max-width: 1400px) {
   .footer__form-holder {
      grid-column: 1/6;
      margin-top: 0;
   }
}
@media (max-width: 1024px) {
   .footer__form-holder {
      grid-column: 1/-1;
   }
}
.footer__form-title {
   margin-bottom: 2rem;
   font-weight: 600;
   font-size: 1rem;
   line-height: 120%;
}
@media (max-width: 768px) {
   .footer__form-title {
      font-size: 0.7rem;
   }
}
.footer__form {
   display: flex;
   flex-direction: column;
}
.footer__form input::placeholder {
   color: #f9f9f9;
   opacity: 0.8;
}
.footer__form input {
   padding: 1rem;
   background: none;
   border: 1px solid #f9f9f9;
   border-radius: 60px;
   font-weight: 400;
   font-size: 0.8rem;
   line-height: 120%;
   margin-bottom: 0.8rem;
   color: #f9f9f9;
}
@media (max-width: 768px) {
   .footer__form input {
      font-size: 0.6rem;
   }
}
.footer__form button {
   margin-top: 1.7rem;
   align-self: flex-end;
}
@media (max-width: 768px) {
   .footer__form button {
      padding: 0.6rem 1.5rem;
   }
}
.footer__partners {
   grid-column: 5/-1;
   margin-top: 6rem;
}
@media (max-width: 1800px) {
   .footer__partners {
      grid-column: 5/-1;
   }
}
@media (max-width: 1400px) {
   .footer__partners {
      margin-top: 0;
      grid-column: 1/-1;
   }
}
.footer__parthers-title {
   font-weight: 400;
   font-size: 1rem;
   margin-bottom: 1.2rem;
   line-height: 120%;
}
.footer__partners-list {
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   gap: 2.4rem;
   align-items: center;
}
@media (max-width: 768px) {
   .footer__partners-list {
      grid-template-columns: repeat(2, 1fr);
   }
}
.footer__partners-item > a {
   display: flex;
   flex-direction: column;
   gap: 0.8rem;
}
.footer__partners-img > img {
   height: auto;
   aspect-ratio: 1/1;
   object-position: bottom;
}
.footer__partners-descriptor {
   font-weight: 400;
   font-size: 0.6rem;
   text-align: center;
}
.footer__title {
   grid-column: 1/-1;
   font-weight: 400;
   font-size: 11.5rem;
   letter-spacing: 0;
   font-family: "Impact", serif;
   font-weight: 400;
   text-transform: uppercase;
   text-align: center;
   opacity: 0.1;
}
@media (max-width: 1800px) {
   .footer__title {
      font-size: 10rem;
   }
}
@media (max-width: 1400px) {
   .footer__title {
      font-size: 7rem;
   }
}
@media (max-width: 1024px) {
   .footer__title {
      font-size: 5rem;
   }
}
@media (max-width: 768px) {
   .footer__title {
      font-size: 2.1rem;
   }
}
.footer__underline {
   grid-column: 1/-1;
   display: flex;
   justify-content: space-between;
   padding: 0.5rem 0;
   border-top: 0.5px solid #f9f9f9;
}
@media (max-width: 768px) {
   .footer__underline {
      flex-direction: column;
      gap: 1rem;
   }
}
.footer__underline-item {
   font-weight: 300;
   font-size: 0.8rem;
}
.footer__underline-item a {
   font-weight: inherit;
   font-size: inherit;
}

.floating-cart {
   position: fixed;
   bottom: 1rem;
   right: 1rem;
   display: flex;
   gap: 2.4rem;
   padding: 1.2rem;
   border-radius: 24px;
   background: #f23c20;
   z-index: 3;
}
@media (max-width: 1400px) {
   .floating-cart {
      gap: 1rem;
      padding: 0.8rem;
   }
}
@media (max-width: 1024px) {
   .floating-cart {
      display: none;
   }
}
.floating-cart__img {
   width: 1.2rem;
   height: 1.2rem;
}
.floating-cart__info {
   display: grid;
   grid-template-columns: repeat(2, auto);
   gap: 0.8rem;
   align-items: center;
}
@media (max-width: 1400px) {
   .floating-cart__info {
      gap: 0.5rem;
   }
}
.floating-cart__info span {
   font-weight: 600;
   font-size: 0.8rem;
   letter-spacing: -0.03em;
   color: #fff;
}
@media (max-width: 1400px) {
   .floating-cart__info span {
      font-size: 0.7rem;
   }
}

.cookie {
   background: #1e5540;
   padding: 0.9rem 2.5rem;
   position: fixed;
   bottom: 0;
   left: 0;
   width: 100%;
   z-index: 3;
}
@media (max-width: 1400px) {
   .cookie {
      padding: 0.8rem 2rem;
   }
}
@media (max-width: 768px) {
   .cookie {
      padding: 1rem;
   }
}
.cookie__content {
   display: flex;
   justify-content: space-between;
   align-items: center;
}
@media (max-width: 768px) {
   .cookie__content {
      flex-direction: column;
      gap: 0.8rem;
   }
}
.cookie__text {
   color: #fff;
   line-height: 1.2;
}
.cookie__buttons {
   display: flex;
   gap: 1.2rem;
}
@media (max-width: 1400px) {
   .cookie__buttons {
      gap: 0.8rem;
   }
}
@media (max-width: 768px) {
   .cookie__buttons {
      width: 100%;
   }
}
.cookie__btn {
   min-width: 7rem;
   text-align: center;
}
@media (max-width: 768px) {
   .cookie__btn {
      min-width: 0;
      flex: 1;
      width: 100%;
   }
}

/*# sourceMappingURL=style.css.map */