/* =========================================================
   SERVIAM THERAPY
   FINAL PREMIUM BOUTIQUE WELLNESS DESIGN SYSTEM

   Champagne / Ivory / Espresso / Gold
   Organic editorial frames
   No tilted cards
   No diagonal frames
   No conventional square-only presentation

   Desktop + Tablet + Mobile
   ========================================================= */


/* =========================================================
   01 — DESIGN TOKENS
========================================================= */

:root {

    /* -----------------------------------------------------
       BACKGROUNDS
    ----------------------------------------------------- */

    --ivory: #faf7ef;
    --warm-white: #fffdf8;
    --cream: #f1e8d8;
    --cream-deep: #e6d8c0;


    /* -----------------------------------------------------
       DARKS
    ----------------------------------------------------- */

    --espresso: #3c3023;
    --espresso-soft: #554636;


    /* -----------------------------------------------------
       TEXT
    ----------------------------------------------------- */

    --text: #5d4f3d;
    --text-soft: #766753;
    --text-muted: #9b896e;


    /* -----------------------------------------------------
       CHAMPAGNE
    ----------------------------------------------------- */

    --champagne: #d5bd83;
    --champagne-light: #ead9ad;
    --champagne-pale: #f2e8d2;


    /* -----------------------------------------------------
       GOLD
    ----------------------------------------------------- */

    --gold: #b8934f;
    --gold-dark: #8b6b37;
    --gold-deep: #73552d;


    /* -----------------------------------------------------
       BORDERS
    ----------------------------------------------------- */

    --line:
        rgba(
            139,
            107,
            55,
            .22
        );

    --line-strong:
        rgba(
            139,
            107,
            55,
            .42
        );


    /* -----------------------------------------------------
       SHADOWS
    ----------------------------------------------------- */

    --shadow-sm:
        0
        10px
        28px
        rgba(
            72,
            54,
            30,
            .08
        );

    --shadow-md:
        0
        20px
        55px
        rgba(
            72,
            54,
            30,
            .13
        );

    --shadow-lg:
        0
        30px
        90px
        rgba(
            72,
            54,
            30,
            .18
        );


    /* -----------------------------------------------------
       LAYOUT
    ----------------------------------------------------- */

    --container:
        1220px;


    /* -----------------------------------------------------
       ORGANIC FRAME
    ----------------------------------------------------- */

    --radius-card:
        28px
        42px
        34px
        48px;


    /* -----------------------------------------------------
       MOTION
    ----------------------------------------------------- */

    --transition:
        .45s
        cubic-bezier(
            .2,
            .75,
            .2,
            1
        );

}


/* =========================================================
   02 — RESET
========================================================= */

* {

    box-sizing:
        border-box;

    margin:
        0;

    padding:
        0;

}


html {

    scroll-behavior:
        smooth;

    scroll-padding-top:
        100px;

}


body {

    min-width:
        320px;

    background:
        var(--ivory);

    color:
        var(--text);

    font-family:
        "Heebo",
        Arial,
        sans-serif;

    line-height:
        1.75;

    overflow-x:
        hidden;

    -webkit-font-smoothing:
        antialiased;

    text-rendering:
        optimizeLegibility;

}


body.popup-open {

    overflow:
        hidden;

}


body.menu-open {

    overflow:
        hidden;

}


a {

    color:
        inherit;

    text-decoration:
        none;

}


button,
input,
textarea,
select {

    font:
        inherit;

}


button {

    border:
        0;

    cursor:
        pointer;

}


img {

    display:
        block;

    max-width:
        100%;

}


::selection {

    background:
        var(--gold);

    color:
        #fff;

}


:focus-visible {

    outline:
        2px
        solid
        var(--gold);

    outline-offset:
        4px;

}


/* =========================================================
   03 — ATMOSPHERIC TEXTURE
========================================================= */

.site-noise {

    position:
        fixed;

    inset:
        0;

    z-index:
        9998;

    pointer-events:
        none;

    opacity:
        .035;

    background-image:
        url(
            "data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E"
        );

}


/* =========================================================
   04 — GLOBAL LAYOUT
========================================================= */

.container {

    width:
        min(
            var(--container),
            calc(
                100% - 48px
            )
        );

    margin-inline:
        auto;

}


.narrow {

    max-width:
        900px;

}


.section-soft,
.section-light {

    position:
        relative;

    padding:
        112px 0;

}


.section-soft {

    background:
        linear-gradient(
            180deg,
            #faf7ef 0%,
            #f5eee1 100%
        );

}


.section-light {

    background:
        linear-gradient(
            180deg,
            #f0e7d8 0%,
            #ece1cf 100%
        );

}


/* =========================================================
   05 — SECTION TYPOGRAPHY
========================================================= */

.section-heading {

    max-width:
        720px;

    margin-bottom:
        60px;

}


.section-heading.centered {

    margin-inline:
        auto;

    text-align:
        center;

}


.section-label,
.hero-eyebrow,
.contact-card-label {

    display:
        inline-block;

    color:
        var(--gold-dark);

    font-family:
        "Poppins",
        sans-serif;

    font-size:
        11px;

    font-weight:
        500;

    letter-spacing:
        .25em;

    text-transform:
        uppercase;

}


.section-heading h2 {

    margin:
        13px
        0
        18px;

    color:
        var(--espresso);

    font-size:
        clamp(
            38px,
            5vw,
            58px
        );

    line-height:
        1.1;

    font-weight:
        500;

}


.section-heading h2 span,
.about-content h2 span,
.booking-content h2 span,
.contact-content h2 span {

    color:
        var(--gold-dark);

}


.section-heading p {

    max-width:
        650px;

    color:
        var(--text-soft);

    font-size:
        17px;

}


.section-heading.centered p {

    margin-inline:
        auto;

}


/* =========================================================
   06 — PREMIUM SCROLL / TEXT INERTIA REVEAL
========================================================= */

.reveal {

    opacity:
        0;

    transform:
        translate3d(
            0,
            34px,
            0
        )
        scale(
            .985
        );

    filter:
        blur(
            2px
        );

    transition:
        opacity
        .9s
        cubic-bezier(
            .16,
            1,
            .3,
            1
        ),

        transform
        1.05s
        cubic-bezier(
            .16,
            1,
            .3,
            1
        ),

        filter
        .9s
        ease;

    will-change:
        transform,
        opacity,
        filter;

}


/* ---------------------------------------------------------
   MAIN REVEAL
--------------------------------------------------------- */

.reveal.is-visible {

    opacity:
        1;

    transform:
        translate3d(
            0,
            0,
            0
        )
        scale(
            1
        );

    filter:
        blur(
            0
        );

}


/* =========================================================
   HEADINGS
   Subtle physical inertia / overshoot
========================================================= */

.reveal.is-visible h1,
.reveal.is-visible h2 {

    animation:
        textInertia
        1.15s
        cubic-bezier(
            .16,
            1,
            .3,
            1
        )
        both;

    will-change:
        transform,
        opacity;

}


@keyframes textInertia {

    0% {

        opacity:
            .35;

        transform:
            translate3d(
                12px,
                18px,
                0
            );

    }

    60% {

        opacity:
            1;

        transform:
            translate3d(
                -2px,
                -1px,
                0
            );

    }

    100% {

        opacity:
            1;

        transform:
            translate3d(
                0,
                0,
                0
            );

    }

}


/* =========================================================
   PARAGRAPHS
   Arrive slightly after the heading
========================================================= */

.reveal.is-visible p {

    animation:
        paragraphInertia
        1s
        .12s
        cubic-bezier(
            .16,
            1,
            .3,
            1
        )
        both;

    will-change:
        transform,
        opacity;

}


@keyframes paragraphInertia {

    0% {

        opacity:
            0;

        transform:
            translate3d(
                8px,
                14px,
                0
            );

    }

    65% {

        opacity:
            1;

        transform:
            translate3d(
                -1px,
                -1px,
                0
            );

    }

    100% {

        opacity:
            1;

        transform:
            translate3d(
                0,
                0,
                0
            );

    }

}


/* =========================================================
   SECTION LABELS / HERO EYEBROW
========================================================= */

.reveal.is-visible
.section-label,
.reveal.is-visible
.hero-eyebrow {

    animation:
        labelInertia
        .8s
        cubic-bezier(
            .16,
            1,
            .3,
            1
        )
        both;

    will-change:
        transform,
        opacity;

}


@keyframes labelInertia {

    0% {

        opacity:
            0;

        transform:
            translate3d(
                6px,
                8px,
                0
            );

        letter-spacing:
            .34em;

    }

    65% {

        opacity:
            1;

        transform:
            translate3d(
                -1px,
                -1px,
                0
            );

    }

    100% {

        opacity:
            1;

        transform:
            translate3d(
                0,
                0,
                0
            );

        letter-spacing:
            .25em;

    }

}


/* =========================================================
   HERO / BOOKING ACTIONS
   Gentle delayed arrival
========================================================= */

.reveal.is-visible
.hero-actions,
.reveal.is-visible
.booking-actions {

    animation:
        paragraphInertia
        1s
        .25s
        cubic-bezier(
            .16,
            1,
            .3,
            1
        )
        both;

}


/* =========================================================
   HERO TRUST ROW
========================================================= */

.reveal.is-visible
.hero-trust-row {

    animation:
        paragraphInertia
        1s
        .32s
        cubic-bezier(
            .16,
            1,
            .3,
            1
        )
        both;

}


/* =========================================================
   ABOUT / CONTACT SECONDARY CONTENT
========================================================= */

.reveal.is-visible
.about-features,
.reveal.is-visible
.skills-list,
.reveal.is-visible
.contact-details,
.reveal.is-visible
.social-links {

    animation:
        paragraphInertia
        1s
        .22s
        cubic-bezier(
            .16,
            1,
            .3,
            1
        )
        both;

}


/* =========================================================
   FAQ
========================================================= */

.reveal.is-visible
.faq-list {

    animation:
        paragraphInertia
        1s
        .18s
        cubic-bezier(
            .16,
            1,
            .3,
            1
        )
        both;

}


/* =========================================================
   HOME SERVICE POINTS
========================================================= */

.reveal.is-visible
.home-service-points {

    animation:
        paragraphInertia
        1s
        .2s
        cubic-bezier(
            .16,
            1,
            .3,
            1
        )
        both;

}


/* =========================================================
   PREMIUM STAGGER FOR MULTIPLE REVEALS
========================================================= */

.reveal:nth-child(2) {

    transition-delay:
        .06s;

}


.reveal:nth-child(3) {

    transition-delay:
        .12s;

}


.reveal:nth-child(4) {

    transition-delay:
        .18s;

}


.reveal:nth-child(5) {

    transition-delay:
        .24s;

}


/* =========================================================
   MOBILE — SLIGHTLY SOFTER MOTION
========================================================= */

@media (
    max-width:
    768px
) {

    .reveal {

        transform:
            translate3d(
                0,
                24px,
                0
            )
            scale(
                .99
            );

        filter:
            blur(
                1px
            );

    }


    .reveal.is-visible h1,
    .reveal.is-visible h2 {

        animation-duration:
            .95s;

    }


    .reveal.is-visible p {

        animation-duration:
            .9s;

    }

}


/* =========================================================
   REDUCED MOTION
========================================================= */

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

    .reveal,
    .reveal.is-visible,
    .reveal.is-visible h1,
    .reveal.is-visible h2,
    .reveal.is-visible p,
    .reveal.is-visible .section-label,
    .reveal.is-visible .hero-eyebrow,
    .reveal.is-visible .hero-actions,
    .reveal.is-visible .booking-actions,
    .reveal.is-visible .hero-trust-row,
    .reveal.is-visible .about-features,
    .reveal.is-visible .skills-list,
    .reveal.is-visible .contact-details,
    .reveal.is-visible .social-links,
    .reveal.is-visible .faq-list,
    .reveal.is-visible .home-service-points {

        opacity:
            1;

        transform:
            none;

        filter:
            none;

        animation:
            none
            !important;

        transition:
            none
            !important;

    }

}

/* =========================================================
   07 — PAGE LOADER
========================================================= */

.page-loader {

    position:
        fixed;

    inset:
        0;

    z-index:
        10000;

    display:
        grid;

    place-items:
        center;

    background:
        radial-gradient(
            circle,
            #fffdf8,
            #f0e5d0
        );

    transition:
        opacity
        .6s
        ease,

        visibility
        .6s
        ease;

}


.page-loader.loaded {

    opacity:
        0;

    visibility:
        hidden;

}


.loader-inner {

    text-align:
        center;

}


.loader-logo {

    color:
        var(--gold-dark);

    font:
        500
        28px
        "Poppins",
        sans-serif;

    letter-spacing:
        .28em;

}


.loader-line {

    width:
        90px;

    height:
        1px;

    margin:
        15px
        auto;

    background:
        linear-gradient(
            90deg,
            transparent,
            var(--gold),
            transparent
        );

}


.loader-subtitle {

    color:
        var(--text-muted);

    font:
        11px
        "Poppins",
        sans-serif;

    letter-spacing:
        .45em;

}


/* =========================================================
   08 — POPUP
========================================================= */

.popup-window {

    position:
        fixed;

    inset:
        0;

    z-index:
        9999;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    padding:
        24px;

    background:
        rgba(
            57,
            43,
            26,
            .48
        );

    backdrop-filter:
        blur(
            12px
        );

    -webkit-backdrop-filter:
        blur(
            12px
        );

    transition:
        opacity
        .45s
        ease,

        visibility
        .45s
        ease;

}


.popup-window.popup-hidden {

    opacity:
        0;

    visibility:
        hidden;

    pointer-events:
        none;

}


.popup-left,
.popup-right {

    width:
        min(
            610px,
            50vw
        );

    min-height:
        580px;

}


.popup-left {

    position:
        relative;

    overflow:
        hidden;

    background:
        url(
            "../images/hero/hero.jpg"
        )
        center /
        cover
        no-repeat;

    border-radius:
        26px
        0
        0
        26px;

}


.popup-left-overlay {

    position:
        absolute;

    inset:
        0;

    background:
        linear-gradient(
            145deg,
            rgba(
                59,
                43,
                24,
                .20
            ),
            rgba(
                201,
                168,
                106,
                .35
            )
        );

}


.popup-left-content {

    position:
        absolute;

    inset:
        auto
        42px
        46px;

    z-index:
        2;

    color:
        #fffdf8;

}


.popup-left-content span {

    display:
        block;

    margin-bottom:
        12px;

    font:
        11px
        "Poppins",
        sans-serif;

    letter-spacing:
        .25em;

}


.popup-left-content strong {

    font-size:
        34px;

    font-weight:
        500;

    line-height:
        1.3;

}


.popup-right {

    position:
        relative;

    display:
        flex;

    align-items:
        center;

    padding:
        55px;

    background:
        linear-gradient(
            145deg,
            #fffdf8,
            #f7efe0
        );

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

    border-right:
        0;

    border-radius:
        0
        26px
        26px
        0;

    box-shadow:
        var(--shadow-lg);

}


.popup-content {

    width:
        100%;

    max-width:
        480px;

    text-align:
        center;

}


.popup-close {

    position:
        absolute;

    top:
        18px;

    left:
        18px;

    width:
        40px;

    height:
        40px;

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

    border-radius:
        50%;

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

    color:
        var(--gold-dark);

    font-size:
        25px;

    transition:
        .25s
        ease;

}


.popup-close:hover {

    transform:
        rotate(
            90deg
        );

    border-color:
        var(--gold);

    background:
        var(--champagne-pale);

}


.popup-logo {

    width:
        82px;

    height:
        82px;

    object-fit:
        contain;

    margin:
        0
        auto
        15px;

}


.popup-content h1 {

    margin:
        14px
        0;

    color:
        var(--espresso);

    font-size:
        34px;

    line-height:
        1.15;

}


.popup-content p {

    margin-bottom:
        12px;

    color:
        var(--text-soft);

}


.popup-features {

    display:
        grid;

    gap:
        10px;

    margin:
        24px
        0;

    text-align:
        right;

}


.popup-feature {

    display:
        flex;

    align-items:
        center;

    gap:
        12px;

}


.popup-feature-icon {

    width:
        37px;

    height:
        37px;

    flex:
        0
        0
        37px;

    display:
        grid;

    place-items:
        center;

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

    border-radius:
        50%;

    color:
        var(--gold-dark);

    background:
        rgba(
            213,
            189,
            131,
            .16
        );

}


.popup-button {

    min-height:
        56px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        14px;

    border-radius:
        5px;

    background:
        linear-gradient(
            135deg,
            var(--gold-deep),
            var(--gold),
            var(--champagne)
        );

    color:
        #fffdf8;

    font-weight:
        600;

    box-shadow:
        var(--shadow-sm);

    transition:
        var(--transition);

}


.popup-button:hover {

    transform:
        translateY(
            -3px
        );

    box-shadow:
        var(--shadow-md);

}


/* =========================================================
   09 — HEADER
========================================================= */

.site-header {

    position:
        relative;

    z-index:
        1000;

}


.navbar {

    position:
        sticky;

    top:
        0;

    min-height:
        88px;

    padding:
        0
        42px;

    display:
        flex;

    align-items:
        center;

    background:
        rgba(
            229,
            213,
            178,
            .94
        );

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

    box-shadow:
        0
        8px
        30px
        rgba(
            78,
            58,
            30,
            .09
        );

    backdrop-filter:
        blur(
            14px
        );

    -webkit-backdrop-filter:
        blur(
            14px
        );

    transition:
        min-height
        .35s
        ease,

        background
        .35s
        ease,

        box-shadow
        .35s
        ease;

}


.navbar.scrolled {

    min-height:
        74px;

    background:
        rgba(
            250,
            247,
            239,
            .92
        );

    box-shadow:
        0
        10px
        35px
        rgba(
            78,
            58,
            30,
            .12
        );

}


.brand {

    margin-left:
        auto;

    display:
        flex;

    align-items:
        center;

    gap:
        12px;

}


.brand-logo {

    width:
        56px;

    height:
        56px;

    object-fit:
        contain;

    filter:
        drop-shadow(
            0
            5px
            12px
            rgba(
                112,
                85,
                40,
                .14
            )
        );

    transition:
        .35s
        ease;

}


.navbar.scrolled
.brand-logo {

    width:
        48px;

    height:
        48px;

}


.brand-text {

    color:
        var(--gold-dark);

    font:
        600
        17px/1
        "Poppins",
        sans-serif;

    letter-spacing:
        .16em;

}


.brand-text small {

    display:
        block;

    margin-top:
        5px;

    color:
        var(--text-soft);

    font-size:
        8px;

    letter-spacing:
        .43em;

}


.header-socials {

    display:
        flex;

    gap:
        8px;

    margin-right:
        28px;

}


.header-social-link,
.mobile-social-link,
.social-link {

    display:
        grid;

    place-items:
        center;

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

    border-radius:
        50%;

    color:
        var(--gold-dark);

    background:
        rgba(
            255,
            253,
            248,
            .55
        );

    transition:
        .25s
        ease;

}


.header-social-link {

    width:
        37px;

    height:
        37px;

    font-family:
        Arial,
        sans-serif;

}


.header-social-link:hover,
.mobile-social-link:hover,
.social-link:hover {

    color:
        #fffdf8;

    background:
        var(--gold);

    transform:
        translateY(
            -2px
        );

    box-shadow:
        var(--shadow-sm);

}


.nav-menu {

    display:
        flex;

    align-items:
        center;

    gap:
        24px;

    margin-right:
        32px;

}


.nav-link {

    position:
        relative;

    color:
        var(--espresso-soft);

    font-size:
        15px;

    font-weight:
        500;

    white-space:
        nowrap;

}


.nav-link::after {

    content:
        "";

    position:
        absolute;

    right:
        0;

    bottom:
        -8px;

    width:
        0;

    height:
        1px;

    background:
        linear-gradient(
            90deg,
            var(--gold-dark),
            var(--champagne-light)
        );

    transition:
        .3s
        ease;

}


.nav-link:hover {

    color:
        var(--gold-dark);

}


.nav-link:hover::after {

    width:
        100%;

}


.nav-book-button {

    padding:
        10px
        20px;

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

    color:
        var(--gold-dark);

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

    transition:
        .3s
        ease;

}


.nav-book-button:hover {

    color:
        #fffdf8;

    background:
        var(--gold);

    box-shadow:
        var(--shadow-sm);

}


.mobile-menu-toggle,
.mobile-socials {

    display:
        none;

}

/* =========================================================
   PREMIUM SCROLL INDICATOR
========================================================= */

.scroll-indicator {
    position: absolute;
    left: 50%;
    bottom: 34px;
    transform: translateX(-50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    z-index: 10;
    pointer-events: none;
    color: rgba(255, 255, 255, 0.82);
    opacity: 1;
    visibility: visible;
    transition:
        opacity 0.6s ease,
        visibility 0.6s ease;
    animation: scrollIndicatorFade 3s ease-in-out infinite;
}

.scroll-indicator span {
    font-family: "Heebo", sans-serif;
    font-size: 0.72rem;
    font-weight: 400;
    letter-spacing: 0.12em;
    white-space: nowrap;
}

.scroll-line {
    position: relative;
    width: 1px;
    height: 42px;
    background: linear-gradient(
        to bottom,
        rgba(255, 255, 255, 0.15),
        rgba(216, 193, 141, 0.9)
    );
    overflow: visible;
}

.scroll-line::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -2px;
    width: 8px;
    height: 8px;
    border-right: 1px solid #d8c18d;
    border-bottom: 1px solid #d8c18d;
    transform: translateX(-50%) rotate(45deg);
    animation: scrollArrowMove 1.8s ease-in-out infinite;
}

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

@keyframes scrollArrowMove {

    0%,
    100% {
        transform:
            translate(-50%, -4px)
            rotate(45deg);
        opacity: 0.45;
    }

    50% {
        transform:
            translate(-50%, 5px)
            rotate(45deg);
        opacity: 1;
    }

}

/* =========================================================
   SUBTLE PULSE
========================================================= */

@keyframes scrollIndicatorFade {

    0%,
    100% {
        opacity: 0.65;
    }

    50% {
        opacity: 1;
    }

}

/* =========================================================
   HIDE AFTER USER STARTS SCROLLING
========================================================= */

.scroll-indicator.scroll-hidden {
    opacity: 0;
    visibility: hidden;
    animation: none;
}

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

@media (max-width: 768px) {

    .scroll-indicator {
        bottom: 25px;
        gap: 8px;
    }

    .scroll-indicator span {
        font-size: 0.68rem;
    }

    .scroll-line {
        height: 34px;
    }

}
/* =========================================================
   10 — HERO
========================================================= */

.hero-section {

    position:
        relative;

    min-height:
        calc(
            100vh - 88px
        );

    display:
        flex;

    align-items:
        center;

    overflow:
        hidden;

    isolation:
        isolate;

}


.hero-background {

    position:
        absolute;

    inset:
        0;

    z-index:
        -3;

    background:
        url(
            "../images/hero/hero.jpg"
        )
        center /
        cover
        no-repeat;

    transform:
        scale(
            1.03
        );

}


.hero-overlay {

    position:
        absolute;

    inset:
        0;

    z-index:
        -2;

    background:
        linear-gradient(
            90deg,
            rgba(
                248,
                242,
                230,
                .15
            )
            0%,

            rgba(
                248,
                242,
                230,
                .72
            )
            62%,

            rgba(
                248,
                242,
                230,
                .92
            )
            100%
        );

}


.hero-section::after {

    content:
        "";

    position:
        absolute;

    inset:
        auto
        0
        0;

    height:
        180px;

    z-index:
        -1;

    background:
        linear-gradient(
            transparent,
            rgba(
                250,
                247,
                239,
                .55
            )
        );

}


.hero-orb {

    position:
        absolute;

    z-index:
        -1;

    border:
        1px
        solid
        rgba(
            184,
            147,
            79,
            .25
        );

    border-radius:
        50%;

    pointer-events:
        none;

}


.hero-orb-one {

    width:
        340px;

    height:
        340px;

    left:
        7%;

    top:
        12%;

    box-shadow:
        inset
        0
        0
        80px
        rgba(
            255,
            255,
            255,
            .13
        );

}


.hero-orb-two {

    width:
        180px;

    height:
        180px;

    left:
        22%;

    bottom:
        13%;

    border-color:
        rgba(
            184,
            147,
            79,
            .18
        );

}


.hero-container {

    position:
        relative;

    z-index:
        2;

}


.hero-content {

    max-width:
        650px;

    margin-right:
        auto;

}


.hero-eyebrow {

    margin-bottom:
        14px;

}


.hero-content h1 {

    color:
        var(--espresso);

    font-size:
        clamp(
            50px,
            7.3vw,
            88px
        );

    font-weight:
        500;

    line-height:
        1.02;

    letter-spacing:
        -.02em;

}


.hero-content h1 span {

    display:
        block;

    color:
        var(--gold-dark);

    font-family:
        "Playfair Display",
        serif;

    font-weight:
        500;

}


.hero-description {

    max-width:
        560px;

    margin-top:
        24px;

    color:
        var(--text-soft);

    font-size:
        19px;

}


.hero-actions,
.booking-actions {

    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        13px;

    margin-top:
        30px;

}


.button {

    min-width:
        165px;

    min-height:
        54px;

    padding:
        13px
        24px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    border-radius:
        5px;

    font-weight:
        600;

    transition:
        var(--transition);

}


.button-primary,
.button-gold {

    background:
        linear-gradient(
            135deg,
            var(--gold-deep),
            var(--gold),
            var(--champagne)
        );

    color:
        #fffdf8;

    box-shadow:
        var(--shadow-sm);

}


.button-primary:hover,
.button-gold:hover {

    transform:
        translateY(
            -3px
        );

    box-shadow:
        var(--shadow-md);

}


.button-outline-light {

    border:
        1px
        solid
        var(--gold-dark);

    color:
        var(--gold-dark);

    background:
        rgba(
            255,
            253,
            248,
            .44
        );

}


.button-outline-light:hover {

    color:
        #fffdf8;

    background:
        var(--gold);

    border-color:
        var(--gold);

}


.button-dark {

    background:
        var(--espresso);

    color:
        #fffdf8;

}


.button-dark:hover {

    background:
        var(--gold-deep);

    transform:
        translateY(
            -2px
        );

}


.hero-trust-row {

    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        20px;

    margin-top:
        32px;

    color:
        var(--text-soft);

    font-size:
        13px;

}


.hero-trust-row span {

    padding-left:
        20px;

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

}


.hero-trust-row span:last-child {

    border-left:
        0;

    padding-left:
        0;

}


.hero-trust-row b {

    color:
        var(--gold-dark);

    font-weight:
        700;

}


.scroll-indicator {

    position:
        absolute;

    bottom:
        28px;

    left:
        50%;

    transform:
        translateX(
            -50%
        );

    color:
        var(--gold-dark);

    text-align:
        center;

    font-size:
        11px;

}


.scroll-line {

    width:
        1px;

    height:
        42px;

    margin:
        8px
        auto
        0;

    background:
        linear-gradient(
            var(--gold),
            transparent
        );

}
/* =========================================================
   HERO VIDEO
   ========================================================= */

.hero-background {
    position: absolute;
    inset: 0;
    overflow: hidden;
    z-index: -2;
}

.hero-video {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center;
}

.hero-background::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
        linear-gradient(
            90deg,
            rgba(35, 27, 19, 0.72) 0%,
            rgba(35, 27, 19, 0.48) 45%,
            rgba(35, 27, 19, 0.28) 100%
        );
    pointer-events: none;
}

@media (max-width: 640px) {
    .hero-video {
        object-position: center center;
    }
}

@media (prefers-reduced-motion: reduce) {
    .hero-video {
        display: none;
    }

    .hero-background {
        background: url("../images/hero/hero.jpg") center / cover no-repeat;
    }
}


/* =========================================================
   PREMIUM EDITORIAL SERVICE IMAGE FRAMES
========================================================= */

.service-image {

    position:
        relative;

    height:
        285px;

    margin:
        16px;

    overflow:
        hidden;

    border:
        1px
        solid
        rgba(
            139,
            107,
            55,
            .48
        );

    border-radius:
        22px
        30px
        22px
        30px;

    background:
        var(--champagne-pale);

    box-shadow:
        0
        16px
        35px
        rgba(
            72,
            54,
            30,
            .12
        );

    isolation:
        isolate;

}


/* Fine luxury frame */

.service-image::before {

    content:
        "";

    position:
        absolute;

    inset:
        7px;

    z-index:
        2;

    border:
        1px
        solid
        rgba(
            255,
            253,
            248,
            .62
        );

    border-radius:
        17px
        24px
        17px
        24px;

    pointer-events:
        none;

}


/* Offset champagne accent */

.service-image::after {

    content:
        "";

    position:
        absolute;

    right:
        -7px;

    bottom:
        -7px;

    width:
        72px;

    height:
        72px;

    z-index:
        3;

    border-right:
        1px
        solid
        rgba(
            184,
            147,
            79,
            .65
        );

    border-bottom:
        1px
        solid
        rgba(
            184,
            147,
            79,
            .65
        );

    border-radius:
        0
        0
        25px
        0;

    pointer-events:
        none;

}


.service-image img {

    width:
        100%;

    height:
        100%;

    object-fit:
        cover;

    transition:
        transform
        .85s
        cubic-bezier(
            .2,
            .7,
            .2,
            1
        ),

        filter
        .5s
        ease;

}


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

    transform:
        scale(
            1.055
        );

    filter:
        saturate(
            1.04
        );

}


.service-card:hover
.service-image {

    border-color:
        rgba(
            139,
            107,
            55,
            .68
        );

    box-shadow:
        0
        22px
        48px
        rgba(
            72,
            54,
            30,
            .17
        );

}

/* =========================================================
   12 — HOME SERVICE
========================================================= */

.home-service-section {

    position:
        relative;

    overflow:
        hidden;

    padding:
        115px
        0;

    background:
        var(--espresso);

    color:
        #fffdf8;

    isolation:
        isolate;

}


.home-service-art {

    position:
        absolute;

    inset:
        0;

    z-index:
        -2;

    background:
        url(
            "../images/gallery/gallery-4.jpg"
        )
        center /
        cover
        no-repeat;

    opacity:
        .18;

}


.home-service-section::after {

    content:
        "";

    position:
        absolute;

    inset:
        0;

    z-index:
        -1;

    background:
        radial-gradient(
            circle at 78% 30%,
            rgba(
                213,
                189,
                131,
                .23
            ),
            transparent 35%
        ),

        linear-gradient(
            90deg,
            rgba(
                60,
                48,
                35,
                .97
            ),
            rgba(
                60,
                48,
                35,
                .82
            )
        );

}


.home-service-grid {

    display:
        grid;

    grid-template-columns:
        1.15fr
        .85fr;

    align-items:
        center;

    gap:
        70px;

}


.home-service-content h2 {

    margin:
        14px
        0
        18px;

    color:
        #fffdf8;

    font-size:
        clamp(
            44px,
            5vw,
            66px
        );

    line-height:
        1.05;

    font-weight:
        500;

}


.home-service-content h2 span {

    color:
        var(--champagne-light);

    font-family:
        "Playfair Display",
        serif;

}


.home-service-content p {

    max-width:
        650px;

    color:
        rgba(
            255,
            253,
            248,
            .77
        );

    font-size:
        18px;

}


.home-service-points {

    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        14px
        24px;

    margin:
        25px
        0
        30px;

    color:
        var(--champagne-light);

}


.home-service-visual {

    min-height:
        390px;

    display:
        grid;

    place-items:
        center;

    border:
        1px
        solid
        rgba(
            234,
            217,
            173,
            .3
        );

    border-radius:
        52%
        48%
        42%
        58%
        /
        42%
        58%
        48%
        52%;

    background:
        radial-gradient(
            circle,
            rgba(
                213,
                189,
                131,
                .15
            ),
            rgba(
                255,
                255,
                255,
                .02
            )
            62%
        );

    box-shadow:
        inset
        0
        0
        70px
        rgba(
            255,
            255,
            255,
            .04
        );

}


.home-service-visual span {

    color:
        rgba(
            234,
            217,
            173,
            .65
        );

    font:
        14px/2
        "Poppins",
        sans-serif;

    letter-spacing:
        .3em;

    text-align:
        center;

}


/* =========================================================
   PREMIUM EDITORIAL ABOUT IMAGE
========================================================= */

.about-image-wrapper {

    position:
        relative;

    padding:
        18px
        18px
        18px
        8px;

}


/* Main architectural frame */

.about-image-frame {

    position:
        relative;

    padding:
        11px;

    border:
        1px
        solid
        rgba(
            139,
            107,
            55,
            .52
        );

    border-radius:
        24px
        34px
        24px
        34px;

    background:
        linear-gradient(
            145deg,
            rgba(
                255,
                253,
                248,
                .88
            ),
            rgba(
                213,
                189,
                131,
                .28
            )
        );

    box-shadow:
        0
        25px
        65px
        rgba(
            72,
            54,
            30,
            .15
        );

}


/* Elegant offset frame behind photograph */

.about-image-frame::before {

    content:
        "";

    position:
        absolute;

    top:
        18px;

    right:
        -18px;

    bottom:
        -18px;

    left:
        18px;

    z-index:
        -1;

    border:
        1px
        solid
        rgba(
            184,
            147,
            79,
            .45
        );

    border-radius:
        28px
        38px
        28px
        38px;

    background:
        transparent;

}


/* Subtle inner champagne line */

.about-image-frame::after {

    content:
        "";

    position:
        absolute;

    inset:
        8px;

    z-index:
        3;

    border:
        1px
        solid
        rgba(
            255,
            253,
            248,
            .58
        );

    border-radius:
        18px
        28px
        18px
        28px;

    pointer-events:
        none;

}


.about-image {

    position:
        relative;

    overflow:
        hidden;

    border-radius:
        18px
        28px
        18px
        28px;

    background:
        var(--cream);

}


.about-image img {

    width:
        100%;

    aspect-ratio:
        4 /
        5;

    object-fit:
        cover;

    transition:
        transform
        .9s
        cubic-bezier(
            .2,
            .7,
            .2,
            1
        ),

        filter
        .5s
        ease;

}


.about-image-frame:hover
.about-image img {

    transform:
        scale(
            1.035
        );

    filter:
        saturate(
            1.03
        );

}


/* Replace old decorative image-frame line */

.image-frame-line {

    position:
        absolute;

    inset:
        7%;

    border:
        1px
        solid
        rgba(
            184,
            147,
            79,
            .22
        );

    border-radius:
        20px
        30px
        20px
        30px;

    pointer-events:
        none;

}

/* =========================================================
   14 — STATISTICS
========================================================= */

.statistics-section {

    padding:
        72px
        0;

    color:
        #fffdf8;

    background:
        linear-gradient(
            135deg,
            #b79658,
            #8f6d37,
            #c3a66d
        );

    box-shadow:
        inset
        0
        1px
        0
        rgba(
            255,
            255,
            255,
            .2
        );

}


.statistics-grid {

    display:
        grid;

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

}


.stat-item {

    padding:
        12px
        20px;

    text-align:
        center;

    border-left:
        1px
        solid
        rgba(
            255,
            255,
            255,
            .24
        );

}


.stat-item:last-child {

    border-left:
        0;

}


.stat-item strong {

    display:
        block;

    font:
        400
        49px/1
        "Poppins",
        sans-serif;

}


.stat-item strong span {

    font-size:
        25px;

}


.stat-item p {

    margin-top:
        9px;

    opacity:
        .9;

}


/* =========================================================
   PREMIUM CREDENTIAL IMAGE FRAMES
========================================================= */

.credential-image {

    position:
        relative;

    height:
        330px;

    margin:
        14px;

    overflow:
        hidden;

    border:
        1px
        solid
        rgba(
            139,
            107,
            55,
            .42
        );

    border-radius:
        20px
        28px
        20px
        28px;

    background:
        linear-gradient(
            145deg,
            #f5ead6,
            #e8d8ba
        );

}


.credential-image::before {

    content:
        "";

    position:
        absolute;

    inset:
        8px;

    z-index:
        2;

    border:
        1px
        solid
        rgba(
            255,
            253,
            248,
            .65
        );

    border-radius:
        15px
        23px
        15px
        23px;

    pointer-events:
        none;

}


.credential-image::after {

    content:
        "";

    position:
        absolute;

    left:
        14px;

    bottom:
        14px;

    width:
        42px;

    height:
        42px;

    border-left:
        1px
        solid
        rgba(
            184,
            147,
            79,
            .55
        );

    border-bottom:
        1px
        solid
        rgba(
            184,
            147,
            79,
            .55
        );

    pointer-events:
        none;

}


.credential-image img {

    width:
        100%;

    height:
        100%;

    padding:
        18px;

    object-fit:
        contain;

    transition:
        transform
        .7s
        ease;

}


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

    transform:
        scale(
            1.025
        );

}


/* =========================================================
   16 — BENEFITS
========================================================= */

.benefits-grid {

    display:
        grid;

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

    gap:
        20px;

}


.benefit-card {

    padding:
        34px
        25px;

    text-align:
        center;

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

    border-radius:
        24px
        34px
        28px
        38px;

    background:
        linear-gradient(
            145deg,
            #fffdf8,
            #f8f1e4
        );

    box-shadow:
        var(--shadow-sm);

    transition:
        var(--transition);

}


.benefit-card:hover {

    transform:
        translateY(
            -6px
        );

    box-shadow:
        var(--shadow-md);

    border-color:
        var(--line-strong);

}


.benefit-icon {

    width:
        57px;

    height:
        57px;

    margin:
        0
        auto
        18px;

    display:
        grid;

    place-items:
        center;

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

    border-radius:
        50%;

    color:
        var(--gold-dark);

    background:
        rgba(
            213,
            189,
            131,
            .13
        );

    font:
        13px
        "Poppins",
        sans-serif;

}


.benefit-card h3 {

    color:
        var(--espresso);

    font-size:
        21px;

    margin-bottom:
        8px;

}


.benefit-card p {

    color:
        var(--text-soft);

}


/* =========================================================
   17 — PROCESS
========================================================= */

.process-grid {

    display:
        grid;

    grid-template-columns:
        1fr
        auto
        1fr
        auto
        1fr
        auto
        1fr;

    align-items:
        center;

}


.process-step {

    text-align:
        center;

}


.process-step > span {

    color:
        var(--gold-dark);

    font:
        13px
        "Poppins",
        sans-serif;

}


.process-step h3 {

    margin:
        4px
        0;

    color:
        var(--espresso);

    font-size:
        20px;

}


.process-step p {

    color:
        var(--text-muted);

}


.process-line {

    width:
        52px;

    height:
        1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            var(--gold),
            transparent
        );

}


/* =========================================================
   18 — GOOGLE REVIEWS
========================================================= */

.google-rating-summary {

    max-width:
        820px;

    margin:
        0
        auto
        35px;

    padding:
        25px
        30px;

    display:
        flex;

    align-items:
        center;

    gap:
        18px;

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

    border-radius:
        20px
        30px
        24px
        34px;

    background:
        linear-gradient(
            145deg,
            #fffdf8,
            #f8f1e4
        );

    box-shadow:
        var(--shadow-sm);

}


.google-mark {

    width:
        48px;

    height:
        48px;

    flex:
        0
        0
        48px;

    display:
        grid;

    place-items:
        center;

    border-radius:
        50%;

    background:
        #fff;

    box-shadow:
        var(--shadow-sm);

    font:
        700
        22px
        Arial,
        sans-serif;

    color:
        #4285f4;

}


.google-rating-summary strong {

    display:
        block;

    color:
        var(--espresso);

    font-size:
        20px;

}


.google-rating-summary span {

    display:
        block;

    color:
        var(--text-muted);

    font-size:
        13px;

}


.google-rating-summary .button {

    margin-right:
        auto;

    min-width:
        190px;

}


.review-trust-grid {

    display:
        grid;

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

    gap:
        18px;

    max-width:
        920px;

    margin:
        0
        auto;

}


.review-trust-card {

    padding:
        27px;

    text-align:
        center;

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

    border-radius:
        var(--radius-card);

    background:
        rgba(
            255,
            253,
            248,
            .55
        );

}


.review-trust-card span {

    display:
        block;

    margin-bottom:
        7px;

    color:
        var(--gold-dark);

    font:
        24px
        "Poppins",
        sans-serif;

}


.review-trust-card strong {

    color:
        var(--espresso);

}


.review-trust-card p {

    margin-top:
        6px;

    color:
        var(--text-muted);

    font-size:
        13px;

}


/* =========================================================
   PREMIUM EDITORIAL GALLERY FRAMES
========================================================= */

.gallery-grid {

    display:
        grid;

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

    gap:
        26px;

    align-items:
        start;

}


.gallery-item {

    position:
        relative;

    overflow:
        hidden;

    aspect-ratio:
        1 /
        .82;

    border:
        1px
        solid
        rgba(
            139,
            107,
            55,
            .42
        );

    border-radius:
        20px
        30px
        20px
        30px;

    background:
        var(--cream);

    box-shadow:
        0
        16px
        38px
        rgba(
            72,
            54,
            30,
            .11
        );

    isolation:
        isolate;

    transition:
        var(--transition);

}


/* Controlled editorial variation */

.gallery-item:nth-child(
    3n + 1
) {

    border-radius:
        30px
        30px
        30px
        10px;

}


.gallery-item:nth-child(
    3n + 2
) {

    margin-top:
        28px;

    border-radius:
        10px
        30px
        30px
        30px;

}


.gallery-item:nth-child(
    3n + 3
) {

    border-radius:
        30px
        10px
        30px
        30px;

}


/* Fine inner frame */

.gallery-item::before {

    content:
        "";

    position:
        absolute;

    inset:
        8px;

    z-index:
        2;

    border:
        1px
        solid
        rgba(
            255,
            253,
            248,
            .58
        );

    border-radius:
        inherit;

    pointer-events:
        none;

}


/* Small gold editorial corner */

.gallery-item::after {

    content:
        "";

    position:
        absolute;

    right:
        13px;

    bottom:
        13px;

    width:
        42px;

    height:
        42px;

    z-index:
        3;

    border-right:
        1px
        solid
        rgba(
            184,
            147,
            79,
            .62
        );

    border-bottom:
        1px
        solid
        rgba(
            184,
            147,
            79,
            .62
        );

    pointer-events:
        none;

}


.gallery-item img {

    width:
        100%;

    height:
        100%;

    object-fit:
        cover;

    transition:
        transform
        .85s
        cubic-bezier(
            .2,
            .7,
            .2,
            1
        ),

        filter
        .5s
        ease;

}


.gallery-item:hover {

    transform:
        translateY(
            -7px
        );

    border-color:
        rgba(
            139,
            107,
            55,
            .65
        );

    box-shadow:
        0
        24px
        55px
        rgba(
            72,
            54,
            30,
            .17
        );

}


.gallery-item:hover img {

    transform:
        scale(
            1.055
        );

    filter:
        saturate(
            1.04
        );

}


/* =========================================================
   20 — FAQ
========================================================= */

.faq-grid {

    display:
        grid;

    grid-template-columns:
        .75fr
        1.25fr;

    gap:
        80px;

}


.faq-list {

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

}


.faq-item {

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

}


.faq-question {

    width:
        100%;

    padding:
        21px
        0;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        20px;

    background:
        transparent;

    color:
        var(--espresso);

    text-align:
        right;

    font-size:
        17px;

}


.faq-question b {

    color:
        var(--gold-dark);

    font:
        26px/1
        "Poppins",
        sans-serif;

    transition:
        .25s
        ease;

}


.faq-open
.faq-question b {

    transform:
        rotate(
            45deg
        );

}


.faq-answer {

    max-height:
        0;

    overflow:
        hidden;

    transition:
        max-height
        .4s
        ease;

}


.faq-open
.faq-answer {

    max-height:
        300px;

}


.faq-answer p {

    padding:
        0
        0
        21px;

    color:
        var(--text-soft);

}


/* =========================================================
   21 — BOOKING
========================================================= */

.booking-section {

    position:
        relative;

    overflow:
        hidden;

    padding:
        125px
        0;

    isolation:
        isolate;

}


.booking-background {

    position:
        absolute;

    inset:
        0;

    z-index:
        -2;

    background:
        url(
            "../images/hero/hero.jpg"
        )
        center /
        cover
        no-repeat;

}


.booking-overlay {

    position:
        absolute;

    inset:
        0;

    z-index:
        -1;

    background:
        linear-gradient(
            90deg,
            rgba(
                59,
                47,
                34,
                .86
            ),
            rgba(
                230,
                211,
                168,
                .73
            )
        );

}


.booking-content {

    max-width:
        700px;

    color:
        #fffdf8;

}


.booking-content
.section-label {

    color:
        var(--champagne-light);

}


.booking-content h2 {

    margin:
        14px
        0;

    color:
        #fffdf8;

    font-size:
        clamp(
            45px,
            5.5vw,
            70px
        );

    line-height:
        1.04;

    font-weight:
        500;

}


.booking-content > p {

    max-width:
        620px;

    color:
        rgba(
            255,
            253,
            248,
            .8
        );

    font-size:
        18px;

}


.booking-notice {

    display:
        flex;

    align-items:
        center;

    gap:
        10px;

    margin:
        23px
        0;

    color:
        var(--champagne-light);

}


.booking-actions {

    margin-top:
        20px;

}


/* =========================================================
   22 — CONTACT
========================================================= */

.contact-grid {

    display:
        grid;

    grid-template-columns:
        1.15fr
        .85fr;

    gap:
        70px;

    align-items:
        start;

}


.contact-content h2 {

    margin:
        14px
        0
        18px;

    color:
        var(--espresso);

    font-size:
        clamp(
            40px,
            4.7vw,
            58px
        );

    line-height:
        1.06;

    font-weight:
        500;

}


.contact-content > p {

    color:
        var(--text-soft);

    font-size:
        17px;

}


.contact-details {

    display:
        grid;

    gap:
        9px;

    margin:
        28px
        0;

}


.contact-item {

    display:
        flex;

    align-items:
        center;

    gap:
        14px;

    padding:
        13px;

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

    background:
        rgba(
            255,
            253,
            248,
            .44
        );

    transition:
        .25s
        ease;

}


.contact-item:hover {

    border-color:
        var(--gold);

    transform:
        translateX(
            -3px
        );

    box-shadow:
        var(--shadow-sm);

}


.contact-icon {

    width:
        43px;

    height:
        43px;

    flex:
        0
        0
        43px;

    display:
        grid;

    place-items:
        center;

    border-radius:
        50%;

    background:
        linear-gradient(
            135deg,
            var(--gold),
            var(--gold-deep)
        );

    color:
        #fffdf8;

    font:
        10px
        "Poppins",
        sans-serif;

}


.contact-item small {

    display:
        block;

    color:
        var(--text-muted);

}


.contact-item strong {

    color:
        var(--espresso);

    font-weight:
        600;

}


.social-links {

    display:
        flex;

    gap:
        10px;

}


.social-link {

    width:
        45px;

    height:
        45px;

    font-family:
        Arial,
        sans-serif;

}


.contact-card {

    padding:
        44px;

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

    border-radius:
        30px
        44px
        36px
        50px;

    background:
        linear-gradient(
            145deg,
            #eadcc0,
            #d2b77d
        );

    box-shadow:
        var(--shadow-lg);

}


.contact-card h3 {

    margin:
        13px
        0;

    color:
        var(--espresso);

    font-size:
        34px;

    font-weight:
        500;

}


.contact-card p {

    color:
        var(--text-soft);

}


.opening-hours {

    margin:
        28px
        0;

    padding-top:
        18px;

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

}


.opening-hours h4 {

    margin-bottom:
        9px;

    color:
        var(--gold-deep);

}


.opening-hours p {

    display:
        flex;

    justify-content:
        space-between;

    gap:
        15px;

    padding:
        4px
        0;

    color:
        var(--text-soft);

}


/* =========================================================
   23 — FOOTER
========================================================= */

.footer-section {

    padding:
        70px
        0
        25px;

    color:
        var(--text-soft);

    background:
        linear-gradient(
            135deg,
            #e0d0ac,
            #c6a96e 55%,
            #b38f50
        );

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

}


.footer-grid {

    display:
        grid;

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

    gap:
        48px;

}


.footer-brand img {

    width:
        70px;

    height:
        70px;

    object-fit:
        contain;

    margin-bottom:
        12px;

}


.footer-brand > strong {

    display:
        block;

    color:
        var(--gold-deep);

    font:
        600
        15px
        "Poppins",
        sans-serif;

    letter-spacing:
        .18em;

}


.footer-brand p {

    max-width:
        290px;

    margin:
        8px
        0
        16px;

}


.footer-cta {

    color:
        var(--gold-deep);

    font-weight:
        700;

}


.footer-column {

    display:
        flex;

    flex-direction:
        column;

    gap:
        7px;

}


.footer-column h4 {

    margin-bottom:
        8px;

    color:
        var(--gold-deep);

}


.footer-column a {

    transition:
        .2s
        ease;

}


.footer-column a:hover {

    color:
        #fffdf8;

    transform:
        translateX(
            -2px
        );

}


.footer-bottom {

    margin-top:
        50px;

    padding-top:
        20px;

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

    text-align:
        center;

    font-size:
        13px;

    color:
        rgba(
            80,
            62,
            36,
            .75
        );

}


/* =========================================================
   24 — FLOATING WHATSAPP
========================================================= */

.floating-whatsapp {

    position:
        fixed;

    right:
        24px;

    bottom:
        24px;

    z-index:
        900;

    width:
        60px;

    height:
        60px;

    display:
        grid;

    place-items:
        center;

    border-radius:
        50%;

    color:
        #fffdf8;

    background:
        linear-gradient(
            135deg,
            #4d3a24,
            var(--gold)
        );

    box-shadow:
        0
        12px
        30px
        rgba(
            69,
            51,
            28,
            .25
        ),

        0
        0
        0
        5px
        rgba(
            213,
            189,
            131,
            .13
        );

    font-size:
        25px;

    transition:
        .3s
        ease;

}


.floating-whatsapp:hover {

    transform:
        translateY(
            -5px
        )
        scale(
            1.04
        );

}


.mobile-action-bar {

    display:
        none;

}


/* =========================================================
   25 — TABLET
========================================================= */

@media (
    max-width:
    1100px
) {

    .navbar {

        padding:
            0
            24px;

    }


    .nav-menu {

        gap:
            16px;

        margin-right:
            20px;

    }


    .services-grid {

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

    }


    .benefits-grid {

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

    }


    .credentials-track {

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

    }


    .gallery-grid {

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

    }


    .footer-grid {

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

    }


    .home-service-grid {

        gap:
            40px;

    }

}


/* =========================================================
   26 — MOBILE / TABLET
========================================================= */

@media (
    max-width:
    900px
) {

    .container {

        width:
            min(
                100% - 30px,
                720px
            );

    }


    .section-soft,
    .section-light {

        padding:
            82px
            0;

    }


    .header-socials {

        display:
            none;

    }


    .mobile-menu-toggle {

        width:
            42px;

        height:
            42px;

        margin-right:
            14px;

        display:
            flex;

        flex-direction:
            column;

        align-items:
            center;

        justify-content:
            center;

        gap:
            5px;

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

        background:
            rgba(
                255,
                253,
                248,
                .5
            );

    }


    .mobile-menu-toggle span {

        width:
            20px;

        height:
            1.5px;

        background:
            var(--gold-dark);

        transition:
            .25s
            ease;

    }


    .menu-open
    span:nth-child(1) {

        transform:
            translateY(
                6.5px
            )
            rotate(
                45deg
            );

    }


    .menu-open
    span:nth-child(2) {

        opacity:
            0;

    }


    .menu-open
    span:nth-child(3) {

        transform:
            translateY(
                -6.5px
            )
            rotate(
                -45deg
            );

    }


    .nav-menu {

        position:
            absolute;

        top:
            100%;

        right:
            0;

        left:
            0;

        margin:
            0;

        padding:
            20px;

        display:
            flex;

        flex-direction:
            column;

        align-items:
            stretch;

        gap:
            0;

        background:
            linear-gradient(
                145deg,
                #f0e4cb,
                #d8c294
            );

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

        box-shadow:
            0
            20px
            40px
            rgba(
                75,
                56,
                29,
                .16
            );

        opacity:
            0;

        visibility:
            hidden;

        transform:
            translateY(
                -8px
            );

        transition:
            .3s
            ease;

    }


    .nav-menu.nav-open {

        opacity:
            1;

        visibility:
            visible;

        transform:
            translateY(
                0
            );

    }


    .nav-link {

        padding:
            12px
            4px;

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

    }


    .nav-link::after {

        display:
            none;

    }


    .nav-book-button {

        margin-top:
            15px;

        text-align:
            center;

    }


    .mobile-socials {

        display:
            flex;

        justify-content:
            center;

        gap:
            10px;

        margin-top:
            18px;

    }


    .mobile-social-link {

        width:
            40px;

        height:
            40px;

        font-family:
            Arial,
            sans-serif;

    }


    .hero-section {

        min-height:
            calc(
                100vh - 76px
            );

    }


    .hero-overlay {

        background:
            linear-gradient(
                90deg,
                rgba(
                    248,
                    242,
                    230,
                    .42
                ),
                rgba(
                    248,
                    242,
                    230,
                    .84
                )
            );

    }


    .hero-content {

        max-width:
            100%;

    }


    .hero-content h1 {

        font-size:
            clamp(
                43px,
                11vw,
                66px
            );

    }


    .hero-description {

        font-size:
            17px;

    }


    .home-service-grid,
    .about-grid,
    .faq-grid,
    .contact-grid {

        grid-template-columns:
            1fr;

        gap:
            48px;

    }


    .home-service-visual {

        min-height:
            260px;

        max-width:
            480px;

        width:
            100%;

        margin-inline:
            auto;

    }


    .about-image-wrapper {

        max-width:
            530px;

        width:
            100%;

        margin-inline:
            auto;

    }


    .credentials-carousel {

        gap:
            7px;

    }


    .credentials-track {

        grid-template-columns:
            1fr;

    }


    .credential-card {

        display:
            none;

    }


    .credential-card.active {

        display:
            block;

    }


    .credentials-dots {

        display:
            flex;

    }


    .statistics-grid {

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

        row-gap:
            28px;

    }


    .stat-item:nth-child(2) {

        border-left:
            0;

    }


    .process-grid {

        grid-template-columns:
            1fr;

        gap:
            22px;

    }


    .process-line {

        width:
            1px;

        height:
            30px;

        background:
            linear-gradient(
                transparent,
                var(--gold),
                transparent
            );

    }


    .google-rating-summary {

        flex-wrap:
            wrap;

    }


    .google-rating-summary .button {

        margin-right:
            0;

        width:
            100%;

    }


    .review-trust-grid {

        grid-template-columns:
            1fr;

    }


    .gallery-grid {

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

    }


    .floating-whatsapp {

        right:
            18px;

        bottom:
            78px;

        width:
            54px;

        height:
            54px;

    }


    .mobile-action-bar {

        position:
            fixed;

        right:
            0;

        bottom:
            0;

        left:
            0;

        z-index:
            850;

        display:
            grid;

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

        min-height:
            62px;

        background:
            rgba(
                60,
                48,
                35,
                .96
            );

        color:
            #fffdf8;

        box-shadow:
            0
            -8px
            25px
            rgba(
                60,
                48,
                35,
                .16
            );

        backdrop-filter:
            blur(
                12px
            );

    }


    .mobile-action-bar a {

        display:
            flex;

        flex-direction:
            column;

        align-items:
            center;

        justify-content:
            center;

        gap:
            1px;

        border-left:
            1px
            solid
            rgba(
                255,
                255,
                255,
                .12
            );

        font-size:
            15px;

    }


    .mobile-action-bar a:last-child {

        color:
            var(--champagne-light);

    }


    .mobile-action-bar span {

        font-size:
            11px;

    }


    body {

        padding-bottom:
            62px;

    }

}
/* =========================================================
   MOBILE — EDITORIAL IMAGE FRAMES
========================================================= */

@media (
    max-width:
    600px
) {

    .service-image {

        margin:
            12px;

        height:
            275px;

        border-radius:
            18px
            25px
            18px
            25px;

    }


    .about-image-wrapper {

        padding:
            10px
            10px
            16px
            4px;

    }


    .about-image-frame {

        padding:
            8px;

        border-radius:
            20px
            28px
            20px
            28px;

    }


    .about-image-frame::before {

        top:
            12px;

        right:
            -10px;

        bottom:
            -12px;

        left:
            10px;

        border-radius:
            22px
            30px
            22px
            30px;

    }


    .gallery-item:nth-child(
        3n + 2
    ) {

        margin-top:
            0;

    }


    .gallery-item {

        border-radius:
            18px
            26px
            18px
            26px;

    }


    .gallery-item:nth-child(
        3n + 1
    ),
    .gallery-item:nth-child(
        3n + 2
    ),
    .gallery-item:nth-child(
        3n + 3
    ) {

        border-radius:
            18px
            26px
            18px
            26px;

    }

}


/* =========================================================
   27 — SMALL MOBILE
========================================================= */

@media (
    max-width:
    600px
) {

    .container {

        width:
            calc(
                100% - 28px
            );

    }


    .navbar {

        min-height:
            76px;

        padding:
            0
            14px;

    }


    .brand {

        gap:
            8px;

    }


    .brand-logo {

        width:
            44px;

        height:
            44px;

    }


    .brand-text {

        font-size:
            12px;

        letter-spacing:
            .13em;

    }


    .brand-text small {

        font-size:
            7px;

    }


    .mobile-menu-toggle {

        margin-right:
            9px;

    }


    .hero-content h1 {

        font-size:
            44px;

    }


    .hero-actions,
    .booking-actions {

        display:
            grid;

        grid-template-columns:
            1fr;

    }


    .button {

        width:
            100%;

    }


    .hero-trust-row {

        display:
            grid;

        grid-template-columns:
            1fr;

        gap:
            8px;

    }


    .hero-trust-row span {

        padding:
            0
            10px
            0
            0;

        border-left:
            0;

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

    }


    .hero-trust-row span:last-child {

        padding-right:
            10px;

    }


    .services-grid,
    .benefits-grid,
    .gallery-grid {

        grid-template-columns:
            1fr;

    }


    .service-image {

        height:
            275px;

    }


    .service-content p {

        min-height:
            0;

    }


    .about-content h2 {

        font-size:
            39px;

    }


    .about-features {

        grid-template-columns:
            1fr;

    }


    .experience-badge {

        right:
            -5px;

        bottom:
            22px;

        width:
            105px;

        height:
            105px;

    }


    .experience-badge strong {

        font-size:
            29px;

    }


    .statistics-section {

        padding:
            55px
            0;

    }


    .stat-item {

        border-left:
            0;

        border-bottom:
            1px
            solid
            rgba(
                255,
                255,
                255,
                .22
            );

        padding-bottom:
            20px;

    }


    .stat-item strong {

        font-size:
            38px;

    }


    .credentials-carousel {

        align-items:
            center;

    }


    .credential-image {

        height:
            315px;

    }


    .credential-carousel-arrow {

        width:
            38px;

        height:
            38px;

        flex-basis:
            38px;

        font-size:
            16px;

    }


    .gallery-item {

        aspect-ratio:
            1 /
            .78;

    }


    .contact-card {

        padding:
            31px
            23px;

    }


    .footer-grid {

        grid-template-columns:
            1fr
            1fr;

        gap:
            30px
            18px;

    }


    .footer-brand {

        grid-column:
            1 /
            -1;

    }


    .popup-window {

        padding:
            12px;

    }


    .popup-left {

        display:
            none;

    }


    .popup-right {

        width:
            100%;

        min-height:
            auto;

        max-height:
            92vh;

        overflow-y:
            auto;

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

        border-radius:
            22px;

        padding:
            45px
            21px
            28px;

    }


    .popup-content h1 {

        font-size:
            27px;

    }


    .popup-logo {

        width:
            70px;

        height:
            70px;

    }


    .home-service-section {

        padding:
            90px
            0;

    }

}


/* =========================================================
   28 — VERY SMALL PHONES
========================================================= */

@media (
    max-width:
    380px
) {

    .container {

        width:
            calc(
                100% - 22px
            );

    }


    .brand-logo {

        width:
            39px;

        height:
            39px;

    }


    .brand-text {

        font-size:
            11px;

    }


    .hero-content h1 {

        font-size:
            39px;

    }


    .section-heading h2 {

        font-size:
            33px;

    }


    .about-content h2 {

        font-size:
            34px;

    }


    .service-image {

        height:
            250px;

    }

}


/* =========================================================
   29 — REDUCED MOTION
========================================================= */

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

    *,
    *::before,
    *::after {

        scroll-behavior:
            auto
            !important;

        animation:
            none
            !important;

        transition-duration:
            .01ms
            !important;

    }


    .reveal {

        opacity:
            1;

        transform:
            none;

    }

}


/* =========================================================
   30 — RANDOMIZED EDITORIAL FRAME RHYTHM
   Purpose:
   Break the repetitive "six identical cards" feeling.
   Variation is intentional, deterministic, and responsive.
   No rotation / no diagonal geometry.
   ========================================================= */

/* ---------------------------------------------------------
   SERVICES — six distinct visual personalities
   --------------------------------------------------------- */

.services-grid {
    align-items: start;
    gap: 30px 24px;
}

.services-grid .service-card {
    position: relative;
}

.services-grid .service-card:nth-child(1) .service-image {
    height: 305px;
    margin: 10px 24px 20px 8px;
    border-radius: 34px 18px 46px 22px;
}

.services-grid .service-card:nth-child(1) .service-image::after {
    width: 58px;
    height: 58px;
    right: -5px;
    bottom: -5px;
    border-radius: 0 0 24px 0;
}

.services-grid .service-card:nth-child(2) .service-image {
    height: 370px;
    margin: 28px 8px 16px 26px;
    border-radius: 18px 44px 24px 54px;
}

.services-grid .service-card:nth-child(2) .service-image::after {
    left: -6px;
    right: auto;
    bottom: -6px;
    width: 78px;
    height: 52px;
    border-right: 0;
    border-left: 1px solid rgba(184, 147, 79, .65);
    border-bottom: 1px solid rgba(184, 147, 79, .65);
    border-radius: 0 0 0 22px;
}

.services-grid .service-card:nth-child(3) .service-image {
    height: 265px;
    margin: 18px 14px 30px 2px;
    border-radius: 52px 22px 18px 38px;
}

.services-grid .service-card:nth-child(3) .service-image::before {
    inset: 11px 18px 8px 7px;
    border-radius: 42px 16px 14px 30px;
}

.services-grid .service-card:nth-child(3) .service-image::after {
    right: 12px;
    bottom: -8px;
    width: 46px;
    height: 76px;
    border-radius: 0 0 18px 0;
}

.services-grid .service-card:nth-child(4) .service-image {
    height: 395px;
    margin: 4px 2px 18px 30px;
    border-radius: 20px 58px 32px 18px;
}

.services-grid .service-card:nth-child(4) .service-image::after {
    right: -8px;
    bottom: 18px;
    width: 62px;
    height: 38px;
    border-radius: 0 0 18px 0;
}

.services-grid .service-card:nth-child(5) .service-image {
    height: 285px;
    margin: 34px 28px 12px 12px;
    border-radius: 26px 18px 58px 30px;
}

.services-grid .service-card:nth-child(5) .service-image::before {
    inset: 6px 9px 13px 14px;
    border-radius: 20px 13px 50px 25px;
}

.services-grid .service-card:nth-child(5) .service-image::after {
    left: -7px;
    right: auto;
    bottom: 14px;
    width: 66px;
    height: 48px;
    border-right: 0;
    border-left: 1px solid rgba(184, 147, 79, .65);
    border-bottom: 1px solid rgba(184, 147, 79, .65);
}

.services-grid .service-card:nth-child(6) .service-image {
    height: 340px;
    margin: 20px 10px 24px 22px;
    border-radius: 44px 20px 28px 56px;
}

.services-grid .service-card:nth-child(6) .service-image::after {
    right: 10px;
    bottom: -8px;
    width: 84px;
    height: 62px;
    border-radius: 0 0 28px 0;
}

/* Subtle vertical rhythm makes adjacent cards feel less templated. */
.services-grid .service-card:nth-child(2),
.services-grid .service-card:nth-child(4),
.services-grid .service-card:nth-child(6) {
    transform: translateY(22px);
}

.services-grid .service-card:nth-child(2):hover,
.services-grid .service-card:nth-child(4):hover,
.services-grid .service-card:nth-child(6):hover {
    transform: translateY(15px);
}


/* ---------------------------------------------------------
   CREDENTIALS — deliberately mixed proportions
   --------------------------------------------------------- */

.credentials-track {
    align-items: start;
    gap: 28px;
}

.credentials-track .credential-card {
    position: relative;
}

.credentials-track .credential-card:nth-child(1) .credential-image {
    height: 300px;
    margin: 26px 22px 16px 4px;
    border-radius: 42px 20px 26px 54px;
}

.credentials-track .credential-card:nth-child(1) .credential-image::before {
    inset: 10px 7px 15px 12px;
    border-radius: 34px 15px 20px 45px;
}

.credentials-track .credential-card:nth-child(1) .credential-image::after {
    left: auto;
    right: 12px;
    bottom: -5px;
    width: 52px;
    height: 70px;
    border-left: 0;
    border-right: 1px solid rgba(184, 147, 79, .55);
    border-bottom: 1px solid rgba(184, 147, 79, .55);
    border-radius: 0 0 20px 0;
}

.credentials-track .credential-card:nth-child(2) .credential-image {
    height: 385px;
    margin: 2px 6px 24px 28px;
    border-radius: 18px 56px 22px 34px;
}

.credentials-track .credential-card:nth-child(2) .credential-image::after {
    left: -6px;
    bottom: 18px;
    width: 70px;
    height: 44px;
    border-left: 1px solid rgba(184, 147, 79, .55);
    border-right: 0;
    border-bottom: 1px solid rgba(184, 147, 79, .55);
    border-radius: 0 0 0 18px;
}

.credentials-track .credential-card:nth-child(3) .credential-image {
    height: 270px;
    margin: 38px 16px 12px 0;
    border-radius: 58px 24px 18px 30px;
}

.credentials-track .credential-card:nth-child(3) .credential-image::before {
    inset: 7px 14px 11px 8px;
    border-radius: 48px 18px 13px 24px;
}

.credentials-track .credential-card:nth-child(3) .credential-image::after {
    right: 16px;
    left: auto;
    bottom: -6px;
    width: 42px;
    height: 62px;
    border-left: 0;
    border-right: 1px solid rgba(184, 147, 79, .55);
    border-bottom: 1px solid rgba(184, 147, 79, .55);
}

.credentials-track .credential-card:nth-child(4) .credential-image {
    height: 345px;
    margin: 12px 30px 20px 8px;
    border-radius: 24px 34px 62px 18px;
}

.credentials-track .credential-card:nth-child(4) .credential-image::after {
    left: -7px;
    right: auto;
    bottom: 12px;
    width: 62px;
    height: 54px;
    border-left: 1px solid rgba(184, 147, 79, .55);
    border-right: 0;
    border-bottom: 1px solid rgba(184, 147, 79, .55);
    border-radius: 0 0 0 22px;
}

.credentials-track .credential-card:nth-child(5) .credential-image {
    height: 315px;
    margin: 30px 10px 14px 24px;
    border-radius: 20px 62px 28px 20px;
}

.credentials-track .credential-card:nth-child(5) .credential-image::before {
    inset: 12px 8px 7px 15px;
    border-radius: 15px 50px 21px 15px;
}

.credentials-track .credential-card:nth-child(5) .credential-image::after {
    right: -5px;
    left: auto;
    bottom: 15px;
    width: 72px;
    height: 38px;
    border-left: 0;
    border-right: 1px solid rgba(184, 147, 79, .55);
    border-bottom: 1px solid rgba(184, 147, 79, .55);
}

.credentials-track .credential-card:nth-child(6) .credential-image {
    height: 410px;
    margin: 0 20px 28px 2px;
    border-radius: 50px 18px 32px 58px;
}

.credentials-track .credential-card:nth-child(6) .credential-image::after {
    left: 10px;
    right: auto;
    bottom: -7px;
    width: 86px;
    height: 58px;
    border-radius: 0 0 0 26px;
}

/* Different vertical rhythm without rotation. */
.credentials-track .credential-card:nth-child(2),
.credentials-track .credential-card:nth-child(4),
.credentials-track .credential-card:nth-child(6) {
    transform: translateY(20px);
}

.credentials-track .credential-card:nth-child(2):hover,
.credentials-track .credential-card:nth-child(4):hover,
.credentials-track .credential-card:nth-child(6):hover {
    transform: translateY(13px);
}


/* ---------------------------------------------------------
   BENEFITS — break the uniform four-card rhythm too
   --------------------------------------------------------- */

.benefits-grid {
    align-items: start;
    gap: 22px;
}

.benefits-grid .benefit-card:nth-child(1) {
    border-radius: 42px 22px 28px 54px;
    padding-top: 40px;
}

.benefits-grid .benefit-card:nth-child(2) {
    margin-top: 26px;
    border-radius: 20px 52px 24px 30px;
}

.benefits-grid .benefit-card:nth-child(3) {
    border-radius: 28px 18px 58px 24px;
    padding-bottom: 42px;
}

.benefits-grid .benefit-card:nth-child(4) {
    margin-top: 12px;
    border-radius: 54px 26px 20px 38px;
}


/* ---------------------------------------------------------
   REVIEW TRUST — not identical rectangles
   --------------------------------------------------------- */

.review-trust-grid {
    align-items: start;
}

.review-trust-card:nth-child(1) {
    border-radius: 38px 20px 30px 48px;
}

.review-trust-card:nth-child(2) {
    margin-top: 22px;
    border-radius: 18px 46px 22px 30px;
}

.review-trust-card:nth-child(3) {
    border-radius: 24px 30px 52px 18px;
}


/* ---------------------------------------------------------
   GALLERY — stronger variation, still clean and premium
   --------------------------------------------------------- */

.gallery-item:nth-child(1) {
    aspect-ratio: 1 / .96;
    border-radius: 42px 18px 28px 54px;
}

.gallery-item:nth-child(2) {
    margin-top: 54px;
    aspect-ratio: 1 / .70;
    border-radius: 18px 54px 24px 30px;
}

.gallery-item:nth-child(3) {
    aspect-ratio: 1 / 1.08;
    border-radius: 28px 20px 58px 24px;
}

.gallery-item:nth-child(4) {
    margin-top: -14px;
    aspect-ratio: 1 / .78;
    border-radius: 56px 24px 18px 34px;
}

.gallery-item:nth-child(5) {
    margin-top: 32px;
    aspect-ratio: 1 / 1.02;
    border-radius: 20px 48px 28px 58px;
}

.gallery-item:nth-child(6) {
    aspect-ratio: 1 / .68;
    border-radius: 18px 28px 52px 22px;
}


/* ---------------------------------------------------------
   RESPONSIVE — preserve variation without breaking layout
   --------------------------------------------------------- */

@media (max-width: 1100px) {
    .services-grid .service-card:nth-child(n) {
        transform: none;
    }

    .services-grid .service-card:nth-child(2) .service-image,
    .services-grid .service-card:nth-child(4) .service-image {
        height: 335px;
    }

    .services-grid .service-card:nth-child(6) .service-image {
        height: 315px;
    }

    .credentials-track .credential-card:nth-child(n) {
        transform: none;
    }

    .credentials-track .credential-card:nth-child(2) .credential-image,
    .credentials-track .credential-card:nth-child(6) .credential-image {
        height: 350px;
    }

    .gallery-item:nth-child(4) {
        margin-top: 0;
    }
}

@media (max-width: 900px) {
    .services-grid .service-card:nth-child(1) .service-image,
    .services-grid .service-card:nth-child(3) .service-image,
    .services-grid .service-card:nth-child(5) .service-image {
        height: 285px;
    }

    .services-grid .service-card:nth-child(2) .service-image,
    .services-grid .service-card:nth-child(4) .service-image,
    .services-grid .service-card:nth-child(6) .service-image {
        height: 325px;
    }

    .credentials-track .credential-card:nth-child(1) .credential-image,
    .credentials-track .credential-card:nth-child(3) .credential-image,
    .credentials-track .credential-card:nth-child(5) .credential-image {
        height: 290px;
    }

    .credentials-track .credential-card:nth-child(2) .credential-image,
    .credentials-track .credential-card:nth-child(4) .credential-image,
    .credentials-track .credential-card:nth-child(6) .credential-image {
        height: 335px;
    }

    .gallery-item:nth-child(1),
    .gallery-item:nth-child(3),
    .gallery-item:nth-child(5) {
        aspect-ratio: 1 / .88;
    }

    .gallery-item:nth-child(2),
    .gallery-item:nth-child(4),
    .gallery-item:nth-child(6) {
        aspect-ratio: 1 / .78;
    }
}

@media (max-width: 600px) {
    .services-grid .service-card:nth-child(n) {
        transform: none;
    }

    .services-grid .service-card:nth-child(1) .service-image,
    .services-grid .service-card:nth-child(3) .service-image,
    .services-grid .service-card:nth-child(5) .service-image {
        height: 260px;
        margin: 12px 14px 18px 4px;
    }

    .services-grid .service-card:nth-child(2) .service-image,
    .services-grid .service-card:nth-child(4) .service-image,
    .services-grid .service-card:nth-child(6) .service-image {
        height: 315px;
        margin: 22px 4px 18px 18px;
    }

    .credentials-track .credential-card:nth-child(n) {
        transform: none;
    }

    .credentials-track .credential-card:nth-child(1) .credential-image,
    .credentials-track .credential-card:nth-child(3) .credential-image,
    .credentials-track .credential-card:nth-child(5) .credential-image {
        height: 275px;
        margin: 18px 12px 14px 4px;
    }

    .credentials-track .credential-card:nth-child(2) .credential-image,
    .credentials-track .credential-card:nth-child(4) .credential-image,
    .credentials-track .credential-card:nth-child(6) .credential-image {
        height: 315px;
        margin: 18px 4px 14px 16px;
    }

    .benefits-grid .benefit-card:nth-child(2),
    .benefits-grid .benefit-card:nth-child(4),
    .review-trust-card:nth-child(2) {
        margin-top: 0;
    }

    .gallery-item:nth-child(n) {
        margin-top: 0;
    }

    .gallery-item:nth-child(1),
    .gallery-item:nth-child(3),
    .gallery-item:nth-child(5) {
        aspect-ratio: 1 / .90;
    }

    .gallery-item:nth-child(2),
    .gallery-item:nth-child(4),
    .gallery-item:nth-child(6) {
        aspect-ratio: 1 / .78;
    }
}

@media (max-width: 380px) {
    .services-grid .service-card:nth-child(n) .service-image {
        height: 245px;
        margin-inline: 4px;
    }

    .services-grid .service-card:nth-child(2) .service-image,
    .services-grid .service-card:nth-child(4) .service-image,
    .services-grid .service-card:nth-child(6) .service-image {
        height: 285px;
    }

    .credentials-track .credential-card:nth-child(n) .credential-image {
        height: 270px;
        margin-inline: 4px;
    }

    .credentials-track .credential-card:nth-child(2) .credential-image,
    .credentials-track .credential-card:nth-child(4) .credential-image,
    .credentials-track .credential-card:nth-child(6) .credential-image {
        height: 295px;
    }
}