@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;500;600;700;800&display=swap');

:root{
    --orange:#ff7a00;
    --dark:#101417;
    --dark2:#181d21;
    --text:#18222e;
    --muted:#66717d;
    --light:#f7f8fa;
    --line:#e7e8eb;
}

*{
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    margin:0;
    font-family:'Cairo',Tahoma,Arial,sans-serif;
    color:var(--text);
    background:#fff;
    line-height:1.8;
    direction:rtl;
    overflow-x:hidden;
}

a{
    text-decoration:none;
    color:inherit;
}

.container{
    width:min(1180px,92%);
    margin:auto;
}

.fe-icon{
    width:1.15em;
    height:1.15em;
    display:inline-block;
    vertical-align:-.2em;
    stroke:currentColor;
    fill:none;
    stroke-width:1.8;
    stroke-linecap:round;
    stroke-linejoin:round;
}


/* =========================================================
   TOP BAR
   ========================================================= */

.topbar{
    height:34px;
    background:#07090b;
    color:#d8dadd;
    font-size:12px;
    border-bottom:1px solid #222;
}

.topbar-inner{
    height:34px;
    display:flex;
    justify-content:space-between;
    align-items:center;
}

.top-contact{
    display:flex;
    gap:14px;
    direction:ltr;
}

.top-contact a{
    display:inline-flex;
    align-items:center;
    gap:5px;
}

.lang{
    display:flex;
    gap:8px;
}


/* =========================================================
   HEADER
   ========================================================= */

.site-header{
    position:absolute;
    top:0;
    left:0;
    right:0;
    z-index:20;
    background:rgba(7,9,11,.88);
    border-bottom:1px solid rgba(255,255,255,.08);
    backdrop-filter:blur(6px);
    transition:.28s;
}

.site-header.is-sticky{
    position:fixed;
    top:0;
    background:rgba(8,11,13,.97);
    box-shadow:0 8px 30px rgba(0,0,0,.18);
}

.admin-bar .site-header.is-sticky{
    top:32px;
}

.nav-wrap{
    height:76px;
    display:flex;
    align-items:center;
    gap:28px;
    color:white;
    direction:rtl;
}


/* =========================================================
   BRAND / LOGO
   ========================================================= */

.brand{
    display:flex;
    align-items:center;
    gap:13px;
    white-space:nowrap;
    text-decoration:none;
}

.fe-logo-mark{
    width:50px;
    height:50px;
    display:grid;
    place-items:center;
    flex:0 0 50px;
}

.fe-logo-mark svg{
    width:46px;
    height:46px;
    display:block;
    fill:#f47b20;
}

/*
 * اللون الافتراضي للجزء الداخلي من اللهب.
 * مناسب للخلفيات الفاتحة.
 */
.fe-logo-mark .inner{
    fill:#1b2329;
}

/*
 * في الهيدر والفوتر الداكنين يصبح الجزء الداخلي أبيض
 * حتى لا يختفي داخل الخلفية السوداء.
 */
.site-header .fe-logo-mark .inner,
.footer .fe-logo-mark .inner{
    fill:#ffffff;
}

.brand-text{
    display:flex;
    flex-direction:column;
    justify-content:center;
    line-height:1.2;
}

.brand-text strong,
.brand strong{
    display:block;
    color:#fff;
    font-size:19px;
    font-weight:700;
    line-height:1.35;
}

.brand-text small,
.brand small{
    display:block;
    color:#e2e2e2;
    font-size:11px;
    letter-spacing:2.4px;
    line-height:1.4;
    margin-top:2px;
    direction:ltr;
}

.custom-logo{
    max-height:56px;
    width:auto;
}


/* =========================================================
   MAIN NAVIGATION
   ========================================================= */

.main-nav{
    display:flex;
    gap:27px;
    font-weight:700;
    font-size:14px;
    margin-right:24px;
}

.main-nav a{
    position:relative;
}

.main-nav a:after{
    content:"";
    position:absolute;
    bottom:-8px;
    right:0;
    width:0;
    height:2px;
    background:var(--orange);
    transition:.25s;
}

.main-nav a:hover:after{
    width:100%;
}

.header-cta{
    margin-right:auto;
}

.menu-toggle{
    display:none;
    background:none;
    border:0;
    color:#fff;
    font-size:25px;
}


/* =========================================================
   BUTTONS
   ========================================================= */

.btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    padding:12px 24px;
    border-radius:3px;
    font-weight:700;
    transition:.25s;
}

.btn-orange{
    background:var(--orange);
    color:#fff;
}

.btn-orange:hover{
    transform:translateY(-2px);
    filter:brightness(1.05);
}

.btn-outline{
    border:1px solid #fff;
    color:#fff;
    background:rgba(0,0,0,.08);
}

.btn-dark{
    background:#101417;
    color:#fff;
}

.btn-light{
    background:#fff;
    color:#111;
}


/* =========================================================
   HERO — FINAL
   ========================================================= */

.hero{
    min-height:670px;
    height:670px;
    background-size:cover;
    background-position:center center;
    position:relative;
    color:#fff;
    display:flex;
    align-items:center;
    overflow:hidden;
}

.hero-overlay{
    position:absolute;
    inset:0;
    z-index:1;
    background:linear-gradient(
        90deg,
        rgba(6,9,11,.10) 0%,
        rgba(6,9,11,.22) 40%,
        rgba(6,9,11,.72) 100%
    );
}

.hero-content{
    position:relative;
    z-index:2;
    width:min(1180px,92%);
    margin:auto;
    display:flex;
    justify-content:flex-start;
    align-items:center;
    padding-top:76px;
}

.hero-copy{
    width:min(620px,48vw);
    margin:0;
    margin-right:0;
    margin-left:auto;
    padding-right:0;
    padding-left:12px;
    transform:translateX(34px);
    text-align:right;
    direction:rtl;
}

.hero h1{
    margin:0 0 4px;
    font-size:40px;
    line-height:1.25;
    font-weight:700;
    color:#fff;
    letter-spacing:-.4px;
}

.hero h2{
    margin:0 0 14px;
    font-size:42px;
    line-height:1.22;
    font-weight:800;
    color:var(--orange);
    letter-spacing:-.6px;
}

.hero p{
    margin:0;
    max-width:540px;
    font-size:18px;
    line-height:1.9;
    color:#f1f3f4;
}

.hero-actions{
    display:flex;
    justify-content:flex-start;
    align-items:center;
    gap:14px;
    margin-top:22px;
    flex-wrap:wrap;
}

.scroll-cue{
    position:absolute;
    z-index:3;
    bottom:28px;
    left:50%;
    transform:translateX(-50%);
    width:24px;
    height:38px;
    border:1px solid rgba(255,255,255,.75);
    border-radius:15px;
    display:flex;
    justify-content:center;
    align-items:center;
    color:#fff;
}

@media(max-width:1100px){

    .hero-copy{
        width:min(570px,55vw);
    }

    .hero h1{
        font-size:35px;
    }

    .hero h2{
        font-size:41px;
    }
}

/* =========================================================
   STATS
   ========================================================= */

.stats-wrap{
    margin-top:-44px;
    position:relative;
    z-index:5;
}

.stats{
    background:linear-gradient(135deg,#1c2024,#121518);
    border-radius:12px;
    box-shadow:0 15px 35px rgba(0,0,0,.18);
    display:grid;
    grid-template-columns:repeat(4,1fr);
    color:#fff;
    overflow:hidden;
    direction:rtl;
}

.stat{
    padding:20px 22px;
    text-align:center;
    border-left:1px solid rgba(255,255,255,.12);
}

.stat:last-child{
    border-left:0;
}

.stat .fe-icon{
    display:block;
    margin:0 auto 6px;
    width:24px;
    height:24px;
    color:var(--orange);
}

.stat b{
    display:block;
    color:var(--orange);
    font-size:20px;
}

.stat span{
    font-size:13px;
    color:#d5d8dc;
}


/* =========================================================
   SECTIONS
   ========================================================= */

.section{
    padding:78px 0;
}

.two-col{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:64px;
    align-items:center;
    direction:ltr;
}

.two-col>*{
    direction:rtl;
}

.media-card img{
    width:100%;
    height:360px;
    object-fit:cover;
    border-radius:8px;
    box-shadow:0 12px 34px rgba(0,0,0,.12);
}

.eyebrow,
.section-title span{
    color:var(--orange);
    font-weight:800;
    font-size:20px;
}

.content-card h2,
.section-title h2,
.fleet h2,
.cta h2{
    font-size:34px;
    margin:4px 0 15px;
}

.content-card p{
    color:var(--muted);
    font-size:17px;
}

.section-title{
    text-align:center;
    margin-bottom:34px;
}

.section-title h2{
    font-size:30px;
}


/* =========================================================
   ABOUT — FINAL
   ========================================================= */

.section.about{
    padding-top:84px;
    padding-bottom:54px;
}

.two-col{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:70px;
    align-items:center;
}

.media-card{
    position:relative;
    border-radius:14px;
    overflow:visible;
}

.media-card::before{
    content:"";
    position:absolute;
    inset:18px -18px -18px 18px;
    border:2px solid rgba(255,122,0,.42);
    border-radius:14px;
    z-index:0;
}

.media-card img{
    position:relative;
    z-index:1;
    display:block;
    width:100%;
    height:100%;
    min-height:410px;
    max-height:460px;
    object-fit:cover;
    border-radius:14px;
    box-shadow:0 18px 42px rgba(12,18,24,.12);
}

.about-experience-badge{
    position:absolute;
    z-index:2;
    right:24px;
    bottom:24px;
    min-width:136px;
    padding:14px 18px;
    border-radius:12px;
    background:rgba(15,20,24,.94);
    color:#fff;
    text-align:center;
    box-shadow:0 12px 28px rgba(0,0,0,.22);
    backdrop-filter:blur(8px);
}

.about-experience-badge strong{
    display:block;
    font-size:30px;
    line-height:1;
    color:var(--orange);
    margin-bottom:6px;
}

.about-experience-badge span{
    display:block;
    font-size:14px;
    line-height:1.5;
    color:#f2f2f2;
}

.content-card{
    max-width:610px;
}

.content-card .eyebrow{
    display:inline-block;
    margin-bottom:14px;
    color:var(--orange);
    font-weight:800;
    font-size:18px;
}

.content-card h2{
    margin:0 0 20px;
    font-size:42px;
    line-height:1.28;
    color:var(--ink);
    letter-spacing:-.4px;
}

.content-card p{
    margin:0 0 24px;
    max-width:590px;
    font-size:18px;
    line-height:2;
    color:var(--muted);
}

.content-card .btn{
    margin-top:2px;
}

/* reduce whitespace before services */
.section.about + .section.services{
    padding-top:42px;
}

@media(max-width:900px){
    .section.about{
        padding-top:70px;
        padding-bottom:44px;
    }

    .two-col{
        grid-template-columns:1fr;
        gap:42px;
    }

    .media-card{
        max-width:760px;
        margin:0 auto;
    }

    .media-card img{
        min-height:360px;
        max-height:430px;
    }

    .content-card{
        max-width:760px;
        margin:0 auto;
    }

    .content-card h2{
        font-size:36px;
    }
}

@media(max-width:600px){
    .section.about{
        padding-top:56px;
        padding-bottom:34px;
    }

    .two-col{
        gap:32px;
    }

    .media-card::before{
        inset:12px -10px -10px 12px;
    }

    .media-card img{
        min-height:280px;
        max-height:340px;
    }

    .about-experience-badge{
        right:14px;
        bottom:14px;
        min-width:118px;
        padding:11px 14px;
    }

    .about-experience-badge strong{
        font-size:26px;
    }

    .about-experience-badge span{
        font-size:13px;
    }

    .content-card{
        text-align:center;
    }

    .content-card h2{
        font-size:31px;
    }

    .content-card p{
        font-size:16px;
        line-height:1.9;
    }

    .section.about + .section.services{
        padding-top:34px;
    }
}

/* =========================================================
   SERVICES / CARDS
   ========================================================= */

.services{
    background:#fff;
}

.cards{
    display:grid;
    gap:18px;
    direction:rtl;
}

.cards.four{
    grid-template-columns:repeat(4,1fr);
}

.cards.five{
    grid-template-columns:repeat(5,1fr);
}

.card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:10px;
    padding:25px 21px;
    text-align:center;
    box-shadow:0 8px 25px rgba(10,20,30,.05);
    transition:.25s;
}

.card:hover{
    transform:translateY(-5px);
    box-shadow:0 14px 30px rgba(10,20,30,.1);
    border-color:#ffd1ab;
}

.card .icon{
    margin-bottom:8px;
    color:var(--orange);
}

.card .icon .fe-icon{
    width:38px;
    height:38px;
    stroke-width:1.7;
}

.card h3{
    font-size:17px;
    margin:6px 0;
}

.card p{
    color:var(--muted);
    font-size:14px;
    margin:0;
}

.compact .card{
    padding:18px 12px;
}


/* =========================================================
   FLEET — FINAL POLISHED
   ========================================================= */

.fleet{
    position:relative;
    min-height:430px;
    background-size:cover;
    background-position:center center;
    display:flex;
    align-items:center;
    overflow:hidden;
    color:#fff;
}

/* تدرج أقوى خلف النص وأخف على جهة الشاحنة */
.fleet-shade{
    position:absolute;
    inset:0;
    z-index:1;

    background:
        linear-gradient(
            90deg,
            rgba(7,10,13,.10) 0%,
            rgba(7,10,13,.28) 38%,
            rgba(7,10,13,.70) 72%,
            rgba(7,10,13,.88) 100%
        );
}

.fleet-content{
    position:relative;
    z-index:2;

    width:min(1180px,92%);
    margin:auto;

    display:flex;
    flex-direction:column;
    align-items:flex-start;

    text-align:right;
    direction:rtl;

    padding-top:58px;
    padding-bottom:58px;
}

/* عنوان القسم الصغير */
.fleet-content .eyebrow{
    margin-bottom:10px;
    font-size:18px;
    font-weight:800;
    color:var(--orange);
}

/* العنوان الرئيسي */
.fleet-content h2{
    margin:0 0 16px;

    max-width:600px;

    font-size:36px;
    line-height:1.3;

    color:#fff;
    font-weight:800;

    letter-spacing:-.3px;
}

/* الوصف */
.fleet-description{
    max-width:620px;

    margin:0 0 24px;

    font-size:17px;
    line-height:1.95;

    color:#f4f6f7;
}

/* نقاط القوة */
.fleet-points{
    display:flex;
    flex-wrap:wrap;

    gap:14px 24px;

    align-items:center;
}

.fleet-points span{
    display:flex;
    align-items:center;

    gap:8px;

    font-size:15px;
    color:#fff;
    font-weight:600;
}

.fleet-points svg{
    width:21px;
    height:21px;

    color:var(--orange);

    flex:0 0 auto;
}


/* =========================================================
   TABLET
   ========================================================= */

@media(max-width:900px){

    .fleet{
        min-height:410px;
        background-position:45% center;
    }

    .fleet-shade{
        background:
            linear-gradient(
                90deg,
                rgba(7,10,13,.16) 0%,
                rgba(7,10,13,.38) 44%,
                rgba(7,10,13,.84) 100%
            );
    }

    .fleet-content{
        padding-top:52px;
        padding-bottom:52px;
    }

    .fleet-content h2{
        max-width:540px;
        font-size:33px;
    }

    .fleet-description{
        max-width:560px;
        font-size:16px;
    }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:600px){

    .fleet{
        min-height:480px;
        background-position:42% center;
    }

    .fleet-shade{
        background:
            linear-gradient(
                rgba(7,10,13,.55),
                rgba(7,10,13,.82)
            );
    }

    .fleet-content{
        align-items:center;
        text-align:center;

        padding-top:54px;
        padding-bottom:54px;
    }

    .fleet-content .eyebrow{
        font-size:17px;
    }

    .fleet-content h2{
        max-width:100%;
        font-size:29px;
        line-height:1.4;
    }

    .fleet-description{
        max-width:100%;
        font-size:15px;
        line-height:1.9;
    }

    .fleet-points{
        justify-content:center;
        gap:12px 16px;
    }

    .fleet-points span{
        font-size:14px;
    }
}



/* =========================================================
   SAFETY & QUALITY — FINAL
   ========================================================= */

.safety-band{
    position:relative;
    background:#10161b;
    color:#fff;
    padding:76px 0 72px;
    overflow:hidden;
}

.safety-band::before{
    content:"";
    position:absolute;
    top:-160px;
    left:-160px;
    width:420px;
    height:420px;
    border-radius:50%;
    background:rgba(255,122,0,.06);
    filter:blur(10px);
}

.safety-band::after{
    content:"";
    position:absolute;
    right:-120px;
    bottom:-180px;
    width:360px;
    height:360px;
    border-radius:50%;
    background:rgba(255,122,0,.04);
}

.safety-band .container{
    position:relative;
    z-index:2;
}

.safety-band-head{
    max-width:760px;
    margin:0 auto 48px;
    text-align:center;
}

.safety-band-head .eyebrow{
    display:inline-block;
    margin-bottom:10px;
    color:var(--orange);
    font-size:18px;
    font-weight:800;
}

.safety-band-head h2{
    margin:0 0 14px;
    color:#fff;
    font-size:38px;
    line-height:1.35;
    font-weight:800;
}

.safety-band-head p{
    margin:0 auto;
    max-width:700px;
    color:#b9c2c9;
    font-size:16px;
    line-height:1.9;
}

.safety-band-grid{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    align-items:stretch;
    border-top:1px solid rgba(255,255,255,.10);
    border-bottom:1px solid rgba(255,255,255,.10);
}

.safety-band-item{
    position:relative;
    padding:32px 22px 30px;
    text-align:center;
}

.safety-band-item + .safety-band-item{
    border-right:1px solid rgba(255,255,255,.10);
}

.safety-band-icon{
    width:54px;
    height:54px;
    margin:0 auto 18px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    background:rgba(255,122,0,.10);
    color:var(--orange);
}

.safety-band-icon svg{
    width:27px;
    height:27px;
}

.safety-band-item h3{
    margin:0 0 10px;
    color:#fff;
    font-size:18px;
    font-weight:800;
}

.safety-band-item span{
    display:block;
    color:#aeb8bf;
    font-size:14px;
    line-height:1.75;
}

.safety-band-item{
    transition:
        transform .25s ease,
        background-color .25s ease;
}

.safety-band-item:hover{
    transform:translateY(-4px);
    background:rgba(255,255,255,.025);
}


/* =========================================================
   TABLET
   ========================================================= */

@media(max-width:1000px){

    .safety-band-grid{
        grid-template-columns:repeat(3,1fr);
    }

    .safety-band-item{
        border-bottom:1px solid rgba(255,255,255,.10);
    }

    .safety-band-item + .safety-band-item{
        border-right:1px solid rgba(255,255,255,.10);
    }

    .safety-band-head h2{
        font-size:34px;
    }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:650px){

    .safety-band{
        padding:58px 0 54px;
    }

    .safety-band-head{
        margin-bottom:34px;
    }

    .safety-band-head h2{
        font-size:29px;
    }

    .safety-band-head p{
        font-size:15px;
    }

    .safety-band-grid{
        grid-template-columns:1fr;
    }

    .safety-band-item{
        padding:26px 18px;
        border-bottom:1px solid rgba(255,255,255,.10);
    }

    .safety-band-item + .safety-band-item{
        border-right:none;
    }

    .safety-band-item:last-child{
        border-bottom:none;
    }
}





/* =========================================================
   BRANCHES
   ========================================================= */

.branches{
    background:#fafafa;
}

.branch-layout{
    display:grid;
    grid-template-columns:1.05fr 1fr;
    grid-template-areas:"map list";
    gap:38px;
    align-items:center;
    direction:ltr;
}

.map-card{
    grid-area:map;
}

.branch-grid{
    grid-area:list;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;
    direction:rtl;
}

.map-card img{
    width:100%;
    max-height:470px;
    object-fit:contain;
}

.branch-link{
    background:#fff;
    border:1px solid var(--line);
    padding:13px 15px;
    border-radius:7px;
    box-shadow:0 5px 16px rgba(0,0,0,.05);
    font-weight:700;
    display:flex;
    align-items:center;
    gap:8px;
    direction:rtl;
}

.branch-link .fe-icon:first-child{
    color:var(--orange);
}

.branch-link .fe-icon:last-child{
    margin-right:auto;
    width:15px;
    height:15px;
}

.branch-link:hover{
    border-color:var(--orange);
    color:var(--orange);
}


/* =========================================================
   VISION
   ========================================================= */

.vision{
    height:230px;
    background-size:cover;
    background-position:center;
    position:relative;
    color:#fff;
    display:flex;
    align-items:center;
    text-align:center;
}

.vision-shade{
    position:absolute;
    inset:0;
    background:rgba(5,8,10,.83);
}

.vision-content{
    position:relative;
    z-index:2;
    max-width:800px;
}

.vision h2{
    color:var(--orange);
    font-size:29px;
    margin:0;
}

.vision p{
    font-size:18px;
    margin:6px auto 0;
}

.quote{
    font-size:48px;
    color:var(--orange);
    line-height:1;
}


/* =========================================================
   CTA
   ========================================================= */

.cta{
    background:var(--orange);
    color:#111;
    padding:34px 0;
}

.cta-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
}

.cta h2{
    font-size:25px;
    margin:0;
}

.cta p{
    margin:0;
}

.cta-actions{
    display:flex;
    gap:12px;
}

.wa-btn .fe-icon{
    color:#25D366;
}


/* =========================================================
   FOOTER
   ========================================================= */

.footer{
    background:#121518;
    color:#d8dadd;
    padding:54px 0 15px;
}

.footer-grid{
    display:grid;
    grid-template-columns:1.4fr 1fr 1fr 1.2fr;
    gap:35px;
}

.footer h4{
    color:#fff;
    margin:0 0 14px;
}

.footer a,
.footer span{
    display:block;
    color:#c5c8cb;
    font-size:14px;
    margin:7px 0;
}

.footer p{
    color:#aeb3b8;
    font-size:14px;
}


/* Footer Brand */

.footer .footer-brand{
    display:flex;
    align-items:center;
    gap:13px;
    margin:0 0 16px;
    color:#fff;
    width:max-content;
    max-width:100%;
}

.footer .footer-brand .fe-logo-mark{
    width:52px;
    height:52px;
    flex:0 0 52px;
}

.footer .footer-brand .fe-logo-mark svg{
    width:48px;
    height:48px;
}

.footer .footer-brand .brand-text{
    display:flex;
    flex-direction:column;
    justify-content:center;
}

.footer .footer-brand .brand-text,
.footer .footer-brand .brand-text span{
    margin:0;
}

.footer .footer-brand strong{
    display:block;
    color:#fff;
    margin:0;
    font-size:19px;
    line-height:1.4;
}

.footer .footer-brand small{
    display:block;
    color:#d6dadd;
    font-size:11px;
    letter-spacing:2.4px;
    line-height:1.4;
    margin-top:2px;
    direction:ltr;
}


/* Newsletter */

.footer form{
    display:flex;
    flex-wrap:wrap;
}

.footer input{
    flex:1;
    padding:11px;
    border:0;
    outline:none;
    min-width:150px;
}

.footer button{
    background:var(--orange);
    color:#fff;
    border:0;
    padding:0 16px;
    font-weight:700;
    cursor:pointer;
    transition:.2s;
}

.footer button:hover{
    filter:brightness(1.06);
}

.footer .form-status{
    width:100%;
    margin-top:8px;
}


/* Social Media */

.socials{
    display:flex;
    gap:8px;
    margin-top:18px;
}

.socials a{
    width:34px;
    height:34px;
    border:1px solid #3b4147;
    border-radius:50%;
    display:grid!important;
    place-items:center;
    color:#fff!important;
    margin:0!important;
    transition:.2s;
}

.socials a:hover{
    border-color:var(--orange);
    color:var(--orange)!important;
    transform:translateY(-2px);
}


/* Copyright */

.copyright{
    border-top:1px solid #2a2e33;
    margin-top:35px;
    padding-top:14px;
    text-align:center;
    font-size:12px;
    color:#8e949a;
}


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

.wa-float{
    position:fixed;
    left:22px;
    bottom:22px;
    z-index:50;
    width:54px;
    height:54px;
    border-radius:50%;
    background:#25D366;
    color:#fff;
    display:grid;
    place-items:center;
    box-shadow:0 10px 28px rgba(0,0,0,.25);
    transition:.2s;
}

.wa-float:hover{
    transform:translateY(-4px) scale(1.03);
}

.wa-float .fe-icon{
    width:26px;
    height:26px;
}


/* =========================================================
   ANIMATION
   ========================================================= */

.reveal{
    opacity:0;
    transform:translateY(18px);
    transition:opacity .55s ease,transform .55s ease;
}

.reveal.visible{
    opacity:1;
    transform:none;
}


/* =========================================================
   INTERNAL PAGES
   ========================================================= */

.page-hero{
    padding:150px 0 55px;
    background:linear-gradient(120deg,#101417,#232a2f);
    color:#fff;
}

.page-hero span{
    color:var(--orange);
    font-weight:700;
}

.page-hero h1{
    font-size:42px;
    margin:4px 0;
}

.page-content{
    padding:65px 0;
    min-height:360px;
}

.contact-layout,
.branch-detail{
    display:grid;
    grid-template-columns:.8fr 1.2fr;
    gap:55px;
    align-items:start;
}

.contact-info{
    background:#f7f8fa;
    border-radius:12px;
    padding:32px;
}

.fe-contact-form{
    background:#fff;
    border:1px solid var(--line);
    border-radius:12px;
    padding:30px;
    box-shadow:0 12px 35px rgba(0,0,0,.06);
}

.form-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:18px;
}

.fe-contact-form label{
    display:block;
    font-weight:700;
    margin-bottom:16px;
}

.fe-contact-form input,
.fe-contact-form select,
.fe-contact-form textarea{
    width:100%;
    border:1px solid #dfe2e5;
    border-radius:6px;
    padding:12px;
    margin-top:6px;
    font:inherit;
    background:#fff;
}

.form-status{
    margin-top:12px;
    font-weight:700;
}

.form-status.ok{
    color:#15803d;
}

.form-status.err{
    color:#b91c1c;
}

.branch-map iframe{
    width:100%;
    height:380px;
    border:0;
    border-radius:10px;
    margin-top:16px;
}

.not-found{
    min-height:70vh;
    display:grid;
    place-items:center;
    text-align:center;
    padding-top:100px;
}

.not-found b{
    font-size:120px;
    color:var(--orange);
    line-height:1;
}

.not-found h1{
    font-size:36px;
}


/* =========================================================
   TYPOGRAPHY REFINEMENTS
   ========================================================= */

h1,
h2,
h3,
h4,
.brand strong,
.btn,
.main-nav,
.stat b,
.section-title span,
.eyebrow{
    font-family:'Cairo',Tahoma,Arial,sans-serif;
}

.hero h1{
    font-weight:700;
    letter-spacing:-.4px;
}

.hero h2{
    font-weight:800;
    letter-spacing:-.6px;
}

.content-card h2,
.section-title h2,
.fleet h2,
.cta h2{
    font-weight:700;
    letter-spacing:-.35px;
}

.card h3,
.branch-link,
.footer h4{
    font-weight:700;
}

.vision .quote{
    display:none!important;
}


/* =========================================================
   PARTNER ARCHIVE
   ========================================================= */

.partner-archive{
    padding:150px 0 80px;
    background:#fff;
    min-height:70vh;
}

.partner-archive .archive-head{
    text-align:center;
    margin-bottom:38px;
}

.partner-archive .archive-head span{
    color:var(--orange);
    font-weight:800;
    font-size:20px;
}

.partner-archive .archive-head h1{
    font-size:38px;
    margin:5px 0 8px;
    color:var(--text);
}

.partner-archive .archive-head p{
    color:var(--muted);
    margin:0;
}

.partner-all-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:18px;
}

.partner-all-grid .logo-card{
    height:150px;
    padding:20px;
}

.partner-all-grid .logo-card img{
    max-height:105px;
}

.partner-name{
    display:block;
    margin-top:10px;
    text-align:center;
    font-weight:700;
    color:var(--text);
}



/* =========================================================
   HERO — RESPONSIVE
   ========================================================= */

@media(max-width:900px){

    .hero{
        height:620px;
        min-height:620px;
        background-position:45% center;
    }

    .hero-content{
        padding-top:70px;
    }

    .hero-copy{
        width:65%;
        max-width:560px;
        padding-right:12px;
        transform:translateX(18px);
    }

    .hero h1{
        font-size:32px;
    }

    .hero h2{
        font-size:38px;
    }

    .hero p{
        font-size:17px;
    }
}

@media(max-width:600px){

    .hero{
        height:auto;
        min-height:650px;
        background-position:40% center;
    }

    .hero-overlay{
        background:linear-gradient(
            rgba(5,8,10,.45),
            rgba(5,8,10,.72)
        );
    }

    .hero-content{
        width:92%;
        min-height:650px;
        padding-top:90px;
        padding-bottom:70px;
        align-items:center;
    }

    .hero-copy{
        width:100%;
        max-width:100%;
        margin:0 auto;
        padding:0 10px;
        text-align:center;
        transform:none;
    }

    .hero h1{
        font-size:28px;
        line-height:1.35;
    }

    .hero h2{
        font-size:34px;
        line-height:1.3;
        margin-top:6px;
    }

    .hero p{
        font-size:16px;
        line-height:1.9;
        margin-left:auto;
        margin-right:auto;
    }

    .hero-actions{
        justify-content:center;
    }

    .scroll-cue{
        bottom:20px;
    }
}

/* =========================================================
   TABLET
   ========================================================= */

@media(max-width:900px){

    .main-nav,
    .header-cta{
        display:none;
    }

    .menu-toggle{
        display:block;
        margin-right:auto;
    }

    .nav-wrap{
        justify-content:space-between;
    }

    .main-nav.open{
        position:absolute;
        top:76px;
        right:0;
        left:0;
        display:flex;
        flex-direction:column;
        background:#111;
        padding:20px;
        margin:0;
    }
    .stats{
        grid-template-columns:1fr 1fr;
    }

    .two-col,
    .branch-layout{
        grid-template-columns:1fr;
        grid-template-areas:"map" "list";
    }

    .cards.four{
        grid-template-columns:1fr 1fr;
    }

    .cards.five{
        grid-template-columns:repeat(3,1fr);
    }

    .logo-strip{
        grid-template-columns:repeat(4,1fr);
    }

    .footer-grid{
        grid-template-columns:1fr 1fr;
    }

    .contact-layout,
    .branch-detail{
        grid-template-columns:1fr;
    }

    .partner-all-grid{
        grid-template-columns:repeat(3,1fr);
    }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:600px){

    .topbar{
        display:none;
    }

    .site-header{
        top:0;
    }

    .admin-bar .site-header.is-sticky{
        top:46px;
    }

    .brand{
        gap:8px;
    }

    .brand .fe-logo-mark{
        width:42px;
        height:42px;
        flex-basis:42px;
    }

    .brand .fe-logo-mark svg{
        width:39px;
        height:39px;
    }

    .brand-text strong,
    .brand strong{
        font-size:15px;
    }

    .brand-text small,
    .brand small{
        font-size:8px;
        letter-spacing:1.5px;
    }
    .stats-wrap{
        margin-top:0;
    }

    .stats{
        grid-template-columns:1fr 1fr;
        border-radius:0;
    }

    .stat{
        padding:16px 8px;
    }

    .section{
        padding:55px 0;
    }

    .cards.four,
    .cards.five{
        grid-template-columns:1fr 1fr;
    }

    .branch-grid{
        grid-template-columns:1fr;
    }

    .logo-strip{
        grid-template-columns:repeat(2,1fr);
    }

    .gov-grid{
        grid-template-columns:1fr;
    }

    .cta-inner,
    .footer-grid{
        display:grid;
        grid-template-columns:1fr;
    }

    .cta-actions{
        margin-top:10px;
    }

    .content-card h2,
    .section-title h2,
    .fleet h2{
        font-size:27px;
    }

    .form-grid{
        grid-template-columns:1fr;
    }

    .page-hero{
        padding-top:105px;
    }

    .page-hero h1{
        font-size:32px;
    }

    .wa-float{
        width:48px;
        height:48px;
        left:14px;
        bottom:14px;
    }

    .footer .footer-brand{
        gap:10px;
    }

    .footer .footer-brand .fe-logo-mark{
        width:46px;
        height:46px;
        flex-basis:46px;
    }

    .footer .footer-brand .fe-logo-mark svg{
        width:42px;
        height:42px;
    }

    .partner-archive{
        padding-top:110px;
    }

    .partner-archive .archive-head h1{
        font-size:30px;
    }

    .partner-all-grid{
        grid-template-columns:repeat(2,1fr);
        gap:12px;
    }

    .partner-all-grid .logo-card{
        height:120px;
    }
}


/* =========================================================
   ACCESSIBILITY
   ========================================================= */

@media(prefers-reduced-motion:reduce){

    *{
        scroll-behavior:auto!important;
    }

    .reveal{
        opacity:1;
        transform:none;
        transition:none!important;
    }
}


/* =========================================
   OFFICIAL BRAND LOGO — FINAL
   ========================================= */

.brand-image-only{
    display:flex;
    align-items:center;
    background:none !important;
    background-image:none !important;
    box-shadow:none !important;
    overflow:visible;
}

.brand-image-only::before,
.brand-image-only::after{
    content:none !important;
    display:none !important;
}

.site-brand-logo{
    display:block !important;
    width:auto !important;
    height:64px !important;
    max-width:300px !important;
    object-fit:contain !important;
    object-position:center !important;
    background:none !important;
    flex:0 0 auto;
}

.footer-brand-logo{
    display:block !important;
    width:auto !important;
    height:84px !important;
    max-width:330px !important;
    object-fit:contain !important;
    object-position:center !important;
    background:none !important;
}

.footer .footer-brand{
    width:auto;
    max-width:100%;
    display:flex;
    align-items:center;
}

@media(max-width:900px){
    .site-brand-logo{
        height:54px !important;
        max-width:255px !important;
    }

    .footer-brand-logo{
        height:76px !important;
        max-width:300px !important;
    }
}

@media(max-width:600px){
    .site-brand-logo{
        height:46px !important;
        max-width:220px !important;
    }

    .footer-brand-logo{
        height:68px !important;
        max-width:260px !important;
    }
}


/* BRANCHES — PREMIUM ENHANCEMENT */
.branches-premium{position:relative;background:linear-gradient(180deg,#fbfbfc 0%,#f6f7f8 100%);padding-top:76px;padding-bottom:86px;overflow:hidden}
.branches-title{max-width:760px;margin:0 auto 44px}.branches-title p{max-width:690px;margin:0 auto;color:var(--muted);font-size:15px;line-height:1.9}
.branches-premium .branch-layout{grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:48px}
.branch-map-frame{position:relative;padding:10px;border:1px solid rgba(16,20,23,.08);border-radius:18px;background:#fff;box-shadow:0 22px 50px rgba(16,24,32,.09)}
.branch-map-frame:before{content:"";position:absolute;inset:18px -14px -14px 18px;z-index:-1;border:2px solid rgba(255,122,0,.28);border-radius:18px}
.branch-map-frame img{display:block;width:100%;height:445px;object-fit:cover;border-radius:12px}
.branch-count-badge{position:absolute;right:28px;bottom:28px;min-width:138px;padding:14px 18px;border-radius:12px;background:rgba(13,18,22,.94);color:#fff;text-align:center;box-shadow:0 12px 30px rgba(0,0,0,.22)}
.branch-count-badge strong{display:block;color:var(--orange);font-size:31px;line-height:1;font-weight:800;margin-bottom:6px}.branch-count-badge span{font-size:13px;font-weight:600}
.branch-list-wrap{grid-area:list;direction:rtl}.branch-list-head{margin-bottom:22px}.branch-list-kicker{color:var(--orange);font-size:16px;font-weight:800}.branch-list-head h3{margin:2px 0 5px;font-size:27px}.branch-list-head p{margin:0;color:var(--muted);font-size:14px}
.branches-premium .branch-link{min-height:68px;border-radius:10px;transition:.24s}.branches-premium .branch-link:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(15,25,35,.10)}
@media(max-width:1000px){.branches-premium .branch-layout{grid-template-columns:1fr;grid-template-areas:"map" "list";gap:42px}.branch-list-wrap,.branch-map-card{max-width:760px;width:100%;margin:auto}}
@media(max-width:650px){.branches-premium{padding-top:58px;padding-bottom:62px}.branches-premium .branch-grid{grid-template-columns:1fr}.branch-map-frame img{height:auto;min-height:285px}.branch-list-head{text-align:center}}

/* =========================================================
   BRANCH BADGE + RTL ALIGNMENT FIX
   ========================================================= */

.branch-map-card,
.branch-map-frame{
    position:relative;
}

.branch-map-frame{
    overflow:visible;
}

.branch-count-badge{
    position:absolute !important;
    right:28px !important;
    bottom:28px !important;
    left:auto !important;
    top:auto !important;
    z-index:5 !important;

    min-width:138px;
    padding:14px 18px;

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

    border-radius:12px;
    background:rgba(13,18,22,.96) !important;
    color:#fff !important;

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

    box-shadow:0 12px 30px rgba(0,0,0,.22);
    backdrop-filter:blur(8px);
}

.branch-count-badge strong{
    display:block !important;
    margin:0 0 6px !important;
    color:var(--orange) !important;
    font-size:31px !important;
    line-height:1 !important;
    font-weight:800 !important;
}

.branch-count-badge span{
    display:block !important;
    margin:0 !important;
    color:#f1f3f4 !important;
    font-size:13px !important;
    line-height:1.45 !important;
    font-weight:600 !important;
    white-space:nowrap;
}

.branch-list-wrap,
.branch-list-head,
.branch-list-kicker,
.branch-list-head h3,
.branch-list-head p{
    text-align:right !important;
    direction:rtl !important;
}

@media(max-width:650px){
    .branch-count-badge{
        right:18px !important;
        bottom:18px !important;
        min-width:116px;
        padding:11px 13px;
    }

    .branch-count-badge strong{
        font-size:27px !important;
    }

    .branch-count-badge span{
        font-size:12px !important;
    }

    .branch-list-head{
        text-align:right !important;
    }
}

/* =========================================================
   HOME END — VISION / CTA / FOOTER PREMIUM FINAL 2026
   ========================================================= */
.vision{height:auto;min-height:300px;background-position:center 58%;isolation:isolate}
.vision-shade{background:linear-gradient(90deg,rgba(7,10,13,.78),rgba(7,10,13,.88));z-index:0}
.vision-content{padding:66px 0;max-width:900px;text-align:center;direction:rtl}
.vision h2{display:inline-block;position:relative;font-size:20px;font-weight:800;margin:0 0 15px;padding-bottom:8px}
.vision h2:after{content:"";position:absolute;right:50%;bottom:0;width:44px;height:2px;background:var(--orange);transform:translateX(50%)}
.vision p{max-width:880px;font-size:24px;line-height:1.85;font-weight:600;color:#fff;margin:0 auto}

.cta{position:relative;background:linear-gradient(100deg,#ff8500 0%,#ff7200 100%);padding:38px 0;overflow:hidden}
.cta:before{content:"";position:absolute;left:-70px;top:-120px;width:280px;height:280px;border:1px solid rgba(255,255,255,.17);border-radius:50%}
.cta-inner{position:relative;z-index:1;direction:rtl}
.cta-inner>div:first-child{text-align:right}
.cta h2{font-size:27px;line-height:1.45;font-weight:800;color:#111820;margin:0 0 3px}
.cta p{font-size:15px;color:#252525}
.cta-actions{direction:rtl;flex:0 0 auto}
.cta-actions .btn{min-width:132px;min-height:48px;border-radius:5px}
.cta-actions .btn-dark{background:#11171b}
.cta-actions .btn-light{border:1px solid rgba(0,0,0,.08)}

.footer{background:#101417;padding:58px 0 16px;border-top:0}
.footer-grid{grid-template-columns:1.45fr .8fr .9fr 1.15fr;gap:52px;align-items:start;direction:rtl}
.footer-company,.footer-links,.footer-contact,.footer-newsletter{text-align:right;direction:rtl}
.footer h4{position:relative;font-size:16px;padding-bottom:10px;margin-bottom:16px}
.footer h4:after{content:"";position:absolute;right:0;bottom:0;width:30px;height:2px;background:var(--orange)}
.footer a,.footer span{font-size:13px;line-height:1.75;transition:color .2s ease}
.footer-links a:hover,.footer-contact a:hover{color:var(--orange)}
.footer-description{max-width:330px;line-height:1.95!important}
.footer .footer-brand{margin:0 0 14px auto}
.footer-brand-logo{height:72px!important;max-width:290px!important}
.footer-newsletter p{margin:0 0 12px}
.footer form{display:grid;grid-template-columns:1fr auto;gap:0;max-width:330px}
.footer input{height:44px;border-radius:0 4px 4px 0;background:#fff;color:#111}
.footer button{height:44px;border-radius:4px 0 0 4px;padding:0 18px}
.footer .form-status{grid-column:1/-1}
.socials{justify-content:flex-start}
.copyright{margin-top:42px;padding-top:16px}

@media(max-width:900px){
  .vision{min-height:270px}.vision-content{padding:54px 0}.vision p{font-size:21px}
  .cta-inner{display:grid;grid-template-columns:1fr;gap:18px}.cta-actions{margin-top:0}
  .footer-grid{grid-template-columns:1fr 1fr;gap:38px 28px}
}
@media(max-width:600px){
  .vision{min-height:300px}.vision-content{padding:50px 0}.vision p{font-size:18px;line-height:1.9}
  .cta{padding:32px 0}.cta-inner>div:first-child{text-align:center}.cta h2{font-size:22px}.cta p{font-size:14px}.cta-actions{justify-content:center;flex-wrap:wrap}
  .footer{padding-top:46px}.footer-grid{grid-template-columns:1fr;gap:30px}.footer-company,.footer-links,.footer-contact,.footer-newsletter{text-align:center}.footer h4:after{right:50%;transform:translateX(50%)}.footer .footer-brand{margin:0 auto 14px}.footer-description{margin-left:auto;margin-right:auto}.socials{justify-content:center}.footer form{margin:0 auto;width:100%}
}