/* Настройки темы: шрифты, цвета, размеры */
@font-face {
  font-family: Poppins;
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  src: url("../fonts/poppins-400.woff2") format("woff2"),
       url("../fonts/poppins-400.woff") format("woff");
}
        @font-face {
  font-family: Poppins;
  font-weight: 700;
  font-style: normal;
  font-display: swap;
  src: url("../fonts/poppins-700.woff2") format("woff2"),
       url("../fonts/poppins-700.woff") format("woff");
}
        @font-face {
  font-family: Poppins;
  font-weight: 400;
  font-style: italic;
  font-display: swap;
  src: url("../fonts/poppins-400-italic.woff2") format("woff2"),
       url("../fonts/poppins-400-italic.woff") format("woff");
}
        @font-face {
  font-family: Poppins;
  font-weight: 700;
  font-style: italic;
  font-display: swap;
  src: url("../fonts/poppins-700-italic.woff2") format("woff2"),
       url("../fonts/poppins-700-italic.woff") format("woff");
}
        :root {
          --font-body-family: Poppins, sans-serif;
          --font-body-style: normal;
          --font-body-weight: 400;
          --font-body-weight-bold: 700;
        }
        @font-face {
  font-family: Poppins;
  font-weight: 700;
  font-style: normal;
  font-display: swap;
  src: url("../fonts/poppins-700.woff2") format("woff2"),
       url("../fonts/poppins-700.woff") format("woff");
}
        :root {
          --font-heading-family: Poppins, sans-serif;
          --font-heading-style: normal;
          --font-heading-weight: 700;
        }
      :root {
        --font-body-scale: 1.0;
        --font-heading-scale: 1.3;
        --font-heading-line-height: 0.3;
        --font-heading-letter-spacing: 0.06rem;
        --color-base-text: 23, 23, 23;
        --color-shadow: 23, 23, 23;
        --color-base-background-1: 255, 255, 255;
        --color-base-background-2: 255, 255, 255;
        --color-base-solid-button-labels: 255, 255, 255;
        --color-base-outline-button-labels: 6, 59, 42;
        --color-base-accent-1: 229, 37, 37;
        --color-base-accent-2: 6, 59, 42;
        --payment-terms-background-color: #FFFFFF;
        --gradient-base-background-1: #FFFFFF;
        --gradient-base-background-2: #FFFFFF;
        --gradient-base-accent-1: #E52525;
        --gradient-base-accent-2: linear-gradient(54deg, rgba(109, 56, 139, 1) 14%, rgba(105, 14, 14, 1) 85%);
        --media-padding: px;
        --media-border-opacity: 0.1;
        --media-border-width: 0px;
        --media-radius: 12px;
        --media-shadow-opacity: 0.0;
        --media-shadow-horizontal-offset: 0px;
        --media-shadow-vertical-offset: 0px;
        --media-shadow-blur-radius: 20px;
        --media-shadow-visible: 0;
        --page-width: 140rem;
        --page-width-margin: 0rem;
        --product-card-image-padding: 0.0rem;
        --product-card-corner-radius: 1.2rem;
        --product-card-text-alignment: center;
        --product-card-border-width: 0.0rem;
        --product-card-border-opacity: 0.1;
        --product-card-shadow-opacity: 0.1;
        --product-card-shadow-visible: 1;
        --product-card-shadow-horizontal-offset: 0.2rem;
        --product-card-shadow-vertical-offset: 0.6rem;
        --product-card-shadow-blur-radius: 1.5rem;
        --collection-card-image-padding: 0.0rem;
        --collection-card-corner-radius: 1.2rem;
        --collection-card-text-alignment: center;
        --collection-card-border-width: 0.0rem;
        --collection-card-border-opacity: 0.1;
        --collection-card-shadow-opacity: 0.05;
        --collection-card-shadow-visible: 1;
        --collection-card-shadow-horizontal-offset: 0.2rem;
        --collection-card-shadow-vertical-offset: 0.6rem;
        --collection-card-shadow-blur-radius: 1.5rem;
        --blog-card-image-padding: 0.0rem;
        --blog-card-corner-radius: 1.2rem;
        --blog-card-text-alignment: center;
        --blog-card-border-width: 0.0rem;
        --blog-card-border-opacity: 0.1;
        --blog-card-shadow-opacity: 0.05;
        --blog-card-shadow-visible: 1;
        --blog-card-shadow-horizontal-offset: 1.0rem;
        --blog-card-shadow-vertical-offset: 1.0rem;
        --blog-card-shadow-blur-radius: 3.5rem;
        --badge-corner-radius: 0.6rem;
        --popup-border-width: 1px;
        --popup-border-opacity: 0.1;
        --popup-corner-radius: 14px;
        --popup-shadow-opacity: 0.1;
        --popup-shadow-horizontal-offset: 10px;
        --popup-shadow-vertical-offset: 12px;
        --popup-shadow-blur-radius: 20px;
        --drawer-border-width: 1px;
        --drawer-border-opacity: 0.1;
        --drawer-shadow-opacity: 0.0;
        --drawer-shadow-horizontal-offset: 0px;
        --drawer-shadow-vertical-offset: 4px;
        --drawer-shadow-blur-radius: 5px;
        --spacing-sections-desktop: 0px;
        --spacing-sections-mobile: 0px;
        --grid-desktop-vertical-spacing: 40px;
        --grid-desktop-horizontal-spacing: 40px;
        --grid-mobile-vertical-spacing: 20px;
        --grid-mobile-horizontal-spacing: 20px;
        --text-boxes-border-opacity: 0.1;
        --text-boxes-border-width: 0px;
        --text-boxes-radius: 24px;
        --text-boxes-shadow-opacity: 0.0;
        --text-boxes-shadow-visible: 0;
        --text-boxes-shadow-horizontal-offset: 10px;
        --text-boxes-shadow-vertical-offset: 12px;
        --text-boxes-shadow-blur-radius: 20px;
        --buttons-radius: 6px;
        --buttons-radius-outset: 8px;
        --buttons-border-width: 2px;
        --buttons-border-opacity: 1.0;
        --buttons-shadow-opacity: 0.0;
        --buttons-shadow-visible: 0;
        --buttons-shadow-horizontal-offset: 0px;
        --buttons-shadow-vertical-offset: 4px;
        --buttons-shadow-blur-radius: 5px;
        --buttons-border-offset: 0.3px;
        --pickers-overlay-opacity: 0.08;
        --pickers-radius: 8px;
        --pickers-small-radius: 3.2px;
        --pickers-border-width: 1px;
        --pickers-border-color: var(--color-base-accent-1);
        --pickers-border-opacity: 0.2;
        --pickers-shadow-opacity: 0.0;
        --pickers-shadow-horizontal-offset: 0px;
        --pickers-margin-offset: 0px;
        --pickers-shadow-vertical-offset: 0px;
        --pickers-shadow-blur-radius: 0px;
        --pickers-radius-outset: 9px;
        --pickers-hover-overlay-opacity: 0.1;
        --pickers-hover-border-opacity: 0.55;
        --quantity-overlay-opacity: 0.06;
        --quantity-radius: 8px;
        --quantity-small-radius: 3.2px;
        --quantity-border-width: 1px;
        --quantity-border-color: var(--color-base-accent-1);
        --quantity-border-opacity: 0.2;
        --quantity-shadow-opacity: 0.0;
        --quantity-shadow-horizontal-offset: 0px;
        --quantity-margin-offset: 0px;
        --quantity-shadow-vertical-offset: 0px;
        --quantity-shadow-blur-radius: 0px;
        --quantity-radius-outset: 9px;
        --quantity-hover-overlay-opacity: 0.06;
        --quantity-hover-border-opacity: 0.15;
        --inputs-radius: 6px;
        --inputs-border-width: 1px;
        --inputs-border-opacity: 0.6;
        --inputs-shadow-opacity: 0.0;
        --inputs-shadow-horizontal-offset: 0px;
        --inputs-margin-offset: 0px;
        --inputs-shadow-vertical-offset: 4px;
        --inputs-shadow-blur-radius: 5px;
        --inputs-radius-outset: 7px;
        --inputs-hover-border-opacity: 1;
        --variant-pills-inactive-overlay-opacity: 0.0;
        --variant-pills-text-size: 1.4rem;
        --variant-pills-padding-y: 1.0rem;
        --variant-pills-padding-x: 2.0rem;
        --variant-pills-radius: 40px;
        --variant-pills-border-width: 1px;
        --variant-pills-border-opacity: 0.55;
        --variant-pills-shadow-opacity: 0.0;
        --variant-pills-shadow-horizontal-offset: 0px;
        --variant-pills-shadow-vertical-offset: 4px;
        --variant-pills-shadow-blur-radius: 5px;
      }
      *,
      *::before,
      *::after {
        box-sizing: inherit;
      }
      html {
        box-sizing: border-box;
        font-size: calc(var(--font-body-scale) * 62.5%);
        height: 100%;
      }
      body {
        display: grid;
        grid-template-rows: auto auto 1fr auto;grid-template-rows: auto auto auto 1fr auto;grid-template-columns: 100%;
        min-height: 100%;
        margin: 0;
        overflow-x: hidden;
        font-size: 1.5rem;
        letter-spacing: 0.06em;
        line-height: calc(1 + 0.8 / var(--font-body-scale));
        font-family: var(--font-body-family);
        font-style: var(--font-body-style);
        font-weight: var(--font-body-weight);
      }
        .animate-section {
          --animation-duration: 650ms;
          --init-delay: 150ms;
          --child-delay: 150ms;
        }
        .animate-section.animate--hidden .animate-item {
          opacity: 0;
          filter: blur(1px);
          transform: translate(0%, 0%) scale(100%);
        }
        .animate-section.animate--shown .animate-item {
          opacity: 1;
          filter: blur(0);
          transform: none;
          transition: opacity var(--animation-duration) var(--init-delay),
            filter var(--animation-duration) var(--init-delay),transform var(--animation-duration) var(--init-delay);
        }
        .animate-section.animate--shown .animate-item.animate-item--child {
          transition-delay: calc(
            var(--init-delay) + (var(--child-delay) * var(--index))
          );
        }
      @media screen and (min-width: 750px) {
        body {
          font-size: 1.6rem;
        }
      }
      /* fallback */
      @font-face {
        font-family: 'Material Symbols Outlined';
        src: url(../fonts/material-symbols-outlined.woff2) format('woff2');
        font-style: normal;
        font-weight: 300;
        font-display: block;
      }
      .material-symbols-outlined {
        font-family: 'Material Symbols Outlined';
        font-weight: normal;
        font-style: normal;
        font-size: 24px;
        line-height: 1;
        letter-spacing: normal;
        text-transform: none;
        display: inline-block;
        white-space: nowrap;
        word-wrap: normal;
        direction: ltr;
        -webkit-font-feature-settings: 'liga';
        -webkit-font-smoothing: antialiased;
        max-width: 1em;
        overflow: hidden;
        flex-shrink: 0;
        font-variation-settings:
        'FILL' 0,
        'wght' 300,
        'GRAD' 0,
        'opsz' 48;
        vertical-align: bottom;
      }
      .material-symbols-outlined.filled {
        font-variation-settings:
        'FILL' 1
      }
