.lrc-pill,
.lrc-sheet {
    display: none;
}

@media (max-width: 767.98px) {
    .project-detail-page {
        padding-bottom: 0;
    }

    .project-detail-page--portfolio .footer {
        padding-bottom: calc(74px + env(safe-area-inset-bottom));
    }

    .project-detail-page--bathhouse .footer {
        margin-top: 16px;
    }

    .lrc-pill {
        position: fixed;
        z-index: 1030;
        left: 50%;
        bottom: calc(14px + env(safe-area-inset-bottom));
        display: inline-flex;
        min-height: 46px;
        align-items: center;
        gap: 6px;
        padding: 0 20px 0 16px;
        color: #fff;
        font-family: Montserrat, sans-serif;
        font-size: 15px;
        font-weight: 700;
        white-space: nowrap;
        border: 0;
        border-radius: 999px;
        background: #242424;
        box-shadow: 0 10px 30px rgba(20, 16, 12, .28);
        opacity: 0;
        pointer-events: none;
        transform: translate(-50%, 16px);
        transition: opacity .2s ease, transform .2s ease;
    }

    .lrc-pill svg {
        width: 18px;
        height: 18px;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.8;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

    .lrc-pill span {
        margin-left: 4px;
    }

    .lrc-pill.is-visible {
        opacity: 1;
        pointer-events: auto;
        transform: translate(-50%, 0);
    }

    body.modal-open .lrc-pill,
    body.lrc-sheet-open .lrc-pill,
    body:has(.main-menu.show) .lrc-pill {
        opacity: 0;
        pointer-events: none;
    }

    .lrc-sheet {
        position: fixed;
        z-index: 1060;
        inset: 0;
        display: flex;
        align-items: flex-end;
        background: rgba(20, 16, 12, .45);
    }

    .lrc-sheet[hidden] {
        display: none;
    }

    .lrc-sheet__panel {
        position: relative;
        width: 100%;
        padding: 18px 16px calc(16px + env(safe-area-inset-bottom));
        font-family: Montserrat, sans-serif;
        border-radius: 22px 22px 0 0;
        background: #fff;
    }

    .lrc-sheet__close {
        position: absolute;
        top: 10px;
        right: 10px;
        width: 36px;
        height: 36px;
        color: #6f6862;
        font-size: 26px;
        line-height: 1;
        border: 0;
        border-radius: 50%;
        background: #f3efeb;
    }

    .lrc-sheet__panel > strong {
        display: block;
        margin: 0 44px 0 4px;
        color: #242424;
        font-size: 19px;
    }

    .lrc-sheet__panel > p {
        margin: 4px 4px 12px;
        color: #6f6862;
        font-size: 14px;
    }

    .lrc-sheet__call {
        display: flex;
        min-height: 60px;
        align-items: center;
        gap: 12px;
        padding: 10px 16px;
        color: #fff;
        text-decoration: none;
        border-radius: 14px;
        background: linear-gradient(135deg, #ff5900 0%, #f06a22 100%);
    }

    .lrc-sheet__call:hover,
    .lrc-sheet__call:active {
        color: #fff;
    }

    .lrc-sheet__call svg {
        flex: 0 0 22px;
        width: 22px;
        height: 22px;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.8;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

    .lrc-sheet__call span {
        display: grid;
        gap: 2px;
    }

    .lrc-sheet__call b {
        font-size: 18px;
        line-height: 1.15;
    }

    .lrc-sheet__call small {
        font-size: 12px;
        font-weight: 600;
        opacity: .85;
    }

    .lrc-sheet__alt {
        display: block;
        margin: 8px 4px 12px;
        color: #6f6862;
        font-size: 13px;
        font-weight: 600;
        text-decoration: none;
    }

    .lrc-sheet__grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    .lrc-sheet__grid a {
        display: flex;
        min-height: 50px;
        align-items: center;
        gap: 10px;
        padding: 0 14px;
        color: #242424;
        font-size: 15px;
        font-weight: 600;
        text-decoration: none;
        border: 1px solid #ece5dd;
        border-radius: 14px;
        background: #faf8f6;
    }

    .lrc-sheet__grid img,
    .lrc-sheet__grid svg {
        flex: 0 0 22px;
        width: 22px;
        height: 22px;
    }

    .lrc-sheet__grid svg {
        fill: #242424;
    }

    .lrc-sheet__hours {
        margin: 12px 4px 0;
        color: #8f8883;
        font-size: 12px;
    }
}