/** chooseus-style-three **/

.chooseus-style-three{
  position: relative;
}
.chooseus-style-three .outer-container{
  border-radius: 20px;
  overflow: hidden;
  background: var(--secondary-color);
}
.chooseus-style-three .sec-title.light .sub-title{
  color: #fff;
  border-color: #fff !important;
}

.row.clearfix {
  display: flex;
  flex-wrap: wrap;
}

.chooseus-block {
  display: flex;
  margin-bottom: 30px;
}

.chooseus-block-three {
  width: 100%;
  display: flex;
}

.chooseus-block-three .inner-box{
  position: relative;
  display: flex;
  flex-direction: column;
  background: #fff;
  border-radius: 20px;
  overflow: hidden;
  border-top: solid;
  border-width: 5px;
  border-color: #7B0000;
  margin-bottom: 0;
  padding: 35px 30px 41px 30px;
  z-index: 1;
  width: 100%;
}
.chooseus-block-three .inner-box:before{
  position: absolute;
  content: '';
  width: 100%;
  height: 0%;
  left: 0px;
  bottom: 0px;
  z-index: -1;
  transition: all 500ms ease;
}
.chooseus-block-three .inner-box:hover:before{
  height: 100%;
  top: 0px;
}
.chooseus-block-three .inner-box .icon-box{
  position: relative;
  display: inline-block;
  width: 80px;
  height: 80px;
  line-height: 80px;
  text-align: center;
  border-radius: 50%;
  font-size: 44px;
  color: #fff;
  margin-bottom: 39px;
  transition: all 500ms ease;
}
.chooseus-block-three .inner-box:hover .icon-box{
  background: #fff;
  
}
.chooseus-block-three .inner-box h3{
  display: block;
  font-size: 24px;
  line-height: 30px;
  margin-bottom: 11px;
}
.chooseus-block-three .inner-box h3 a{
  display: inline-block;
  color: var(--title-color);
}
.chooseus-block-three .inner-box h3 a:hover{
  text-decoration: underline;
}
.chooseus-block-three .inner-box:hover h3 a,
.chooseus-block-three .inner-box:hover p,
.chooseus-block-three .inner-box:hover .link a,
.chooseus-block-three .inner-box:hover ul li,
.chooseus-block-three .inner-box:hover ul li b{
  color: #fff;
}
.chooseus-block-three .inner-box p{
  margin-bottom: 18px;
  transition: all 500ms ease;
}
.chooseus-block-three .inner-box ul{
  list-style: none;
  padding: 0;
}
.chooseus-block-three .inner-box ul li{
  padding: 8px 0;
  font-size: 16px;
  transition: all 500ms ease;
}
.chooseus-block-three .inner-box ul li b{
  transition: all 500ms ease;
}
.chooseus-block-three .inner-box .link a{
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-size: 16px;
  line-height: 30px;
  color: var(--title-color);
  font-weight: 600;
}
.chooseus-block-three .inner-box .link a i{
  font-size: 12px;
}
/** rtl-css **/
/** responsive-css **/
@media only screen and (max-width: 1200px){
  .chooseus-style-three{
    padding: 0px;
  }
}
@media only screen and (max-width: 991px){
}
@media only screen and (max-width: 767px){
  .chooseus-section,
  .chooseus-style-two,
  .chooseus-style-three .outer-container{
    padding: 70px 0px 40px 0px;
  }
  
  .row.clearfix {
    display: block;
  }
}
@media only screen and (max-width: 599px){
}
@media only screen and (max-width: 499px){
}


        .section-header {
            text-align: center;
            margin-bottom: 60px;
            opacity: 0;
            animation: fadeInUp 0.8s forwards;
        }

        @keyframes fadeInUp {
            from {
                opacity: 0;
                transform: translateY(30px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        .section-header h2 {
            font-size: 48px;
            font-weight: 700;
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
            margin-bottom: 20px;
            position: relative;
            display: inline-block;
        }

        .section-header h2::after {
            content: '';
            position: absolute;
            bottom: -10px;
            left: 50%;
            transform: translateX(-50%);
            width: 100px;
            height: 4px;
            background: linear-gradient(90deg, #667eea, #764ba2);
            border-radius: 2px;
        }

        .section-header p {
            font-size: 18px;
            color: #666;
            line-height: 1.8;
            max-width: 800px;
            margin: 30px auto 0;
        }

        .section-header strong {
            color: #667eea;
            font-weight: 600;
        }

        .map-container {
            position: relative;
            background: linear-gradient(135deg, #667eea15 0%, #764ba215 100%);
            border-radius: 30px;
            padding: 60px 40px;
            box-shadow: 0 20px 60px rgba(0, 0, 0, 0.1);
            overflow: hidden;
        }

        .map-container::before {
            content: '';
            position: absolute;
            top: -50%;
            left: -50%;
            width: 200%;
            height: 200%;
            background: radial-gradient(circle, rgba(102, 126, 234, 0.05) 0%, transparent 70%);
            animation: rotate 20s linear infinite;
            pointer-events: none;
        }

        

        @keyframes rotate {
            from { transform: rotate(0deg); }
            to { transform: rotate(360deg); }
        }

        .map-wrapper {
            position: relative;
            max-width: 1200px;
            margin: 0 auto;
            min-height: 600px;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 20px;
            overflow: hidden;
            box-shadow: 0 15px 50px rgba(0, 0, 0, 0.15);
        }

        .world-map-image {
            width: 100%;
            height: auto;
            display: block;
            border-radius: 20px;
            position: relative;
            z-index: 1;
            filter: brightness(0.95) contrast(1.05);
            transition: all 0.3s ease;
        }

        .map-wrapper:hover .world-map-image {
            filter: brightness(1) contrast(1.1);
        }

        .map-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            pointer-events: none;
            z-index: 2;
        }

        .location-marker {
            position: absolute;
            width: 50px;
            height: 50px;
            cursor: pointer;
            z-index: 3;
            animation: markerFloat 3s ease-in-out infinite;
            pointer-events: all;
        }

        @keyframes markerFloat {
            0%, 100% { transform: translate(-50%, -50%) translateY(0); }
            50% { transform: translate(-50%, -50%) translateY(-10px); }
        }

        .marker-pin {
            position: relative;
            width: 40px;
            height: 40px;
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            border-radius: 50% 50% 50% 0;
            transform: rotate(-45deg);
            box-shadow: 0 8px 20px rgba(102, 126, 234, 0.4);
            transition: all 0.3s ease;
        }

        .marker-pin::before {
            content: '';
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            width: 20px;
            height: 20px;
            background: white;
            border-radius: 50%;
        }

        .marker-pulse {
            position: absolute;
            top: 0;
            left: 0;
            width: 40px;
            height: 40px;
            border-radius: 50% 50% 50% 0;
            border: 2px solid #667eea;
            transform: rotate(-45deg);
            animation: pulse 2s ease-out infinite;
        }

        @keyframes pulse {
            0% {
                transform: rotate(-45deg) scale(1);
                opacity: 1;
            }
            100% {
                transform: rotate(-45deg) scale(2);
                opacity: 0;
            }
        }

        .location-marker:hover .marker-pin {
            transform: rotate(-45deg) scale(1.3);
            box-shadow: 0 12px 30px rgba(102, 126, 234, 0.6);
        }

        .location-info {
            position: absolute;
            bottom: 55px;
            left: 50%;
            transform: translateX(-50%) scale(0);
            background: white;
            padding: 12px 20px;
            border-radius: 12px;
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25);
            white-space: nowrap;
            font-size: 15px;
            font-weight: 600;
            color: #333;
            transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
            pointer-events: none;
            z-index: 4;
        }

        .location-info::after {
            content: '';
            position: absolute;
            bottom: -8px;
            left: 50%;
            transform: translateX(-50%);
            width: 0;
            height: 0;
            border-left: 8px solid transparent;
            border-right: 8px solid transparent;
            border-top: 8px solid white;
        }

        .location-marker:hover .location-info {
            transform: translateX(-50%) scale(1);
        }

        .connection-line {
            position: absolute;
            height: 2px;
            background: linear-gradient(90deg, transparent, #667eea, transparent);
            transform-origin: left center;
            opacity: 0;
            animation: drawLine 3s ease-in-out infinite;
            z-index: 2;
            pointer-events: none;
        }

        @keyframes drawLine {
            0%, 100% {
                opacity: 0;
                width: 0;
            }
            50% {
                opacity: 0.4;
                width: 100%;
            }
        }

        /* Location positions - adjusted for actual map */
        .loc-india { top: 48%; left: 68%; animation-delay: 0s; }
        .loc-uae { top: 45%; left: 61%; animation-delay: 0.2s; }
        .loc-oman { top: 48%; left: 62%; animation-delay: 0.4s; }
        .loc-bangladesh { top: 46%; left: 70%; animation-delay: 0.6s; }
        .loc-uk { top: 32%; left: 48%; animation-delay: 0.8s; }



        .globe-decoration {
            position: absolute;
            width: 600px;
            height: 600px;
            border: 2px dashed rgba(102, 126, 234, 0.15);
            border-radius: 50%;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            animation: rotateGlobe 40s linear infinite;
            pointer-events: none;
            z-index: 1;
        }

        @keyframes rotateGlobe {
            from { transform: translate(-50%, -50%) rotate(0deg); }
            to { transform: translate(-50%, -50%) rotate(360deg); }
        }

        @media (max-width: 768px) {
            .section-header h2 {
                font-size: 32px;
            }

            .section-header p {
                font-size: 16px;
            }

            .map-wrapper {
                min-height: 400px;
            }

            .location-marker {
                width: 40px;
                height: 40px;
            }

            .marker-pin {
                width: 30px;
                height: 30px;
            }

            .marker-pin::before {
                width: 15px;
                height: 15px;
            }
        }