.elementor-10 .elementor-element.elementor-element-4617024{--display:flex;--margin-top:-6%;--margin-bottom:0%;--margin-left:0%;--margin-right:0%;--z-index:1;}.elementor-10 .elementor-element.elementor-element-4617024:not(.elementor-motion-effects-element-type-background), .elementor-10 .elementor-element.elementor-element-4617024 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FBF4F0;}.elementor-10 .elementor-element.elementor-element-e833c63{width:100%;max-width:100%;margin:0% 0% calc(var(--kit-widget-spacing, 0px) + 0%) 0%;}.elementor-10 .elementor-element.elementor-element-f89e665{--display:flex;--margin-top:07%;--margin-bottom:0%;--margin-left:0%;--margin-right:0%;}.elementor-10 .elementor-element.elementor-element-0f67796{--display:grid;--e-con-grid-template-columns:repeat(2, 1fr);--e-con-grid-template-rows:repeat(1, 1fr);--grid-auto-flow:row;}.elementor-10 .elementor-element.elementor-element-51fb321{--display:flex;}.elementor-widget-divider{--divider-color:var( --e-global-color-secondary );}.elementor-widget-divider .elementor-divider__text{color:var( --e-global-color-secondary );font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-divider.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-secondary );}.elementor-widget-divider.elementor-view-framed .elementor-icon, .elementor-widget-divider.elementor-view-default .elementor-icon{color:var( --e-global-color-secondary );border-color:var( --e-global-color-secondary );}.elementor-widget-divider.elementor-view-framed .elementor-icon, .elementor-widget-divider.elementor-view-default .elementor-icon svg{fill:var( --e-global-color-secondary );}.elementor-10 .elementor-element.elementor-element-ddfb222{--divider-border-style:solid;--divider-color:#212121;--divider-border-width:1px;margin:0% 0% calc(var(--kit-widget-spacing, 0px) + 2%) 0%;}.elementor-10 .elementor-element.elementor-element-ddfb222 .elementor-divider-separator{width:105px;}.elementor-10 .elementor-element.elementor-element-ddfb222 .elementor-divider{padding-block-start:2px;padding-block-end:2px;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-10 .elementor-element.elementor-element-2e55c1c{margin:0% 0% calc(var(--kit-widget-spacing, 0px) + 5%) 0%;text-align:start;}.elementor-10 .elementor-element.elementor-element-2e55c1c .elementor-heading-title{font-family:"Georgia", Sans-serif;font-size:3.7vw;font-weight:500;text-transform:none;font-style:normal;text-decoration:none;line-height:1.1em;letter-spacing:-2px;word-spacing:0em;color:#212121;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-10 .elementor-element.elementor-element-e816e2b{font-family:"Almarai", Sans-serif;font-weight:400;}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-10 .elementor-element.elementor-element-8fe1743{width:100%;max-width:100%;text-align:end;}.elementor-10 .elementor-element.elementor-element-2d9b5b4{--display:flex;}.elementor-10 .elementor-element.elementor-element-c5eef9d{width:var( --container-widget-width, 85% );max-width:85%;margin:0px 12px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;--container-widget-width:85%;--container-widget-flex-grow:0;top:233.993px;}.elementor-10 .elementor-element.elementor-element-c5eef9d.elementor-element{--order:-99999 /* order start hack */;}body:not(.rtl) .elementor-10 .elementor-element.elementor-element-c5eef9d{left:17.969px;}body.rtl .elementor-10 .elementor-element.elementor-element-c5eef9d{right:17.969px;}.elementor-10 .elementor-element.elementor-element-c5eef9d img{width:100%;max-width:100%;height:500px;}@media(min-width:768px){.elementor-10 .elementor-element.elementor-element-f89e665{--content-width:1419px;}}@media(max-width:1024px){.elementor-10 .elementor-element.elementor-element-4617024{--margin-top:0%;--margin-bottom:0%;--margin-left:0%;--margin-right:0%;}.elementor-10 .elementor-element.elementor-element-e833c63{margin:0% 0% calc(var(--kit-widget-spacing, 0px) + 0%) 0%;}.elementor-10 .elementor-element.elementor-element-0f67796{--grid-auto-flow:row;}.elementor-10 .elementor-element.elementor-element-2e55c1c{margin:0% 0% calc(var(--kit-widget-spacing, 0px) + 10%) 0%;padding:0% 0% 0% 0%;}.elementor-10 .elementor-element.elementor-element-2e55c1c .elementor-heading-title{font-size:50px;}.elementor-10 .elementor-element.elementor-element-8fe1743{margin:0% 0% calc(var(--kit-widget-spacing, 0px) + 0%) 0%;text-align:center;}.elementor-10 .elementor-element.elementor-element-8fe1743 img{width:100%;}}@media(max-width:767px){.elementor-10 .elementor-element.elementor-element-4617024{--width:100vw;--margin-top:-5%;--margin-bottom:0%;--margin-left:0%;--margin-right:0%;}.elementor-10 .elementor-element.elementor-element-e833c63{width:100%;max-width:100%;margin:0% 0% calc(var(--kit-widget-spacing, 0px) + 0%) 0%;}.elementor-10 .elementor-element.elementor-element-0f67796{--e-con-grid-template-columns:repeat(1, 1fr);--grid-auto-flow:row;}.elementor-10 .elementor-element.elementor-element-ddfb222{margin:0% 0% calc(var(--kit-widget-spacing, 0px) + 3%) 0%;}.elementor-10 .elementor-element.elementor-element-2e55c1c .elementor-heading-title{font-size:30px;line-height:1.2em;}.elementor-10 .elementor-element.elementor-element-8fe1743{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 12px) 0px;}.elementor-10 .elementor-element.elementor-element-c5eef9d{margin:0px 6px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}}/* Start custom CSS for html, class: .elementor-element-e833c63 *//* =====================================================
   RESET
===================================================== */

.portfolio-hero,
.portfolio-hero * {
    box-sizing: border-box;
}


/* =====================================================
   HERO
===================================================== */

.portfolio-hero {

    position: relative;

    width: 100%;
    min-height: 100vh;

    overflow: hidden;

    background:
        radial-gradient(
            circle at 50% 25%,
            #ffffff 0%,
            #f7f4f1 35%,
            #e7dcd4 70%,
            #c7b6aa 100%
        );

    color: #15191b;

    display: flex;
    flex-direction: column;

    align-items: center;

    padding-top: 16%;
}


/* =====================================================
   DECORATIVE WAVES
===================================================== */

.hero-shape {

    position: absolute;

    border: 1px solid rgba(92, 63, 45, 0.13);

    pointer-events: none;

    z-index: 0;
}


/* large upper-right curve */

.hero-shape-one {

    width: 600px;
    height: 360px;

    right: -50px;
    top: 80px;

    border-radius: 50%;

    transform: rotate(20deg);
}


/* lower-left curve */

.hero-shape-two {

    width: 700px;
    height: 300px;

    left: -250px;
    top: 300px;

    border-radius: 50%;

    transform: rotate(18deg);
}


/* =====================================================
   HERO CONTENT
===================================================== */

.hero-content {

    position: relative;

    z-index: 5;

    width: min(1200px, 90%);

    text-align: center;

    margin: 0 auto;
}


.hero-eyebrow {

    margin: 0 0 28px;

    font-family: Arial, sans-serif;

    font-size: 18px;

    font-weight: 400;

    color: #171717;

}


/* =====================================================
   MAIN HEADING
===================================================== */

.hero-content h1 {

    margin: 0 auto;

    max-width: 1100px;

    font-family: Georgia, "Times New Roman", serif;

    font-size: clamp(
        48px,
        5.4vw,
        82px
    );

    line-height: 1.08;

    letter-spacing: -0.035em;

    font-weight: 700;

    color: #121719;
}


.hero-content h1 span {

    color: #966d55;
}


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

.hero-cta {

    display: inline-flex;

    align-items: center;
    justify-content: center;

    margin-top: 36px;

    padding: 15px 30px;

    border-radius: 100px;

    background: #172022;

    border: 1px solid #9a6d54;

    box-shadow:
        0 3px 0 rgba(150,109,85,0.35);

    color: #d6b9a5;

    text-decoration: none;

    font-family: Arial, sans-serif;

    font-size: 15px;

    font-weight: 500;

    letter-spacing: 0.02em;

    transition:
        transform 0.3s ease,
        background 0.3s ease;
}


.hero-cta:hover {

    transform: translateY(-3px);

    background: #202b2d;
    color: #fff;

}


/* =====================================================
   TRUSTED BY
===================================================== */

.trusted-section {

    position: relative;

    z-index: 5;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 20px;

    margin-top: 30px;

    font-family: Arial, sans-serif;
}


.trusted-title {

    font-size: 13px;

    font-weight: 700;

    letter-spacing: 0.04em;

    color: #171717;
}


.trusted-logos {

    display: flex;

    align-items: center;

    gap: 25px;

    color: #333;

    font-size: 14px;
}


/* =====================================================
   PORTFOLIO SLIDER
===================================================== */

.portfolio-slider {

    position: relative;

    z-index: 4;

    width: 100%;

    margin-top: 35px;

    overflow: hidden;

    padding-bottom: 0;
}


/*
   Fade the extreme left/right edges
*/

.portfolio-slider::before,
.portfolio-slider::after {

    content: "";

    position: absolute;

    top: 0;
    bottom: 0;

    width: 12%;

    z-index: 10;

    pointer-events: none;
}


.portfolio-slider::before {

    left: 0;

    background:
        linear-gradient(
            to right,
            rgba(231,220,212,1),
            rgba(231,220,212,0)
        );
}


.portfolio-slider::after {

    right: 0;

    background:
        linear-gradient(
            to left,
            rgba(231,220,212,1),
            rgba(231,220,212,0)
        );
}


/* =====================================================
   SLIDER TRACK
===================================================== */

.slider-track {

    display: flex;

    align-items: flex-end;

    justify-content: center;

    gap: 25px;

    width: max-content;

    margin: 0 auto;

    padding: 0 30px;

    transition:
    transform 0.65s cubic-bezier(
        0.22,
        1,
        0.36,
        1
    );

    will-change: transform;
}


/* =====================================================
   PROJECT CARD
===================================================== */

.portfolio-card {

    position: relative;

    flex: 0 0 460px;

    height: 360px;

    overflow: hidden;

    border-radius: 18px;

    background: #ddd;

    border: 8px solid rgba(255,255,255,0.75);

    box-shadow:
        0 20px 50px rgba(55,40,30,0.15);

    transform:
        rotate(0deg)
        scale(1);

    transition:
        transform 0.9s cubic-bezier(
            0.22,
            1,
            0.36,
            1
        ),
        opacity 0.9s ease;
}


/* =====================================================
   IMAGE
===================================================== */

.portfolio-image {

    width: 100%;
    height: 100%;

    overflow: hidden;
}


.portfolio-image img {

    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition:
        transform 0.8s ease;
}


/* =====================================================
   PROJECT TEXT
===================================================== */

.portfolio-overlay {

    position: absolute;

    left: 0;
    right: 0;
    bottom: 0;

    padding: 80px 30px 25px;

    background:
        linear-gradient(
            to top,
            rgba(0,0,0,0.72),
            rgba(0,0,0,0)
        );

    color: white;
}


.portfolio-overlay h3 {

    margin: 0;

    font-family: Arial, sans-serif;

    font-size: 24px;

    font-weight: 700;
}


.portfolio-overlay p {

    margin: 4px 0 0;

    font-family: Arial, sans-serif;

    font-size: 14px;

    opacity: 0.85;
}


/* =====================================================
   HOVER
===================================================== */

.portfolio-card:hover .portfolio-image img {

    transform: scale(1.04);

}


/* =====================================================
   RESPONSIVE
===================================================== */

@media (max-width: 900px) {

    .portfolio-hero {

        padding-top: 120px;

    }


    .hero-content h1 {

        font-size: clamp(
            42px,
            8vw,
            65px
        );

    }


    .trusted-section {

        flex-direction: column;

        gap: 12px;

    }


    .portfolio-card {

        flex-basis: 390px;

        height: 330px;

    }

}


@media (max-width: 600px) {

    .portfolio-hero {

        min-height: 100svh;

        padding-top: 100px;

    }


    .hero-content {

        width: 90%;

    }


    .hero-eyebrow {

        font-size: 14px;

        margin-bottom: 20px;

    }


    .hero-content h1 {

        font-size: 43px;

        line-height: 1.05;

    }


    .hero-cta {

        margin-top: 28px;

        padding: 14px 25px;

    }


    .trusted-section {

        margin-top: 25px;

    }


    .trusted-logos {

        gap: 12px;

        flex-wrap: wrap;

        justify-content: center;

        font-size: 12px;

    }


    .portfolio-slider {

        margin-top: 30px;

    }


    .slider-track {

        gap: 15px;

    }


    .portfolio-card {

        flex-basis: 300px;

        height: 280px;

        border-width: 6px;

        border-radius: 15px;

    }


    .portfolio-overlay {

        padding: 60px 20px 20px;

    }


    .portfolio-overlay h3 {

        font-size: 19px;

    }

}/* End custom CSS */