/* =====================================================
   PİSA KOLEJİ — Public Site CSS
   ===================================================== */

:root {
    --pisa-red: #BC0914;
    --pisa-dark: #9a0710;
    --koyu: #2C2E36;
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: 'Roboto Condensed', 'Helvetica Neue', Arial, sans-serif;
}

/* Typography */
.font-baslik,
h1, h2, h3, h4, h5, h6 {
    font-family: 'Montserrat', 'Helvetica Neue', Arial, sans-serif;
}

/* Renk yardımcıları */
.text-pisa { color: var(--pisa-red) !important; }
.bg-pisa { background-color: var(--pisa-red) !important; }
.border-pisa { border-color: var(--pisa-red) !important; }
.bg-pisa-dark { background-color: var(--pisa-dark) !important; }
.bg-koyu { background-color: var(--koyu) !important; }
.text-koyu { color: var(--koyu) !important; }

/* Container */
.container {
    max-width: 1280px;
}

/* =====================================================
   HEADER
   ===================================================== */
#mainHeader {
    transition: box-shadow 0.3s ease, background 0.3s ease;
}

/* =====================================================
   SWIPER HERO
   ===================================================== */
.hero-swiper .swiper-button-next,
.hero-swiper .swiper-button-prev {
    color: white;
    background: rgba(0,0,0,0.3);
    width: 44px;
    height: 44px;
    border-radius: 50%;
    backdrop-filter: blur(4px);
}

.hero-swiper .swiper-button-next::after,
.hero-swiper .swiper-button-prev::after {
    font-size: 16px;
    font-weight: 700;
}

.hero-swiper .swiper-pagination-bullet {
    background: white;
    opacity: 0.7;
}

.hero-swiper .swiper-pagination-bullet-active {
    opacity: 1;
    background: var(--pisa-red);
}

/* =====================================================
   SAYFALAMA (Bootstrap Override for Tailwind pages)
   ===================================================== */
.pagination {
    display: flex;
    justify-content: center;
    gap: 4px;
    margin-top: 2rem;
    list-style: none;
    padding: 0;
}

.pagination .page-item .page-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 8px;
    border: 1px solid #e5e7eb;
    color: #374151;
    font-weight: 500;
    text-decoration: none;
    transition: all 0.2s;
    background: white;
}

.pagination .page-item .page-link:hover {
    background: var(--pisa-red);
    color: white;
    border-color: var(--pisa-red);
}

.pagination .page-item.active .page-link {
    background: var(--pisa-red);
    color: white;
    border-color: var(--pisa-red);
}

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

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

/* =====================================================
   WhatsApp Buton Animasyonu
   ===================================================== */
@keyframes whatsappPulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(37,211,102,0.4); }
    50%       { box-shadow: 0 0 0 12px rgba(37,211,102,0); }
}

.fixed.bottom-6.right-6 {
    animation: whatsappPulse 2s ease-in-out infinite;
}

/* =====================================================
   İçerik Stilleri
   ===================================================== */
.prose a { color: var(--pisa-red); }
.prose img { border-radius: 12px; }

/* =====================================================
   Responsive Yardımcılar
   ===================================================== */
@media (max-width: 640px) {
    .hero-swiper .swiper-button-next,
    .hero-swiper .swiper-button-prev {
        display: none;
    }
}
