/* ============================================================================
   Lunayra — responsive.css

   Tasarım `min-width:1200px` ile masaüstü odaklıydı ve tek bir breakpoint
   içermiyordu. Bu dosya SADECE dar ekranlarda devreye girer; 1200px ve
   üzerinde tek bir kuralı çalışmaz — masaüstü çıktısı tasarımla bire bir aynı.

   Tasarım %100 inline style olduğu için buradaki kuralların çoğu !important
   taşır: inline stil aksi halde her zaman kazanır.
   ========================================================================== */

/* ==========================================================================
   1199px altı — tablet yatay
   ========================================================================== */
@media (max-width: 1199px) {

    /* Tasarımın min-width:1200px kilidi dar ekranda kaldırılır. */
    .lun-root { min-width: 0 !important; overflow-x: hidden; }

    .lun-header { padding: 0 32px !important; }
    .lun-nav { gap: 22px !important; font-size: 14px !important; }

    .lun-hero-title { font-size: 64px !important; letter-spacing: 8px !important; margin-top: 70px !important; }
    .lun-hero-sub { font-size: 18px !important; letter-spacing: 3px !important; }
    .lun-hero-copy { padding: 60px 40px !important; }

    .lun-benefits { flex-wrap: wrap !important; gap: 44px !important; }
    .lun-showcase { gap: 40px !important; }
    .lun-gece { padding: 70px 40px !important; }
    .lun-footer { padding: 56px 40px 48px !important; }
    .lun-footer-grid { gap: 44px !important; }

    section { padding-left: 32px !important; padding-right: 32px !important; }
    .lun-page-hero { padding: 52px 32px !important; }
}

/* ==========================================================================
   991px altı — tablet dikey. Çok kolonlu her şey tek kolona iner.
   ========================================================================== */
@media (max-width: 991px) {

    /* --- başlık: sabit yükseklik ve yapışkanlık kalkar -------------------- */
    .lun-header {
        height: auto !important;
        padding: 14px 24px !important;
        flex-wrap: wrap !important;
        gap: 12px !important;
        position: static !important;
    }
    .lun-nav {
        order: 3;
        width: 100%;
        gap: 8px !important;
        overflow-x: auto;
        padding-bottom: 6px;
        /* Kaydırılabilir menünün son öğesi kenara yapışmasın. */
        scroll-padding-right: 24px;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    .lun-nav::-webkit-scrollbar { display: none; }
    .lun-nav a { white-space: nowrap; padding: 6px 10px; }
    /* Kaydırılabilir menünün sonunda nefes payı — son öğe kenara yapışmasın. */
    .lun-nav::after { content: ''; flex: 0 0 8px; }

    /* --- iki kolonlu bölümler tek kolona --------------------------------- */
    .lun-hero,
    .lun-showcase,
    .lun-gece-grid,
    .lun-about-split,
    .lun-contact-grid,
    .lun-blog-featured,
    .lun-cart-grid,
    .lun-product-grid { grid-template-columns: 1fr !important; }

    .lun-hero > div:first-child { min-height: 320px !important; }
    .lun-hero-copy { padding: 44px 28px !important; }
    .lun-hero-title { font-size: 52px !important; letter-spacing: 6px !important; margin-top: 0 !important; }

    /* Neden / Nasıl ayracı dikeyde anlamsız */
    .lun-split { grid-template-columns: 1fr !important; gap: 48px !important; }
    .lun-split-rule { display: none !important; }

    .lun-grid-3 { grid-template-columns: repeat(2, 1fr) !important; }
    .lun-grid-4 { grid-template-columns: repeat(2, 1fr) !important; }

    /* Yapışkan sütunlar dar ekranda akışı bozuyor */
    .lun-product-grid > div[style*="sticky"],
    aside[style*="sticky"] { position: static !important; }

    .lun-care { flex-direction: column !important; align-items: center !important; }
    .lun-care img { width: 100% !important; max-width: 440px !important; }
    .lun-care-2 { margin-top: 0 !important; }

    .lun-page-title { font-size: 40px !important; letter-spacing: 4px !important; }
    .lun-panel { padding: 28px 24px !important; }

    /* --- dekor: dar ekranda metnin üstüne biniyor ------------------------ */
    /* Zeytin dalı fotoğrafları (alt="" ile işaretli süs görselleri) */
    .lun-root img[alt=""] { display: none !important; }
    /* Mutlak konumlu süs SVG'leri (ay, yıldız, kıvrımlı çizgi) */
    .lun-root section > svg[style*="position:absolute"],
    .lun-root section > div > svg[style*="position:absolute"] { display: none !important; }
}

/* ==========================================================================
   767px altı — telefon
   ========================================================================== */
@media (max-width: 767px) {

    /* --- bölüm boşlukları: 90px dikey padding telefonda çok --------------- */
    section {
        padding-left: 20px !important;
        padding-right: 20px !important;
        padding-top: 48px !important;
        padding-bottom: 52px !important;
    }

    .lun-header { padding: 12px 16px !important; }
    .lun-header > a:first-child { font-size: 23px !important; letter-spacing: 4px !important; }
    .lun-header > div:last-child { gap: 16px !important; }

    /* --- tipografi ölçeği --------------------------------------------------
       Tasarımın büyük punto + geniş tracking kombinasyonu dar ekranda
       satır taşırıyor. Başlıkları viewport'a göre ölçekliyoruz.            */
    .lun-hero-title { font-size: clamp(32px, 11vw, 44px) !important; letter-spacing: 4px !important; }
    .lun-hero-sub { font-size: 14px !important; letter-spacing: 2px !important; }

    .lun-root h2 { font-size: clamp(24px, 7.5vw, 30px) !important; letter-spacing: 2.5px !important; }
    .lun-root h3 { font-size: clamp(18px, 5.4vw, 21px) !important; }
    .lun-page-title { font-size: clamp(26px, 8vw, 34px) !important; letter-spacing: 2.5px !important; }

    /* Ürün Showcase: 34px başlık + 38px fiyat taşıyordu */
    .lun-showcase h3 { font-size: clamp(20px, 6vw, 26px) !important; letter-spacing: 0 !important; }
    .lun-showcase [style*="font-size:38px"] { font-size: 26px !important; }
    .lun-showcase [style*="font-size:19px"] { font-size: 14px !important; letter-spacing: 1px !important; }
    .lun-showcase > div:first-child { height: 260px !important; }

    /* Gece Serisi CTA satırı: buton + fiyat yan yana sığmıyor */
    .lun-gece-grid [style*="align-items:center"][style*="gap:24px"] {
        flex-wrap: wrap !important;
        gap: 14px !important;
    }
    .lun-gece-grid a[style*="border-radius:999px"] { padding: 14px 30px !important; font-size: 13px !important; letter-spacing: 1.8px !important; }

    /* Gece Serisi italik slogan ve görsel */
    .lun-gece-grid [style*="font-style:italic"] { font-size: 19px !important; }
    .lun-gece-grid > div:first-child { height: 260px !important; }
    .lun-gece-grid [style*="font-size:22px"] { font-size: 18px !important; }

    /* Hakkımızda istatistikleri (44px Cormorant) */
    .lun-about-split [style*="font-size:44px"] { font-size: 30px !important; }
    .lun-about-split > div:first-child { height: 260px !important; }

    /* Footer başlığı 32px + 4px tracking */
    .lun-footer h3 { font-size: 24px !important; letter-spacing: 2px !important; }

    /* Öne çıkan blog yazısı */
    .lun-blog-featured > a { min-height: 200px !important; }
    .lun-blog-featured > div { padding: 28px 24px !important; }

    /* --- ızgaralar tek kolona -------------------------------------------- */
    .lun-grid-3,
    .lun-grid-4 { grid-template-columns: 1fr !important; gap: 20px !important; }

    /* --- faydalar: 2'li düzen, ortalanmış -------------------------------- */
    .lun-benefits {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 30px 12px !important;
        justify-items: center;
    }
    .lun-benefits > div { width: 100% !important; max-width: 150px; }
    .lun-benefits > div > div:first-child { width: 84px !important; height: 84px !important; }
    .lun-benefits svg { width: 38px !important; height: 38px !important; }
    .lun-benefits span { font-size: 13px !important; letter-spacing: 1px !important; }

    /* --- emicilik skalası ------------------------------------------------- */
    .lun-showcase [style*="align-items:flex-end"] { gap: 14px !important; }

    /* --- footer ----------------------------------------------------------- */
    .lun-footer { padding: 40px 20px 32px !important; }
    .lun-footer-grid { grid-template-columns: 1fr !important; gap: 32px !important; }
    .lun-subscribe { flex-direction: column !important; }
    .lun-subscribe input {
        width: 100% !important;
        border-right: 1px solid #8F6844 !important;
        border-radius: 8px !important;
    }
    .lun-subscribe button { border-radius: 8px !important; margin-top: 8px !important; }

    /* --- bildirimler ve şeritler ----------------------------------------- */
    .lun-flash {
        top: auto !important;
        bottom: 14px !important;
        right: 12px !important;
        left: 12px !important;
        max-width: none !important;
    }

    /* Çerez şeridi telefonda ekranın yarısını kaplamasın */
    [data-cookie-bar] { left: 10px !important; right: 10px !important; bottom: 10px !important; }
    [data-cookie-bar] > div { padding: 16px 18px !important; gap: 14px !important; }
    [data-cookie-bar] p { font-size: 12.5px !important; line-height: 1.55 !important; }
    [data-cookie-bar] button { flex: 1; padding: 11px 14px !important; font-size: 12.5px !important; }

    /* --- tablolar: satır satır kart görünümü ------------------------------ */
    .lun-table thead { display: none; }
    .lun-table tr { display: block; border-top: 1px solid #EADDC6; padding: 12px 0; }
    .lun-table td { display: flex; justify-content: space-between; gap: 16px; border: 0; padding: 7px 4px; }
    .lun-table td::before {
        content: attr(data-label);
        color: #8A785F;
        font-size: 12.5px;
        letter-spacing: 1px;
        text-transform: uppercase;
        flex-shrink: 0;
    }

    /* --- butonlar ve formlar ---------------------------------------------- */
    .lun-btn { padding: 13px 26px !important; font-size: 13px !important; letter-spacing: 1.8px !important; }
    .lun-contact-grid { grid-template-columns: 1fr !important; gap: 16px !important; }
    form[style*="padding:44px 48px"] { padding: 28px 22px !important; }

    /* Dokunma hedefleri en az 44px olsun */
    .lun-root a[style*="border-radius:999px"],
    .lun-root button[style*="border-radius:999px"] { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }

    /* --- ürün detay -------------------------------------------------------- */
    .lun-product-grid [style*="height:520px"] { height: 320px !important; }
    .lun-product-grid h1 { font-size: clamp(24px, 7vw, 32px) !important; letter-spacing: 1px !important; }
    /* Haberdar Et formu tek sütuna insin */
    #haberdar form { flex-direction: column !important; }
    #haberdar form input { width: 100% !important; border-right: 1px solid #D8C7AB !important; border-radius: 10px !important; }
    #haberdar form button { border-radius: 10px !important; margin-top: 8px !important; width: 100%; }

    /* --- sepet ------------------------------------------------------------- */
    .lun-cart-grid { grid-template-columns: 1fr !important; gap: 24px !important; }

    /* --- ürün kartı -------------------------------------------------------- */
    .lun-product-card { max-width: 460px; margin: 0 auto; width: 100%; }
}

/* ==========================================================================
   479px altı — küçük telefon
   ========================================================================== */
@media (max-width: 479px) {
    section { padding-left: 16px !important; padding-right: 16px !important; }

    /* Çok dar ekranda yatay kaydırılabilir menü fark edilmiyor;
       5 öğe iki satıra sarınca hepsi tek bakışta görünür. */
    .lun-nav {
        flex-wrap: wrap !important;
        justify-content: center;
        overflow-x: visible !important;
        row-gap: 2px !important;
    }
    .lun-nav::after { display: none; }

    .lun-hero-title { font-size: clamp(28px, 10vw, 36px) !important; letter-spacing: 3px !important; }
    .lun-hero-copy { padding: 36px 20px !important; }
    .lun-panel { padding: 20px 16px !important; }

    .lun-benefits { gap: 26px 10px !important; }
    .lun-benefits span { font-size: 12px !important; }

    /* Ürün kartı fiyat + buton satırı sığmıyor */
    .lun-product-card [style*="justify-content:space-between"] { flex-wrap: wrap; gap: 10px !important; }

    /* Emicilik skalası dört damla + ayraç + hediye kutusu */
    .lun-showcase [style*="flex-wrap:wrap"] { gap: 16px !important; }
    .lun-showcase [style*="width:1px"] { display: none !important; }

    .lun-footer h3 { font-size: 21px !important; }
}

/* Yönetim panelinin dar ekran kuralları admin.css içindedir —
   panel layout'u bu dosyayı yüklemez. */