/* =====================================================================
   NIVALIS — MOBİL TASARIM  (yeniden tasarlandı, sıfırdan)
   Bu dosya index.html'de <link ... media="(max-width: 768px)"> ile
   yüklenir. Yani TÜM kurallar yalnızca <=768px ekranlarda geçerlidir.
   Desktop görünümü bu dosyadan KESİNLİKLE etkilenmez.
   styles.css içindeki eski mobil kuralları gerektiğinde !important ile
   ezilir; amaç tutarlı, modern ve şık tek bir mobil deneyim sunmaktır.
   ===================================================================== */

:root {
    --m-navy:      #0b1f3a;
    --m-navy-2:    #102b50;
    --m-blue:      #1e40af;
    --m-blue-2:    #3b82f6;
    --m-gold:      #f6b73c;
    --m-gold-2:    #fbbf24;
    --m-ink:       #0f172a;
    --m-muted:     #5b6b77;
    --m-card-shadow: 0 18px 40px -16px rgba(2, 8, 23, 0.28);
}

html { scroll-behavior: smooth; }

/* iOS'ta yatay taşmayı engelle */
body { overflow-x: hidden; }

/* =====================================================================
   1) AÇILIŞ EKRANI (LOADING)
   Loader stilleri artık paylaşımlı styles.css içinde (hem mobil hem
   desktopta gösterilir). Mobil için yalnızca <=480px boyut ayarı altta.
   ===================================================================== */

/* =====================================================================
   2) MARKA ŞERİDİ (MARQUEE)
   ===================================================================== */
.brand-marquee {
    display: block;
    overflow: hidden;
    padding: 0.7rem 0;
    background: linear-gradient(90deg, var(--m-navy) 0%, var(--m-navy-2) 50%, var(--m-navy) 100%);
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.brand-marquee .marquee-track {
    display: inline-flex;
    white-space: nowrap;
    will-change: transform;
    animation: marqueeScroll 24s linear infinite;
}
.brand-marquee span {
    color: #d4e4fb;
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.16em;
}
.brand-marquee b {
    color: var(--m-gold-2);
    font-style: normal;
    margin: 0 0.55em;
}
@keyframes marqueeScroll {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}

/* =====================================================================
   3) NAVBAR + MOBİL MENÜ
   ===================================================================== */
/* Sade, modern header — açık modda temiz beyaz */
.navbar {
    background: rgba(255, 255, 255, 0.96) !important;
    -webkit-backdrop-filter: saturate(140%) blur(20px);
    backdrop-filter: saturate(140%) blur(20px);
    box-shadow: 0 1px 0 rgba(15, 23, 42, 0.06) !important;
    border-bottom: none !important;
}
/* Sabit, dengeli yükseklikte header */
.nav-container {
    padding: 0 1rem !important;
    height: 64px !important;
    min-height: 64px;
    align-items: center !important;
}

/* Daha büyük logo, yazılar logoya yakın */
.nav-logo { gap: 0.2rem !important; transform: none !important; align-items: center !important; }
.logo-img  { width: 56px !important; height: 56px !important; transform: none !important; }
.logo-text { justify-content: center; gap: 1px; }
.logo-title { font-size: 1.2rem !important; font-weight: 700 !important; line-height: 1 !important; color: #0B4687 !important; }
.logo-subtitle { font-size: 0.5rem !important; font-weight: 600 !important; letter-spacing: 1px !important; color: #8595ad !important; }

/* Koyu mod uyumu — header artık tepki veriyor */
body.dark .navbar {
    background: rgba(9, 15, 28, 0.82) !important;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}
body.dark .logo-title { color: #e8f0fc !important; }
body.dark .logo-subtitle { color: #8aa0c0 !important; }

/* Tam ekran şık menü */
.nav-menu {
    background: linear-gradient(165deg, #0b1f3a 0%, #102b50 55%, #0b1f3a 100%) !important;
    backdrop-filter: none !important;
    gap: 1.4rem !important;
    padding-top: 96px !important;
}
.nav-link {
    color: #eaf2ff !important;
    font-size: 1.55rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.01em;
}
.nav-link::after {
    background: var(--m-gold-2) !important;
    height: 2px;
    bottom: -6px;
}
.nav-link:hover, .nav-link:active { color: var(--m-gold-2) !important; }

/* Menü açıldığında linkler kademeli belirsin */
.nav-menu.active .nav-link {
    animation: navLinkIn 0.5s cubic-bezier(0.2, 0.7, 0.2, 1) both;
}
.nav-menu.active li:nth-child(1) .nav-link { animation-delay: 0.06s; }
.nav-menu.active li:nth-child(2) .nav-link { animation-delay: 0.12s; }
.nav-menu.active li:nth-child(3) .nav-link { animation-delay: 0.18s; }
.nav-menu.active li:nth-child(4) .nav-link { animation-delay: 0.24s; }
@keyframes navLinkIn {
    from { opacity: 0; transform: translateY(14px); }
    to   { opacity: 1; transform: none; }
}

/* Menü hızlı aksiyon butonları (WhatsApp + Konum) */
.mobile-menu-actions {
    display: flex;
    gap: 0.7rem;
    width: 100%;
    max-width: 320px;
    margin: 1.6rem auto 0.4rem;
}
.mobile-action-btn {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.85rem 0.6rem;
    border-radius: 14px;
    font-size: 0.92rem;
    font-weight: 600;
    text-decoration: none;
    color: #ffffff;
    border: none;
    transition: transform 0.2s ease, filter 0.2s ease;
}
.mobile-action-btn i { font-size: 1.15rem; }
.mobile-action-btn:active { transform: scale(0.97); }
.mobile-action-whatsapp { background: #25D366; }
.mobile-action-location {
    background: linear-gradient(135deg, var(--primary-color), var(--primary-light));
}

/* Hamburger menü açıkken sağ alttaki floating butonlar gizlensin */
body.menu-open .floating-contact {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

/* Menü alt bilgi alanı (navy zemine uyumlu) */
.mobile-menu-footer { border-top-color: rgba(255, 255, 255, 0.12) !important; }
.mobile-footer-info p { color: #b9cdec !important; }
.mobile-footer-info p:first-child { color: #ffffff !important; }
.mobile-footer-social a {
    background: rgba(255, 255, 255, 0.1) !important;
    border: 1px solid rgba(255, 255, 255, 0.18);
}
.mobile-footer-social a:hover { background: var(--m-gold) !important; color: var(--m-navy) !important; }

/* Menü en altı: telif satırı (footer ile aynı) */
.mobile-footer-copyright {
    margin: 1.4rem 0 0 !important;
    font-size: 0.72rem !important;
    color: rgba(207, 224, 247, 0.65) !important;
    letter-spacing: 0.02em;
}

/* Hamburger çubukları her zaman görünür */
.hamburger .bar { background: var(--m-ink) !important; }

/* =====================================================================
   4) HERO + CAROUSEL  (sıfırdan: full-bleed, overlay metin, soft gölge)
   ===================================================================== */
.hero {
    min-height: auto !important;
    padding: 5.5rem 1rem 2.25rem !important;
    background:
        radial-gradient(130% 80% at 50% -10%, rgba(59, 130, 246, 0.30), transparent 60%),
        linear-gradient(180deg, #0b1f3a 0%, #102b50 58%, #0b1f3a 100%) !important;
}
.hero-header {
    max-width: 560px !important;
    margin: 0 auto 1.25rem !important;
    padding: 0 0.25rem !important;
}
.hero-title {
    font-size: 2rem !important;
    line-height: 1.18 !important;
    margin-bottom: 0.55rem !important;
    color: #ffffff !important;
    background: none !important;
    -webkit-text-fill-color: #ffffff !important;
    -webkit-background-clip: unset !important;
    background-clip: unset !important;
}
.hero-subtitle {
    font-size: 1rem !important;
    line-height: 1.5 !important;
    color: #bcd2f0 !important;
    margin-bottom: 0 !important;
}

/* Carousel kabuğu: tek kart görünür, kenarlarda hafif çerçeve boşluğu */
.hero-visual {
    min-height: 0 !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
}
.carousel-container {
    position: relative !important;
    height: auto !important;
    max-width: 460px !important;
    margin: 0.25rem auto 0 !important;
    padding: 0 6px !important;
    overflow: hidden !important;
    perspective: none !important;
    display: block !important;
    z-index: 1 !important;
}
.carousel-track {
    position: relative !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
    height: auto !important;
    align-items: stretch !important;
    transform: translateX(0);
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
    transform-style: flat !important;
    will-change: transform;
}

/* Her kart = bir tam slayt. Eski 3D / gizleme kuralları !important ile ezilir. */
.carousel-card,
.carousel-card:not(:first-child),
.carousel-card:nth-child(1),
.carousel-card:nth-child(2),
.carousel-card:nth-child(3),
.carousel-card:nth-child(4),
.carousel-card:nth-child(5),
.carousel-card:nth-child(6),
.carousel-card:nth-child(7),
.carousel-card:nth-child(8),
.carousel-card:nth-child(9),
.carousel-card:nth-child(10),
.carousel-card:nth-child(11),
.carousel-card:nth-child(12) {
    position: relative !important;
    display: block !important;
    flex: 0 0 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 430px !important;
    left: auto !important;
    top: auto !important;
    margin: 0 !important;
    margin-left: 0 !important;
    margin-top: 0 !important;
    transform: none !important;
    opacity: 1 !important;
    z-index: 1 !important;
    border-radius: 26px !important;
    overflow: hidden !important;
    background: #0b1f3a !important;
    border: 1px solid rgba(255, 255, 255, 0.10) !important;
    backdrop-filter: none !important;
    box-shadow:
        0 26px 50px -18px rgba(3, 10, 28, 0.85),
        0 10px 24px -14px rgba(3, 10, 28, 0.6) !important;
    transition: transform 0.4s ease, box-shadow 0.4s ease !important;
}
/* Dokunmatikte yapışan :hover efektlerini tamamen nötrle —
   ilk/aktif kart "hoverlanmış gibi" büyük/parlak görünmesin, diğerleri sönmesin */
.carousel-card:hover,
.carousel-card.active,
.carousel-container:hover .carousel-card,
.carousel-container:hover .carousel-card:not(:hover),
.carousel-card:hover ~ .carousel-card {
    transform: none !important;
    opacity: 1 !important;
    z-index: 1 !important;
    pointer-events: auto !important;
    background: #0b1f3a !important;
    box-shadow:
        0 26px 50px -18px rgba(3, 10, 28, 0.85),
        0 10px 24px -14px rgba(3, 10, 28, 0.6) !important;
}
.carousel-card:hover .carousel-card-image img { transform: none !important; }

/* Görsel tüm kartı kaplar */
.carousel-card .carousel-card-image {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    border-radius: 26px !important;
    background: #0b1f3a !important;
}
.carousel-card .carousel-card-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    transform: none !important;
}

/* Alt karartma katmanı (metin okunabilirliği) */
.carousel-card::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
    border-radius: 26px;
    background: linear-gradient(
        180deg,
        rgba(4, 12, 30, 0) 36%,
        rgba(4, 12, 30, 0.55) 66%,
        rgba(4, 12, 30, 0.92) 100%);
    pointer-events: none;
}

/* Kart içeriği: görselin üstünde, alt hizalı */
.carousel-card .carousel-card-content {
    position: absolute !important;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    padding: 1.15rem 1.25rem 1.3rem !important;
    text-align: left !important;
    color: #ffffff !important;
}
.carousel-card-title {
    font-size: 1.18rem !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    margin-bottom: 0.35rem !important;
    color: #ffffff !important;
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.45);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.carousel-card-price {
    font-size: 1.5rem !important;
    font-weight: 800 !important;
    color: var(--m-gold-2) !important;
    margin-bottom: 0.35rem !important;
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.4);
}
.carousel-card-location {
    font-size: 0.85rem !important;
    color: #dce8fb !important;
    opacity: 0.95;
}
.carousel-card-location i { color: var(--m-gold-2) !important; }

/* Göstergeler: aktif = parlak altın pill (sönük DEĞİL) */
.carousel-indicators {
    display: flex !important;
    justify-content: center;
    align-items: center;
    gap: 0.45rem !important;
    margin-top: 1.1rem !important;
    padding: 0 !important;
    order: 3;
    height: auto !important;
}
.carousel-indicator {
    width: 8px !important;
    height: 8px !important;
    border-radius: 99px !important;
    background: rgba(255, 255, 255, 0.30) !important;
    border: none !important;
    cursor: pointer;
    transition: width 0.35s ease, background 0.35s ease, box-shadow 0.35s ease !important;
}
.carousel-indicator.active {
    width: 26px !important;
    background: var(--m-gold-2) !important;
    transform: none !important;
    box-shadow: 0 0 12px rgba(251, 191, 36, 0.65) !important;
}

/* Arama kutusu: navy hero üzerinde yüzen pill */
.hero-search {
    margin-top: 0.6rem !important;     /* yukarı çek, alt başlığa yaklaştır */
    margin-bottom: 1.6rem !important;  /* carousel'den net boşluk bırak */
    width: 100%;
    padding: 0 0.25rem;
}
.search-box {
    margin: 0 auto !important;
    max-width: 360px;                  /* daha küçük, kompakt */
    display: flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.3rem 0.3rem 0.3rem 0.95rem !important;
    background: rgba(255, 255, 255, 0.97) !important;
    border-radius: 99px !important;
    box-shadow: 0 12px 28px -14px rgba(3, 10, 28, 0.55) !important;
}
.search-box input {
    flex: 1;
    min-width: 0;
    background: transparent !important;
    border: none !important;
    padding: 0.6rem 0.25rem !important;
    font-size: 16px !important; /* iOS zoom engeli */
    color: var(--m-ink) !important;
}
.search-box input::placeholder {
    color: #94a3b8 !important;
    opacity: 1 !important;
}
.search-btn {
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    min-width: 40px;
    min-height: 40px;
    padding: 0 !important;
    border-radius: 99px !important;
    background: linear-gradient(135deg, var(--m-blue), var(--m-blue-2)) !important;
    color: #fff;
    font-size: 0.9rem;
    box-shadow: 0 6px 16px -6px rgba(30, 64, 175, 0.6);
}

/* =====================================================================
   5) İLANLAR (PROPERTIES)
   ===================================================================== */
.properties { padding: 2.75rem 0 2.75rem !important; }

.section-header { margin-bottom: 1.75rem !important; padding: 0 1.1rem !important; }
.section-header h2 { font-size: 1.85rem !important; line-height: 1.2 !important; }
.section-header p  { font-size: 0.98rem !important; }

/* Filtreler: yatay kaydırılabilir pill şeridi */
.property-filters {
    display: flex !important;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    gap: 0.55rem !important;
    /* Yatay kaydırma dikey kırpma getirir; gölgeye yer açacak iç boşluk */
    padding: 0.55rem 1.1rem 1.05rem !important;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
}
.property-filters::-webkit-scrollbar { display: none; }
.filter-btn {
    flex: 0 0 auto;
    scroll-snap-align: start;
    min-height: 42px;
    padding: 0.6rem 1.15rem !important;
    font-size: 0.92rem !important;
    border-radius: 99px !important;
}
/* Aktif/hover: sıçramayı kaldır, gölgeyi yumuşak ve konteyner içinde tut
   (keskin kırpılma gider) */
.property-filters .filter-btn.active,
.property-filters .filter-btn:hover {
    transform: none !important;
    box-shadow: 0 4px 12px -4px rgba(30, 64, 175, 0.45) !important;
}

/* Tek sütun, tam genişlik modern kartlar */
.properties-grid {
    grid-template-columns: 1fr !important;
    gap: 1.25rem !important;
    padding: 0 1.1rem !important;
}
.property-card {
    max-width: none !important;
    margin: 0 !important;
    border-radius: 22px !important;
    overflow: hidden;
    box-shadow: var(--m-card-shadow) !important;
    animation: cardIn 0.55s cubic-bezier(0.2, 0.7, 0.2, 1) both;
}
@keyframes cardIn {
    from { opacity: 0; transform: translateY(18px); }
    to   { opacity: 1; transform: none; }
}
.property-image { height: 212px !important; }
.property-badge {
    background: rgba(11, 31, 58, 0.88) !important;
    backdrop-filter: blur(6px);
    border-radius: 99px !important;
    padding: 0.32rem 0.8rem !important;
    font-size: 0.72rem !important;
    letter-spacing: 0.02em;
}
.property-content { padding: 1.05rem 1.15rem 1.2rem !important; }
.property-title { font-size: 1.18rem !important; margin-bottom: 0.35rem !important; line-height: 1.3; }
.property-price {
    font-size: 1.38rem !important;
    font-weight: 800 !important;
    color: var(--m-blue) !important;
    margin-bottom: 0.6rem !important;
}
.property-details {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem 0.9rem !important;
    margin-bottom: 0.55rem !important;
    font-size: 0.88rem !important;
}
.property-location { font-size: 0.85rem !important; margin-bottom: 0.4rem; }
.property-description {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    max-height: 3.1em;
    font-size: 0.9rem !important;
    margin-top: 0.4rem !important;
}

/* =====================================================================
   6) HAKKIMIZDA / İLETİŞİM / FOOTER
   ===================================================================== */
.about, .contact { padding: 2.75rem 0 !important; }

.about-content, .contact-content {
    grid-template-columns: 1fr !important;
    gap: 2rem !important;
}
.about-image img { border-radius: 20px !important; }

/* Hakkında metni: sola hizalı + yazılan satır araları/boşluklar korunsun */
.about-text p {
    text-align: left !important;
    white-space: pre-line !important;
    line-height: 1.7 !important;
}

.features { gap: 1rem !important; }
.feature {
    background: var(--background-secondary);
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 16px;
    padding: 1.1rem 1.15rem !important;
    /* ikon + başlık + açıklamayı dikey istifle, sola hizala */
    flex-direction: column !important;
    align-items: flex-start !important;
    text-align: left !important;
    gap: 0.45rem !important;
}
.feature i {
    margin: 0 0 0.15rem 0 !important;
}
.feature h3 { margin-bottom: 0 !important; }
.feature p { margin: 0 !important; }
body.dark .feature {
    background: rgba(255, 255, 255, 0.03);
    border-color: rgba(255, 255, 255, 0.08);
}

/* İletişim: bölüm zemini mavi → kartlar cam efektli, metinler beyaz/okunur */
.contact-info { display: flex; flex-direction: column; gap: 0.9rem; }
.contact-item {
    background: rgba(255, 255, 255, 0.10) !important;
    border: 1px solid rgba(255, 255, 255, 0.18) !important;
    border-radius: 16px;
    padding: 1rem 1.1rem !important;
    margin-bottom: 0 !important;
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
}
.contact-item h3 { color: #ffffff !important; }
.contact-item p { color: rgba(255, 255, 255, 0.92) !important; }

.contact-form {
    background: rgba(255, 255, 255, 0.10) !important;
    border: 1px solid rgba(255, 255, 255, 0.20) !important;
    border-radius: 20px;
    padding: 1.4rem !important;
}
.form-group input, .form-group textarea {
    border-radius: 12px !important;
    font-size: 16px !important; /* iOS zoom engeli */
}
.submit-btn { border-radius: 12px !important; }

.footer { padding: 2.75rem 0 1.5rem !important; }
.footer-content { gap: 2rem !important; }
.newsletter-form input { border-radius: 99px 0 0 99px !important; }
.newsletter-form button { border-radius: 0 99px 99px 0 !important; }

/* =====================================================================
   7) SCROLL REVEAL (mobile.js tarafından sınıf eklenir)
   ===================================================================== */
.reveal-up {
    opacity: 0;
    transform: translateY(26px);
    transition: opacity 0.6s ease, transform 0.6s cubic-bezier(0.2, 0.7, 0.2, 1);
}
.reveal-up.reveal-in {
    opacity: 1;
    transform: none;
}

/* =====================================================================
   8) UI KONTROLLER (tema + dil + hamburger) — 64px header ile hizalı.
      Çerçevesiz, dolgusuz, sade & modern ikonlar.
   ===================================================================== */
.ui-controls {
    top: 14px !important;          /* (64 - 36) / 2 = 14 → header ortası */
    right: 54px !important;        /* hamburgerin soluna yerleş */
    left: auto !important;
    gap: 10px !important;
    align-items: center !important;
}

/* Tema düğmesi — sadece ikon, çerçevesiz */
.theme-toggle {
    width: 36px !important;
    height: 36px !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
}
.theme-toggle i { color: #1e293b !important; font-size: 1.2rem !important; }
.theme-toggle:hover, .theme-toggle:active { background: transparent !important; }

/* Dil seçici — çerçevesiz, temiz */
.language-selector {
    height: 36px !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    transform: none !important;
}
.language-current {
    height: 36px !important;
    padding: 0 !important;
    gap: 0.4rem !important;
}
.language-current:hover { background: transparent !important; }
.language-current img { width: 22px !important; height: 16px !important; border-radius: 3px !important; box-shadow: 0 1px 3px rgba(2, 8, 23, 0.18); }
.language-current span { font-size: 0.9rem !important; font-weight: 600 !important; color: #1e293b !important; }
.language-current i { font-size: 0.68rem !important; color: #64748b !important; }

/* Hamburger — çerçevesiz, ince modern çubuklar */
.hamburger {
    position: relative;
    z-index: 1002;
    width: 30px !important;
    height: 36px !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    gap: 5px;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
}
.hamburger .bar {
    width: 24px !important;
    height: 2px !important;
    margin: 0 !important;
    border-radius: 2px;
    background: #1e293b !important;
    transition: all 0.3s ease;
}
.hamburger.active .bar { width: 24px !important; }
.hamburger.active .bar:nth-child(1) { transform: translateY(7px) rotate(45deg) !important; background: #ffffff !important; }
.hamburger.active .bar:nth-child(2) { opacity: 0 !important; }
.hamburger.active .bar:nth-child(3) { transform: translateY(-7px) rotate(-45deg) !important; background: #ffffff !important; }

/* Koyu mod: ikon/yazı renkleri (çerçeve yok) */
body.dark .theme-toggle i { color: #e2e8f0 !important; }
body.dark .language-current span { color: #e8f0fc !important; }
body.dark .language-current i { color: #94a3b8 !important; }
body.dark .hamburger .bar { background: #e2e8f0 !important; }

/* Menü açıkken (zemin daima koyu navy): kontroller açık renge dönsün
   — açık temada bile görünür olsun (tema seçici siyah kalmasın) */
body.menu-open .theme-toggle i { color: #ffffff !important; }
body.menu-open .language-current span { color: #ffffff !important; }
body.menu-open .language-current i { color: rgba(255, 255, 255, 0.7) !important; }

/* =====================================================================
   9) ÇOK KÜÇÜK EKRANLAR (<=480px)
   ===================================================================== */
@media (max-width: 480px) {
    /* Header: dar ekranlarda biraz daha kompakt */
    .logo-img { width: 46px !important; height: 46px !important; }
    .logo-title { font-size: 1.02rem !important; }
    .logo-subtitle { font-size: 0.46rem !important; }
    .ui-controls { right: 56px !important; gap: 6px !important; }
    .language-current { padding: 0 0.45rem !important; }

    .hero { padding: 5rem 0.9rem 2rem !important; }
    .hero-title { font-size: 1.72rem !important; }
    .hero-subtitle { font-size: 0.95rem !important; }

    /* nth-child(n) → her kartı eşit özgüllükle hedefler; ilk kart da 400px olur
       (aksi halde ana bloktaki :nth-child(1) ilk kartı 430px'te tutuyordu) */
    .carousel-card:nth-child(n) { height: 400px !important; border-radius: 22px !important; }
    .carousel-card:nth-child(n) .carousel-card-image,
    .carousel-card:nth-child(n)::after { border-radius: 22px !important; }
    .carousel-card-title { font-size: 1.08rem !important; }
    .carousel-card-price { font-size: 1.35rem !important; }

    .section-header h2 { font-size: 1.65rem !important; }
    .property-image { height: 188px !important; }
    .property-title { font-size: 1.1rem !important; }
    .property-price { font-size: 1.28rem !important; }

    .loader-logo { width: 84px; height: 84px; }
    .loader-title { font-size: 1.5rem; }
}