:root {
   --transition-duration: 0.4s;
   --base-color: var(--black);
   --base-font-family: var(--font-geist);
   --base-font-size: rem(16);
   --layer-top-header: 1000;
   --layer-top: 950;
   --font-geist-mono: 'Geist Mono', monospace;
   --font-geist: 'Geist', sans-serif;
   --font-jeko: 'JekoBold', sans-serif;
   --white: white;
   --white-64: rgba(255, 255, 255, 0.64);
   --white-50: rgba(255, 255, 255, 0.5);
   --white-32: rgba(255, 255, 255, 0.32);
   --white-12: rgba(255, 255, 255, 0.12);
   --black: #170000;
   --black-50: rgba(23, 0, 0, 0.5);
   --black-32: rgba(23, 0, 0, 0.32);
   --black-12: rgba(23, 0, 0, 0.12);
   --red: #e3000f;
   --red-active: #ba000c;
}
.varenyki-sec {
   background-image: url(../img/bg-menu.png);
   display: flex;
   flex-direction: column;
   background-color: #000;
   background-image: url(../img/bg-menu.png);
   width: 100%;
}
.varenyki-sec .container {
   display: flex;
   flex-direction: column;
   position: relative;
   width: 100%;
   max-width: 1060px;
   margin-inline: auto;
   padding: 120px 0;
}
@media screen and (max-width: 1140px) {
   .varenyki-sec .container {
      width: calc(100% - 80px);
      padding: 80px 0;
   }
}
@media screen and (max-width: 768px) {
   .varenyki-sec .container {
      width: calc(100% - 40px);
      padding: 40px 0;
   }
}
.varenyki-sec .container h2 {
   position: relative;
   color: #fff;
   font-size: 50px;
   font-style: normal;
   font-weight: 400;
   line-height: 110%;
   text-align: center;
}
@media screen and (max-width: 1440px) {
   .varenyki-sec .container h2 {
      font-size: calc(30px + 30 * (100vw - 320px) / 1120);
   }
}
.varenyki-sec .container .grid {
   display: grid;
   grid-template-columns: repeat(12, 1fr);
   gap: 20px;
   margin-top: 60px;
}
@media screen and (max-width: 1024px) {
   .varenyki-sec .container .grid {
      margin-top: 40px;
      display: flex;
      flex-direction: column;
   }
}
.varenyki-sec .container .grid .text-col {
   display: flex;
   flex-direction: column;
   grid-column: span 6;
   --margin: 24px;
}
@media screen and (max-width: 1024px) {
   .varenyki-sec .container .grid .text-col {
      order: 2;
   }
}
@media screen and (max-width: 768px) {
   .varenyki-sec .container .grid .text-col {
      --margin: 10px;
   }
}
.varenyki-sec .container .grid .text-col p,
.varenyki-sec .container .grid .text-col li {
   color: #fff;
   font-size: 25px;
}
@media (max-width: 1440px) {
   .varenyki-sec .container .grid .text-col p,
   .varenyki-sec .container .grid .text-col li {
      font-size: calc(20px + 5 * (100vw - 320px) / 1120);
   }
}
.varenyki-sec .container .grid .text-col p {
   margin: 0;
}
.varenyki-sec .container .grid .text-col p + p {
   margin-top: var(--margin);
}
.varenyki-sec .container .grid .text-col ul + p {
   margin-top: var(--margin);
}
.varenyki-sec .container .grid .text-col ul {
   margin: 0;
   margin-top: var(--margin);
   list-style-type: none;
   padding: 0;
   display: flex;
   flex-direction: column;
   gap: 4px;
}
.varenyki-sec .container .grid .text-col ul li {
   line-height: 115%;
   padding-left: 21px;
   position: relative;
}
.varenyki-sec .container .grid .text-col ul li:before {
   position: absolute;
   left: 0;
   content: '';
   top: 0.5em;
   width: 10px;
   height: 10px;
   border-radius: 100%;
   background-color: #d0292f;
}
.varenyki-sec .container .grid .text-col ul li:last-child:before {
   height: 4px;
   width: 12px;
   top: 0.5em;
   border-radius: 1px;
   background: #d0292f;
}
.varenyki-sec .container .grid .text-col ul li:last-child:after {
   position: absolute;
   content: '';
   left: 4px;
   width: 4px;
   height: 12px;
   top: calc(0.5em - 4px);
   border-radius: 1px;
   background: #d0292f;
}
.varenyki-sec .container .grid .text-col blockquote {
   padding: 25px 0 0;
   margin: 0;
   display: flex;
   flex-direction: column;
   position: relative;
   gap: 12px;
}
.varenyki-sec .container .grid .text-col blockquote:before {
   content: url(./assets/icons/blockquote.svg);
}
.varenyki-sec .container .grid .text-col blockquote {
   font-size: 18px;
   font-style: normal;
   font-weight: 400;
   line-height: 115%;
   color: #fff;
}
@media screen and (max-width: 1440px) {
   .varenyki-sec .container .grid .text-col blockquote {
      font-size: calc(13px + 5 * (100vw - 320px) / 1120);
   }
}
.varenyki-sec .container .grid .text-col ul + blockquote {
   margin-top: var(--margin);
}
.varenyki-sec .container .grid .text-col p + blockquote {
   margin-top: var(--margin);
}
.varenyki-sec .container .grid .image-col {
   position: relative;
   grid-column: span 5/13;
   display: flex;
   flex-direction: column;
   overflow: hidden;
}
@media screen and (max-width: 1024px) {
   .varenyki-sec .container .grid .image-col {
      min-height: 420px;
      order: 1;
   }
}
.varenyki-sec .container .grid .image-col img {
   position: absolute;
   object-fit: cover;
   width: 100%;
   height: 100%;
   inset: 0;
}
.top-sec__title[data-astro-cid-sckkx6r4] .menu__btn[data-astro-cid-sckkx6r4] {
   margin-left: 0;
}
