* { 
    margin: 0; 
    padding: 0; 
    box-sizing: border-box; 
    font-family: 'Inter', sans-serif; 
}

body { 
    background: #fcfcfc; 
    color: #111; 
}

/* Hero Section */
.hero-sub { 
    padding: 120px 10% 40px; 
    text-align: center; 
    background: #fff; 
    border-bottom: 1px solid #eee; 
}

.hero-sub h1 { 
    font-size: 4rem; 
    font-weight: 900; 
    letter-spacing: -2px; 
    margin-bottom: 30px; 
}

.intro-text {
    max-width: 800px;
    margin: 20px auto 40px;
    font-size: 1.1rem;
    line-height: 1.8;
    color: #666;
    font-weight: 400;
}

/* Sekme Butonları */
.tab-container { 
    display: flex; 
    justify-content: center; 
    gap: 15px; 
}

.tab-btn {
    padding: 15px 35px; 
    border: 2px solid #111; 
    background: #fff;
    font-weight: 800; 
    cursor: pointer; 
    transition: 0.3s; 
    letter-spacing: 1px;
}

.tab-btn.active { 
    background: #111; 
    color: #fff; 
}

.tab-btn:hover { 
    background: #f39c12; 
    border-color: #f39c12; 
    color: #fff; 
}

/* Proje Kartları Grid */
.projects-grid {
    display: grid; 
    grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
    gap: 30px; 
    padding: 60px 8%;
}

.project-card { 
    background: #fff; 
    cursor: pointer; 
    transition: 0.4s cubic-bezier(0.165, 0.84, 0.44, 1); 
    box-shadow: 0 15px 35px rgba(0,0,0,0.05); 
    border-radius: 4px; 
    overflow: hidden;
}

.project-card:hover { 
    transform: translateY(-10px); 
    box-shadow: 0 30px 60px rgba(0,0,0,0.1); 
}

.project-card img { 
    width: 100%; 
    height: 280px; 
    object-fit: cover; 
}

.card-info { 
    padding: 25px; 
}

.card-info h3 { 
    font-size: 1.4rem; 
    font-weight: 800; 
    margin-bottom: 8px; 
}

.status-tag { 
    color: #f39c12; 
    font-size: 0.7rem; 
    font-weight: 900; 
    text-transform: uppercase; 
    letter-spacing: 2px; 
}

.status-tag-asansor {
    color: #2f44c8;
    font-size: 1,5rem;
    font-weight: 900;
    letter-spacing: 2px;
    font-family: 'Times New Roman', Times, serif;
    -webkit-text-stroke: 0.3px #2f44c8;
}

/* DETAY SAYFASI ÖZEL */
.project-detail-page { 
    display: none; 
    padding: 60px 8%; 
    background: #fff; 
    min-height: 100vh; 
}

.back-btn { 
    padding: 12px 25px; 
    background: #000; 
    color: #fff; 
    border: none; 
    cursor: pointer; 
    margin-bottom: 50px; 
    font-weight: bold; 
}

.detail-header-flex { 
    display: flex; 
    justify-content: space-between; 
    align-items: flex-end; 
    margin-bottom: 25px; 
    border-bottom: 4px solid #111; 
    padding-bottom: 15px; 
}

.detail-header-flex h2 { 
    font-size: 3.5rem; 
    font-weight: 900; 
    letter-spacing: -2px; 
}

.status-badge { 
    background: #f39c12; 
    color: #fff; 
    padding: 8px 15px; 
    font-size: 0.8rem; 
    font-weight: 900; 
}

/* Proje Künyesi (Meta Data) */
.project-meta-grid { 
    display: grid; 
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); 
    gap: 20px; 
    background: #f9f9f9; 
    padding: 30px; 
    margin-bottom: 40px; 
}

.meta-item strong { 
    display: block; 
    font-size: 0.7rem; 
    color: #888; 
    letter-spacing: 2px; 
    margin-bottom: 5px; 
}

.meta-item span { 
    font-size: 1.1rem; 
    font-weight: 800; 
    color: #111; 
}

/* Açıklama Metni */
.project-description { 
    margin-bottom: 50px; 
    max-width: 850px; 
}

.project-description h3 { 
    font-size: 1.8rem; 
    font-weight: 900; 
    margin-bottom: 20px; 
}

.project-description p { 
    font-size: 1.15rem; 
    line-height: 1.8; 
    color: #444; 
}

/* Fotoğraf Galerisi */
.gallery img { 
    width: 100%; 
    margin-bottom: 30px; 
    border-radius: 4px; 
    box-shadow: 0 20px 50px rgba(0,0,0,0.1); 
}

/* Asansör Kartları İçin Özel Renk */
.project-card.projeler .status-tag {
    color: #27ae60;
}

/* Mobil Uyumluluk */
@media (max-width: 768px) {
    .hero-sub h1 { font-size: 2.5rem; }
    .tab-container { flex-direction: column; }
    .detail-header-flex h2 { font-size: 2.2rem; }
    .detail-header-flex { 
        flex-direction: column; 
        align-items: flex-start; 
        gap: 10px; 
    }
    .project-meta-grid { grid-template-columns: 1fr 1fr; }
}