/* Silver Rock Website V1.19 — image-led dining, full-view photography, refined resort summary, and stronger footer branding */

/* --- Resort summary: replace the heavy dark treatment with a bright editorial property-photo composition --- */
.resort-summary {
    background: #f0e7da !important;
    padding-top: clamp(6.5rem, 8vw, 8.5rem) !important;
}
.resort-summary::before {
    inset: 0 0 auto 34% !important;
    width: 66% !important;
    height: clamp(460px, 48vw, 610px) !important;
    background-image: url('../images/Silver_Rock-13-new.jpg') !important;
    background-position: center 48% !important;
    background-size: cover !important;
    filter: saturate(.92) contrast(.98) brightness(1.08);
}
.resort-summary::after {
    inset: 0 0 auto 0 !important;
    width: 100% !important;
    height: clamp(460px, 48vw, 610px) !important;
    background:
        linear-gradient(90deg, #f0e7da 0%, #f0e7da 30%, rgba(240,231,218,.92) 42%, rgba(240,231,218,.36) 66%, rgba(240,231,218,.06) 100%),
        linear-gradient(0deg, #f0e7da 0%, rgba(240,231,218,.12) 46%, rgba(240,231,218,0) 72%) !important;
}
.resort-summary .summary-header {
    min-height: clamp(300px, 32vw, 405px);
    align-items: center;
    margin-bottom: clamp(1.8rem, 3.5vw, 3rem) !important;
}
.resort-summary .summary-header > div {
    max-width: 650px;
}
.resort-summary .summary-eyebrow {
    color: #8b653b !important;
    text-shadow: none !important;
}
.resort-summary .summary-header h2 {
    color: #2d2018 !important;
    max-width: 720px;
    text-shadow: 0 1px 0 rgba(255,255,255,.45);
}
.resort-summary .summary-header > p {
    max-width: 390px;
    padding: 1.15rem 1.25rem;
    border: 1px solid rgba(255,255,255,.5) !important;
    border-left: 3px solid #9a713b !important;
    border-radius: .7rem;
    background: rgba(255,255,255,.78);
    color: #55483f !important;
    box-shadow: 0 18px 38px rgba(56,42,29,.10);
    backdrop-filter: blur(12px);
}
.resort-summary .summary-grid {
    position: relative;
    z-index: 3;
}
.resort-summary .summary-card {
    border-top: 3px solid rgba(143,101,50,.28) !important;
}
.resort-summary .summary-card:hover {
    border-top-color: #8f6532 !important;
}

/* --- Dining: use the available width and preserve the complete 4:5 photography --- */
.dining-tabs,
.dining-content {
    width: min(1440px, calc(100% - 5vw));
    max-width: 1440px !important;
}
.dining-content {
    grid-template-columns: minmax(300px, .72fr) minmax(640px, 1.55fr) !important;
    gap: clamp(2.4rem, 4vw, 4.8rem) !important;
    align-items: start !important;
    padding: clamp(2.25rem, 3.7vw, 4rem) !important;
}
.dining-info {
    align-self: center;
}
.dining-media {
    display: grid !important;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr) !important;
    gap: clamp(1rem, 1.6vw, 1.5rem) !important;
    height: auto !important;
    min-height: 0 !important;
    align-items: stretch;
}
.dining-media img {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 4 / 5;
    object-fit: cover !important;
    object-position: center;
    border-radius: 1rem !important;
    box-shadow: 0 20px 45px rgba(29,43,38,.15);
    cursor: zoom-in;
    transition: transform .35s ease, box-shadow .35s ease, filter .35s ease;
}
.dining-media img:hover {
    transform: translateY(-4px);
    box-shadow: 0 28px 58px rgba(29,43,38,.22);
    filter: saturate(1.03);
}

/* --- Full-view affordance for photography throughout the site --- */
.image-viewable {
    cursor: zoom-in !important;
}
.image-viewable:focus-visible {
    outline: 3px solid rgba(36,60,54,.75);
    outline-offset: 4px;
}
.lightbox-content {
    max-width: min(94vw, 1600px) !important;
    max-height: 91vh !important;
    border-radius: .35rem;
    box-shadow: 0 30px 90px rgba(0,0,0,.55);
}
.lightbox-prev,
.lightbox-next {
    border: 1px solid rgba(255,255,255,.28);
    border-radius: 50% !important;
    background: rgba(18,18,18,.54) !important;
    width: 54px;
    height: 54px;
    padding: 0 !important;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* --- Footer: larger brand marks and reliably visible social icons --- */
.footer-columns {
    grid-template-columns: 1.55fr .9fr 1.25fr .85fr !important;
    gap: clamp(2rem, 4vw, 4.5rem) !important;
}
.footer-brand-lockup {
    gap: 1rem !important;
}
.footer-silver-logo {
    width: min(225px, 100%) !important;
    max-height: 180px;
}
.footer-managed-label {
    margin-top: .2rem !important;
    font-size: .68rem !important;
}
.footer-mokawa-link {
    width: min(275px, 100%) !important;
    padding: .2rem 0 .5rem !important;
}
.footer-mokawa-logo {
    width: 100% !important;
    max-height: 105px;
}
.footer-social {
    display: grid !important;
    grid-template-columns: repeat(2, 48px);
    gap: .8rem !important;
}
.footer-social a {
    width: 48px !important;
    height: 48px !important;
    border: 1px solid rgba(255,255,255,.22) !important;
    background: rgba(255,255,255,.08) !important;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.03);
}
.footer-social a:hover {
    transform: translateY(-3px);
    border-color: rgba(255,255,255,.55) !important;
    background: rgba(255,255,255,.16) !important;
}
.footer-social img {
    display: block;
    width: 21px;
    height: 21px;
    object-fit: contain;
    filter: brightness(0) invert(1);
    opacity: .96;
}

@media (max-width: 1180px) {
    .dining-content {
        grid-template-columns: minmax(280px, .8fr) minmax(500px, 1.35fr) !important;
    }
}

@media (max-width: 980px) {
    .resort-summary::before {
        left: 23% !important;
        width: 77% !important;
    }
    .resort-summary::after {
        background:
            linear-gradient(90deg, #f0e7da 0%, rgba(240,231,218,.94) 42%, rgba(240,231,218,.25) 82%),
            linear-gradient(0deg, #f0e7da 0%, rgba(240,231,218,.1) 50%, transparent 75%) !important;
    }
    .dining-content {
        grid-template-columns: 1fr !important;
    }
    .dining-info {
        max-width: 760px;
    }
    .dining-media {
        order: -1;
        grid-template-columns: 1fr 1fr !important;
    }
    .footer-columns {
        grid-template-columns: 1.2fr 1fr !important;
    }
}

@media (max-width: 720px) {
    .resort-summary::before {
        left: 0 !important;
        width: 100% !important;
        height: 530px !important;
    }
    .resort-summary::after {
        height: 530px !important;
        background:
            linear-gradient(0deg, #f0e7da 0%, rgba(240,231,218,.92) 42%, rgba(240,231,218,.55) 100%) !important;
    }
    .resort-summary .summary-header {
        min-height: 350px;
        align-items: flex-end;
    }
    .resort-summary .summary-header > p {
        background: rgba(255,255,255,.9);
    }
    .dining-tabs,
    .dining-content {
        width: calc(100% - 2rem);
    }
    .dining-media {
        grid-template-columns: 1fr !important;
    }
    .dining-media img {
        aspect-ratio: 4 / 5;
    }
    .footer-columns {
        grid-template-columns: 1fr !important;
    }
    .footer-social {
        grid-template-columns: repeat(4, 48px);
    }
}