/*   
Theme Name: oldprint
Author: E-INFORM
Author URI: e-inform.by
Version: 1.0
*/
.montserrat {
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: normal;
  font-style: normal;
}


.montserrat-bold {
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: bold;
  font-style: normal;
}

.montserrat-italic {
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: normal;
  font-style: italic;
}



*{box-sizing: border-box;}
    body {margin: 0;font-family: "montserrat", sans-serif;line-height: 1.2;max-width: 100%;overflow-x: hidden;}
    img{max-width: 100%;height: auto;}

    h1 {font-size: 48px;font-weight: bold;margin-bottom: 20px;}
    h2 {font-size: 30px;font-weight: bold;margin-bottom: 25px;}

    p {font-size: 24px;font-weight: 300;margin-bottom: 30px;}
    .text-center{text-align: center;}
    .text-bold{font-weight: bold;}
    .span-bold span{font-weight: bold;}
    .nowrap{white-space: nowrap;}
    .list-style-none{list-style: none;}
    .border-radius-10px, .border-radius-10px img{border-radius: 10px;}

    .margin-auto{margin: 0 auto!important;}
    .margin-bottom-20px{margin-bottom: 20px;}
    .margin-bottom-50px{margin-bottom: 50px;}


    .bg-blue{background: #457BA4;}
    .bg-2{background: #457ba4;}
    .color-white{color: #fff;}
    .color-2{color: #FFED61; fill: #FFED61!important;}

    .font-size-1{font-size: 23px;}
    .font-weight-500{font-weight: 500!important;}

    .max-width-300px{max-width: 300px!important;}

    .header {background: white;padding: 20px;box-shadow: 0 2px 5px rgba(0,0,0,0.1);position: relative;}

    .header-container {display: flex;align-items: center;width: 100%;max-width: 1400px;margin: 0 auto;}

    .logo {flex: 1;font-size: 24px;font-weight: bold;color: #000;}
    .logo img{width: 200px;margin-top: -15px;margin-bottom: -15px;}

    .header-main-content {display: flex;flex-direction: column;gap: 20px;}

    .header-contacts-row {display: flex;align-items: center;gap: 40px;}

    .header-contact-column {display: flex;flex-direction: row;gap: 20px;}

    .social-icons {display: flex;gap: 15px;margin-left: auto;}

    .header-address{display: none;}


    header nav ul {display: flex;gap: 30px;list-style: none;margin: 0;padding: 0;}
    header nav ul a{text-decoration: none;color: #000;font-weight: bold;}
    header nav ul a:hover{opacity: 0.8;}
    header nav .page-item {position: relative;cursor: pointer;}
    header nav .dropdown-item {display: inline-flex;align-items: center;}
    header nav .dropdown-item::after {content: '▼';font-size: 12px;margin-left: 5px;transition: 0.3s;}
    header nav .dropdown-item.active::after {transform: rotate(180deg);}
    header nav .dropdown {display: none;position: absolute;top: 100%;left: 0;background: white;padding: 10px;box-shadow: 0 2px 5px rgba(0,0,0,0.1);min-width: 200px;list-style: none;margin: 0;padding: 0;z-index: 99;}
    header nav .dropdown li {padding: 10px;cursor: pointer;}
    header nav .dropdown li:hover {background: #f0f0f0;}
    header nav .dropdown-item:hover .dropdown {display: block;}

    .menu-toggle {display: none;flex-direction: column;gap: 5px;cursor: pointer;padding: 5px;z-index: 1002;}

    .menu-toggle span {width: 24px;height: 3px;background: #000;transition: 0.3s;}

    .menu-toggle span:nth-child(1) {background: cyan;}
    .menu-toggle span:nth-child(2) {background: magenta;}
    .menu-toggle span:nth-child(3) {background: yellow;}
    .menu-toggle span:nth-child(4) {background: black;}

    .social-icons svg {width: 24px;height: 24px;transition: 0.3s;fill: currentColor;}


    .screen-1 {display: flex;width: 100%;height: 800px;height: calc(100vh - 105px);min-height: 500px;overflow: hidden;background-image: url('img/bg-wall4.jpg');background-size: cover;background-position: center;color: white;}

    .content-column {flex: 1;display: flex;flex-direction: column;justify-content: center;align-items: flex-start;padding-top: 20px;padding-left: 70px;clip-path: polygon(0 0, 100% 0, 88% 100%, 0% 100%);background: #f1f1f1;background: radial-gradient(circle, rgba(255, 255, 255, 1) 0%, rgba(224, 224, 224, 1) 100%);}
    .content-column h1{font-size: 120px;margin-top: 10px;margin-bottom: 0;color: #55c3f6;text-shadow: 2px 2px 2px #000;}
    .content-column h1 span{font-weight: normal;}
    .content-column p{font-size: 56px;font-weight: 400;margin-top: 10px;margin-bottom: 20px;color: #f8d047;text-shadow: 1px 1px 1px #000;}


    .cta-button {padding: 15px 20px;font-size: 18px;background-color: #ee2085;color: white;border: none;border-radius: 50px;cursor: pointer;transition: transform 0.3s ease, box-shadow 0.3s ease;}
    .cta-button:hover {transform: scale(1.1);box-shadow: 0 0 20px rgba(255, 111, 97, 0.5);}

    .blue-button {padding: 15px 20px;font-size: 18px;background-color: blue;color: white;border: none;border-radius: 50px;cursor: pointer;transition: transform 0.3s ease, box-shadow 0.3s ease;text-decoration: none;}
    .blue-button:hover {opacity: 0.9;transform: scale(1.7);box-shadow: 0 0 10px blue;}



    .image-column {flex: 1;position: relative;overflow: hidden;}
    .plotter-image {position: absolute;top: unset;bottom:320px;left: 0px;width: 750px;z-index: 1;}
    .roll-image-container {position: absolute;bottom: 0px;left: 152px;width: 430px;height: 583px;background: #fff;overflow: hidden;z-index: 2;border-right: 3px solid #fff;border-left: 3px solid #fff;transform: rotate(180deg);}
    .roll-image-wrapper {display: flex;flex-direction: column;animation: moveImages 20s linear infinite;}
    .roll-image-wrapper img {width: 100%;height: auto;display: block;transform: rotate(180deg);}

    .page-image-column {flex: 1;position: relative;overflow: hidden;}
    .page-image-column .plotter-image {position: absolute;top: unset;bottom:10px;left: 0px;width: 400px;z-index: 1;}
    .page-image-column .roll-image-container{position: absolute;top: 80px;left: 79px;width: 240px;height: 120px;background: #fff;overflow: hidden;z-index: 2;border-right: 3px solid #fff;border-left: 3px solid #fff;transform: rotate(180deg);}
    .page-image-column .roll-image-wrapper {display: flex;flex-direction: column;animation: moveImages 20s linear infinite;}
    .page-image-column .roll-image-wrapper img {width: 100%;height: auto;display: block;transform: rotate(180deg);}



    /* Анимация движения */
    @keyframes moveImages {
      0% {
        transform: translateY(0);
      }
      100% {
        transform: translateY(-50%);
      }
    }

    .container-full{position: relative;display: flex;width: 100%;max-width: 2400px;margin: auto;box-sizing: border-box;border-right: 0;overflow: hidden;}
    .container{position: relative;display: flex;width: 100%;max-width: 1400px;margin: 0 auto;box-sizing: border-box;border-right: 0;}
    .container-inner{width: 100%;box-sizing: border-box;padding: 20px;}


    .advantages-block {color: white;padding: 40px 20px;text-align: center;}


    .advantages-list {display: flex;flex-wrap: wrap;justify-content: center;gap: 20px;}

    .advantage-item {background-color: rgba(255, 255, 255, 0.1);border-radius: 10px;padding: 20px;width: 100%;max-width: 250px;box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);transition: transform 0.3s ease, box-shadow 0.3s ease;}

    .advantage-item:hover {transform: translateY(-10px);box-shadow: 0 8px 12px rgba(0, 0, 0, 0.2);}

    .advantage-icon {width: 50px;height: 50px;margin-bottom: 15px;fill: white;}

    .advantage-title {font-size: 18px;font-weight: bold;margin-bottom: 10px;}

    .advantage-description {font-size: 14px;opacity: 0.8;}


    .services-container {width: 100%;max-width: 1200px;margin: 0 auto;padding: 20px 20px 40px 20px;}

    .services-grid {display: grid;grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));grid-gap: 30px;}

    .services-grid-item {position: relative;overflow: hidden;border-radius: 15px;box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);transition: transform 0.4s ease, box-shadow 0.4s ease;transform: scale(0.8);}
    .services-grid-item.hide {transform: scale(0.8);opacity: 1;}
    .services-grid-item.show {transform: scale(1);opacity: 1;}

    .services-grid-item img {width: 100%;height: 100%;object-fit: cover;display: block;border-radius: 15px;transition: transform 0.4s ease;}

    .services-overlay-background {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.7));
      transition: background 0.4s ease;
      border-radius: 15px;
    }

    .services-grid-item:hover .services-overlay-background {
      background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.9));
    }

    .services-overlay {
      position: absolute;
      bottom: 30px;
      left: 0;
      right: 0;
      color: white;
      text-align: center;
      transition: bottom 0.4s ease;
      z-index: 1;
    }

    .services-overlay h3 {
      font-size: 1.4rem;
      font-weight: bold;
      margin: 0;
      letter-spacing: 1px;
    }

    .arrow-icon {
      position: absolute;
      bottom: 10px;
      left: 50%;
      transform: translateX(-50%);
      font-size: 1.8rem;
      color: #fff;
      opacity: 0;
      transition: bottom 0.4s ease, opacity 0.4s ease;
      z-index: 1;
    }

    .services-grid-item:hover .services-overlay {
      bottom: 50px;
    }

    .services-grid-item:hover .arrow-icon {
      bottom: 20px;
      opacity: 1;
    }




    .description-container {
      display: flex;
      flex-direction: column;
      margin: auto;
      align-items: center;
      padding: 40px 20px;

    }

    .description-row {
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      width: 100%;
      max-width: 1200px;
      margin-bottom: 40px;
    }

    .description-column {
      flex: 1;
      min-width: 300px;
      align-content: center;
      padding: 20px;
      position: relative;
    }

    .equipment-image{max-width: 100%;border-radius: 10px;}

    .description-image {
      width: 100%;
      height: auto;
      border-radius: 10px;
      object-fit: cover;
    }

    /* Стили для текста */
    .description-text{position: relative;z-index: 1;}
    .description-text h2 {
      margin-top: 0px;
    }
    .description-text h3 {
      font-size: 24px;
      font-weight: bold;
      margin-bottom: 15px;
    }

    .description-text p {
      font-size: 18px;
      line-height: 1.2;
    }

    .description-text ul {
      font-size: 22px;
      line-height: 1.4;
    }
    .large-bg-text{position: absolute;bottom: 0px;font-size: 350px;font-weight: bold;opacity: 0.2;color: #2e2f19;width: 100%;text-align: center;z-index: 0;}


    .card-container {
      position: absolute;
      bottom: -20px;
      left: 60%;
      perspective: 1000px;
      -webkit-perspective: 1000px; /* Для Safari */
      width: 300px;
      height: 200px;
    }

    /* Блок с карточкой */
    .card {
      width: 100%;
      height: 100%;
      position: relative;
      transform-style: preserve-3d; /* Сохраняет 3D-пространство */
      -webkit-transform-style: preserve-3d; /* Для Safari */
      animation: rotate 5s infinite linear; /* Анимация вращения */
      transform-origin: left bottom; /* Точка вращения в левом нижнем углу */
      -webkit-transform-origin: left bottom; /* Для Safari */
          box-shadow: 1px 1px 1px #fff;
      border-radius: 10px;
    }

    /* Стили для передней и задней сторон */
    .card-face {
      position: absolute;
      width: 100%;
      height: 100%;
      backface-visibility: hidden; /* Скрывает обратную сторону */
      -webkit-backface-visibility: hidden; /* Для Safari */
      border-radius: 10px;
      box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
      display: flex;
      justify-content: center;
      align-items: center;
      background-size: cover;
      background-position: center;
    }

    .front {
      background-image: url('img/card-1.jpg');
    }

    .back {
      background-image: url('img/card-2.jpg');
      transform: rotateY(180deg);
      -webkit-transform: rotateY(180deg); /* Для Safari */
    }

    @keyframes rotate {
      from {
        
        transform: rotateZ(-50deg) rotate3d(1, -1, 0, 0deg);
        -webkit-transform: rotateX(0deg) rotateY(0deg) rotateZ(-50deg); /* Для Safari */
      }
      to {
        
        transform: rotateZ(-50deg) rotate3d(1, -1, 0, 360deg);
        -webkit-transform: rotateX(0deg) rotateY(360deg) rotateZ(-50deg); /* Для Safari */
      }
    }


    .equipment-block {
      background-color: #faf6ef;
      padding: 40px 0px;
      text-align: center;
      overflow-x: hidden;
    }

    .slick-track {
    position: relative;
    top: 0;
    left: 0;
    display: block;
    margin-left: auto;
    margin-right: auto;
    display: flex;}

    .equipment-slide {
      margin: 15px;
      padding: 0 0 15px 0;
      background: #fff;
      border-radius: 15px;
    }

    .equipment-slide img {
      width: 100%;
      height: auto;
      border-radius: 10px 10px 0 0;
      object-fit: cover;
    }

    .equipment-title {
      font-size: 18px;
      font-weight: bold;
      margin-top: 10px;
      padding: 0 10px;
    }

    .equipment-description {
      display: none;
      font-size: 14px;
      color: #666;
      margin-top: 5px;
      padding: 0 10px;
    }


    .contact-container {
      width: 100%;
    padding: 40px 20px;
}



.contact-columns {
    display: flex;
    gap: 40px;
}

.contact-info,
.contact-form {
    flex: 1;
}

.contact-info{font-size: 22px;}

.contact-info h3,
.contact-form h3 {
    font-size: 28px;
    margin-bottom: 20px;
    margin-left: 30px;
}

.contact-info ul {
    list-style: none;
    padding: 0;
    margin: 0 0 0 30px;
}

.contact-info li {
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.contact-info svg {
    width: 16px;
    height: 16px;
    fill: #333;
}

.contact-info a {
    color: #333;
    text-decoration: none;
    transition: color 0.3s;
}

.contact-info a:hover {
    color: #007BFF;
}

.contact-info span {
    color: #666;
    font-size: 14px;
}

.contacts-info, .contacts-info span{text-align: left;font-size: 20px;color: #000;}

.contact-form {

    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.form-group {
    margin-bottom: 15px;
}

.contact-form label, .form-group label {
    display: block;
    margin-bottom: 5px;
    font-size: 16px;
    font-weight: bold;
}

.contact-form input, .contact-form textarea,.form-group input,
.form-group textarea {
    width: 100%;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-size: 18px;
    box-sizing: border-box;
}

.contact-form input:focus, .contact-form textarea:focus {
  border-color: #EA597B;
  border: 2px;
  box-shadow: 0 0 5px rgba(0, 123, 255, 0.5);
  outline: none;
  background-color: #fff;
}

.form-group textarea {
    resize: none;
}

.contact-form button {
    background: #EA597B;
    color: white;
    border: none;
    padding: 10px 20px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 18px;
    transition: background 0.3s;
}

.contact-form button:hover {
   opacity: 0.8;
}



.portfolio {
  padding: 20px;
  text-align: center;
}

.portfolio h2 {
  font-size: 2rem;
  margin-bottom: 20px;
}

.portfolio-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 10px;
}

.portfolio-grid a {
  display: block;
  position: relative;
  overflow: hidden;
}

.portfolio-grid img {
  width: 100%;
  padding-top: 0;
  object-fit: cover;
  transition: transform 0.3s ease;
}

.portfolio-grid img:hover {
  transform: scale(1.1);
}


.contact-page-info ul{list-style: none;line-height: 30px;}


    .footer {
    background: black;
    color: white;
    padding: 40px 20px;
    line-height: 1.5;
}
.footer a{color: #fff;}
.footer a:hover{opacity: 0.8;}

.footer-container {
    max-width: 1200px;
    margin: 0 auto;
}

.footer-columns {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 40px;
}

.footer-column {
    flex: 1;
}

.column-title {
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 15px;
}

.footer-logo{text-align: left;padding-bottom: 10px;}

.footer-logo-img {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 15px;
}

.footer-logo-img svg {
    width: 40px;
    height: 40px;
}

.company-name {
    font-size: 20px;
    font-weight: bold;
}

.address,
.working-hours {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.address svg,
.working-hours svg {
    width: 16px;
    height: 16px;
    fill: white;
}

.footer-links,
.footer-contacts {
    list-style: none;
    padding: 0;
    margin: 0;
}


.footer-nav{list-style: none;padding: 0;}

.footer-links li,
.footer-contacts li {
    margin-bottom: 10px;
}

.footer-links a,
.footer-contacts a {
    color: white;
    text-decoration: none;
    transition: color 0.3s;
}

.footer-links a:hover,
.footer-contacts a:hover {
    color: cyan;
}

.footer-contacts span {
    color: gray;
    font-size: 14px;
    margin-left: 5px;
}

.footer-social-icons {
    display: flex;
    gap: 25px;
}
.footer-social-icons a{
  text-decoration: none;
  margin:10px;
}

.footer-social-icons svg {
    width: 24px;
    height: 24px;
    fill: white;
    transition: fill 0.3s;
}

.footer-social-icons svg:hover {
    fill: cyan;
}

.footer-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid #444;
    padding-top: 20px;
    margin-top: 20px;
}

.copyright {
    font-size: 14px;
    color: gray;
    color: #fff;
}

.developer-link {
    color: gray!important;
    text-decoration: none;
    font-size: 14px;
    opacity: 0.9;
    transition: color 0.3s;
}

.developer-link:hover {
    color: white;
}

.category-header{background: #007cc4;}
.category-header h1{font-size: 36px;margin: 10px auto;color: #fff;text-align: center;}

.service-header{background: #007cc4;}
.service-header h1{font-size: 32px;margin: 10px auto;color: #fff;text-align: center;}

.breadcrumbs{color: #fff;text-align: center;}
.breadcrumbs ul{display: flex;list-style: none;justify-content: center;padding-left: 0;}
.breadcrumbs li{margin: 0 5px;}
.breadcrumbs li a, .breadcrumbs span a{color: #fff;}
.breadcrumbs-last-item{margin: 0 5px;}


@media (min-width: 1401px) {
  .screen-1 {height: 100vh;height: calc(100vh - 105px);}

    .content-column h1{font-size: 80px;margin-top: 10px;margin-bottom: 20px;}
    .content-column p{font-size: 40px;margin-top: 10px;margin-bottom: 20px;}

    .image-column {flex: 1;position: relative;overflow: hidden;}

    .plotter-image {position: absolute;top: unset;bottom:170px;left: 50px;width: 650px;z-index: 1;}

    .image-container {position: absolute;bottom: 0px;left: 120px;width: 305px;height: 377px;background: #fff;overflow: hidden;z-index: 2;}
    .image-track {position: relative;}
    .stripe-image-item {width: 100%;height: auto;position: absolute;top: 0;left: 0;}
    .stripe-image-item img {width: 100%;height: auto;object-fit: cover;border: none;}

    .roll-image-container {position: absolute;bottom: 0px;left: 180px;width: 380px;height: 400px;background: #fff;overflow: hidden;z-index: 2;border-right: 3px solid #fff;border-left: 3px solid #fff;transform: rotate(180deg);}
    .roll-image-wrapper {display: flex;flex-direction: column;animation: moveImages 20s linear infinite;}
    .roll-image-wrapper img {width: 100%;height: auto;display: block;transform: rotate(180deg);}
    }


@media (max-width: 1400px) {

    h1 {font-size: 48px;font-weight: bold;margin-bottom: 20px;}

    p {font-size: 24px;font-weight: 300;margin-bottom: 30px;}

    .header-container {max-width: 1200px;}

    .logo {flex: 1;font-size: 24px;font-weight: bold;color: #000;}
    .logo img{width: 200px;margin-top: -15px;margin-bottom: -15px;}

    .header-main-content {display: flex;flex-direction: column;gap: 20px;}

    .header-contacts-row {display: flex;align-items: center;gap: 40px;}
    .header-contact-column {display: flex;flex-direction: row;gap: 20px;}

    .social-icons {display: flex;gap: 15px;margin-left: auto;}

    header nav ul {gap: 30px;}
    header nav .dropdown-item.active::after {transform: rotate(180deg);}
    header nav .dropdown {padding: 10px;min-width: 200px;}
    header nav .dropdown li {padding: 10px;cursor: pointer;}


    .social-icons svg {width: 24px;height: 24px;}


    .screen-1 {height: 100vh;height: calc(100vh - 105px);}

    .content-column {padding-top: 0px;padding-left: 70px;clip-path: polygon(0 0, 100% 0, 88% 100%, 0% 100%);background: #f1f1f1;background: radial-gradient(circle, rgba(255, 255, 255, 1) 0%, rgba(224, 224, 224, 1) 100%);}
    .content-column h1{font-size: 60px;margin-top: 10px;margin-bottom: 0;}
    .content-column p{font-size: 40px;margin-top: 10px;margin-bottom: 20px;}


    .image-column {flex: 1;position: relative;overflow: hidden;}
    .plotter-image {position: absolute;top: unset;bottom:110px;left: 0px;width: 550px;z-index: 1;}
    .image-container {position: absolute;bottom: 0px;left: 120px;width: 305px;height: 377px;background: #fff;overflow: hidden;z-index: 2;}
    .image-track {position: relative;}
    .stripe-image-item {width: 100%;height: auto;position: absolute;top: 0;left: 0;}
    .stripe-image-item img {width: 100%;height: auto;object-fit: cover;border: none;}

    .roll-image-container {position: absolute;bottom: 0px;left: 120px;width: 305px;height: 304px;background: #fff;overflow: hidden;z-index: 2;border-right: 3px solid #fff;border-left: 3px solid #fff;transform: rotate(180deg);}
    .roll-image-wrapper {display: flex;flex-direction: column;animation: moveImages 20s linear infinite;}
    .roll-image-wrapper img {width: 100%;height: auto;display: block;transform: rotate(180deg);}

    .services-grid {
      display: services-grid;
      services-grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
      services-grid-gap: 30px;
    }

    .services-grid-item {position: relative;overflow: hidden;border-radius: 15px;box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);transition: transform 0.4s ease, box-shadow 0.4s ease;
      transform: scale(0.8);
    }
    .services-grid-item.hide {transform: scale(0.8);opacity: 1;}

    .services-grid-item.show {transform: scale(1);opacity: 1;}

    .services-grid-item img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
      border-radius: 15px;
      transition: transform 0.4s ease;
    }

    /* Градиентный фон */
    .services-overlay-background {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.7));
      transition: background 0.4s ease;
      border-radius: 15px;
    }

    /* Эффект при наведении на фон */
    .services-grid-item:hover .services-overlay-background {
      background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.9));
    }

    /* Наложенный текст и иконка */
    .services-overlay {
      position: absolute;
      bottom: 30px;
      left: 0;
      right: 0;
      color: white;
      text-align: center;
      transition: bottom 0.4s ease;
      z-index: 1;
    }

    .services-overlay h3 {
      font-size: 1.3rem;
      font-weight: bold;
      margin: 0;
      letter-spacing: 1px;
    }

    .arrow-icon {
      position: absolute;
      bottom: 10px;
      left: 50%;
      transform: translateX(-50%);
      font-size: 1.8rem;
      color: #fff;
      opacity: 0;
      transition: bottom 0.4s ease, opacity 0.4s ease;
      z-index: 1;
    }

    .services-grid-item:hover .services-overlay {
      bottom: 50px;
    }

    .services-grid-item:hover .arrow-icon {
      bottom: 20px;
      opacity: 1;
    }


    .service-header{background: #007cc4;}
}

@media (max-width: 1200px) {

    .content-column {padding-top: 0px;padding-left: 20px;}
    .image-column {flex: 1;position: relative;overflow: hidden;}
    .plotter-image {position: absolute;top: 150px;bottom:unset;left: 0px;width: 550px;max-width: unset;z-index: 1;}
    .image-container {position: absolute;top: 235px;bottom: 0px;left: 120px;width: 305px;background: #fff;overflow: hidden;z-index: 2;}
    .image-track {position: relative;}
    .stripe-image-item {width: 100%;height: auto;position: absolute;top: 0;left: 0;}
    .stripe-image-item img {width: 100%;height: auto;object-fit: cover;border: none;}

    .roll-image-container {position: absolute;top:270px;bottom: 0px;left: 120px;width: 305px;background: #fff;overflow: hidden;z-index: 2;border-right: 3px solid #fff;border-left: 3px solid #fff;transform: rotate(180deg);}
    .roll-image-wrapper {display: flex;flex-direction: column;animation: moveImages 20s linear infinite;}
    .roll-image-wrapper img {width: 100%;height: auto;display: block;transform: rotate(180deg);}

    .service-header{background: #007cc4;}


    }


@media (min-width: 1024px) {
      .advantages-list {flex-wrap: nowrap;justify-content: space-between;}
      .advantage-item {width: calc(25% - 20px);max-width: none;}
    }

    @media (max-width: 1024px) {
    .logo img{width: 150px;margin-top: -15px;margin-bottom: -15px;}
    }


@media (max-width: 768px) {
  h2 {font-size: 30px;}
  .logo {flex: 1;font-size: 24px;font-weight: bold;color: #000;}
    .logo img{width: 140px;margin-top: -15px;margin-bottom: -15px;}
    .header-main-content {position: fixed;top: 0;left: -330px;width: 290px;height: 100vh;background: #333;color: white;flex-direction: column-reverse;padding: 30px 20px 20px;gap: 20px;justify-content: flex-end;justify-content: start;transition: 0.3s;z-index: 1001;}

    .header-main-content.active {left: 0;overflow: auto;}

    .header-contacts-row {flex-direction: column;gap: 20px;padding-bottom: 20px;}
    header nav{border-bottom: 1px solid #555;padding-bottom: 20px;}
    header nav ul {flex-direction: column;gap: 20px;}

    .header-contact-column {color: white;flex-direction: column;}
    .header-contact-column a {color: white;}

    header nav .page-item {color: white;padding: 10px;border-radius: 4px;}
    header nav .page-item:hover {background: #555;}
    header nav ul a{color: #fff;}
    header nav .dropdown {position: relative;background: #444;margin-left: 20px;margin-top: 10px;box-shadow: none;padding: 0;}
    header nav .dropdown li {padding: 10px;}
    header nav .dropdown li:hover {background: #666;}


    .menu-toggle {display: flex;}

    .mobile-overlay {display: none;position: fixed;top: 0;left: 0;right: 0;bottom: 0;background: rgba(0,0,0,0.5);z-index: 1000;}
    .mobile-overlay.active {display: block;}

    .social-icons{margin-left: 0;}
    .social-icons svg {fill: white;}

    .header-address{display: flex;}

    .screen-1 {display: flex;flex-direction: column;height: calc(100vh - 50px);min-height: 600px;background: #fff;background-image: url('img/bg-wall3m.jpg');background-position: -90px center;background-size: 550px;background-repeat: no-repeat;}
    .content-column {padding-left: 20px;background: #ffffff;clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);background: linear-gradient(360deg,rgba(255, 255, 255, 1) 40%, rgba(224, 224, 224, 1) 100%);}
    .content-column h1{font-size: 40px;margin-top: 10px;margin-bottom: 20px;background: linear-gradient(to top right, #CF18BA 0%, #1ECCCF 100%);-webkit-background-clip: text;-webkit-text-fill-color: transparent;    text-shadow: none;}
    .content-column p{font-size: 26px;margin-top: 10px;margin-bottom: 30px;}

    .plotter-image {position: absolute;top: 10px;bottom:unset;left: 0px;width: 460px;max-width: unset;z-index: 1;}
    .image-container {position: absolute;top:83px;bottom: unset;left: 100px;width: 255px;height: 105px;background: #fff;overflow: hidden;z-index: 2;}
    .image-track {position: relative;}
    .stripe-image-item {width: 100%;height: 100px;position: absolute;top: 0;left: 0;}
    .stripe-image-item img {width: 100%;height: auto;object-fit: cover;border: none;}

    .roll-image-container {position: absolute;top: 110px;bottom: 0px;left: 97px;width: 262px;height: 112px;background: #fff;overflow: hidden;z-index: 2;border-right: 3px solid #fff;border-left: 3px solid #fff;transform: rotate(180deg);}
    .roll-image-wrapper {display: flex;flex-direction: column;animation: moveImages 20s linear infinite;}
    .roll-image-wrapper img {width: 100%;height: auto;display: block;transform: rotate(180deg);}


    .advantages-block{padding: 20px 0;}

      .advantage-item {width: calc(50% - 20px);max-width: none;padding: 10px;}

      .advantage-icon {width: 40px;height: 40px;}
      .advantage-title {font-size: 13px;}
    .advantage-description{display: none;}


    .services-grid {
        services-grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
      }

      .description-container{overflow: hidden;}
      .description-row {flex-direction: column;align-items: center;}

      .description-column {min-width: 100%;padding: 20px;}

      .description-column-img{padding: 20px 10px;}
      .large-bg-text{font-size: 200px;opacity: 0.3;}

      .mobile-reverse{flex-direction: column-reverse;}
      .mobile-reverse .wp-block-column{max-width: 100%;}


      .equipment-slide {padding: 0 0 10px 0;}

      .contact-columns {flex-direction: column;gap: 30px;}

    .contact-info, .contact-form {text-align: center;}
    .contact-info{font-size: 19px;}

.contact-info h3,
.contact-form h3 {font-size: 26px;margin-left: 0;}
.contact-info ul {margin-left: 0;}

.portfolio-grid {grid-template-columns: repeat(3, 1fr);}


      .footer-columns {flex-direction: column;gap: 30px;}

    .footer-column {text-align: center;}
    .footer-social-icons{display: block;margin:auto;text-decoration: none;}
    .footer-social-icons svg {fill: white;}

    .footer-bottom {flex-direction: column;align-items: flex-start;gap: 10px;}

    .developer-link {align-self: flex-end;}



}

@media (max-width: 480px) {

	.page-image-column {flex: 1;position: relative;overflow: hidden;}
    .page-image-column .plotter-image {position: absolute;top: unset;bottom:10px;left: 0px;width: 330px;z-index: 1;}
    .page-image-column .roll-image-container{position: absolute;top: 103px;left: 68px;width: 190px;height: 100px;background: #fff;overflow: hidden;z-index: 2;border-right: 3px solid #fff;border-left: 3px solid #fff;transform: rotate(180deg);}
    .page-image-column .roll-image-wrapper {display: flex;flex-direction: column;animation: moveImages 20s linear infinite;}
    .page-image-column .roll-image-wrapper img {width: 100%;height: auto;display: block;transform: rotate(180deg);}


	}