:root {
            --p-purple: #6a2a8b;
            --p-blue: #0099bc;
            --p-orange: #f39200;
            --p-green: #92c83e;
            --white: #ffffff;
            --dark: #121212;
            --light-grey: #f4f5f7;
            --footer-bg: #1e1e1e;
        }

        * { box-sizing: border-box; margin: 0; padding: 0; }
        
.h-card {
    display: flex;
    flex-direction: column;
    height: 100%; /* Kartların yan yana eşit boyda olması için */
    padding: 20px;
    border: 1px solid #eee;
    border-radius: 12px;
}

/* Metin alanı */
.n-text {
    margin-bottom: 20px; /* Butonla arasındaki minimum mesafe */
    font-size: 16px;
    color: #666;
    line-height: 1.5;
}

/* Buton alanı */
.n-btn {
    margin-top: auto; /* SİHİRLİ DOKUNUŞ: Üstteki tüm boşluğu iter ve butonu dibe sabitler */
    display: inline-block;
    padding: 10px 20px;
    background-color: white;
    color: var(--p-purple);
    text-align: center;
    text-decoration: none;
    border-radius: 6px;
    font-weight: 600;
    transition: background 0.3s ease;
    align-self: flex-center; /* Butonun kart genişliği kadar değil, metni kadar olması için */
    border:1px solid var(--p-purple);
}

.n-btn:hover {
    background-color: var(--p-purple);
    color:white;
}

        /* DÜZELTME 1: Yatay taşmayı engelle */
        html, body { 
            overflow-x: hidden; 
            width: 100%;
            position: relative;
        }

        body { 
            font-family: 'Outfit', sans-serif; 
            background-color: var(--light-grey);
            background-image: radial-gradient(#dbe0e5 1px, transparent 1px);
            background-size: 30px 30px;
            color: var(--dark); 
        }

        /* --- STICKY DUYURU --- */
        .announcement-sticky {
            background: var(--p-purple); height: 50px; width: 100%; position: fixed; top: 0; z-index: 4500;
            display: flex; justify-content: flex-end; align-items: center; padding: 0 5%;
        }
        .ann-container { width: 100%; height: 100%; overflow: hidden; position: relative; }
        .ann-item {
            position: absolute; right: 0; height: 100%; display: flex; align-items: center;
            color: white; font-size: 17px; font-weight: 500; opacity: 0; animation: slideUp 9s infinite;
        }
        .ann-item b { color: var(--p-orange); margin-right: 12px; font-weight: 700; }
        @keyframes slideUp { 0%, 5% { opacity: 0; transform: translateY(15px); } 10%, 30% { opacity: 1; transform: translateY(0); } 35%, 100% { opacity: 0; transform: translateY(-15px); } }

        /* --- LOGO PANEL --- */
        .logo-sticky-panel {
            position: fixed; top: 0; left: 5%; background: white; padding: 3px 15px 3px 15px;
            z-index: 5000;  border-radius: 0 0 0 0;
            transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
              
        }
        .logo-sticky-panel img { height: 90px; width: auto; transition: 0.4s; }
        .scrolled .logo-sticky-panel { padding: 10px 25px 25px;  }
        .scrolled .logo-sticky-panel img { height: 65px; }

        /* --- NAVBAR & DROPDOWN --- */
        .nav-wrapper { position: fixed; top: 50px; width: 100%; z-index: 4000; transition: 0.4s; }
        
        .nav-glass {
            background: white; backdrop-filter: blur(12px);
            margin: 0px 0% 0; padding: 5px 40px; border-radius: 0px;
            display: flex; justify-content: flex-end; align-items: center;
            border: 1px solid rgba(255,255,255,0.3); transition: 0.4s;
        }
        
        .mobile-logo-link { display: none; margin-right: auto; }

        .nav-menu { display: flex; list-style: none; gap: 30px; align-items: center; }
        
        .nav-item { position: relative; padding: 10px 0; } 

        .nav-link { 
            text-decoration: none; color: rgb(19, 17, 19); font-weight: 700; 
            font-size: 16px; text-transform: uppercase; transition: 0.3s; 
            letter-spacing: 0.5px; display: flex; align-items: center; gap: 6px;
        }
        .nav-link i { font-size: 12px; transition: 0.3s; }
        .nav-item:hover .nav-link { color: var(--p-orange); }
        .nav-item:hover .nav-link i { transform: rotate(180deg); }

        /* Glassmorphism Dropdown */
        .dropdown-menu {
            position: absolute;
            top: 100%;
            left: 50%;
            transform: translateX(-50%) translateY(20px);
            width: 240px;
            background: rgba(255, 255, 255);
            backdrop-filter: blur(15px);
            -webkit-backdrop-filter: blur(15px);
            padding: 15px;
            border-radius: 15px;
            border: 1px solid rgba(255, 255, 255, 0.6);
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
            opacity: 0;
            visibility: hidden;
            transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
            list-style: none;
            z-index: 9999;
        }
        
        .nav-item:hover .dropdown-menu {
            opacity: 1; visibility: visible;
            transform: translateX(-50%) translateY(0);
        }

        .dropdown-menu li { display: block; width: 100%; margin-bottom: 5px; }
        .dropdown-menu li:last-child { margin-bottom: 0; }
        
        .dropdown-menu a {
            display: block; padding: 10px 15px;
            color: var(--dark); text-decoration: none;
            font-size: 14px; font-weight: 600;
            border-radius: 10px; transition: 0.3s;
            font-family: 'Montserrat', sans-serif;
        }
        .dropdown-menu a:hover {
            background: var(--p-purple); color: white;
            padding-left: 20px;
        }

        .hamburger { display: none; color: rgb(93, 3, 124); font-size: 24px; cursor: pointer; }
        
        .scrolled .nav-glass { background: white; margin: 0; border-radius: 0; border: none; box-shadow: 0 4px 20px rgba(0,0,0,0.05); padding: 10px 5%; }
        .scrolled .nav-link { color: var(--dark); }
        .scrolled .hamburger { color: var(--dark); }

        /* --- SLIDER --- */
        .hero-slider {
    width: 100%;
    height: 100vh;
    position: relative;
    overflow: hidden;
}


.footer-logo {
    max-width: 100%; /* Logonun genişliğini buradan ayarlayabilirsin */
    height: auto;
    display: block;
    /* Eğer görselin arkası transparan (PNG) ise direkt temiz görünecektir */
}
.hero-slider .slide {
    position: absolute;
    top: 50px;
    left: 0;
    width: 100%;
    height: 100%;
    display: none;
    background-position: center;
    background-repeat: no-repeat;
    /* En önemli satır: Resmi alanı dolduracak şekilde büyütür/kırpar */
    background-size: cover; 
}
        
      .hero-slider .slide.active {
    display: flex;
    align-items: center;
    justify-content: center;
}
        .hero-slider .slide video {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%; 
    min-height: 100%;
    width: auto;
    height: auto;
    /* Videoyu merkeze sabitler */
    transform: translate(-50%, -50%); 
    /* Videonun alanı tamamen kaplamasını sağlar */
    object-fit: cover; 
    z-index: 0;
}
        .slide-overlay { position: absolute; inset: 0; background: linear-gradient(to right, rgba(0,0,0,0.5), transparent); z-index: 0; }
        
        .hero-slider .slide-content {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 1200px; /* İçeriğin çok sağa/sola yayılmaması için sınır */
    margin: 0 auto;    /* Konteynırı ortalar */
    padding: 0 5%;     /* Kenarlardan güvenli boşluk bırakır */
    
    /* Masaüstünde Sola Yaslar */
    text-align: left; 
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
}
       
.hero-slider .slide-content h1 {
    font-size: 4rem;
    line-height: 1.1;
    margin-top: 15px;
    color:white;
}
 .slider-nav { position: absolute; top: 50%; right: 5%; z-index: 100; display: flex; gap: 15px;     flex-direction: column-reverse;
    flex-wrap: wrap;
    justify-content: space-evenly;
    align-items: center; }
        .s-btn { width: 55px; height: 55px; border: 2px solid white; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: white; cursor: pointer; transition: 0.3s; }
        .s-btn:hover { background: white; color: var(--p-purple); border-color: var(--p-purple); }

      /* --- KADEMELER (YENİ MOR STİL) --- */

/* Slider kapsayıcısının relative olduğundan emin olun */
.hero-slider {
    position: relative;
}

.kademe-strip.purple-nav {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%); /* Tam ortalamak için */
    
    width: 80%; /* Ekranı tam kaplamasın, ortada dursun */
    max-width: 900px; /* Çok geniş ekranlarda aşırı uzamasın */
    height: 50px; /* Çubuk daha ince (dar) */
    
    background: var(--p-purple); /* Sizin mor renginiz (#6a2a8b) */
    border-radius: 20px 20px 0 0; /* Sadece üst köşeleri yuvarla */
    
    display: flex;
    justify-content: space-between;
    align-items: center;
    z-index: 150;
    box-shadow: 0 -5px 20px rgba(0,0,0,0.2); /* Hafif gölge */
    overflow: hidden; /* Köşe yuvarlatmalarının bozulmaması için */
}

.k-box {
    flex: 1; /* Alanı eşit paylaşsınlar */
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    
    color: white; /* Yazı rengi beyaz */
    font-size: 0.95rem;
    font-weight: 600;
    text-decoration: none;
    letter-spacing: 1px;
    transition: all 0.3s ease;
    
    /* Kutular arası ince çizgi (istenirse kaldırılabilir) */
    border-right: 1px solid rgba(255, 255, 255, 0.1);
}

.k-box:last-child {
    border-right: none;
}

/* Hover Efekti */
.k-box:hover {
    background: rgba(255, 255, 255, 0.15); /* Üzerine gelince hafif aydınlansın */
    color: #fff;
}

/* Mobil Uyumluluk */
@media (max-width: 768px) {
    .kademe-strip.purple-nav {
        width: 100%; /* Mobilde tam genişlik olsun */
        border-radius: 0; /* Mobilde yuvarlatmayı kaldır */
        height: auto; /* İçeriğe göre uzasın */
        padding: 10px 0;
        flex-wrap: wrap; /* Sığmazsa alt satıra geçsin */
        background-color: #6c31ab94;
        
    }
    
    .k-box {
        flex: 20%; /* Mobilde 2 yan yana */
        padding: 5px 0;
        font-size: 0.85rem;
        border: none; /* Mobilde çizgileri kaldır */
    }
}

        /* --- BÖLÜM: İMKANLAR VE DUYURULAR --- */
        .split-info-section { 
            padding: 80px 5%;
            display: grid;
            grid-template-columns: 1.2fr 1fr;
            gap: 50px;
            background: white; 
            position: relative;
            z-index: 10;
            padding-left: 20px;
            background-color: #ffffff; 
            background-image: radial-gradient(#dbe0e5 1px, #ffffff 1px);
            background-size: 30px 30px; 
        }

        .facility-wrapper {
            position: relative;
            border-radius: 20px;
            overflow: hidden;
            height: 100%;
            min-height: 480px;
            /*box-shadow: 0 15px 40px rgba(0,0,0,0.1);*/
            background: none;
        }

        .f-slide {
            position: absolute;
            inset: 0;
            width: 100%;
            height: 100%;
            opacity: 0;
            transition: opacity 0.8s ease-in-out;
            z-index: 1;
        }

        .f-slide.active { opacity: 1; z-index: 2; }

        .f-slide img {
            width: 100%;
            height: 100%;
            object-fit: contain;
            transition: transform 3s ease;
        }
        .f-slide.active img { transform: scale(1.0); }

        .facility-overlay {
            position: absolute;
            inset: 0;
            /*background: linear-gradient(to top, rgba(0,0,0,0.9), transparent 60%);*/
            display: flex;
            flex-direction: column;
            justify-content: flex-end;
            padding: 40px;
            text-decoration: none;
            color: white;
            z-index: 3;
        }
.beyaz-yazi-keskin {
  color: white;
  text-shadow: 
    1px 1px 2px rgba(0, 0, 0, 0.8), 
    0 0 1em rgba(0, 0, 0, 0.3), 
    0 0 0.2em rgba(0, 0, 0, 0.5);
}

        .facility-overlay h3 { font-family: 'Montserrat'; font-size: 2rem; font-weight: 800; margin-bottom: 10px; transform: translateY(20px); opacity: 0; transition: 0.5s 0.2s; }
        .facility-overlay p { font-size: 1.1rem; opacity: 0; transform: translateY(20px); transition: 0.5s 0.4s; display: flex; align-items: center; gap: 10px; }
        .f-slide.active .facility-overlay h3, .f-slide.active .facility-overlay p { opacity: 1; transform: translateY(0); }
        .facility-wrapper:hover .facility-overlay p { color: var(--p-orange); }

        .f-controls { position: absolute; bottom: 30px; right: 30px; z-index: 10; display: flex; gap: 10px; }
        .f-controls button { width: 50px; height: 50px; border: 1px solid rgba(255,255,255,0.4); border-radius: 50%; background: rgb(106 42 139 / 76%); backdrop-filter: blur(5px); color: white; font-size: 1.2rem; cursor: pointer; transition: 0.3s; display: flex; align-items: center; justify-content: center; }
        .f-controls button:hover { background: var(--p-orange); border-color: var(--p-orange); transform: translateY(-3px); }

        /* Duyuru Listesi */
        .announcement-list-box h2 { font-family: 'Montserrat'; font-size: 2rem; font-weight: 800; color: var(--dark); margin-bottom: 30px; border-left: 5px solid var(--p-purple); padding-left: 20px; }
        .ann-list { list-style: none; display: flex; flex-direction: column; gap: 10px; }
        .ann-row { display: flex; align-items: center; gap: 20px; padding-bottom: 10px; border-bottom: 1px solid #eee; }
        .ann-row:last-child { border-bottom: none; padding-bottom: 0; }
        .date-badge { background: var(--light-grey); width: 75px; height: 75px; border-radius: 15px; display: flex; flex-direction: column; align-items: center; justify-content: center; flex-shrink: 0; color: var(--p-blue); font-weight: 800; line-height: 1.1; }
        .date-badge .day { font-size: 26px; color: var(--dark); }
        .date-badge .month { font-size: 12px; text-transform: uppercase; letter-spacing: 1px; }
        .ann-content { flex: 1; }
        .ann-link { display: block; font-family: 'Montserrat'; font-size: 1rem; font-weight: 700; color: var(--dark); text-decoration: none; margin-bottom: 8px; transition: 0.3s; }
        .ann-link:hover { color: var(--p-purple); }
        .ann-meta { font-size: 0.9rem; color: #777; display: flex; align-items: center; gap: 15px; }
        .ann-meta i { color: var(--p-orange); }

        /* --- FOTO GALERİ --- */
        .photo-gallery-section {
            padding: 15px 0;
            background: white;
            margin: 0px 0;
            border-top: 1px solid #eee;
            border-bottom: 1px solid #eee;
            padding-left: 20px;
            background-color: #ffffff; 
            background-image: radial-gradient(#dbe0e5 1px, #ffffff 1px);
            background-size: 30px 30px; 
        }
        .gallery-scroll {
            display: flex;
            gap: 15px;
            overflow-x: auto;
            padding: 0 0px 0 0px; 
            cursor: grab;
            scrollbar-width: none;
        }
        .gallery-scroll::-webkit-scrollbar { display: none; }

        .gallery-item {
            min-width: 25vh;
            height: 250px;
            border-radius: 15px;
            overflow: hidden;
            position: relative;
            flex-shrink: 0;
        }
        .gallery-item img { width: 100%; height: 100%; object-fit: cover; transition: 0.4s; }
        .gallery-item:hover img { transform: scale(1.08); }

 /* --- KAMPÜSLER GÜNCEL --- */
.campuses-section {
    padding: 40px 3%; /* Sağ ve soldan %3 eşit ve az boşluk */
    background-color: #ffffff; 
    background-image: radial-gradient(#dbe0e5 1px, #ffffff 1px);
    background-size: 30px 30px;
    max-width: 100%;
    margin: 0 auto;
}

.campuses-header { 
    margin-bottom: 30px; 
    display: flex; 
    justify-content: space-between; 
    align-items: flex-end; 
    padding: 0; /* İç padding section'dan geldiği için sıfırladık */
}

.campuses-header h2 {
    margin-left: 0; /* Gereksiz sol boşluk kaldırıldı */
    font-family: 'Montserrat'; 
    font-size: 2rem; 
    font-weight: 800; 
    color: var(--dark); 
    border-left: 5px solid var(--p-purple); 
    padding-left: 20px; 
}

.campuses-header p { 
    color: #666; 
    max-width: 400px; 
    text-align: right; 
    margin-bottom: 5px;
}

.campus-wrapper {
    display: flex;
    gap: 20px;
    width: 100%;
    overflow-x: auto; /* Mobilde kaydırma için gerekli */
    scroll-behavior: smooth;
    padding: 10px 0;
    /* Kaydırma çubuğunu gizlemek isterseniz aşağıdaki 3 satırı kullanın */
    -ms-overflow-style: none;  /* IE ve Edge */
    scrollbar-width: none;  /* Firefox */
}
.campus-wrapper::-webkit-scrollbar { display: none; } /* Chrome, Safari, Opera */

.campus-card {
    flex: 0 0 calc(25% - 16px); /* Masaüstünde 5 adet yan yana */
    height: 400px;
    border-radius: 15px;
    overflow: hidden;
    position: relative;
}

        .campus-card img { width: 100%; height: 100%; object-fit: cover; transition: 0.8s; }
        .campus-card:hover img { transform: scale(1.1); }
        .campus-info {
            position: absolute; inset: 0;
            background: linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.4) 40%, transparent 100%);
            display: flex; flex-direction: column; justify-content: flex-end; padding: 35px; color: white;
        }
        .campus-city { font-size: 0.9rem; color: var(--p-orange); font-weight: 700; text-transform: uppercase; letter-spacing: 2px; margin-bottom: 5px; }
        .campus-info h3 { font-family: 'Montserrat'; font-size: 2rem; font-weight: 800; line-height: 1.1; }

        /* --- HABERLER & ETKİNLİKLER --- */
        .scroll-section { 
    padding: 30px 5%; /* Sağdan ve soldan %5 eşit boşluk */
    max-width: 1600px; /* Çok geniş ekranlarda aşırı yayılmaması için */
    margin: 0 auto; /* Bölümü ortalar */
}

.scroll-header { 
    display: flex; 
    justify-content: space-between; 
    align-items: center; 
    margin-bottom: 10px; 
    padding-right: 0; /* Padding section tarafından yönetildiği için sıfırladık */
}

.scroll-header h2 {
    margin-left: 0; 
    font-family: 'Montserrat'; 
    font-size: 2rem; 
    font-weight: 800; 
    color: var(--dark); 
    border-left: 5px solid var(--p-purple); 
    padding-left: 20px; 
}

.h-wrapper { 
    display: flex; 
    gap: 30px; 
    overflow-x: auto; 
    padding-bottom: 0px; 
    cursor: grab; 
    scrollbar-width: none; 
}

.h-wrapper::-webkit-scrollbar { display: none; }
        .h-card { width:32%;  min-height: 475px; background: white; border-radius: 20px; padding: 15px; margin-top:5px; box-shadow: 0 5px 5px rgba(0,0,0,0.03); border: 1px solid #f0f0f0; flex-shrink: 0; transition: 0.3s; position: relative; overflow: hidden; }
        .h-card:hover { transform: translateY(-5px); box-shadow: 0 5px 5px rgba(0,0,0,0.08); }
        .h-card img { width: 100%; height: 300px; object-fit: cover; border-radius: 15px; margin-bottom: 20px; }
        .n-cat { position: absolute; top: 250px; right: 20px; background: var(--p-orange); color: white; padding: 5px 15px; font-size: 12px; font-weight: 700; border-radius: 3px; text-transform: uppercase; }
        .n-date { color: var(--p-blue); font-weight: 700; font-size: 13px; margin-bottom: 8px; display: block; }
        .n-title { font-family: 'Montserrat'; font-size: 1.4rem; font-weight: 800; line-height: 1.3; color: var(--dark); margin-bottom: 10px; }
        /* --- KURUCU --- */
        .founder-minimal { background: white; margin: 80px 10%; border-radius: 30px; padding: 60px; display: flex; align-items: center; gap: 50px; box-shadow: 0 20px 60px rgba(0,0,0,0.05); position: relative; }
        .founder-img img { width: 400px; height: 300px; object-fit: cover; border-radius: 10px; border: 5px solid var(--light-grey); }
        .founder-quote { font-family: 'Playfair Display', serif; font-size: 1.8rem; font-style: italic; color: #333; line-height: 1.5; margin-bottom: 20px; }
        .quote-icon { position: absolute; top: 40px; left: 40px; font-size: 8rem; color: var(--p-orange); opacity: 0.1; font-family: serif; }
        
        .features-grid { padding: 0 5% 80px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
        .feat-card { background: white; padding: 40px 20px; border-radius: 20px; text-align: center; transition: 0.3s; border-top: 5px solid var(--p-blue); box-shadow: 0 10px 30px rgba(0,0,0,0.02); }
        .feat-card:hover { transform: translateY(-10px); }
        .feat-card i { font-size: 3rem; color: var(--p-orange); margin-bottom: 20px; }

        /* --- CTA --- */
        .cta-section-new { margin-top:0px;
            background: linear-gradient(rgba(106, 42, 139, 0.92), rgba(106, 42, 139, 0.92)), url('2.JPG') center/cover;
            padding: 60px 4%; display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center;
            border-radius: 6px 6px 0 0; color: white;
        }
        .cta-section-new h2 { font-family: 'Montserrat'; font-size: 3.5rem; line-height: 1; font-weight: 1000; margin-bottom: 20px; }
        .cta-form-box { background: white; padding: 40px; border-radius: 25px; box-shadow: 0 25px 60px rgba(0,0,0,0.3); color: var(--dark); }
        .form-inp { width: 100%; padding: 15px; margin-bottom: 15px; border: 1px solid #ddd; border-radius: 10px; font-size: 1rem; font-family: inherit; }
        .form-btn { width: 100%; padding: 18px; background: var(--p-orange); color: white; border: none; border-radius: 10px; font-weight: 800; font-size: 1.1rem; cursor: pointer; transition: 0.3s; }
        
        .recaptcha-box {
            background: #f9f9f9; border: 1px solid #d3d3d3; border-radius: 4px; 
            padding: 15px; margin-bottom: 20px; display: flex; align-items: center; justify-content: space-between;
            max-width: 300px;
        }
        .rc-check { display: flex; align-items: center; gap: 12px; }
        .rc-box { width: 24px; height: 24px; border: 2px solid #c1c1c1; background: white; border-radius: 2px; }
        .rc-label { font-size: 14px; color: #555; font-family: 'Roboto', sans-serif; }
        .rc-logo { display: flex; flex-direction: column; align-items: center; font-size: 9px; color: #555; opacity: 0.7; }
        .rc-logo i { font-size: 18px; margin-bottom: 2px; color: #1A73E8; }

        /* --- FOOTER --- */
        footer { background: var(--footer-bg); color: #bbb; padding: 80px 8% 40px; font-size: 15px; }
        .footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1.5fr; gap: 50px; border-bottom: 1px solid rgba(255,255,255,0.1); padding-bottom: 60px; margin-bottom: 40px; }
        .f-brand h2 { color: white; font-family: 'Montserrat'; font-size: 2rem; margin-bottom: 0px; text-align: center; }
        .f-socials { display: flex; gap: 15px; margin-top: 20px; }
        .f-socials a { width: 45px; height: 45px; background: rgba(255,255,255,0.05); border-radius: 50%; display: flex; align-items: center; justify-content: center; color: white; text-decoration: none; transition: 0.3s; }
        .f-socials a:hover { background: var(--p-orange); transform: translateY(-5px); }
        .f-title { color: white; font-family: 'Montserrat'; font-weight: 700; margin-bottom: 25px; font-size: 1.1rem; border-left: 4px solid white; padding-left: 15px; }
        .f-title1 { color: rgb(23, 175, 222); }
        
        .f-list { list-style: none; }
        .f-list li { margin-bottom: 15px; }
        .f-list a { color: #bbb; text-decoration: none; transition: 0.3s; display: inline-flex; align-items: center; gap: 8px; }
        .f-list a:hover { color: white; padding-left: 5px; }
        .f-contact-row { display: flex; gap: 15px; margin-bottom: 20px; }
        .f-icon { width: 40px; height: 40px; background: rgba(255,255,255,0.05); border-radius: 8px; display: flex; align-items: center; justify-content: center; color: var(--p-green); flex-shrink: 0; }
        .footer-bottom { text-align: center; color: #666; font-size: 14px; }
        .f-brand{display: flex;
    flex-direction: column;   /* Öğeleri alt alta dizer */
    align-items: center;      /* Yatayda her şeyi ortalar */
    justify-content: center;  /* Dikeyde ortalar */
    text-align: center;       /* Metinleri ortalar */}

        /* --- POPUP --- */
        #promoPopup { 
            position: fixed; inset: 0; background: rgba(0,0,0,0.8); z-index: 9999; 
            display: flex; justify-content: center; align-items: center; 
            visibility: hidden; opacity: 0; transition: 0.5s; 
            padding: 20px; 
        }
        #promoPopup.active { visibility: visible; opacity: 1; }
        
        .popup-box { 
            background: white; padding: 0; border-radius: 20px; text-align: center; 
            position: relative; width: 100%; max-width: 500px; max-height: 90vh; 
            overflow-y: auto; border-bottom: 6px solid var(--p-orange); 
            box-shadow: 0 25px 50px rgba(0,0,0,0.5);
        }
        .popup-box img { width: 100%; display: block; max-height: 300px; object-fit: cover; border-radius: 20px 20px 0 0; }
        .popup-content { padding: 30px; }
        .close-pop { 
            position: absolute; top: 15px; right: 15px; width: 35px; height: 35px; background: white; 
            border-radius: 50%; font-size: 24px; line-height: 35px; cursor: pointer; 
            box-shadow: 0 5px 15px rgba(0,0,0,0.2); z-index: 10;
        }

        @media (max-width: 991px) {
    /* Menü listesinin genel dikey boşluğu */
    .nav-menu {
        padding: 20px 0 !important;
        display: flex;
        flex-direction: column;
        gap: 5px; /* Menü öğeleri arasında küçük bir boşluk */
    }

    .nav-item {
        width: 100%;
        margin-bottom: 5px; /* Her bir menü elemanı arasına mesafe */
    }

    /* Tıklama alanını (hitbox) büyüten ana kısım */
    .nav-link {
        display: flex !important;
        align-items: center;
        justify-content: space-between;
        padding: 18px 25px !important; /* Dikeyde 18px, yatayda 25px boşluk */
        font-size: 16px !important; /* Okunabilirliği artırır */
        line-height: 1.2;
        width: 100%;
        border-radius: 8px; /* Görsel seçilebilirlik için hafif köşe */
        transition: background 0.3s ease;
    }

    /* Tıklanan alanı görsel olarak belli etmek için (isteğe bağlı) */
    .nav-link:active {
        background-color: rgba(0, 0, 0, 0.05);
    }

    /* Dropdown (açılır menü) içindeki linkleri de genişletelim */
    .dropdown-menu li a {
        padding: 15px 40px !important; /* Alt menü linkleri daha geniş olsun */
        display: block;
        width: 100%;
    }
    
    /* İkonların sağa yaslanması tıklama karmaşasını azaltır */
    .nav-link i {
        margin-left: auto;
        padding: 5px; /* İkonun etrafına da görünmez bir tıklama alanı */
    }
}

        /* --- MOBİL RESPONSIVE DÜZENLEMELERİ --- */
        @media (max-width: 1024px) {
		
		
		.f-controls { position: absolute; bottom: 30px; right: 30px; z-index: 10; display: flex; gap: 10px; }
            
            .logo-sticky-panel { display: none !important; }

            .nav-glass {
                height: 70px; padding: 0 20px; justify-content: space-between; align-items: center;
            }
            .scrolled .nav-glass { padding: 0 20px !important; }

            .mobile-logo-link { 
                display: flex; align-items: center; z-index: 100000; background:white; justify-content: space-evenly;
                border-radius:0px; width: 100%; align-items:flex-end;
               height: 100%;
            }
            .mobile-logo-link img { height: 70px; width: 200px; z-index:5000; object-fit: contain; padding: 5px 0; }

            .hamburger { display: block; font-size: 24px; }
            
            .nav-menu { 
                display: none; flex-direction: column; position: absolute; top: 100%; left: 0; width: 100%; 
                background: white; padding: 20px; border-radius: 0 0 20px 20px; 
                box-shadow: 0 10px 20px rgba(0,0,0,0.1); 
            }
            .nav-menu.active { display: flex; }
            
            /* Mobilde dropdown'ları statik yap */
            .nav-item { width: 100%; padding: 0; }
            .nav-link { justify-content: space-between; width: 100%; padding: 15px 0; border-bottom: 1px solid #eee; color: var(--dark); }
            
            .dropdown-menu {
                position: static;
                transform: none;
                opacity: 1;
                visibility: visible;
                width: 100%;
                background: transparent;
                box-shadow: none;
                border: none;
                backdrop-filter: none;
                padding: 0 0 0 20px;
                display: none; /* JS ile açılır yapılabilir veya CSS hover */
            }
            /* Mobilde hover ile açılması için */
            .nav-item:hover .dropdown-menu { display: block; transform: none; }
            .dropdown-menu a { color: #555; padding: 10px 0; border-bottom: 1px solid #eee; }
            .dropdown-menu a:hover { background: transparent; color: var(--p-purple); padding-left: 5px; }


            .founder-minimal { flex-direction: column; text-align: center; padding: 40px; }
            .footer-grid, .cta-section-new, .features-grid, .campuses-header { grid-template-columns: 1fr; gap: 40px; }
            .kademe-strip { flex-wrap: wrap; }
            .k-box { flex: 50%; }
            .cta-section-new h2 { font-size: 2.5rem; }
            .popup-box img { max-height: 200px; }

            .split-info-section { grid-template-columns: 1fr; padding: 60px 5%; gap: 40px; }
            .facility-wrapper { min-height: 350px; }

            .campus-card { width: 85vw; height: 400px; flex: 0 0 85vw; }
            .campuses-header { flex-direction: column; align-items: flex-start; gap: 10px; }
            .campuses-header p { text-align: left; }
        }
		
		
		
		/* --- CTA Bölümü İçindeki Özellikler (Yeni Tasarım) --- */

/* Izgara Yapısı: Yan yana 2'şerli olacak şekilde ayarladık */
.cta-section-new .cta-features {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    padding: 0; /* Varsayılan boşlukları sıfırladık */
}

/* Kart Tasarımı: Şeffaf arka plan, Beyaz Çerçeve */
.cta-section-new .cta-features .feat-card {
    background: rgba(255, 255, 255, 0.1); /* Hafif şeffaf dolgu */
    border: 1px solid rgba(255, 255, 255, 0.8); /* Beyaz Çerçeve */
    color: white; /* Yazı rengi beyaz */
    padding: 25px 15px;
    box-shadow: none; /* Gölgeyi kaldırdık */
    border-top: 1px solid rgba(255, 255, 255, 0.8); /* Üstteki mavi çizgiyi beyaz yaptık */
    text-align: center;
}

/* Hover (Üzerine Gelince) Efekti */
.cta-section-new .cta-features .feat-card:hover {
    background: rgba(255, 255, 255, 0.2);
    transform: translateY(-5px);
}

/* İkon ve Metin Renklerini Zorla Beyaz Yap */
.cta-section-new .cta-features .feat-card i,
.cta-section-new .cta-features .feat-card h3,
.cta-section-new .cta-features .feat-card p {
    color: white !important;
}
/* Tarih Etiketi Konumlandırma */
.f-slide .f-date-badge {
    position: absolute !important;
    top: 20px !important;
    left: 20px !important;
    background: rgba(0, 0, 0, 0.7) !important; /* Fotoğraf üzerinde netlik sağlar */
    backdrop-filter: blur(8px) !important; /* Arkadaki fotoğrafı hafif bulanıklaştırır, okunurluğu artırır */
    color: #ffffff !important;
    padding: 8px 15px !important;
    border-radius: 6px !important;
    font-size: 0.85rem !important;
    font-weight: 600 !important;
    z-index: 5 !important; /* Overlay'in altında ama resmin üstünde kalmalı */
    display: flex;
    align-items: center;
    gap: 8px;
    border-left: 3px solid var(--p-orange) !important;
    transition: all 0.5s ease;
    pointer-events: none; /* Mouse ile üzerine gelince linke tıklamayı engellemez */
}

/* Sadece aktif olan slaytta tarih görünsün */
.f-slide { opacity: 0; transition: opacity 0.8s ease-in-out; }
.f-slide.active { opacity: 1 !important; }

.f-slide .f-date-badge i {
    color: var(--p-orange) !important;
}

/* Mobil için boyut ayarı */
@media (max-width: 768px) {
    .f-slide .f-date-badge {
        top: 15px !important;
        left: 15px !important;
        font-size: 0.75rem !important;
        padding: 6px 10px !important;
    }
}
.cta-section-new .cta-features .feat-card h3 {
    font-size: 1.2rem;
    margin: 15px 0 10px;
}

.cta-section-new .cta-features .feat-card p {
    font-size: 0.9rem;
    opacity: 0.9;
}

/* Mobil Uyumluluk: Telefondan bakınca alt alta 1 sütun olsun */
@media (max-width: 768px) {
    .cta-section-new .cta-features {
        
    }
.h-card{min-width: 100%;}
.campus-wrapper {
        gap: 15px;
        padding: 0 20px; /* İlk kartın tam sıfırdan başlamaması için */
        scroll-snap-type: x mandatory; /* Mıknatıs özelliği aktif */
    }

    .campus-card {
        flex: 0 0 85%; /* Ekranda tek kartın %85'i görünür (sıradaki kartın ucu görünür) */
        height: 350px;
        scroll-snap-align: center; /* Kaydırınca kartı ekranın ortasına yapıştırır */
    }

}


/* --- MOBİL İÇİN GLASSMORPHISM STRIP --- */
@media (max-width: 768px) {
    
    
}

/* --- TAŞMA SORUNU İÇİN ACİL DÜZELTMELER (EN ALTA EKLE) --- */

/* 1. Tüm taşmaları global olarak engelle */
html, body {
    overflow-x: hidden !important;
    max-width: 100% !important;
    position: relative;
}

/* 2. Resimlerin asla kapsayıcıdan taşmamasını garantiye al */
img {
    max-width: 100%;
    height: auto;
}

@media (max-width: 768px) {
    
    
    .hero-slider .slide-content h1 {
    font-size: 2.5rem;
    line-height: 1.1;
    margin-top: 10px;
    color:white;
  
}

    /* Founder Alanı Düzeltmesi */
    /* Eski kodda %10 margin vardı, bu mobilde içeriği sıkıştırıp taşırıyordu */
    .founder-minimal {
        width: 90% !important; /* Genişliği sabitle */
        margin: 40px auto !important; /* Yan marginleri auto yapıp ortala */
        padding: 30px 20px !important; /* İç boşluğu azalt */
        box-sizing: border-box;
    }

    /* Resim mobilde çok büyük kalıp taşıyordu, sınırladık */
    .founder-img img {
        width: 100% !important;
        max-width: 200px !important; /* Çok büyümesin */
        height: auto !important;
        border: 3px solid var(--light-grey); /* Çerçeveyi incelttik */
    }

    /* Kampüs Kartları Düzeltmesi */
    /* 85vw + Padding ekranı taşıyordu. */
    .campus-wrapper {
        padding: 0 10px !important; /* Wrapper paddingini azalttık */
    }
    
    .campus-card {
        /* vw yerine % veya daha güvenli bir birim kullanıyoruz */
        flex: 0 0 85% !important; 
        width: 85% !important; 
        max-width: 350px !important; /* Tabletlerde devasa olmasın */
        margin-right: 15px; /* Kartlar arası boşluk */
    }

    /* Haber Kartları (H-Card) Düzeltmesi */
    .h-card {
        min-width: 100% !important; /* Mobilde tam genişlik */
        margin: 0 0 20px 0 !important; /* Altına boşluk bırak */
        width: 100% !important;
        box-sizing: border-box; /* Padding dahil hesapla */
    }
    
    .h-wrapper {
        display: block !important; /* Yan yana değil alt alta olsun (veya scroll kalsın istiyorsan flex bırak ama genişliği düzelt) */
        padding-bottom: 20px;
    }
    
    /* Eğer haberleri de sağa kaydırmalı istiyorsan h-wrapper display:flex kalsın, h-card width ayarını şuna çek: */
    /* .h-wrapper { display: flex !important; gap: 15px; padding-right: 20px; }
    .h-card { min-width: 85vw !important; width: 85vw !important; margin: 0 !important; }
    */

    /* Mobil Logo Alanı */
    .mobile-logo-link img {
        max-width: 80% !important; /* Logoyu ekrana sığdır */
        height: 70px !important;
    }
    
    /* CTA Bölümü Düzeltmesi */
    .cta-section-new {
        padding: 40px 5% !important; /* Yanlardan güvenli boşluk */
        overflow: hidden; /* Taşarsa gizle */
    }
}



/* --- MOBİL: HABER VE ETKİNLİK KARTLARINI YANA KAYDIRMALI (SWIPE) YAP --- */
@media (max-width: 768px) {

    /* Kapsayıcı Alan (Wrapper) Ayarları */
    .h-wrapper {
        display: flex !important;           /* Kartları yan yana dizer */
        flex-wrap: nowrap !important;       /* Asla alt satıra geçmelerine izin verme */
        overflow-x: auto !important;        /* Yatay kaydırmayı aktif et */
        gap: 20px;                          /* Kartlar arası boşluk */
        padding: 10px 20px 30px 20px !important; /* Sağdan soldan biraz boşluk bırak */
        
        /* Kaydırma Hissi (Snapping) */
        scroll-snap-type: x mandatory;      /* Kaydırıp bırakınca karta "yapışsın" */
        -webkit-overflow-scrolling: touch;  /* iPhone'larda yağ gibi kayması için */
    }

    /* Scroll çubuğunu gizle (Daha temiz görünüm için) */
    .h-wrapper::-webkit-scrollbar {
        display: none;
    }

    /* Kart (Item) Ayarları */
    .h-card {
        flex: 0 0 85% !important;           /* Kart ekranın %85'ini kaplasın (Böylece yandaki kartın ucu görünür) */
        width: 85% !important;
        margin: 0 !important;               /* Dış boşlukları sıfırla (gap kullanıyoruz) */
        scroll-snap-align: center;          /* Kart ekranda tam ortaya otursun */
    }
}

/* --- PERSONEL KARTLARI SABİT GENİŞLİK AYARI --- */

/* Kartların Kapsayıcısı (Grid Yapısı) */
.staff-grid {
    display: flex !important;
    flex-wrap: wrap !important;      /* Sığmayan aşağı geçsin */
    justify-content: center !important; /* Kartları sayfanın ortasında topla */
    gap: 25px !important;            /* Kartlar arası boşluk */
}

/* Kartın Kendisi */
.staff-card {
    width: 300px !important;        /* İstenilen SABİT genişlik */
    
    /* Mobilde ekran 300px'den küçükse taşmasın diye güvenlik önlemi: */
    max-width: 100% !important;     
    
    flex: 0 0 300px !important;     /* Kart ne uzasın ne kısalsın, 300px kalsın */
    margin-bottom: 20px;            /* Alt boşluk */
}

/* Mobilde (Telefonda) Kenar Boşluklarını Ayarla */
@media (max-width: 768px) {
    .staff-card {
        /* Mobilde de 300px kalmaya devam eder, ancak ekran çok darsa %90'a düşer */
        width: 300px !important;
        max-width: 90vw !important; /* Ekranın %90'ını geçmesin */
        margin-left: auto !important;
        margin-right: auto !important;
    }
}

@media (max-width: 768px) {
    .hero-slider .slide {
        background-position: center center !important; 
        /* Mobilde resmin tam ortasını alır. 
           Eğer mobilde resmin daha çok sol tarafı görünsün isterseniz 'left center', 
           sağ tarafı için 'right center' yapabilirsiniz. */
    }
    
    /* İsteğe bağlı: Mobilde slider yüksekliğini 100vh (tam ekran) yerine 
       biraz küçültebilirsiniz, böylece görsel daha az zoomlanır. */
    .hero-slider {
        height: 95vh; /* Mobilde yükseklik %80 olsun */
    }
}