/* =============================================================================
   ALBUM DETAIL - MASTER TEMPLATE (gallery-album.html) - Phase 13
   ============================================================================= 
   PAGE-SPECIFIC layout only, prefixed "gala-" per rules.txt Section 2 -
   distinct from "gal-" (the Hub) since this is a different page/
   duplication lifecycle, same pattern as indl- vs. ind- (Phase 10) and
   prjl- vs. ipr- (Phase 11). All visual components come from
   event-components.css / event-discovery-components.css unchanged.
   ============================================================================= */

#gala-page {
    background: var(--white);
}

.page-hero.gala-hero {
    min-height: 280px;
    height: auto;
    padding: clamp(40px, 5vw, 64px) 0;
}

.page-hero.gala-hero .page-hero-content h1 {
    font-size: clamp(1.75rem, 3.4vw, 2.5rem);
    line-height: 1.25;
    max-width: 900px;
    margin-bottom: 12px;
}

.page-hero.gala-hero .page-hero-content p {
    font-size: clamp(0.92rem, 1.15vw, 1.02rem);
    line-height: 1.6;
    max-width: 800px;
}

.gala-photo-item:hover .gala-photo-overlay {
    opacity: 1 !important;
}

.gala-photo-item:hover img {
    transform: scale(1.04);
}

#gala-lb-close:hover,
#gala-lb-prev:hover,
#gala-lb-next:hover {
    background: rgba(255, 255, 255, 0.25) !important;
}

.gala-info-sec {
    padding: 32px 0 20px;
}

.gala-grid-sec {
    padding: 24px 0 48px;
}

.gala-featured-sec,
.gala-related-sec,
.gala-blog-sec {
    padding: 40px 0 48px;
}

.gala-featured-sec,
.gala-blog-sec {
    background: var(--bg-light);
}

.gala-cta-sec,
.gala-contact-sec {
    padding: 0 0 48px;
}

@media screen and (max-width: 768px) {

    .page-hero.gala-hero {
        min-height: 240px;
        padding: 32px 0;
    }

    .gala-info-sec {
        padding: 24px 0 16px;
    }

    .gala-grid-sec {
        padding: 20px 0 36px;
    }

    .gala-featured-sec,
    .gala-related-sec,
    .gala-blog-sec {
        padding: 28px 0 36px;
    }

    .gala-cta-sec,
    .gala-contact-sec {
        padding: 0 0 36px;
    }
}