/* Page-owned styles for Gallery page */

.gallery-page {
    background-color: var(--color-cream);
}

/* Gallery Introduction */
.gallery-intro {
    padding-block: var(--space-3xl) var(--space-2xl);
    padding-inline: var(--container-padding-mobile);
}

.gallery-intro__content {
    max-width: 58.33%;
    margin-inline: 0;
}

.gallery-intro__content h1 {
    margin-block-end: var(--space-lg);
}

.gallery-intro__content .lead {
    max-width: 46rem; /* 70-75 characters at lead size */
    margin-block-end: var(--space-md);
}

.gallery-intro__content .small {
    max-width: 40rem; /* 62-72 characters at small size */
}

/* Shared section styles */
.gallery-section {
    padding-block: var(--space-3xl);
    padding-inline: var(--container-padding-mobile);
}

.gallery-section__header {
    max-width: 58.33%;
    margin-block-end: var(--space-xl);
}

.gallery-section__header h2 {
    margin-block-end: var(--space-md);
}

.gallery-section__header p:not(.eyebrow) {
    max-width: 44rem; /* 62-72 characters at body size */
}

/* Gallery grids */
.gallery-grid {
    display: grid;
    gap: var(--space-lg);
    width: 100%;
}

.gallery-grid--lodge {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.gallery-grid--cuisine {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.gallery-grid--highlights {
    grid-template-columns: repeat(12, minmax(0, 1fr));
}

/* Figures and images */
.gallery-figure {
    margin: 0;
    min-width: 0;
}

.gallery-figure img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: var(--radius-editorial);
    object-fit: cover;
}

.gallery-figure figcaption {
    margin-block-start: var(--space-xs);
    max-width: 34rem; /* 45-55 characters at caption size */
}

/* Lodge grid: each figure spans one of two equal columns */
.gallery-grid--lodge .gallery-figure {
    grid-column: span 1;
}

.gallery-grid--lodge .gallery-figure--landscape img {
    aspect-ratio: 3 / 2;
}

/* Cuisine grid: first figure 6 columns (half), second and third each 3 columns (quarter) */
.gallery-grid--cuisine .gallery-figure--wide {
    grid-column: span 2;
}

.gallery-grid--cuisine .gallery-figure--portrait {
    grid-column: span 1;
}

.gallery-grid--cuisine .gallery-figure--landscape img {
    aspect-ratio: 3 / 2;
}

.gallery-grid--cuisine .gallery-figure--portrait img {
    aspect-ratio: 4 / 5;
}

/* Highlights grid: first figure 5 columns, second 7 columns */
.gallery-grid--highlights .gallery-figure--narrow {
    grid-column: span 5;
}

.gallery-grid--highlights .gallery-figure--wide {
    grid-column: span 7;
}

.gallery-grid--highlights .gallery-figure--portrait img {
    aspect-ratio: 4 / 5;
}

.gallery-grid--highlights .gallery-figure--landscape img {
    aspect-ratio: 3 / 2;
}

/* Card room single image */
.gallery-cardroom .gallery-figure--cardroom {
    width: 100%;
}

.gallery-cardroom .gallery-figure--cardroom img {
    aspect-ratio: 16 / 9;
}

/* Reservation prompt */
.gallery-reservation {
    background-color: var(--color-cream-warm);
    padding-block: var(--space-3xl);
    padding-inline: var(--container-padding-mobile);
    text-align: center;
}

.gallery-reservation__content {
    max-width: 37.5rem; /* 600px */
    margin-inline: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-lg);
}

.gallery-reservation__content h2 {
    margin: 0;
}

.gallery-reservation__content p {
    max-width: 44rem;
    margin: 0;
}

.gallery-reservation__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--space-md);
    margin-block-start: var(--space-sm);
}

/* Tablet breakpoint */
@media (min-width: 48rem) {
    .gallery-intro,
    .gallery-section,
    .gallery-reservation {
        padding-inline: var(--container-padding-tablet);
    }

    .gallery-intro__content,
    .gallery-section__header {
        max-width: 58.33%;
    }
}

/* Desktop breakpoint */
@media (min-width: 75rem) {
    .gallery-intro,
    .gallery-section,
    .gallery-reservation {
        padding-inline: var(--container-padding-desktop);
    }

    .gallery-section {
        padding-block: var(--space-5xl);
    }

    .gallery-intro {
        padding-block: var(--space-4xl) var(--space-3xl);
    }

    .gallery-reservation {
        padding-block: var(--space-5xl);
    }
}

/* Mobile: stack all grids into single column */
@media (max-width: 47.999rem) {
    .gallery-intro__content,
    .gallery-section__header {
        max-width: 100%;
    }

    .gallery-intro__content .lead,
    .gallery-intro__content .small,
    .gallery-section__header p:not(.eyebrow) {
        max-width: 100%;
    }

    .gallery-grid--lodge,
    .gallery-grid--cuisine,
    .gallery-grid--highlights {
        grid-template-columns: 1fr;
        gap: var(--space-md);
    }

    .gallery-grid--lodge .gallery-figure,
    .gallery-grid--cuisine .gallery-figure,
    .gallery-grid--highlights .gallery-figure {
        grid-column: auto;
    }

    .gallery-figure figcaption {
        max-width: 100%;
    }

    .gallery-reservation__actions {
        flex-direction: column;
        align-items: stretch;
        width: 100%;
    }

    .gallery-reservation__actions .btn {
        width: 100%;
    }
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
    .gallery-page *,
    .gallery-page *::before,
    .gallery-page *::after {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }
}