@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@200..1000&display=swap');

/* Global Font & Size Overrides */
:root {
    --font-primary: 'Cairo', sans-serif !important;
    --font-secondary: 'Cairo', sans-serif !important;
    --brand-primary: #025B39 !important;
}

.text-primary {
    color: var(--brand-primary) !important;
}

/* Standardize Cairo font for text elements while preserving icons */
body,
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
p,
a,
li,
span:not([class*="fa-"]),
input,
button,
textarea,
label {
    font-family: 'Cairo', sans-serif !important;
}

p,
.disc,
.desc,
.description,
.disc-v2,
.footer-desc,
.about-justify,
.history-disc-main,
.process-disc,
.box-disc-v2,
.f-disc,
.disc-pro,
.mission-description-elite .disc,
.mission-description-v6 .disc {
    font-size: 15px !important;
    font-weight: 400 !important;
    line-height: 1.8 !important;
}

p {
    margin-bottom: 25px;
}


h1,
.h1 {
    font-size: 50px !important;
}

h2,
.h2 {
    font-size: 40px !important;
}

h3,
.h3 {
    font-size: 32px !important;
}

h4,
.h4 {
    font-size: 24px !important;
}

h5,
.h5 {
    font-size: 18px !important;
}

h6,
.h6 {
    font-size: 16px !important;
}

.pre,
.sub-title,
.pre-title {
    font-size: 14px !important;
    font-weight: 700;
    font-family: 'Cairo', sans-serif !important;
}

@media screen and (max-width: 767px) {

    h1,
    .h1 {
        font-size: 34px !important;
    }

    h2,
    .h2 {
        font-size: 28px !important;
    }

    h3,
    .h3 {
        font-size: 22px !important;
    }

    p {
        font-size: 14px !important;
    }

}

/* ============================================================
   Ultra-Premium Cinematic Banner (Elite Global System)
   ============================================================ */
.elite-hero-banner-v3 {
    position: relative;
    width: 100%;
    height: 65vh;
    min-height: 500px;
    background: #050d20;
    /* Global Title Tint Fallback */
    overflow: hidden;
    display: flex;
    align-items: flex-end;
    padding-bottom: 60px;
}

.elite-hero-banner-v3 .banner-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: right center;
    display: block;
    /* width: 100%; */
    /* height: 100%; */
    /* object-fit: cover; */
    z-index: 1;
}

.elite-hero-banner-v3 .banner-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.75) 0%, rgba(0, 0, 0, 0.2) 40%, transparent 100%);
    z-index: 2;
}

.elite-hero-banner-v3 .container {
    position: relative;
    z-index: 5;
    max-width: 1400px;
}

.elite-hero-banner-v3 .banner-title-v3 {
    color: #ffffff;
    font-size: clamp(3.2rem, 8vw, 6.5rem);
    font-weight: 800;
    line-height: 1;
    margin: 0;
    font-family: var(--font-primary);
    letter-spacing: -2px;
}

@media (max-width: 991px) {
    .elite-hero-banner-v3 {
        height: 45vh;
        padding-bottom: 50px;
    }
}

@media (max-width: 767px) {
    .elite-hero-banner-v3 {
        height: 40vh;
        padding-bottom: 40px;
        min-height: 350px;
    }

    .elite-hero-banner-v3 .banner-title-v3 {
        font-size: 3.2rem;
        letter-spacing: -1px;
    }
}

/* ============================================================
   Elite Pre-Title Badges (Global Imperial Green)
   ============================================================ */
.pre {
    background: rgba(2, 91, 57, 0.05) !important;
    color: #025b39 !important;
    padding: 6px 18px !important;
    border-radius: 50px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    margin-bottom: 22px !important;
    width: fit-content !important;
    display: inline-block !important;
}


:root {
    --text-dark: #050d20;
    --text-muted: #717383;
    --badge-bg: #fff9e6;
    --accent-lavender: rgba(131, 107, 237, 0.1);
    --accent-purple-soft: rgba(246, 211, 255, 0.4);
    --accent-lime: rgba(239, 255, 172, 0.4);
}

/* Global Spacing Adjustments */
body {
    line-height: 1.6;
    letter-spacing: 0.02em;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    letter-spacing: -0.01em;
}

p {
    line-height: 1.8;
    /* Better text readability */
    margin-bottom: 25px;
}

/* Global Section Spacing Overrides - Optimized for UX */
.rts-section-gap,
.rts-section-gapTop,
.rts-section-gapBottom,
.hmih-section,
.wcu-v2-section {
    padding-top: 85px !important;
    padding-bottom: 85px !important;
}

.rts-section-gapBottom {
    padding-top: 0 !important;
}

.rts-section-gapTop {
    padding-bottom: 0 !important;
}



.rts-section-gap+.rts-section-gap,
.rts-section-gapBottom+.rts-section-gap,
.client-stats-banner+.hmih-section,
.rts-company-values-area+.wcu-v2-section,
.wcu-v2-section+.rts-footer-one {
    padding-top: 35px !important;
}

.rts-about-area.rts-section-gap {
    padding-top: 85px !important;
    /* Normal layout transition */
}

/* Hero Section Spacing & Alignment */
/* Hero Section Spacing & Alignment */
.rts-banner-area-one {
    min-height: 800px !important;
    /* Balanced Height for Desktop */
    display: flex;
    align-items: center;
    background-size: cover;
    background-position: center;
}
.rts-banner-area-one img{
    object-position: right;
    
}

@media screen and (max-width: 991px) {
    .rts-banner-area-one {
        min-height: 600px !important;
    }
}

@media screen and (max-width: 767px) {
    .rts-banner-area-one {
        min-height: 450px !important;
    }
}


.banner-style-one-wrapper-inner {
    padding-top: 40px;
    padding-bottom: 40px;
    padding-left: 60px;
    max-width: 900px;
    width: 100%;
    text-align: left;
}

@media screen and (max-width: 991px) {
    .banner-style-one-wrapper-inner {
        padding-top: 50px;
        padding-bottom: 50px;
        padding-left: 0;
        text-align: left;
        margin: 0 auto;
    }

    .banner-style-one-wrapper-inner p.disc {
        text-align: left !important;
    }
}

@media screen and (max-width: 575px) {
    .rts-banner-area-one {
        min-height: 400px !important;
    }

    .banner-style-one-wrapper-inner .title {
        font-size: 32px !important;
        line-height: 1.2 !important;
        margin-top: 15px !important;
    }

    .banner-style-one-wrapper-inner p.disc {
        margin-bottom: 20px !important;
        font-size: 14px !important;
        line-height: 1.5 !important;
    }
}


/* Why Choose Us Redesign */
.why-chooseus-area.redesign {
    position: relative;
    overflow: hidden;
}

/* About Section Redesign */
.about-justify {
    text-align: justify;
    text-justify: inter-word;
}

.about-features-v2 {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    margin-top: 30px;
}

.about-feature-item {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    flex: 1;
    min-width: 200px;
}

.about-feature-item .icon {
    width: 60px;
    height: 60px;
    background: rgba(2, 91, 57, 0.05);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #025b39;
    font-size: 24px;
    flex-shrink: 0;
    transition: all 0.3s ease;
}

.about-feature-item:hover .icon {
    background: #025b39;
    color: #fff;
    transform: rotateY(180deg);
}

.about-feature-item h5 {
    font-size: 18px;
    margin-bottom: 5px;
    font-weight: 700;
}

.about-feature-item span {
    font-size: 14px;
    color: #717383;
}

.about-area-inner-wrapper-thumbnail.v2 {
    position: relative;
    max-width: 480px;
    margin: 0 auto;
}

.about-area-inner-wrapper-thumbnail.v2 .main-img {
    border-radius: 0;
    width: 100%;
    max-width: 450px;
    height: auto;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.1);
}

.about-area-inner-wrapper-thumbnail.v2 .small-img {
    position: absolute;
    bottom: -15px;
    right: -15px;
    width: 190px;
    border: 8px solid #fff;
    border-radius: 0;
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15);
}

@media screen and (max-width: 991px) {
    .rts-about-area .col-lg-6:last-child {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }

    .about-content-style-one {
        text-align: center;
        margin-top: 30px;
    }

    .title-left-wrapper {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .about-justify {
        text-align: center !important;
        text-justify: none !important;
    }

    .about-features-v2 {
        justify-content: center;
        gap: 20px;
    }

    .about-feature-item {
        flex: 0 0 auto;
        width: calc(50% - 20px);
        min-width: 200px;
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
}

@media screen and (max-width: 767px) {
    .about-area-inner-wrapper-thumbnail.v2 .small-img {
        width: 140px;
        right: -10px;
        bottom: -10px;
        border-width: 5px;
    }

    .about-feature-item {
        width: 100%;
    }
}

@media screen and (max-width: 575px) {
    .about-area-inner-wrapper-thumbnail.v2 .small-img {
        width: 110px;
        right: 0;
        bottom: -5px;
    }

    .about-content-style-one .rts-btn {
        margin: 0 auto;
        display: table;
    }
}


/* Achievement Section Redesign */
.counter-card-v2 {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.1);
    padding: 40px 30px;
    border-radius: 20px;
    text-align: center;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.320, 1.275);
    backdrop-filter: blur(10px);
    height: 100%;
}

.counter-card-v2:hover {
    background: rgba(16, 46, 177, 0.15);
    border-color: #102EB1;
    transform: translateY(-12px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
}

.counter-card-v2 .icon-v2 {
    width: 70px;
    height: 70px;
    background: #102EB1;
    color: #fff;
    border-radius: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 30px;
    margin: 0 auto 25px;
    transition: all 0.5s ease;
}

.counter-card-v2:hover .icon-v2 {
    transform: rotateY(180deg);
}

.counter-card-v2 h3.title {
    color: #fff !important;
    font-size: 42px;
    font-weight: 800;
    margin-bottom: 10px;
    letter-spacing: -1px;
}

.counter-card-v2 p {
    color: rgba(255, 255, 255, 0.75) !important;
    margin-bottom: 0;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 13px;
    letter-spacing: 1px;
}

/* Professional Down-Structured Case Card */
.case-card-v3 {
    background: #fff;
    border-radius: 25px;
    overflow: hidden;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.05);
    transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
    display: block;
    height: 100%;
    margin-bottom: 40px;
    border: 1px solid rgba(0, 0, 0, 0.02);
}

.case-card-v3:hover {
    transform: translateY(-12px);
    box-shadow: 0 25px 50px rgba(2, 91, 57, 0.1);
}

.case-card-v3 .thumb {
    width: 100%;
    height: 280px;
    overflow: hidden;
    position: relative;
}

.case-card-v3 .thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.8s ease;
}

.case-card-v3:hover .thumb img {
    transform: scale(1.1);
}

.case-card-v3 .content-v3 {
    padding: 30px;
    text-align: left;
}

.case-card-v3 .content-v3 .top-v3 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.case-card-v3 .content-v3 .top-v3 .title {
    font-size: 22px;
    font-weight: 800;
    margin-bottom: 0;
    color: #1c1e22 !important;
    transition: all 0.3s ease;
}

.case-card-v3:hover .content-v3 .top-v3 .title {
    color: #025b39 !important;
}

.case-card-v3 .content-v3 .top-v3 .plus-btn {
    width: 42px;
    height: 42px;
    background: rgba(2, 91, 57, 0.05);
    color: #025b39;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    transition: all 0.4s ease;
    flex-shrink: 0;
}

.case-card-v3:hover .content-v3 .top-v3 .plus-btn {
    background: #025b39;
    color: #fff;
    transform: rotate(90deg);
}

.case-card-v3 .content-v3 .disc {
    font-size: 15px;
    line-height: 1.6;
    color: #717383 !important;
    margin-bottom: 0;

    line-clamp: 2;
 
    overflow: hidden;
}

.case-card-v3 .read-more-v3 {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #025b39;
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-top: 25px;
    transition: all 0.3s ease;
}

.case-card-v3 .read-more-v3 i {
    font-size: 11px;
    transition: all 0.3s ease;
}

.case-card-v3:hover .read-more-v3 {
    color: #050d20;
}

.case-card-v3:hover .read-more-v3 i {
    transform: translateX(6px);
}

@media screen and (max-width: 768px) {
    .case-card-v3 .thumb {
        height: 240px;
    }

    .case-card-v3 .content-v3 {
        padding: 25px;
    }
}

@media screen and (max-width: 768px) {
    .counter-card-v2 {
        padding: 30px 20px;
    }

    .counter-card-v2 h3.title {
        font-size: 34px;
    }
}

.reason-wrapper-v2 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px;
    margin-top: 30px;
}

.single-reason-v2 {
    background: #fff;
    padding: 15px;
    border-radius: 12px;
    border: 1px solid rgba(2, 91, 57, 0.05);
    display: flex;
    align-items: center;
    gap: 12px;
    transition: all 0.3s ease;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.02);
}

.single-reason-v2:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 20px rgba(2, 91, 57, 0.08);
    border-color: #025b39;
}

.single-reason-v2 .icon-v2 {
    width: 40px;
    height: 40px;
    background: rgba(2, 91, 57, 0.06);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #025b39;
    font-size: 18px;
    transition: all 0.3s ease;
    flex-shrink: 0;
}

.single-reason-v2:hover .icon-v2 {
    background: #025b39;
    color: #fff;
}

.single-reason-v2 .title-v2 {
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 0;
    color: #050d20;
}

/*.image-wrapper-v2:hover img {*/
/*    transform: translateY(-8px);*/
/*    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.1);*/
/*}*/

/* Microsys Custom Process Section (Image inspired) */
.rts-microsys-process-area {
    padding-top: 120px;
    padding-bottom: 120px;
}

.microsys-images-grid {
    display: flex;
    gap: 25px;
    margin-bottom: 80px;
    margin-top: 40px;
}

.microsys-images-grid .single-img {
    flex: 1;
    border-radius: 12px;
    overflow: hidden;
    height: 520px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.04);
}

.microsys-images-grid .single-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 1.2s ease;
}

.microsys-images-grid .single-img:hover img {
    transform: scale(1.08);
}

.microsys-content-side-v3 {
    flex: 1;
    background: #fff;
    border-radius: 15px;
    padding: 60px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border: 1px solid #e4e6ef;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.03);
    height: 520px;
}

.microsys-content-side-v3 .title {
    font-size: 32px;
    font-weight: 800;
    margin-bottom: 20px;
    color: #1c1e22 !important;
}

.microsys-content-side-v3 .disc {
    font-size: 16px;
    line-height: 1.6;
    margin-bottom: 35px;
    color: #717383 !important;
}

.microsys-check-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px 30px;
}

.microsys-check-item {
    display: flex;
    gap: 12px;
    align-items: center;
    font-size: 15px;
    font-weight: 700;
    color: #1c1e22;
}

.microsys-check-item i {
    color: #102EB1;
    font-size: 14px;
}

.microsys-features-row {
    transform: scale(1.1);
}

.microsys-features-column-v3 .feature-img-v3 img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.microsys-features-column-v3 .text p {
    font-size: 15px;
    line-height: 1.6;
    color: #717383 !important;
    margin-bottom: 0;
}

@media screen and (max-width: 991px) {
    .microsys-images-grid {
        flex-direction: column !important;
        gap: 50px !important;
    }

    .microsys-features-column-v3 .single-feature-microsys:last-child {
        border-bottom: 1px solid #e1e4ef;
        padding-bottom: 30px;
    }
}

/* /* /* /* Microsys Elite Service Grid (Template Friendly Redesign) */
.rts-microsys-section {
    background: #ffffff;
    position: relative;
    overflow: hidden;
}

.title-area-microsys {
    margin-bottom: 60px;
}

.microsys-elite-card {
    background: #f6f9f7;
    /* Light green tint background */
    padding: 40px 30px;
    border: 1px solid #e2ece6;
    /* Matching light green border */
    border-radius: 12px;
    height: 100%;
    position: relative;
    transition: 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    z-index: 1;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.microsys-elite-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: -150%;
    width: 100%;
    height: 100%;
    background: linear-gradient(120deg, transparent, rgba(2, 91, 57, 0.05), transparent);
    transition: 0.6s ease;
    z-index: 2;
}

.microsys-elite-card:hover::before {
    left: 150%;
}

.microsys-elite-card:hover {
    border-color: #025b39;
    transform: translateY(-12px) scale(1.02);
    box-shadow: 0 35px 70px rgba(2, 91, 57, 0.15);
}

.icon-v4 {
    width: 70px;
    height: 70px;
    background: #f8f9fc;
    color: #025b39;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 30px;
    margin-bottom: 30px;
    transition: 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.microsys-elite-card:hover .icon-v4 {
    background: #025b39;
    color: #ffffff;
    transform: rotateY(360deg);
}

.microsys-elite-card .card-title {
    font-size: 24px;
    font-weight: 800;
    margin-bottom: 20px;
    color: #1c1e22;
}

.microsys-elite-card .card-disc {
    font-size: 16px;
    line-height: 1.6;
    color: #555;
    margin-bottom: 0;
}

/* Elite Microsys Stats Bar (4-Column Redesign) */
.microsys-stats-bar {
    background: #F9F9FB;
    /* Template-Matching Light Grey */
    padding: 80px 30px;
    border: 1px solid #eee;
    border-radius: 20px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    margin-top: 80px;
}

.single-stat-v5 {
    text-align: center;
    border-right: 1px solid #eee;
    padding: 0 15px;
}

.single-stat-v5:last-child {
    border-right: none;
}

.single-stat-v5 .stat-num {
    font-size: 65px;
    font-weight: 800;
    line-height: 1;
    color: var(--color-primary);
    /* Template Native Blue */
    margin-bottom: 15px;
    display: block;
    letter-spacing: -2px;
    font-family: var(--font-primary) !important;
}

.single-stat-v5 .stat-label {
    font-size: 14px;
    line-height: 1.5;
    color: #555;
    max-width: 180px;
    margin: 0 auto;
    font-weight: 500;
    font-family: inherit !important;
}

/* Microsys Elite Values Grid (Minimalist Showcase) */
.microsys-values-elite {
    background: #fff;
    /* White Section for Alternating */
    padding: 120px 0;
}

.microsys-values-elite .main-title {
    font-size: 75px;
    font-weight: 900;
    letter-spacing: -4px;
    margin-bottom: 60px;
    color: var(--color-secondary) !important;
    line-height: 0.9;
    font-family: var(--font-primary) !important;
}

.values-grid-v6 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(2, 1fr);
    gap: 2px;
    /* Precision hairline dividers logic */
    background: #e5e4de;
    /* Divider color */
}

.value-card-v6 {
    background: #F9F9FB;
    /* Matching Light Grey Grid Logic */
    padding: 60px 45px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    min-height: 380px;
    transition: 0.4s;
    border: 1px solid #eee;
}

.value-card-v6 .icon-v6 {
    font-size: 26px;
    margin-bottom: 40px;
    color: #1c1e22;
}

.value-card-v6 .v-title {
    font-size: 32px;
    font-weight: 800;
    margin-bottom: 25px;
    color: #1c1e22 !important;
    letter-spacing: -1px;
}

.value-card-v6 .v-disc {
    font-size: 17px;
    line-height: 1.5;
    color: #444;
    max-width: 320px;
}

.value-card-v6:hover {
    background: #fff;
    z-index: 10;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.05);
}

@media screen and (max-width: 991px) {
    .values-grid-v6 {
        grid-template-columns: 1fr;
    }

    .microsys-values-elite .main-title {
        font-size: 50px;
        letter-spacing: -2px;
    }

    .value-card-v6 {
        min-height: auto;
        padding: 40px 30px;
    }
}

@media screen and (max-width: 768px) {
    .microsys-values-elite .main-title {
        font-size: 38px;
        margin-bottom: 40px;
        letter-spacing: -1px;
    }

    .value-card-v6 .v-title {
        font-size: 26px;
    }

    .value-card-v6 .v-disc {
        font-size: 15px;
    }
}

@media screen and (max-width: 991px) {
    .microsys-stats-bar {
        grid-template-columns: 1fr;
        gap: 50px;
        padding: 50px 20px;
    }

    .single-stat-v5 {
        border-right: none !important;
        border-bottom: 1px solid #eee;
        padding-bottom: 50px;
    }

    .single-stat-v5:last-child {
        border-bottom: none;
        padding-bottom: 0;
    }

    .single-stat-v5 .stat-num {
        font-size: 55px;
    }
}

@media screen and (max-width: 768px) {
    .microsys-stats-bar {
        padding: 40px 15px;
        gap: 40px;
        margin-top: 40px;
    }

    .single-stat-v5 .stat-num {
        font-size: 45px;
    }

    .single-stat-v5 .stat-label {
        font-size: 14px;
    }
}

/* Amazing Hover Detail */
.microsys-grid-item::before {
    content: '';
    position: absolute;
    top: 0;
    left: -150%;
    width: 100%;
    height: 100%;
    background: linear-gradient(120deg, transparent, rgba(255, 255, 255, 0.4), transparent);
    transition: all 0.8s ease;
    z-index: 2;
}

.microsys-grid-item:hover::before {
    left: 150%;
}

.microsys-grid-item:hover {
    background: #102EB1;
    border-color: #102EB1;
    transform: translateY(-8px);
    box-shadow: 0 30px 60px rgba(16, 46, 177, 0.2);
    z-index: 10;
}

.microsys-grid-item .num {
    font-size: 60px;
    font-weight: 800;
    color: #102EB1;
    margin-bottom: 25px;
    display: block;
    line-height: 1;
    transition: 0.6s ease;
    font-family: inherit !important;
}

.microsys-grid-item .item-text {
    font-size: 15px;
    line-height: 1.6;
    color: #1c1e22 !important;
    margin-bottom: 0;
    transition: 0.6s ease;
    font-family: inherit !important;
}

.microsys-grid-item:hover .num,
.microsys-grid-item:hover .item-text,
.microsys-grid-item:hover .item-text strong {
    color: #ffffff !important;
}

@media screen and (max-width: 1400px) {
    .microsys-grid-left {
        padding: 0 41px 0 5%;
    }

    .microsys-grid-left .title {
        font-size: 50px;
    }
}

@media screen and (max-width: 991px) {
    .rts-microsys-grid-area {
        flex-direction: column;
        padding-top: 80px;
        padding-bottom: 80px;
    }

    .microsys-grid-left {
        padding: 0 20px 50px 20px;
    }

    .microsys-grid-right {
        grid-template-columns: 1fr;
        border-left: none;
        border-top: 1px solid #e8e8e8;
    }

    .microsys-grid-item {
        padding: 60px 40px;
        min-height: 350px;
        border-right: none;
    }

    .microsys-grid-item:nth-last-child(2) {
        border-bottom: 1px solid #e8e8e8;
    }
}

@media screen and (max-width: 1400px) {
    .microsys-grid-left {
        padding: 80px 50px;
    }

    .microsys-grid-left .title {
        font-size: 50px;
    }
}

@media screen and (max-width: 991px) {
    .rts-microsys-grid-area {
        flex-direction: column;
    }

    .microsys-grid-left {
        padding: 80px 30px;
    }

    .microsys-grid-right {
        grid-template-columns: 1fr;
    }
}

/* Feature Row Style (Bottom) */
.single-feature-microsys {
    border-top: 1px solid #e4e6ef;
    padding-top: 45px;
    display: flex;
    gap: 20px;
    align-items: flex-start;
}

.single-feature-microsys .feature-img-v3 {
    width: 38px;
    height: 38px;
    flex-shrink: 0;
    margin-top: 2px;
}

.single-feature-microsys .feature-img-v3 img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.single-feature-microsys .text p {
    font-size: 15px;
    line-height: 1.6;
    color: #717383 !important;
    margin-bottom: 0;
}

@media screen and (max-width: 1200px) {
    .microsys-images-grid .single-img {
        height: 420px;
    }
}

@media screen and (max-width: 991px) {
    .microsys-images-grid {
        flex-direction: column;
    }

    .microsys-images-grid .single-img {
        height: 400px;
    }

    .microsys-features-row {
        grid-template-columns: 1fr;
        gap: 20px;
    }
}

@media screen and (max-width: 768px) {}

/* Why Choose Us Image Structure */
.image-wrapper-v2 {
    display: flex;
    gap: 30px;
    align-items: flex-start;
}

.image-wrapper-v2 .image-box {
    flex: 1;
}

.image-wrapper-v2 .image-box img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 0;
    /* Maintaining sharp corners as requested earlier */
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.06);
}

.image-wrapper-v2 .image-box.right {
    margin-top: 60px;
    /* Structured offset */
}

@media screen and (max-width: 991px) {
    .image-wrapper-v2 .image-box.right {
        margin-top: 30px;
    }
}

/* Step-by-Step Why Choose Us */
.how-it-works-badge {
    display: inline-block;
    padding: 6px 20px;
    background: #fff;
    border: 1px solid #e4e6ef;
    border-radius: 30px;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #717383;
    margin-bottom: 20px;
}

.step-list-v3 {
    position: relative;
    padding-left: 85px;
    margin-top: 40px;
}

.step-list-v3::before {
    content: '';
    position: absolute;
    top: 10px;
    left: 25px;
    width: 2px;
    height: 80%;
    background: #e4e6ef;
    z-index: 1;
}

.step-item-v3 {
    position: relative;
    margin-bottom: 60px;
}

.step-item-v3 .number {
    position: absolute;
    left: -85px;
    top: 0;
    width: 50px;
    height: 50px;
    border: 1px solid #e4e6ef;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: 800;
    background: #fff;
    z-index: 2;
    color: #1c1e22;
    transition: all 0.4s ease;
}

.step-item-v3:hover .number {
    background: #102EB1;
    color: #fff;
    border-color: #102EB1;
    transform: scale(1.1);
}

.step-item-v3 .title {
    font-size: 26px;
    font-weight: 800;
    margin-bottom: 12px;
    color: #1c1e22 !important;
}

.step-item-v3 p {
    font-size: 16px;
    line-height: 1.7;
    color: #717383 !important;
    max-width: 480px;
    margin-bottom: 0;
}

.step-img-v3 {
    border-radius: 35px;
    overflow: hidden;
    height: 550px;
    box-shadow: 0 15px 45px rgba(0, 0, 0, 0.05);
}

.step-img-v3 img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 1s ease;
}

.step-img-v3:hover img {
    transform: scale(1.05);
}

/* CTA Banner Area Redesign (Responsive Image Tag & 70VH) */
.rts-cta-banner-area {
    position: relative;
    min-height: 70vh;
    display: flex;
    align-items: center;
    overflow: hidden;
    z-index: 1;
}

.rts-cta-banner-area .bg-image-v4 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: -2;
    transition: transform 1.2s ease;
}

.rts-cta-banner-area:hover .bg-image-v4 {
    transform: scale(1.1);
}

.rts-cta-banner-area .overlay-v4 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, #000000ab 0%, #000000ad 100%);
    z-index: -1;
}

.rts-cta-banner-area .title {
    color: #fff !important;
    font-size: 55px;
    line-height: 1.1;
    font-weight: 800;
    margin-bottom: 35px;
    letter-spacing: -2px;
}

/* About Page Cinematic Hero */
.about-hero-cinematic {
    position: relative;
    height: 80vh;
    display: flex;
    align-items: flex-end;
    padding-bottom: 150px;
    overflow: hidden;
    z-index: 1;
    color: #fff;
    font-family: var(--font-primary) !important;
}

.about-hero-cinematic .bg-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: -2;
    filter: brightness(0.85);
}

.about-hero-cinematic .overlay-shadow {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.95) 0%, rgba(0, 0, 0, 0.4) 50%, rgba(0, 0, 0, 0.2) 100%);
    z-index: -1;
}

.hero-left-v5 {
    display: flex;
    flex-direction: column;
    gap: 25px;
    /* Precision Gap */
}

.hero-left-v5 .since-tag {
    font-size: 16px;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 15px;
    text-transform: uppercase;
    letter-spacing: 2px;
}

.hero-left-v5 .since-tag::before {
    content: '';
    width: 10px;
    height: 10px;
    background: #fff;
    border-radius: 50%;
}

.hero-left-v5 .main-title {
    font-size: 75px;
    font-weight: 900;
    line-height: 1.0;
    /* Magazine-Style */
    letter-spacing: -4px;
    color: #fff !important;
    margin-bottom: 0;
}

.hero-right-v5 .disc {
    font-size: 20px;
    line-height: 1.6;
    color: #fff !important;
    max-width: 500px;
    margin-left: auto;
    font-weight: 500;
    opacity: 0.9;
}

@media screen and (max-width: 991px) {
    .about-hero-cinematic {
        height: auto;
        min-height: 500px;
        padding: 120px 0 80px 0;
        align-items: center;
        /* Center Focus for Tablets */
    }

    .hero-left-v5 .main-title {
        font-size: 50px;
        letter-spacing: -2px;
        margin-bottom: 30px;
        text-align: center;
    }

    .hero-right-v5 .disc {
        margin-left: auto;
        margin-right: auto;
        font-size: 18px;
        text-align: center;
    }

    .about-hero-cinematic .row>div {
        text-align: center !important;
    }
}

@media screen and (max-width: 768px) {
    .about-hero-cinematic {
        min-height: 450px;
        padding-bottom: 60px;
    }

    .hero-left-v5 .main-title {
        font-size: 42px;
    }

    .hero-left-v5 .since-tag {
        font-size: 14px;
        justify-content: center;
    }
}

.cta-content-wrapper {
    max-width: 850px;
    margin: 0 auto;
}

.cta-content-wrapper .disc {
    margin-bottom: 50px !important;
    font-size: 20px;
    line-height: 1.7;
}

.rts-cta-banner-area .cta-btn-v3 {
    margin: 0 auto;
}

.rts-cta-banner-area .container {
    position: relative;
    z-index: 2;
}

.cta-content-v3 {
    max-width: 650px;
    text-align: left;
}

.cta-content-v3 .title {
    color: #fff !important;
    font-size: 60px;
    font-weight: 800;
    margin-bottom: 25px;
    line-height: 1.1;
    letter-spacing: -2px;
}

.cta-content-v3 .disc {
    color: rgba(255, 255, 255, 0.95) !important;
    font-size: 19px;
    margin-bottom: 45px;
    line-height: 1.6;
    max-width: 520px;
}

.cta-btn-v3 {
    display: inline-flex;
    align-items: center;
    background: #fff;
    padding: 12px 12px 12px 35px;
    border-radius: 100px;
    color: #050d20 !important;
    font-weight: 700;
    font-size: 16px;
    gap: 20px;
    text-decoration: none;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.320, 1.275);
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
}

.cta-btn-v3 .icon {
    width: 45px;
    height: 45px;
    background: #025b39;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    transition: all 0.4s ease;
}

.cta-btn-v3:hover {
    background: #050d20;
    color: #fff !important;
    transform: translateY(-5px);
}

.cta-btn-v3:hover .icon {
    background: #fff;
    color: #025b39;
}

@media screen and (max-width: 991px) {
    .rts-cta-banner-area {
        padding: 100px 0;
    }

    .cta-content-v3 .title {
        font-size: 45px;
    }
}

@media screen and (max-width: 768px) {
    .cta-content-v3 .title {
        font-size: 34px;
        letter-spacing: -1px;
    }

    .cta-content-v3 .disc {
        font-size: 16px;
    }

    .cta-btn-v3 {
        padding: 10px 10px 10px 25px;
    }
}


/* ==========================================================================
   Premium Typography & Global Standardization
   ========================================================================== */
:root {
    --heading-font: 'Cairo', sans-serif !important;

    --body-font: 'Cairo', sans-serif !important;

    --primary-blue: #102EB1;
    --dark-bg: #050d20;
    --text-gray: #717383;
}

body {
    font-family: var(--body-font) !important;
    color: var(--text-gray);
    -webkit-font-smoothing: antialiased;
}

h1,
h2,
h3,
h4,
h5,
h6,
.card-title,
.title-v2,
.v-title,
.title {
    font-family: 'Cairo', sans-serif !important;
    font-weight: 800 !important;
    letter-spacing: -0.02em !important;
    color: var(--dark-bg);
    line-height: 1.1 !important;
}


h1 {
    font-size: clamp(2.8rem, 10vw, 5.5rem) !important;
}

h2 {
    font-size: clamp(2.4rem, 8vw, 4.5rem) !important;
}

h3 {
    font-size: clamp(2rem, 6vw, 3.2rem) !important;
}

h4 {
    font-size: clamp(1.6rem, 5vw, 2.4rem) !important;
}

h5 {
    font-size: clamp(1.3rem, 4vw, 1.8rem) !important;
}

h6 {
    font-size: clamp(1.1rem, 3.5vw, 1.4rem) !important;
}

/* Description / Paragraph Standardization */
.disc,
p {
    font-family: var(--body-font) !important;
    font-size: 15px !important;
    line-height: 1.8 !important;
    color: var(--text-gray);
    font-weight: 400 !important;
}


/* Section Title Pre-titles (Pill Style) */


/* Layout Consistency */
.rts-section-gap {
    padding: 120px 0 !important;
}

.rts-section-gapBottom {
    padding-bottom: 120px !important;
}

/* ==========================================================================
   Premium Navigation Header Redesign
   ========================================================================== */

/* ==========================================================================
   Premium Navigation Header Redesign
   ========================================================================== */
.header-premium {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1000;
    padding: 10px 0;
    transition: none;
    background: transparent;
}

.header-premium.sticky {
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(20px);
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.05);
}

.nav-wrapper-main {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* Premium Navigation Links */
.header-premium .nav-area>ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 35px;
}

.header-premium .main-nav a {
    font-weight: 600;
    color: #050d20;
    font-size: 16px;
    letter-spacing: -0.2px;
    transition: all 0.3s ease;
    position: relative;
    padding: 5px 0;
}

.header-premium .main-nav a::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 2px;
    background: #025B39;
    transition: all 0.3s ease;
}

.header-premium .main-nav a:hover {
    color: #025B39;
}

.header-premium .main-nav a:hover::after {
    width: 100%;
}

/* Submenu Style */
.header-premium .has-dropdown {
    position: relative;
}

.header-premium .submenu {
    position: absolute;
    top: 100%;
    left: 0;
    background: #fff;
    min-width: 280px;
    padding: 25px;
    border-radius: 12px;
    box-shadow: 0 15px 50px rgba(0, 0, 0, 0.12);
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: all 0.3s ease;
    z-index: 10;
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.header-premium .has-dropdown:hover .submenu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.header-premium .submenu li {
    margin: 0;
    padding: 0;
    list-style: none;
}

.header-premium .submenu li a {
    font-size: 15px;
    color: #444;
    font-weight: 500;
    display: block;
    width: 100%;
    transition: all 0.2s ease;
}

.header-premium .submenu li a:hover {
    color: #025b39;
    padding-left: 5px;
}

/* Mobile Toggle Bar */
.mobile-btn-toggle {
    display: none;
    cursor: pointer;
    width: 40px;
    height: 40px;
    background: #f4f6fc;
    border-radius: 10px;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

.mobile-btn-toggle:hover {
    background: #025b39;
    color: #fff;
}

.mobile-btn-toggle i {
    font-size: 20px;
}

@media screen and (max-width: 991px) {
    .header-premium .nav-area {
        display: none;
    }

    .mobile-btn-toggle {
        display: flex;
    }

    .header-premium .button-wrapper-flex .rts-btn {
        display: none;
    }
}

/* Mobile Menu Side Drawer Overlay Style */


.header-premium .logo-area img {
    height: 38px;
    transition: none;
}

.header-premium.sticky .logo-area img {
    height: 38px;
}

.header-premium .submenu li a:hover {
    color: #025b39;
    background: #f4f6fc;
    padding-left: 10px;
    border-radius: 8px;
}

/* ==========================================================================
   Probe-Style Clean Navigation Header
   ========================================================================== */
.header-probe {
    background: #fff;
    padding: 20px 0;
    border-bottom: 1px solid #eee;
    width: 100%;
    z-index: 1000;
}

.nav-wrapper-probe {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.nav-area-probe ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 40px;
}

.nav-area-probe ul li a {
    text-transform: uppercase;
    font-size: 13px;
    font-weight: 700;
    color: #666;
    letter-spacing: 0.5px;
    transition: color 0.3s ease;
    text-decoration: none;
}

.nav-area-probe ul li a:hover {
    color: #025b39;
}

.btn-probe {
    background: #025b39;
    color: #fff !important;
    padding: 12px 25px;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    transition: opacity 0.3s ease;
}

.btn-probe:hover {
    opacity: 0.9;
}

.btn-probe i {
    font-size: 12px;
}

@media screen and (max-width: 991px) {
    .nav-area-probe {
        display: none;
    }
}

/* ==========================================================================
   Probe Header Sticky Type & Fixed Fix
   ========================================================================== */
.header-probe {
    position: fixed !important;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1200;
    transition: all 0.3s ease;
}

body {
    padding-top: 80px;
}

.header-probe.sticky {
    background: rgba(255, 255, 255, 0.9) !important;
    backdrop-filter: blur(15px);
    padding: 12px 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
}

/* ==========================================================================
   Mobile Menu Accordion & Responsiveness
   ========================================================================== */
@media screen and (max-width: 991px) {
    .nav-area-probe {
        display: none !important;
    }

    .mobile-btn-toggle {
        display: flex !important;
        align-items: center;
        justify-content: center;
        background: #f4f6fc;
        width: 45px;
        height: 45px;
        border-radius: 10px;
        color: #102EB1;
        font-size: 22px;
        transition: all 0.3s ease;
    }

    .mobile-btn-toggle:hover {
        background: #102EB1;
        color: #fff;
    }
}

.mobile-menu-overlay-premium ul li a {
    transition: all 0.3s ease;
}

.mobile-submenu {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease;
    padding-left: 15px;
}

.mobile-has-dropdown.active .mobile-submenu {
    max-height: 500px;
    padding-top: 15px;
    padding-bottom: 15px;
}

.mobile-has-dropdown i {
    font-size: 14px;
    margin-left: 10px;
    transition: transform 0.3s ease;
}

.mobile-has-dropdown.active i {
    transform: rotate(180deg);
}

.mobile-submenu li {
    margin-bottom: 12px !important;
}

.mobile-submenu li a {
    font-size: 16px !important;
    font-weight: 500 !important;
    color: #555 !important;
    text-transform: none !important;
}

/* ==========================================================================
   Full Width & Premium Z-Index Layout
   ========================================================================== */
.header-probe {
    z-index: 2000 !important;
    /* Extremely high z-index */
}

.mobile-menu-overlay-premium {
    z-index: 2100 !important;
}

.overlay-bg-premium {
    z-index: 2050 !important;
}

.container-probe {
    width: 100%;
    max-width: 100%;
    padding: 0 60px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
}

@media screen and (max-width: 1200px) {
    .container-probe {
        padding: 0 30px;
    }
}

@media screen and (max-width: 768px) {
    .container-probe {
        padding: 0 20px;
    }
}

.nav-area-probe ul li a {
    position: relative;
}

.nav-area-probe ul li a::after {
    content: '';
    position: absolute;
    bottom: -5px;
    left: 0;
    width: 0;
    height: 2px;
    background: #025b39;
    transition: width 0.3s ease;
}

.nav-area-probe ul li a:hover::after {
    width: 100%;
}

/* ==========================================================================
   Responsive Reason Section Optimized
   ========================================================================== */
.reason-wrapper-v2 {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 20px !important;
    margin-top: 35px !important;
}

@media screen and (max-width: 576px) {
    .reason-wrapper-v2 {
        grid-template-columns: 1fr !important;
    }

    .single-reason-v2 {
        padding: 20px !important;
    }

    .single-reason-v2 .title-v2 {
        font-size: 16px !important;
    }
}

/* ==========================================================================
   Global Typography Alignment: Weight 500 for P, H4, H5, H6
   ========================================================================== */
p,
h4,
h5,
h6,
.disc {
    font-weight: 500 !important;
}

/* Ensure all title-v2 elements match the requested 500 weight */
.title-v2 {
    font-weight: 500 !important;
}

/* Global Heading Classes Weight Alignment */
.card-title,
.v-title,
.title-v2 {
    font-weight: 500 !important;
}

/* Remove all bottom borders from Probe header and its sticky state */
.header-probe,
.header-probe.sticky {
    border-bottom: none !important;
    box-shadow: none !important;
    /* Also removing shadow for a super clean look */
}

/* Remove the underline animation from navigation links if that was the 'border' */
.nav-area-probe ul li a::after {
    display: none !important;
}

/* ==========================================================================
   Global Description Alignment: Justify
   ========================================================================== */
.disc,
.description {
    text-align: justify;
}

/* Center Align Override for Title Area Texts (e.g. .disc.mx-auto) */
p.mx-auto,
.disc.mx-auto,
.text-center p.disc,
.title-area-microsys p.disc {
    text-align: center;
}



/* ==========================================================
   About Hero Cinematic - Premium Enhancements
   ========================================================== */

/* Animated Decorative Circles */
.hero-deco-circle {
    position: absolute;
    border-radius: 50%;
    opacity: 0.08;
    pointer-events: none;
    animation: deco-pulse 6s ease-in-out infinite;
}

.hero-deco-1 {
    width: 500px;
    height: 500px;
    background: #102EB1;
    top: -150px;
    right: -100px;
    animation-delay: 0s;
}

.hero-deco-2 {
    width: 300px;
    height: 300px;
    background: #fff;
    bottom: 50px;
    left: 5%;
    opacity: 0.04;
    animation-delay: 3s;
}

@keyframes deco-pulse {

    0%,
    100% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.1);
    }
}

/* Breadcrumb */
.hero-breadcrumb {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
}

.hero-breadcrumb a {
    color: rgba(255, 255, 255, 0.7);
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    transition: color 0.3s;
}

.hero-breadcrumb a:hover {
    color: #fff;
}

.hero-breadcrumb .sep {
    color: rgba(255, 255, 255, 0.4);
    font-size: 11px;
}

.hero-breadcrumb .current {
    color: #fff;
    font-size: 14px;
    font-weight: 600;
}

/* Hero Title Highlight */
.main-title .hero-highlight {
    color: transparent;
    -webkit-text-stroke: 2px #fff;
    display: inline-block;
}

/* Hero Divider */
.hero-divider {
    width: 80px;
    height: 4px;
    background: linear-gradient(90deg, #102EB1, rgba(16, 46, 177, 0));
    border-radius: 2px;
    margin-top: 25px;
}

/* Hero CTA Button */
.hero-cta-btn {
    display: inline-flex;
    align-items: center;
    margin-top: 25px;
    padding: 14px 32px;
    background: rgba(255, 255, 255, 0.15);
    border: 1px solid rgba(255, 255, 255, 0.35);
    border-radius: 50px;
    color: #fff !important;
    font-size: 15px;
    font-weight: 600;
    text-decoration: none !important;
    backdrop-filter: blur(8px);
    transition: all 0.3s ease;
}

.hero-cta-btn:hover {
    background: #102EB1;
    border-color: #102EB1;
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(16, 46, 177, 0.4);
}

/* Stats Label Centering Override */
.single-stat-v5,
.stat-label {
    text-align: center !important;
}



/* Stats Layout Grid */
.microsys-stats-bar {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
    padding-top: 50px;
    border-top: 1px solid rgba(0, 0, 0, 0.05);
}

.single-stat-v5 {
    padding: 35px 20px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.03);
    transition: transform 0.3s;
    border: 1px solid rgba(0, 0, 0, 0.02);
}

.single-stat-v5:hover {
    transform: translateY(-8px);
    box-shadow: 0 15px 35px rgba(16, 46, 177, 0.1);
}

.single-stat-v5 .stat-num {
    font-size: 42px;
    font-weight: 800;
    color: #102EB1;
    display: block;
    margin-bottom: 10px;
    line-height: 1;
}

.single-stat-v5 .stat-label {
    font-size: 16px;
    color: #555;
    margin-bottom: 0;
    font-weight: 500;
}

@media screen and (max-width: 991px) {
    .microsys-stats-bar {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media screen and (max-width: 575px) {
    .microsys-stats-bar {
        grid-template-columns: 1fr;
    }
}

/* Base Section Spacing for Best UX */
.rts-section-gap {
    padding-top: 100px !important;
    padding-bottom: 100px !important;
}

@media screen and (max-width: 991px) {
    .rts-section-gap {
        padding-top: 70px !important;
        padding-bottom: 70px !important;
    }
}

@media screen and (max-width: 575px) {
    .rts-section-gap {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }
}

/* ==========================================================
   Yealink Product Bento Grid
   ========================================================== */
.yealink-product-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto;
    gap: 16px;
}

/* Product Card Base */
.prod-card {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    cursor: pointer;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.prod-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.12);
}

/* Large card: left column, spans both rows */
.prod-large {
    grid-column: 1;
    grid-row: 1 / 3;
    min-height: 480px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 28px;
}

/* Wide card: top-right, single row */
.prod-wide {
    grid-column: 2;
    grid-row: 1;
    min-height: 220px;
    padding: 28px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

/* Small cards: bottom-right, two columns */
.prod-small {
    grid-row: 2;
    min-height: 220px;
    padding: 24px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    border: 1px solid rgba(0, 0, 0, 0.06);
}

/* Bottom row: 2 equal small cards inside col 2 */
.prod-wide~.prod-small:nth-of-type(3),
.prod-wide~.prod-small:nth-of-type(4) {
    grid-column: auto;
}

/* Label */
.prod-label {
    font-size: 17px;
    font-weight: 700;
    color: #050d20;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    position: relative;
    z-index: 2;
}

/* Image */
.prod-img-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;
    padding: 20px 0 10px;
}

.prod-img-wrap img {
    max-height: 200px;
    width: auto;
    max-width: 100%;
    object-fit: contain;
    transition: transform 0.4s ease;
}

.prod-card:hover .prod-img-wrap img {
    transform: scale(1.05);
}

/* Arrow button */
.prod-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    background: #102EB1;
    color: #fff;
    border-radius: 50%;
    font-size: 14px;
    text-decoration: none;
    transition: background 0.3s, transform 0.3s;
    flex-shrink: 0;
    align-self: flex-start;
}

.prod-arrow:hover {
    background: #0a1f8f;
    transform: scale(1.1);
    color: #fff;
}

/* Bottom row fix: make col-2 into a sub-grid */
.yealink-product-grid .prod-wide+.prod-small,
.yealink-product-grid .prod-wide+.prod-small+.prod-small {
    grid-column: auto;
}

/* Responsive */
@media (max-width: 991px) {
    .yealink-product-grid {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto;
    }

    .prod-large {
        grid-column: 1 / -1;
        grid-row: auto;
        min-height: 300px;
    }

    .prod-wide {
        grid-column: 1 / -1;
        grid-row: auto;
    }

    .prod-small {
        grid-row: auto;
    }
}

@media (max-width: 575px) {
    .yealink-product-grid {
        grid-template-columns: 1fr;
    }

    .prod-large,
    .prod-wide,
    .prod-small {
        grid-column: 1;
        grid-row: auto;
    }
}

/* ==========================================================
   Service Details — Cinematic Banner Hero
   ========================================================== */
.sd-hero-banner {
    position: relative;
    width: 100%;
    min-height: 85vh;
    display: flex;
    flex-direction: column;
    justify-content: center;

    overflow: hidden;
}

/* Background image */
.sd-hero-bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    z-index: 0;
}

/* Dark gradient overlay */
.sd-hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(160deg,
            rgba(0, 0, 0, 0.95) 0%,
            rgba(0, 0, 0, 0.65) 60%,
            rgba(0, 0, 0, 0.98) 100%);
    z-index: 1;
}


/* Decorative orbs */
.sd-orb {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    z-index: 1;
    animation: sd-orb-pulse 7s ease-in-out infinite;
}

.sd-orb-1 {
    width: 500px;
    height: 500px;
    background: rgba(16, 46, 177, 0.15);
    top: -150px;
    right: -100px;
    animation-delay: 0s;
}

.sd-orb-2 {
    width: 300px;
    height: 300px;
    background: rgba(255, 255, 255, 0.04);
    bottom: 80px;
    left: 3%;
    animation-delay: 3.5s;
}

@keyframes sd-orb-pulse {

    0%,
    100% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.12);
    }
}

/* Inner content wrapper */
.sd-hero-inner {
    position: relative;
    z-index: 5;
    padding-top: 120px;
    padding-bottom: 0;
}

/* Breadcrumb */
.sd-breadcrumb {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 40px;
}

.sd-breadcrumb a {
    color: rgba(255, 255, 255, 0.65);
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    transition: color 0.3s;
}

.sd-breadcrumb a:hover {
    color: #fff;
}

.sd-bc-sep {
    color: rgba(255, 255, 255, 0.35);
    font-size: 11px;
}

.sd-bc-current {
    color: #fff;
    font-size: 14px;
    font-weight: 600;
}

/* Badge */
.sd-badge {
    display: inline-flex;
    align-items: center;
    padding: 8px 18px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 50px;
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.5px;
    backdrop-filter: blur(6px);
    margin-bottom: 22px;
}

/* Hero Title */
.sd-hero-title {
    font-size: 58px;
    font-weight: 800;
    line-height: 1.1;
    color: #ffffff !important;
    letter-spacing: -1.5px;
    margin-bottom: 0;
    text-align: center;
    font-family: var(--font-primary);
}


/* Divider */
.sd-hero-divider {
    width: 80px;
    height: 4px;
    background: linear-gradient(90deg, #fff, rgba(255, 255, 255, 0));
    border-radius: 2px;
    margin: 28px auto 0 auto;
}


/* Right side description */
.sd-hero-desc {
    color: rgba(255, 255, 255, 0.80);
    font-size: 16px;
    line-height: 1.8;
    margin-bottom: 28px;
    text-align: center;
}

/* CTA Buttons */
.sd-hero-btns {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    flex-wrap: wrap;
}

.sd-btn-primary {
    display: inline-flex;
    align-items: center;
    padding: 14px 30px;
    background: #102EB1;
    color: #fff !important;
    border-radius: 50px;
    font-size: 15px;
    font-weight: 600;
    text-decoration: none !important;
    transition: all 0.3s ease;
}

.sd-btn-primary:hover {
    background: #0a1f8f;
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(16, 46, 177, 0.4);
}

.sd-btn-ghost {
    display: inline-flex;
    align-items: center;
    padding: 14px 28px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.3);
    color: #fff !important;
    border-radius: 50px;
    font-size: 15px;
    font-weight: 600;
    text-decoration: none !important;
    backdrop-filter: blur(6px);
    transition: all 0.3s ease;
}

.sd-btn-ghost:hover {
    background: rgba(255, 255, 255, 0.22);
    transform: translateY(-3px);
}

/* Stats bar */
.sd-stats-row {
    display: flex;
    align-items: center;
    gap: 0;
    margin-top: 60px;
    background: rgba(255, 255, 255, 0.08);
    border-top: 1px solid rgba(255, 255, 255, 0.12);
    backdrop-filter: blur(10px);
    border-radius: 0;
    padding: 28px 0;
}

.sd-stat-item {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
    padding: 0 20px;
}

.sd-stat-num {
    font-size: 36px;
    font-weight: 800;
    color: #fff;
    line-height: 1;
}

.sd-stat-label {
    font-size: 13px;
    color: rgba(255, 255, 255, 0.65);
    font-weight: 500;
}

.sd-stat-divider {
    width: 1px;
    height: 50px;
    background: rgba(255, 255, 255, 0.2);
    flex-shrink: 0;
}

/* Responsive */
@media (max-width: 991px) {
    .sd-hero-title {
        font-size: 42px;
    }

    .sd-hero-banner {
        min-height: 70vh;
    }

    .sd-stats-row {
        flex-wrap: wrap;
        gap: 16px;
        padding: 20px;
    }

    .sd-stat-divider {
        display: none;
    }

    .sd-stat-item {
        flex: 0 0 45%;
    }
}

@media (max-width: 575px) {
    .sd-hero-title {
        font-size: 32px;
        letter-spacing: -0.5px;
    }

    .sd-hero-banner {
        min-height: 100vh;
    }

    .sd-stat-item {
        flex: 0 0 100%;
    }

    .sd-hero-btns {
        flex-direction: column;
        align-items: flex-start;
    }
}

/* ==========================================================
   Refined Service Content (Template Friendly)
   ========================================================== */
.service-details-content-law {
    background: #fff;
    padding: 0;
}

.service-details-content-law .title-law {
    font-size: 38px;
    font-weight: 700;
    line-height: 1.2;
    color: #050D20;
    margin-bottom: 22px;
    font-family: var(--font-primary);
}

.service-details-content-law .disc {
    font-size: 16px;
    line-height: 1.8;
    color: #717383;
    margin-bottom: 30px;
}

.service-details-content-law .thumbnail {
    margin-bottom: 30px;
    overflow: hidden;
    border-radius: 12px;
}

.service-details-content-law .thumbnail img {
    border-radius: 12px;
    width: 100%;
    transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.service-details-content-law .thumbnail:hover img {
    transform: scale(1.05);
}

.list-wrapper-law ul {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px;
    padding: 0;
    margin: 35px 0 45px 0;
}

.list-wrapper-law ul li {
    background: #F8F9FC;
    padding: 18px 20px;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 600;
    color: #1F1F25;
    position: relative;
    list-style: none;
    transition: all 0.3s ease;
    border: 1px solid transparent;
}

.list-wrapper-law ul li:hover {
    background: #fff;
    border-color: #102EB1;
    box-shadow: 0 8px 25px rgba(16, 46, 177, 0.08);
    transform: translateY(-3px);
}

@media (max-width: 991px) {
    .list-wrapper-law ul {
        grid-template-columns: 1fr;
    }

    .service-details-content-law .title-law {
        font-size: 30px;
    }
}



@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=Inter+Tight:wght@400;500;600;700;800&display=swap');

/* ==========================================================
   Success & Capabilities Section
   ========================================================== */
.success-capabilities-area {
    background-color: #F1EDE4;
    padding: 140px 0 160px;
    position: relative;
    overflow: hidden;
    /* Curved bottom transition */
    clip-path: ellipse(150% 100% at 50% 0%);
}

.success-capabilities-area .badge-top {
    display: inline-block;
    padding: 10px 22px;
    background: #fff;
    border-radius: 50px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.5px;
    color: #333;
    margin-bottom: 35px;
    text-transform: uppercase;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
}

.success-capabilities-area .section-title {
    font-size: 88px;
    line-height: 0.95;
    font-family: 'DM Serif Display', serif;
    color: #1F1F25;
    font-weight: 400;
    margin-bottom: 45px;
}

.success-capabilities-area .disc {
    font-size: 17px;
    line-height: 1.8;
    color: #555;
    margin-bottom: 25px;
    font-family: var(--font-secondary);
}

.success-capabilities-area .read-more-btn {
    font-size: 16px;
    font-weight: 700;
    color: #1F1F25;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    margin-top: 25px;
    transition: all 0.3s ease;
    border-bottom: 2px solid transparent;
}

.success-capabilities-area .read-more-btn:hover {
    gap: 18px;
    color: #102EB1;
}

.success-capabilities-area .image-wrapper {
    position: relative;
    padding-left: 20px;
}

.success-capabilities-area .image-wrapper img {
    width: 100%;
    border-radius: 35px;
    border-bottom-left-radius: 140px;
    box-shadow: 0 50px 100px rgba(0, 0, 0, 0.12);
}

/* ==========================================================
   Friendly Design System (index.html)
   ========================================================== */
:root {
    --bg-friendly: #F8F9FC;
    --text-heading: #050D20;
    --text-body: #717383;
    --color-accent: #102EB1;
    --radius-premium: 16px;
}

/* Global Friendly Typography & Layout */
body.demo-default {
    background-color: #fff;
    color: var(--text-body);
    font-family: var(--font-primary);
}

body.demo-default h1,
body.demo-default h2,
body.demo-default h3,
body.demo-default h4,
body.demo-default h5,
body.demo-default h6 {
    font-family: 'Cairo', sans-serif !important;
    color: var(--text-heading);
    font-weight: 700;
    line-height: 1.2;
}


/* Friendly Section Backgrounds */
.bg-friendly-section {
    background-color: var(--bg-friendly);
}

/* Friendly Card/Thumbnail styling */
.friendly-card {
    background: #fff;
    border-radius: var(--radius-premium);
    padding: 40px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.04);
    transition: all 0.4s ease;
}

.friendly-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 60px rgba(16, 46, 177, 0.08);
}

/* Section Gap (Standardizing Friendly) */
.rts-section-gap {
    padding-top: 120px;
    padding-bottom: 120px;
}

/* Success & Capabilities Media */
@media (max-width: 1200px) {
    .success-capabilities-area .section-title {
        font-size: 72px;
    }
}

@media (max-width: 991px) {
    .success-capabilities-area {
        padding: 100px 0;
        clip-path: none;
    }

    .success-capabilities-area .section-title {
        font-size: 54px;
    }

    .success-capabilities-area .badge-top {
        font-size: 10px;
        margin-bottom: 25px;
    }

    .success-capabilities-area .image-wrapper {
        padding-left: 0;
        margin-top: 40px;
    }

    .rts-section-gap {
        padding-top: 80px;
        padding-bottom: 80px;
    }
}

/* Global Text Justification Utility */
.about-justify,
.disc-justify {
    text-align: justify;
    text-justify: inter-word;
}

/* Redesigned Work Process Section - Premium Style */
.work-process-redesign {
    background: #ffffff;
    padding: 120px 0;
    position: relative;
    overflow: hidden;
}

.work-process-redesign::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: radial-gradient(circle at 90% 10%, rgba(16, 46, 177, 0.03) 0%, transparent 40%);
    z-index: 1;
}

.redesign-content-box {
    background: #fff;
    border-radius: 30px;
    box-shadow: 0 40px 100px rgba(0, 0, 0, 0.05);
    overflow: hidden;
    position: relative;
    z-index: 2;
    border: 1px solid rgba(16, 46, 177, 0.06);
}

.redesign-image-side {
    position: relative;
    overflow: hidden;
    height: 100%;
    min-height: 600px;
}

.redesign-image-side.vertical-mode {
    min-height: 550px;
    height: 550px;
}

.image-overlay-beam {
    position: absolute;
    top: -100%;
    left: -100%;
    width: 300%;
    height: 300%;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0) 100%);
    pointer-events: none;
    z-index: 5;
}

.redesign-content-box:hover .image-overlay-beam {
    top: 100%;
    left: 100%;
    transition: 1.5s cubic-bezier(0.19, 1, 0.22, 1);
}

.floating-tech-badge {
    position: absolute;
    bottom: 40px;
    left: 40px;
    background: rgba(5, 13, 32, 0.7);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    padding: 16px 28px;
    border-radius: 12px;
    color: #fff;
    display: flex;
    align-items: center;
    gap: 15px;
    z-index: 10;
    box-shadow: 0 15px 45px rgba(0, 0, 0, 0.4);
    animation: floating-pill 4s ease-in-out infinite;
}

.floating-tech-badge i {
    color: #102EB1 !important;
    font-size: 20px;
    background: #fff;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.floating-tech-badge span {
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

@keyframes floating-pill {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-12px);
    }
}

.redesign-image-side img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 1.5s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.redesign-content-box:hover .redesign-image-side img {
    transform: scale(1.05);
}

.redesign-text-side {
    padding: 80px 60px;
}

.redesign-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 22px;
    background: rgba(16, 46, 177, 0.06);
    color: #102EB1;
    border-radius: 50px;
    font-size: 13px;
    font-weight: 700;
    margin-bottom: 30px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
}

.redesign-badge i {
    font-size: 10px;
}

.redesign-title {
    font-size: 46px;
    font-weight: 800;
    color: #050D20;
    line-height: 1.15;
    margin-bottom: 25px;
    letter-spacing: -1.5px;
}

.redesign-desc {
    font-size: 18px;
    color: #717383;
    line-height: 1.8;
    margin-bottom: 45px;
}

.redesign-card-grid {
    /* Updated for column mode grid */
    margin-top: 10px;
}

.redesign-card {
    background: #ffffff;
    padding: 35px;
    border-radius: 12px;
    border: 1px solid #f0f0f0;
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    display: flex;
    gap: 25px;
    align-items: flex-start;
    height: 100%;
    position: relative;
    z-index: 1;
    overflow: hidden;
}

.redesign-card:hover {
    border-color: #102EB1;
    transform: translateY(-10px);
    box-shadow: 0 30px 60px rgba(16, 46, 177, 0.08);
}

.redesign-card .icon-v5 {
    width: 65px;
    height: 65px;
    background: #f8f9fc;
    color: #102EB1;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    flex-shrink: 0;
    transition: 0.4s;
}

.redesign-card:hover .icon-v5 {
    background: #102EB1;
    color: #fff;
    box-shadow: 0 10px 20px rgba(16, 46, 177, 0.2);
}

.redesign-card .info-v5 h4 {
    font-size: 20px;
    font-weight: 800;
    color: #050D20;
    margin-bottom: 12px;
}

.redesign-card .info-v5 p {
    font-size: 15px;
    color: #717383;
    line-height: 1.6;
    margin: 0;
}

@media (max-width: 1199px) {
    .redesign-title {
        font-size: 38px;
    }
}

@media (max-width: 991px) {
    .redesign-image-side {
        min-height: 400px;
    }

    .redesign-image-side.vertical-mode {
        min-height: 350px;
        height: 350px;
    }

    .floating-tech-badge {
        bottom: 25px;
        left: 25px;
        padding: 12px 20px;
    }

    .floating-tech-badge i {
        width: 30px;
        height: 30px;
        font-size: 16px;
    }

    .redesign-text-side {
        padding: 50px 30px;
    }

    .redesign-title {
        font-size: 34px;
    }

    .redesign-card {
        padding: 25px;
        gap: 20px;
    }
}

@media (max-width: 575px) {
    .redesign-card {
        flex-direction: column;
    }

    .redesign-card .icon-v5 {
        width: 50px;
        height: 50px;
        font-size: 18px;
    }
}

/* ==========================================================================
   Bento Grid Portfolio Section
   ========================================================================== */
.rts-bento-grid-area {
    background: #ffffff;
    padding-top: 20px;
}

.bento-card {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    height: 100%;
    min-height: 500px;
    background: #f8f9fc;
    border: 1px solid rgba(0, 0, 0, 0.05);
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.bento-card.hero-style {
    min-height: 550px;
}

.bento-card.stat-style {
    padding: 60px 40px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    position: relative;
}

.bento-card.quote-style {
    padding: 60px 40px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    color: #050D20;
}

.bento-card.portrait-style {
    min-height: 600px;
}

/* Background Image Handling */
.bento-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 1;
    transition: transform 1.5s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.bento-card:hover .bento-bg {
    transform: scale(1.1);
}

.bento-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 40px 80px rgba(0, 0, 0, 0.1);
    border-color: #102EB1;
}

/* Translucent Footer */
.bento-footer {
    position: absolute;
    bottom: 20px;
    left: 20px;
    right: 20px;
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    padding: 25px 30px;
    border-radius: 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    z-index: 10;
    border: 1px solid rgba(255, 255, 255, 0.3);
}

.bento-footer h4 {
    font-size: 20px;
    font-weight: 800;
    margin-bottom: 5px;
    color: #050D20;
}

.bento-footer p {
    font-size: 14px;
    margin: 0;
    color: #555;
    font-weight: 500;
}

.bento-footer .arrow-btn {
    width: 45px;
    height: 45px;
    background: #ACC544;
    color: #050D20;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    transition: transform 0.3s ease;
}

.bento-card:hover .arrow-btn {
    transform: rotate(-45deg);
    background: #050D20;
    color: #fff;
}

/* Badge Styling */
.bento-badge {
    position: absolute;
    top: 25px;
    left: 25px;
    background: rgba(5, 13, 32, 0.8);
    color: #fff;
    padding: 8px 16px;
    border-radius: 5px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1px;
    z-index: 10;
}

/* Bento Perfect Grid (100% Image Match Styles) */
.bento-p-item {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    height: 480px;
    background: #000;
    transition: transform 0.5s ease;
}

.bento-p-item.hero {
    height: 700px;
}

.bento-p-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 1;
    transition: transform 1.2s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.bento-p-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 65%;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.85), transparent);
    z-index: 2;
}

.bento-p-content {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 35px 40px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    z-index: 3;
}

.bento-p-badge {
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(8px);
    color: #1a1a1a;
    padding: 6px 15px;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 700;
    width: fit-content;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

.bento-p-footer {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.bento-p-date {
    color: rgba(255, 255, 255, 0.85);
    font-size: 14px;
    font-weight: 600;
}

.bento-p-title {
    color: #ffffff !important;
    font-size: clamp(2.2rem, 4vw, 3.8rem);
    font-weight: 700;
    line-height: 1.1;
    margin: 0;
    letter-spacing: -0.5px;
}

.bento-p-title.small {
    font-size: clamp(1.8rem, 2.5vw, 2.4rem);
}

.bento-p-item:hover .bento-p-bg {
    transform: scale(1.06);
}

.bento-p-item:hover {
    box-shadow: 0 30px 60px rgba(0, 0, 0, 0.2);
}

@media (max-width: 991px) {
    .bento-p-item.hero {
        height: 500px;
    }

    .bento-p-item {
        height: 400px;
    }

    .bento-p-content {
        padding: 25px;
    }
}

@media (max-width: 575px) {
    .bento-p-title {
        font-size: 1.8rem;
    }

    .bento-p-title.small {
        font-size: 1.4rem;
    }
}

/* Bento Section Header Overrides */
.rts-bento-grid-area .title-area-microsys h2 {
    color: #050d20 !important;
}

.rts-bento-grid-area .title-area-microsys .pre {
    background: #fff9e6;
    /* Standard Badge BG */
    color: #cda344;
    /* Standard Badge Color */
}

/* Original Bento Classes (Preserved for backward compatibility) */
.stat-content {
    position: relative;
    z-index: 5;
}

.fact-label {
    display: block;
    color: #fff;
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 20px;
}

.stat-number {
    font-size: 110px;
    font-weight: 900;
    color: #fff;
    line-height: 0.9;
    letter-spacing: -5px;
    margin-bottom: 20px;
}

.stat-badge {
    display: inline-block;
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
    padding: 6px 14px;
    border-radius: 50px;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1px;
}

.fact-decor {
    position: absolute;
    top: 40px;
    right: -20px;
    width: 300px;
    opacity: 0.3;
    z-index: 1;
}

/* Quote Card Details */
.quote-decor {
    font-size: 40px;
    color: #050D20;
    margin-bottom: 30px;
}

.quote-text h3 {
    font-size: 42px;
    font-weight: 800;
    line-height: 1.1;
    margin-bottom: 20px;
    color: #050D20;
    letter-spacing: -1px;
}

.quote-text p {
    font-size: 18px;
    color: rgba(5, 13, 32, 0.7);
    line-height: 1.5;
    font-weight: 500;
}

.author {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-top: 40px;
}

.author img {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    object-fit: cover;
}

.author h6 {
    margin: 0;
    font-size: 16px;
    font-weight: 800;
}

.author span {
    font-size: 12px;
    font-weight: 700;
    color: rgba(5, 13, 32, 0.6);
    text-transform: uppercase;
}

/* Responsive Grid Adjustments */
@media (max-width: 1199px) {
    .stat-number {
        font-size: 90px;
    }

    .quote-text h3 {
        font-size: 34px;
    }
}

@media (max-width: 991px) {
    .bento-card {
        min-height: 450px !important;
    }

    .stat-number {
        font-size: 80px;
    }
}

/* ==========================================================================
   Our Commitments Section (Editorial Style)
   ========================================================================== */
.rts-commitments-area {
    background: #fdfdfb;
    /* Subtle ivory/skincare background from image */
}

.section-title-large {
    font-size: clamp(2.5rem, 5vw, 4rem);
    font-weight: 700;
    color: #1a1a1a;
    margin-bottom: 20px;
    letter-spacing: -1.5px;
}

.commitment-item {
    display: flex;
    flex-direction: column;
}

.commitment-item .image-box {
    width: 100%;
    aspect-ratio: 3 / 4;
    /* Perfect portrait match */
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: 30px;
    background: #eee;
}

.commitment-item .image-box img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 1.5s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.commitment-item:hover .image-box img {
    transform: scale(1.08);
    /* Sophisticated slow zoom */
}

.commitment-item .title-wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.commitment-item .title-wrap .title {
    font-size: 18px;
    font-weight: 700;
    color: #1a1a1a;
    margin: 0;
    letter-spacing: -0.2px;
}

.commitment-item .title-wrap .num {
    font-size: 16px;
    font-weight: 700;
    color: #050d20;
    opacity: 0.8;
}

.commitment-item .divider {
    width: 100%;
    height: 1px;
    background: #e0e0e0;
    margin-bottom: 15px;
}

.commitment-item .desc {
    font-size: 14px;
    color: #555;
    line-height: 1.6;
    margin-bottom: 0;
}

@media (max-width: 991px) {
    .section-title-large {
        font-size: 2.5rem;
        text-align: center;
    }
}


/* ==========================================================================
   Premium Probe Style Banner & Navigation
   ========================================================================== */

/* Header Probe Button Styling */
.btn-probe {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: #025b39;
    color: #fff !important;
    padding: 12px 28px;
    border-radius: 50px;
    font-weight: 700;
    font-size: 15px;
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
    border: none;
    cursor: pointer;
    text-decoration: none;
    box-shadow: 0 4px 15px rgba(16, 46, 177, 0.2);
}

.btn-probe i {
    font-size: 16px;
    transition: transform 0.4s ease;
}

/* Header Button Hover Animation */
.btn-probe:hover {
    background: #050d20;
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(5, 13, 32, 0.3);
}

.btn-probe:hover i {
    animation: arrowShake 0.4s ease-in-out infinite;
}

@keyframes arrowShake {

    0%,
    100% {
        transform: translateX(0);
    }

    50% {
        transform: translateX(5px);
    }
}

/* Contact Area Padding Adjustments */
.rts-contact-area {
    padding-top: 100px !important;
}

/* ==========================================================================
   Cinematic Hero Banner Styles
   ========================================================================== */
.about-hero-cinematic {
    position: relative;
    height: 60vh;
    min-height: 450px;
    width: 100%;
    display: flex;
    align-items: center;
    overflow: hidden;
    background: #050d20;
    z-index: 10;
}

.about-hero-cinematic .bg-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0.6;
    filter: saturate(0.8) contrast(1.1);
    z-index: 1;
}

.about-hero-cinematic .overlay-shadow {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, rgba(5, 13, 32, 1) 0%, rgba(5, 13, 32, 0.4) 50%, rgba(5, 13, 32, 0.1) 100%);
    z-index: 2;
}

.hero-left-v5 {
    display: flex;
    flex-direction: column;
    z-index: 5;
    position: relative;
    padding-top: 40px;
}

.hero-left-v5.mt--20 {
    margin-top: 20px !important;
}

.hero-left-v5 .main-title {
    font-size: clamp(3.5rem, 8vw, 6rem);
    font-weight: 700;
    color: #fff;
    line-height: 1.1;
    letter-spacing: normal;
    margin: 0 auto;
    display: flex;
    flex-flow: wrap;
    align-items: center;
    justify-content: center;
    gap: 15px;
    text-align: center;
}

.hero-highlight {
    -webkit-text-stroke: 2px #fff;
    color: transparent;
    text-transform: uppercase;
}

.hero-divider {
    width: 100px;
    height: 6px;
    background: #102EB1;
    margin: 30px auto 0 auto;
    border-radius: 50px;
}

.hero-deco-circle {
    position: absolute;
    width: 400px;
    height: 400px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(16, 46, 177, 0.1) 0%, transparent 70%);
    z-index: 3;
    animation: floatCircles 15s infinite alternate ease-in-out;
}

.hero-deco-1 {
    top: -100px;
    right: -100px;
}

.hero-deco-2 {
    bottom: -100px;
    left: -100px;
    animation-delay: -7s;
}

@keyframes floatCircles {
    0% {
        transform: translate(0, 0);
    }

    100% {
        transform: translate(30px, 50px);
    }
}

/* Header Probe Structure */
.header-probe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    padding: 15px 0;
    z-index: 1000;
    background: #fff;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.05);
}

.header-probe.sticky {
    position: fixed !important;
    background: #fff;
    backdrop-filter: blur(15px);
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.08);
    padding: 12px 0;
    transition: none !important;
}

.container-probe {
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.nav-area-probe ul {
    list-style: none;
    display: flex;
    gap: 40px;
    margin: 0;
    padding: 0;
}

.nav-area-probe .main-nav a {
    color: #050d20;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 14px;
    letter-spacing: 1px;
    text-decoration: none;
    transition: none !important;
}

.header-probe.sticky .nav-area-probe .main-nav a {
    color: #050d20;
}

.nav-area-probe .main-nav a:hover {
    color: #025b39 !important;
}

/* Mobile Toggle */
.mobile-btn-toggle {
    display: none;
    font-size: 24px;
    color: #050d20;
    cursor: pointer;
}

.header-probe.sticky .mobile-btn-toggle {
    color: #050d20;
}

@media (max-width: 1199px) {

    .nav-area-probe,
    .desktop-contact-info {
        display: none !important;
    }

    .mobile-btn-toggle {
        display: block;
    }
}

body.no-scroll {
    overflow: hidden !important;
}

/* Mobile Drawer Premium Styles */


/* ==========================================================================
   Microsys Values Elite Redesign (About Page)
   ========================================================================== */
.microsys-values-elite {
    background-color: #f8fbff;
    position: relative;
    overflow: hidden;
}

.microsys-values-elite::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: radial-gradient(circle at 10% 20%, rgba(16, 46, 177, 0.02) 0%, transparent 40%);
    pointer-events: none;
}

.microsys-values-elite .microsys-elite-card {
    transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.03);
    border: 1px solid rgba(16, 46, 177, 0.05);
}

.microsys-values-elite .microsys-elite-card:hover {
    transform: translateY(-8px) scale(1.02);
    box-shadow: 0 40px 80px rgba(16, 46, 177, 0.08);
    background: #fff;
    border-color: rgba(16, 46, 177, 0.2);
}

/* Numbering Style for Value Cards */
.num-v4 {
    position: absolute;
    bottom: 25px;
    right: 30px;
    font-size: 50px;
    font-weight: 900;
    color: rgba(16, 46, 177, 0.03);
    line-height: 1;
    z-index: 0;
    transition: 0.5s;
}

.microsys-values-elite .microsys-elite-card:hover .num-v4 {
    color: rgba(16, 46, 177, 0.07);
    transform: scale(1.2);
}

.microsys-values-elite .icon-v4 {
    background: #fff;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.04);
}

/* ==========================================================================
   Microsys Working Process Redesign
   ========================================================================== */
.bg-light-v2 {
    background: #fcfdfe;
}

.process-card-v5 {
    background: #fff;
    padding: 50px 35px;
    border-radius: 24px;
    border: 1px solid #f0f3f9;
    position: relative;
    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1);
    height: 100%;
    z-index: 1;
}

.process-card-v5:hover {
    transform: translateY(-12px);
    box-shadow: 0 40px 80px rgba(16, 46, 177, 0.08);
    border-color: #102EB1;
}

.process-num {
    position: absolute;
    top: 25px;
    right: 30px;
    font-size: 50px;
    font-weight: 900;
    color: rgba(16, 46, 177, 0.05);
    line-height: 1;
    z-index: -1;
    transition: 0.5s;
}

.process-card-v5:hover .process-num {
    color: rgba(2, 91, 57, 0.08);
}

.process-icon {
    width: 60px;
    height: 60px;
    background: rgba(2, 91, 57, 0.05);
    color: #025b39;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 26px;
    margin-bottom: 30px;
    transition: 0.4s;
}

.process-card-v5:hover .process-icon {
    background: #102EB1;
    color: #fff;
    transform: rotateY(180deg);
}

.process-title {
    font-size: 20px;
    font-weight: 800;
    margin-bottom: 15px;
    color: #050d20;
}

.process-disc {
    font-size: 15px;
    line-height: 1.6;
    color: #717383;
    margin-bottom: 0;
}

/* ==========================================================================
   Premium CTA v2 Redesign
   ========================================================================== */
.premium-cta-v2 {
    background: #050d20;
    padding: 100px 0;
    position: relative;
    overflow: hidden;
}

.premium-cta-v2::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: radial-gradient(circle at 80% 20%, rgba(16, 46, 177, 0.15) 0%, transparent 50%);
}

.cta-inner-v2 {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.03) 0%, rgba(255, 255, 255, 0.01) 100%);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.08);
    padding: 80px 60px;
    border-radius: 40px;
    position: relative;
    z-index: 5;
}

.cta-text-v2 .title {
    color: #fff !important;
    font-size: clamp(30px, 5vw, 48px);
    font-weight: 900;
    line-height: 1.2;
    margin-bottom: 25px;
}

.cta-text-v2 .disc {
    color: rgba(255, 255, 255, 0.7) !important;
    font-size: 18px;
    max-width: 550px;
    margin-bottom: 0;
}

@media (max-width: 991px) {
    .cta-inner-v2 {
        padding: 50px 30px;
        text-align: center;
    }

    .cta-text-v2 .disc {
        margin: 0 auto 40px auto;
    }

    .cta-text-v2 .title br {
        display: none;
    }
}

/* ==========================================================================
   Mobile Excellence & Accessibility Layer
   ========================================================================== */
@media screen and (max-width: 768px) {
    .rts-section-gap {
        padding: 80px 0 !important;
    }

    .title-area-microsys .title {
        font-size: clamp(2.4rem, 8vw, 3.2rem) !important;
    }

    .mobile-menu-overlay-premium {
        width: 100% !important;
        max-width: 420px;
    }

    /* ==========================================================================
   Modern Why Choose Us Section (Mockup Inspired)
   ========================================================================== */
    .rts-why-us-v7 {
        background: #fff;
        padding: 120px 0;
    }

    .why-us-thumb-v7 img {
        width: 100%;
        border-radius: 25px;
        box-shadow: 0 30px 60px rgba(0, 0, 0, 0.06);
        aspect-ratio: 1/1;
        object-fit: cover;
    }

    .why-us-content-v7 {
        padding-left: 50px;
    }

    .why-us-content-v7 .title {
        font-size: clamp(28px, 3.5vw, 42px) !important;
        font-weight: 800 !important;
        line-height: 1.2 !important;
        color: #050d20;
        margin-bottom: 25px;
    }

    .why-us-content-v7 .title .gray-text {
        color: #a0a0a0;
    }

    .why-us-content-v7 .disc {
        font-size: 16px;
        color: #666;
        margin-bottom: 40px;
    }

    .why-us-features {
        display: flex;
        flex-direction: column;
        gap: 30px;
    }

    .feature-item-v7 {
        display: flex;
        gap: 20px;
        align-items: flex-start;
    }

    .feature-icon {
        width: 50px;
        height: 50px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 20px;
        flex-shrink: 0;
    }

    .feature-icon.v-purple {
        background: rgba(131, 107, 237, 0.1);
        color: #836BED;
    }

    .feature-icon.v-pink {
        background: rgba(246, 211, 255, 0.4);
        color: #B54ED5;
    }

    .feature-icon.v-yellow {
        background: rgba(239, 255, 172, 0.4);
        color: #7B8D14;
    }

    .f-title {
        font-size: 18px;
        font-weight: 700;
        margin-bottom: 8px;
        color: #050d20;
    }

    .f-disc {
        font-size: 15px;
        line-height: 1.6;
        color: #717383;
        margin-bottom: 0;
    }

    @media (max-width: 991px) {
        .why-us-content-v7 {
            padding-left: 0;
            margin-top: 50px;
        }

        .why-us-thumb-v7 {
            margin-bottom: 40px;
        }
    }

    /* ==========================================================================
   Mobile Excellence & Accessibility Layer
   ========================================================================== */
    @media screen and (max-width: 768px) {
        .rts-section-gap {
            padding: 80px 0 !important;
        }

        .title-area-microsys .title {
            font-size: clamp(2.4rem, 8vw, 3.2rem) !important;
        }

        .mobile-menu-overlay-premium {
            width: 100% !important;
            max-width: 420px;
        }

        .btn-probe {
            padding: 12px 20px !important;
            font-size: 14px !important;
        }

        .container {
            padding-left: 20px !important;
            padding-right: 20px !important;
        }
    }

    @media screen and (max-width: 480px) {
        .rts-section-gap {
            padding: 60px 0 !important;
        }
    }

    /* Accessibility: Focus States */
    a:focus,
    button:focus {
        outline: 2px solid var(--primary-blue);
        outline-offset: 4px;
    }

    /* Optimized Mobile Touch Targets (WCAG Compliant 44px+) */
    .mobile-menu-overlay-premium ul li a {
        padding: 16px 0 !important;
        min-height: 48px;
        display: flex !important;
        align-items: center;
    }

    .mobile-btn-toggle {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        width: 44px;
        height: 44px;
        cursor: pointer;
        background: rgba(16, 46, 177, 0.05);
        border-radius: 8px;
        margin-left: 10px;
    }

    .mobile-btn-toggle:hover {
        background: var(--primary-blue);
        color: #fff !important;
    }

    /* Smooth Scrolling for All Pages */
    html {
        scroll-padding-top: 100px;
    }

    /* ==========================================================================
   Modern Mission Section Redesign
   ========================================================================== */
    .rts-mission-area-v6 {
        background: #fff;
        padding: 120px 0;
    }

    .mission-header-v6 {
        margin-bottom: 80px;
    }

    .mission-title-v6 {
        font-size: clamp(28px, 4vw, 56px) !important;
        font-weight: 800 !important;
        line-height: 1.1 !important;
        color: #050d20;
        max-width: 1300px;
    }

    .mission-title-v6 .gray-text {
        color: #a0a0a0;
        font-weight: 700;
    }

    .mission-image-small img {
        width: 100%;
        aspect-ratio: 1/1;
        object-fit: cover;
        border-radius: 20px;
        box-shadow: 0 20px 40px rgba(0, 0, 0, 0.04);
    }

    .mission-description-v6 {
        padding-left: 30px;
    }

    .mission-description-v6 .disc {
        font-size: 18px;
        line-height: 1.7;
        color: #666;
    }

    .btn-black-pill {
        display: inline-flex;
        align-items: center;
        gap: 12px;
        background: #000;
        color: #fff !important;
        padding: 18px 35px;
        border-radius: 100px;
        font-weight: 700;
        font-size: 16px;
        text-decoration: none;
        margin-top: 40px;
        transition: 0.4s;
    }

    .btn-black-pill:hover {
        background: #102EB1;
        transform: scale(1.05);
    }

    .mission-image-large img {
        width: 100%;
        aspect-ratio: 3/4;
        object-fit: cover;
        border-radius: 25px;
        box-shadow: 0 30px 60px rgba(0, 0, 0, 0.06);
    }

    @media (max-width: 991px) {
        .mission-header-v6 br {
            display: none;
        }

        .mission-description-v6 {
            padding-left: 0;
            margin-top: 40px;
        }

        .mission-image-small {
            display: none;
        }
    }

    .pre-pill {
        background: #FFFAE9;
        color: #444;
        padding: 6px 16px;
        border-radius: 50px;
        font-size: 13px;
        font-weight: 700;
        letter-spacing: 0.5px;
        display: inline-block;
        margin-bottom: 25px;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.02);
    }

    /* ==========================================================================
   Integrated Product Showcase Styles
   ========================================================================== */
    .product-showcase-visual {
        position: relative;
        border-radius: 30px;
        overflow: hidden;
        box-shadow: 0 40px 100px rgba(0, 0, 0, 0.12);
        background: #000;
    }

    .cinematic-visual {
        width: 100%;
        height: auto;
        display: block;
        transition: transform 1.5s cubic-bezier(0.165, 0.84, 0.44, 1);
    }

    .product-showcase-visual:hover .cinematic-visual {
        transform: scale(1.03);
    }

    .visual-overlay {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: radial-gradient(circle at center, transparent 0%, rgba(5, 13, 32, 0.05) 100%);
        pointer-events: none;
    }

    .description-wrap-premium .disc {
        font-family: 'Inter', sans-serif;
        letter-spacing: -0.1px;
    }

    /* ==========================================================================
   Trusted Solutions (Refined Perfection Split)
   ========================================================================== */
    .rts-trusted-solutions-area {
        position: relative;
        padding-bottom: 120px;
        background: #fff;
        overflow: hidden;
    }

    .elite-status-badge {
        display: inline-flex;
        align-items: center;
        gap: 12px;
        background: rgba(16, 46, 177, 0.05);
        padding: 10px 22px;
        border-radius: 100px;
        margin-bottom: 25px;
    }

    .elite-status-badge i {
        color: #f8bb03;
        font-size: 14px;
    }

    .elite-status-badge span {
        font-size: 13px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 1px;
        color: #102EB1;
    }

    .title-premium {
        font-size: clamp(2.2rem, 4vw, 3.8rem);
        font-weight: 800;
        color: #050d20;
        line-height: 1.1;
        margin-bottom: 25px;
    }

    /* Perfection Box V2 (Vertical Grid Cards) */
    .perfection-box-v2 {
        background: #F9F9FB;
        padding: 30px 25px;
        border-radius: 15px;
        border: 1px solid #eee;
        height: 100%;
        transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
        position: relative;
    }

    .perfection-box-v2:hover {
        background: #fff;
        box-shadow: 0 20px 40px rgba(16, 46, 177, 0.06);
        transform: translateY(-8px);
        border-color: #102EB1;
    }

    .icon-orb-v2 {
        width: 55px;
        height: 55px;
        background: #fff;
        color: #102EB1;
        border-radius: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 22px;
        margin-bottom: 20px;
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.03);
    }

    .box-title-v2 {
        font-size: 17px;
        font-weight: 800;
        margin-bottom: 12px;
        color: #050d20;
    }

    .box-disc-v2 {
        font-size: 14px;
        color: #666;
        line-height: 1.6;
        margin: 0;
    }

    /* Refined Image Side */
    .pro-portrait-view-refined {
        position: relative;
        border-radius: 25px;
        aspect-ratio: 4 / 5;
        overflow: hidden;
        z-index: 2;
        box-shadow: 0 40px 100px rgba(0, 0, 0, 0.12);
    }

    .shimmer-overlay-v2 {
        position: absolute;
        top: 0;
        left: -100%;
        width: 100%;
        height: 100%;
        background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
        animation: shimmerProV2 6s infinite ease-in-out;
    }

    @keyframes shimmerProV2 {
        0% {
            left: -100%;
        }

        50%,
        100% {
            left: 100%;
        }
    }

    .floating-trust-pill-v2 {
        position: absolute;
        bottom: 30px;
        left: -20px;
        background: #fff;
        padding: 12px 25px;
        border-radius: 100px;
        display: flex;
        align-items: center;
        gap: 15px;
        box-shadow: 0 20px 40px rgba(0, 0, 0, 0.12);
        z-index: 5;
        border: 1px solid rgba(0, 0, 0, 0.03);
    }

    .icon-circle-v2 {
        width: 32px;
        height: 32px;
        background: #acc544;
        color: #fff;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 13px;
        flex-shrink: 0;
    }

    .pill-context strong {
        display: block;
        font-size: 14px;
        font-weight: 800;
        color: #050d20;
    }

    .pill-context span {
        display: block;
        font-size: 12px;
        color: #777;
        font-weight: 600;
        line-height: 1;
    }

    .structural-accent {
        position: absolute;
        width: 200px;
        height: 200px;
        border-radius: 50%;
        filter: blur(60px);
        z-index: 1;
        opacity: 0.1;
    }

    .accent-one {
        background: #102EB1;
        top: -30px;
        right: -30px;
    }

    .accent-two {
        background: #acc544;
        bottom: -30px;
        left: -30px;
    }

    @media (max-width: 991px) {
        .floating-trust-pill-v2 {
            left: 20px;
            bottom: 20px;
        }

        .perfection-box-v2 {
            margin-bottom: 20px;
        }
    }

    .disc-pro {
        font-size: 18px;
        color: #555;
        line-height: 1.6;
    }

    /* Feature Stack Styles */
    .pro-feature-card {
        background: #fff;
        border: 1px solid #f0f0f0;
        border-radius: 20px;
        transition: 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
    }

    .card-inner-pro {
        display: flex;
        align-items: center;
        gap: 25px;
        padding: 25px;
    }

    .icon-box-pro {
        width: 65px;
        height: 65px;
        background: #f8faff;
        color: #102EB1;
        border-radius: 15px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 24px;
        flex-shrink: 0;
        transition: 0.4s;
        border: 1px solid #eef2ff;
    }

    .pro-feature-card:hover {
        transform: translateX(10px);
        border-color: #102EB1;
        box-shadow: 0 20px 40px rgba(16, 46, 177, 0.08);
    }

    .pro-feature-card:hover .icon-box-pro {
        background: #102EB1;
        color: #fff;
    }

    .content-pro h4 {
        font-size: 18px;
        font-weight: 800;
        margin-bottom: 5px;
    }

    .content-pro p {
        font-size: 14px;
        color: #666;
        margin: 0;
    }

    /* Visual Column Styles */
    .trusted-visual-anchor {
        position: relative;
        padding: 40px;
    }

    .pro-portrait-view {
        position: relative;
        border-radius: 30px;
        aspect-ratio: 4/5;
        overflow: hidden;
        z-index: 2;
        box-shadow: 0 50px 100px rgba(0, 0, 0, 0.15);
    }

    .main-portrait-img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .shimmer-overlay {
        position: absolute;
        top: 0;
        left: -100%;
        width: 100%;
        height: 100%;
        background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
        animation: shimmerPro 6s infinite ease-in-out;
    }

    @keyframes shimmerPro {
        0% {
            left: -100%;
        }

        50%,
        100% {
            left: 100%;
        }
    }

    .floating-trust-pill {
        position: absolute;
        bottom: 40px;
        left: -30px;
        background: #fff;
        padding: 12px 25px;
        border-radius: 100px;
        display: flex;
        align-items: center;
        gap: 12px;
        box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
        z-index: 5;
    }

    .floating-trust-pill .icon-circle {
        width: 30px;
        height: 30px;
        background: #acc544;
        color: #fff;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 12px;
    }

    .floating-trust-pill span {
        font-weight: 700;
        font-size: 14px;
        color: #050d20;
    }

    /* Decorative Blobs */
    .shape-blob {
        position: absolute;
        border-radius: 50%;
        filter: blur(80px);
        z-index: 1;
        opacity: 0.15;
    }

    .shape-blob.one {
        width: 300px;
        height: 300px;
        background: #102EB1;
        top: -50px;
        right: -50px;
        animation: blobMove 10s infinite alternate;
    }

    .shape-blob.two {
        width: 250px;
        height: 250px;
        background: #acc544;
        bottom: -50px;
        left: -50px;
        animation: blobMove 12s infinite alternate-reverse;
    }

    @keyframes blobMove {
        0% {
            transform: translate(0, 0) scale(1);
        }

        100% {
            transform: translate(30px, 30px) scale(1.1);
        }
    }

    @media (max-width: 991px) {
        .floating-trust-pill {
            left: 20px;
            bottom: 20px;
        }

        .trusted-visual-anchor {
            padding: 0;
            margin-top: 50px;
        }
    }

    /* ==========================================================================
   Super-Premium Why-Section Redesign (Elite Refined Styling)
   ========================================================================== */
    .why-section {
        padding: 120px 0;
        background: #fff;
        position: relative;
        overflow: hidden;
    }

    .why-bg-shape {
        position: absolute;
        top: -100px;
        right: -100px;
        width: 400px;
        height: 400px;
        background: radial-gradient(circle, rgba(16, 46, 177, 0.05) 0%, rgba(255, 255, 255, 0) 70%);
        z-index: 0;
    }

    /* ── Image wrapper & Elite Badge ── */
    .image-column-elite {
        position: relative;
    }

    .img-wrapper {
        border-radius: 30px;
        overflow: hidden;
        height: 100%;
        min-height: 520px;
        box-shadow: 0 40px 80px rgba(0, 0, 0, 0.08);
    }

    .img-wrapper img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
        transition: transform 1.5s cubic-bezier(0, 0.55, 0.45, 1);
    }

    .img-wrapper:hover img {
        transform: scale(1.05);
    }

    .experience-badge-elite {
        position: absolute;
        bottom: -30px;
        right: -40px;
        background: #102EB1;
        color: #fff;
        width: 160px;
        height: 160px;
        border-radius: 50%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        border: 10px solid #fff;
        box-shadow: 0 20px 40px rgba(16, 46, 177, 0.2);
        z-index: 5;
        text-align: center;
    }

    .experience-badge-elite .num {
        font-size: 32px;
        font-weight: 800;
        line-height: 1;
        display: block;
    }

    .experience-badge-elite .label {
        font-size: 13px;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 1px;
        margin-top: 5px;
    }

    /* ── Badge pill ── */
    .section-badge {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: var(--badge-bg, #fff9e6);
        border-radius: 50px;
        padding: 8px 20px;
        font-size: 0.85rem;
        font-weight: 700;
        color: var(--text-dark, #050d20);
        letter-spacing: 0.05em;
        margin-bottom: 25px;
        text-transform: uppercase;
    }

    .section-badge .dot {
        width: 8px;
        height: 8px;
        background: #F8BB03;
        border-radius: 50%;
        box-shadow: 0 0 10px rgba(248, 187, 3, 0.5);
    }

    /* ── Heading ── */
    .section-heading {
        font-family: 'Fraunces', serif;
        font-size: clamp(2.4rem, 5vw, 3.2rem);
        font-weight: 800;
        line-height: 1.1;
        color: var(--text-dark, #050d20);
        margin-bottom: 25px;
    }

    .section-heading span.muted-part {
        color: #bbb;
        font-weight: 400;
    }

    .section-desc {
        color: var(--text-muted, #717383);
        font-size: 1rem;
        line-height: 1.8;
        max-width: 480px;
        margin-bottom: 50px;
    }

    /* ── Feature items (Elite Style) ── */
    .feature-item-elite {
        display: flex;
        align-items: center;
        gap: 20px;
        padding: 20px;
        border-radius: 20px;
        background: transparent;
        border: 1px solid transparent;
        transition: all 0.4s ease;
        margin-bottom: 15px;
    }

    .feature-item-elite:hover {
        background: #fff;
        border-color: rgba(16, 46, 177, 0.08);
        box-shadow: 0 15px 30px rgba(0, 0, 0, 0.03);
        transform: translateX(10px);
    }

    .feature-icon-squircle {
        width: 60px;
        height: 60px;
        border-radius: 16px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1.5rem;
        flex-shrink: 0;
        transition: all 0.4s ease;
    }

    .icon-lavender {
        background: rgba(131, 107, 237, 0.1);
        color: #836BED;
    }

    .icon-purple {
        background: rgba(246, 211, 255, 0.4);
        color: #B54ED5;
    }

    .icon-lime {
        background: rgba(239, 255, 172, 0.4);
        color: #7B8D14;
    }

    .feature-item-elite:hover .feature-icon-squircle {
        transform: rotate(-10deg) scale(1.1);
        box-shadow: 0 10px 20px rgba(0, 0, 0, 0.05);
    }

    .feature-body-elite h5 {
        font-family: 'Fraunces', serif;
        font-size: 1.15rem;
        font-weight: 700;
        margin-bottom: 5px;
        color: var(--text-dark, #050d20);
    }

    .feature-body-elite p {
        font-size: 0.95rem;
        color: var(--text-muted, #717383);
        line-height: 1.6;
        margin: 0;
    }

    /* ── Responsive ── */
    @media (max-width: 991px) {
        .image-column-elite {
            margin-bottom: 80px;
        }

        .experience-badge-elite {
            bottom: -20px;
            right: 0;
            transform: scale(0.85);
        }

        .section-heading {
            font-size: 2.5rem;
        }
    }

    @media (max-width: 767px) {
        .experience-badge-elite {
            display: none;
        }

        .img-wrapper {
            min-height: 350px;
        }
    }
}

/* ==========================================================================
   Elite Mission Section Redesign
   ========================================================================== */
.mission-elite-wrapper {
    padding: 120px 0;
    background: #fff;
    border-bottom: 1px solid rgba(0, 0, 0, 0.03);
}

.mission-header-elite {
    margin-bottom: 70px;
}

.mission-title-elite {
    font-family: 'Fraunces', serif;
    font-size: clamp(2.5rem, 5vw, 3.5rem);
    font-weight: 800;
    line-height: 1.1;
    color: var(--text-dark, #050d20);
}

.mission-title-elite span.gray-text {
    color: #bbb;
    font-weight: 400;
}

.mission-image-wrapper-elite {
    position: relative;
    border-radius: 25px;
    overflow: hidden;
    box-shadow: 0 30px 60px rgba(0, 0, 0, 0.05);
}

.mission-image-wrapper-elite img {
    width: 100%;
    transition: transform 1s ease;
}

.mission-image-wrapper-elite:hover img {
    transform: scale(1.03);
}

.mission-description-elite {
    padding: 0 30px;
}

.mission-description-elite .lead-text {
    font-size: 22px;
    color: #102EB1;
    font-weight: 700;
    line-height: 1.4;
    margin-bottom: 30px;
    font-family: 'Fraunces', serif;
}

.mission-description-elite .disc {
    font-size: 18px;
    line-height: 1.8;
    color: var(--text-muted, #717383);
}

/* Elite Stats Integration */
.mission-stats-bar-elite {
    display: flex;
    justify-content: space-between;
    margin-top: 100px;
    padding: 60px;
    background: #fff;
    border-radius: 30px;
    border: 1px solid rgba(16, 46, 177, 0.08);
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.02);
}

.stat-item-elite {
    text-align: center;
    flex: 1;
    position: relative;
}

.stat-item-elite:not(:last-child)::after {
    content: '';
    position: absolute;
    right: 0;
    top: 20%;
    height: 60%;
    width: 1px;
    background: linear-gradient(to bottom, transparent, rgba(0, 0, 0, 0.05), transparent);
}

.stat-item-elite .num {
    display: block;
    font-size: 42px;
    font-weight: 800;
    color: #050d20;
    margin-bottom: 5px;
}

.stat-item-elite .label {
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #102EB1;
}

@media (max-width: 991px) {
    .mission-description-elite {
        padding: 0;
        margin-top: 50px;
    }

    .mission-stats-bar-elite {
        flex-wrap: wrap;
        gap: 40px;
        padding: 40px 20px;
    }

    .stat-item-elite {
        flex: 0 0 50%;
    }

    .stat-item-elite:not(:last-child)::after {
        display: none;
    }
}

@media (max-width: 576px) {
    .stat-item-elite {
        flex: 0 0 100%;
    }
}

/* ============================================================
   About Page – Cinematic Hero Banner
   ============================================================ */
.about-hero-cinematic {
    position: relative;
    width: 100%;
    height: 55vh;
    min-height: 380px;
    max-height: 580px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Full-bleed background image */
.about-hero-cinematic .bg-image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    z-index: 1;
    transform: scale(1.05);
    transition: transform 8s ease;
}

.about-hero-cinematic:hover .bg-image {
    transform: scale(1);
}

/* Black overlay */
.about-hero-cinematic .overlay-shadow {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.62);
    z-index: 2;
}

/* Glowing decorative circles */
.about-hero-cinematic .hero-deco-circle {
    position: absolute;
    border-radius: 50%;
    z-index: 3;
    pointer-events: none;
    animation: heroPulse 5s ease-in-out infinite;
}

.about-hero-cinematic .hero-deco-1 {
    width: 380px;
    height: 380px;
    background: radial-gradient(circle, rgba(16, 46, 177, 0.18) 0%, transparent 70%);
    top: -80px;
    left: -80px;
    animation-delay: 0s;
}

.about-hero-cinematic .hero-deco-2 {
    width: 300px;
    height: 300px;
    background: radial-gradient(circle, rgba(172, 197, 68, 0.14) 0%, transparent 70%);
    bottom: -60px;
    right: -40px;
    animation-delay: 2.5s;
}

@keyframes heroPulse {

    0%,
    100% {
        opacity: 0.7;
        transform: scale(1);
    }

    50% {
        opacity: 1;
        transform: scale(1.12);
    }
}

/* Content wrapper */
.about-hero-cinematic .hero-left-v5 {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
}

/* Breadcrumb inside the banner */
.about-banner-breadcrumb {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 18px;
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: rgba(255, 255, 255, 0.7);
}

.about-banner-breadcrumb a {
    color: rgba(255, 255, 255, 0.7);
    text-decoration: none;
    transition: color 0.3s;
}

.about-banner-breadcrumb a:hover {
    color: #ACC544;
}

.about-banner-breadcrumb .sep {
    font-size: 9px;
    color: rgba(255, 255, 255, 0.4);
}

.about-banner-breadcrumb .current {
    color: #ACC544;
}

/* Main headline */
.about-hero-cinematic .main-title {
    font-size: clamp(2.5rem, 6vw, 4.5rem);
    font-weight: 700;
    color: #ffffff;
    line-height: 1.1;
    margin-bottom: 20px;
    letter-spacing: normal;
}

/* Accent colour on "Us" */
.about-hero-cinematic .hero-highlight {
    color: #ACC544;
    position: relative;
}

/* Horizontal divider line */
.about-hero-cinematic .hero-divider {
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, #102EB1, #ACC544);
    border-radius: 4px;
    margin: 0 auto 20px;
}

/* Sub-text */
.about-banner-sub {
    font-size: clamp(0.95rem, 2vw, 1.15rem);
    color: rgba(255, 255, 255, 0.75);
    max-width: 560px;
    margin: 0 auto;
    line-height: 1.7;
}

/* Responsive */
@media (max-width: 768px) {
    .about-hero-cinematic {
        height: 50vh;
        min-height: 320px;
    }

    .about-hero-cinematic .main-title {
        font-size: clamp(2.2rem, 9vw, 3.2rem);
        letter-spacing: -1px;
    }

    .about-hero-cinematic .hero-deco-1 {
        width: 220px;
        height: 220px;
    }

    .about-hero-cinematic .hero-deco-2 {
        width: 180px;
        height: 180px;
    }
}

@media (max-width: 480px) {
    .about-hero-cinematic {
        min-height: 280px;
    }

    .about-banner-breadcrumb {
        font-size: 11px;
    }
}

/* ============================================================
   Why Choose Us – Two-Column Section (wcu-section-v1)
   ============================================================ */

.wcu-section-v1 {
    padding-top: 80px;
    padding-bottom: 80px;
    background: #fff;
}

/* ── Left: Image Column ── */
.wcu-image-wrapper {
    position: relative;
    border-radius: 14px;
    overflow: hidden;
    height: 100%;
    min-height: 460px;
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.09);
}

.wcu-main-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    display: block;
    transition: transform 0.8s ease;
}

.wcu-image-wrapper:hover .wcu-main-img {
    transform: scale(1.04);
}

/* ── Right: Content Column ── */
.wcu-content-block {
    padding-left: 24px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
}

/* Badge */
.wcu-badge {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: #f5fac8;
    color: #5a6a00;
    font-size: 12.5px;
    font-weight: 700;
    padding: 5px 14px;
    border-radius: 50px;
    margin-bottom: 18px;
    letter-spacing: 0.3px;
    width: fit-content;
}

.wcu-dot {
    width: 7px;
    height: 7px;
    background: #8a9a00;
    border-radius: 50%;
    flex-shrink: 0;
}

/* Heading */
.wcu-heading {
    font-size: clamp(1.55rem, 2.6vw, 2.2rem);
    font-weight: 800;
    color: #050d20;
    line-height: 1.25;
    margin-bottom: 14px;
    letter-spacing: -0.4px;
}

.wcu-heading-muted {
    color: #9aaa55;
    font-weight: 700;
}

/* Description */
.wcu-desc {
    font-size: 14.5px;
    color: #717383;
    line-height: 1.7;
    margin-bottom: 28px;
    max-width: 480px;
}

/* Feature list */
.wcu-features {
    display: flex;
    flex-direction: column;
    gap: 22px;
}

.wcu-feature-item {
    display: flex;
    align-items: flex-start;
    gap: 15px;
}

/* Circular lavender icon */
.wcu-icon-wrap {
    width: 44px;
    height: 44px;
    min-width: 44px;
    border-radius: 50%;
    background: rgba(172, 107, 237, 0.12);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    color: #8b5cf6;
    transition: background 0.3s ease, color 0.3s ease;
    flex-shrink: 0;
}

.wcu-feature-item:hover .wcu-icon-wrap {
    background: #8b5cf6;
    color: #fff;
}

.wcu-feature-text {
    flex: 1;
    padding-top: 2px;
}

.wcu-feature-title {
    font-size: 15px;
    font-weight: 700;
    color: #050d20;
    margin-bottom: 4px;
    line-height: 1.3;
}

.wcu-feature-desc {
    font-size: 13.5px;
    color: #717383;
    line-height: 1.6;
    margin-bottom: 0;
}

/* ── Responsive ── */
@media (max-width: 991px) {
    .wcu-section-v1 {
        padding-top: 60px;
        padding-bottom: 60px;
    }

    .wcu-content-block {
        padding-left: 0;
        padding-top: 10px;
    }

    .wcu-image-wrapper {
        min-height: 340px;
    }

    .wcu-heading {
        font-size: clamp(1.4rem, 4.5vw, 1.9rem);
    }
}

@media (max-width: 767px) {
    .wcu-section-v1 {
        padding-top: 50px;
        padding-bottom: 50px;
    }

    .wcu-image-wrapper {
        min-height: 280px;
        border-radius: 10px;
    }

    .wcu-desc {
        max-width: 100%;
    }
}

/* ============================================================
   How We Make It Happen (Our Service) Section
   ============================================================ */
.hmih-section {
    background: #ffffff;
}

.hmih-header-row {
    margin-bottom: 60px;
}

/* Badge */
.hmih-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #fff4d8;
    /* Light warm yellow tint */
    color: #1c1e22;
    font-size: 13px;
    font-weight: 700;
    padding: 6px 16px;
    border-radius: 50px;
    margin-bottom: 25px;
    letter-spacing: 0.3px;
}

.hmih-badge .dot {
    width: 6px;
    height: 6px;
    background: #000;
    border-radius: 50%;
}

/* Title */
.hmih-title {
    font-size: clamp(2.2rem, 4vw, 3.4rem);
    font-weight: 700;
    color: #050d20;
    line-height: 1.15;
    margin-bottom: 0;
    letter-spacing: -1.2px;
}

.hmih-title-muted {
    color: #8c8f99;
}

/* Description (Right side on desktop) */
.hmih-desc {
    font-size: 16px;
    color: #555;
    line-height: 1.6;
    margin-bottom: 12px;
    margin-left: auto;
    max-width: 440px;
}

/* Masonry Card Grid */
.hmih-card {
    padding: 45px 35px 40px 35px;
    border-radius: 20px;
    height: 100%;
    display: flex;
    flex-direction: column;
    min-height: 480px;
    transition: transform 0.4s ease;
}

.hmih-card:hover {
    transform: translateY(-8px);
}

/* Card Colored Backgrounds */
.hmih-card.card-purple {
    background: #e4d8fe;
}

.hmih-card.card-pink {
    background: #fad9fc;
}

.hmih-card.card-yellow {
    background: #f0f3bc;
}

/* Card Icon */
.hmih-icon {
    font-size: 32px;
    color: #050d20;
    margin-bottom: auto;
    /* Push content down if needed, or keep at top */
}

/* Card Title */
.hmih-card-title {
    font-size: 24px;
    font-weight: 700;
    color: #050d20;
    margin-bottom: 16px;
    margin-top: 50px;
    /* Space from top icon */
    letter-spacing: -0.5px;
}

/* Card Description */
.hmih-card-desc {
    font-size: 15px;
    color: #4a4d5e;
    line-height: 1.65;
    margin-bottom: 35px;
    padding-right: 10px;
}

/* Card Tags Block */
.hmih-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: auto;
    /* Force to bottom of the card */
}

.hmih-tags span {
    background: #ffffff;
    color: #050d20;
    font-size: 13px;
    font-weight: 600;
    padding: 7px 16px;
    border-radius: 6px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.02);
}

/* Responsive */
@media (max-width: 991px) {
    .hmih-desc {
        margin-left: 0;
        margin-top: 30px;
        max-width: 100%;
    }

    .hmih-header-row {
        margin-bottom: 40px;
    }

    .hmih-card {
        min-height: 420px;
        padding: 35px 25px 35px 25px;
    }
}

@media (max-width: 767px) {
    .hmih-section {
        padding-top: 60px;
        padding-bottom: 60px;
    }
}

/* ============================================================
   Why Choose Us (V2) Section
   ============================================================ */
.wcu-v2-section {
    background: #ffffff;
}

/* Image Wrapper */
.wcu-v2-image-wrap {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 30px 60px rgba(0, 0, 0, 0.05);
    height: 100%;
}

.wcu-v2-image-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

/* Right Content */
.wcu-v2-content {
    padding-left: 65px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
}

.wcu-v2-content .pre {
    background: rgba(2, 91, 57, 0.05);
    color: var(--color-primary);
    padding: 6px 18px;
    border-radius: 50px;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 22px;
    width: fit-content;
}

/* Title */
.wcu-v2-title {
    font-family: 'Fraunces', serif;
    font-size: clamp(2.2rem, 3.2vw, 3.5rem);
    font-weight: 800;
    color: var(--color-title);
    line-height: 1.15;
    margin-bottom: 25px;
    letter-spacing: -1px;
}

.wcu-v2-title .muted-text {
    color: #8c8f99;
}

/* Description */
.wcu-v2-desc {
    font-size: 16px;
    color: var(--color-body);
    line-height: 1.65;
    margin-bottom: 40px;
    max-width: 580px;
    font-family: var(--font-primary);
}

/* Features List */
.wcu-v2-features {
    display: flex;
    flex-direction: column;
    gap: 25px;
}

.wcu-v2-feature-item {
    display: flex;
    align-items: flex-start;
    gap: 18px;
    padding: 25px;
    background: rgba(255, 255, 255, 0.5);
    /* Glass effect base */
    border: 1px solid rgba(0, 0, 0, 0.03);
    border-radius: 18px;
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.02);
    position: relative;
    overflow: hidden;
}

.wcu-v2-feature-item::after {
    content: '';
    position: absolute;
    top: 50%;
    left: -150%;
    width: 200%;
    height: 100%;
    background: linear-gradient(120deg, transparent, rgba(255, 255, 255, 0.5), transparent);
    transform: translateY(-50%) rotate(45deg);
    transition: 0.6s ease;
    z-index: 10;
    pointer-events: none;
}

.wcu-v2-feature-item:hover::after {
    left: 100%;
}

.wcu-v2-feature-item:hover {
    transform: translateY(-8px) scale(1.04);
    /* Further slight scale increase */
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.06);
    border-color: rgba(16, 46, 177, 0.1);
    /* Subtle brand color on border */
}

/* Color Matching Glass Tints */
.wcu-v2-feature-item.glass-purple {
    background: rgba(130, 71, 229, 0.05);
    /* Soft purple tint */
    border-color: rgba(130, 71, 229, 0.08);
}

.wcu-v2-feature-item.glass-purple:hover {
    background: rgba(130, 71, 229, 0.12);
    border-color: rgba(130, 71, 229, 0.3);
}

.wcu-v2-feature-item.glass-pink {
    background: rgba(227, 79, 214, 0.05);
    /* Soft pink tint */
    border-color: rgba(227, 79, 214, 0.08);
}

.wcu-v2-feature-item.glass-pink:hover {
    background: rgba(227, 79, 214, 0.12);
    border-color: rgba(227, 79, 214, 0.3);
}

.wcu-v2-feature-item.glass-blue {
    background: rgba(16, 46, 177, 0.05);
    /* Soft blue tint */
    border-color: rgba(16, 46, 177, 0.08);
}

.wcu-v2-feature-item.glass-blue:hover {
    background: rgba(16, 46, 177, 0.12);
    border-color: rgba(16, 46, 177, 0.3);
}

/* Icons */
.wcu-v2-feature-item .icon-wrap {
    width: 50px;
    height: 50px;
    min-width: 50px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
}

.wcu-v2-feature-item .icon-purple {
    background: #ebdffd;
    color: #8247e5;
}

.wcu-v2-feature-item .icon-pink {
    background: #fce1fc;
    color: #e34fd6;
}

.wcu-v2-feature-item .icon-blue {
    background: rgba(2, 91, 57, 0.1);
    color: #025b39;
}

/* Feature Text */
.wcu-v2-feature-item .feature-text {
    flex: 1;
}

.wcu-v2-feature-item .feature-text h5 {
    font-size: 18px;
    font-weight: 700;
    color: #050d20;
    margin-bottom: 8px;
    letter-spacing: -0.3px;
}

.wcu-v2-feature-item .feature-text p {
    font-size: 15px;
    color: #555;
    line-height: 1.6;
    margin-bottom: 0;
}

/* Responsive */
@media (max-width: 991px) {
    .wcu-v2-content {
        padding-left: 25px;
        margin-top: 30px;
    }

    .wcu-v2-image-wrap img {
        min-height: 400px;
    }
}

@media (max-width: 767px) {
    .wcu-v2-section {
        padding-top: 60px;
        padding-bottom: 60px;
    }
}

/* ============================================================
   Client Stats Banner Section
   ============================================================ */
.stats-banner-inner {
    background: transparent;
    padding: 20px 0;
    position: relative;
    z-index: 1;
}

.stats-col {
    position: relative;
    border-right: none;
}

/* Dynamic smooth divider tailored for light background */
.stats-col:not(:last-child)::after {
    content: '';
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    width: 1px;
    height: 60%;
    background: linear-gradient(to bottom, transparent, rgba(0, 0, 0, 0.1), transparent);
}

.stat-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 15px 30px;
}

.stat-number {
    font-size: clamp(3.2rem, 5vw, 4.8rem);
    font-weight: 800;
    color: #050d20;
    margin-bottom: 8px;
    line-height: 1;
    font-family: var(--font-primary);
}

.stat-text {
    font-size: 15px;
    color: #444;
    line-height: 1.5;
    margin-bottom: 0;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1.5px;
}

/* Responsive Styles */
@media (max-width: 991px) {
    .stats-col:not(:last-child)::after {
        display: none;
    }

    .stats-col {
        border-right: none;
        position: relative;
        padding-bottom: 30px;
        margin-bottom: 30px;
    }

    .stats-col:not(:last-child)::before {
        content: '';
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
        width: 30%;
        height: 1px;
        background: linear-gradient(to right, transparent, rgba(0, 0, 0, 0.1), transparent);
    }

    .stats-col.border-none {
        border-bottom: none;
        padding-bottom: 0;
        margin-bottom: 0;
    }
}

/* Custom Mobile Menu Redesign (Smooth & Accessible) */
.overlay-bg-premium {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: rgba(5, 13, 32, 0.6);
    z-index: 999;
    opacity: 0;
    visibility: hidden;
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
    backdrop-filter: blur(4px);
}

.overlay-bg-premium.active {
    opacity: 1;
    visibility: visible;
}



/* ============================================================
   Elite Global Layout & Box-Sizing Correctness
   ============================================================ */
*,
*::before,
*::after {
    box-sizing: border-box !important;
}

.rts-trusted-solutions-area,
.rts-bento-grid-area {
    position: relative;
    overflow: hidden;
}

.rts-trusted-solutions-area {
    background: #fff;
}

.elite-status-badge {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    background: rgba(16, 46, 177, 0.05);
    padding: 10px 22px;
    border-radius: 100px;
    margin-bottom: 25px;
}

.elite-status-badge i {
    color: #f8bb03;
    font-size: 14px;
}

.elite-status-badge span {
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #102EB1;
}

.title-premium {
    font-size: clamp(2.2rem, 4vw, 3.8rem);
    font-weight: 800;
    color: var(--color-title);
    line-height: 1.1;
    margin-bottom: 25px;
    font-family: 'Fraunces', serif;
}

.disc-pro {
    font-size: 17px;
    color: var(--color-body);
    line-height: 1.6;
    margin-bottom: 20px;
    font-family: var(--font-primary);
}

.disc-pro.small {
    font-size: 15px;
    color: #666;
}

/* Perfection Box V2 (Vertical Grid Cards) */
.perfection-box-v2 {
    background: #F9F9FB;
    padding: 30px 25px;
    border-radius: 15px;
    border: 1px solid #eee;
    height: 100%;
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
    position: relative;
}

.perfection-box-v2:hover {
    background: #fff;
    box-shadow: 0 20px 40px rgba(2, 91, 57, 0.06);
    transform: translateY(-8px);
    border-color: #025b39;
}

.icon-orb-v2 {
    width: 55px;
    height: 55px;
    background: #fff;
    color: #025b39;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    margin-bottom: 20px;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.03);
}

.box-title-v2 {
    font-size: 17px;
    font-weight: 800;
    margin-bottom: 12px;
    color: var(--color-title);
    font-family: 'Fraunces', serif;
}

.box-disc-v2 {
    font-size: 14.5px;
    color: var(--color-body);
    line-height: 1.6;
    margin: 0;
    font-family: var(--font-secondary);
}

/* Refined Image Side */
.pro-portrait-view-refined.wide-aspect {
    aspect-ratio: 21 / 9;
    width: 100%;
}

.pro-portrait-view-refined.wide-aspect.smaller {
    max-height: 450px;
    border-radius: 20px;
}

.main-portrait-wide {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.main-portrait {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.shimmer-overlay-v2 {
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    animation: shimmerProV2 6s infinite ease-in-out;
}

@keyframes shimmerProV2 {
    0% {
        left: -100%;
    }

    50%,
    100% {
        left: 100%;
    }
}

.floating-trust-pill-v2 {
    position: absolute;
    bottom: 30px;
    left: 20px;
    background: #fff;
    padding: 12px 25px;
    border-radius: 100px;
    display: flex;
    align-items: center;
    gap: 15px;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.12);
    z-index: 5;
    border: 1px solid rgba(0, 0, 0, 0.03);
}

.icon-circle-v2 {
    width: 32px;
    height: 32px;
    background: #acc544;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    flex-shrink: 0;
}

.pill-context strong {
    display: block;
    font-size: 14px;
    font-weight: 800;
    color: #050d20;
    line-height: 1.2;
}

.pill-context span {
    display: block;
    font-size: 12px;
    color: #777;
    font-weight: 600;
    line-height: 1;
}

.structural-accent {
    position: absolute;
    width: 200px;
    height: 200px;
    border-radius: 50%;
    filter: blur(60px);
    z-index: 1;
    opacity: 0.1;
}

.accent-one {
    background: #102EB1;
    top: -30px;
    right: -30px;
}

.accent-two {
    background: #acc544;
    bottom: -30px;
    left: -30px;
}

/* Elite Floating Product Shot (Layered Depth) */
.floating-product-shot {
    position: absolute;
    bottom: -40px;
    right: -30px;
    width: 320px;
    background: #fff;
    padding: 15px;
    border-radius: 20px;
    box-shadow: 0 40px 80px rgba(16, 46, 177, 0.12);
    z-index: 10;
    transition: all 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    border: 1px solid rgba(16, 46, 177, 0.05);
}

.floating-product-shot:hover {
    transform: translateY(-15px) rotate(2deg);
    box-shadow: 0 50px 100px rgba(16, 46, 177, 0.18);
}

.product-shot-img {
    width: 100%;
    height: auto;
    border-radius: 12px;
}

@media (max-width: 991px) {
    .floating-product-shot {
        width: 250px;
        bottom: -20px;
        right: 0;
    }
}

@media (max-width: 767px) {
    .floating-product-shot {
        position: relative;
        width: 100%;
        bottom: 0;
        right: 0;
        margin-top: 30px;
    }
}

@media (max-width: 991px) {
    .rts-trusted-solutions-area {
        padding-bottom: 70px;
    }

    .floating-trust-pill-v2 {
        bottom: 20px;
        left: 10px;
        padding: 10px 20px;
    }

    .perfection-box-v2 {
        margin-bottom: 20px;
    }
}

/* ============================================================
   Elite Bento Grid (Gallery Perspective)
   ============================================================ */
.rts-bento-grid-area {
    padding: 0 5%;
    background: #fff;
    overflow: hidden;
}

.bento-p-item {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    height: 380px;
    background: #050d20;
    transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.bento-p-item.hero {
    height: 500px;
}

.bento-p-bg {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 1.2s ease;
    opacity: 0.85;
}

.bento-p-overlay {
    position: absolute;
    inset: 0;
    background: none;
    transition: 0.5s;
}

.bento-p-content {
    position: absolute;
    bottom: 30px;
    left: 30px;
    right: 30px;
    z-index: 5;
}

.bento-p-badge {
    display: inline-block;
    background: var(--color-primary);
    color: #fff;
    padding: 6px 16px;
    border-radius: 100px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 20px;
    transform: translateY(10px);
    opacity: 0;
    transition: 0.4s 0.1s;
    font-family: var(--font-primary);
}

.bento-p-title {
    font-family: 'Fraunces', serif;
    color: #fff;
    font-size: 28px;
    font-weight: 800;
    line-height: 1.1;
    margin: 0;
    transform: translateY(10px);
    opacity: 0;
    transition: 0.4s 0.2s;
}

.bento-p-title.small {
    font-size: 20px;
}

.bento-p-footer {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding-top: 20px;
    margin-top: 20px;
    display: flex;
    align-items: center;
    gap: 15px;
}

.bento-p-date {
    font-size: 13px;
    color: rgba(255, 255, 255, 0.6);
    font-weight: 600;
}

/* Hover States */
.bento-p-item:hover {
    transform: scale(0.98);
    box-shadow: 0 40px 80px rgba(16, 46, 177, 0.15);
}

.bento-p-item:hover .bento-p-bg {
    transform: scale(1.1);
    opacity: 0.7;
}

.bento-p-item:hover .bento-p-overlay {
    opacity: 0.9;
}

.bento-p-item:hover .bento-p-badge,
.bento-p-item:hover .bento-p-title {
    transform: translateY(0);
    opacity: 1;
}

@media (max-width: 991px) {
    .rts-bento-grid-area {
        padding: 0 20px;
    }

    .bento-p-item {
        height: 320px;
    }

    .bento-p-item.hero {
        height: 400px;
    }

    .bento-p-title {
        font-size: 22px;
    }
}

.mobile-menu-overlay-premium .close-btn:hover {
    background: #102EB1;
}

.mobile-menu-overlay-premium .close-btn:hover i {
    color: #fff !important;
    transform: rotate(90deg);
}

.mobile-submenu {
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transition: max-height 0.4s ease, opacity 0.4s ease, margin-top 0.4s ease;
}

body.no-scroll {
    overflow: hidden;
}

/* Mobile Icon adjustments */
.mobile-has-dropdown i {
    transition: transform 0.3s ease;
    font-size: 14px;
}

.mobile-has-dropdown.active>a i {
    transform: rotate(180deg);
}

/* Mobile Menu Spacing & Font Adjustments (Overrides inline styles) */
.mobile-menu-overlay-premium ul li {
    margin-bottom: 12px !important;
}

.mobile-menu-overlay-premium ul li a {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #1c1e22 !important;
    text-decoration: none !important;
    text-transform: uppercase !important;
}

.mobile-submenu li {
    margin-bottom: 10px !important;
}

.mobile-submenu li:last-child {
    margin-bottom: 0 !important;
}

.mobile-submenu li a {
    font-size: 14px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    color: #555 !important;
    display: inline-block;
    padding-top: 5px;
}

.mobile-submenu {
    padding-left: 15px !important;
    border-left: 2px solid #f0f0f0 !important;
    margin-left: 5px !important;
    margin-top: 10px !important;
}

/* Remove default click borders/outlines */
.mobile-btn-toggle,
.mobile-btn-toggle:focus,
.mobile-btn-toggle:active,
.close-btn,
.close-btn:focus,
.close-btn:active,
.mobile-menu-overlay-premium a:focus,
.mobile-menu-overlay-premium a:active {
    outline: none !important;
    box-shadow: none !important;
    border: none !important;
    -webkit-tap-highlight-color: transparent;
}

/* ============================================================
/* ============================================================
   Elite Template-Friendly Footer (Imperial Green)
   ============================================================ */
.rts-footer-one {
    background: #ffffff;
    position: relative;
    overflow: hidden;
    border-top: 1px solid #e2ece6;
}

/* Reduce top gap for a more compact footer */
.rts-footer-one.rts-section-gapTop {
    padding-top: 60px !important;
}

.rts-footer-one .pb--80 {
    padding-bottom: 30px !important;
}

.footer-single-wized .disc {
    color: #666;
    line-height: 1.6;
    font-size: 14px;
    margin-top: 15px;
    margin-bottom: 15px;
}

.footer-wized-wrapper {
    gap: 22px;
}

.single-footer-wized .title {
    font-size: 18px;
    font-weight: 800;
    color: #050d20 !important;
    margin-bottom: 20px;
    position: relative;
    padding-bottom: 12px;
}

.single-footer-wized .title::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 35px;
    height: 3px;
    background: #025b39;
    border-radius: 2px;
}

.footer-lists {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0px;
}

.footer-lists li a {
    color: #666 !important;
    font-size: 15px;
    font-weight: 500;
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
    text-decoration: none;
    display: inline-block;
    position: relative;
    padding: 6px 0;
}

.footer-lists li a::before {
    content: '\f105';
    font-family: 'Font Awesome 6 Pro';
    font-weight: 900;
    position: absolute;
    left: -15px;
    top: 50%;
    margin-top: -8px;
    opacity: 0;
    color: #025b39;
    transform: translateX(-10px);
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.footer-lists li a:hover {
    color: #025b39 !important;
    transform: translateX(15px);
}

.footer-lists li a:hover::before {
    opacity: 1;
    transform: translateX(0);
}

.footer-lists.contact li {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    color: #666;
    font-size: 14.5px;
    line-height: 1.5;
}

.footer-lists.contact li i {
    color: #025b39;
    font-size: 16px;
    margin-top: 4px;
}

.footer-lists.contact li a {
    color: #666 !important;
}

.footer-lists.contact li a:hover {
    color: #025b39 !important;
    padding-left: 0;
    transform: none;
}

.footer-lists.contact li a::before {
    display: none;
}

/* Social Icons Standardized */
.social-wrapper-one {
    list-style: none;
    padding: 0;
    margin: 15px 0 0 0;
    display: flex;
    gap: 12px;
}

.social-wrapper-one li a {
    width: 40px;
    height: 40px;
    background: rgba(2, 91, 57, 0.05);
    color: #025b39;
    border: 1px solid rgba(2, 91, 57, 0.1);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    transition: all 0.4s ease;
}

.social-wrapper-one li a:hover {
    background: #025b39;
    color: #fff;
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(2, 91, 57, 0.15);
}

/* Copyright Area Standardized */
.copyright-area {
    border-top: 1px solid #e2ece6;
    background: #ffffff;
    padding: 20px 0;
    margin-top: 30px;
}

.copyright-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 20px;
}

.copyright-inner .disc {
    color: #666;
    font-size: 14px;
    margin-bottom: 0;
}

.copyright-link {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    gap: 25px;
}

.copyright-link li a {
    font-size: 14px;
    color: #666 !important;
    transition: 0.3s;
}

.copyright-link li a:hover {
    color: #025b39 !important;
}

@media (max-width: 991px) {
    .footer-wized-wrapper {
        gap: 40px;
    }

    .copyright-inner {
        justify-content: center;
        text-align: center;
    }
}

@media (max-width: 767px) {
    .footer-wized-wrapper {
        flex-direction: column;
    }
}

/* ============================================================
   Elite History & Excellence (Strategic Split Grid)
   ============================================================ */
.rts-history-area {
    background: #fff;
    position: relative;
    overflow: hidden;
}

.history-content-v2 {
    padding-right: 50px;
}

.history-title-main {
    font-family: 'Fraunces', serif;
    font-size: clamp(2.5rem, 5vw, 4.2rem);
    font-weight: 800;
    color: var(--color-title);
    margin-bottom: 25px;
    line-height: 1.1;
}

.history-disc-main {
    font-size: 17px;
    color: var(--color-body);
    line-height: 1.6;
    margin-bottom: 50px;
    font-family: var(--font-primary);
}

.feature-block-history {
    margin-bottom: 35px;
}

.feature-block-history:last-child {
    margin-bottom: 0;
}

.feature-title-history {
    font-size: 22px;
    font-weight: 700;
    color: var(--color-title);
    margin-bottom: 12px;
    font-family: var(--font-primary);
}

.feature-disc-history {
    font-size: 15px;
    color: var(--color-body);
    line-height: 1.6;
    margin: 0;
    font-family: var(--font-secondary);
}

.history-image-wrapper {
    width: 100%;
    height: 100%;
}

.history-main-img {
    width: 100%;
    height: auto;
    border-radius: 20px;
    box-shadow: 0 40px 80px rgba(0, 0, 0, 0.08);
    object-fit: cover;
}

/* Product Gallery Grid Redesign */
.history-product-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    margin-top: 40px;
}

.product-item {
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    aspect-ratio: 1 / 1.1;
    border: 1px solid #eee;
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.product-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s ease;
}

.product-item:hover img {
    transform: scale(1.1);
}

.product-item:hover {
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.08);
    border-color: var(--color-primary);
    transform: translateY(-8px);
}

.product-caption {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 15px;
    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(5px);
    border-top: 1px solid rgba(2, 91, 57, 0.1);
    text-align: center;
}

.product-caption h5 {
    font-size: 14px;
    font-weight: 800;
    color: var(--color-title);
    margin: 0;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

@media (max-width: 767px) {
    .history-product-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 991px) {
    .history-content-v2 {
        padding-right: 0;
        margin-bottom: 50px;
    }
}

/* ============================================================ */
/* FINAL RESOLUTION: Mobile Drawer & Navbar Responsiveness      */
/* ============================================================ */

/* Header Container Fix (Prevents Overflow) */
header.header-probe .container-probe {
    width: 100% !important;
    max-width: 1320px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    box-sizing: border-box !important;
}

/* Base Drawer styles - Using Transform for robust hiding */
body .mobile-menu-overlay-premium {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    transform: translateX(105%) !important;
    /* Hide off-screen to the right */
    width: 350px !important;
    max-width: 85% !important;
    height: 100vh !important;
    background: #ffffff !important;
    z-index: 10000 !important;
    padding: 60px 30px 40px !important;
    box-shadow: -10px 0 50px rgba(0, 0, 0, 0.15) !important;
    transition: transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), visibility 0s 0.4s !important;
    visibility: hidden !important;
    overflow-y: auto !important;
    display: flex !important;
    flex-direction: column !important;
}

body .mobile-menu-overlay-premium.active {
    transform: translateX(0) !important;
    visibility: visible !important;
    transition: transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), visibility 0s !important;
}

/* Background Overlay behind Drawer */
body .overlay-bg-premium {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    background: rgba(5, 13, 32, 0.8) !important;
    backdrop-filter: blur(5px) !important;
    z-index: 9999 !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transition: opacity 0.4s ease !important;
}

body .overlay-bg-premium.active {
    opacity: 1 !important;
    visibility: visible !important;
}

/* Close Button Override */
body .mobile-menu-overlay-premium .close-btn {
    position: absolute !important;
    top: 25px !important;
    right: 25px !important;
    width: 40px !important;
    height: 40px !important;
    background: rgba(2, 91, 57, 0.05) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 18px !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    z-index: 10001 !important;
}

body .mobile-menu-overlay-premium .close-btn:hover {
    background: #025b39 !important;
    transform: rotate(90deg) !important;
}

body .mobile-menu-overlay-premium .close-btn i {
    color: #025b39 !important;
    transition: all 0.3s ease !important;
}

body .mobile-menu-overlay-premium .close-btn:hover i {
    color: #fff !important;
}

/* Mobile Drawer Premium Styling Updates */
body .mobile-menu-overlay-premium ul li a:hover {
    color: #025B39 !important;
}

body .mobile-menu-overlay-premium .mobile-has-dropdown.active>a {
    color: #025B39 !important;
}

body .mobile-menu-overlay-premium .mobile-has-dropdown.active>a i {
    transform: rotate(180deg);
    color: #025B39 !important;
}

body .mobile-menu-overlay-premium .mobile-contact-info a:hover span {
    color: #025B39 !important;
}

body .mobile-menu-overlay-premium .mobile-contact-info .icon {
    background: rgba(2, 91, 57, 0.08) !important;
    color: #025B39 !important;
}

body .mobile-menu-overlay-premium .mobile-contact-info a:hover .icon {
    background: #025B39 !important;
    color: #ffffff !important;
}

body .mobile-menu-overlay-premium .mobile-submenu li a:hover {
    color: #025B39 !important;
    padding-left: 5px;
}

/* Responsive Header rules */
@media screen and (max-width: 1199px) {

    .nav-area-probe,
    .desktop-contact-info {
        display: none !important;
    }

    body .btn-probe,
    body .button-wrapper-flex .rts-btn {
        display: flex !important;
        /* Force visible */
    }

    .mobile-btn-toggle,
    .menu-btn-toggle {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: relative !important;
        z-index: 1001 !important;
    }
}

@media screen and (max-width: 768px) {
    header.header-probe .container-probe {
        padding: 0 12px !important;
    }

    .logo-area-probe img {
        height: 26px !important;
    }

    body .btn-probe,
    body .button-wrapper-flex .rts-btn {
        display: flex !important;
        /* Force visible */
        white-space: nowrap !important;
    }

    body .mobile-menu-overlay-premium {
        width: 100% !important;
        max-width: 100% !important;
    }

    .button-wrapper-flex {
        gap: 10px !important;
        /* Tighter gap on mobile */
    }
}

@media screen and (max-width: 480px) {
    .button-wrapper-flex {
        gap: 8px !important;
    }

    .logo-area-probe img,
    .logo-area img {
        height: 24px !important;
    }
}

/* Mobile Toggle Icon Force Visible */
.mobile-btn-toggle {
    width: 42px !important;
    height: 42px !important;
    background: rgba(2, 91, 57, 0.08) !important;
    color: #025b39 !important;
    display: none;
    /* Hidden on desktop by default */
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    font-size: 22px;
    cursor: pointer !important;
}

/* Helper class for body lock */
body.no-scroll {
    overflow: hidden !important;
    height: 100vh !important;
}

header.header-probe {
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    z-index: 1500 !important;
}

/* ============================================================
   Ultra-Premium Eye-Catching Footer Design v2
   ============================================================ */
.rts-footer-premium {
    background: #ffffff !important;
    border-top: 4px solid #025b39;
    padding-top: 90px;
    position: relative;
    z-index: 10;
    overflow: hidden;
}

/* Subtle decorative background accent */
.rts-footer-premium::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: radial-gradient(ellipse at 0% 0%, rgba(2, 91, 57, 0.03) 0%, transparent 60%),
        radial-gradient(ellipse at 100% 100%, rgba(2, 91, 57, 0.02) 0%, transparent 55%);
    pointer-events: none;
    z-index: 0;
}

.rts-footer-premium .container {
    position: relative;
    z-index: 1;
}

.rts-footer-premium *:not(i):not([class*="fa-"]) {
    font-family: 'Cairo', sans-serif !important;
}

.rts-footer-premium i,
.rts-footer-premium i::before,
.rts-footer-premium i::after,
.rts-footer-premium [class*="fa-"],
.rts-footer-premium [class*="fa-"]::before,
.rts-footer-premium [class*="fa-"]::after {
    font-family: 'Font Awesome 6 Pro' !important;
}

/* Brands icons need their own font-family */
.rts-footer-premium .fa-brands,
.rts-footer-premium .fab,
.rts-footer-premium .fa-brands::before,
.rts-footer-premium .fab::before {
    font-family: 'Font Awesome 6 Brands' !important;
}

/* Footer Widget Base */
.footer-widget {
    padding-bottom: 10px;
}

.brand-widget {
    padding-right: 10px;
}

/* Footer Title with animated underline */
.rts-footer-premium .footer-title {
    font-size: 18px;
    font-weight: 800;
    color: #050D20;
    margin-bottom: 38px;
    position: relative;
    line-height: 1.3;
    padding-bottom: 16px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.rts-footer-premium .footer-title::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 40px;
    height: 3px;
    background: #025b39;
    border-radius: 10px;
    transition: width 0.4s ease;
}

.rts-footer-premium .footer-title::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 44px;
    width: 8px;
    height: 3px;
    background: rgba(2, 91, 57, 0.3);
    border-radius: 10px;
}

.footer-widget:hover .footer-title::before {
    width: 55px;
}

/* Footer Logo & Brand Widget Alignment */
.brand-widget {
    padding-right: 0;
}

.footer-logo {
    display: flex;
    align-items: center;
    height: 40px;
    /* Matches the baseline of footer titles */
    margin-bottom: 25px !important;
    /* Matches footer-title baseline */
    transition: opacity 0.3s ease;
}

.footer-logo:hover {
    opacity: 0.85;
}

/* Footer Description */
.rts-footer-premium .footer-desc {
    color: #717383;
    font-size: 15px;
    line-height: 1.85;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* Social Links Premium */
.social-links-premium {
    display: flex;
    gap: 12px;
    margin-top: 30px;
    flex-wrap: wrap;
}

.social-links-premium .social-icon {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f4f7f5;
    color: #050D20;
    font-size: 15px;
    transition: all 0.35s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    border: 1px solid #e8efe9;
    text-decoration: none;
}

.social-links-premium .social-icon:hover {
    background: #025b39 !important;
    color: #ffffff !important;
    transform: translateY(-4px) scale(1.08);
    box-shadow: 0 8px 18px rgba(2, 91, 57, 0.22);
    border-color: #025b39 !important;
}

/* Footer Lists */
.footer-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-list li {
    margin-bottom: 0;
    border-bottom: 1px solid #f4f6f4;
}

.footer-list li:last-child {
    border-bottom: none;
}

.footer-list li a {
    color: #555e6c;
    font-size: 14.5px;
    font-weight: 600;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 0;
    text-decoration: none;
}

.footer-list li a::before {
    content: '';
    width: 6px;
    height: 6px;
    background: #025b39;
    border-radius: 50%;
    flex-shrink: 0;
    opacity: 0;
    transform: scale(0);
    transition: all 0.3s ease;
}

.footer-list li a:hover {
    color: #025b39;
    padding-left: 6px;
}

.footer-list li a:hover::before {
    opacity: 1;
    transform: scale(1);
}

/* Contact Info List */
.contact-info-list {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.contact-item {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 13px 0;
    border-bottom: 1px solid #f0f4f0;
    transition: all 0.3s ease;
}

.contact-item:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.contact-item:first-child {
    padding-top: 0;
}

.contact-item:hover {
    padding-left: 4px;
}

.contact-item .icon-square {
    width: 40px;
    height: 40px;
    background: rgba(2, 91, 57, 0.07);
    color: #025b39;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    flex-shrink: 0;
    border: 1px solid rgba(2, 91, 57, 0.12);
    transition: all 0.3s ease;
    margin-top: 2px;
}

.contact-item:hover .icon-square {
    background: #025b39;
    color: #fff;
    transform: scale(1.08) rotate(-3deg);
    box-shadow: 0 6px 15px rgba(2, 91, 57, 0.2);
}

.contact-item span,
.contact-item a {
    color: #2d3748;
    font-size: 14.5px;
    font-weight: 600;
    line-height: 1.55;
    text-decoration: none;
    transition: color 0.3s ease;
}

.contact-item a:hover {
    color: #025b39;
}

/* Footer Bottom Bar */
.footer-bottom-premium {
    padding: 22px 0;
    border-top: 1px solid #edf0eb;
    margin-top: 0;
    background: #f8faf8;
    text-align: center;
}

/* Footer column content bottom padding */
.rts-footer-premium>.container {
    padding-bottom: 20px;
}

.copyright-text {
    font-size: 15px;
    color: #717383;
    margin: 0;
}

.brand-name {
    color: #025b39;
    font-weight: 700;
}

.footer-bottom-links {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    gap: 25px;
    justify-content: flex-end;
}

.footer-bottom-links li a {
    font-size: 14px;
    color: #717383;
    font-weight: 600;
    transition: color 0.3s ease;
}

.footer-bottom-links li a:hover {
    color: #025b39;
}

/* Responsive Styles */
@media (max-width: 1199px) {
    .brand-widget {
        padding-right: 0;
    }
}

@media (max-width: 991px) {
    .rts-footer-premium {
        padding-top: 65px;
    }

    .footer-bottom-links {
        justify-content: flex-start;
        margin-top: 12px;
    }

    .copyright-text {
        text-align: left;
    }

    .footer-bottom-premium {
        margin-top: 40px;
        padding: 20px 0;
    }

    .rts-footer-premium .footer-desc {
        max-width: 100%;
    }
}

@media (max-width: 767px) {
    .rts-footer-premium {
        padding-top: 55px;
    }

    .footer-widget {
        text-align: left;
    }

    .rts-footer-premium .footer-title {
        font-size: 16px;
        margin-bottom: 30px;
    }

    .rts-footer-premium .footer-title::before {
        left: 0;
        transform: none;
    }

    .social-links-premium {
        justify-content: flex-start;
    }

    .contact-item {
        flex-direction: row;
        align-items: flex-start;
    }

    .footer-desc {
        margin: 20px 0 !important;
        max-width: 100% !important;
    }

    .footer-bottom-premium {
        margin-top: 30px;
    }

    .footer-bottom-links {
        gap: 15px;
    }

    .footer-bottom-links li a {
        font-size: 13px;
    }

    .copyright-text {
        font-size: 13px;
    }
}


/* ============================================================
   Define Phone Premium Image Section UI
   ============================================================ */
.rts-define-phone-area {
    background: linear-gradient(180deg, #ffffff 0%, #f7f9f8 100%);
    position: relative;
    z-index: 1;
}

.pre-define {
    display: inline-block;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    color: #ffffff;
    background: #025b39;
    padding: 6px 16px;
    border-radius: 30px;
    letter-spacing: 1px;
    margin-bottom: 20px;
}

.title-define-premium {
    font-family: 'Fraunces', serif;
    font-size: 48px;
    font-weight: 800;
    color: #050d20;
    line-height: 1.2;
    margin-bottom: 25px;
}

.title-define-premium .highlight {
    color: #025b39;
    position: relative;
    display: inline-block;
}

.disc-define-premium {
    font-size: 18px;
    line-height: 1.8;
    display: none;
    color: #4a5568;
    max-width: 90%;
    margin: 0 auto;
}

.disc-define-premium strong {
    font-weight: 700;
}

.define-image-wrapper-premium {
    position: relative;
    border-radius: 20px;
    box-shadow: 0 40px 100px rgba(2, 91, 57, 0.08), 0 10px 30px rgba(0, 0, 0, 0.05);
    overflow: hidden;
    background: #fff;
    border: 1px solid rgba(2, 91, 57, 0.05);
}

.define-main-img {
    width: 100%;
    height: auto;
    object-fit: cover;
}

/* Responsive Fixes */
@media (max-width: 991px) {
    .title-define-premium {
        font-size: 38px;
    }

    .disc-define-premium {
        font-size: 16px;
        max-width: 100%;
    }
}

@media (max-width: 767px) {
    .title-define-premium {
        font-size: 30px;
    }
}

/* ============================================================
   X-Twitter Icon Support (Global Fix)
   ============================================================ */
.fa-x-twitter {
    position: relative;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
}

.fa-x-twitter::before {
    display: none !important;
}

.fa-x-twitter::after {
    content: '';
    display: block;
    width: 0.9em;
    height: 0.9em;
    background-color: currentColor;
    mask-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M389.2 48h70.6L305.6 224.2 487 464H345L233.7 318.6 106.5 464H35.8L200.7 275.5 26.8 48H172.4L272.9 180.9 389.2 48zM364.4 421.8h39.1L151.1 88h-42L364.4 421.8z"/></svg>');
    mask-repeat: no-repeat;
    mask-position: center;
    mask-size: contain;
    -webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M389.2 48h70.6L305.6 224.2 487 464H345L233.7 318.6 106.5 464H35.8L200.7 275.5 26.8 48H172.4L272.9 180.9 389.2 48zM364.4 421.8h39.1L151.1 88h-42L364.4 421.8z"/></svg>');
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    -webkit-mask-size: contain;
}
/* Elite Branding & Layout-Friendly Image Styles */
.history-main-img-friendly {
    width: 100% !important;
    aspect-ratio: 4 / 3 !important;
    object-fit: cover !important;
    border-radius: 20px;
    box-shadow: 0 40px 80px rgba(0,0,0,0.08);
}

/* Padding fix when content is on the right side (Image Left) */
.history-content-v2.content-right {
    padding-right: 0 !important;
    padding-left: 40px !important;
}

@media (max-width: 991px) {
    .history-content-v2.content-right {
        padding-left: 0 !important;
        text-align: center;
        margin-top: 30px;
    }
}
