/* 
    İMZA GAYRİMENKUL - AKILLI AKIŞKAN TASARIM SİSTEMİ (Phase 7)
    Bu dosya, sitenin tüm cihazlarda matematiksel olarak kusursuz oranlanmasını sağlar.
*/

:root {
    /* Temel Parametreler */
    --fluid-min-width: 320;
    --fluid-max-width: 1600;
    --fluid-screen: 100vw;
    /* --- Global Content Constraints --- */
    --content-max-width: 1440px; /* Luxury Standard for 4K */

    /* Dinamik Tipografi (Clamp values) */
    /* Formül: clamp(min, preferred, max) */
    
    --text-fluid-xs: clamp(0.7rem, 0.65rem + 0.2vw, 0.85rem);
    --text-fluid-sm: clamp(0.8rem, 0.75rem + 0.3vw, 0.95rem);
    --text-fluid-base: clamp(0.95rem, 0.9rem + 0.25vw, 1.125rem);
    --text-fluid-lg: clamp(1.15rem, 1.05rem + 0.5vw, 1.5rem);
    --text-fluid-xl: clamp(1.3rem, 1.2rem + 0.6vw, 1.8rem);
    --text-fluid-2xl: clamp(1.6rem, 1.4rem + 1vw, 2.5rem);
    --text-fluid-3xl: clamp(2rem, 1.7rem + 1.5vw, 3.5rem);
    --text-fluid-4xl: clamp(2.5rem, 2.1rem + 2vw, 4.5rem);
    --text-fluid-5xl: clamp(3rem, 2.5rem + 3vw, 6rem);
    --text-fluid-9xl: clamp(3.5rem, 3rem + 5vw, 8.5rem); /* Hero Title */

    /* Dinamik Boşluklar (Spacing) */
    --space-fluid-xs: clamp(0.25rem, 0.2rem + 0.25vw, 0.5rem);
    --space-fluid-s: clamp(0.75rem, 0.6rem + 0.75vw, 1.5rem);
    --space-fluid-m: clamp(1.5rem, 1.2rem + 1.5vw, 3rem);
    --space-fluid-l: clamp(2.5rem, 2rem + 2.5vw, 5rem);
    --space-fluid-xl: clamp(4rem, 3.5rem + 4vw, 8rem);
    --space-fluid-screen: clamp(1.5rem, 1.2rem + 5vw, 4rem); /* Container side padding */

    /* Header & Layout */
    --header-height: clamp(5rem, 4rem + 2vh, 6rem);
}

/* 1600px Üstü İçin Sabitleme (Excessive scaling protection) */
@media screen and (min-width: 1600px) {
    :root {
        --fluid-screen: 1600px;
    }
}

/* Yatay Mobil (Landscape) Baskılama Kuralları */
/* Ekran çok basık olduğunda yazıların ekranı kaplamasını engeller */
@media (landscape) and (max-height: 500px) {
    :root {
        --text-fluid-base: 0.85rem;
        --text-fluid-lg: 1.1rem;
        --text-fluid-xl: 1.25rem;
        --text-fluid-2xl: 1.5rem;
        --text-fluid-3xl: 1.8rem;
        --text-fluid-4xl: 2.2rem;
        --text-fluid-5xl: 2.6rem;
        --text-fluid-9xl: 3rem;
        
        --space-fluid-m: 1rem;
        --space-fluid-l: 2rem;
        --space-fluid-xl: 3rem;
    }
}

/* Tailwind ile Entegrasyon Helper Sınıfları */
.text-fluid-xs { font-size: var(--text-fluid-xs); }
.text-fluid-sm { font-size: var(--text-fluid-sm); }
.text-fluid-base { font-size: var(--text-fluid-base); }
.text-fluid-lg { font-size: var(--text-fluid-lg); }
.text-fluid-xl { font-size: var(--text-fluid-xl); }
.text-fluid-2xl { font-size: var(--text-fluid-2xl); }
.text-fluid-3xl { font-size: var(--text-fluid-3xl); }
.text-fluid-4xl { font-size: var(--text-fluid-4xl); }
.text-fluid-5xl { font-size: var(--text-fluid-5xl); }
.text-fluid-9xl { font-size: var(--text-fluid-9xl); }

.gap-fluid-xs { gap: var(--space-fluid-xs); }
.gap-fluid-s { gap: var(--space-fluid-s); }
.gap-fluid-m { gap: var(--space-fluid-m); }
.gap-fluid-l { gap: var(--space-fluid-l); }
.gap-fluid-xl { gap: var(--space-fluid-xl); }

/* Padding Utilities */
.p-fluid-s { padding: var(--space-fluid-s); }
.p-fluid-m { padding: var(--space-fluid-m); }
.p-fluid-l { padding: var(--space-fluid-l); }
.px-fluid-screen { padding-left: var(--space-fluid-screen); padding-right: var(--space-fluid-screen); }
.px-fluid-m { padding-left: var(--space-fluid-m); padding-right: var(--space-fluid-m); }
.py-fluid-s { padding-top: var(--space-fluid-s); padding-bottom: var(--space-fluid-s); }
.py-fluid-m { padding-top: var(--space-fluid-m); padding-bottom: var(--space-fluid-m); }
.py-fluid-l { padding-top: var(--space-fluid-l); padding-bottom: var(--space-fluid-l); }
.py-fluid-xl { padding-top: var(--space-fluid-xl); padding-bottom: var(--space-fluid-xl); }

/* Layout Protection */
.pt-header { padding-top: var(--header-height) !important; }
.mt-header { margin-top: var(--header-height) !important; }

/* Margin Utilities */
.m-fluid-m { margin: var(--space-fluid-m); }
.my-fluid-m { margin-top: var(--space-fluid-m); margin-bottom: var(--space-fluid-m); }
.my-fluid-l { margin-top: var(--space-fluid-l); margin-bottom: var(--space-fluid-l); }
.mb-fluid-m { margin-bottom: var(--space-fluid-m); }
.mb-fluid-l { margin-bottom: var(--space-fluid-l); }

/* Border Radius */
.rounded-fluid { border-radius: clamp(0.5rem, 0.4rem + 0.5vw, 1.5rem); }

/* Global Mobil UX Stabilizasyonu (Safe Area & Tipografi Fix) */
@media screen and (max-width: 767px) {
    /* 1. Header Overlap Fix */
    .text-fluid-3xl, .text-fluid-4xl, .text-fluid-5xl, .text-fluid-9xl {
        line-height: 1.3 !important; /* leading-relaxed equivalent for wrapping headers */
        letter-spacing: normal !important; /* Normalize tracking-tighter on mobile */
    }

    /* 2. Bottom Nav Safe Area */
    .snap-section, .intro-screen, .mobile-safe-area {
        padding-bottom: 7rem !important; /* Clearance for floating Bottom Nav */
        height: auto !important;
        min-height: 100vh !important;
    }

    /* 3. Horizontal Jitter Protection */
    .main-wrapper, body {
        overflow-x: hidden !important;
        width: 100vw !important;
        position: relative !important;
    }
}

/* 4. Ultra-Small Mobile Specific (320px - 414px) */
@media screen and (max-width: 414px) {
    html body .snap-section, 
    html body .intro-screen, 
    html body .mobile-safe-area {
        padding-bottom: 11rem !important; /* Higher specificity and increased padding */
    }
}

/* 5. Luxury Layout Helpers */
.luxury-container {
    max-width: var(--content-max-width) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100%;
}

.header-nav-inner {
    max-width: var(--content-max-width);
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    padding-left: var(--space-fluid-screen);
    padding-right: var(--space-fluid-screen);
}