/* ========================================
   HERO TITLE SIZE REDUCTION (30% smaller)
   ======================================== */

.hero-content h1 {
  font-size: 64px !important;
}
@media only screen and (min-width: 1200px) and (max-width: 1600px) {
  .hero-content h1 {
    font-size: 56px !important;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .hero-content h1 {
    font-size: 53px !important;
  }
}
@media (max-width: 991px) {
  .hero-content h1 {
    font-size: 40px !important;
  }
}
@media (max-width: 575px) {
  .hero-content h1 {
    font-size: 40px !important;
    line-height: 48px !important;
  }
}

/* Mobile optimization for hero content */
@media (max-width: 767px) {
  .hero-content .hero-desc,
  .hero-content .hero-description {
    max-width: 100% !important;
  }
}

/* Tablet optimization */
@media (min-width: 768px) and (max-width: 991px) {
  .hero-content .hero-desc,
  .hero-content .hero-description {
    max-width: 90% !important;
  }
}

/* Why Dubai section - left align on mobile */
@media (max-width: 767px) {
  .features-section .about-content-box {
    text-align: left !important;
  }

  /* What We Offer section - left align on mobile */
  .services-section .section-title,
  .services-section .section-title.text-left,
  .services-section .section-title h2 {
    text-align: left !important;
  }
}


/* ========================================
   PREVENT HORIZONTAL OVERFLOW
   ======================================== */

/* Prevent horizontal overflow on body and html */
html, body {
    overflow-x: hidden !important;
    max-width: 100vw !important;
}

/* ========================================
   SUB-TITLE ON DARK BACKGROUNDS
   ======================================== */

/* Make sub-title more readable on dark backgrounds */
.black-bg .sub-title {
    background-color: #7b8339 !important;
    color: #ffffff !important;
}

/* ========================================
   BRAND COLOR - LIGHTER NAVY FOR PARAGRAPHS
   ======================================== */

/* Lighter navy for better paragraph readability */
p {
    color: #2a4d6e !important;
}

/* Keep paragraphs white when inside text-white containers */
.text-white p {
    color: #fff !important;
}

/* Exception: Hero subtitle should be white and bold */
.hero-content p.hero-desc {
    color: #fff !important;
    font-weight: 700 !important;
    font-size: 32px !important;
}

/* Mobile font size adjustments for hero subtitle */
@media (max-width: 767px) {
    .hero-content p.hero-desc {
        font-size: 20px !important;
    }

    .hero-content .hero-description p {
        font-size: 14px !important;
    }
}

@media (max-width: 575px) {
    .hero-content p.hero-desc {
        font-size: 20px !important;
    }

    .hero-content .hero-description p {
        font-size: 14px !important;
    }
}

/* ========================================
   SERVICE CARDS - ALWAYS SHOW BACKGROUND
   ======================================== */

/* Prevent horizontal overflow on services section */
.services-section .container,
.services-section .container-fluid {
    overflow: hidden !important;
}

/* Two-column layout: left text, right cards */
.services-section .section-title {
    text-align: left !important;
    padding-right: 30px;
}

.services-section .section-title h2 {
    font-size: 32px !important;
    line-height: 1.2;
    color: #103452 !important;
}

/* Intro paragraph text color on white background */
.services-section .services-intro-text p {
    color: #2a4d6e !important;
}

.services-section .services-outro-text p {
    color: #2a4d6e !important;
}

/* Service cards grid layout */
.services-section .service-cards-grid {
    margin: 0 -15px;
}

.services-section .service-cards-grid .single-service-item-two {
    height: 100%;
    min-height: 380px;
}

/* Mobile responsive - stack title on top */
@media (max-width: 991px) {
    .services-section .section-title {
        text-align: center !important;
        padding-right: 0;
        margin-bottom: 10px !important;
    }
}

/* Mobile responsive typography for services section */
@media (max-width: 767px) {
    .services-section .section-title h2 {
        font-size: 22px !important;
    }
}

/* Make service card backgrounds always visible (not just on hover) */
.single-service-item-two .hover-bg {
    opacity: 1 !important;
    visibility: visible !important;
    -webkit-transition: all 0.3s ease-out 0s !important;
    transition: all 0.3s ease-out 0s !important;
    -webkit-transform: scale(1) !important;
    transform: scale(1) !important;
}

/* Add hover zoom effect like Why Dubai cards */
.single-service-item-two:hover .hover-bg {
    -webkit-transform: scale(1.1) !important;
    transform: scale(1.1) !important;
}

/* Ensure overflow is hidden for smooth zoom effect */
.single-service-item-two {
    overflow: hidden !important;
    border-radius: 12px !important;
}

/* Make service card text white for readability over background images */
.single-service-item-two .content p {
    color: #fff !important;
}

.single-service-item-two .content h3.title,
.single-service-item-two .content h3.title a {
    color: #fff !important;
}

.single-service-item-two .content .btn-link {
    color: #fff !important;
}

/* Service card icon styling */
.single-service-item-two .content .icon {
    margin-bottom: 20px !important;
}

.single-service-item-two .content .icon i {
    font-size: 48px !important;
    color: #fff !important;
    opacity: 0.9;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.single-service-item-two:hover .content .icon i {
    opacity: 1;
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}

/* Gallery Slider Spacing - Reduce gap between items */
.gallery-section-two .slick-slide {
    padding: 0 10px !important;
}

.gallery-section-two .slick-list {
    margin: 0 -10px !important;
}

.gallery-section-two .slider-active-3-item-dot {
    max-width: 1400px !important;
    margin: 0 auto !important;
}

.gallery-section-two .slick-track {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
}

/* ========================================
   ABOUT SECTION INFO BOX
   ======================================== */

.about-info-box .info-item {
    display: flex;
    align-items: center;
    gap: 12px;
}

.about-info-box .info-item i {
    font-size: 20px;
    color: #7b8339;
    flex-shrink: 0;
}

.about-info-box .info-item span {
    font-size: 16px;
    line-height: 1.5;
}

/* ========================================
   ABOUT US SECTION - BLUE BACKGROUND
   ======================================== */

/* Add dark blue background to About Us section */
.about-section {
    position: relative;
}

.about-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #103452;
    z-index: 0;
    pointer-events: none;
}

.about-section .container {
    position: relative;
    z-index: 1;
}

/* About Us counter grid spacing */
.about-counter-grid .row {
    row-gap: 20px;
}

/* ========================================
   COUNTER SECTION ALIGNMENT
   ======================================== */

.single-counter-item-two .inner-counter {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
}

.single-counter-item-two .inner-counter .icon {
    margin-bottom: 15px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.single-counter-item-two .inner-counter .content {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
}

.single-counter-item-two .inner-counter .content .number,
.single-counter-item-two .inner-counter .content .number span.count {
    font-size: 56px !important;
    font-weight: 700 !important;
    margin-bottom: 10px !important;
}

.single-counter-item-two .inner-counter .content p {
    font-size: 16px !important;
    margin: 0 !important;
}

/* Responsive Grid Layout with Playful Tilted Cards */
.about-two_content-box .card-list {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 18px 15px !important;
    max-width: 520px !important;
}

/* 1 column on smaller screens */
@media (max-width: 767px) {
    .about-two_content-box .card-list {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
        margin: 0 auto !important;
    }

    /* Stack icon above text on mobile */
    .about-two_content-box .card-list .card-item {
        flex-direction: column !important;
        text-align: center !important;
        padding: 15px 20px !important;
    }

    .about-two_content-box .card-list .card-item i {
        margin-right: 0 !important;
        margin-bottom: 10px !important;
    }
}

.about-two_content-box .card-list .card-item {
    display: inline-flex !important;
}

/* Uniform height for service cards in What's Included section */
.slider-active-4-item {
    display: flex !important;
    align-items: stretch !important;
}
.slider-active-3-item-dot {
    display: flex !important;
    align-items: stretch !important;
}

.slider-active-3-item-dot .slick-track {
    display: flex !important;
    align-items: stretch !important;
}

.slider-active-3-item-dot .slick-slide {
    height: inherit !important;
    display: flex !important;
    align-items: stretch !important;
}

.slider-active-3-item-dot .slick-slide > div {
    display: flex !important;
    width: 100% !important;
    height: 100% !important;
}

.gw-testimonial-item-two {
    display: flex !important;
    height: 100% !important;
}

.gw-testimonial-item-two .testimonial-inner-content {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    width: 100% !important;
}

.gw-testimonial-item-two .testimonial-inner-content .quote-rating-box {
    flex-shrink: 0;
}

.gw-testimonial-item-two .testimonial-inner-content > p {
    flex: 1 !important;
    display: flex !important;
    align-items: center !important;
}

.gw-testimonial-item-two .testimonial-inner-content .author-thumb-title {
    flex-shrink: 0;
    margin-top: auto;
}

.slider-active-4-item .slick-track {
    display: flex !important;
    align-items: stretch !important;
}

.slider-active-4-item .slick-slide {
    height: inherit !important;
    display: flex !important;
    align-items: stretch !important;
}

.slider-active-4-item .slick-slide > div {
    display: flex !important;
    width: 100% !important;
    height: 100% !important;
}

.single-service-item-two {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
}

.single-service-item-two .content {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 !important;
    height: 100% !important;
}

.single-service-item-two .content .icon {
    margin-bottom: 20px;
    flex-shrink: 0;
}

.single-service-item-two .content .title {
    margin-bottom: 15px;
    min-height: 60px;
    display: flex;
    align-items: center;
}

.single-service-item-two .content p {
    flex: 1 !important;
    margin-bottom: 20px;
}

.single-service-item-two .content .btn-link {
    margin-top: auto;
    flex-shrink: 0;
}

/* ========================================
   GALLERY ITEMS - STACK CONTENT BELOW IMAGE
   ======================================== */

.single-gallery-item-two {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
}

.single-gallery-item-two .img-holder {
    width: 100% !important;
    flex-shrink: 0 !important;
}

.single-gallery-item-two .content {
    width: 100% !important;
    flex-shrink: 0 !important;
}

/* Gallery Slider - Hide pagination dots */
.gallery-section-two .slick-dots {
    display: none !important;
}

/* ========================================
   CONTACT INFO CARDS - EQUAL HEIGHT
   ======================================== */

.contact-info-section .row {
    display: flex !important;
    align-items: stretch !important;
}

.contact-info-section .contact-info-item {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    min-height: 250px !important;
}

.contact-info-section .contact-info-item .icon {
    flex-shrink: 0;
}

.contact-info-section .contact-info-item .info {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/* Center icons on mobile screens */
@media (max-width: 767px) {
    .contact-info-section .contact-info-item {
        text-align: center !important;
        align-items: center !important;
    }

    .contact-info-section .contact-info-item .icon {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        margin: 0 auto !important;
    }

    .contact-info-section .contact-info-item .info {
        text-align: center !important;
        align-items: center !important;
    }
}

/* ========================================
   HOW TO APPLY - CENTER IMAGES ON MOBILE
   ======================================== */

@media (max-width: 1199px) {
    .we-section .we-image {
        padding-right: 0 !important;
    }

    .we-section .we-image img {
        width: 100%;
        height: auto;
    }

    /* Registration Steps - Prevent overflow on mobile */
    .we-section .single-features-list {
        width: 100%;
        max-width: 100%;
        overflow: hidden;
    }

    .we-section .single-features-list .content {
        flex: 1;
        min-width: 0;
        width: 100%;
    }

    .we-section .single-features-list .content p {
        font-size: 16px !important;
        line-height: 1.5 !important;
        word-wrap: break-word;
        overflow-wrap: break-word;
    }

    .we-section .single-features-list .content h4 {
        font-size: 18px !important;
        word-wrap: break-word;
        overflow-wrap: break-word;
    }
}

/* Extra small screens - even smaller registration steps font */
@media (max-width: 575px) {
    .we-section .single-features-list .content p {
        font-size: 15px !important;
        line-height: 1.4 !important;
    }

    .we-section .single-features-list .content h4 {
        font-size: 17px !important;
    }

    .we-section .single-features-list .icon-inner .icon {
        width: 70px !important;
        height: 70px !important;
        font-size: 35px !important;
    }

    .we-section .single-features-list .icon-inner .icon-check i {
        font-size: 20px !important;
    }
}

/* ========================================
   CONTACT SECTION - MOBILE SPACING
   ======================================== */

/* Add spacing between map and form on mobile */
@media (max-width: 991px) {
    .contact-section .contact-area {
        margin-top: 40px !important;
    }
}

/* ========================================
   WHO WE ARE SECTION - FULL WIDTH ON MOBILE
   ======================================== */

/* Remove rotation from trust point cards for professional look */
.who-we-section .card-list .card-item:nth-child(1),
.who-we-section .card-list .card-item:nth-child(2),
.who-we-section .card-list .card-item:nth-child(3),
.who-we-section .card-list .card-item:nth-child(4) {
    transform: rotate(0deg) !important;
    -webkit-transform: rotate(0deg) !important;
}

.who-we-section .card-list .card-item:nth-child(3) {
    margin-left: 0 !important;
}

/* Single column layout for trust points */
.who-we-section .card-list {
    display: flex !important;
    flex-direction: column !important;
    max-width: 100% !important;
}

/* Vertical card layout - icon on top left, text below */
.who-we-section .card-list .card-item {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    text-align: left !important;
    padding: 20px !important;
    width: 100% !important;
    margin-right: 0 !important;
    font-weight: 600 !important;
}

.who-we-section .card-list .card-item i {
    margin-right: 0 !important;
    margin-bottom: 20px !important;
}

@media (max-width: 991px) {
    .who-we-section .container {
        max-width: 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .who-we-section .row {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .who-we-section .col-lg-6 {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }

    .who-we-section .we-image-box {
        text-align: center !important;
    }

    .who-we-section .we-image-box img {
        width: 100% !important;
        max-width: 100% !important;
    }

    .who-we-section .skill-wrapper {
        width: 100% !important;
    }
}

/* ========================================
   BLOG SECTION - FULL WIDTH IMAGES ON MOBILE
   ======================================== */

@media (max-width: 991px) {
    .blog-section .single-blog-post-two .post-thumbnail {
        width: 100% !important;
    }

    .blog-section .single-blog-post-two .post-thumbnail img {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
    }
}

/* ========================================
   MULTILINGUAL - CYRILLIC FONT SUPPORT
   ======================================== */

/* Add Noto Sans as fallback for Cyrillic characters */
body {
    font-family: "Prompt", "Noto Sans", sans-serif !important;
}

/* Ensure all text elements support Cyrillic */
h1, h2, h3, h4, h5, h6, p, a, span, li, button, input, textarea {
    font-family: "Prompt", "Noto Sans", sans-serif !important;
}

/* Language switcher styles */
.language-switcher {
    display: flex;
    gap: 10px;
    align-items: center;
}

.language-switcher a {
    padding: 5px 10px;
    border-radius: 4px;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.language-switcher a:hover {
    background-color: rgba(123, 131, 57, 0.1);
}

.language-switcher a.active {
    background-color: #7b8339;
    color: #fff !important;
}

/* ========================================
   WHY DUBAI FEATURE CARDS - WHITE TEXT
   ======================================== */

/* Make feature card text white and visible */
.single-features-item-two .item-overlay .content p {
    color: #ffffff !important;
}

.single-features-item-two .item-overlay .content h3.title {
    color: #ffffff !important;
}

/* Very subtle gradient overlay - dark bottom to transparent top */
.single-features-item-two .item-overlay {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0.85) 100%) !important;
}

/* Why Dubai feature cards - force 1:1 aspect ratio */
.single-features-item .img-holder {
    position: relative !important;
    width: 100% !important;
    padding-bottom: 100% !important; /* 1:1 aspect ratio */
    overflow: hidden !important;
}

.single-features-item .img-holder img {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

/* Why Dubai feature cards font sizes */
.single-features-item .content h4.title {
    font-size: 20px !important;
}

.single-features-item .content p {
    font-size: 20px !important;
}

/* ========================================
   FOOTER - ALL TEXT WHITE
   ======================================== */

/* Make all footer text white */
.main-footer.black-bg * {
    color: #fff !important;
}

/* Footer widget titles */
.main-footer.black-bg .widget-title {
    color: #fff !important;
}

/* Footer content paragraphs and links */
.main-footer.black-bg .footer-content p,
.main-footer.black-bg .footer-content a,
.main-footer.black-bg .footer-widget-nav li a {
    color: #fff !important;
}

/* Footer copyright text */
.main-footer.black-bg .footer-copyright p,
.main-footer.black-bg .footer-copyright a {
    color: #fff !important;
}

/* Footer links hover state */
.main-footer.black-bg .footer-widget-nav li a:hover {
    color: #7b8339 !important;
}

/* ========================================
   GALLERY IMAGES - PREVENT STRETCHING
   ======================================== */

/* Make gallery images cover without stretching */
.single-gallery-item-two .img-holder img {
    object-fit: cover !important;
    width: 100% !important;
    height: 100% !important;
}

/* ========================================
   WHO WE ARE - CHECKMARK SPACING
   ======================================== */

/* Add space between checkmark and text */
/* .check-style-one li i.fa-check {
    margin-right: 12px !important;
} */

/* ========================================
   CONTACT INFO ICONS - LARGER SIZE
   ======================================== */

/* Make contact info icons bigger */
.contact-info-item .icon i {
    font-size: 64px !important;
    color: #7b8339 !important;
}

/* ========================================
   WHATSAPP FLOAT BUTTON
   ======================================== */

/* WhatsApp floating button */
.whatsapp-float {
    background-color: #25D366 !important;
    border-radius: 50%;
    bottom: 30px;
    color: #fff !important;
    cursor: pointer;
    display: block !important;
    font-size: 32px !important;
    width: 65px !important;
    height: 65px !important;
    line-height: 65px !important;
    position: fixed;
    right: 30px;
    text-align: center;
    text-decoration: none;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    z-index: 337;
    -webkit-box-shadow: 0 4px 12px rgba(37, 211, 102, 0.4);
    box-shadow: 0 4px 12px rgba(37, 211, 102, 0.4);
}

.whatsapp-float:hover {
    background-color: #20BA5A !important;
    color: #fff !important;
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
    -webkit-box-shadow: 0 6px 16px rgba(37, 211, 102, 0.6);
    box-shadow: 0 6px 16px rgba(37, 211, 102, 0.6);
}

/* ========================================
   LANGUAGE MENU DROPDOWN
   ======================================== */

/* Language menu styling to match main navigation */
.nav-right-item .lang-menu {
    list-style: none;
    margin: 0;
    padding: 0;
}

.nav-right-item .lang-menu .menu-item {
    position: relative;
    display: inline-block;
}

.nav-right-item .lang-menu .menu-item > a {
    display: block;
    padding: 10px 20px;
    color: #103452;
    background-color: #fff;
    text-decoration: none;
    font-weight: 500;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    border-radius: 4px;
}

.nav-right-item .lang-menu .menu-item > a:hover {
    color: #fff;
    background-color: #7b8339;
}

.nav-right-item .lang-menu .sub-menu {
    position: absolute;
    top: 100%;
    right: 0;
    left: auto;
    background-color: #fff;
    list-style: none;
    margin: 0;
    padding: 0;
    min-width: 150px;
    -webkit-box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
    opacity: 0;
    visibility: hidden;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    z-index: 999;
    pointer-events: none;
}

.nav-right-item .lang-menu .menu-item:hover .sub-menu {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    pointer-events: auto;
}

.nav-right-item .lang-menu .sub-menu li a {
    display: block;
    padding: 10px 20px;
    color: #103452;
    text-decoration: none;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    border-bottom: 1px solid #f0f0f0;
}

.nav-right-item .lang-menu .sub-menu li:last-child a {
    border-bottom: none;
}

.nav-right-item .lang-menu .sub-menu li a:hover {
    background-color: #7b8339;
    color: #fff;
    padding-left: 25px;
}

/* Fix sticky navbar - ensure it sticks on scroll with animation */
.header-navigation.sticky {
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 999;
    background-color: #103452 !important;
    -webkit-animation: sticky 1.2s;
    animation: sticky 1.2s;
}

@-webkit-keyframes sticky {
    0% {
        top: -200px;
    }
    100% {
        top: 0;
    }
}

@keyframes sticky {
    0% {
        top: -200px;
    }
    100% {
        top: 0;
    }
}

/* Sticky header - ensure white background */
.header-navigation.sticky .nav-right-item .lang-menu .menu-item > a {
    color: #103452;
    background-color: #fff;
}

.header-navigation.sticky .nav-right-item .lang-menu .menu-item > a:hover {
    color: #fff;
    background-color: #7b8339;
}

/* Mobile: Click to toggle language menu (instead of hover) */
@media (max-width: 991px) {
    .nav-right-item .lang-menu .sub-menu.show {
        opacity: 1 !important;
        visibility: visible !important;
        -webkit-transform: translateY(0) !important;
        transform: translateY(0) !important;
        pointer-events: auto !important;
    }

    /* Smaller language switcher on tablets and mobile */
    .nav-right-item .lang-menu .menu-item > a {
        padding: 8px 15px !important;
        font-size: 14px !important;
    }

    .nav-right-item .lang-menu .sub-menu {
        min-width: 130px !important;
    }

    .nav-right-item .lang-menu .sub-menu li a {
        padding: 8px 15px !important;
        font-size: 14px !important;
    }
}

/* Extra small screens - even smaller language switcher */
@media (max-width: 576px) {
    .nav-right-item .lang-menu .menu-item > a {
        padding: 6px 12px !important;
        font-size: 13px !important;
    }

    .nav-right-item .lang-menu .sub-menu {
        min-width: 110px !important;
    }

    .nav-right-item .lang-menu .sub-menu li a {
        padding: 6px 12px !important;
        font-size: 13px !important;
    }
}

/* ========================================
   NAV RIGHT ITEM SPACING
   ======================================== */

/* Remove any default margins that might cause overflow */
.nav-right-item {
    display: flex;
    align-items: center;
    gap: 17px;
}

@media only screen and (min-width: 1200px) and (max-width: 1600px) {
    .nav-right-item {
        gap: 14px;
    }
}

/* ========================================
   TYPOGRAPHY IMPROVEMENTS - CLIENT FEEDBACK
   ======================================== */

/* Reduce gap between section titles and content */
.section-title {
    margin-bottom: 20px !important; /* Reduced from 35px */
}

/* Reduce gap between h2 and following content */
h2 {
    font-size: 32px !important;
    margin-bottom: 10px !important; /* Reduced from 20px */
}

h3 {
    margin-bottom: 15px !important; /* Reduced from ~20-25px */
}

/* Improve paragraph spacing and size */
p {
    font-size: 18px !important;
    line-height: 1.75 !important;
    margin-bottom: 16px;
}

p:last-child {
    margin-bottom: 0;
}

/* Specific elements that should NOT inherit large body size */
.main-btn,
.btn-link,
button {
    font-size: 20px !important;
}

.nav-link,
.form_control,
input,
textarea {
    font-size: 16px !important;
}

/* Navigation menu items */
.main-menu ul > li > a {
    font-size: 20px !important;
}

/* Service card descriptions should be readable */
.single-service-item-two .content p {
    font-size: 17px !important;
}

/* Footer text slightly smaller */
.footer-widget p,
.footer-copyright p {
    font-size: 15px !important;
}


/* ========================================
   TYPOGRAPHY - MONTSERRAT & INTER
   ======================================== */

/* Titles/Headings - Montserrat */
h1, h2, h3, h4, h5, h6,
.section-title h2,
.section-title .sub-title,
.main-btn {
    font-family: "Montserrat", sans-serif !important;
}

/* Sub-title pills font size and styling */
.sub-title {
    font-size: 20px !important;
    background-color: #7b8339 !important;
    color: #ffffff !important;
}

/* Body/Paragraphs - Inter */
body,
p,
a,
li,
input,
textarea,
button,
.form_control {
    font-family: "Inter", sans-serif !important;
    font-size: 20px !important;
    font-weight: 400 !important;
}

/* Exclude counter numbers and specific elements from body font-size */
.single-counter-item-two .content .number,
.single-counter-item-two .content .number span {
    font-family: "Prompt", sans-serif !important;
}

/* ========================================
   MOBILE RESPONSIVE TYPOGRAPHY
   ======================================== */

/* Mobile responsive typography - MUST come after body/p base rules */
@media (max-width: 767px) {
    body {
        font-size: 16px !important;
        line-height: 28px !important;
    }

    h2 {
        font-size: 22px !important;
        margin-bottom: 10px !important;
    }

    p {
        font-size: 14px !important;
    }

    .section-title {
        margin-bottom: 10px !important;
    }

    /* All buttons 14px on mobile */
    .main-btn,
    .btn-link,
    button,
    a.btn {
        font-size: 14px !important;
    }

    /* Reduce button padding on mobile */
    .main-btn {
        padding: 2px 2px 2px 25px !important;
    }

    .main-btn.filled-btn {
        padding: 2px 2px 2px 25px !important;
    }

    /* Reduce icon circle size on mobile */
    .main-btn i {
        margin-left: 12px !important;
        width: 38px !important;
        height: 38px !important;
        font-size: 14px !important;
        line-height: 38px !important;
    }

    /* Counter numbers same size as h2 headers on mobile */
    .single-counter-item-two .inner-counter .content .number,
    .single-counter-item-two .inner-counter .content .number span.count {
        font-size: 22px !important;
    }

    /* Counter text below numbers at 14px */
    .single-counter-item-two .inner-counter .content p {
        font-size: 14px !important;
    }

    /* Footer typography - match mobile pattern */
    .footer-widget .widget-title,
    .main-footer h4 {
        font-size: 22px !important;
    }

    .footer-widget p,
    .footer-widget-nav li a,
    .footer-copyright p {
        font-size: 14px !important;
    }
}

/* ========================================
   BACKGROUND OVERLAYS FOR READABILITY
   ======================================== */

/* Hero Section - Override the existing gradient overlay with a darker one for better text readability */
.hero-wrapper-two .single-slider .image-layer:after {
    background: linear-gradient(129.29deg, rgba(0, 0, 0, 0.7) 16.77%, rgba(0, 0, 0, 0.5) 74.33%) !important;
}

/* CTA Section - Purple overlay */
.cta-bg.overlay::after {
    position: absolute;
    top: 0;
    left: 0;
    content: "";
    width: 100%;
    height: 100%;
    background-color: rgba(110, 40, 84, 0.75) !important;
    z-index: -1;
}

/* Contact Section - Blue overlay (merged with CTA) */
.contact-section.overlay::after {
    position: absolute;
    top: 0;
    left: 0;
    content: "";
    width: 100%;
    height: 100%;
    background-color: rgba(16, 52, 82, 0.85) !important;
    z-index: -1;
}

/* ========================================
   MOBILE RESPONSIVE SPACING SYSTEM
   ======================================== */

/* Reduce section padding on mobile devices (phones & small tablets) */
@media (max-width: 767px) {
    /* Section padding adjustments - Desktop → Mobile */
    .pt-150 { padding-top: 100px !important; }      /* 150px → 100px */
    .pt-120 { padding-top: 80px !important; }       /* 120px → 80px */
    .pt-100 { padding-top: 60px !important; }       /* 100px → 60px */
    .pt-80 { padding-top: 50px !important; }        /* 80px → 50px */
    
    .pb-150 { padding-bottom: 100px !important; }   /* 150px → 100px */
    .pb-120 { padding-bottom: 80px !important; }    /* 120px → 80px */
    .pb-100 { padding-bottom: 60px !important; }    /* 100px → 60px */
    .pb-80 { padding-bottom: 50px !important; }     /* 80px → 50px */
    
    /* Element spacing adjustments - Desktop → Mobile */
    .mb-60 { margin-bottom: 10px !important; }      /* 60px → 10px (section titles) */
    .mb-50 { margin-bottom: 35px !important; }      /* 50px → 35px */
    .mb-40 { margin-bottom: 30px !important; }      /* 40px → 30px (content blocks) */
    .mb-30 { margin-bottom: 20px !important; }      /* 30px → 20px (paragraphs) */
    
    .mt-30 { margin-top: 20px !important; }         /* 30px → 20px */
    .mt-40 { margin-top: 30px !important; }         /* 40px → 30px */
    
    /* Specific section adjustments */
    .hero-section.pb-120 { padding-bottom: 80px !important; }
    .section-title.mb-60 { margin-bottom: 40px !important; }
}

/* ========================================
   PROGRAM CARDS LAYOUT
   ======================================== */

.program-card {
    background: #103452;
    border-radius: 12px;
    overflow: hidden;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    height: 100%;
    display: flex;
    flex-direction: column;
    margin-bottom: 30px;
}

.program-card:hover {
    -webkit-transform: translateY(-5px);
    transform: translateY(-5px);
    background: #1a4a6e;
    -webkit-box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

.program-card-image {
    width: 100%;
    height: 250px;
    overflow: hidden;
}

.program-card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    -webkit-transition: -webkit-transform 0.3s ease;
    transition: transform 0.3s ease;
}

.program-card:hover .program-card-image img {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
}

.program-card-content {
    padding: 30px;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    color: #ffffff;
}

.program-card-content .icon {
    width: 60px;
    height: 60px;
    background: rgba(123, 131, 57, 0.2);
    border-radius: 50%;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-bottom: 20px;
    font-size: 26px;
    color: #7b8339;
}

.program-card-content .icon i {
    display: block;
    line-height: 1;
    width: 100%;
    text-align: center;
    margin: 0;
    padding: 0;
}

.program-card-content .title {
    font-size: 26px;
    font-weight: 700;
    color: #ffffff;
    margin-bottom: 15px;
    line-height: 1.4;
}

.program-card-content .desc {
    font-size: 16px;
    color: rgba(255, 255, 255, 0.9) !important;
    margin-bottom: 20px;
    line-height: 1.6;
}

.program-card-content .feature-list {
    list-style: none;
    padding: 0;
    margin: 0 0 25px 0;
    flex-grow: 1;
}

.program-card-content .feature-list li {
    font-size: 15px;
    color: rgba(255, 255, 255, 0.9) !important;
    margin-bottom: 12px;
    display: flex;
    align-items: flex-start;
    line-height: 1.5;
}

.program-card-content .feature-list li i {
    color: #7b8339 !important;
    margin-right: 10px;
    margin-top: 3px;
    flex-shrink: 0;
}

.program-card-content .main-btn {
    margin-top: auto;
    font-size: 16px;
    align-self: flex-start; /* Don't stretch to full width */
}

/* Responsive adjustments */
@media (max-width: 1199px) {
    .program-card-image {
        height: 220px;
    }
}

@media (max-width: 991px) {
    .program-card-content {
        padding: 25px;
    }

    .program-card-image {
        height: 200px;
    }
}

@media (max-width: 767px) {
    .program-card {
        margin-bottom: 30px;
    }

    /* Program card typography - match mobile sizing pattern */
    .program-card-content .title {
        font-size: 18px !important;
    }

    .program-card-content .desc {
        font-size: 14px !important;
    }

    .program-card-content .feature-list li {
        font-size: 14px !important;
    }
}

/* ========================================
   iOS/WEBKIT COMPATIBILITY
   ======================================== */

/* Add webkit prefixes for transforms */
.single-features-item .img-holder img,
.program-card,
.main-btn,
.slider-item,
.icon-box,
.contact-icon-box,
.nice-select.open .list {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

/* Smooth scrolling for iOS */
html {
    -webkit-overflow-scrolling: touch;
}

/* Fix iOS button styling */
button,
input[type="submit"],
input[type="button"],
.main-btn {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

/* Remove tap highlight color on iOS */
a,
button,
input,
textarea {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-tap-highlight-color: transparent;
}

/* Fix iOS text size adjustment */
html {
    -webkit-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

/* Webkit-specific transform prefixes for animations */
.program-card:hover {
    -webkit-transform: translateY(-5px);
    transform: translateY(-5px);
}

.icon-box:hover .icon,
.contact-icon-box:hover .icon {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}

.nice-select.open .list {
    -webkit-transform: translateY(0);
    transform: translateY(0);
}

.program-card-content .icon:hover {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
}

/* Webkit transition prefixes */
.program-card,
.icon-box,
.contact-icon-box,
.main-btn,
.nice-select .list {
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

/* Fix iOS background-size for cover images */
.bg_cover,
.hero-wrapper-two .single-slider .image-layer,
.contact-section.overlay,
.cta-bg.overlay {
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

/* iOS-specific fixes for overlays */
.overlay::after,
.overlay:after {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

/* Prevent text inflation on iOS */
body,
p,
h1,
h2,
h3,
h4,
h5,
h6 {
    -webkit-text-size-adjust: none;
    -moz-text-size-adjust: none;
    -ms-text-size-adjust: none;
    text-size-adjust: none;
}

/* Removed iOS Safari sticky position fix - conflicts with JS sticky behavior */

/* Webkit box-shadow prefixes */
.program-card:hover,
.nice-select.open,
.contact-icon-box:hover {
    -webkit-box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

/* Prevent iOS zoom on input focus */
@media screen and (max-width: 767px) {
    input[type="text"],
    input[type="email"],
    input[type="tel"],
    input[type="number"],
    textarea,
    select {
        font-size: 16px !important;
    }
}