/* ============================================================
   responsive.css — Media Queries & Mobil Uyumluluk
   Breakpoints: 1200px | 992px | 768px | 576px
   Kartel Hotel | v1.0
   ============================================================ */

/* ─── 1200px altı ────────────────────────────────────────────── */
@media (max-width: 1200px) {
    .footer__izgara {
        grid-template-columns: 1fr 1fr;
        gap: var(--bosluk-2xl);
    }

    .rezervasyon-widget {
        grid-template-columns: 1fr 1fr;
    }

    .izgara--4 { grid-template-columns: repeat(2, 1fr); }
}

/* ─── 992px altı ─────────────────────────────────────────────── */
@media (max-width: 992px) {
    :root {
        --header-yukseklik: 68px;
        --header-yukseklik-kucuk: 60px;
    }

    /* Header & Navigasyon */
    .ustmenu__nav {
        position: fixed;
        top: 0;
        right: -100%;
        bottom: 0;
        width: min(320px, 85vw);
        background-color: var(--renk-beyaz);
        box-shadow: -4px 0 24px rgba(0,0,0,0.15);
        padding: calc(var(--header-yukseklik) + var(--bosluk-2xl)) var(--bosluk-xl) var(--bosluk-xl);
        transition: right var(--gecis-normal);
        overflow-y: auto;
        z-index: 999;
    }

    .ustmenu__nav.acik {
        right: 0;
    }

    .ustmenu__liste {
        flex-direction: column;
        align-items: stretch;
        gap: var(--bosluk-xs);
    }

    .ustmenu__link {
        color: var(--renk-yazi2);
        padding: 0.75rem 1rem;
        border-radius: var(--radius-md);
        font-size: 0.95rem;
    }

    .ustmenu__link::after { display: none; }

    .ustmenu__link:hover,
    .ustmenu__link.aktif {
        color: var(--renk-vurgu);
        background-color: var(--renk-arka2);
    }

    /* Dropdown — mobilde statik, akordiyon gibi */
    .ustmenu__ogesi--dropdown {
        position: static;
    }

    .ustmenu__dropdown-liste {
        position: static;
        transform: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        box-shadow: none;
        border: none;
        border-left: 2px solid var(--renk-vurgu);
        border-radius: 0;
        padding: var(--bosluk-xs) 0 var(--bosluk-xs) var(--bosluk-sm);
        margin-top: 0.25rem;
        background: transparent;
        display: none;
    }

    .ustmenu__ogesi--dropdown.acik .ustmenu__dropdown-liste {
        display: block;
    }

    .ustmenu__dropdown-item {
        color: var(--renk-yazi2);
        font-size: 0.88rem;
        padding: 0.45rem 0.5rem;
    }

    .ustmenu__hamburger {
        display: flex;
    }

    .ustmenu__hamburger.aktif span:nth-child(1) {
        transform: translateY(7px) rotate(45deg);
    }
    .ustmenu__hamburger.aktif span:nth-child(2) {
        opacity: 0;
    }
    .ustmenu__hamburger.aktif span:nth-child(3) {
        transform: translateY(-7px) rotate(-45deg);
    }

    /* Menü overlay */
    .menu-overlay {
        position: fixed;
        inset: 0;
        background-color: rgba(0,0,0,0.5);
        z-index: 998;
        opacity: 0;
        visibility: hidden;
        transition: all var(--gecis-normal);
    }
    .menu-overlay.aktif {
        opacity: 1;
        visibility: visible;
    }

    /* Rezervasyon butonu header'da gizle */
    .ustmenu__rezervasyon {
        display: none;
    }

    /* Layout */
    .iletisim-izgara { grid-template-columns: 1fr; }
    .rezervasyon-izgara { grid-template-columns: 1fr; }
    .konum-bolum { display: grid; grid-template-columns: 1fr; gap: var(--bosluk-2xl); }

    .izgara--3 { grid-template-columns: repeat(2, 1fr); }

    .galeri-izgara {
        columns: 2;
    }
}

/* ─── 768px altı ─────────────────────────────────────────────── */
@media (max-width: 768px) {
    :root {
        --bosluk-4xl: 4rem;
        --bosluk-3xl: 3rem;
    }

    /* Banner */
    .banner {
        height: 100svh;
        min-height: 500px;
        max-height: none;
    }

    .banner__baslik {
        font-size: clamp(2rem, 8vw, 3rem);
    }

    .banner__ok { display: none; }

    .banner__noktalar { right: 50%; transform: translateX(50%); }

    /* Bölüm */
    .bolum { padding-block: var(--bosluk-3xl); }
    .bolum-baslik { margin-bottom: var(--bosluk-2xl); }

    /* Odalar */
    .izgara--2, .izgara--3, .izgara--4 {
        grid-template-columns: 1fr;
    }

    .izgara--oto {
        grid-template-columns: 1fr;
    }

    /* Rezervasyon Widget */
    .rezervasyon-widget {
        grid-template-columns: 1fr;
        padding: var(--bosluk-xl);
    }

    /* İletişim */
    .iletisim-izgara {
        grid-template-columns: 1fr;
    }

    /* Form */
    .form-izgara {
        grid-template-columns: 1fr;
    }
    .form-izgara .tam-genislik { grid-column: 1; }

    /* Form kutusu */
    .form-kutu {
        padding: var(--bosluk-xl);
    }

    /* Footer */
    .footer__izgara {
        grid-template-columns: 1fr;
        gap: var(--bosluk-2xl);
    }

    .footer__alt-ic {
        flex-direction: column;
        text-align: center;
    }

    /* Galeri */
    .galeri-izgara { columns: 1; }

    /* Banner butonlar */
    .banner__butonlar {
        flex-direction: column;
        align-items: flex-start;
    }

    /* CTA */
    .cta-bolum .butonlar {
        flex-direction: column;
        align-items: center;
    }

    /* Rezervasyon özeti */
    .rezervasyon-ozet {
        position: static;
    }
}

/* ─── 576px altı ─────────────────────────────────────────────── */
@media (max-width: 576px) {
    :root {
        --konteyner-ic: 1rem;
    }

    h1 { font-size: 2rem; }
    h2 { font-size: 1.7rem; }

    .buton { padding: 0.65rem 1.5rem; font-size: 0.85rem; }
    .buton--buyuk { padding: 0.75rem 2rem; font-size: 0.9rem; }

    .oda-kart__meta { flex-wrap: wrap; gap: var(--bosluk-sm); }
    .oda-kart__alt { flex-direction: column; align-items: flex-start; gap: var(--bosluk-md); }
    .oda-kart__alt .buton { width: 100%; justify-content: center; }

    .filtre-grubu { gap: var(--bosluk-xs); }
    .filtre-btn { padding: 0.4rem 1rem; font-size: 0.8rem; }

    .banner__ust-yazi { display: none; }

    .dil-secici__bayrak { width: 18px; height: 13px; }
}

/* ─── Yatay (Landscape) Mobil ────────────────────────────────── */
@media (max-width: 768px) and (orientation: landscape) {
    .banner {
        min-height: 100svh;
    }
}

/* ─── Büyük Ekran ─────────────────────────────────────────────── */
@media (min-width: 1440px) {
    :root {
        --konteyner-max: 1360px;
    }

    .izgara--4 {
        grid-template-columns: repeat(4, 1fr);
    }

    .galeri-izgara { columns: 4; }
}

/* ─── Erişilebilirlik: Harekete Duyarlı ──────────────────────── */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }

    .fade-up {
        opacity: 1;
        transform: none;
    }

    .banner__slayt {
        transition: none;
    }
}

/* ─── Yüksek Kontrast ─────────────────────────────────────────── */
@media (prefers-color-scheme: dark) {
    /* Sistem dark mode — gelecek geliştirmeler için hazır */
}

/* ─── Yazdır ─────────────────────────────────────────────────── */
@media print {
    .ustmenu,
    .footer,
    .buton,
    .banner__ok,
    .banner__noktalar,
    .whatsapp-sabit {
        display: none !important;
    }

    body {
        font-size: 12pt;
        color: #000;
        background: #fff;
    }
}