﻿@media (max-width: 1024px) {
    .city-row {  display: flex; justify-content: space-between; align-items: end; overflow-x: scroll; column-gap: 15px; }
    .city-item {  padding-bottom: 15px; }
}

@media (max-width: 768px) {
    .box-result { height: clamp(125px, 10vh, 190px); row-gap: 2px; }
    .contact-form-service {  max-width: 450px; width: 90%;}
    .hero-img { margin-top: 25px; }
}

@media (max-width: 576px) {
    .tr-card { max-width: 350px; min-width: 310px;}
    .hero-content-city h1 { font-size: 28px;}
    .happycustomes {
    span{ width: 115px; height: 115px;}}
    .popular-city ul { padding-top: 25px;}
    .popular-city ul li {font-weight: 600; font-size: 12px;}
    .importexport { width: 100%; height: auto; margin-bottom:24px;}
 .how-it-count img { max-height: 498px; height: 80%; min-height: 438px;}
 .bg-service { background-color: #9a79d7;  padding: 10px 15px !important;  border-radius: 11px;}
 .c-w-100 { width: 100%;}
 .wb-100 { width: 100%;  }
 .next-confim-flex {  display: flex; align-items: center; justify-content: center;}
 .before-after { display: flex; align-items: center; flex-direction: column; row-gap: 15px; justify-content: space-around; }
 .hero-content {  display: flex; flex-direction: column; row-gap: 10px;}
 .footer-hero { font-size: 16px;}
 .w-mobile-100 { width: 100%;}
 .hero-section-city { background-color: #000;  position: relative; max-height: 500px;  height: 70vh; }
 .mmp-professional { max-width: 95%;  margin: 0 auto;}
 .location-filter {flex-wrap: wrap; row-gap: 8px; }
 .inputdesign { height: 42px !important; }
 .service-btn {  height: 42px;}
 .hero-img { margin-top: 18px;}
.mt-cs { margin-top: 20px; }
.video-container {height: 270px; }
.contact-form-service { max-width: 550px; width:100%; background-color: var(--color-white);}
.hostel-gallery { display: block; column-gap: 24px; row-gap: 24px; padding: 12px 0;
        & img
{ max-width: 100%; min-width: 100%; height: 100%;}
.flex-basis33 {flex-basis: auto; padding: 12px 0;}
.flex-basis50 { flex-basis: auto; padding: 12px 0; display: block; flex-direction: column;}
}
.trans-sc {margin-bottom:150px;}
.icon {top: -40px;}
.row-mt {margin-top: 24px;}
.pricing { width: 95%; margin: 0 auto;}
.choose-hero { margin-top: 30px;}
.hero-section-trans{padding-top: clamp(93px, 25vw, 200px); padding-bottom:clamp(65px, 8vw, 100px); background-color: var(--color-secondaryc); position: relative; 
}
.trans-h { margin-bottom:16px;}
.how-it-work-card { padding: 15px 16px;}
.form-img-tr img {max-width: 360px; width: 90%; min-width:270px;}
.form-img-tr { position: absolute; display: flex; justify-content: center; top: -129px; transform: translateX(-56%); left: 50%;}
.contact-check {align-items: flex-start;}
.hotiw {display: flex; flex-direction: column;  margin-bottom: 40px; padding-left: 0; align-items: center;}
.hotiw p {text-align:center;}
}
@media (max-width: 320px) {
.box-result {
    h3 { font-size: 26px; font-weight: 700; margin-bottom: 0;}
}

.box-result { 
 p{ font-size: 13px; margin-bottom: 0; text-align: center;}

}

}
