#scroll-menu-anchor {
    isolation: isolate;
}

#scroll-menu-panel {
    opacity: 0;
    transform: translateY(36px);
}

.scroll-menu-list {
    border-top: 1px solid rgba(179, 139, 83, 0.2);
}

.scroll-menu-item {
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.6rem 1rem;
    border-bottom: 1px solid rgba(179, 139, 83, 0.2);
    padding: 1.05rem 0.2rem;
    text-decoration: none;
}

.scroll-menu-item::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.3s ease;
    background: linear-gradient(90deg, rgba(179, 139, 83, 0.16), rgba(179, 139, 83, 0.04));
}

.scroll-menu-item:hover::before {
    transform: scaleX(1);
}

.scroll-menu-item-title {
    font-family: "Playfair Display", serif;
    font-size: clamp(1.45rem, 4vw, 4rem);
    line-height: 0.95;
    letter-spacing: -0.01em;
    color: rgba(35, 29, 23, 0.3);
    transition: color 0.3s ease, transform 0.3s ease;
}

.scroll-menu-item-subtitle {
    font-family: "Cormorant Garamond", serif;
    font-size: clamp(0.74rem, 1vw, 1rem);
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: rgba(35, 29, 23, 0.6);
    transition: color 0.3s ease;
}

.scroll-menu-item:hover .scroll-menu-item-title {
    color: #231d17;
    transform: translateX(0.35rem);
}

.scroll-menu-item:hover .scroll-menu-item-subtitle {
    color: #b38b53;
}

.scroll-menu-item[data-placeholder="true"] {
    cursor: default;
}

.scroll-menu-item[data-placeholder="true"]::before,
.scroll-menu-item[data-placeholder="true"]:hover::before {
    transform: scaleX(0);
}

@media (max-width: 768px) {
    .scroll-menu-item {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.35rem;
        padding: 0.8rem 0.1rem;
    }

    .scroll-menu-item-title {
        font-size: clamp(1.28rem, 8.2vw, 2.4rem);
    }

    .scroll-menu-item-subtitle {
        letter-spacing: 0.12em;
    }
}
