/* Hotel Silver Inn - shared custom CSS (extracted from Google Stitch page exports) */

.material-symbols-outlined {
    font-variation-settings: 'FILL' 0, 'wght' 300, 'GRAD' 0, 'opsz' 24;
    vertical-align: middle;
}

/* Frosted-glass nav / panel blur, used under several class names across pages */
.luxury-blur,
.backdrop-blur-nav,
.nav-blur,
.backdrop-blur-luxury,
.backdrop-blur-30 {
    backdrop-filter: blur(30px);
    -webkit-backdrop-filter: blur(30px);
}

.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.letter-spacing-extra {
    letter-spacing: 0.3em;
}

.text-shadow-subtle,
.text-shadow-sm {
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.text-shadow-hero {
    text-shadow: 0 4px 12px rgba(0, 0, 0, 0.35);
}

/* Rooms page: image reveal-on-hover mask */
.editorial-image-mask {
    clip-path: inset(0 0 0 0);
    transition: clip-path 1.5s cubic-bezier(0.19, 1, 0.22, 1);
}

.room-reveal:hover .editorial-image-mask {
    clip-path: inset(10px 10px 10px 10px);
}

/* Banquets page */
.clip-diagonal {
    clip-path: polygon(0 0, 100% 0, 100% 90%, 0% 100%);
}

.transition-soft {
    transition: all 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.hero-title-mask {
    mix-blend-mode: exclusion;
}

/* Contact / Banquets forms */
.input-luxury {
    border-top: 0;
    border-left: 0;
    border-right: 0;
    border-bottom: 1px solid #d1c5b4;
    background: transparent;
    padding: 12px 0;
    transition: border-color 0.3s ease;
}

.input-luxury:focus {
    outline: none;
    border-bottom-color: #775a19;
    ring: 0;
}

input:focus,
textarea:focus {
    outline: none;
    border-bottom-color: #775a19 !important;
}

.underline-expand {
    position: relative;
}

.underline-expand::after {
    content: '';
    position: absolute;
    width: 0;
    height: 1px;
    bottom: -4px;
    left: 50%;
    background-color: currentColor;
    transition: all 0.3s ease;
    transform: translateX(-50%);
}

.underline-expand:hover::after {
    width: 100%;
}

/* Legal page tabs */
.active-tab {
    color: #775a19;
    border-bottom: 1px solid #775a19;
    padding-bottom: 4px;
}

.legal-content-section {
    display: none;
}

.legal-content-section.active {
    display: block;
}

/* Gallery page masonry grid */
.masonry-item {
    break-inside: avoid;
    margin-bottom: 24px;
}

.gallery-container {
    columns: 1;
}

@media (min-width: 768px) {
    .gallery-container {
        columns: 2;
    }
}

@media (min-width: 1024px) {
    .gallery-container {
        columns: 3;
    }
}

.image-overlay {
    background: linear-gradient(to top, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0) 50%);
    opacity: 0;
    transition: opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.masonry-item:hover .image-overlay {
    opacity: 1;
}

.fade-in {
    animation: fadeIn 0.8s ease-out forwards;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes zoom-slow {
    from {
        transform: scale(1.05);
    }

    to {
        transform: scale(1.15);
    }
}

/* Site-wide header/mobile-menu/dropdown states, shared by all pages via partials/header.html */
.nav-link.is-active {
    color: #ffffff;
    border-bottom: 1px solid #ffffff;
    padding-bottom: 4px;
}

#mobile-menu-panel.hidden,
#rooms-dropdown-panel.hidden {
    display: none;
}