/*
 * assets/css/responsive.css
 * Spectacle Lake Lodge — Responsive Breakpoints
 * Breakpoints: 1200px | 992px | 768px | 480px
 */

/* ==========================================================================
   LARGE DESKTOP → STANDARD DESKTOP  (≤ 1200px)
   ========================================================================== */

@media (max-width: 1200px) {
    .sll-highlights__grid { grid-template-columns: repeat(2, 1fr); }
    .sll-rooms-grid--4col { grid-template-columns: repeat(2, 1fr); }
    .sll-gallery-grid { grid-template-columns: repeat(3, 1fr); }
    .sll-room-detail__layout { grid-template-columns: 1fr 320px; }
    .sll-contact-layout { grid-template-columns: 300px 1fr; gap: var(--space-10); }
}

/* ==========================================================================
   TABLET  (≤ 992px)
   ========================================================================== */

@media (max-width: 992px) {
    /* Typography scale down */
    h1 { font-size: var(--text-4xl); }
    h2 { font-size: var(--text-3xl); }

    /* Container */
    .sll-container { padding-inline: var(--space-5); }

    /* Nav — move to mobile hamburger */
    .sll-nav { display: none; }
    .sll-hamburger { display: flex; }
    .sll-header__cta { display: none; }

    /* Hero */
    .sll-hero { min-height: 72vh; }
    .sll-hero__title { font-size: clamp(1.75rem, 5vw, 3rem); }

    /* Section spacing */
    .sll-section { padding-block: var(--space-14); }

    /* Grids → 2 col */
    .sll-highlights__grid   { grid-template-columns: repeat(2, 1fr); }
    .sll-rooms-grid--3col  { grid-template-columns: repeat(2, 1fr); }
    .sll-events-grid       { grid-template-columns: repeat(2, 1fr); }
    .sll-testimonials-grid { grid-template-columns: repeat(2, 1fr); }

    /* Split layout → stack */
    .sll-split { grid-template-columns: 1fr; gap: var(--space-10); }
    .sll-split--reverse .sll-split__media { order: 0; }
    .sll-split--reverse .sll-split__content { order: 0; }

    /* Room detail */
    .sll-room-detail__layout { grid-template-columns: 1fr; }
    .sll-room-detail__sidebar { position: static; }
    .sll-amenities-list { grid-template-columns: repeat(3, 1fr); }

    /* Contact */
    .sll-contact-layout { grid-template-columns: 1fr; }
    .sll-contact-sidebar { position: static; }

    /* Footer */
    .sll-footer__grid { grid-template-columns: 1fr 1fr; }
    .sll-footer__about { grid-column: 1 / -1; }

    /* Newsletter bar */
    .sll-newsletter-bar__inner { grid-template-columns: 1fr; text-align: center; }

    /* Rating banner */
    .sll-rating-banner__inner { flex-direction: column; gap: var(--space-4); text-align: center; }

    /* Gallery */
    .sll-gallery-grid { grid-template-columns: repeat(3, 1fr); }
}

/* ==========================================================================
   MOBILE LARGE  (≤ 768px)
   ========================================================================== */

@media (max-width: 768px) {
    /* Typography */
    h1 { font-size: var(--text-3xl); }
    h2 { font-size: var(--text-2xl); }

    .sll-container { padding-inline: var(--space-4); }
    .sll-section { padding-block: var(--space-12); }

    /* Hero */
    .sll-hero { min-height: 65vh; padding-top: 70px; }
    .sll-hero__cta-group { flex-direction: column; align-items: flex-start; }
    .sll-hero__cta-group .sll-btn { width: 100%; justify-content: center; }

    /* Grids → 1 col */
    .sll-highlights__grid   { grid-template-columns: 1fr; }
    .sll-rooms-grid--3col  { grid-template-columns: 1fr; }
    .sll-rooms-grid--2col  { grid-template-columns: 1fr; }
    .sll-events-grid       { grid-template-columns: 1fr; }
    .sll-events-grid--2col { grid-template-columns: 1fr; }
    .sll-testimonials-grid { grid-template-columns: 1fr; }
    .sll-testimonials-grid--2col { grid-template-columns: 1fr; }

    /* Activities */
    .sll-activities-list { grid-template-columns: 1fr; }
    .sll-season-tabs__nav { gap: var(--space-1); }
    .sll-season-tab__btn { padding: var(--space-2) var(--space-4); font-size: var(--text-sm); }

    /* Gallery */
    .sll-gallery-grid { grid-template-columns: repeat(2, 1fr); }

    /* Room detail gallery */
    .sll-room-detail__gallery { grid-template-columns: repeat(2, 1fr); }
    .sll-amenities-list { grid-template-columns: repeat(2, 1fr); }

    /* Footer */
    .sll-footer__grid { grid-template-columns: 1fr; }
    .sll-footer__bottom-inner { flex-direction: column; text-align: center; gap: var(--space-2); }

    /* CTA band actions */
    .sll-cta-band__actions { flex-direction: column; align-items: stretch; }
    .sll-cta-band__actions .sll-btn { width: 100%; justify-content: center; }

    /* Sticky CTA */
    .sll-sticky-cta { bottom: var(--space-4); right: var(--space-4); }

    /* Booking bar */
    .sll-booking-bar { padding: var(--space-6); }

    /* Header */
    .sll-header { padding-block: var(--space-3); }

    /* Lightbox arrows */
    .sll-lightbox__prev { left: var(--space-2); }
    .sll-lightbox__next { right: var(--space-2); }
}

/* ==========================================================================
   MOBILE SMALL  (≤ 480px)
   ========================================================================== */

@media (max-width: 480px) {
    h1 { font-size: var(--text-2xl); }
    h2 { font-size: var(--text-xl); }

    .sll-container { padding-inline: var(--space-4); }

    .sll-hero { min-height: 55vh; }
    .sll-hero--short { min-height: 40vh; }

    /* Gallery single column on very small screens */
    .sll-gallery-grid { grid-template-columns: repeat(2, 1fr); gap: var(--space-2); }

    /* Room card actions stack */
    .sll-room-card__actions { flex-direction: column; }
    .sll-room-card__actions .sll-btn { width: 100%; justify-content: center; }

    /* Pagination */
    .sll-pagination .page-numbers { width: 36px; height: 36px; font-size: 0.75rem; }

    /* Section header */
    .sll-section-header { margin-bottom: var(--space-8); }

    /* Split image grid */
    .sll-split__image-grid { grid-template-columns: 1fr; }
    .sll-split__image-grid img:first-child { grid-column: auto; height: 200px; }

    /* Contact form block */
    .sll-contact-form-block { padding: var(--space-6); }
}

/* ==========================================================================
   PRINT
   ========================================================================== */

@media print {
    .sll-header,
    .sll-footer,
    .sll-sticky-cta,
    .sll-hamburger,
    .sll-gallery-filters,
    .sll-season-tabs__nav,
    .sll-cta-band { display: none !important; }

    body { font-size: 12pt; color: #000; }
    a { color: #000; text-decoration: underline; }
    .sll-container { max-width: 100%; padding: 0; }
    .sll-rooms-grid--3col { grid-template-columns: repeat(2, 1fr); }
    .sll-section { padding-block: 1rem; }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        transition-duration: .01ms !important;
    }
    html { scroll-behavior: auto; }
}