/* Homepage sections below the hero. */

html.front-home-root-with-sections,
body.public-front.front-home.front-home-sections {
    height: auto;
    min-height: 100%;
    overflow: auto;
    scrollbar-width: none;
}

html.front-home-root-with-sections::-webkit-scrollbar,
body.public-front.front-home.front-home-sections::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
}

.front-home .public-topbar {
    transition: width .24s ease, left .24s ease, transform .24s ease, padding .24s ease, background .24s ease;
}

.front-home .public-desktop-nav,
.front-home .public-desktop-auth,
.front-home .public-mobile-menu {
    transition: opacity .18s ease;
    display: none;
}

.front-home.front-home-menu-visible .public-topbar {
    width: min(1180px, calc(100% - 32px));
    left: 50%;
    right: auto;
    transform: translateX(-50%);
    min-height: 68px;
    padding: 11px 16px 11px 14px;
}

.front-home.front-home-menu-visible .public-desktop-nav,
.front-home.front-home-menu-visible .public-desktop-auth {
    display: flex;
}

.front-home.front-home-menu-visible .public-contacts,
.front-home.front-home-menu-visible .public-contact-toggle {
    display: none;
}

.front-home.front-home-sections .public-container {
    min-height: 100vh;
    overflow: visible;
}

.front-home-sections .zf-scroll-hero {
    position: relative;
    height: 100svh;
    min-height: 100svh;
    overflow: hidden;
    touch-action: auto;
}

.front-home-sections .zf-hero-sticky {
    position: relative;
    top: 0;
    height: 100svh;
}

.front-home-no-hero .public-container > .home-content-block:first-child,
.front-home-no-hero .public-container > .home-inline-footer:first-child {
    margin-top: 122px;
}

.home-content-block {
    position: relative;
    z-index: 2;
    width: min(1180px, calc(100% - 32px));
    margin: clamp(110px, 12vw, 180px) auto;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
}

.front-home-sections .zf-scroll-hero + .home-content-block {
    margin-top: clamp(90px, 10vw, 150px);
}

.home-block-heading {
    max-width: 820px;
    margin-bottom: 26px;
}

.home-block-heading h2 {
    margin: 0;
    color: var(--zf-forest);
    font-family: var(--zf-font-display);
    font-size: clamp(34px, 4.5vw, 54px);
    line-height: 1.05;
    letter-spacing: -.04em;
}

.home-block-heading p {
    margin: 10px 0 0;
    color: rgba(23,35,27,.68);
    font-size: 15px;
    line-height: 1.65;
}

.home-selection-filter {
    display: grid;
    gap: 24px;
    padding: 22px;
    border: 1px solid rgba(16,59,45,.10);
    border-radius: 22px;
    background: rgba(255,255,255,.55);
}

.home-selection-filter-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    align-items: stretch;
}

.home-filter-select {
    display: grid;
    gap: 7px;
    padding: 12px 13px 14px;
    border: 1px solid rgba(16,59,45,.10);
    border-radius: 14px;
    background: rgba(255,255,255,.54);
}

.home-filter-select > span {
    color: var(--zf-forest);
    font-size: 12px;
    font-weight: 800;
}

.home-filter-select select {
    width: 100%;
    min-height: 42px;
    padding: 0 36px 0 12px;
    border: 1px solid rgba(16,59,45,.14);
    border-radius: 11px;
    background: rgba(255,255,255,.82);
    color: var(--zf-ink);
    font: inherit;
}

.home-selection-submit {
    justify-self: center;
    min-width: min(420px, 100%);
    min-height: 62px;
    padding: 0 34px;
    border: 0;
    border-radius: 999px;
    background: linear-gradient(135deg, #103b2d, #2b6b4e);
    color: #fff;
    box-shadow: 0 18px 42px rgba(16,59,45,.25);
    font: inherit;
    font-size: 18px;
    font-weight: 850;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
}

.home-selection-submit:hover {
    transform: translateY(-2px);
    box-shadow: 0 23px 48px rgba(16,59,45,.30);
}

.home-selection-results-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 18px;
    margin: 30px 0 16px;
}

.home-selection-results-head h3 {
    margin: 0;
    color: var(--zf-forest);
    font-family: var(--zf-font-display);
    font-size: 28px;
}

.home-selection-results-head span { display: none; }

.home-selection-results {
    grid-template-columns: repeat(3, minmax(0,1fr));
}

.home-result-card h3 {
    margin: 20px 0 7px;
    color: var(--zf-forest);
    font-family: var(--zf-font-display);
    font-size: 24px;
}

.home-selection-empty {
    padding: 24px;
    border: 1px dashed rgba(16,59,45,.20);
    border-radius: 17px;
    background: rgba(255,255,255,.44);
    color: rgba(23,35,27,.66);
    text-align: center;
}

.home-selection-block {
    overflow: visible;
    isolation: isolate;
}

.home-selection-block::after {
    content: "";
    position: absolute;
    z-index: 0;
    left: calc((100vw - 100%) / -2);
    bottom: -40px;
    width: min(46vw, 737px);
    aspect-ratio: 737 / 625;
    background: url("/assets/front/fon_left.webp") left bottom / contain no-repeat;
    pointer-events: none;
}

.home-selection-block > * {
    position: relative;
    z-index: 2;
}

.home-block-more {
    display: flex;
    justify-content: center;
    margin-top: 26px;
}

.home-block-more .btn {
    min-width: 230px;
    text-align: center;
}

.home-directions-block .directions-grid {
    margin-top: 4px;
    grid-template-columns: repeat(var(--directions-columns), minmax(0, 1fr));
}

.home-services-block .home-service-grid {
    grid-template-columns: repeat(3, minmax(0,1fr));
}

.home-services-block .public-card h3 {
    margin-top: 0;
    color: var(--zf-forest);
    font-family: var(--zf-font-display);
    font-size: 24px;
}

.home-services-block .public-card strong { color: var(--zf-forest); }

.home-articles-block .home-block-heading {
    margin-bottom: 28px;
}

.home-articles-grid {
    margin-top: 0;
}

.home-articles-block .article-card h3 {
    margin: 0 0 12px;
    font-size: 22px;
    line-height: 1.2;
}

.home-articles-block .home-block-more {
    margin-top: 26px;
}

.directions-description {
    max-width: 760px;
    margin: -8px 0 24px;
    color: rgba(23,35,27,.66);
    line-height: 1.6;
}

.front-home [id^="home-"],
.front-home #site-footer {
    scroll-margin-top: 118px;
}

@media (max-width: 980px) {
    .front-home.front-home-menu-visible .public-desktop-nav {
        display: none;
    }

    .front-home.front-home-menu-visible .public-desktop-auth {
        display: flex;
        order: 21;
        margin-left: 7px;
    }

    .front-home.front-home-menu-visible .public-mobile-menu {
        display: block;
        order: 20;
        margin-left: auto;
    }

    .front-home.front-home-menu-visible .public-topbar {
        width: min(720px, calc(100% - 20px));
        top: 10px;
    }

    .home-selection-results,
    .home-services-block .home-service-grid {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }
}

@media (max-width: 680px) {
    .front-home-sections .zf-scroll-hero {
        height: 100svh;
        min-height: 100svh;
    }

    .home-content-block {
        width: calc(100% - 20px);
        margin: 84px auto;
        padding: 0;
        border-radius: 0;
    }

    .home-selection-filter { padding: 14px; }

    .home-selection-filter-grid,
    .home-selection-results,
    .home-services-block .home-service-grid {
        grid-template-columns: 1fr;
    }

    .home-selection-results-head {
        align-items: flex-start;
        flex-direction: column;
        gap: 5px;
    }

    .home-selection-submit {
        min-height: 56px;
        font-size: 16px;
    }

    .home-selection-block::after {
        left: -20px;
        bottom: -20px;
        width: min(92vw, 520px);
    }
}

@media (max-width: 620px) {
    .home-articles-block .article-card h3 {
        font-size: 20px;
    }
}
