/* =========================================================
   Mukoun Home Page — Arabic RTL Fix
   File: public/assets/css/home-rtl-fix.css
========================================================= */

.home-page {
    width: 100%;
    overflow-x: clip;
}

.home-page--rtl {
    direction: rtl;
    text-align: right;
}

.home-page--ltr {
    direction: ltr;
    text-align: left;
}

/* Hero */
.home-page--rtl .home-hero .title-area-left,
.home-page--rtl .home-hero .bg-title-home {
    direction: rtl !important;
    unicode-bidi: isolate !important;
    text-align: right !important;
}

.home-page--rtl .home-hero .title-area-left {
    margin-right: 0 !important;
    margin-left: auto !important;
}

/* About section */
.home-page--rtl .about-inner-content-two,
.home-page--rtl .about-between-wrapper,
.home-page--rtl .title-style-two.left {
    direction: rtl !important;
    text-align: right !important;
}

.home-page--rtl .about-between-wrapper .disc {
    direction: rtl !important;
    unicode-bidi: plaintext !important;
    text-align: right !important;
    line-height: 2 !important;
}

/*
 * Arabic headings must not use the theme text-splitting animation.
 * The animation splits Arabic into spans and reverses/disconnects letters.
 */
.home-page--rtl .home-arabic-title {
    direction: rtl !important;
    unicode-bidi: isolate !important;
    text-align: inherit !important;
    display: block !important;
    font-family: "Tajawal", "Cairo", Tahoma, Arial, sans-serif !important;
    letter-spacing: 0 !important;
    word-spacing: normal !important;
    line-height: 1.35 !important;
    white-space: normal !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.home-page--rtl .home-arabic-title span,
.home-page--rtl .home-arabic-title .split-line,
.home-page--rtl .home-arabic-title .char,
.home-page--rtl .home-arabic-title .word {
    direction: rtl !important;
    unicode-bidi: isolate !important;
    display: inline !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* Projects slider: keep Swiper engine LTR, but card content RTL */
.home-page--rtl .mySwiperh1_team {
    direction: ltr !important;
}

.home-page--rtl .mySwiperh1_team .swiper-slide {
    direction: ltr !important;
}

.home-page--rtl .mySwiperh1_team .single-details {
    direction: rtl !important;
    text-align: right !important;
}

.home-page--rtl .mySwiperh1_team .single-details .title,
.home-page--rtl .mySwiperh1_team .single-details p,
.home-page--rtl .mukoun-project-summary {
    direction: rtl !important;
    unicode-bidi: plaintext !important;
    text-align: right !important;
}

.home-page--rtl .mySwiperh1_team .single-details .title {
    font-family: "Tajawal", "Cairo", Tahoma, Arial, sans-serif !important;
    letter-spacing: 0 !important;
    line-height: 1.5 !important;
}

.home-page--rtl .mukoun-project-summary {
    line-height: 1.9 !important;
}

/* Values and statistics */
.home-page--rtl .signle-fun-facts-one {
    direction: rtl !important;
    text-align: center !important;
}

.home-page--rtl .signle-fun-facts-one .title,
.home-page--rtl .signle-fun-facts-one .bototm {
    direction: rtl !important;
    unicode-bidi: plaintext !important;
}

/* Partners */
.home-page--rtl .partners-showcase,
.home-page--rtl .partners-showcase .banner-one-inner {
    direction: rtl !important;
    text-align: center !important;
}

.home-page--rtl .partners-showcase .banner-para {
    direction: rtl !important;
    unicode-bidi: plaintext !important;
    text-align: center !important;
}

/* Mobile */
@media (max-width: 767.98px) {
    .home-page--rtl .home-hero .title-area-left,
    .home-page--rtl .about-inner-content-two,
    .home-page--rtl .about-between-wrapper,
    .home-page--rtl .title-style-two.left {
        text-align: right !important;
    }

    .home-page--rtl .home-arabic-title {
        line-height: 1.45 !important;
    }
}


/* =========================================================
   Mukoun Home Page
   RTL/LTR project cards + localized counters
========================================================= */

/* Localized counter number and + order */
.mukoun-counter-value {
    display: inline-flex !important;
    align-items: baseline !important;
    justify-content: center !important;
    gap: 2px !important;
    direction: ltr !important;
    unicode-bidi: isolate !important;
    white-space: nowrap !important;
}

.mukoun-localized-counter,
.mukoun-counter-plus {
    display: inline-block !important;
    direction: ltr !important;
    unicode-bidi: isolate !important;
}

.mukoun-counter-plus {
    font-size: 0.72em !important;
    font-weight: 800 !important;
}

/* Project card direction */
.mukoun-home-page[dir="rtl"] .single-details,
.mukoun-home-page[dir="rtl"] .single-details .title,
.mukoun-home-page[dir="rtl"] .single-details p {
    direction: rtl !important;
    text-align: right !important;
}

.mukoun-home-page[dir="ltr"] .single-details,
.mukoun-home-page[dir="ltr"] .single-details .title,
.mukoun-home-page[dir="ltr"] .single-details p {
    direction: ltr !important;
    text-align: left !important;
}

/* Facts labels */
.mukoun-home-page .signle-fun-facts-one .bototm {
    display: block;
    text-align: center;
}

/* Project summary */
.mukoun-home-page .mukoun-project-summary {
    position: relative !important;
    margin-top: 22px !important;
    line-height: 1.95 !important;
    unicode-bidi: isolate !important;
}

/* Remove any duplicate red line generated by older CSS */
.mukoun-home-page .mukoun-project-summary::before,
.mukoun-home-page .mukoun-project-summary::after {
    content: none !important;
    display: none !important;
}

/* Arabic: one red line on the right */
.mukoun-home-page[dir="rtl"] .mukoun-project-summary {
    border-right: 3px solid #d62927 !important;
    border-left: 0 !important;
    padding-right: 18px !important;
    padding-left: 0 !important;
    direction: rtl !important;
    text-align: right !important;
}

/* English: one red line on the left */
.mukoun-home-page[dir="ltr"] .mukoun-project-summary {
    border-left: 3px solid #d62927 !important;
    border-right: 0 !important;
    padding-left: 18px !important;
    padding-right: 0 !important;
    direction: ltr !important;
    text-align: left !important;
}

/* Keep project measurements readable */
.mukoun-project-summary__num {
    direction: ltr !important;
    unicode-bidi: isolate !important;
    white-space: nowrap !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   MUKOUN TYPOGRAPHY STANDARD — TAJAWAL
   Source: Mukoun_Tajawal_Typography_Guide_AR.md
   Scope: Home page only

   IMPORTANT:
   - Typography only.
   - No changes to layout, colors, images, borders, shadows or spacing.
   - Arabic and English use Tajawal with language-specific sizing/line-height.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Base font
   -------------------------------------------------------------------------- */

.mukoun-home-page,
.mukoun-home-page button,
.mukoun-home-page input,
.mukoun-home-page select,
.mukoun-home-page textarea {
    font-family: "Tajawal", Arial, sans-serif !important;
    font-synthesis: none !important;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.mukoun-home-page h1,
.mukoun-home-page h2,
.mukoun-home-page h3,
.mukoun-home-page h4,
.mukoun-home-page h5,
.mukoun-home-page h6,
.mukoun-home-page p,
.mukoun-home-page span,
.mukoun-home-page a,
.mukoun-home-page li,
.mukoun-home-page strong {
    font-family: inherit !important;
}

/* Arabic must not inherit Latin letter spacing or text-transform. */
.mukoun-home-page[dir="rtl"] h1,
.mukoun-home-page[dir="rtl"] h2,
.mukoun-home-page[dir="rtl"] h3,
.mukoun-home-page[dir="rtl"] h4,
.mukoun-home-page[dir="rtl"] h5,
.mukoun-home-page[dir="rtl"] h6,
.mukoun-home-page[dir="rtl"] p,
.mukoun-home-page[dir="rtl"] span,
.mukoun-home-page[dir="rtl"] a {
    letter-spacing: 0 !important;
}

/* --------------------------------------------------------------------------
   Hero title
   -------------------------------------------------------------------------- */

/* English */
.mukoun-home-page[dir="ltr"] .home-hero .bg-title-home {
    font-size: clamp(5.2rem, 3.15rem + 4.8vw, 8.5rem) !important;
    line-height: 1.02 !important;
    font-weight: 900 !important;
}

/* Arabic */
.mukoun-home-page[dir="rtl"] .home-hero .bg-title-home {
    font-size: clamp(5.35rem, 3.25rem + 4.9vw, 8.8rem) !important;
    line-height: 1.22 !important;
    font-weight: 900 !important;
}

/* Hero button follows the brand small-heading/button weight. */
.mukoun-home-page .home-hero .transparent-btn {
    font-family: inherit !important;
    font-size: 15px !important;
    font-weight: 700 !important;
}

/* --------------------------------------------------------------------------
   Eyebrow / pre-title
   -------------------------------------------------------------------------- */

.mukoun-home-page .title-style-two .pre,
.mukoun-home-page .partners-showcase .pre-title {
    font-size: 15px !important;
    line-height: 1.35 !important;
    font-weight: 800 !important;
}

/* --------------------------------------------------------------------------
   Main section titles
   About / Projects / Partners
   -------------------------------------------------------------------------- */

/* English */
.mukoun-home-page[dir="ltr"] .about-inner-content-two .title-style-two .title,
.mukoun-home-page[dir="ltr"] .rts-team-area .title-style-two .title,
.mukoun-home-page[dir="ltr"] .partners-showcase .banner-one-inner > .title {
    font-size: clamp(4.15rem, 2.65rem + 2.45vw, 6.35rem) !important;
    line-height: 1.08 !important;
    font-weight: 900 !important;
}

/* Arabic */
.mukoun-home-page[dir="rtl"] .about-inner-content-two .title-style-two .title,
.mukoun-home-page[dir="rtl"] .rts-team-area .title-style-two .title,
.mukoun-home-page[dir="rtl"] .partners-showcase .banner-one-inner > .title {
    font-size: clamp(4.35rem, 2.78rem + 2.5vw, 6.55rem) !important;
    line-height: 1.30 !important;
    font-weight: 900 !important;
}

/* --------------------------------------------------------------------------
   Main section lead text
   -------------------------------------------------------------------------- */

/* English */
.mukoun-home-page[dir="ltr"] .about-between-wrapper .disc,
.mukoun-home-page[dir="ltr"] .partners-showcase .banner-para {
    font-size: clamp(1.72rem, 1.30rem + 0.62vw, 2.05rem) !important;
    line-height: 1.95 !important;
    font-weight: 500 !important;
}

/* Arabic */
.mukoun-home-page[dir="rtl"] .about-between-wrapper .disc,
.mukoun-home-page[dir="rtl"] .partners-showcase .banner-para {
    font-size: clamp(1.82rem, 1.38rem + 0.65vw, 2.16rem) !important;
    line-height: 2.12 !important;
    font-weight: 500 !important;
}

/* --------------------------------------------------------------------------
   Project cards
   -------------------------------------------------------------------------- */

/* Card title — English */
.mukoun-home-page[dir="ltr"] .mySwiperh1_team .single-details .title {
    font-size: clamp(2.08rem, 1.62rem + 0.38vw, 2.48rem) !important;
    line-height: 1.42 !important;
    font-weight: 800 !important;
}

/* Card title — Arabic */
.mukoun-home-page[dir="rtl"] .mySwiperh1_team .single-details .title {
    font-size: clamp(2.18rem, 1.70rem + 0.42vw, 2.58rem) !important;
    line-height: 1.58 !important;
    font-weight: 800 !important;
}

/* City / card metadata */
.mukoun-home-page .mySwiperh1_team .single-details > p:not(.mukoun-project-summary) {
    font-size: 15px !important;
    line-height: 1.55 !important;
    font-weight: 700 !important;
}

/* Card description — English */
.mukoun-home-page[dir="ltr"] .mukoun-project-summary {
    font-size: 1.54rem !important;
    line-height: 2 !important;
    font-weight: 400 !important;
}

/* Card description — Arabic */
.mukoun-home-page[dir="rtl"] .mukoun-project-summary {
    font-size: 1.62rem !important;
    line-height: 2.12 !important;
    font-weight: 400 !important;
}

/* --------------------------------------------------------------------------
   Values cards
   -------------------------------------------------------------------------- */

/* Values title — English */
.mukoun-home-page[dir="ltr"]
.rts-fun-facts-area:not(.mukoun-localized-counters)
.signle-fun-facts-one .title {
    font-size: clamp(2.08rem, 1.62rem + 0.38vw, 2.48rem) !important;
    line-height: 1.42 !important;
    font-weight: 800 !important;
}

/* Values title — Arabic */
.mukoun-home-page[dir="rtl"]
.rts-fun-facts-area:not(.mukoun-localized-counters)
.signle-fun-facts-one .title {
    font-size: clamp(2.18rem, 1.70rem + 0.42vw, 2.58rem) !important;
    line-height: 1.58 !important;
    font-weight: 800 !important;
}

/* Values description — English */
.mukoun-home-page[dir="ltr"]
.rts-fun-facts-area:not(.mukoun-localized-counters)
.signle-fun-facts-one .bototm {
    font-size: 1.54rem !important;
    line-height: 2 !important;
    font-weight: 400 !important;
}

/* Values description — Arabic */
.mukoun-home-page[dir="rtl"]
.rts-fun-facts-area:not(.mukoun-localized-counters)
.signle-fun-facts-one .bototm {
    font-size: 1.62rem !important;
    line-height: 2.12 !important;
    font-weight: 400 !important;
}

/* --------------------------------------------------------------------------
   Counters
   Keep the current visual size while enforcing the brand font hierarchy.
   -------------------------------------------------------------------------- */

.mukoun-home-page .mukoun-localized-counters .mukoun-counter-value,
.mukoun-home-page .mukoun-localized-counters .mukoun-localized-counter {
    font-family: inherit !important;
    font-weight: 900 !important;
}

.mukoun-home-page .mukoun-localized-counters .bototm {
    font-size: 15px !important;
    line-height: 1.55 !important;
    font-weight: 700 !important;
}

/* --------------------------------------------------------------------------
   Tablet
   -------------------------------------------------------------------------- */

@media (max-width: 991.98px) {
    .mukoun-home-page[dir="ltr"] .home-hero .bg-title-home,
    .mukoun-home-page[dir="rtl"] .home-hero .bg-title-home {
        font-size: clamp(4.1rem, 7vw, 6.2rem) !important;
    }

    .mukoun-home-page[dir="ltr"] .about-inner-content-two .title-style-two .title,
    .mukoun-home-page[dir="ltr"] .rts-team-area .title-style-two .title,
    .mukoun-home-page[dir="ltr"] .partners-showcase .banner-one-inner > .title,
    .mukoun-home-page[dir="rtl"] .about-inner-content-two .title-style-two .title,
    .mukoun-home-page[dir="rtl"] .rts-team-area .title-style-two .title,
    .mukoun-home-page[dir="rtl"] .partners-showcase .banner-one-inner > .title {
        font-size: clamp(3.65rem, 6vw, 5.25rem) !important;
    }

    .mukoun-home-page[dir="ltr"] .mukoun-project-summary,
    .mukoun-home-page[dir="rtl"] .mukoun-project-summary,
    .mukoun-home-page[dir="ltr"]
    .rts-fun-facts-area:not(.mukoun-localized-counters)
    .signle-fun-facts-one .bototm,
    .mukoun-home-page[dir="rtl"]
    .rts-fun-facts-area:not(.mukoun-localized-counters)
    .signle-fun-facts-one .bototm {
        font-size: 1.48rem !important;
    }
}

/* --------------------------------------------------------------------------
   Mobile
   -------------------------------------------------------------------------- */

@media (max-width: 767.98px) {
    .mukoun-home-page[dir="ltr"] .home-hero .bg-title-home,
    .mukoun-home-page[dir="rtl"] .home-hero .bg-title-home {
        font-size: clamp(3.65rem, 10.4vw, 5.15rem) !important;
    }

    .mukoun-home-page[dir="ltr"] .about-inner-content-two .title-style-two .title,
    .mukoun-home-page[dir="ltr"] .rts-team-area .title-style-two .title,
    .mukoun-home-page[dir="ltr"] .partners-showcase .banner-one-inner > .title,
    .mukoun-home-page[dir="rtl"] .about-inner-content-two .title-style-two .title,
    .mukoun-home-page[dir="rtl"] .rts-team-area .title-style-two .title,
    .mukoun-home-page[dir="rtl"] .partners-showcase .banner-one-inner > .title {
        font-size: clamp(3.25rem, 9vw, 4.45rem) !important;
    }

    .mukoun-home-page[dir="ltr"] .about-between-wrapper .disc,
    .mukoun-home-page[dir="ltr"] .partners-showcase .banner-para {
        font-size: 1.38rem !important;
        line-height: 2 !important;
    }

    .mukoun-home-page[dir="rtl"] .about-between-wrapper .disc,
    .mukoun-home-page[dir="rtl"] .partners-showcase .banner-para {
        font-size: 1.46rem !important;
        line-height: 2.12 !important;
    }

    .mukoun-home-page[dir="ltr"] .mySwiperh1_team .single-details .title,
    .mukoun-home-page[dir="ltr"]
    .rts-fun-facts-area:not(.mukoun-localized-counters)
    .signle-fun-facts-one .title {
        font-size: 1.82rem !important;
    }

    .mukoun-home-page[dir="rtl"] .mySwiperh1_team .single-details .title,
    .mukoun-home-page[dir="rtl"]
    .rts-fun-facts-area:not(.mukoun-localized-counters)
    .signle-fun-facts-one .title {
        font-size: 1.92rem !important;
    }

    .mukoun-home-page[dir="ltr"] .mukoun-project-summary,
    .mukoun-home-page[dir="ltr"]
    .rts-fun-facts-area:not(.mukoun-localized-counters)
    .signle-fun-facts-one .bototm {
        font-size: 1.36rem !important;
        line-height: 2 !important;
    }

    .mukoun-home-page[dir="rtl"] .mukoun-project-summary,
    .mukoun-home-page[dir="rtl"]
    .rts-fun-facts-area:not(.mukoun-localized-counters)
    .signle-fun-facts-one .bototm {
        font-size: 1.43rem !important;
        line-height: 2.10 !important;
    }
}

/* --------------------------------------------------------------------------
   Small mobile
   -------------------------------------------------------------------------- */

@media (max-width: 575.98px) {
    .mukoun-home-page .title-style-two .pre,
    .mukoun-home-page .partners-showcase .pre-title {
        font-size: 12px !important;
    }

    .mukoun-home-page[dir="ltr"] .home-hero .bg-title-home,
    .mukoun-home-page[dir="rtl"] .home-hero .bg-title-home {
        font-size: 3.3rem !important;
    }

    .mukoun-home-page[dir="ltr"] .about-inner-content-two .title-style-two .title,
    .mukoun-home-page[dir="ltr"] .rts-team-area .title-style-two .title,
    .mukoun-home-page[dir="ltr"] .partners-showcase .banner-one-inner > .title,
    .mukoun-home-page[dir="rtl"] .about-inner-content-two .title-style-two .title,
    .mukoun-home-page[dir="rtl"] .rts-team-area .title-style-two .title,
    .mukoun-home-page[dir="rtl"] .partners-showcase .banner-one-inner > .title {
        font-size: 3rem !important;
    }

    .mukoun-home-page[dir="ltr"] .mySwiperh1_team .single-details .title,
    .mukoun-home-page[dir="ltr"]
    .rts-fun-facts-area:not(.mukoun-localized-counters)
    .signle-fun-facts-one .title {
        font-size: 1.72rem !important;
    }

    .mukoun-home-page[dir="rtl"] .mySwiperh1_team .single-details .title,
    .mukoun-home-page[dir="rtl"]
    .rts-fun-facts-area:not(.mukoun-localized-counters)
    .signle-fun-facts-one .title {
        font-size: 1.82rem !important;
    }
}


/* =========================================================
    class ="home-hero"
========================================================= */

@media (min-width: 1600px) {

    .mukoun-home-page[dir="rtl"]
    .home-hero
    .title-area-left {
        left: auto !important;
        right: clamp(50px, 6vw, 140px) !important;

        width: min(1200px, calc(100vw - 100px)) !important;
        max-width: min(1200px, calc(100vw - 100px)) !important;

        text-align: right !important;
        direction: rtl !important;
    }

    .mukoun-home-page[dir="rtl"]
    .home-hero
    .bg-title-home {
        text-align: right !important;
        direction: rtl !important;
        margin-right: 0 !important;
        margin-left: auto !important;
    }

    .mukoun-home-page[dir="rtl"]
    .home-hero
    .transparent-btn {
        display: inline-flex !important;
        margin-right: 0 !important;
        margin-left: auto !important;
    }
}


/* =========================================================
   HOME HERO — Arabic
   تصغير العنوان + زر من نحن مباشرة أسفل نهاية الجملة
========================================================= */


/* الحاوية تأخذ نفس عرض العنوان فقط */
.mukoun-home-page[dir="rtl"]
.home-hero
.title-area-left {
    display: flex !important;
    flex-direction: column !important;

    width: fit-content !important;
    max-width: calc(100% - 40px) !important;

    margin-left: auto !important;
    margin-right: auto !important;
}


/* =========================================================
   عنوان: حيث تصبح الرؤية إلى واقع
========================================================= */

.mukoun-home-page[dir="rtl"]
.home-hero
.bg-title-home {
    width: fit-content !important;
    max-width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    font-family: "Tajawal", Arial, sans-serif !important;

    font-weight: 900 !important;
    line-height: 1.25 !important;

    direction: rtl !important;
    text-align: right !important;

    letter-spacing: 0 !important;
}


/* =========================================================
   زر من نحن
   مباشرة تحت الطرف الأيسر من الجملة
========================================================= */

.mukoun-home-page[dir="rtl"]
.home-hero
.title-area-left
> .transparent-btn {

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: max-content !important;

    /* مهم: وضع الزر أسفل نهاية الجملة جهة اليسار */
    margin-right: auto !important;
    margin-left: 0 !important;

    /* قريب جدًا من العنوان */
    margin-top: 10px !important;

    padding: 11px 25px !important;

    min-width: 108px !important;
    min-height: 50px !important;

    background: #d62927 !important;
    border: 2px solid #d62927 !important;
    border-radius: 999px !important;

    color: #ffffff !important;

    font-family: "Tajawal", Arial, sans-serif !important;
    font-size: 16px !important;
    line-height: 1 !important;
    font-weight: 800 !important;

    text-align: center !important;
    text-decoration: none !important;

    transform: none !important;
    box-shadow: none !important;
}


/* تعطيل أي حركة تغير موضعه */
.mukoun-home-page[dir="rtl"]
.home-hero
.title-area-left
> .transparent-btn:hover,
.mukoun-home-page[dir="rtl"]
.home-hero
.title-area-left
> .transparent-btn:focus,
.mukoun-home-page[dir="rtl"]
.home-hero
.title-area-left
> .transparent-btn:active {

    background: #d62927 !important;
    border-color: #d62927 !important;
    color: #ffffff !important;

    transform: none !important;
    box-shadow: none !important;
}


/* =========================================================
   LAPTOP
   992px → 1599px
========================================================= */

@media (min-width: 992px) and (max-width: 1599.98px) {

    .mukoun-home-page[dir="rtl"]
    .home-hero
    .bg-title-home {

        /*
         * مناسب لشاشات اللابتوب:
         * تقريبًا 45px → 61px
         */
        font-size: clamp(
            2.8rem,
            3.8vw,
            3.8rem
        ) !important;

        line-height: 1.28 !important;

        white-space: nowrap !important;
    }


    .mukoun-home-page[dir="rtl"]
    .home-hero
    .title-area-left
    > .transparent-btn {

        /* مباشرة تحت العنوان */
        margin-top: 10px !important;

        min-width: 105px !important;
        min-height: 48px !important;

        padding: 10px 23px !important;

        font-size: 15px !important;
    }
}


/* =========================================================
   Desktop كبير / 27"
========================================================= */

@media (min-width: 1600px) and (max-width: 2499.98px) {

    .mukoun-home-page[dir="rtl"]
    .home-hero
    .bg-title-home {

        font-size: clamp(
            7.5rem,
            7.7vw,
            8.6rem
        ) !important;

        line-height: 1.25 !important;

        white-space: nowrap !important;
    }


    .mukoun-home-page[dir="rtl"]
    .home-hero
    .title-area-left
    > .transparent-btn {

        margin-top: 12px !important;
    }
}


/* =========================================================
   32" / 2K / 4K
========================================================= */

@media (min-width: 2500px) {

    .mukoun-home-page[dir="rtl"]
    .home-hero
    .bg-title-home {

        font-size: 5rem !important;
        line-height: 1.28 !important;

        white-space: nowrap !important;
    }


    .mukoun-home-page[dir="rtl"]
    .home-hero
    .title-area-left
    > .transparent-btn {

        margin-top: 14px !important;

        min-width: 120px !important;
        min-height: 54px !important;

        font-size: 17px !important;
    }
}


/* =========================================================
   Tablet
========================================================= */

@media (max-width: 991.98px) {

    .mukoun-home-page[dir="rtl"]
    .home-hero
    .bg-title-home {

        font-size: clamp(
            2.5rem,
            6vw,
            3.4rem
        ) !important;

        line-height: 1.35 !important;

        white-space: normal !important;
    }


    .mukoun-home-page[dir="rtl"]
    .home-hero
    .title-area-left
    > .transparent-btn {

        margin-top: 9px !important;

        min-width: 100px !important;
        min-height: 46px !important;

        padding: 9px 21px !important;

        font-size: 15px !important;
    }
}


/* =========================================================
   Mobile
========================================================= */

@media (max-width: 767.98px) {

    .mukoun-home-page[dir="rtl"]
    .home-hero
    .title-area-left {

        width: calc(100% - 28px) !important;
        max-width: none !important;

        margin-left: auto !important;
        margin-right: auto !important;
    }


    .mukoun-home-page[dir="rtl"]
    .home-hero
    .bg-title-home {

        width: 100% !important;

        font-size: clamp(
            2.1rem,
            8vw,
            2.9rem
        ) !important;

        line-height: 1.42 !important;

        white-space: normal !important;
    }


    .mukoun-home-page[dir="rtl"]
    .home-hero
    .title-area-left
    > .transparent-btn {

        /*
         * يبقى أسفل نهاية الجملة جهة اليسار
         */
        margin-right: auto !important;
        margin-left: 0 !important;

        margin-top: 8px !important;

        min-width: 94px !important;
        min-height: 44px !important;

        padding: 8px 18px !important;

        font-size: 14px !important;
    }
}