@media (max-width:37.5em) {

   html {
      font-size: clamp(0.875rem, calc(0.875rem + (1 - 0.875) * ((100vw - 20rem) / (37.5 - 20))), 1rem);
   }

   section {
      margin-bottom: 3.75rem;
   }

   .burger {
      display: flex;
   }


   .top-menu__list {
      font-size: 1.5rem;
      position: absolute;
      top: 4.25rem;
      left: -100%;
      width: 100%;
      height: 100vh;
      background-color: var(--black);
      flex-direction: column;
      justify-content: flex-start;
      gap: 2rem;
      padding-top: 2.5rem;
      transition: all 0.3s;

      &.show {
         left: 0;
      }
   }

   .header.fixed .top-menu__list {
      top: 4.25rem;
   }

   .top-menu__body {
      display: flex;
      justify-content: end;
      padding: 0.3rem 0;
   }

   .fixed .top-menu__body {
      padding: 0.3rem 0;
   }

   .top-menu__list {
      & a {
         color: #fff;
      }
   }

   #cookie_note.show {
      display: flex;
      text-align: center;
      flex-direction: column;
   }

   #cookie_note p {
      margin-bottom: 0.5rem;
      text-align: center;
   }

}
@media (width > 58em) {
   .shop-hero__image { object-fit: contain; }
}

@media (max-width: 64em) {
   .shop-site .top-menu { grid-template-columns: 8rem 1fr 15rem; gap: 1.5rem; }
   .shop-site .top-menu__tagline { font-size: 1.1rem; }
   .shop-site .top-menu__phone { font-size: 1.4rem; }
   .shop-site .top-menu__list { gap: 1.1rem; font-size: .85rem; }
   .shop-site .header.fixed .top-menu,
   .shop-site:not(.main-page) .header .top-menu { grid-template-columns: 6rem 1fr max-content; }
   .shop-hero { min-height: 50rem; }
   .product-grid { gap: 1.25rem; }
   .catalog-section--gift .product-card { min-height: 25rem; }
   .contacts-section__grid { gap: 2rem; }
}

@media (max-width: 58em) {
   .shop-site .container { padding-inline: 1.25rem; }
   .shop-site .top-menu,
   .shop-site .header.fixed .top-menu,
   .shop-site:not(.main-page) .header .top-menu { grid-template-columns: 7rem minmax(0, 1fr) 3.125rem; gap: 1rem; }
   .shop-site .top-menu__logo { grid-row: 1; }
   .shop-site .top-menu__tagline { display: none; }
   .shop-site .top-menu__contacts,
   .shop-site .header.fixed .top-menu__contacts,
   .shop-site:not(.main-page) .header .top-menu__contacts { grid-column: 2; grid-row: 1; }
   .shop-site .top-menu__body,
   .shop-site .header.fixed .top-menu__body,
   .shop-site:not(.main-page) .header .top-menu__body { grid-column: 3; grid-row: 1; }
   .shop-site .burger { display: flex; width: 3.125rem; height: 3.125rem; }
   .shop-site.main-page .header:not(.fixed) .top-menu__body { display: flex; }
   .shop-site.main-page .header:not(.fixed) .top-menu__contacts { padding: .75rem .5rem; }
   .shop-site .top-menu__list { position: fixed; display: flex; flex-direction: column; justify-content: flex-start; align-items: center; gap: 2rem; top: 9rem; bottom: 0; left: 0; width: 100%; height: calc(100dvh - 9rem); background: #090909; padding: 3rem 1rem; font-size: 1.6rem; transform: translateX(-100%); visibility: hidden; transition: transform .25s, visibility .25s; }
   .shop-site .top-menu__list.show { transform: translateX(0); visibility: visible; left: 0; }
   .shop-site .header.fixed .top-menu__list,
   .shop-site:not(.main-page) .header .top-menu__list { top: 6rem; height: calc(100dvh - 6rem); }
   .shop-site .header.fixed .top-menu__list a,
   .shop-site:not(.main-page) .header .top-menu__list a { color: #fff; }
   .shop-hero__body { padding-top: 12rem; }
   .shop-hero h1 { font-size: 5rem; max-width: 7em; }
   .shop-hero__text { font-size: 1.6rem; }
   .category-card { padding: .75rem; }
   .category-card__label { width: min(100%, 12rem); min-height: 3rem; }
   .catalog-section__heading { min-height: 7rem; margin-bottom: 2rem; }
   .catalog-section__heading img { height: 7rem; }
   .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.4rem; }
   .delivery-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.4rem 2rem; }
   .shop-site.main-page .footer__body { grid-template-columns: repeat(2, minmax(0, 1fr)); }
   .cart-heading { display: none; }
   .cart-item { grid-template-columns: 5rem minmax(0, 1fr) 8rem 7rem 1.5rem; gap: 1rem; }
   .cart-item__image { width: 5rem; height: 6rem; }
   .cart-item__body h3 { font-size: 1.3rem; }
   .cart-item__quantity button { width: 2.25rem; }
   .cart-item__price { font-size: 1.2rem; }
   .product-detail { gap: 2rem; }
   .product-detail__image { height: 27rem; }
}

@media (max-width: 37.5em) {
   .shop-site { font-size: 1rem; }
   .shop-site .container { padding-inline: 1rem; }
   .shop-site section { margin-bottom: 4.25rem; scroll-margin-top: 6rem; }
   .shop-site .title { font-size: 2.35rem; margin-bottom: 2rem; }
   .shop-site .header { padding-top: 1rem; }
   .shop-site .top-menu,
   .shop-site .header.fixed .top-menu,
   .shop-site:not(.main-page) .header .top-menu { grid-template-columns: 5.5rem minmax(0, 1fr) 2.75rem; gap: .5rem; min-height: 0; }
   .shop-site .top-menu__logo { padding: .4rem; }
   .shop-site .top-menu__logo img { height: 4.5rem; }
   .shop-site .top-menu__phone { font-size: 1.1rem; }
   .shop-site .top-menu__contacts { gap: .25rem; }
   .shop-site .top-menu__address { font-size: .7rem; }
   .shop-site.main-page .header:not(.fixed) .top-menu__contacts { padding: .5rem .15rem; }
   .shop-site .burger,
   .shop-site .burger svg { width: 2.75rem; height: 2.75rem; }
   .shop-site .header.fixed,
   .shop-site:not(.main-page) .header { padding-block: .25rem; }
   .shop-site .header.fixed .top-menu,
   .shop-site:not(.main-page) .header .top-menu { grid-template-rows: 2.75rem 1.1rem; row-gap: .15rem; }
   .shop-site .header.fixed .top-menu__logo,
   .shop-site:not(.main-page) .header .top-menu__logo { grid-row: 1 / 3; }
   .shop-site .header.fixed .top-menu__logo img,
   .shop-site:not(.main-page) .header .top-menu__logo img { height: 4rem; max-width: 100%; }
   .shop-site .header.fixed .top-menu__contacts,
   .shop-site:not(.main-page) .header .top-menu__contacts { display: contents; }
   .shop-site .header.fixed .top-menu__phone,
   .shop-site:not(.main-page) .header .top-menu__phone { grid-column: 2; grid-row: 1; justify-self: end; font-size: 1.1rem; line-height: 1.2; }
   .shop-site .header.fixed .top-menu__address,
   .shop-site:not(.main-page) .header .top-menu__address { grid-column: 2 / -1; grid-row: 2; font-size: .7rem; line-height: 1.15; text-align: right; }
   .shop-site .header.fixed .top-menu__body,
   .shop-site:not(.main-page) .header .top-menu__body { padding: 0; }
   .shop-site .header.fixed .top-menu__list,
   .shop-site:not(.main-page) .header .top-menu__list { position: absolute; top: 100%; bottom: auto; height: calc(100dvh - 100%); }
   .shop-site .top-menu__list { top: 7rem; height: calc(100dvh - 7rem); }
   .shop-site .shop-hero { min-height: 0; margin-bottom: 1.25rem; align-items: flex-start; }
   .shop-hero__image { inset: 0; object-position: 60% center; }
   .shop-hero::before { background: linear-gradient(90deg, #000b, #0005 65%, #0001), linear-gradient(0deg, #000, #0000 25%); }
   .shop-hero__body { padding-top: 10.5rem; padding-bottom: 1.25rem; }
   .shop-hero h1 { font-size: 3.25rem; max-width: 7.2em; }
   .shop-hero__subtitle { font-size: 1.7rem; max-width: 17rem; margin-top: 1rem; }
   .shop-hero__text { font-size: 1.35rem; max-width: 18rem; margin-top: 1.5rem; }
   .shop-hero__channel { margin-top: 1.5rem; font-size: 1rem; max-width: 20rem; }
   .shop-hero__button { margin-top: 2rem; min-width: 16rem; }
   .shop-intro__heading { grid-template-columns: minmax(0, 2.65fr) minmax(0, 1fr); gap: .6rem; }
   .shop-intro__visual { aspect-ratio: 1.9; padding: .65rem .5rem; }
   .shop-intro__logo { padding: .45rem; }
   .shop-site .shop-intro__visual .title { gap: .4rem; text-align: left; }
   .shop-intro__visual .title::after { display: none; }
   .category-grid { gap: .5rem; margin-top: 1rem; }
   .category-card { aspect-ratio: 1.12; min-height: 5.5rem; padding: .3rem; }
   .category-card__label { width: 100%; min-height: 2.35rem; padding: .3rem .15rem; font-size: .85rem; }
   .catalog-section__heading { min-height: 5.5rem; margin-bottom: 1.25rem; }
   .catalog-section__heading img { height: 5.5rem; }
   .product-grid { grid-template-columns: 1fr; gap: 1.4rem; max-width: 27rem; margin-inline: auto; }
   .catalog-section--gift .product-card {
      grid-template-areas: 'photo' 'details';
      grid-template-columns: minmax(0, 1fr);
      min-height: 0;
      aspect-ratio: auto;
      padding: 1rem;
   }
   .catalog-section--gift .product-card__body { padding: 1.25rem .9rem 1rem; }
   .catalog-section--hamon .product-card { min-height: 20rem; }
   .catalog-section--accessories .product-card { padding-bottom: 0; }
   .catalog-section--accessories .product-card__body { min-height: 0; }
   .catalog-section--accessories .product-card__purchase { padding-top: 1rem; }
   .catalog-section--slices .product-card { padding-top: 2rem; }
   .shop-site .delivery-section { padding-block: 1.7rem 2rem; }
   .delivery-list { gap: 1.1rem .6rem; }
   .delivery-list li { gap: .45rem; font-size: .9rem; }
   .delivery-list__icon,
   .delivery-section__details > i { flex-basis: 1.35rem; font-size: 1.25rem; }
   .delivery-section__text,
   .contacts-section__pickup { font-size: .95rem; }
   .shop-site .contacts-section { padding-top: 2rem; }
   .contacts-section__grid { grid-template-columns: minmax(0, 1fr); gap: 1.3rem; }
   .contacts-section__map,
   .contacts-section__map .contact-map { min-height: 15rem; height: 15rem; }
   .shop-site .footer__body { flex-direction: column; gap: 1.5rem; }
   .footer__address { font-size: 1rem; }
   .footer__address > a { font-size: 1.5rem; }
   .footer__links { gap: .8rem; }
   .footer__bottom { flex-direction: column; align-items: center; font-size: .8rem; padding-bottom: 4rem; text-align: center; }
   .shop-site.main-page .footer__body { grid-template-columns: minmax(0, 1fr); justify-items: center; gap: .9rem; text-align: center; }
   .main-page .footer__links { justify-content: center; }
   .main-page .footer__bottom { margin-top: 1.7rem; }
   .cart-float { right: 1rem; bottom: 1rem; width: 3.75rem; height: 3.75rem; }
   .cart-notice { right: 1rem; bottom: 5.25rem; }
   .cart-page__main,
   .product-page__main { padding-top: 8rem; }
   .cart-empty { padding-top: 1.5rem; }
   .cart-empty p { font-size: 1.7rem; }
   .cart-item { grid-template-columns: 4.75rem minmax(0, 1fr) 1.5rem; column-gap: .8rem; row-gap: .9rem; padding-block: 1.3rem; }
   .cart-item__image { grid-column: 1; grid-row: 1 / 3; width: 4.75rem; height: 7rem; }
   .cart-item__body { grid-column: 2; grid-row: 1; }
   .cart-item__body h3 { font-size: 1.35rem; }
   .cart-item__body p { font-size: .8rem; }
   .cart-item__quantity { grid-column: 2; grid-row: 2; width: 8rem; }
   .cart-item__price { grid-column: 2; grid-row: 3; font-size: 1.25rem; }
   .cart-item__remove { grid-column: 3; grid-row: 1; align-self: start; }
   .cart-total { font-size: 1.2rem; padding-top: 1.5rem; }
   .cart-total strong { font-size: 1.7rem; }
   .shop-site .form-row { grid-template-columns: 1fr; gap: 0; }
   .shop-site .shop-form .btn { width: 100%; }
   .product-detail { grid-template-columns: 1fr; gap: 1.5rem; }
   .product-detail__image { height: 24rem; }
   .product-detail .title { text-align: left; }
   .shop-text-page .margin-top { margin-top: 8rem; }
   .shop-site #cookie_note { bottom: 5.5rem; }
}

@media (max-width: 26em) {
   .shop-site .header.fixed .top-menu,
   .shop-site:not(.main-page) .header .top-menu { grid-template-columns: 5.75rem minmax(0, 1fr) 2.75rem; grid-template-rows: 2.75rem 1.6rem; }
   .shop-site .header.fixed .top-menu__logo img,
   .shop-site:not(.main-page) .header .top-menu__logo img { height: 4.5rem; }
   .shop-site .header.fixed .top-menu__address,
   .shop-site:not(.main-page) .header .top-menu__address { font-size: .8rem; }
}

@media (max-width: 22.5em) {
   .shop-site .header.fixed .container,
   .shop-site:not(.main-page) .header .container { padding-inline: .65rem; }
}

@media (prefers-reduced-motion: reduce) {
   .shop-site *,
   .shop-site *::before,
   .shop-site *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}
