/* ==========================================================
   URISTST — EDITORIAL POLISH
   CSS only / lightweight
   ========================================================== */

:root {
    --ur-editorial-ink: #172231;
    --ur-editorial-muted: #5E6470;
    --ur-editorial-accent: #9A503F;
    --ur-editorial-bg: #F4F1EB;
    --ur-editorial-line: #D8D3CA;
}


/* ----------------------------------------------------------
   SECTION RHYTHM
   ---------------------------------------------------------- */

.home .ul-section,
.home .ul-about,
.home .ul-services,
.home .ul-process,
.home .ul-why,
.home .ul-faq {
    position: relative;
}

.home .ul-section + .ul-section,
.home .ul-about + .ul-services,
.home .ul-services + .ul-process,
.home .ul-process + .ul-why,
.home .ul-why + .ul-faq {
    border-top: 1px solid rgba(216, 211, 202, .72);
}


/* ----------------------------------------------------------
   EDITORIAL H2 ACCENT
   ---------------------------------------------------------- */

.home .entry-content h2,
.page .entry-content h2 {
    position: relative;
}

.home .entry-content h2::after,
.page .entry-content h2::after {
    content: "";

    display: block;

    width: 38px;
    height: 2px;

    margin-top: 16px;

    background: var(--ur-editorial-accent);

    border-radius: 999px;
}


/*
 * Do not add decorative rule inside the dark consultation block.
 */
.ul-cta h2::after,
.uristst-service-cta h2::after,
#consultation h2::after {
    display: none !important;
}


/* ----------------------------------------------------------
   SUBTLE BACKGROUND DEPTH
   ---------------------------------------------------------- */

body.home .ul-services,
body.home .ul-why {
    background: rgba(255, 255, 255, .24);
}

body.home .ul-process,
body.home .ul-faq {
    background: rgba(244, 241, 235, .55);
}


/* ----------------------------------------------------------
   SMALL EDITORIAL LABEL FEEL
   ---------------------------------------------------------- */

.home .ul-section-title,
.home .ul-eyebrow,
.home .section-eyebrow,
.home [class*="eyebrow"] {
    color: var(--ur-editorial-accent);

    font-size: 12px;

    font-weight: 700;

    text-transform: uppercase;

    letter-spacing: .12em;
}


/* ----------------------------------------------------------
   CARDS — MORE REFINED, NOT "SAAS"
   ---------------------------------------------------------- */

.home .ul-step,
.home .ul-why-item,
.home .ul-service-card {
    border-color: rgba(216, 211, 202, .88);

    transition:
        transform 180ms ease,
        border-color 180ms ease,
        box-shadow 180ms ease;
}

.home .ul-step:hover,
.home .ul-why-item:hover,
.home .ul-service-card:hover {
    transform: translateY(-2px);

    border-color: rgba(154, 80, 63, .45);

    box-shadow:
        0 14px 30px rgba(23, 34, 49, .055);
}


/* ----------------------------------------------------------
   SERVICE PAGES
   ---------------------------------------------------------- */

body:not(.home) .entry-content > section {
    position: relative;
}

body:not(.home) .entry-content > section + section {
    border-top: 1px solid rgba(216, 211, 202, .62);
}


/* ----------------------------------------------------------
   MOBILE
   ---------------------------------------------------------- */

@media (max-width: 768px) {

    body.home .ul-about::before,
    body.home .ul-services::before,
    body.home .ul-process::before,
    body.home .ul-why::before,
    body.home .ul-faq::before {
        top: 20px;
        right: 20px;

        font-size: 42px;
    }

    .home .entry-content h2::after,
    .page .entry-content h2::after {
        width: 30px;

        margin-top: 12px;
    }
}


/* ----------------------------------------------------------
   ACCESSIBILITY
   ---------------------------------------------------------- */

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

    .home .ul-step,
    .home .ul-why-item,
    .home .ul-service-card {
        transition: none !important;
    }

    .home .ul-step:hover,
    .home .ul-why-item:hover,
    .home .ul-service-card:hover {
        transform: none;
    }
}