.mobile {
  display: none;
}

nav .header-address,
nav .header-contacts {
  display: none;
}

.bx-breadcrumb {
  flex-wrap: wrap;
}

.burger {
  display: none;
  flex-direction: column;
  width: 50px;
  cursor: pointer;
}

.burger span {
  background: rgb(var(--green));
  border-radius: 10px;
  height: 4px;
  margin: 4px 0;
  transition: 0.4s cubic-bezier(0.68, -0.6, 0.32, 1.6);
}

.burger span:nth-of-type(1) {
  width: 50%;
}

.burger span:nth-of-type(2) {
  width: 100%;
}

.burger span:nth-of-type(3) {
  width: 75%;
}

.burger input[type="checkbox"] {
  display: none;
}

.burger input[type="checkbox"]:checked ~ span:nth-of-type(1) {
  transform-origin: bottom;
  transform: rotatez(45deg) translate(4px, 0px);
}

.burger input[type="checkbox"]:checked ~ span:nth-of-type(2) {
  transform-origin: top;
  transform: rotatez(-45deg);
}

.burger input[type="checkbox"]:checked ~ span:nth-of-type(3) {
  transform-origin: bottom;
  width: 50%;
  transform: translate(21px, -3px) rotatez(45deg);
}

@media (min-width: 1100px) {
  .sidebar {
    position: sticky;
    top: 150px;
  }
}

@media (max-width: 1100px) {
  .container {
    padding: 0 15px;
  }

  #iin .container > .d-flex,
  #potential .container > .d-flex,
  footer .container > .d-flex,
  #first-buttons {
    flex-wrap: wrap;
    gap: 16px;
  }
  #iin-cards {
    width: 100%;
  }
  #iin-cards > div {
    width: 100%;
    margin-left: 0;
    margin-top: 30px;
  }

  #first > .container > .d-flex {
    align-items: start;
    gap: 30px;
  }

  #first img {
    margin-left: 0;
  }

  .article-meta + .d-flex {
    flex-wrap: wrap;
    flex-direction: column-reverse;
  }

  #contacts .d-flex {
    flex-direction: column;
  }

  #potential-img {
    flex: 1;
  }

  .sidebar {
    width: auto;
  }
}

@media (max-width: 768px) {
  #first .container > .d-flex > div:first-child {
    max-width: 100%;
  }
  .mobile {
    display: block;
  }

  .desktop {
    display: none;
  }

  .product-price {
    margin-bottom: 20px;
  }

  .product-tags span {
    padding-left: 8px;
    padding-right: 8px;
  }

  .product-buttons > .d-flex > a {
    justify-content: center;
    width: auto;
    text-align: center;
    padding-left: 10px;
    padding-right: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  #top-menu {
    margin-top: 0;
  }
  .need-consult {
    display: none;
  }
  #article .main-content p {
    text-align: left;
  }

  .sidebar {
    width: 100%;
    margin-left: 0;
    flex: auto;
  }
  #first div > img {
    display: none;
  }
  #iin .container > .d-flex,
  #potential .container > .d-flex,
  footer .container > .d-flex,
  #first-buttons {
    flex-direction: column;
    align-items: center;
    gap: 30px;
  }
  .grid-4,
  .grid-3 {
    grid-template-columns: 1fr 1fr;
  }

  h1 {
    font-size: 36px;
  }
  h2 {
    font-size: 36px;
  }

  .block-description b {
    font-size: 18px;
  }
  header {
    padding-top: 20px;
  }
  .burger {
    display: flex;
  }
  nav {
    right: -120%;
    position: fixed;
    background-color: #fff;
    height: 100vh;
    width: 100wh;
    transition: 0.25s;
    z-index: 11;
  }
  .header-address,
  .header-contacts {
    display: none;
  }

  nav .header-address,
  nav .header-contacts {
    display: block;
  }
  nav .header-address {
    margin-top: 30px;
    text-align: center;
  }
  .burger-open {
    overflow: hidden;
    width: 100lvw;
    height: 100lvh;
  }
  .burger-open nav {
    right: 0;
    left: 0;
  }

  header.sticky {
    position: fixed;
    width: 100%;
  }

  #top-menu ul.main-menu {
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

  .why-item {
    padding: 14px;
  }
  .why-item > .d-flex {
    justify-content: space-between;
    flex-wrap: nowrap;
  }
  .why-item h3 {
    font-size: 16px;
  }

  .product-item > .d-flex {
    flex-wrap: wrap;
  }

  .product-item > .d-flex > .d-flex {
    order: 2;
    margin-top: 30px;
  }

  .product-price {
    order: 1;
  }

  #filter {
    grid-auto-flow: row;
  }

  .product-tags {
    margin-top: 30px;
  }

  .product-item img {
    max-width: 250px;
  }

  .product-price {
    font-size: 25px;
  }

  .product-attributes {
    flex-wrap: wrap;
    gap: 30px;
  }

  .product-attribute {
    margin: 0 !important;
  }

  #steps h2 + .d-flex {
    flex-wrap: wrap;
    gap: 16px;
  }

  #advantages .grid > div {
    display: flex;
    gap: 16px;
  }
  #requisites .grid + .d-flex {
    flex-wrap: wrap;
    gap: 16px;
  }

  #tinkoff .d-flex > div:last-child,
  #consult-form .d-flex > div:last-child {
    display: none;
  }

  .grey-block > .container {
    padding: 20px;
  }
  .product-buttons {
    justify-content: center;
  }
  .product-buttons > .d-flex {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 16px;
  }

  .product-buttons > .d-flex > a {
    margin: 0;
    font-size: 13px;
  }
}

@media (max-width: 500px) {
  #requisites .white-button {
    font-size: 16px;
  }
  .grey-block > .container {
    padding: 10px;
  }
  .sidebar > div,
  .grey-block {
    padding: 10px;
  }
  .grid {
    grid-template-columns: 1fr !important;
  }

  .product-item img {
    max-width: 150px;
  }

  #contain img {
    display: none;
  }

  #advantages .grid {
    grid-auto-flow: row;
    align-items: center;
    grid-gap: 30px;
  }

  a.big {
    font-size: 14px;
    padding: 12px 20px;
  }
}
