/* ==========================================================================
   Misgiron Hotel — Adaptive / Responsive styles
   ========================================================================== */

/* ---------- <= 1200px ---------- */
@media (max-width: 1200px) {
    .section { padding: 100px 0; }
    .main-nav ul { gap: 26px; }
    .gallery-grid { columns: 3; }
}

/* ---------- <= 1024px ---------- */
@media (max-width: 1024px) {
    .main-nav { display: none; }
    .burger { display: block; }
    .about-grid { grid-template-columns: 1fr; gap: 50px; }
    .contacts-grid { grid-template-columns: 1fr; gap: 40px; }
    .footer-grid { grid-template-columns: 1fr 1fr; gap: 40px; }
    .content-wrap { grid-template-columns: 1fr; }
    .sidebar { position: static; }
    .gallery-grid { columns: 2; }
    h1 { font-size: clamp(2.4rem, 6vw, 3.4rem); }
    .section { padding: 80px 0; }
}

/* ---------- <= 768px ---------- */
@media (max-width: 768px) {
    .container { padding: 0 20px; }
    .section { padding: 70px 0; }
    .section-head { margin-bottom: 50px; }

    .logo img { height: 42px; }
    .logo-text { font-size: 1.1rem; letter-spacing: 2px; }
    .logo-text small { font-size: .58rem; letter-spacing: 4px; }
    .header-cta .btn { display: none; }

    .hero { min-height: 90vh; }
    .hero-eyebrow { letter-spacing: 5px; font-size: .7rem; }
    .hero h1 { font-size: clamp(2.2rem, 9vw, 3.2rem); }
    .hero-subtitle { font-size: .95rem; }
    .hero-actions { flex-direction: column; align-items: center; }
    .hero-actions .btn { width: 240px; justify-content: center; }

    .about-images { grid-template-columns: 1fr; }
    .about-images img:nth-child(1) { grid-row: auto; }
    .about-features { grid-template-columns: 1fr 1fr; gap: 14px; }

    .rooms-grid { grid-template-columns: 1fr; }
    .room-image { height: 240px; }

    .restaurant { min-height: auto; }
    .restaurant-content { padding: 80px 0; }

    .gallery-grid { columns: 2; column-gap: 12px; }
    .gallery-item { margin-bottom: 12px; }

    .form-row { grid-template-columns: 1fr; }
    .booking-form { padding: 28px 22px; }

    .article-row { grid-template-columns: 1fr; }
    .article-row .img { height: 220px; min-height: auto; }
    .article { padding: 26px 22px; }

    .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }

    .search-form-big { flex-direction: column; padding: 26px; }

    .floating-actions { right: 16px; bottom: 16px; }
    .floating-actions a { width: 48px; height: 48px; }
}

/* ---------- <= 560px ---------- */
@media (max-width: 560px) {
    .section { padding: 60px 0; }
    .hero h1 { font-size: clamp(2rem, 10vw, 2.6rem); }
    .about-features { grid-template-columns: 1fr; }
    .gallery-grid { columns: 1; }
    .footer-grid { grid-template-columns: 1fr; gap: 28px; }
    .site-footer { padding: 60px 0 24px; }
    .page-header { padding: 140px 0 60px; }
    .offline-hero h1 { font-size: 4.5rem; }
}

/* ---------- <= 420px ---------- */
@media (max-width: 420px) {
    .btn { padding: 12px 22px; font-size: .8rem; letter-spacing: 1.5px; }
    .hero-scroll { display: none; }
    .preloader-text { letter-spacing: 5px; font-size: 1rem; }
}


/* ==========================================================================
   Restaurant page — responsive
   ========================================================================== */
@media (max-width: 1024px) {
    .r-hero-content { padding: 100px 20px 40px; }
    .menu-panel.active { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
    .menu-item { grid-template-columns: 86px 1fr; gap: 14px; padding: 8px; }
    .menu-item-img { width: 86px; height: 86px; }
    .menu-item-head { flex-wrap: wrap; }
    .menu-item-head h3 { font-size: 1.02rem; }
    .menu-price { font-size: 1rem; }
}