/* =========================================================
   UBUNTU LTD — SERVICES ARCHIVE
========================================================= */


/* =========================================================
   PAGE
========================================================= */

.u-services-page {
    background:
        #fff;

    color:
        var(--ink);
}


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

.u-services-hero {
    position:
        relative;

    padding:
        clamp(
            150px,
            17vw,
            220px
        )
        0
        clamp(
            70px,
            9vw,
            120px
        );

    background:
        var(--bark);

    color:
        var(--husk);

    overflow:
        hidden;
}


.u-services-hero::after {
    content:
        "";

    position:
        absolute;

    right:
        -140px;

    bottom:
        -210px;

    width:
        520px;

    height:
        520px;

    border:
        1px solid
        rgba(
            235,
            237,
            228,
            .11
        );

    border-radius:
        50%;

    pointer-events:
        none;
}


.u-services-hero-inner {
    position:
        relative;

    z-index:
        1;

    display:
        grid;

    grid-template-columns:
        minmax(
            0,
            1.55fr
        )
        minmax(
            260px,
            .65fr
        );

    gap:
        clamp(
            40px,
            8vw,
            120px
        );

    align-items:
        end;
}


.u-services-hero .kicker {
    color:
        var(--amber-soft);
}


.u-services-hero h1 {
    max-width:
        12ch;

    margin:
        0;

    font-size:
        clamp(
            3rem,
            7vw,
            6.4rem
        );

    font-weight:
        400;

    line-height:
        .96;

    letter-spacing:
        -.035em;
}


.u-services-hero h1 em {
    display:
        block;

    color:
        var(--amber-soft);

    font-style:
        italic;
}


.u-services-hero-text {
    max-width:
        590px;

    margin:
        28px 0 0;

    color:
        rgba(
            235,
            237,
            228,
            .72
        );

    font-size:
        1rem;

    line-height:
        1.75;
}


.u-services-hero-actions {
    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        12px;

    margin-top:
        32px;
}


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

.u-services-hero-side > p {
    margin:
        0 0 17px;

    color:
        rgba(
            235,
            237,
            228,
            .48
        );

    font-size:
        .68rem;

    font-weight:
        700;

    letter-spacing:
        .12em;

    text-transform:
        uppercase;
}


.u-services-hero-list {
    border-top:
        1px solid
        var(--line-dark);
}


.u-services-hero-list a {
    display:
        grid;

    grid-template-columns:
        38px
        1fr;

    gap:
        15px;

    align-items:
        center;

    padding:
        16px 0;

    border-bottom:
        1px solid
        var(--line-dark);

    color:
        var(--husk);

    text-decoration:
        none;

    transition:
        padding-left .25s ease,
        color .25s ease;
}


.u-services-hero-list a:hover {
    padding-left:
        8px;

    color:
        var(--amber-soft);
}


.u-services-hero-list span {
    color:
        var(--amber);

    font-family:
        monospace;

    font-size:
        .7rem;
}


.u-services-hero-list strong {
    font-size:
        .88rem;

    font-weight:
        600;
}


/* =========================================================
   INTRO
========================================================= */

.u-services-intro {
    padding:
        clamp(
            65px,
            8vw,
            115px
        )
        0;

    background:
        #DDE1D4;
}


.u-services-intro-grid {
    display:
        grid;

    grid-template-columns:
        minmax(
            180px,
            .55fr
        )
        minmax(
            0,
            1.45fr
        );

    gap:
        clamp(
            35px,
            8vw,
            120px
        );
}


.u-services-intro h2 {
    max-width:
        20ch;

    margin:
        0;

    color:
        var(--bark);

    font-size:
        clamp(
            2.1rem,
            4vw,
            3.7rem
        );

    font-weight:
        400;

    line-height:
        1.05;
}


.u-services-intro-grid > div:last-child > p {
    max-width:
        650px;

    color:
        var(--ink-60);

    line-height:
        1.75;
}


.u-services-intro-grid > div:last-child > p:first-of-type {
    margin-top:
        25px;
}


/* =========================================================
   SERVICE CATALOGUE
========================================================= */

.u-services-catalogue {
    background:
        #fff;

    padding:
        clamp(
            75px,
            9vw,
            130px
        )
        0;
}


/* =========================================================
   GROUP
========================================================= */

.u-service-group {
    scroll-margin-top:
        110px;

    padding:
        clamp(
            60px,
            8vw,
            105px
        )
        0;

    border-top:
        1px solid
        var(--line);
}


.u-service-group:first-child {
    padding-top:
        0;

    border-top:
        0;
}


.u-service-group-head {
    display:
        grid;

    grid-template-columns:
        minmax(
            90px,
            .3fr
        )
        minmax(
            0,
            1.7fr
        );

    gap:
        clamp(
            25px,
            6vw,
            80px
        );

    margin-bottom:
        clamp(
            36px,
            5vw,
            60px
        );
}


.u-service-group-number {
    color:
        var(--amber);

    font-family:
        monospace;

    font-size:
        clamp(
            2.2rem,
            4vw,
            4rem
        );

    line-height:
        1;
}


.u-service-group-head h2 {
    margin:
        0;

    color:
        var(--bark);

    font-size:
        clamp(
            2rem,
            4vw,
            3.5rem
        );

    font-weight:
        400;

    line-height:
        1;
}


.u-service-group-head p:not(.kicker) {
    max-width:
        620px;

    margin:
        15px 0 0;

    color:
        var(--ink-60);

    line-height:
        1.7;
}


/* =========================================================
   SERVICE GRID
========================================================= */

.u-service-grid {
    display:
        grid;

    grid-template-columns:
        repeat(
            2,
            minmax(
                0,
                1fr
            )
        );

    gap:
        clamp(
            18px,
            3vw,
            32px
        );
}


/* =========================================================
   SERVICE CARD
========================================================= */

.u-service-card {
    display:
        grid;

    grid-template-columns:
        minmax(
            180px,
            .82fr
        )
        minmax(
            0,
            1.18fr
        );

    min-height:
        330px;

    border:
        1px solid
        var(--line);

    background:
        var(--paper);

    overflow:
        hidden;

    transition:
        transform .35s ease,
        box-shadow .35s ease,
        border-color .35s ease;
}


.u-service-card:hover {
    transform:
        translateY(-5px);

    border-color:
        rgba(
            19,
            35,
            26,
            .25
        );

    box-shadow:
        0 24px 50px
        rgba(
            19,
            35,
            26,
            .08
        );
}


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

.u-service-card-art {
    position:
        relative;

    display:
        block;

    min-height:
        100%;

    overflow:
        hidden;

    background:
        var(--husk);
}


.u-service-card-art img {
    display:
        block;

    width:
        100%;

    height:
        100%;

    object-fit:
        cover;

    object-position:
        center;

    transition:
        transform .7s
        cubic-bezier(
            .2,
            .8,
            .3,
            1
        );
}


.u-service-card:hover
.u-service-card-art img {
    transform:
        scale(1.045);
}


.u-service-card-art-empty {
    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    min-height:
        280px;

    background:
        var(--bark);
}


.u-service-card-art-empty span {
    color:
        var(--amber);

    font-family:
        var(--serif);

    font-size:
        1.2rem;
}


/* =========================================================
   CARD BODY
========================================================= */

.u-service-card-body {
    display:
        flex;

    flex-direction:
        column;

    min-width:
        0;

    padding:
        clamp(
            23px,
            3vw,
            36px
        );
}


.u-service-card-meta {
    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        20px;

    margin-bottom:
        30px;

    color:
        var(--ink-60);

    font-size:
        .65rem;

    font-weight:
        700;

    letter-spacing:
        .09em;

    text-transform:
        uppercase;
}


.u-service-card-meta span:first-child {
    color:
        var(--amber);
}


.u-service-card h3 {
    margin:
        0;

    font-size:
        clamp(
            1.45rem,
            2.5vw,
            2rem
        );

    font-weight:
        500;

    line-height:
        1.08;
}


.u-service-card h3 a {
    color:
        var(--bark);

    text-decoration:
        none;
}


.u-service-card-body > p {
    margin:
        15px 0 25px;

    color:
        var(--ink-60);

    font-size:
        .87rem;

    line-height:
        1.65;
}


.u-service-card-link {
    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        20px;

    margin-top:
        auto;

    padding-top:
        16px;

    border-top:
        1px solid
        var(--line);

    color:
        var(--bark);

    font-size:
        .76rem;

    font-weight:
        800;

    letter-spacing:
        .05em;

    text-decoration:
        none;

    text-transform:
        uppercase;
}


.u-service-card-link span:last-child {
    transition:
        transform .25s ease;
}


.u-service-card-link:hover
span:last-child {
    transform:
        translateX(5px);
}


/* =========================================================
   EMPTY
========================================================= */

.u-services-empty {
    max-width:
        680px;

    padding:
        60px 0;
}


.u-services-empty h2 {
    margin:
        0;

    font-size:
        clamp(
            2rem,
            4vw,
            3.5rem
        );

    font-weight:
        400;
}


.u-services-empty > p:not(.kicker) {
    margin:
        20px 0 28px;

    color:
        var(--ink-60);

    line-height:
        1.7;
}


/* =========================================================
   PRODUCTS
========================================================= */

.u-services-products {
    padding:
        clamp(
            70px,
            9vw,
            125px
        )
        0;

    background:
        #DDE1D4;
}


.u-services-products-head {
    display:
        grid;

    grid-template-columns:
        minmax(
            0,
            1.35fr
        )
        minmax(
            250px,
            .65fr
        );

    gap:
        clamp(
            30px,
            7vw,
            100px
        );

    align-items:
        end;

    margin-bottom:
        clamp(
            40px,
            6vw,
            70px
        );
}


.u-services-products-head h2 {
    max-width:
        15ch;

    margin:
        0;

    color:
        var(--bark);

    font-size:
        clamp(
            2.2rem,
            4.6vw,
            4rem
        );

    font-weight:
        400;

    line-height:
        1.02;
}


.u-services-products-head h2 em {
    display:
        block;

    color:
        var(--clay);

    font-style:
        italic;
}


.u-services-products-intro p {
    margin:
        0 0 20px;

    color:
        var(--ink-60);

    line-height:
        1.7;
}


.u-services-products-all {
    display:
        inline-flex;

    align-items:
        center;

    gap:
        9px;

    padding-bottom:
        4px;

    border-bottom:
        1px solid
        var(--bark);

    color:
        var(--bark);

    font-size:
        .8rem;

    font-weight:
        700;

    text-decoration:
        none;
}


/* =========================================================
   PRODUCTS GRID
========================================================= */

.u-services-products-grid {
    display:
        grid;

    grid-template-columns:
        repeat(
            3,
            minmax(
                0,
                1fr
            )
        );

    gap:
        clamp(
            18px,
            2.4vw,
            30px
        );
}


.u-services-product {
    display:
        flex;

    flex-direction:
        column;

    min-width:
        0;

    border:
        1px solid
        rgba(
            19,
            35,
            26,
            .13
        );

    background:
        #fff;

    transition:
        transform .35s ease,
        box-shadow .35s ease;
}


.u-services-product:hover {
    transform:
        translateY(-5px);

    box-shadow:
        0 22px 45px
        rgba(
            19,
            35,
            26,
            .08
        );
}


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

.u-services-product-art {
    position:
        relative;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    aspect-ratio:
        1 / 1;

    padding:
        30px;

    background:
        rgba(
            255,
            255,
            255,
            .35
        );

    overflow:
        hidden;
}


.u-services-product-art img {
    display:
        block;

    width:
        88%;

    height:
        88%;

    object-fit:
        contain;

    object-position:
        center;

    transition:
        transform .5s ease;
}


.u-services-product:hover
.u-services-product-art img {
    transform:
        scale(1.04);
}


.u-services-product-sale {
    position:
        absolute;

    top:
        14px;

    left:
        14px;

    padding:
        6px 9px;

    background:
        var(--clay);

    color:
        #fff;

    font-size:
        .62rem;

    font-weight:
        800;

    letter-spacing:
        .08em;

    text-transform:
        uppercase;
}


/* =========================================================
   PRODUCT BODY
========================================================= */

.u-services-product-body {
    flex:
        1;

    display:
        flex;

    flex-direction:
        column;

    padding:
        24px;
}


.u-services-product-cat {
    margin:
        0 0 8px;

    color:
        var(--leaf);

    font-size:
        .66rem;

    font-weight:
        800;

    letter-spacing:
        .09em;

    text-transform:
        uppercase;
}


.u-services-product h3 {
    margin:
        0;

    font-size:
        1.3rem;

    font-weight:
        500;
}


.u-services-product h3 a {
    color:
        var(--bark);

    text-decoration:
        none;
}


.u-services-product-desc {
    margin:
        12px 0 0;

    color:
        var(--ink-60);

    font-size:
        .84rem;

    line-height:
        1.6;
}


.u-services-product-price {
    margin:
        auto 0 18px;

    padding-top:
        20px;

    color:
        var(--bark);

    font-family:
        var(--serif);

    font-size:
        1.15rem;

    font-weight:
        700;
}


.u-services-product-price del {
    color:
        var(--ink-60);

    font-size:
        .78rem;

    opacity:
        .6;
}


.u-services-product-price ins {
    color:
        var(--clay);

    text-decoration:
        none;
}


.u-services-product-link {
    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        15px;

    padding:
        13px 15px;

    background:
        var(--bark);

    color:
        var(--husk);

    font-size:
        .75rem;

    font-weight:
        700;

    text-decoration:
        none;
}


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

.u-services-cta {
    padding:
        clamp(
            65px,
            8vw,
            110px
        )
        0;

    background:
        var(--bark);

    color:
        var(--husk);
}


.u-services-cta-inner {
    display:
        grid;

    grid-template-columns:
        minmax(
            0,
            1.35fr
        )
        minmax(
            260px,
            .65fr
        );

    gap:
        clamp(
            35px,
            8vw,
            110px
        );

    align-items:
        end;
}


.u-services-cta .kicker {
    color:
        var(--amber-soft);
}


.u-services-cta h2 {
    max-width:
        15ch;

    margin:
        0;

    font-size:
        clamp(
            2.3rem,
            5vw,
            4.4rem
        );

    font-weight:
        400;

    line-height:
        1;
}


.u-services-cta-copy p {
    margin:
        0 0 25px;

    color:
        rgba(
            235,
            237,
            228,
            .7
        );

    line-height:
        1.7;
}


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

@media (max-width: 1000px) {

    .u-services-hero-inner {
        grid-template-columns:
            1fr
            280px;
    }


    .u-service-grid {
        grid-template-columns:
            1fr;
    }


    .u-services-products-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(
                    0,
                    1fr
                )
            );
    }

}


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

@media (max-width: 760px) {

    .u-services-hero {
        padding-top:
            125px;
    }


    .u-services-hero-inner,
    .u-services-intro-grid,
    .u-service-group-head,
    .u-services-products-head,
    .u-services-cta-inner {
        grid-template-columns:
            1fr;
    }


    .u-services-hero-side {
        margin-top:
            15px;
    }


    .u-services-hero h1 {
        max-width:
            15ch;
    }


    .u-service-group-number {
        font-size:
            2rem;
    }


    .u-service-card {
        grid-template-columns:
            1fr;

        min-height:
            0;
    }


    .u-service-card-art {
        aspect-ratio:
            16 / 10;

        min-height:
            0;
    }


    .u-services-products-grid {
        grid-template-columns:
            1fr;
    }


    .u-services-product-art {
        aspect-ratio:
            4 / 3;
    }

}



/* =========================================================
   SERVICES PAGE — PRODUCTS CTA
========================================================= */

.u-services-shop {
    padding: clamp(70px, 8vw, 110px) 0;
    background: var(--husk);
}

.u-services-shop-inner {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr);
    gap: clamp(40px, 7vw, 90px);
    align-items: end;
}

.u-services-shop .kicker {
    margin-bottom: 14px;
    color: var(--leaf);
}

.u-services-shop h2 {
    max-width: 14ch;
    margin: 0;
    color: var(--bark);
    font-size: clamp(2.4rem, 4.5vw, 4.2rem);
    font-weight: 400;
    line-height: 1.02;
    letter-spacing: -.025em;
}

.u-services-shop-copy {
    max-width: 480px;
    padding-left: clamp(0px, 3vw, 40px);
    border-left: 1px solid var(--line);
}

.u-services-shop-copy p {
    margin: 0 0 26px;
    color: var(--ink-60);
    font-size: .98rem;
    line-height: 1.75;
}

.u-services-shop-copy .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}


/* MOBILE */

@media (max-width: 760px) {

    .u-services-shop-inner {
        grid-template-columns: 1fr;
        gap: 28px;
    }

    .u-services-shop h2 {
        max-width: none;
    }

    .u-services-shop-copy {
        max-width: none;
        padding-left: 0;
        padding-top: 24px;
        border-left: 0;
        border-top: 1px solid var(--line);
    }

}




/* =========================================================
   SERVICE CATEGORY ARCHIVE
========================================================= */


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

.u-service-category-hero {
    position: relative;
}

.u-service-category-hero .u-services-hero-inner {
    align-items: end;
}

.u-service-category-hero .u-services-hero-copy h1 {
    max-width: 12ch;
}

.u-service-category-hero .u-services-hero-text {
    max-width: 650px;
}


/* =========================================================
   BREADCRUMB
========================================================= */

.u-service-category-breadcrumb {
    position: relative;
    z-index: 2;

    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;

    margin-bottom: clamp(30px, 4vw, 50px);

    color: rgba(235, 237, 228, .5);

    font-size: .66rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.u-service-category-breadcrumb a {
    color: rgba(235, 237, 228, .72);
    text-decoration: none;
    transition: color .2s ease;
}

.u-service-category-breadcrumb a:hover {
    color: var(--amber-soft);
}

.u-service-category-breadcrumb span[aria-hidden="true"] {
    color: rgba(235, 237, 228, .26);
}


/* =========================================================
   ACTIVE CATEGORY LINK IN HERO
========================================================= */

.u-service-category-hero
.u-services-hero-list
a[aria-current="page"] {
    padding-left: 8px;
    color: var(--amber-soft);
}

.u-service-category-hero
.u-services-hero-list
a[aria-current="page"] span {
    color: var(--amber-soft);
}


/* =========================================================
   CATEGORY SERVICES SECTION
========================================================= */

.u-service-category-page
.u-services-catalogue {
    background: #ffffff;
}

.u-service-category-page
.u-service-group-head {
    margin-bottom: clamp(35px, 5vw, 55px);
}


/* =========================================================
   CATEGORY PAGINATION
========================================================= */

.u-service-category-pagination {
    margin-top: clamp(45px, 7vw, 75px);
}

.u-service-category-pagination ul {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;

    gap: 8px;

    margin: 0;
    padding: 0;

    list-style: none;
}

.u-service-category-pagination li {
    margin: 0;
}

.u-service-category-pagination a,
.u-service-category-pagination span {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 44px;
    min-height: 44px;

    padding: 10px 14px;

    border: 1px solid var(--line);

    background: #ffffff;
    color: var(--bark);

    font-size: .75rem;
    font-weight: 700;

    text-decoration: none;

    transition:
        background .2s ease,
        color .2s ease,
        border-color .2s ease;
}

.u-service-category-pagination a:hover {
    background: var(--bark);
    border-color: var(--bark);
    color: var(--husk);
}

.u-service-category-pagination .current {
    background: var(--amber);
    border-color: var(--amber);
    color: var(--bark);
}


/* =========================================================
   MORE BUSINESS LINES
========================================================= */

.u-service-category-more {
    padding:
        clamp(70px, 9vw, 115px)
        0;

    background: #DDE1D4;
}


/* =========================================================
   MORE BUSINESS LINES HEADER
========================================================= */

.u-service-category-more-head {
    display: flex;
    align-items: end;
    justify-content: space-between;

    gap: 30px;

    margin-bottom: clamp(35px, 5vw, 55px);
}

.u-service-category-more-head .kicker {
    margin-bottom: 13px;
    color: var(--leaf);
}

.u-service-category-more-head h2 {
    max-width: 15ch;
    margin: 0;

    color: var(--bark);

    font-family: "Fraunces", serif;
    font-size: clamp(2.2rem, 4vw, 3.7rem);
    font-weight: 400;
    line-height: 1.02;
    letter-spacing: -.025em;
}

.u-service-category-all {
    display: inline-flex;
    align-items: center;
    gap: 8px;

    padding-bottom: 4px;

    border-bottom: 1px solid var(--bark);

    color: var(--bark);

    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .055em;
    text-decoration: none;
    text-transform: uppercase;
}

.u-service-category-all span {
    transition: transform .25s ease;
}

.u-service-category-all:hover span {
    transform: translateX(4px);
}


/* =========================================================
   MORE BUSINESS LINES GRID
========================================================= */

.u-service-category-more-grid {
    display: grid;
    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        );

    gap: clamp(18px, 2.5vw, 28px);
}


/* =========================================================
   BUSINESS LINE CARD
========================================================= */

.u-service-category-more-card {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;

    gap: 30px;

    min-height: 250px;

    padding: clamp(26px, 4vw, 42px);

    border: 1px solid rgba(19, 35, 26, .14);

    background: #ffffff;
    color: var(--bark);

    text-decoration: none;

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        background .3s ease,
        color .3s ease;
}

.u-service-category-more-card:hover {
    transform: translateY(-5px);

    background: var(--bark);
    color: var(--husk);

    box-shadow:
        0 22px 45px
        rgba(19, 35, 26, .09);
}

.u-service-category-more-card > div {
    max-width: 470px;
}

.u-service-category-more-card p {
    margin: 0 0 12px;

    color: var(--leaf);

    font-size: .64rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.u-service-category-more-card:hover p {
    color: var(--amber-soft);
}

.u-service-category-more-card h3 {
    max-width: 14ch;
    margin: 0;

    color: inherit;

    font-family: "Fraunces", serif;
    font-size: clamp(1.75rem, 3vw, 2.6rem);
    font-weight: 500;
    line-height: 1.05;
}

.u-service-category-more-card > div > div {
    max-width: 440px;

    margin-top: 16px;

    color: var(--ink-60);

    font-size: .84rem;
    line-height: 1.65;
}

.u-service-category-more-card:hover > div > div {
    color: rgba(235, 237, 228, .68);
}

.u-service-category-more-card > span {
    flex: 0 0 auto;

    color: var(--amber);

    font-size: clamp(1.5rem, 3vw, 2.2rem);

    transition: transform .25s ease;
}

.u-service-category-more-card:hover > span {
    transform: translateX(6px);
}


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

@media (max-width: 900px) {

    .u-service-category-more-grid {
        grid-template-columns: 1fr;
    }

}


@media (max-width: 760px) {

    .u-service-category-breadcrumb {
        margin-bottom: 28px;
    }

    .u-service-category-more-head {
        align-items: flex-start;
        flex-direction: column;
    }

    .u-service-category-more-head h2 {
        max-width: none;
    }

    .u-service-category-more-card {
        min-height: 210px;
    }

}


@media (max-width: 520px) {

    .u-service-category-more-card {
        align-items: flex-start;
        flex-direction: column;

        min-height: 0;
    }

    .u-service-category-more-card > span {
        align-self: flex-end;
    }

    .u-service-category-pagination ul {
        justify-content: flex-start;
    }

}