/* =========================================================
RESET
========================================================= */

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html,
body{
    width:100%;
    min-height:100%;
    overflow-x:hidden;
    font-family:Arial, Helvetica, sans-serif;
}

body{
    background:#fff;
}

img{
    display:block;
    max-width:100%;
}

a{
    color:inherit;
    text-decoration:none;
}

button,
input,
textarea{
    font:inherit;
}



/* =========================================================
GLOBAL INNER WIDTH

SECTIONS = FULL WIDTH
CONTENT = MAX 1440PX
========================================================= */

.inner-container{
    width:calc(100% - 80px);
    max-width:1440px;
    margin-left:auto;
    margin-right:auto;
}



/* =========================================================
GLOBAL LABEL
========================================================= */

.section-label{
    display:inline-block;
    color:#ff4b24;
    font-size:13px;
    line-height:1;
    font-weight:700;
    letter-spacing:2px;
}



/* =========================================================
HERO
========================================================= */

.hero-banner{
    position:relative;
    width:100%;
    height:100vh;
    min-height:650px;
    overflow:hidden;

    display:flex;
    align-items:center;
    justify-content:center;
}

.hero-video{
    position:absolute;

    top:50%;
    left:50%;

    min-width:100%;
    min-height:100%;

    width:auto;
    height:auto;

    transform:translate(-50%, -50%);

    object-fit:cover;

    z-index:1;
}

.hero-overlay{
    position:absolute;
    inset:0;

    background:
        linear-gradient(
            rgba(0,20,35,.65),
            rgba(0,20,35,.65)
        );

    z-index:2;
}

.hero-content{
    position:relative;

    z-index:3;

    text-align:center;

    color:#fff;

    padding:20px;
}

.hero-content h1{
    font-family:Georgia, serif;

    font-size:78px;
    line-height:1.15;

    font-weight:700;

    margin-bottom:25px;
}

.hero-content p{
    color:#fff;

    font-size:28px;
    line-height:1.5;

    font-weight:600;
}



/* =========================================================
ETHIOPIA
========================================================= */

.ethiopia-section{
    width:100%;

    background:#000;

    padding:55px 0;

    overflow:hidden;
}

.ethiopia-container{
    display:flex;

    align-items:center;
    justify-content:space-between;

    gap:70px;
    max-width: 1140px;
}

.ethiopia-content{
    width:50%;
}

.ethiopia-content h2{
    color:#fff;

    font-size:52px;
    line-height:1;

    font-weight:700;
}

.ethiopia-image{
    width:50%;
}

.ethiopia-image img{
    width:100%;

    height:auto;

    object-fit:contain;
}



/* =========================================================
ABOUT
========================================================= */

.about-section{
    width:100%;

    background:#f8f4ee;

    padding:80px 0 55px;

    overflow:hidden;
}

.about-inner{
    width:calc(100% - 120px);
}

.about-top{
    display:flex;

    align-items:center;

    gap:90px;
}

.about-image-wrap{
    position:relative;

    width:45%;
}

.about-main-img{
    width:100%;

    border-radius:160px 160px 160px 0;
}

.circle-badge{
    position:absolute;

    top:-40px;
    right:-20px;

    width:120px;
    height:120px;

    display:flex;

    align-items:center;
    justify-content:center;

    background:#fff;

    border-radius:50%;
}

.circle-badge svg{
    position:absolute;

    width:110px;
    height:110px;

    animation:rotateCircle 12s linear infinite;
}

.circle-badge text{
    fill:#333;

    font-size:14px;

    letter-spacing:2px;
}

.circle-badge img{
    position:relative;

    z-index:2;

    width:38px;
}

@keyframes rotateCircle{

    from{
        transform:rotate(0deg);
    }

    to{
        transform:rotate(360deg);
    }

}

.about-content{
    width:55%;
}

.about-content h2{
    margin:20px 0 30px;

    color:#111;

    font-size:42px;
    line-height:1.08;

    font-weight:400;

    letter-spacing:-1px;
}

.about-content h2 strong{
    font-weight:700;
}

.about-description{
    display:flex;

    gap:50px;

    color:#222;

    font-size:15px;
    line-height:1.65;
}

.about-explore{
    flex:0 0 150px;
}

.about-description p{
    max-width:420px;

    color:#555;
}

.about-divider{
    width:100%;
    height:1px;

    margin:70px 0 48px;

    background:#282828;
}

.about-columns{
    display:grid;

    grid-template-columns:1fr 1fr 1fr;

    gap:65px;
}

.about-columns h3,
.about-columns h4{
    margin-bottom:18px;

    color:#111;

    font-size:16px;
    line-height:1.45;
}

.about-columns p{
    color:#555;

    font-size:14px;
    line-height:1.65;
}



/* =========================================================
PARTNER MARQUEE
========================================================= */

.partner-marquee{
    width:100%;

    margin-top:55px;

    overflow:hidden;
}

.partner-track{
    display:flex;

    width:max-content;

    animation:partnerScroll 22s linear infinite;
}

.partner-set{
    display:flex;

    align-items:center;

    flex-shrink:0;
}

.partner-set span{
    flex-shrink:0;

    margin-right:30px;

    white-space:nowrap;
}

.partner-outline{
    color:transparent;

    font-size:82px;
    line-height:1;

    font-weight:700;

    letter-spacing:-4px;

    -webkit-text-stroke:1.5px #bdbdbd;
}

.partner-solid{
    color:#000;

    font-size:82px;
    line-height:1;

    font-weight:800;

    letter-spacing:-4px;
}

@keyframes partnerScroll{

    from{
        transform:translateX(0);
    }

    to{
        transform:translateX(-50%);
    }

}



/* =========================================================
SERVICES
========================================================= */

.services-section{
    position:relative;

    width:100%;

    background:#000;

    overflow:hidden;
}



/* =========================================================
SERVICES BLACK TOP
========================================================= */

.services-top{
    position:relative;

    width:100%;

    min-height:560px;

    padding:75px 0 280px;

    background:#020202;

    overflow:hidden;
}

.services-top::before{
    content:"";

    position:absolute;

    width:1250px;
    height:520px;

    left:-380px;
    top:-290px;

    border:1px solid rgba(255,255,255,.045);

    border-radius:50%;

    transform:rotate(15deg);

    box-shadow:
        0 65px 0 rgba(255,255,255,.018),
        0 130px 0 rgba(255,255,255,.014),
        0 195px 0 rgba(255,255,255,.01);
}

.services-top::after{
    content:"";

    position:absolute;

    width:1100px;
    height:490px;

    right:-350px;
    top:-145px;

    border:1px solid rgba(255,255,255,.04);

    border-radius:50%;

    transform:rotate(-13deg);

    box-shadow:
        0 60px 0 rgba(255,255,255,.015),
        0 120px 0 rgba(255,255,255,.01);
}

.services-top-container{
    position:relative;

    z-index:3;

    display:flex;

    align-items:flex-start;
    justify-content:space-between;

    gap:80px;
}

.services-heading-side{
    width:48%;
}

.services-heading-side h2{
    margin-top:18px;

    color:#535353;

    font-size:52px;
    line-height:.97;

    font-weight:700;

    letter-spacing:-1.8px;
}

.services-heading-side h2 span{
    font-weight:400;
}

.services-right-side{
    width:47%;

    padding-top:38px;

    display:flex;

    align-items:center;
    justify-content:space-between;

    gap:45px;
}

.services-right-side p{
    width:100%;
    max-width:470px;

    color:#aaa;

    font-size:16px;
    line-height:1.65;
}

.service-buttons{
    display:flex;

    gap:9px;

    flex-shrink:0;
}

.service-arrow{
    width:50px;
    height:50px;

    display:flex;

    align-items:center;
    justify-content:center;

    background:transparent;

    border:1px dashed rgba(255,255,255,.5);

    border-radius:50%;

    color:#fff;

    cursor:pointer;

    transition:
        background .3s ease,
        border-color .3s ease,
        transform .3s ease;
}

.service-arrow:hover{
    background:#2bb9e9;

    border-color:#2bb9e9;

    transform:translateY(-2px);
}



/* =========================================================
SERVICES CYAN
========================================================= */

.services-cyan{
    position:relative;

    width:100%;

    min-height:720px;

    background:#2bc3dd;

    overflow:visible;

    z-index:1;
}



/* =========================================================
CYAN GEOMETRIC BACKGROUND
z-index 2
========================================================= */

.cyan-line-structure{
    position:absolute;

    inset:0;

    z-index:2;

    width:100%;
    max-width:1440px;

    margin:auto;

    overflow:hidden;

    pointer-events:none;
}

.cyan-shape{
    position:absolute;

    display:block;

    border:1px solid rgba(16,114,139,.32);
}

.cyan-shape-1{
    left:-140px;
    bottom:60px;

    width:430px;
    height:330px;
}

.cyan-shape-1::after{
    content:"";

    position:absolute;

    left:80px;
    top:-1px;

    width:330px;
    height:330px;

    border:1px solid rgba(16,114,139,.32);

    border-radius:50%;
}

.cyan-shape-2{
    left:255px;
    bottom:60px;

    width:440px;
    height:330px;

    border-radius:0 170px 170px 0;
}

.cyan-shape-3{
    left:520px;
    bottom:60px;

    width:530px;
    height:330px;

    border-radius:170px;
}

.cyan-shape-4{
    left:1020px;
    bottom:60px;

    width:530px;
    height:330px;

    border-radius:170px;
}

.cyan-shape-5{
    left:1120px;
    bottom:60px;

    width:330px;
    height:330px;

    border-radius:50%;
}

.cyan-shape-6{
    left:0;
    bottom:390px;

    width:100%;
    height:1px;

    border:0;

    background:rgba(16,114,139,.30);
}



/* =========================================================
SERVICES SLIDER
HALF BLACK / HALF CYAN
========================================================= */

.service-slider{
    position:absolute;

    top:0;
    left:50%;

    z-index:5;

    width:calc(100% - 80px);
    max-width:1440px;

    overflow:hidden;

    transform:translate(-50%, -50%);
}

.service-track{
    display:flex;

    gap:24px;

    width:max-content;

    will-change:transform;
}

.service-card{
    position:relative;

    flex:0 0 calc(
        (min(1440px, calc(100vw - 80px)) - 72px) / 4
    );

    height:560px;

    background:#fff;

    overflow:hidden;

    cursor:pointer;
}

.service-card-bg{
    position:absolute;

    inset:0;

    z-index:1;

    background-image:var(--service-bg);

    background-size:cover;

    background-position:center;

    opacity:0;

    transform:scale(1.08);

    transition:
        opacity .45s ease,
        transform .65s ease;
}

.service-card-overlay{
    position:absolute;

    inset:0;

    z-index:2;

    background:
        linear-gradient(
            180deg,
            rgba(0,0,0,.52),
            rgba(0,0,0,.88)
        );

    opacity:0;

    transition:opacity .45s ease;
}

.service-card-inner{
    position:relative;

    z-index:3;

    height:100%;

    padding:60px 32px 35px;
}

.service-icon{
    height:72px;

    display:flex;

    align-items:center;

    color:#111;

    font-size:34px;

    transition:color .35s ease;
}

.service-card-copy{
    margin-top:65px;
}

.service-card h3{
    margin-bottom:15px;

    color:#050505;

    font-size:26px;
    line-height:1.05;

    font-weight:900;

    letter-spacing:-.8px;

    transition:color .35s ease;
}

.service-card p{
    max-width:245px;

    color:#111;

    font-size:16px;
    line-height:1.55;

    transition:color .35s ease;
}

.service-number{
    position:absolute;

    right:-9px;
    bottom:-22px;

    color:#b3e615;

    font-size:112px;
    line-height:1;

    font-weight:700;

    letter-spacing:-8px;

    transition:color .35s ease;
}

.service-hover-button{
    position:absolute;

    left:32px;
    bottom:105px;

    display:flex;

    align-items:center;

    gap:3px;

    opacity:0;

    transform:translateY(15px);

    transition:
        opacity .35s ease,
        transform .35s ease;
}

.service-hover-button > a:first-child{
    min-width:145px;
    height:52px;

    padding:0 25px;

    display:flex;

    align-items:center;
    justify-content:center;

    background:#2bb4e8;

    border-radius:30px;

    color:#fff;

    font-size:14px;

    font-weight:700;
}

.service-round-link{
    width:52px;
    height:52px;

    display:flex;

    align-items:center;
    justify-content:center;

    background:#2bb4e8;

    border-radius:50%;

    color:#fff;

    font-size:22px;
}



/* SERVICE HOVER */

.service-card:hover .service-card-bg{
    opacity:1;

    transform:scale(1);
}

.service-card:hover .service-card-overlay{
    opacity:1;
}

.service-card:hover .service-icon,
.service-card:hover h3,
.service-card:hover p{
    color:#fff;
}

.service-card:hover .service-number{
    color:rgba(255,255,255,.14);
}

.service-card:hover .service-hover-button{
    opacity:1;

    transform:translateY(0);
}



/* =========================================================
CYAN BIG TEXT
z-index 3
========================================================= */

.strategy-marquee{
    position:absolute;

    left:0;
    right:0;
    bottom:200px;

    z-index:3;

    overflow:hidden;
}

.strategy-track{
    display:flex;

    width:max-content;

    animation:strategyScroll 24s linear infinite;
}

.strategy-track span{
    flex-shrink:0;

    padding-right:75px;

    color:#000;

    font-size:76px;
    line-height:1;

    font-weight:800;

    letter-spacing:-4px;

    white-space:nowrap;
}

@keyframes strategyScroll{

    from{
        transform:translateX(0);
    }

    to{
        transform:translateX(-50%);
    }

}



/* =========================================================
WORK PROCESS
========================================================= */

.work-process-section{
    position:relative;

    width:100%;

    padding:95px 0 90px;

    background:#020202;

    overflow:hidden;

    color:#fff;
}

.work-bg-line{
    position:absolute;

    pointer-events:none;

    border:2px solid rgba(255,255,255,.026);

    border-radius:50%;
}

.work-bg-line-one{
    width:1250px;
    height:450px;

    right:-420px;
    top:-40px;

    transform:rotate(-18deg);

    box-shadow:
        0 55px 0 rgba(255,255,255,.014),
        0 110px 0 rgba(255,255,255,.01),
        0 165px 0 rgba(255,255,255,.008);
}

.work-bg-line-two{
    width:1050px;
    height:380px;

    left:-390px;
    bottom:-80px;

    transform:rotate(14deg);
}

.work-process-container{
    position:relative;

    z-index:2;

    display:grid;

    grid-template-columns:55% 45%;

    align-items:stretch;
}



/* =========================================================
WORK IMAGE SHAPE
========================================================= */

.work-image-column{
    position:relative;

    min-height:640px;
}

.work-image-shape{
    position:absolute;

    top:0;
    bottom:0;

    left:0;
    right:40px;

    overflow:hidden;

    background:#111;

    border-radius:
        65px
        70px
        0
        65px;
}

.work-image-shape img{
    width:100%;
    height:100%;

    object-fit:cover;

    object-position:center;

    display:block;
}

/*
Creates the large curved right-bottom cut-out.
*/

.work-image-shape::after{
    content:"";

    position:absolute;

    right:-3px;
    bottom:-3px;

    z-index:2;

    width:61%;
    height:35%;

    background:#020202;

    border-radius:190px 0 0 0;
}



/* =========================================================
WORK CONTENT
========================================================= */

.work-content-column{
    padding:45px 0 0 35px;
}

.work-content-column h2{
    margin-top:28px;

    color:#fff;

    font-size:49px;
    line-height:1.05;

    font-weight:300;

    letter-spacing:-2px;
}

.work-content-column h2 strong{
    font-weight:700;
}

.work-intro{
    max-width:620px;

    margin-top:48px;

    color:#ddd;

    font-size:17px;
    line-height:1.8;
}



/* =========================================================
PROCESS STEPS
========================================================= */

.process-steps{
    position:relative;

    margin-top:85px;

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:38px;
}

.process-steps::before{
    content:"";

    position:absolute;

    top:30px;

    left:30px;
    right:30px;

    height:1px;

    background:#2b2b2b;
}

.process-step{
    position:relative;

    z-index:2;
}

.process-circle{
    position:relative;

    z-index:3;

    width:60px;
    height:60px;

    display:flex;

    align-items:center;
    justify-content:center;

    background:#2a2a2a;

    border-radius:50%;

    color:#fff;

    font-size:22px;
}

.process-step h3{
    margin-top:43px;

    color:#fff;

    font-size:23px;
    line-height:1.3;

    font-weight:600;
}

.process-step p{
    max-width:210px;

    margin-top:24px;

    color:#d9d9d9;

    font-size:15px;
    line-height:1.65;
}



/* =========================================================
STATS
========================================================= */

.stats-row{
    position:relative;

    z-index:3;

    width:calc(100% - 80px);
    max-width:920px;

    margin:75px auto 0;

    display:grid;

    grid-template-columns:repeat(4,1fr);

    border:1px solid rgba(255,255,255,.85);
}

.stat-box{
    min-height:105px;

    display:flex;

    flex-direction:column;

    align-items:center;
    justify-content:center;

    text-align:center;

    border-right:1px solid rgba(255,255,255,.85);
}

.stat-box:last-child{
    border-right:0;
}

.stat-box strong{
    margin-bottom:10px;

    color:#fff;

    font-size:36px;
    line-height:1;
}

.stat-box span{
    color:#fff;

    font-size:13px;

    font-weight:600;
}



/* =========================================================
CATEGORIES
========================================================= */

.categories-section{
    width:100%;

    padding:85px 0 35px;

    background:#fff;
}


.categories-container{
    max-width: 1140px;
}

.categories-container h2{
    margin-bottom:50px;

    text-align:center;

    color:#123f78;

    font-size:30px;
    line-height:1.25;

    font-weight:400;
}

.categories-grid{
    display:grid;

    grid-template-columns:repeat(4,1fr);

    border-top:1px solid #e2e6ea;

    border-left:1px solid #e2e6ea;
}

.category-card{
    min-height:185px;

    padding:30px 20px;

    display:flex;

    flex-direction:column;

    align-items:center;
    justify-content:center;

    text-align:center;

    border-right:1px solid #e2e6ea;

    border-bottom:1px solid #e2e6ea;

    transition:background .3s ease;
}

.category-card:hover{
    background:#f7f9fb;
}

.category-icon{
    height:48px;

    margin-bottom:17px;

    display:flex;

    align-items:center;
    justify-content:center;

    color:#000;

    font-size:26px;
}

.category-card p{
    color:#073c78;

    font-size:22px;
    line-height:1.45;
}





/* =========================================================
CLIENT LOGO MARQUEES
========================================================= */

.logos-section{
    width:100%;

    padding:30px 0 55px;

    background:#fff;

    overflow:hidden;
}

.client-marquee{
    width:100%;

    padding:25px 0;

    overflow:hidden;

    background:#fff;
}

.logo-track{
    display:flex;

    width:max-content;

    will-change:transform;
}

.logo-set{
    display:flex;

    align-items:center;

    flex-shrink:0;

    gap:60px;

    padding-right:60px;
}

.logo-set img{
    width:100px !important;
    height:128px;

    flex:0 0 170px;

    object-fit:contain;
}

.logo-track-forward{
    animation:logoForward 75s linear infinite;
}

.logo-track-reverse{
    animation:logoForward 75s linear infinite reverse;
}

.client-marquee:hover .logo-track{
    animation-play-state:paused;
}

@keyframes logoForward{

    from{
        transform:translateX(0);
    }

    to{
        transform:translateX(-50%);
    }

}



/* =========================================================
LARGE DESKTOP
========================================================= */

@media(min-width:1600px){

    .hero-content h1{
        font-size:78px;
    }

}



/* =========================================================
1200PX
========================================================= */

@media(max-width:1200px){

    .hero-content h1{
        font-size:64px;
    }

    .hero-content p{
        font-size:23px;
    }

    .service-card{
        flex:0 0 calc(
            (min(1440px, calc(100vw - 80px)) - 48px) / 3
        );
    }

    .work-process-container{
        grid-template-columns:52% 48%;
    }

    .work-content-column h2{
        font-size:42px;
    }

    .process-step h3{
        font-size:20px;
    }

}



/* =========================================================
TABLET
========================================================= */

@media(max-width:900px){

    .inner-container{
        width:calc(100% - 50px);
    }


    /* HERO */

    .hero-banner{
        height:600px;
        min-height:600px;
    }

    .hero-content h1{
        font-size:52px;
    }

    .hero-content p{
        font-size:20px;
    }


    /* ETHIOPIA */

    .ethiopia-container{
        flex-direction:column;

        align-items:flex-start;
    }

    .ethiopia-content,
    .ethiopia-image{
        width:100%;
    }


    /* ABOUT */

    .about-inner{
        width:calc(100% - 50px);
    }

    .about-top{
        flex-direction:column;

        gap:60px;
    }

    .about-image-wrap,
    .about-content{
        width:100%;
    }

    .about-columns{
        grid-template-columns:1fr;

        gap:35px;
    }


    /* SERVICES */

    .services-top{
        min-height:610px;

        padding-bottom:290px;
    }

    .services-top-container{
        flex-direction:column;

        gap:25px;
    }

    .services-heading-side,
    .services-right-side{
        width:100%;
    }

    .services-right-side{
        padding-top:0;
    }

    .service-slider{
        width:calc(100% - 50px);
    }

    .service-card{
        flex:0 0 calc(
            (100vw - 74px) / 2
        );

        height:520px;
    }

    .strategy-track span{
        font-size:58px;
    }


    /* WORK */

    .work-process-container{
        grid-template-columns:1fr;
    }

    .work-image-column{
        min-height:590px;
    }

    .work-image-shape{
        right:0;
    }

    .work-content-column{
        padding:65px 0 0;
    }

    .process-step p{
        max-width:240px;
    }


    /* STATS */

    .stats-row{
        width:calc(100% - 50px);

        grid-template-columns:repeat(2,1fr);
    }

    .stat-box:nth-child(2){
        border-right:0;
    }

    .stat-box:nth-child(1),
    .stat-box:nth-child(2){
        border-bottom:1px solid rgba(255,255,255,.85);
    }


    /* CATEGORY */

    .categories-grid{
        grid-template-columns:repeat(2,1fr);
    }


    /* TESTIMONIAL */

    .testimonials-grid{
        grid-template-columns:repeat(2,1fr);
    }

}



/* =========================================================
MOBILE
========================================================= */

@media(max-width:600px){

    .inner-container{
        width:calc(100% - 36px);
    }


    /* HERO */

    .hero-banner{
        height:500px;
        min-height:500px;
    }

    .hero-content h1{
        font-size:38px;
        line-height:1.2;
    }

    .hero-content p{
        font-size:17px;
        font-weight:500;
    }


    /* ETHIOPIA */

    .ethiopia-section{
        padding:50px 0;
    }

    .ethiopia-content h2{
        font-size:34px;
        line-height:1.08;
    }


    /* ABOUT */

    .about-section{
        padding:60px 0 45px;
    }

    .about-inner{
        width:calc(100% - 36px);
    }

    .about-main-img{
        border-radius:80px 80px 80px 0;
    }

    .circle-badge{
        top:-28px;
        right:-4px;

        width:90px;
        height:90px;
    }

    .circle-badge svg{
        width:82px;
        height:82px;
    }

    .circle-badge img{
        width:28px;
    }

    .about-content h2{
        font-size:31px;
    }

    .about-description{
        flex-direction:column;

        gap:20px;
    }

    .partner-outline,
    .partner-solid{
        font-size:48px;
    }


    /* SERVICES */

    .services-top{
        min-height:560px;

        padding:
            65px
            0
            230px;
    }

    .services-heading-side h2{
        font-size:39px;
    }

    .services-right-side{
        display:block;
    }

    .services-right-side p{
        font-size:15px;
    }

    .service-buttons{
        margin-top:22px;
    }

    .services-cyan{
        min-height:620px;
    }

    .service-slider{
        width:calc(100% - 36px);
    }

    .service-track{
        gap:14px;
    }

    .service-card{
        flex:0 0 calc(100vw - 62px);

        height:470px;
    }

    .service-card-inner{
        padding:50px 25px 30px;
    }

    .service-card-copy{
        margin-top:42px;
    }

    .service-card h3{
        font-size:24px;
    }

    .service-card p{
        font-size:15px;
    }

    .service-number{
        font-size:96px;
    }

    .service-hover-button{
        left:25px;

        bottom:92px;
    }

    .strategy-marquee{
        bottom:65px;
    }

    .strategy-track span{
        padding-right:35px;

        font-size:42px;

        letter-spacing:-2px;
    }


    /* WORK PROCESS */

    .work-process-section{
        padding:60px 0;
    }

    .work-image-column{
        min-height:450px;
    }

    .work-image-shape{
        border-radius:40px 45px 0 40px;
    }

    .work-image-shape::after{
        width:61%;
        height:68%;

        border-radius:115px 0 0 0;
    }

    .work-content-column{
        padding:55px 0 0;
    }

    .work-content-column h2{
        font-size:35px;

        letter-spacing:-1px;
    }

    .work-intro{
        margin-top:30px;

        font-size:15px;
    }

    .process-steps{
        margin-top:55px;

        grid-template-columns:1fr;

        gap:42px;
    }

    .process-steps::before{
        display:none;
    }

    .process-circle{
        width:48px;
        height:48px;

        font-size:17px;
    }

    .process-step h3{
        margin-top:22px;

        font-size:20px;
    }

    .process-step p{
        max-width:100%;

        margin-top:15px;

        font-size:14px;
    }


    /* STATS */

    .stats-row{
        width:calc(100% - 36px);

        margin-top:60px;
    }

    .stat-box{
        min-height:95px;
    }

    .stat-box strong{
        font-size:28px;
    }

    .stat-box span{
        font-size:10px;
    }


    /* CATEGORIES */

    .categories-section{
        padding:60px 0 25px;
    }

    .categories-container h2{
        margin-bottom:38px;

        font-size:22px;
        line-height:1.35;
    }

    .category-card{
        min-height:145px;

        padding:24px 10px;
    }

    .category-icon{
        font-size:22px;
    }

    .category-card p{
        font-size:13px;
    }


    /* TESTIMONIAL */

    .testimonials-section{
        padding:55px 0 30px;
    }

    .testimonials-grid{
        grid-template-columns:1fr;
    }

    .google-review-summary{
        justify-content:center;

        margin-bottom:10px;
    }


    /* LOGOS */

    .logo-set{
        gap:35px;

        padding-right:35px;
    }

    .logo-set img{
        width:125px;
        height:68px;

        flex-basis:125px;
    }

}
/* =========================================================
LOCAL ICON FALLBACKS — no external icon/font dependency
========================================================= */
.fa-solid{font-style:normal;font-family:Arial,Helvetica,sans-serif;font-weight:700;line-height:1}.fa-arrow-left::before{content:"←"}.fa-arrow-right::before{content:"→"}.fa-gears::before,.fa-gear::before{content:"⚙"}.fa-brain::before{content:"◇"}.fa-code::before{content:"</>";font-size:.72em}.fa-magnifying-glass-chart::before{content:"⌕"}.fa-bullhorn::before{content:"◖"}.fa-scale-balanced::before{content:"⚖"}.fa-calculator::before{content:"∑"}.fa-staff-snake::before{content:"⚕"}.fa-hotel::before{content:"▥"}.fa-bag-shopping::before{content:"▣"}.fa-chess-rook::before{content:"♜"}.fa-plane::before{content:"✈"}.fa-building::before{content:"▦"}.fa-graduation-cap::before{content:"⌂"}.fa-laptop-code::before{content:"⌘"}.fa-spa::before{content:"✦"}.fa-film::before{content:"▤"}

/* =========================================================
HOME RESPONSIVE HARDENING
========================================================= */
@media(max-width:1024px){.home-page .hero-banner{height:min(78vh,720px);min-height:560px}.home-page .hero-content{padding-inline:0}.home-page .hero-content h1{font-size:clamp(46px,7vw,64px)}.home-page .hero-content p{font-size:clamp(18px,2.5vw,23px)}.home-page .ethiopia-container{gap:42px}.home-page .about-top{gap:48px}.home-page .services-top-container{gap:35px}.home-page .services-heading-side h2{font-size:clamp(44px,6vw,64px)}.home-page .work-process-container{gap:45px}.home-page .logos-section{overflow:hidden}}
@media(max-width:768px){.home-page .inner-container{width:calc(100% - 36px)}.home-page .hero-banner{height:540px;min-height:540px}.home-page .hero-content h1{font-size:clamp(38px,10vw,54px);line-height:1.08}.home-page .hero-content p{font-size:17px;max-width:560px;margin:auto}.home-page .ethiopia-section{padding:45px 0}.home-page .ethiopia-content h2{font-size:clamp(34px,8vw,48px)}.home-page .about-top{gap:42px}.home-page .about-columns{grid-template-columns:1fr}.home-page .services-top{padding-top:70px}.home-page .service-card{flex:0 0 calc(100vw - 56px);max-width:500px}.home-page .work-image-column{min-height:470px}.home-page .process-steps{grid-template-columns:1fr}.home-page .process-steps::before{display:none}.home-page .process-step p{max-width:none}.home-page .categories-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.home-page .logo-set img{width:120px;height:70px;flex-basis:120px}}
@media(max-width:480px){.home-page .inner-container,.home-page .about-inner,.home-page .stats-row,.home-page .service-slider{width:calc(100% - 28px)}.home-page .hero-banner{height:500px;min-height:500px}.home-page .hero-content h1{font-size:36px}.home-page .hero-content p{font-size:15px}.home-page .ethiopia-content h2{font-size:32px}.home-page .about-content h2{font-size:29px}.home-page .services-heading-side h2{font-size:36px}.home-page .service-card{flex-basis:calc(100vw - 42px);height:445px}.home-page .work-image-column{min-height:380px}.home-page .work-content-column h2{font-size:32px}.home-page .stats-row{grid-template-columns:1fr 1fr}.home-page .categories-grid{grid-template-columns:1fr 1fr}.home-page .category-card{min-height:130px}.home-page .logo-set{gap:25px;padding-right:25px}.home-page .logo-set img{width:105px;height:62px;flex-basis:105px}}
