@media (max-width: 1700px) {
  .industrie-area .slider-area .img-block {width: 450px; height: 330px;}
}
@media (max-width: 1460px) {
  .industrie-area .slider-area .img-block {width: 350px; height: 250px;}

}

@media (max-width: 1024px) {
  .container{padding: 0 20px;}
  .btn-menu{display: block;}
  .header-area{padding: 20px 0;}
  .header-area .logo {width: 160px;}
  .header-area ul.menu-area{position: fixed; right: -1000px; background: #000; width: 100%; top: 78px; display: block; padding: 20px; border: 0; border-radius: 0; text-align: center; transition: all 0.5s ease; -webkit-transition: all 0.5s ease;}
  .header-area ul.menu-area.active{right: 0; transition: all 0.5s ease; -webkit-transition: all 0.5s ease;}
  .header-area ul.menu-area li a{padding: 12px 6px; display: block;}
  .header-area ul.menu-area li .dropdown-menu{transform: translate(0px, 0px) !important; position: relative !important; background: transparent; padding: 0px;}
  .header-area ul.menu-area li .dropdown-menu .dropdown-item{text-transform: capitalize; padding: 4px 10px; text-wrap: auto; text-align: center; background:transparent; color:#fff; margin: 2px 0;}
  .header-area ul.menu-area li .dropdown-menu .dropdown-item:hover, 
  .header-area ul.menu-area li .dropdown-menu .dropdown-item.active{color:#000;}
  .header-area.inner-header{padding: 20px 0;}

  .hero-banner-area h1{font-size: 40px; margin: 0 0 30px 0;}
  .hero-banner-area p {font-size: 18px; margin: 0 0 30px 0;}
  .hero-banner-area .client-logo-area{margin-top: 60px;}
  .hero-banner-area .client-logo-area ul.logo{flex-wrap: wrap; gap: 25px;}

  .intro-section{margin-top: 30px;}
  .intro-section .inner-flex{display: block;}
  .intro-section .inner-flex .intro-content {padding: 0;}
  .intro-section .intro-content h2{font-size: 30px; margin-bottom: 12px;}
  .intro-section .intro-content p{font-size: 15px; line-height: 180%; margin-bottom: 20px;}
  
  .service-blue-area .inside-area .content-part{width: 100%; background: rgba(4, 10, 31, 0.5); padding: 30px 20px; margin-top: 120px;}
  .service-blue-area .inside-area .content-part h2{font-size: 30px;}
  .service-blue-area .inside-area .content-part p{font-size: 15px; line-height: 175%; margin: 0 0 16px 0;}
  .service-blue-area .inside-area .content-part ul.link{margin: 0px 0px 20px 0px;}
  .service-blue-area .inside-area .content-part ul.link li a{font-size: 13px; line-height: 14px; padding: 8px 20px;}
  .service-blue-area .inside-area .content-part .btn-white-text{font-size: 15px; line-height: 20px; letter-spacing: 5%;}

  .what-we-do-area{padding: 30px 0;}
  .what-we-do-area .inner-flex{display: block; margin-bottom: 20px;}
  .what-we-do-area .inner-flex .intro-content{padding: 0 180px 0 0; width: 100%;}
  .what-we-do-area .intro-content h2{font-size: 30px; margin-bottom: 12px;}
  .what-we-do-area .intro-content p{font-size: 15px; line-height: 180%;}
  .what-we-do-area ul.service-list li{width: 33.33%; min-height: 300px;}
  .what-we-do-area ul.service-list li .service-block{padding: 20px;}
  .what-we-do-area ul.service-list li .service-block .bottom .icon{width: 30px; height: 30px;}
  .what-we-do-area ul.service-list li .service-block h3{font-size: 20px; line-height: 130%; letter-spacing: 1px;}
  .what-we-do-area ul.service-list li .service-block p{font-size: 15px;}

  .guidance-area .inside-block{padding: 50px;}
  .guidance-area .inside-block h2{font-size: 30px;}

  .industrie-area{padding: 30px 0;}
  .industrie-area .inner-flex{display: block; margin-bottom: 30px;}
  .industrie-area .inner-flex .status-tag{width: 100%;}
  .industrie-area .inner-flex h2{font-size: 30px; margin-bottom: 0px;}
  .industrie-area .slider-area{padding-left: 20px;}

  .project-area{padding: 10px 0 40px 0;}
  .project-area .inner-flex{display: block; margin-bottom: 30px;}
  .project-area .inner-flex .status-tag{width: 100%;}
  .project-area .inner-flex h2{font-size: 30px; margin-bottom: 0px;}
  .project-area .slider-area{padding-left: 20px;}
  .project-area .slider-area .img-block {width: 650px; height: 380px;}
  .project-area .slider-area .name{font-size: 20px;}
  .project-area .slider-area .name::before{top: 25px;}
  .project-area .btn-white-text{top: 0px;}

  .testimonials-area{padding: 20px 0 40px 0;}
  .testimonials-area .inner-flex{display: block; margin-bottom: 30px;}
  .testimonials-area .inner-flex h2{font-size: 30px; margin-bottom: 0px;}
  .testimonials-area .review-block{padding: 30px 30px 30px 95px; min-height: 300px;}
  .testimonials-area .review-block::before{top: 40px; left: 30px;}
  .testimonials-area .review-block p{font-size: 18px; line-height: 32px;}
  .testimonials-area .review-block .name{font-size: 15px;}

  .footer-area{padding-top: 40px;}
  .footer-area .container {padding: 0 40px;}
  .footer-area .top-part{display: block; margin-bottom: 20px;}
  .footer-area .top-part h2 {width: 100%; font-size: 40px; margin: 0 0 30px 0;}
  .footer-area .top-part .right-form {width: 100%;}
  .footer-area .top-part .form-area .input-block{margin-bottom: 25px;}
  .footer-area .info-part{display: block; padding-bottom: 30px;}
  .footer-area .info-part .logo{margin-bottom: 15px;}
  .footer-area .info-part ul.info{width: 100%;}
  .footer-area .info-part ul.info li{font-size: 15px;}
  .footer-area .copyright-area{padding: 25px 0;}

  .hero-section{margin-top: 98px;}
  .hero-section .hero-bg{height: 340px;}

  .hero-section .badge-text{font-size: 22px; padding: 6px 0px 8px 60px; margin-left: -50px; margin-bottom: 12px; line-height: 132%;}
  .hero-section .badge-icon-shape{position: absolute; left: 21px; top: 1px;}
  .hero-section .badge-icon-shape svg{height: 42px;}
  .hero-section .badge-icon svg{width: 64px; height: 58px;}

  .our-philosophy-area{padding-top: 30px;}
  .our-philosophy-area .inside-block{padding: 40px; min-height: 440px;}
  .our-philosophy-area .inside-block .bottom{width: 100%;}
  .our-philosophy-area .inside-block h2{font-size: 30px;}
  .our-philosophy-area .inside-block p{font-size: 15px; line-height: 175%; margin: 0 0 20px 0;}

  .what-we-optimise-area{padding: 30px 0;}
  .what-we-optimise-area .inside-block{display:flex; flex-direction: column-reverse;}
  .what-we-optimise-area .inside-block .photo-area{width: 100%;}
  .what-we-optimise-area .inside-block .content{width: 100%; padding: 0 0 30px 0;}
  .what-we-optimise-area .inside-block .content h2{font-size: 30px; margin: 0 0 14px 0;}
  .what-we-optimise-area .inside-block ul.link{gap: 10px;}
  .what-we-optimise-area .inside-block ul.link li{font-size: 15px; line-height: 15px; padding: 8px 28px;}

  .work-on{padding: 20px 0 30px 0;}
  .work-on .work-grid-section h2{font-size: 30px; line-height: 133%; padding: 0; margin-bottom: 14px;}
  .work-on .work-grid-section .card-text{font-size: 16px; line-height: 117%; z-index: 4; padding: 18px; bottom: 0; left: 0; right: 0;}
  .how-we-work{margin-bottom: 40px;}
  .how-we-work-block .hww-content{padding: 30px; display: flex; flex-direction: column; align-items: baseline; justify-content: center;}
  .how-we-work-block .hww-content h2{font-size: 30px; margin-bottom: 18px;}
  .how-we-work-block .pill-list{column-gap: 18px;row-gap: 10px; margin-bottom: 15px;}
  .how-we-work-block .pill-list .pill{font-size: 13px; line-height: 14px; padding: 8px 20px;}

  .careers-form .form-section{padding: 40px; margin-bottom: 40px;}
  .careers-form .form-title h2{font-size: 30px;}
  .careers-form .form-title{margin-bottom: 28px;}
  .careers-form .form-grid{row-gap: 28px; column-gap: 40px; margin-bottom: 30px;}
  .careers-form .form-grid .input-group input{padding: 16px 0;}
  .form-input--file .border{font-size: 11px;}
  .form-input--file{padding: 10px 0;}

  .contact-us{margin: 40px 0;}
  .contact-wrapper .contact-form{padding: 30px;}
  .contact-wrapper .contact-form .form-group input, .contact-wrapper .contact-form .form-group textarea{padding: 16px 0;}
  .contact-wrapper .contact-info{padding-right: 30px;}
  .contact-wrapper .contact-info h1{font-size: 36px; margin-bottom: 15px;}
  .contact-wrapper .contact-info .subtitle{font-size: 15px; line-height: 175%; margin-bottom: 20px;}
  .contact-wrapper .contact-info .info-list .info-item .details{padding-right: 0px;}
  .contact-wrapper .contact-info .info-list .info-item .details h3{font-size: 15px; line-height: 160%;}
  .contact-wrapper .contact-info .info-list .info-item .details span{font-size: 15px;}
  
  .deliver-section{margin-top: 30px; padding: 30px;}
  .deliver-section h2{font-size: 30px; margin: 0 0 20px 0;}
  .deliver-section .bento-grid{display: flex; flex-wrap: wrap; justify-content: space-between;}
  .deliver-section .grid-col{width: 48.9%;}
  .deliver-section .grid-col:last-child{width: 100%;}
  .deliver-section .grid-col .card.card-white{padding: 30px;}
  .deliver-section .grid-col .card.card-black{padding: 30px;}
  .deliver-section .grid-col .card .card-content-bottom{bottom: 0; left: 0; right: 0; width: 100%; padding: 30px;}
  .deliver-section .grid-col .card.card-black-img .text-content{left: 30px; top: 30px;}
  .deliver-section .grid-col .card h3{font-size: 22px;}

  .use-cases{padding: 40px 0;}
  .use-cases h2{font-size: 30px; margin-bottom: 20px;}
  .use-cases .use-cases-grid .dots{padding: 20px;}
  .use-cases .use-cases-grid .uc-card{min-height: 260px;}
  .use-cases .use-cases-grid .uc-content.top{padding: 30px 20px;}
  .use-cases .use-cases-grid .uc-content.bottom{padding: 30px 20px;}
  .use-cases .use-cases-grid .uc-content h3{font-size: 18px; line-height: 120%;}
}

@media (max-width: 767px) {


  .hero-banner-area .container{padding-bottom: 30px;}
  .hero-banner-area h1{font-size: 26px; margin: 0 0 20px 0;}
  .hero-banner-area p{font-size: 16px; margin: 0 0 20px 0;}
  .hero-banner-area .client-logo-area{margin-top: 30px;}
  .hero-banner-area .client-logo-area ul.logo{gap: 15px;}

  .intro-section .inner-flex .intro-left{padding-top: 0px;}
  .intro-section .intro-content h2{font-size: 24px; margin-bottom: 10px;}
  .intro-section .intro-content p{font-size: 15px; line-height: 160%;}

  .service-blue-area{padding-top: 30px;}
  .service-blue-area .inside-area .content-part{margin: 0px; padding: 32px;}
  .service-blue-area .inside-area .content-part h2{font-size: 24px;}
  
  .what-we-do-area .status-tag{width: 100%; margin-top: 0px;}
  .what-we-do-area .inner-flex .intro-content{padding: 0px;}
  .what-we-do-area .btn-white-text{position: relative; margin-top: 12px;}
  .what-we-do-area .intro-content h2{font-size: 24px;}
  .what-we-do-area ul.service-list li{width: 100%; min-height: 100%;}
  .what-we-do-area ul.service-list li .service-block .bottom{margin-top: 30px;}
  .what-we-do-area ul.service-list li .service-block h3{font-size: 18px;}

  .guidance-area .inside-block{padding: 30px; text-align: center;}
  .guidance-area .inside-block h2{font-size: 24px; margin: 0 0 15px 0;}
  
  .industrie-area .inner-flex .status-tag{margin-top: 0px;}
  .industrie-area .inner-flex h2{font-size: 24px;}
  .industrie-area .slider-area .img-block{width: 320px; height: 214px;}

  .project-area .inner-flex .status-tag{margin-top: 0px;}
  .project-area .inner-flex h2{font-size: 24px;}
  .project-area .btn-white-text{top: 0px; position: relative; margin-top: 15px;}
  .project-area .slider-area .img-block{width: 340px; height: 220px; margin-bottom: 10px;}
  .project-area .slider-area .name{font-size: 16px; max-width: 340px; padding: 10px 0 10px 20px;}
  .project-area .slider-area .name::before{top: 16px;}

  .testimonials-area .inner-flex{display: block; margin-bottom: 15px;}
  .testimonials-area .inner-flex .status-tag{width: 100%; margin-top: 0px;}
  .testimonials-area .inner-flex h2{font-size: 24px;}
  .testimonials-area .review-block{padding: 60px 20px 20px 20px;}
  .testimonials-area .review-block::before{top: 20px; left: 20px;}
  .testimonials-area .review-block p{font-size: 16px; line-height: 26px;}

  .footer-area{padding-top: 30px;}
  .footer-area .container{padding: 0 20px;}
  .footer-area .top-part h2{font-size: 30px; margin: 0 0 20px 0;}
  .footer-area .top-part .form-area{padding-right: 65px;}
  .footer-area .top-part .form-area .input-block{margin-bottom: 15px; width: 100%;}
  .footer-area .top-part .form-area .input-block .form-control{padding: 5px 0px 12px 0px;}
  .footer-area .top-part .form-area .btn-send{width: 48px; height: 48px; bottom: 14px;}
  .footer-area .info-part ul.info{display: block;}

  .hero-section .badge-wrapper{bottom: 0; left: 0; display: block; padding: 10px; width: 100%; text-align: center;}
  .hero-section .badge-icon-shape{display: none;}
  .hero-section .badge-icon svg {width: 56px; height: 50px;}
  .hero-section .badge-text::before{content: none;}
  .hero-section .badge-text{width: 100%; background: #d8f61a; text-align: center; border-radius: 25px; line-height: 120%; margin-top: 15px; padding: 10px 16px; margin-left: 0; margin-bottom: 0; font-size: 16px;}
 
  .our-philosophy-area .inside-block{padding: 20px;}
  .our-philosophy-area .inside-block .sub{font-size: 15px;}
  .our-philosophy-area .inside-block h2{font-size: 24px;}
  .our-philosophy-area .inside-block p{font-size: 15px; line-height: 160%; margin: 0 0 10px 0;}
  .our-philosophy-area .inside-block h3{font-size: 13px;}

  .what-we-optimise-area .inside-block .content h2{font-size: 24px;}
  .what-we-optimise-area .inside-block ul.link li{padding: 8px 20px;}

  .work-on .work-grid-section h2{font-size: 24px;}
  .work-on .work-grid-section .card-grid{grid-template-columns: repeat(1, 1fr); gap: 10px;}
  
  .how-we-work{margin-bottom: 20px;}
  .how-we-work-block{display: block; max-height: 100%;}
  .how-we-work-block .hww-image{width: 100%;}
  .how-we-work-block .hww-image::after{content: none;}
  .how-we-work-block .hww-content{width: 100%; padding: 20px;}
  .how-we-work-block .pill-list .pill{width: 100%; text-align: center;}

  .careers-form .form-section{padding: 20px;}
  .careers-form .form-title h2{font-size: 24px;}
  .careers-form .form-title p{font-size: 15px; line-height: 150%;}
  .careers-form .form-grid{grid-template-columns: 1fr; row-gap: 15px; column-gap: 0; margin-bottom: 15px;}
  .careers-form .form-grid .input-group label{font-size: 15px;}
  .careers-form .form-grid .input-group input{padding: 8px 0px 12px 0px;}

  .contact-us{margin: 30px 0;}
  .contact-wrapper{display: block;}
  .contact-wrapper .contact-info{width: 100%; padding: 0px;}
  .contact-wrapper .contact-info h1{font-size: 24px;}
  .contact-wrapper .contact-info .info-list{gap: 15px;}
  .contact-wrapper .contact-info .icon svg{width: 30px; height: 30px;}
  .contact-wrapper .contact-form{width: 100%; margin-top: 20px; padding: 25px;}
  .contact-wrapper .contact-form .form-group{margin-bottom: 15px;}
  .contact-wrapper .contact-form .form-group label{font-size: 15px;}
  .contact-wrapper .contact-form .form-group input, .contact-wrapper .contact-form .form-group textarea{padding: 8px 0px 12px 0px;}

  .deliver-section{padding: 20px;}
  .deliver-section h2{font-size: 24px; margin: 0 0 15px 0;}
  .deliver-section .grid-col{width: 100%;}
  .deliver-section .grid-col .card .card-bg-img{height: auto;}
  .deliver-section .grid-col .card.card-white{min-height: auto;}
  .deliver-section .grid-col .card .dots{margin-top: 15px;}
  .deliver-section .grid-col .card.card-white,
  .deliver-section .grid-col .card.card-black,
  .deliver-section .grid-col .card .card-content-bottom{padding: 20px; min-height: auto;}
  .deliver-section .grid-col .card h3{font-size: 16px;}
  .deliver-section .grid-col .card.card-black-img .text-content{left: 0; top: 0; width: 100%; min-height: auto; padding: 20px;}
  .deliver-section .grid-col .card.card-black-img{min-width: 100%}

.use-cases h2{font-size: 24px; margin-bottom: 15px;}
.use-cases .use-cases-grid{display: block;}
.use-cases .use-cases-grid .uc-card{border-right: none; border-bottom: 0.5px solid #C6C6C6; min-height: 200px;}

.use-cases .use-cases-grid .uc-card:last-child{border-bottom: none;}
.use-cases .use-cases-grid .uc-content h3{font-size: 15px;}

.service-blue-area .inside-area .content-part ul.link li { font-size: 13px; line-height: 14px; padding: 8px 20px; width: 100%; text-align: center; }

.use-cases .use-cases-grid .uc-card:nth-child(even) { flex-direction: column-reverse;  }
.use-cases .use-cases-grid .uc-content.top::after { top: 0; bottom: auto;}

}
