/* TÜM SAYFALARDA OTOMATİK SAYFA BAŞLIĞINI KAPAT */
.page-title,
.entry-title,
h1.entry-title,
.page-header,
header.page-header,
header.entry-header {
  display: none !important;
}
/* Sadece mobil cihazlar (genişliği 768px ve altı olan ekranlar) için kurallar */
@media (max-width: 768px) {
    
    /* 1. Tüm sayfa içeriklerine sağdan ve soldan boşluk ver (Kenarlara yapışmayı önler) */
    body, .container, section, main {
        padding-left: 15px !important;
        padding-right: 15px !important;
        box-sizing: border-box; /* Padding'in genişliği bozmasını engeller */
    }

    /* 2. Başlıkların boyutunu ve satır aralığını düzelt (Üst üste binmeyi önler) */
    /* 2. Başlıkların boyutunu büyüt ve alt satıra kaymayı (kırılmayı) düzelt */
    h1, h2, h3, h4 {
        font-size: 28px !important; /* 24px'ten 28px'e çıkardık, biraz daha büyüdü */
        line-height: 1.3 !important; /* Satır aralığını biraz daha toparladık */
        margin-bottom: 15px !important;
        margin-top: 15px !important;
        word-break: normal !important; /* Kelimelerin ortadan bölünmesini engeller */
        overflow-wrap: normal !important; /* Gereksiz alt satıra kaymaları önler */
    
    }

    /* 3. Resimlerin ekran dışına taşmasını engelle */
    img {
        max-width: 100% !important;
        height: auto !important;
        display: block;
        margin: 0 auto 20px auto; /* Resmi ortalar ve altına boşluk bırakır */
        border-radius: 8px; /* İsteğe bağlı: Resim kenarlarını hafif yuvarlatarak şık bir görünüm katar */
    }

    /* 4. Paragraf (açıklama) metinlerini toparla */
    p {
        font-size: 16px !important;
        line-height: 1.6 !important;
        margin-bottom: 25px !important;
        padding: 0 10px; /* Metni biraz daha içeri alır */
    }

    /* 5. Butonların etrafını ferahlat */
    .btn, button, a.button, [class*="btn-"] {
        padding: 12px 24px !important;
        margin-bottom: 30px !important;
        display: inline-block;
    }
}