/* ═══════════════════════════════════════════════════════════════
   AGRITUR LAVANDA — Media Queries
   Strategia: cambiamo solo font-size del :root → tutto in rem si
   scala in automatico. Poi aggiustiamo solo i layout che cambiano
   strutturalmente (grids, flex direction, display).
   ═══════════════════════════════════════════════════════════════

   Breakpoints:
     ≥ 1440px   → XL    (16px base — default in style.css)
     1200–1439  → LG    (15px)
     992–1199   → MD    (14px)
     768–991    → SM    (13.5px)
     480–767    → XS    (13px  + mobile nav)
     < 480      → XXS   (12px)
   ═══════════════════════════════════════════════════════════════ */

/* ─── LG: 1200px – 1439px ─────────────────────────────────────── */
@media (max-width: 1439px) {
    :root { font-size: 15px; }
}

/* ─── MD: 992px – 1199px ──────────────────────────────────────── */
@media (max-width: 1199px) {
    :root { font-size: 14px; }

    .highlights-grid      { grid-template-columns: repeat(2, 1fr); }
    .info-cards-grid,
    .info-cards-grid-3    { grid-template-columns: repeat(2, 1fr); }
    .footer-top           { grid-template-columns: 1fr 1fr; gap: 2rem 3rem; }
    .info-strip           { grid-template-columns: repeat(3, 1fr); }
    .stanza-card          { grid-template-columns: 1fr; }
    .stanza-card-img      { min-height: 320px; }
    .contatti-grid        { grid-template-columns: 1fr; gap: 2.5rem; }
    .contatti-info        { padding-top: 0; }

    .rooms-slider         { transform: translate(12px, 0); }
}

/* ─── SM: 768px – 991px ───────────────────────────────────────── */
@media (max-width: 991px) {
    :root { font-size: 13.5px; }

    /* Navbar mobile */
    .navbar-toggle { display: flex; }

    .navbar-links {
        position: fixed;
        top: 0;
        right: -100%;
        width: min(85vw, 320px);
        height: 100dvh;
        background: var(--clr-dark);
        flex-direction: column;
        align-items: flex-start;
        padding: calc(var(--navbar-h) + 1rem) 2rem 2rem;
        gap: 0.25rem;
        z-index: 1001;
        transition: right var(--trans-base);
        box-shadow: var(--shadow-xl);
    }
    .navbar-links.is-open { right: 0; }

    .nav-link {
        width: 100%;
        padding: 0.85rem 1rem;
        font-size: 1rem;
        color: rgba(255,255,255,0.85) !important;
        border-radius: var(--radius-sm);
    }
    .nav-link:hover,
    .nav-link.active {
        background: rgba(200, 168, 233, 0.15) !important;
        color: var(--clr-accent) !important;
    }
    .nav-link-cta {
        margin-left: 0 !important;
        margin-top: 0.75rem;
        background: var(--clr-primary) !important;
        color: var(--clr-white) !important;
    }
    .nav-overlay { display: block; }

    /* Layout adjustments */
    .intro-grid           { grid-template-columns: 1fr; gap: 2.5rem; }
    .intro-image-grid     { grid-template-rows: 220px 140px; }
    .come-arrivare-grid   { grid-template-columns: 1fr; }
    .map-blob-inner       { height: 340px; }
    .esperienza-item,
    .esperienza-item-reverse { grid-template-columns: 1fr; }
    .esperienza-item-reverse .esperienza-img,
    .esperienza-item-reverse .esperienza-content { order: unset; }
    .room-card            { flex: 0 0 280px; }
    .hero-scroll-hint     { display: none; }
    .stanza-card-content  { padding: 2rem; }
    .tariffe-table th,
    .tariffe-table td     { padding: 0.75rem 0.9rem; }
}

/* ─── XS: 480px – 767px ───────────────────────────────────────── */
@media (max-width: 767px) {
    :root { font-size: 13px; }

    /* Section spacing */
    :root { --section-gap: 4rem; --container-px: 1.25rem; }

    .hero-content { flex-direction: column; align-items: flex-start; padding-bottom: 5rem; }
    .hero-guest-card { display: none; }
    .hero-title { font-size: clamp(2.2rem, 9vw, 3.5rem); }
    .hero-actions { flex-direction: column; align-items: flex-start; }
    .hero-actions .btn { width: 100%; justify-content: center; }

    /* Grids → single column */
    .highlights-grid      { grid-template-columns: repeat(2, 1fr); gap: 1.25rem; }
    .info-cards-grid,
    .info-cards-grid-3    { grid-template-columns: 1fr; }
    .footer-top           { grid-template-columns: 1fr; gap: 2rem; }
    .placeholder-grid     { grid-template-columns: 1fr; }
    .info-strip           { grid-template-columns: repeat(2, 1fr); }
    .stanza-details       { grid-template-columns: 1fr; }
    .stanza-actions       { flex-direction: column; }
    .stanza-actions .btn  { width: 100%; justify-content: center; }
    .cta-actions          { flex-direction: column; align-items: center; }
    .colazione-grid       { grid-template-columns: 1fr; gap: 2.5rem; }
    .parcheggio-grid      { grid-template-columns: 1fr; gap: 2.5rem; }
    .parcheggio-features  { grid-template-columns: repeat(auto-fit, minmax(25px, 1fr)); }
    .parcheggio-img       { height: 240px; }
    .colazione-icons      { grid-template-columns: repeat(3, 1fr); }
    .cta-actions .btn     { width: 100%; justify-content: center; max-width: 320px; }

    /* Form */
    .form-row             { grid-template-columns: 1fr; }

    /* Slider */
    .room-card            { flex: 0 0 260px; }
    .rooms-slider         { padding-inline: var(--container-px); }

    /* Footer */
    .footer-bottom-inner  { flex-direction: column; gap: 0.5rem; text-align: center; }

    /* Page hero */
    .page-hero            { height: 35vh; min-height: 240px; }
    .page-hero-content h1 { font-size: 2.2rem; }

    /* Stanze page */
    .stanze-filters       { gap: 0.5rem; }
    .filter-btn           { padding: 0.4rem 0.9rem; font-size: 0.82rem; }
    .stanza-card-header   { flex-direction: column; gap: 0.75rem; }
    .stanza-price-box     { align-self: flex-start; }
}

/* ─── XXS: < 480px ────────────────────────────────────────────── */
@media (max-width: 479px) {
    :root { font-size: 12px; }

    .highlights-grid   { grid-template-columns: repeat(2, 1fr); }
    .info-strip        { grid-template-columns: 1fr 1fr; }
    .hero-badge        { font-size: 0.7rem; }
    .slider-btn        { display: none; }
    .rooms-slider      { padding-inline: 1rem; }
    .room-card         { flex: 0 0 calc(100vw - 2rem); }

    .tariffe-table thead { display: none; }
    .tariffe-table td   {
        display: block;
        padding: 0.4rem 1rem;
        border-bottom: none;
    }
    .tariffe-table tr {
        display: block;
        border-bottom: 1px solid var(--clr-border);
        padding-block: 0.75rem;
    }
    .tariffe-table td:first-child { font-weight: 700; }
}

/* ─── Sub-400px: griglia parcheggio adattiva ──────────────────── */

/* ─── Landscape mobile fix ────────────────────────────────────── */
@media (max-height: 500px) and (orientation: landscape) {
    .hero { min-height: 100svh; }
    :root { --navbar-h: 3.5rem; }
}

/* ─── High-density (retina) hint ──────────────────────────────── */
/* Nessun CSS necessario: la risoluzione WebP è gestita da PHP via cookie */

/* ─── Reduced motion ──────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
    .hero-bg, .hero-video { transform: none !important; }
}
