/* ===================================
   Yakışır Media - Mobile-First CSS
   Sadece gerekli global CSS
   =================================== */

/* ===== MOBILE-FIRST GLOBAL CSS RESET ===== */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    overflow-x: hidden;
    scroll-behavior: smooth;
}

body {
    overflow-x: hidden;
    font-size: 14px;
}

/* Tablet ve üzeri cihazlarda font boyutu artır */
@media (min-width: 768px) {
    body {
        font-size: 16px;
    }
}

/* ===== LINE CLAMP UTILITY (Tailwind yok ise) ===== */
.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.line-clamp-3 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* ===== SCROLLBAR HIDE (Slider için) ===== */
.scrollbar-hide {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.scrollbar-hide::-webkit-scrollbar {
    display: none;
}

/* NOT: Tüm diğer stiller header.ejs içinde Tailwind class'ları ile yapılıyor */