/* Десктоп (≥1921px) - большое изображение */
@media (min-width: 1921px) {
  .header::before {
    /* WebP с фолбэком на PNG */
    background-image: url("../img/Cover_Art_large.png");
    background-image: -webkit-image-set(url("../img/Cover_Art_large.webp") 1x);
    background-image: -webkit-image-set(
      url("../img/Cover_Art_large.webp") type("image/webp"),
      url("../img/Cover_Art_large.png") type("image/png")
    );
    background-image: image-set(
      url("../img/Cover_Art_large.webp") type("image/webp"),
      url("../img/Cover_Art_large.png") type("image/png")
    );
  }

  .slider-slide.big {
    width: 600px;
    height: 330px;
  }
  .slider-slide.small {
    width: 300px;
    height: 330px;
  }
  .footer-link img {
    width: 320px;
  }
}

/* Ноутбуки (≤1920px) - среднее изображение */
@media (max-width: 1920px) {
  .header::before {
    /* WebP с фолбэком на PNG */
    background-image: url("../img/Cover_Art_medium.png");
    background-image: -webkit-image-set(url("../img/Cover_Art_medium.webp") 1x);
    background-image: -webkit-image-set(
      url("../img/Cover_Art_medium.webp") type("image/webp"),
      url("../img/Cover_Art_medium.png") type("image/png")
    );
    background-image: image-set(
      url("../img/Cover_Art_medium.webp") type("image/webp"),
      url("../img/Cover_Art_medium.png") type("image/png")
    );
    background-size: cover;
  }
  .slider-slide.big {
    width: 500px;
    height: 275px;
  }
  .slider-slide.small {
    width: 250px;
    height: 275px;
  }
}

@media (max-width: 1700px) {
  .values-content {
    padding: 90px 30px;
  }

  .values-list {
    -ms-grid-columns: (1fr)[2];
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 1400px) {
  .intro-content,
  .values-content,
  .technologes-content {
    grid-column: 3 / 8 span;
  }

  .img-wrap-left,
  .img-wrap-right {
    display: none;
  }
  .card-left,
  .card-right {
    grid-column: 1 / 12 span;
  }

  .card__img-wrap {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
  }
  .card__content {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
  }

  .card__content {
    padding: 30px 60px 0 60px;
  }
}

@media (max-width: 1200px) {
  .intro-content,
  .values-content,
  .technologes-content {
    grid-column: 2 / 10 span;
  }
}

/* Планшеты (≤1024px) */
@media (max-width: 1024px) {
  .header {
    height: min(600px, 100vh);
  }

  .header::before {
    /* WebP с фолбэком на JPG */
    background-image: url("../img/Cover_Art_M.jpg");
    background-image: -webkit-image-set(url("../img/Cover_Art_M.webp") 1x);
    background-image: -webkit-image-set(
      url("../img/Cover_Art_M.webp") type("image/webp"),
      url("../img/Cover_Art_M.jpg") type("image/jpeg")
    );
    background-image: image-set(
      url("../img/Cover_Art_M.webp") type("image/webp"),
      url("../img/Cover_Art_M.jpg") type("image/jpeg")
    );
    background-size: cover;
  }

  .header-content {
    -ms-grid-column: 4;
    -ms-grid-column-span: 5;
    grid-column: 3 / 9;
  }

  .slider-container {
    padding: 15px 0;
  }
  .slider-slide.big {
    width: 400px;
    height: 220px;
  }
  .slider-slide.small {
    width: 200px;
    height: 220px;
  }

  .card__content {
    padding: 30px 30px 0 30px;
  }

  .intro-content,
  .values-content,
  .technologes-content {
    grid-column: 1 / 12 span;
  }

  .app_container {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
  }

  .footer__container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 60px;
  }
}

/* Мобильные (≤768px) */
@media (max-width: 768px) {
  .header {
    height: min(400px, 100vh);
  }

  .header::before {
    /* WebP с фолбэком на JPG */
    background-image: url("../img/Cover_Art_sm.jpg");
    background-image: -webkit-image-set(url("../img/Cover_Art_sm.webp") 1x);
    background-image: -webkit-image-set(
      url("../img/Cover_Art_sm.webp") type("image/webp"),
      url("../img/Cover_Art_sm.jpg") type("image/jpeg")
    );
    background-image: image-set(
      url("../img/Cover_Art_sm.webp") type("image/webp"),
      url("../img/Cover_Art_sm.jpg") type("image/jpeg")
    );
    background-size: cover;
    background-position-y: 50%;
  }

  
   


  .slider-slide.big {
    width: 300px;
    height: 165px;
  }
  .slider-slide.small {
    width: 150px;
    height: 165px;
  }
  .slider-slide {
    margin-right: 10px;
  }
  .title {
    font-size: 36px;
    margin-bottom: 20px;
  }

  .descr {
    font-size: 24px;
  }

  .card {
    padding: 45px 15px;
  }

  .card__title {
    font-size: 36px;
  }

  .subject {
    font-size: 24px;
  }

  .card__content {
    padding: 15px 15px 0 15px;
  }

  .card__img {
    border-radius: 16px;
  }

  .gallery-close-btn {
    top: 10px;
    right: 15px;
    width: 40px;
    height: 40px;
    font-size: 30px;
  }

  .gallery-img-container {
    padding: 10px;
    max-width: 95vw;
    max-height: 80vh;
  }

  .app__list-2 {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }
  .footer__container {
    padding: 30px 15px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 30px;
  }
  .footer-link img {
    width: 320px;
  }
  .reg {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .footer__descr {
    text-align: center;
  }
}

@media (max-width: 560px) {
   .header-content {
        -ms-grid-column: 4;
        -ms-grid-column-span: 5;
        grid-column: 3 / 10;
    }
  .values-list {
    -ms-grid-columns: (1fr)[1];
    grid-template-columns: repeat(1, 1fr);
  }

  .intro__container {
    padding: 30px 0;
  }
  .values-content {
    padding: 45px 20px;
  }

  .technologes__container {
    padding: 45px 30px;
  }

  .app__list{
    flex-wrap: wrap;
    max-width: 400px;
  }
}

/* Очень маленькие экраны (≤480px) */
@media (max-width: 480px) {
  .slider-slide.big {
    width: 250px;
    height: 138px;
  }
  .slider-slide.small {
    width: 125px;
    height: 138px;
  }
}

/* Для touch-устройств */
@media (hover: none) {
  .card__img:hover {
    -webkit-transform: none;
        -ms-transform: none;
            transform: none;
  }
}