/* =========================================================
   AG BODY SHOP — SERVICES ARCHIVE
========================================================= */


/* =========================================================
   01 — LOCAL TOKENS / RESET
========================================================= */

.svc-archive {
    --svc-yellow:
        var(--color-yellow, #e7b900);

    --svc-yellow-hover:
        var(--color-yellow-hover, #f2c600);

    --svc-ink:
        #17191c;

    --svc-text:
        #555b5f;

    --svc-muted:
        #777d81;

    --svc-line:
        rgba(20, 23, 25, .13);

    --svc-warm:
        #f4f2ed;

    --svc-dark:
        #080b0e;

    --svc-page-padding:
        clamp(28px, 5vw, 92px);

    position:
        relative;

    width:
        100%;

    overflow:
        hidden;

    color:
        var(--svc-ink);

    background:
        #ffffff;

    font-family:
        var(
            --font-body,
            "AvenirWeb",
            "Avenir",
            Arial,
            sans-serif
        );
}


.svc-archive,
.svc-archive *,
.svc-archive *::before,
.svc-archive *::after {
    box-sizing:
        border-box;
}


.svc-archive h1,
.svc-archive h2,
.svc-archive h3,
.svc-archive p,
.svc-archive figure {
    margin:
        0;

    padding:
        0;
}


.svc-archive img {
    display:
        block;

    max-width:
        100%;
}


.svc-archive a {
    color:
        inherit;

    text-decoration:
        none;
}


.svc-archive .screen-reader-text {
    position:
        absolute !important;

    width:
        1px !important;

    height:
        1px !important;

    padding:
        0 !important;

    margin:
        -1px !important;

    overflow:
        hidden !important;

    clip:
        rect(0, 0, 0, 0) !important;

    white-space:
        nowrap !important;

    border:
        0 !important;
}


/* =========================================================
   02 — COMPACT INTERNAL HERO
========================================================= */

.svc-archive-hero {
    position:
        relative;

    min-height:
        clamp(300px, 30vw, 400px);

    overflow:
        hidden;

    color:
        #ffffff;

    background:
        radial-gradient(
            circle at 82% 66%,
            rgba(231, 185, 0, .11),
            transparent 31%
        ),
        radial-gradient(
            circle at 16% 8%,
            rgba(255, 255, 255, .045),
            transparent 31%
        ),
        linear-gradient(
            135deg,
            #15191d 0%,
            #090c0f 61%,
            #050709 100%
        );
}


.svc-archive-hero::after {
    content:
        "";

    position:
        absolute;

    inset:
        0;

    pointer-events:
        none;

    background:
        linear-gradient(
            90deg,
            rgba(4, 6, 8, .22),
            transparent 60%
        );

    box-shadow:
        inset 0 -58px 80px
        rgba(0, 0, 0, .18);
}


.svc-archive-hero__inner {
    position:
        relative;

    z-index:
        2;

    width:
        min(1480px, 100%);

    min-height:
        inherit;

    margin:
        0 auto;

    display:
        grid;

    grid-template-columns:
        minmax(0, 1.04fr)
        minmax(340px, .96fr);
}


.svc-archive-hero.has-no-hero-image
.svc-archive-hero__inner {
    grid-template-columns:
        1fr;
}

.svc-archive-hero__copy {
    position:
        relative;

    z-index:
        4;

    min-width:
        0;

    padding:
        30px
        var(--svc-page-padding)
        44px;

    display:
        flex;

    flex-direction:
        column;

    justify-content:
        flex-start;
}


.svc-archive-hero {
    position:
        relative;

    min-height:
        clamp(270px, 25vw, 340px);

    overflow:
        hidden;

    color:
        #ffffff;

    background:
        radial-gradient(
            circle at 82% 66%,
            rgba(231, 185, 0, .11),
            transparent 31%
        ),
        radial-gradient(
            circle at 16% 8%,
            rgba(255, 255, 255, .045),
            transparent 31%
        ),
        linear-gradient(
            135deg,
            #15191d 0%,
            #090c0f 61%,
            #050709 100%
        );
}


.svc-archive-hero.has-no-hero-image
.svc-archive-hero__copy {
    max-width:
        990px;
}


/* =========================================================
   03 — BREADCRUMB
========================================================= */

.svc-breadcrumb {
    margin-bottom:
        14px;

    display:
        flex;

    align-items:
        center;

    flex-wrap:
        wrap;

    gap:
        8px;

    color:
        rgba(255, 255, 255, .52);

    font-size:
        10px;

    font-weight:
        700;

    line-height:
        1;

    letter-spacing:
        1.35px;

    text-transform:
        uppercase;
}


.svc-breadcrumb a {
    transition:
        color .2s ease;
}


.svc-breadcrumb a:hover {
    color:
        var(--svc-yellow);
}


.svc-breadcrumb [aria-current="page"] {
    color:
        rgba(255, 255, 255, .82);
}


/* =========================================================
   04 — HERO TYPOGRAPHY / IMAGE
========================================================= */

.svc-archive-hero__title {
    max-width:
        680px;

    color:
        var(--svc-yellow);

    font-family:
        var(--font-title);

    font-size:
        clamp(36px, 2.75vw, 48px);

    font-weight:
        400;

    line-height:
        1;

    letter-spacing:
        -.35px;
}


.svc-archive-hero__description {
    width:
        min(720px, 100%);

    margin-top:
        16px !important;

    color:
        rgba(255, 255, 255, .74);

    font-size:
        clamp(13.5px, .9vw, 15.5px);

    font-weight:
        300;

    line-height:
        1.62;
}


.svc-archive-hero__media {
    position:
        relative;

    z-index:
        2;

    min-width:
        0;

    min-height:
        inherit;

    display:
        flex;

    align-items:
        flex-end;

    justify-content:
        flex-end;

    pointer-events:
        none;
}


.svc-archive-hero__image {
    width:
        min(760px, 112%);

    max-width:
        none;

    height:
        auto;

    max-height:
        360px;

    object-fit:
        contain;

    object-position:
        right bottom;

    filter:
        drop-shadow(
            -16px 24px 28px
            rgba(0, 0, 0, .40)
        );

    transform:
        translateX(-20%);
}


/* =========================================================
   05 — SERVICES LIST / ROW GEOMETRY
========================================================= */

.svc-service-list,
.svc-service-list__items {
    position:
        relative;

    width:
        100%;
}


.svc-service-row {
    position:
        relative;

    width:
        100%;

    overflow:
        hidden;

    background:
        #ffffff;

    border-top:
        1px solid
        rgba(20, 23, 25, .08);
}


.svc-service-row:nth-child(even) {
    background:
        var(--svc-warm);
}


.svc-service-row__inner {
    width:
        100%;

    height:
        clamp(330px, 27vw, 430px);

    display:
        grid;

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


.svc-service-row.has-no-image
.svc-service-row__inner {
    height:
        auto;

    min-height:
        300px;

    grid-template-columns:
        1fr;
}


/* =========================================================
   06 — ALTERNATING ORDER
========================================================= */

.svc-service-row.is-image-right
.svc-service-row__content {
    order:
        1;
}


.svc-service-row.is-image-right
.svc-service-row__media {
    order:
        2;
}


.svc-service-row.is-image-left
.svc-service-row__media {
    order:
        1;
}


.svc-service-row.is-image-left
.svc-service-row__content {
    order:
        2;
}


/* =========================================================
   07 — SERVICE COPY
========================================================= */

.svc-service-row__content {
    min-width:
        0;

    padding:
        clamp(42px, 5vw, 72px)
        var(--svc-page-padding);

    display:
        flex;

    align-items:
        center;
}


.svc-service-row.is-image-right
.svc-service-row__content {
    padding-left:
        max(
            var(--svc-page-padding),
            calc(
                (100vw - 1480px) / 2
                +
                var(--svc-page-padding)
            )
        );
}


.svc-service-row.is-image-left
.svc-service-row__content {
    padding-right:
        max(
            var(--svc-page-padding),
            calc(
                (100vw - 1480px) / 2
                +
                var(--svc-page-padding)
            )
        );
}


.svc-service-row.has-no-image
.svc-service-row__content {
    width:
        min(1480px, 100%);

    min-height:
        300px;

    margin:
        0 auto;

    padding-left:
        var(--svc-page-padding) !important;

    padding-right:
        var(--svc-page-padding) !important;
}


.svc-service-row__copy {
    width:
        min(620px, 100%);
}


.svc-service-row__number {
    display:
        block;

    margin-bottom:
        12px;

    color:
        rgba(23, 25, 28, .34);

    font-size:
        9.5px;

    font-weight:
        800;

    line-height:
        1;

    letter-spacing:
        1.8px;
}


.svc-service-row__title {
    color:
        #9e7d00;

    font-family:
        var(--font-title);

    font-size:
        clamp(27px, 1.9vw, 36px);

    font-weight:
        400;

    line-height:
        1.08;

    letter-spacing:
        -.25px;
}


.svc-service-row__title a {
    transition:
        color .22s ease;
}


.svc-service-row__title a:hover {
    color:
        var(--svc-ink);
}


.svc-service-row__description {
    max-width:
        610px;

    margin-top:
        14px !important;

    color:
        var(--svc-text);

    font-size:
        clamp(13.5px, .84vw, 14.8px);

    font-weight:
        300;

    line-height:
        1.64;
}


.svc-service-row__link {
    width:
        max-content;

    margin-top:
        21px;

    display:
        inline-flex;

    align-items:
        center;

    gap:
        12px;

    color:
        #8e7000;

    font-size:
        10px;

    font-weight:
        800;

    line-height:
        1;

    letter-spacing:
        1px;

    text-transform:
        uppercase;

    transition:
        color .22s ease;
}


.svc-service-row__link svg {
    width:
        40px;

    height:
        16px;

    fill:
        none;

    stroke:
        currentColor;

    stroke-width:
        1.35;

    stroke-linecap:
        round;

    stroke-linejoin:
        round;

    transition:
        transform .24s ease;
}


.svc-service-row__link:hover {
    color:
        var(--svc-ink);
}


.svc-service-row__link:hover svg {
    transform:
        translateX(6px);
}


/* =========================================================
   08 — TRANSPARENT CUTOUT IMAGE
========================================================= */

.svc-service-row__media {
    position:
        relative;

    min-width:
        0;

    height:
        100%;

    overflow:
        hidden;

    display:
        flex;

    align-items:
        flex-end;

    isolation:
        isolate;
}


.svc-service-row.is-image-right
.svc-service-row__media {
    justify-content:
        flex-end;
}


.svc-service-row.is-image-left
.svc-service-row__media {
    justify-content:
        flex-start;
}


.svc-service-row__media::before {
    content:
        "";

    position:
        absolute;

    z-index:
        0;

    left:
        50%;

    bottom:
        -34%;

    width:
        92%;

    height:
        80%;

    transform:
        translateX(-50%);

    border-radius:
        50%;

    background:
        radial-gradient(
            ellipse,
            rgba(20, 23, 25, .075),
            transparent 67%
        );

    pointer-events:
        none;
}


.svc-service-row__image {
    position:
        relative;

    z-index:
        2;

    width:
        min(780px, 112%);

    max-width:
        none;

    height:
        100%;

    max-height:
        100%;

    object-fit:
        contain;

    filter:
        drop-shadow(
            0 22px 24px
            rgba(0, 0, 0, .15)
        );

    transition:
        transform .48s ease,
        filter .48s ease;
}


.svc-service-row.is-image-right
.svc-service-row__image {
    object-position:
        right bottom;

    transform:
        translateX(2%);
}


.svc-service-row.is-image-left
.svc-service-row__image {
    object-position:
        left bottom;

    transform:
        translateX(-2%);
}


.svc-service-row:hover
.svc-service-row__image {
    transform:
        translateX(0)
        scale(1.015);

    filter:
        drop-shadow(
            0 27px 28px
            rgba(0, 0, 0, .20)
        );
}


/* =========================================================
   09 — SAFE REVEAL
========================================================= */

.svc-archive.is-enhanced
.svc-service-row {
    opacity:
        0;

    transform:
        translateY(18px);

    transition:
        opacity .55s ease,
        transform .55s ease;
}


.svc-archive.is-enhanced
.svc-service-row.is-visible {
    opacity:
        1;

    transform:
        translateY(0);
}


/* =========================================================
   10 — PAGINATION
========================================================= */

.svc-pagination {
    width:
        min(1480px, 100%);

    margin:
        0 auto;

    padding:
        clamp(38px, 4.4vw, 58px)
        var(--svc-page-padding);

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    flex-wrap:
        wrap;

    gap:
        8px;
}


.svc-pagination .page-numbers {
    min-width:
        40px;

    height:
        40px;

    padding:
        0 13px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    color:
        var(--svc-ink);

    background:
        #ffffff;

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

    border-radius:
        50%;

    font-size:
        11px;

    font-weight:
        800;

    line-height:
        1;

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


.svc-pagination .page-numbers.prev,
.svc-pagination .page-numbers.next {
    min-width:
        50px;

    border-radius:
        22px;

    font-size:
        17px;
}


.svc-pagination .page-numbers:hover,
.svc-pagination .page-numbers.current {
    color:
        #111416;

    background:
        var(--svc-yellow);

    border-color:
        var(--svc-yellow);

    transform:
        translateY(-2px);
}


.svc-pagination .page-numbers.current {
    cursor:
        default;
}


/* =========================================================
   11 — FULL-WIDTH EXPANDABLE CONTENT
========================================================= */

.svc-archive-summary {
    padding:
        0
        var(--svc-page-padding)
        clamp(54px, 6vw, 76px);

    color:
        var(--svc-ink);

    background:
        #ffffff;
}


.svc-archive-summary__inner {
    width:
        min(1340px, 100%);

    margin:
        0 auto;

    padding:
        clamp(24px, 2.6vw, 34px)
        0
        0;

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


.svc-archive-summary__content-wrap {
    position:
        relative;

    width:
        100%;
}


.svc-archive-summary__content {
    width:
        100%;

    color:
        #5c6266;

    font-size:
        clamp(13.5px, .86vw, 15px);

    line-height:
        1.7;

    overflow:
        visible;

    transition:
        max-height .46s ease;
}


.svc-archive-summary__content p + p {
    margin-top:
        14px;
}


.svc-archive.is-enhanced
.svc-archive-summary.has-overflow:not(.is-expanded)
.svc-archive-summary__content {
    max-height:
        var(--svc-summary-collapsed-height, 76px);

    overflow:
        hidden;
}


.svc-archive.is-enhanced
.svc-archive-summary.has-overflow:not(.is-expanded)
.svc-archive-summary__content-wrap::after {
    content:
        "";

    position:
        absolute;

    left:
        0;

    right:
        0;

    bottom:
        46px;

    height:
        52px;

    pointer-events:
        none;

    background:
        linear-gradient(
            180deg,
            rgba(255, 255, 255, 0),
            rgba(255, 255, 255, .98)
        );
}


.svc-archive-summary.is-expanded
.svc-archive-summary__content {
    max-height:
        var(--svc-summary-expanded-height, 1200px);
}


.svc-archive-summary__toggle {
    min-width:
        118px;

    min-height:
        40px;

    margin:
        24px auto 0;

    padding:
        0 18px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        9px;

    color:
        #ffffff;

    background:
        #090b0d;

    border:
        1px solid
        #090b0d;

    font-size:
        10px;

    font-weight:
        800;

    letter-spacing:
        1px;

    text-transform:
        uppercase;

    cursor:
        pointer;

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


.svc-archive-summary__toggle[hidden] {
    display:
        none;
}


.svc-archive-summary__toggle:hover {
    color:
        #111416;

    background:
        var(--svc-yellow);

    border-color:
        var(--svc-yellow);
}


.svc-archive-summary__toggle svg {
    width:
        14px;

    height:
        14px;

    fill:
        none;

    stroke:
        currentColor;

    stroke-width:
        1.6;

    transition:
        transform .25s ease;
}


.svc-archive-summary.is-expanded
.svc-archive-summary__toggle svg {
    transform:
        rotate(180deg);
}


/* =========================================================
   12 — WHY CHOOSE
========================================================= */

.svc-why {
    position:
        relative;

    background:
        #f5f3ee;

    border-top:
        1px solid
        rgba(20, 23, 25, .08);
}


.svc-why__inner {
    width:
        min(1480px, 100%);

    margin:
        0 auto;

    padding:
        clamp(56px, 6vw, 80px)
        var(--svc-page-padding);
}


.svc-why__header {
    display:
        grid;

    grid-template-columns:
        minmax(0, 1fr)
        minmax(300px, .62fr);

    gap:
        clamp(30px, 5vw, 72px);

    align-items:
        start;
}


.svc-why__title {
    color:
        var(--svc-ink);

    font-family:
        var(--font-title);

    font-size:
        clamp(36px, 2.55vw, 48px);

    font-weight:
        400;

    line-height:
        1;

    letter-spacing:
        -.3px;
}


.svc-why__description {
    max-width:
        570px;

    color:
        var(--svc-muted);

    font-size:
        12.5px;

    line-height:
        1.62;

    text-align:
        left;
}


.svc-why__grid {
    margin-top:
        clamp(30px, 3.5vw, 46px);

    display:
        grid;

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

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

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


.svc-why-card {
    min-width:
        0;

    padding:
        28px
        clamp(20px, 2.1vw, 30px)
        30px;

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


.svc-why-card:first-child {
    padding-left:
        0;
}


.svc-why-card:last-child {
    padding-right:
        0;

    border-right:
        0;
}


.svc-why-card__number {
    width:
        39px;

    height:
        39px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    color:
        #957600;

    border:
        1px solid
        rgba(149, 118, 0, .28);

    border-radius:
        50%;

    font-size:
        10px;

    font-weight:
        800;
}


.svc-why-card__title {
    margin-top:
        18px !important;

    color:
        #957600;

    font-family:
        var(--font-title);

    font-size:
        clamp(15px, 1vw, 18px);

    font-weight:
        400;

    line-height:
        1.2;

    text-transform:
        uppercase;
}


.svc-why-card__text {
    margin-top:
        9px !important;

    color:
        var(--svc-muted);

    font-size:
        12.5px;

    line-height:
        1.56;
}


/* =========================================================
   13 — FAQ
========================================================= */

.svc-faq {
    color:
        #ffffff;

    background:
        linear-gradient(
            135deg,
            #0c0f12,
            #050709
        );
}


.svc-faq__inner {
    width:
        min(1480px, 100%);

    margin:
        0 auto;

    padding:
        clamp(56px, 6vw, 82px)
        var(--svc-page-padding);

    display:
        grid;

    grid-template-columns:
        minmax(270px, .66fr)
        minmax(0, 1.34fr);

    gap:
        clamp(42px, 6vw, 88px);

    align-items:
        start;
}


.svc-faq__title {
    color:
        var(--svc-yellow);

    font-family:
        var(--font-title);

    font-size:
        clamp(33px, 2.55vw, 46px);

    font-weight:
        400;

    line-height:
        1.04;
}


.svc-faq__title a {
    transition:
        color .2s ease;
}


.svc-faq__title a:hover {
    color:
        #ffffff;
}


.svc-faq__intro p {
    max-width:
        470px;

    margin-top:
        16px !important;

    color:
        rgba(255, 255, 255, .58);

    font-size:
        13px;

    line-height:
        1.65;
}


.svc-faq__list {
    border-top:
        1px solid
        rgba(255, 255, 255, .12);
}


.svc-faq-item {
    border-bottom:
        1px solid
        rgba(255, 255, 255, .12);
}


.svc-faq-item h3 {
    margin:
        0;
}


.svc-faq-item__trigger {
    width:
        100%;

    min-height:
        72px;

    padding:
        15px 0;

    display:
        grid;

    grid-template-columns:
        30px
        minmax(0, 1fr)
        30px;

    align-items:
        center;

    gap:
        12px;

    color:
        #ffffff;

    background:
        transparent;

    border:
        0;

    text-align:
        left;

    cursor:
        pointer;
}


.svc-faq-item__number {
    color:
        var(--svc-yellow);

    font-size:
        9px;

    font-weight:
        800;
}


.svc-faq-item__question {
    font-family:
        var(--font-title);

    font-size:
        clamp(15px, 1vw, 18px);

    line-height:
        1.35;
}


.svc-faq-item__icon {
    width:
        27px;

    height:
        27px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    color:
        #111416;

    background:
        var(--svc-yellow);

    border-radius:
        50%;

    font-size:
        15px;

    transition:
        transform .24s ease,
        background-color .24s ease;
}


.svc-faq-item__trigger[aria-expanded="true"]
.svc-faq-item__icon {
    transform:
        rotate(45deg);

    background:
        #ffffff;
}


.svc-faq-item__answer {
    padding:
        0 42px 23px;

    color:
        rgba(255, 255, 255, .61);

    font-size:
        12.5px;

    line-height:
        1.65;
}


.svc-faq-item__answer[hidden] {
    display:
        none;
}


.svc-faq-item__answer p + p {
    margin-top:
        10px;
}


/* =========================================================
   14 — EMPTY STATE
========================================================= */

.svc-service-empty {
    width:
        min(1480px, 100%);

    margin:
        0 auto;

    padding:
        80px
        var(--svc-page-padding)
        100px;
}


.svc-service-empty h2 {
    font-family:
        var(--font-title);

    font-size:
        34px;

    font-weight:
        400;
}


.svc-service-empty p {
    margin-top:
        14px !important;

    color:
        var(--svc-muted);
}


/* =========================================================
   15 — TABLET
========================================================= */

@media (max-width: 980px) {

    .svc-archive-hero {
        min-height:
            390px;
    }


    .svc-archive-hero__inner {
        grid-template-columns:
            minmax(0, 1fr)
            minmax(260px, .72fr);
    }


    .svc-archive-hero__copy {
        padding:
            108px
            28px
            46px;
    }


    .svc-archive-hero__image {
        width:
            112%;

        max-height:
            315px;
    }


    .svc-service-row__inner {
        height:
            360px;
    }


    .svc-service-row__content {
        padding:
            44px
            29px !important;
    }


    .svc-service-row__image {
        width:
            118%;
    }


    .svc-why__header {
        grid-template-columns:
            1fr;

        gap:
            14px;
    }


    .svc-why__grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }


    .svc-why-card:nth-child(2) {
        border-right:
            0;
    }


    .svc-why-card:nth-child(-n+2) {
        border-bottom:
            1px solid
            var(--svc-line);
    }


    .svc-faq__inner {
        grid-template-columns:
            1fr;

        gap:
            38px;
    }

}


/* =========================================================
   16 — MOBILE
========================================================= */

@media (max-width: 720px) {

    .svc-archive {
        --svc-page-padding:
            18px;
    }


    .svc-archive-hero {
        min-height:
            390px;
    }


    .svc-archive-hero__inner,
    .svc-archive-hero.has-no-hero-image
    .svc-archive-hero__inner {
        grid-template-columns:
            1fr;
    }


    .svc-archive-hero__copy {
        padding:
            30px
            18px
            164px;
    
        justify-content:
            flex-start;
    }


    .svc-archive-hero.has-no-hero-image
    .svc-archive-hero__copy {
        padding-bottom:
            48px;

        justify-content:
            center;
    }


    .svc-archive-hero__title {
        font-size:
            clamp(33px, 10vw, 42px);
    }


    .svc-archive-hero__description {
        font-size:
            14px;
    }


    .svc-archive-hero__media {
        position:
            absolute;

        right:
            0;

        bottom:
            0;

        width:
            92%;

        min-height:
            0;

        height:
            230px;
    }


    .svc-archive-hero__image {
        width:
            100%;

        max-height:
            230px;
    }


    .svc-service-row__inner,
    .svc-service-row.has-no-image
    .svc-service-row__inner {
        height:
            auto;

        min-height:
            0;

        grid-template-columns:
            1fr;
    }


/* =====================================================
   MOBILE SERVICE ROW
   Copy first, image second
====================================================== */

.svc-service-row__content,
.svc-service-row.is-image-right
.svc-service-row__content,
.svc-service-row.is-image-left
.svc-service-row__content,
.svc-service-row.has-no-image
.svc-service-row__content {
    order:
        1;

    position:
        relative;

    z-index:
        2;

    min-height:
        0;

    padding:
        40px
        18px
        20px !important;
}


.svc-service-row.has-no-image
.svc-service-row__content {
    padding-bottom:
        42px !important;
}


.svc-service-row__media,
.svc-service-row.is-image-right
.svc-service-row__media,
.svc-service-row.is-image-left
.svc-service-row__media {
    order:
        2;

    position:
        relative;

    z-index:
        1;

    width:
        100%;

    height:
        250px;

    margin:
        0;

    overflow:
        hidden;

    justify-content:
        center;
}


.svc-service-row__image {
    width:
        108%;

    max-width:
        none;

    height:
        100%;

    object-fit:
        contain;

    object-position:
        center bottom;

    transform:
        none !important;
}


    .svc-service-row__title {
        font-size:
            clamp(26px, 7vw, 33px);
    }


    .svc-service-row__description {
        font-size:
            14px;
    }


    .svc-service-row__image {
        width:
            100%;
    
        max-width:
            100%;
    
        height:
            100%;
    
        max-height:
            100%;
    
        object-fit:
            contain;
    
        object-position:
            center bottom;
    
        transform:
            none !important;
    }


    .svc-pagination {
        padding:
            36px
            18px
            48px;
    }


    .svc-archive-summary {
        padding:
            0
            18px
            52px;
    }


    .svc-archive-summary__inner {
        padding-top:
            22px;
    }


    .svc-archive-summary__content {
        font-size:
            14px;
    }


    .svc-why__inner,
    .svc-faq__inner {
        padding-left:
            18px;

        padding-right:
            18px;
    }


    .svc-why__title {
        font-size:
            clamp(32px, 9vw, 41px);
    }


    .svc-why__grid {
        grid-template-columns:
            1fr;
    }


    .svc-why-card,
    .svc-why-card:first-child,
    .svc-why-card:last-child {
        padding:
            24px 0;

        border-right:
            0;

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


    .svc-why-card:last-child {
        border-bottom:
            0;
    }


    .svc-faq__title {
        font-size:
            34px;
    }


    .svc-faq-item__trigger {
        grid-template-columns:
            25px
            minmax(0, 1fr)
            28px;

        gap:
            8px;
    }


    .svc-faq-item__answer {
        padding:
            0 36px 22px;
    }

}


/* =========================================================
   17 — FOCUS / REDUCED MOTION
========================================================= */

.svc-archive a:focus-visible,
.svc-archive button:focus-visible {
    outline:
        2px solid
        var(--svc-yellow);

    outline-offset:
        4px;
}


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

    .svc-service-row,
    .svc-service-row__image,
    .svc-service-row__link svg,
    .svc-archive-summary__content,
    .svc-archive-summary__toggle,
    .svc-archive-summary__toggle svg,
    .svc-faq-item__icon {
        transition:
            none !important;
    }


    .svc-archive.is-enhanced
    .svc-service-row {
        opacity:
            1;

        transform:
            none;
    }

}