/* ═══════════════════════════════════════════════════════════════
   PAGES — sayfaya özel bloklar. Tümü components.css'teki kart /
   buton / rozet temellerinin üzerine kurulur.
   ═══════════════════════════════════════════════════════════════ */

/* ─────────────── Hizmetler ─────────────── */
.services-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: var(--gap-grid);
}
.service-card { padding: clamp(30px, 3vw, 44px); display: flex; flex-direction: column; }
.service-card h3 { margin-bottom: var(--space-3); }
.service-card p  { font-size: var(--fs-body-sm); }

/* ─────────────── Proje kartları (anasayfa + liste) ─────────────── */
/* Sütun sayısı SABİT. `auto-fit` az kart olduğunda kalan alanı bölüştürüp
   kartları 670px'e kadar şişiriyordu; kapak oranı bozuluyor, bölüm dağınık
   görünüyordu. Az kart hâlleri aşağıda ayrıca ortalanır.                    */
.pg-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--gap-grid);
}
@media (min-width: 1101px) {
    /* Tam 2 kart → iki sütun, ortalı; sağda boş sütun kalmaz */
    .pg-grid:has(> .pg-card:nth-child(2):last-child) {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        max-width: 920px; margin-inline: auto;
    }
    /* Tek kart → ölçüsünde kalsın, satırı kaplamasın */
    .pg-grid:has(> .pg-card:only-child) {
        grid-template-columns: minmax(0, 440px);
        justify-content: center;
    }
}
@media (max-width: 1100px) { .pg-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 681px) and (max-width: 1100px) {
    /* İki sütunlu aralıkta tek kalan son kart sola yapışmasın, ortalansın */
    .pg-grid > .pg-card:last-child:nth-child(odd) {
        grid-column: 1 / -1;
        /* justify-self tek başına kartı içeriğine göre büzüyor; genişliği
           diğer kartlarla aynı tutmak için width:100% + max-width birlikte. */
        width: 100%;
        max-width: calc(50% - var(--gap-grid) / 2);
        justify-self: center;
    }
}
@media (max-width: 680px)  { .pg-grid { grid-template-columns: minmax(0, 1fr); } }
.pg-card {
    position: relative;
    display: flex; flex-direction: column;
    border-radius: var(--r-card);
    overflow: hidden;
    background: var(--card);
    border: 1px solid var(--border);
    box-shadow: var(--shadow-sm);
    transition: transform var(--t), box-shadow var(--t), border-color var(--t);
}
.pg-card:hover { transform: translateY(-6px); box-shadow: var(--shadow); border-color: var(--border-strong); }

.pg-img-wrap {
    position: relative;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border-radius: var(--r-card) var(--r-card) 0 0;
}
.pg-img {
    width: 100%; height: 100%; object-fit: cover;
    transition: transform var(--t-slow);
}
.pg-card:hover .pg-img { transform: scale(1.05); }
.pg-placeholder {
    width: 100%; height: 100%;
    display: flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, var(--surface), var(--card));
    color: var(--text-3); font-size: 2.6rem;
}

/* Başlık EN FAZLA 2 satır, konum EN FAZLA 1 satır — uzun içerikte kart
   yüksekliği kaçmasın, metin kutudan taşmasın (üç nokta ile kesilir). */
.pg-title {
    font-size: 22px;
    display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;
    overflow: hidden;
    overflow-wrap: anywhere;   /* tek kelimelik uzun dize kartı zorlamasın */
}
.pg-meta {
    /* text-overflow flex ÖĞESİNDE çalışmaz → blok + nowrap + ellipsis. */
    display: block; max-width: 100%;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    font-size: var(--fs-small); color: var(--text-2); margin: 0;
}
.pg-meta i { color: var(--primary); font-size: .8rem; margin-right: 8px; }
.pg-sep { color: var(--text-3); margin: 0 6px; }

/* Görsel üstü hover overlay — sayfa açık olsa da görselin üstü koyudur. */
.pg-overlay {
    position: absolute; inset: 0; z-index: 1;
    display: flex; align-items: center; justify-content: center;
    background: rgba(var(--dark-rgb), .48);
    opacity: 0; transition: opacity var(--t);
}
.pg-card:hover .pg-overlay { opacity: 1; }
.pg-overlay-cta {
    display: inline-flex; align-items: center; gap: var(--space-2);
    padding: 0 var(--control-px); height: var(--control-h-sm);
    border-radius: var(--r-pill);
    background: var(--glass-bg-2); color: var(--dark);
    font-weight: 700; font-size: var(--fs-small);
    transform: translateY(8px); transition: transform var(--t);
}
.pg-card:hover .pg-overlay-cta { transform: none; }

.project-share {
    position: absolute; top: 16px; right: 16px; z-index: 3;
    width: 42px; height: 42px; border-radius: var(--r-pill);
    display: flex; align-items: center; justify-content: center;
    background: rgba(var(--dark-rgb), .62);
    backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur);
    border: 1px solid var(--glass-border);
    color: var(--text); font-size: .85rem;
    opacity: 0; transform: scale(.85);
    transition: all var(--t);
}
.pg-card:hover .project-share { opacity: 1; transform: none; }
.project-share:hover { background: var(--primary); color: var(--on-primary); border-color: transparent; }

.pg-empty-state, .ilan-gallery-empty, .gv-empty-tab {
    text-align: center; padding: clamp(56px, 7vw, 96px) var(--space-5);
    border: 1px dashed var(--border-strong);
    border-radius: var(--r-card);
    color: var(--text-3);
}
.pg-empty-state i { font-size: 2.4rem; margin-bottom: var(--space-4); display: block; color: var(--text-3); }

/* ═══════════════ PROJE DETAY ═══════════════
   Akış: Hero (koyu ada) → 2 kolon (içerik + sticky künye) → Süreç şeridi →
   CTA bandı → Diğer projeler → Önceki/Sonraki.
   Sayfa az veriyle de dolu durmalı: projelerin çoğunda tek kapak görseli,
   dosya/karşılaştırma yok. Boş bölümler PHP tarafında hiç basılmaz.        */
/* Footer'ın kendi üst boşluğu (115px) var; burada fazlası çukur yaratıyordu. */
.proj-page-wrap { padding-bottom: var(--space-6); }

/* ── Hero ─────────────────────────────────────────────────────────── */
.proj-hero {
    position: relative;
    min-height: min(82vh, 760px);
    display: flex; align-items: flex-end;
    padding: calc(var(--nav-h) + var(--space-8)) 0 clamp(44px, 5vw, 80px);
    overflow: hidden;
    background: var(--dark);
    border-radius: 0 0 var(--r-section) var(--r-section);
}
.proj-hero-media { position: absolute; inset: 0; }
.proj-hero-media img, .proj-hero-img {
    width: 100%; height: 100%; object-fit: cover;
    transform: scale(1.03);
}
/* Metnin altı her görselde okunur olsun: üstte hafif, altta güçlü perde. */
.proj-hero-overlay {
    position: absolute; inset: 0;
    background:
        linear-gradient(180deg, rgba(var(--dark-rgb), .62) 0%, rgba(var(--dark-rgb), .06) 38%, rgba(var(--dark-rgb), .90) 100%),
        linear-gradient(90deg, rgba(var(--dark-rgb), .60) 0%, transparent 58%);
}
.proj-hero-inner { position: relative; z-index: 2; }

.proj-breadcrumb {
    display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
    font-size: var(--fs-small); color: var(--text-2);
    margin-bottom: var(--space-5);
}
.proj-breadcrumb a:hover { color: var(--primary); }
.proj-breadcrumb i { font-size: .6rem; opacity: .6; }
.proj-breadcrumb span { color: var(--text); }

.proj-meta-row { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: var(--space-4); }
.proj-title { font-size: var(--fs-hero); line-height: var(--lh-tight); max-width: 18ch; }
.proj-subtitle {
    display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-5);
    font-size: var(--fs-body); color: var(--text-2);
    margin-top: var(--space-4);
}
.proj-subtitle span { display: inline-flex; align-items: center; gap: 8px; }
.proj-subtitle i { color: var(--primary); font-size: .85rem; }

.proj-hero-facts {
    display: flex; flex-wrap: wrap; gap: var(--space-3);
    margin-top: var(--space-6);
}
.proj-hero-facts li {
    display: grid; gap: 2px;
    padding: 14px 26px; border-radius: var(--r-sm);
    background: var(--glass-bg); border: 1px solid var(--glass-border);
    backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur);
}
.proj-hero-facts strong { font-size: 24px; line-height: 1.1; letter-spacing: var(--ls-tight); }
.proj-hero-facts span { font-size: var(--fs-eyebrow); color: var(--text-3); letter-spacing: var(--ls-eyebrow); text-transform: uppercase; }

/* ── 2 kolon ──────────────────────────────────────────────────────── */
.proj-layout {
    display: grid; grid-template-columns: minmax(0, 1fr) 380px;
    gap: clamp(32px, 4vw, 72px);
    padding-top: clamp(48px, 5vw, 88px);
    align-items: start;
}
.proj-main { min-width: 0; display: grid; gap: clamp(48px, 6vw, 96px); align-content: start; }
.proj-aside { position: sticky; top: calc(var(--nav-h) + var(--space-5)); min-width: 0; }
.proj-section-title { font-size: clamp(26px, 2.6vw, 38px); margin-bottom: var(--space-5); }
.overline + .proj-section-title { margin-top: var(--space-2); }
.proj-desc-text {
    font-size: var(--fs-body); color: var(--text-2);
    line-height: var(--lh-body); max-width: 68ch;
}

/* ── Künye kartı ──────────────────────────────────────────────────── */
.proj-info-card { padding: var(--card-pad); display: grid; gap: var(--space-5); }
.proj-info-label {
    font-size: var(--fs-eyebrow); color: var(--text-3);
    letter-spacing: var(--ls-eyebrow); text-transform: uppercase; margin: 0;
}
.proj-stat-badges { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.proj-stat-badge {
    flex: 1 1 96px; min-width: 0;
    display: grid; justify-items: center; gap: 2px;
    padding: var(--space-4) var(--space-3); border-radius: var(--r-sm);
    background: var(--surface); border: 1px solid var(--border);
    transition: transform var(--t), border-color var(--t);
}
.proj-stat-badge:hover { transform: translateY(-3px); border-color: var(--border-strong); }
.proj-stat-badge i { color: var(--primary-ink); font-size: .9rem; margin-bottom: 4px; }
.psb-val { font-size: 22px; font-weight: 800; letter-spacing: var(--ls-tight); }
.psb-lbl { font-size: var(--fs-eyebrow); color: var(--text-3); letter-spacing: .06em; text-transform: uppercase; }

.proj-info-list { display: grid; gap: 0; }
.proj-info-list li {
    display: flex; align-items: baseline; justify-content: space-between;
    gap: var(--space-4); min-width: 0;
    padding: 14px 0; border-bottom: 1px solid var(--border);
}
.proj-info-list li:last-child { border-bottom: 0; padding-bottom: 0; }
.pil-key {
    display: inline-flex; align-items: center; gap: 10px; flex: 0 0 auto;
    font-size: var(--fs-small); color: var(--text-2);
}
.pil-key i { color: var(--primary-ink); font-size: .8rem; width: 14px; text-align: center; }
.pil-val { min-width: 0; text-align: right; font-weight: 700; font-size: var(--fs-body-sm); overflow-wrap: anywhere; }

.proj-info-btns { display: grid; gap: 10px; }
.proj-contact-btn, .proj-contact-wa, .proj-contact-mail, .ilan-call-btn, .ilan-wa-btn, .contact-wa-btn, .arsa-cta-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 10px;
    min-height: var(--control-h); padding: 0 var(--control-px);
    border-radius: var(--r-pill);
    font-size: var(--fs-body-sm); font-weight: 700;
    transition: all var(--t);
}
.proj-contact-btn, .ilan-call-btn { background: var(--primary); color: var(--on-primary); box-shadow: var(--shadow-gold); }
.proj-contact-btn:hover, .ilan-call-btn:hover { background: var(--accent); transform: translateY(-3px); box-shadow: var(--shadow-gold-lg); }
.proj-contact-wa, .ilan-wa-btn, .contact-wa-btn { background: #25D366; color: #fff; }
.proj-contact-wa:hover, .ilan-wa-btn:hover, .contact-wa-btn:hover { transform: translateY(-3px); box-shadow: 0 16px 40px rgba(37,211,102,.42); }
.proj-contact-mail { background: var(--surface); border: 1px solid var(--border); color: var(--text); }
.proj-contact-mail:hover { background: var(--card); border-color: var(--border-strong); transform: translateY(-3px); }
.proj-info-foot {
    display: flex; align-items: center; gap: 8px;
    font-size: var(--fs-small); color: var(--text-3); margin: 0;
}
.proj-info-foot i { color: var(--primary-ink); }

/* ── Süreç şeridi (status'tan türer) ──────────────────────────────── */
.proj-phase { margin-top: clamp(48px, 5vw, 88px); }
.phase-track {
    list-style: none;   /* ol: tarayıcı numarasını basmasın, .phase-num var */
    display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--gap-grid);
}
.phase-step {
    position: relative; min-width: 0;
    padding: var(--card-pad);
    border-radius: var(--r-card);
    background: var(--card); border: 1px solid var(--border);
    box-shadow: var(--shadow-sm);
    transition: transform var(--t), border-color var(--t), box-shadow var(--t);
}
.phase-step:hover { transform: translateY(-4px); border-color: var(--border-strong); box-shadow: var(--shadow); }
.phase-dot {
    display: inline-flex; align-items: center; justify-content: center;
    width: 48px; height: 48px; border-radius: var(--r-pill);
    background: var(--surface); color: var(--text-3);
    margin-bottom: var(--space-4);
    transition: background var(--t), color var(--t);
}
.phase-num {
    position: absolute; top: var(--card-pad); right: var(--card-pad);
    font-size: var(--fs-eyebrow); font-weight: 800;
    letter-spacing: var(--ls-eyebrow); color: var(--text-3);
}
.phase-step h3 { font-size: var(--fs-h4); margin-bottom: 6px; }
.phase-step p  { font-size: var(--fs-small); color: var(--text-2); margin: 0; }
.phase-step.is-done .phase-dot   { background: rgba(var(--primary-rgb), .16); color: var(--primary-ink); }
.phase-step.is-active {
    background: var(--dark); border-color: transparent; box-shadow: var(--shadow);
}
.phase-step.is-active h3 { color: var(--on-dark); }
.phase-step.is-active p  { color: var(--on-dark-2); }
.phase-step.is-active .phase-num { color: var(--primary); }
.phase-step.is-active .phase-dot { background: var(--primary); color: var(--on-primary); }
@media (max-width: 860px) { .phase-track { grid-template-columns: 1fr; } }

/* ── CTA bandı ────────────────────────────────────────────────────── */
.proj-cta-band, .pcb-band, .arsa-cta-band {
    position: relative;
    margin: var(--section-y) var(--container-pad) 0;
    padding: clamp(44px, 5vw, 76px) clamp(28px, 4vw, 64px);
    border-radius: var(--r-section);
    background:
        radial-gradient(90% 140% at 100% 0%, rgba(var(--primary-rgb), .18), transparent 60%),
        var(--surface);
    border: 1px solid var(--border);
    overflow: hidden;
}
/* Bu bant .container İÇİNDE duruyor; yatay kenar boşluğunu container verir. */
.proj-cta-band {
    margin: clamp(56px, 6vw, 104px) 0 0;
    display: flex; align-items: center; justify-content: space-between;
    gap: var(--space-6); flex-wrap: wrap;
}
.arsa-cta-inner, .pcb-band {
    display: flex; align-items: center; justify-content: space-between;
    gap: var(--space-6); flex-wrap: wrap;
}
.arsa-cta-text, .pcb-text, .proj-cta-text { flex: 1 1 420px; min-width: 0; }
.arsa-cta-text h2, .pcb-text h2, .proj-cta-text h2 { font-size: clamp(26px, 2.8vw, 40px); margin-bottom: var(--space-3); }
.arsa-cta-text p, .pcb-text p, .proj-cta-text p { font-size: var(--fs-body-sm); margin: 0; max-width: 52ch; }
.proj-cta-actions { display: flex; gap: 12px; flex-wrap: wrap; }

/* ── Diğer projeler + önceki/sonraki ──────────────────────────────── */
.proj-related { margin-top: clamp(56px, 6vw, 104px); }
.proj-related-head {
    display: flex; align-items: flex-end; justify-content: space-between;
    gap: var(--space-5); flex-wrap: wrap; margin-bottom: var(--space-6);
}
.proj-related-head .proj-section-title { margin-bottom: 0; }

.proj-nav {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-4); margin-top: var(--space-7);
}
.proj-nav-btn {
    display: flex; align-items: center; gap: var(--space-4); min-width: 0;
    padding: var(--space-4) var(--space-5);
    border-radius: var(--r-card);
    background: var(--card); border: 1px solid var(--border);
    color: var(--text-2); transition: all var(--t);
}
.proj-nav-btn.next { justify-content: flex-end; text-align: right; }
.proj-nav-btn:hover { color: var(--text); border-color: var(--border-strong); box-shadow: var(--shadow-sm); }
.proj-nav-btn.prev:hover i { transform: translateX(-4px); }
.proj-nav-btn.next:hover i { transform: translateX(4px); }
.proj-nav-btn i { color: var(--primary-ink); transition: transform var(--t); flex: 0 0 auto; }
.pnb-text { display: grid; gap: 2px; min-width: 0; }
.pnb-key { font-size: var(--fs-eyebrow); letter-spacing: var(--ls-eyebrow); text-transform: uppercase; color: var(--text-3); }
.pnb-text strong {
    font-size: var(--fs-body-sm); color: var(--text);
    display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1;
    overflow: hidden; overflow-wrap: anywhere;
}
/* Tek yönlü gezinmede boş hücre yerinde durur, buton yana kaymaz. */
.proj-nav-gap { display: block; }

@media (max-width: 1080px) {
    .proj-layout { grid-template-columns: 1fr; }
    .proj-aside { position: static; }
}
@media (max-width: 640px) {
    .proj-nav { grid-template-columns: 1fr; }
}

/* ─────────────── Galeri görüntüleyici (gv-*) ─────────────── */
.gv-section { display: grid; gap: var(--space-5); }
.gv-header {
    display: flex; align-items: flex-end; justify-content: space-between;
    gap: var(--space-4); flex-wrap: wrap;
}
.gv-header .proj-section-title { margin-bottom: 0; }
.gv-tag {
    display: inline-flex; align-items: center; gap: 8px;
    height: var(--control-h-sm); padding: 0 var(--space-5);
    border-radius: var(--r-pill);
    background: var(--surface); border: 1px solid var(--border);
    font-size: var(--fs-small); font-weight: 600; color: var(--text-2);
}
.gv-tag i { color: var(--primary-ink); }
/* Sayaç görselin İÇİNDE, sağ altta duran cam rozettir; akışta yer kaplayıp
   kutudan taşmamalı (eski hâlinde .gv-main içinde blok olarak kırpılıyordu). */
.gv-counter {
    position: absolute; right: 18px; bottom: 18px; z-index: 3;
    padding: 6px 14px; border-radius: var(--r-badge);
    background: rgba(var(--dark-rgb), .62);
    backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur);
    border: 1px solid var(--glass-border);
    font-size: var(--fs-small); font-weight: 700; color: #fff;
}
.gv-main {
    position: relative;
    border-radius: var(--r-img);
    overflow: hidden;
    background: var(--surface);
    border: 1px solid var(--border);
    box-shadow: var(--shadow-sm);
}
.gv-img-wrap { position: relative; aspect-ratio: 16 / 10; }
.gv-img-wrap img {
    width: 100%; height: 100%; object-fit: cover;
    transition: opacity var(--t-fast);
}
.gv-img-wrap img.gv-fade { opacity: 0; }
/* display:flex/grid alan galeri parçaları [hidden]'ı ezmesin. */
.gv-main[hidden], .gv-strip-outer[hidden], .gv-arrow[hidden],
.gv-counter[hidden], .gv-empty-tab[hidden] { display: none !important; }
.gv-prev, .gv-next, .gv-arrow {
    position: absolute; top: 50%; transform: translateY(-50%);
    width: 52px; height: 52px; border-radius: var(--r-pill);
    display: flex; align-items: center; justify-content: center;
    background: rgba(var(--dark-rgb), .62);
    backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur);
    border: 1px solid var(--glass-border);
    color: var(--text); z-index: 3;
    transition: all var(--t);
}
.gv-prev { left: 18px; } .gv-next { right: 18px; }
.gv-prev:hover, .gv-next:hover, .gv-arrow:hover { background: var(--primary); color: var(--on-primary); border-color: transparent; }
.gv-strip-outer { position: relative; overflow: hidden; }
.gv-strip { display: flex; gap: 12px; overflow-x: auto; scrollbar-width: none; padding-bottom: 4px; }
.gv-strip::-webkit-scrollbar { display: none; }
.gv-strip img, .ilan-thumb {
    flex: 0 0 auto;
    width: 116px; height: 82px; object-fit: cover;
    border-radius: var(--r-sm);
    border: 2px solid transparent;
    opacity: .55; cursor: pointer;
    transition: opacity var(--t), border-color var(--t), transform var(--t);
}
.gv-strip img:hover, .ilan-thumb:hover { opacity: 1; transform: translateY(-3px); }
.gv-strip img.active, .ilan-thumb.active { opacity: 1; border-color: var(--primary); }

/* ─────────────── Önce / sonra sürgüsü (ba-*) ─────────────── */
.ba-section { display: grid; gap: var(--space-5); }
.ba-wrap { display: grid; gap: var(--space-6); }
.ba-slider, .ba-slider-instance {
    position: relative;
    aspect-ratio: 16 / 9;
    border-radius: var(--r-img);
    overflow: hidden;
    border: 1px solid var(--border);
    box-shadow: var(--shadow);
    user-select: none;
    cursor: ew-resize;
}
.ba-slider img, .ba-before img, .ba-after img { width: 100%; height: 100%; object-fit: cover; }
.ba-before, .ba-before-instance { position: absolute; inset: 0; overflow: hidden; z-index: 2; }
.ba-after { position: absolute; inset: 0; z-index: 1; }
.ba-handle, .ba-handle-instance {
    position: absolute; top: 0; bottom: 0; z-index: 3;
    width: 2px; background: var(--primary);
    transform: translateX(-50%);
    box-shadow: 0 0 22px rgba(var(--primary-rgb), .7);
}
.ba-handle-line { position: absolute; inset: 0; width: 2px; background: inherit; }
.ba-handle-btn {
    position: absolute; top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: 52px; height: 52px; border-radius: var(--r-pill);
    display: flex; align-items: center; justify-content: center;
    background: var(--primary); color: var(--on-primary);
    box-shadow: var(--shadow-gold);
    font-size: .9rem;
}
.ba-label, .ba-label-left, .ba-label-right {
    position: absolute; top: 16px; z-index: 4;
    padding: 7px 16px; border-radius: var(--r-badge);
    background: rgba(var(--dark-rgb), .68);
    backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur);
    border: 1px solid var(--glass-border);
    font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
    color: var(--text);
}
.ba-label-left { left: 16px; } .ba-label-right { right: 16px; }

/* ─────────────── Dosyalar (DWG/PDF) ─────────────── */
.files-list { display: grid; gap: var(--space-4); }
.file-item {
    display: flex; align-items: center; gap: var(--space-4);
    padding: var(--space-5); flex-wrap: wrap;
}
.file-item:hover { border-color: var(--border-strong); transform: translateY(-3px); }
.file-icon {
    width: 54px; height: 54px; flex: 0 0 auto;
    display: flex; align-items: center; justify-content: center;
    border-radius: var(--r-sm);
    background: rgba(var(--primary-rgb), .12);
    color: var(--primary); font-size: 1.3rem;
}
.file-info { flex: 1 1 200px; min-width: 0; }
.file-name { font-weight: 700; font-size: var(--fs-body-sm); }
.file-meta, .file-desc { font-size: var(--fs-small); color: var(--text-3); }
.file-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.file-btn-dl, .file-btn-view, .file-btn-dwg, .doc-dl-btn {
    display: inline-flex; align-items: center; gap: 9px;
    padding: 11px 20px; border-radius: var(--r-pill);
    font-size: var(--fs-small); font-weight: 600;
    background: var(--glass-bg); border: 1px solid var(--glass-border);
    color: var(--text); transition: all var(--t);
}
.file-btn-dl:hover, .file-btn-view:hover, .file-btn-dwg:hover, .doc-dl-btn:hover {
    background: var(--primary); color: var(--on-primary); border-color: transparent; transform: translateY(-3px);
}
.dwg-icon-wrap { font-size: 3rem; color: var(--primary); }
.dwg-filename { font-weight: 700; }
.dwg-note-main, .dwg-alt-note { font-size: var(--fs-small); color: var(--text-3); }

/* ─────────────── İlanlar ─────────────── */
.ilan-gnav { padding-bottom: var(--space-6); }
.ilan-filter { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; margin-bottom: var(--space-7); }
.ilan-search {
    display: flex; align-items: center;
    background: var(--card); border: 1px solid var(--border);
    border-radius: var(--r-pill); overflow: hidden;
    min-width: min(420px, 100%);
    transition: border-color var(--t), box-shadow var(--t);
}
.ilan-search:focus-within { border-color: rgba(var(--primary-rgb), .5); box-shadow: 0 0 0 4px rgba(var(--primary-rgb), .12); }
.ilan-search input { flex: 1; border: 0; background: none; padding: 15px 24px; font-size: var(--fs-body-sm); }
.ilan-search input:focus { outline: none; }
.ilan-search button {
    padding: 0 26px; align-self: stretch;
    background: var(--primary); color: var(--on-primary);
    transition: background var(--t);
}
.ilan-search button:hover { background: var(--accent); }

.ilan-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: var(--gap-grid); }
.ilan-card { display: flex; flex-direction: column; overflow: hidden; }
.ilan-card-img { position: relative; aspect-ratio: 4 / 3; overflow: hidden; }
.ilan-card-img img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--t-slow); }
.ilan-card:hover .ilan-card-img img { transform: scale(1.05); }
.ilan-card-type { position: absolute; top: 14px; left: 14px; z-index: 2; }
.ilan-card-sold, .ilan-sold-tag {
    position: absolute; top: 14px; right: 14px; z-index: 2;
    padding: 7px 16px; border-radius: var(--r-badge);
    background: var(--primary); color: var(--on-primary);
    font-size: 12px; font-weight: 800; letter-spacing: .04em;
}
.ilan-card-body { padding: var(--space-5); display: grid; gap: 10px; flex: 1; }
.ilan-card-body h3 { font-size: 20px; }
.ilan-card-loc { display: flex; align-items: center; gap: 8px; font-size: var(--fs-small); color: var(--text-2); }
.ilan-card-loc i { color: var(--primary); }
.ilan-card-specs { display: flex; flex-wrap: wrap; gap: 14px; font-size: var(--fs-small); color: var(--text-2); }
.ilan-card-specs i { color: var(--primary); margin-right: 5px; }
.ilan-card-foot {
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    padding: var(--space-4) var(--space-5);
    border-top: 1px solid var(--border);
    margin-top: auto;
}
.ilan-card-price, .ilan-detail-price {
    font-size: 21px; font-weight: 800; color: var(--primary);
    letter-spacing: -.02em; white-space: nowrap;
}
.ilan-gcount { font-size: var(--fs-small); color: var(--text-3); }

.ilan-detail { padding-bottom: var(--section-y); }
.ilan-back {
    display: inline-flex; align-items: center; gap: 10px;
    font-size: var(--fs-small); color: var(--text-2);
    margin-bottom: var(--space-5); transition: color var(--t), transform var(--t);
}
.ilan-back:hover { color: var(--primary); transform: translateX(-4px); }
.ilan-detail-grid { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: clamp(28px, 3vw, 52px); }
.ilan-detail-main { min-width: 0; display: grid; gap: var(--space-6); }
.ilan-detail-side { position: sticky; top: calc(var(--nav-h) + 24px); align-self: start; display: grid; gap: var(--space-5); }
.ilan-detail-top { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-5); flex-wrap: wrap; }
.ilan-detail-loc { display: flex; align-items: center; gap: 9px; color: var(--text-2); font-size: var(--fs-body-sm); }
.ilan-detail-loc i { color: var(--primary); }
.ilan-detail-price { font-size: clamp(28px, 3vw, 40px); }
.ilan-gallery { display: grid; gap: 12px; }
.ilan-gallery-main {
    aspect-ratio: 16 / 10; border-radius: var(--r-img); overflow: hidden;
    border: 1px solid var(--border); background: var(--surface);
}
.ilan-gallery-main img { width: 100%; height: 100%; object-fit: cover; }
.ilan-gallery-thumbs { display: flex; gap: 10px; overflow-x: auto; scrollbar-width: none; }
.ilan-gallery-thumbs::-webkit-scrollbar { display: none; }
.ilan-desc-box, .ilan-contact-box, .ilan-specs-box { padding: var(--space-6); }
.ilan-specs-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 14px; }
.ilan-spec {
    display: flex; align-items: center; justify-content: space-between; gap: 10px;
    padding-bottom: 12px; border-bottom: 1px solid var(--border);
    font-size: var(--fs-small);
}
.ilan-spec span:first-child { color: var(--text-3); }
.ilan-spec span:last-child  { font-weight: 700; }
.ilan-map-box { border-radius: var(--r-img); overflow: hidden; border: 1px solid var(--border); min-height: 320px; }
.ilan-form-link { display: block; text-align: center; font-size: var(--fs-small); color: var(--text-3); margin-top: 10px; }
.ilan-form-link:hover { color: var(--primary); }
@media (max-width: 1080px) { .ilan-detail-grid { grid-template-columns: 1fr; } .ilan-detail-side { position: static; } }

/* ─────────────── Mobilya ─────────────── */
.mobilya-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: var(--gap-grid); }
.mobilya-card { padding: clamp(28px, 3vw, 40px); display: flex; flex-direction: column; }
.mobilya-card h3 { margin-bottom: var(--space-3); }
.mobilya-card p  { font-size: var(--fs-body-sm); }

/* ─────────────── Kurumsal (about) ─────────────── */
.about-grid {
    display: grid; grid-template-columns: 1fr 1fr;
    gap: clamp(40px, 5vw, 88px); align-items: center;
}
.about-img-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-4); }
.about-img-main, .about-img-sub {
    border-radius: var(--r-img); overflow: hidden;
    background: linear-gradient(135deg, var(--surface), var(--card));
    border: 1px solid var(--border);
    display: flex; align-items: center; justify-content: center;
    color: var(--text-3); font-size: 2.4rem;
    transition: transform var(--t);
}
.about-img-main { grid-column: 1 / -1; aspect-ratio: 16 / 10; }
.about-img-sub  { aspect-ratio: 1 / 1; }
.about-img-main:hover, .about-img-sub:hover { transform: translateY(-6px); }
.about-img-main img, .about-img-sub img { width: 100%; height: 100%; object-fit: cover; }
.about-text h2 { margin-bottom: var(--space-5); }
.about-text p { margin-bottom: var(--space-4); }

.vision-item { display: flex; gap: var(--space-4); padding: var(--space-5); align-items: flex-start; }
.vision-item + .vision-item { margin-top: var(--space-4); }
.vision-icon { width: 54px; height: 54px; font-size: 1.15rem; margin-bottom: 0; }
.vision-item h3 { font-size: 19px; margin-bottom: 6px; }
.vision-item p  { font-size: var(--fs-small); margin: 0; }
@media (max-width: 900px) { .about-grid { grid-template-columns: 1fr; } }

/* ─────────────── Referanslar ─────────────── */
/* Sütun sayısı sabit; yorum sayısı azken ızgara esnemez, blok ortalanır.
   (Tek yorumda kart 1376px'e yayılıyor, dev bir boş kutu gibi duruyordu.)   */
.testi-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap-grid); }
.testi-grid.is-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 920px; margin-inline: auto; }
.testi-grid.is-1 { grid-template-columns: minmax(0, 760px); justify-content: center; }

/* Tek yorum: kart yerine "öne çıkan alıntı" gibi sunulur */
.testi-grid.is-1 .testi-card { text-align: center; align-items: center; padding: clamp(36px, 4vw, 56px); }
.testi-grid.is-1 .testi-text {
    font-size: clamp(19px, 1.7vw, 25px); font-style: normal;
    color: var(--text); line-height: 1.5; text-wrap: balance;
}
.testi-grid.is-1 .testi-quote { font-size: 2.1rem; }
.testi-grid.is-1 .testi-author { justify-content: center; flex-wrap: wrap; }

@media (max-width: 1000px) { .testi-grid, .testi-grid.is-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px)  {
    .testi-grid, .testi-grid.is-1, .testi-grid.is-2 { grid-template-columns: minmax(0, 1fr); }
}
.testi-card { padding: clamp(28px, 3vw, 40px); display: flex; flex-direction: column; gap: var(--space-4); }
.testi-card:hover { transform: translateY(-8px); box-shadow: var(--shadow); }
.testi-stars { display: flex; gap: 4px; color: var(--primary); font-size: .9rem; }
.testi-text { font-size: var(--fs-body-sm); color: var(--text-2); flex: 1; font-style: italic; }
.testi-author { display: flex; align-items: center; gap: 14px; }
.testi-avatar {
    width: 48px; height: 48px; border-radius: var(--r-pill);
    display: flex; align-items: center; justify-content: center;
    background: var(--gradient-gold); color: var(--on-primary);
    font-weight: 800; font-size: 1.1rem;
}
.testi-author strong { display: block; font-size: var(--fs-body-sm); }
.testi-author span { font-size: var(--fs-small); color: var(--text-3); }

/* ─────────────── Arsa ─────────────── */
.arsa-wrap { display: grid; grid-template-columns: minmax(0, 1fr) 520px; gap: clamp(32px, 4vw, 64px); align-items: start; }
.arsa-info h2 { margin-bottom: var(--space-5); }
.arsa-benefits { display: grid; gap: var(--space-4); margin: var(--space-6) 0; }
.arsa-benefit { display: flex; align-items: center; gap: var(--space-4); padding: var(--space-5); }
.arsa-benefit i {
    width: 50px; height: 50px; flex: 0 0 auto;
    display: flex; align-items: center; justify-content: center;
    border-radius: var(--r-sm);
    background: rgba(var(--primary-rgb), .12); color: var(--primary);
}
.arsa-benefit strong { display: block; font-size: var(--fs-body-sm); }
.arsa-benefit span { font-size: var(--fs-small); color: var(--text-2); }
.arsa-phone {
    display: flex; align-items: center; gap: var(--space-4);
    padding: var(--space-5); border-radius: var(--r-card);
    background: var(--glass-bg); border: 1px solid var(--glass-border);
}
.arsa-phone > i { font-size: 1.6rem; color: var(--primary); }
.arsa-form { display: grid; gap: 0; }
@media (max-width: 1080px) { .arsa-wrap { grid-template-columns: 1fr; } }

/* ─────────────── Hukuki / legal sayfalar ─────────────── */
.legal-page {
    max-width: 860px; margin: 0 auto;
    font-size: var(--fs-body-sm); color: var(--text-2);
}
.legal-page h2 { font-size: 26px; margin: var(--space-7) 0 var(--space-4); }
.legal-page h3 { font-size: 20px; margin: var(--space-6) 0 var(--space-3); }
.legal-page p, .legal-page li { margin-bottom: var(--space-3); }
.legal-page ul { list-style: disc; padding-left: 22px; }
.legal-page a { color: var(--primary); text-decoration: underline; }

/* ─────────────── 404 ─────────────── */
.e404-wrap {
    position: relative; min-height: 100svh;
    display: flex; align-items: center; justify-content: center;
    padding: calc(var(--nav-h) + 60px) var(--container-pad) 80px;
    overflow: hidden; text-align: center;
}
.e404-inner { position: relative; z-index: 2; max-width: 680px; }
.e404-num {
    font-size: clamp(96px, 18vw, 220px); font-weight: 800; line-height: .9;
    letter-spacing: -.05em;
    background: var(--gradient-gold);
    -webkit-background-clip: text; background-clip: text;
    -webkit-text-fill-color: transparent;
    margin-bottom: var(--space-4);
}
.e404-tag {
    display: inline-flex; align-items: center; gap: 9px;
    padding: 9px 20px; border-radius: var(--r-badge);
    background: var(--glass-bg); border: 1px solid var(--glass-border);
    font-size: var(--fs-small); color: var(--text-2);
    margin-bottom: var(--space-5);
}
.e404-tag i { color: var(--primary); }
.e404-title { font-size: var(--fs-h2); margin-bottom: var(--space-4); }
.e404-desc  { font-size: var(--fs-body-sm); margin-bottom: var(--space-7); }
.e404-actions { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }
.e404-skyline, .e404-crane {
    position: absolute; bottom: 0; left: 0; right: 0; z-index: 1;
    opacity: .16; pointer-events: none;
}
.e404-crane { animation: floatY 6s ease-in-out infinite; }

/* ─────────────── Proje detay — durum rozetleri ─────────────── */
.proj-badge.badge-success { background: rgba(52,211,153,.12); border-color: rgba(52,211,153,.32); color: #6EE7B7; }
.proj-badge.badge-warning { background: rgba(var(--primary-rgb),.14); border-color: rgba(var(--primary-rgb),.34); color: var(--primary); }
.proj-badge.badge-info    { background: rgba(96,165,250,.12); border-color: rgba(96,165,250,.32); color: #93C5FD; }
.gv-thumb {
    flex: 0 0 auto; width: 116px; height: 82px;
    border-radius: var(--r-sm); overflow: hidden;
    border: 2px solid transparent; opacity: .55; cursor: pointer;
    transition: opacity var(--t), border-color var(--t), transform var(--t);
}
.gv-thumb img { width: 100%; height: 100%; object-fit: cover; }
.gv-thumb:hover { opacity: 1; transform: translateY(-3px); }
.gv-thumb.active { opacity: 1; border-color: var(--primary); }
.file-icon.pdf { background: rgba(248,113,113,.12); color: #FCA5A5; }
.doc-modal-body iframe { width: 100%; height: 68vh; border: 0; border-radius: var(--r-sm); background: var(--surface); }
.e404-num span { -webkit-text-fill-color: transparent; }
.e404-skyline path { fill: var(--surface); }
.e404-crane { font-size: clamp(48px, 7vw, 76px); margin-bottom: var(--space-4); }

/* Liste kartında rozet görselin içinde konumlanır */
.pg-img-wrap > .pg-status-badge { position: absolute; top: 16px; left: 16px; z-index: 2; }
.pg-placeholder { flex-direction: column; gap: 10px; }
.pg-placeholder span { font-size: var(--fs-small); letter-spacing: .04em; }

/* ─────────────── Açık tema düzeltmeleri ─────────────── */
/* Görsel üstündeki katmanlarda içerik daima beyaz */
.project-share, .gv-prev, .gv-next, .gv-arrow { color: #fff; border-color: rgba(255,255,255,.2); }
.project-share:hover, .gv-prev:hover, .gv-next:hover, .gv-arrow:hover { color: var(--on-primary); }
.pg-img-wrap, .project-img-wrapper, .ilan-card-img { background: var(--surface); }

/* Proje/ilan detay hero — koyu ada */
.proj-hero { background: var(--dark); }
.proj-hero .proj-title, .proj-hero .proj-subtitle { color: #fff; }
.proj-hero .proj-subtitle { color: rgba(255,255,255,.82); }

/* Kart iç boşlukları tek ölçüde */
.service-card, .mobilya-card, .testi-card { padding: var(--card-pad); }

/* Kart başlıkları EN FAZLA 2 satır — uzun içerik kart yüksekliğini kaçırmasın,
   aynı satırdaki kartlar dengede kalsın. Fazlası üç nokta ile kesilir. */
.service-card > h3, .mobilya-card > h3, .ilan-card-body > h3,
.why-block > h3, .why-block-lead > h3, .timeline-step > h3, .stat-item > h3 {
    display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;
    overflow: hidden; overflow-wrap: anywhere;
}
.contact-info-box, .contact-form-box, .proj-info-card,
.ilan-desc-box, .ilan-contact-box, .ilan-specs-box { padding: clamp(22px, 2.2vw, 32px); }
.vision-item, .arsa-benefit, .file-item, .arsa-phone { padding: var(--space-4) var(--space-5); }

/* "Bulunamadı" yedek bloğu (proje/ilan detay) */
.not-found-block { padding: calc(var(--nav-h) + 84px) var(--container-pad) var(--space-9); text-align: center; }
.not-found-block h1 { font-size: var(--fs-h1); margin-bottom: var(--space-3); }
.not-found-block p  { margin-bottom: var(--space-5); }

/* ═════════════ İLETİŞİM (yeniden düzenlendi) ═════════════ */
.contact-wrapper {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(0, .95fr);
    gap: var(--gap-grid);
    align-items: start;
}
.contact-form-box .overline { margin-bottom: var(--space-2); }
.contact-form-box h2 { font-size: clamp(24px, 2.2vw, 34px); margin-bottom: var(--space-3); }
.contact-lead { font-size: var(--fs-body-sm); margin-bottom: var(--space-6); max-width: 56ch; }

/* Bal küpü alanı (spam tuzağı) — ekran dışı ama erişilebilir ağaçtan çıkmış */
.hp-field { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }

.form-row-2 .form-group { margin-bottom: var(--space-3); }
.form-hint {
    display: flex; align-items: center; gap: 8px;
    font-size: var(--fs-small); color: var(--text-3);
    margin: 0 0 var(--space-5);
}
.form-hint i { color: var(--primary-ink); }
.req { color: #DC2626; font-weight: 700; }

.form-actions {
    display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-3);
    margin-top: var(--space-5);
}
.form-actions .btn-cta, .form-actions .contact-wa-btn { width: 100%; }
@media (max-width: 520px) { .form-actions { grid-template-columns: 1fr; } }

/* Bilgi kartı */
.contact-info-box { display: grid; gap: var(--space-5); align-content: start; }
.contact-info-box h3 { font-size: var(--fs-h4); padding-bottom: var(--space-4); border-bottom: 1px solid var(--border); }
.info-item { display: flex; gap: var(--space-4); align-items: flex-start; }
.info-item > i {
    width: 42px; height: 42px; flex: 0 0 auto;
    display: flex; align-items: center; justify-content: center;
    border-radius: var(--r-sm);
    background: rgba(var(--primary-rgb), .13);
    color: var(--primary-ink); font-size: .95rem;
}
.info-item strong { display: block; font-size: var(--fs-body-sm); margin-bottom: 4px; }
.info-item p { font-size: var(--fs-small); color: var(--text-2); margin: 0; line-height: 1.6; }
.info-item a { color: var(--text-2); }
.info-item a:hover { color: var(--primary-ink); }

.contact-phones { display: grid; gap: 6px; }
.contact-phones li { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.contact-phones a { font-size: var(--fs-body-sm); font-weight: 600; color: var(--text); }
.contact-phones a:hover { color: var(--primary-ink); }
.contact-phones span { font-size: var(--fs-small); color: var(--text-3); }

/* Harita — tam genişlik, oranlı */
.contact-map-section { padding: 0 0 var(--section-y); }
.contact-map {
    border-radius: var(--r-img);
    overflow: hidden;
    border: 1px solid var(--border);
    box-shadow: var(--shadow-sm);
    aspect-ratio: 21 / 7;
    background: var(--surface);
}
.contact-map iframe { width: 100%; height: 100%; display: block; border: 0; }
@media (max-width: 1000px) { .contact-wrapper { grid-template-columns: 1fr; } }
@media (max-width: 700px)  { .contact-map { aspect-ratio: 4 / 3; } }

/* Form kutusu ortak parçaları (iletişim + arsa) */
.form-box-title { font-size: var(--fs-h3); margin-bottom: var(--space-5); }
.btn-block { width: 100%; }
.form-note { font-size: var(--fs-small); color: var(--text-2); text-align: center; margin-top: var(--space-3); }

/* ═════════════ PROJELER SAYFASI ═════════════ */
/* Yapışkan filtre bandı */
.pf-bar {
    position: sticky; top: calc(var(--nav-h) + 14px);
    z-index: calc(var(--z-nav) - 2);
    display: block;
    padding: var(--space-4) 0;
    margin-bottom: 0;
    background: rgba(255,255,255,.78);
    backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur);
    border-bottom: 1px solid var(--border);
}
body.has-admin-bar .pf-bar { top: calc(var(--nav-h) + 54px); }
.pf-bar .container { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); flex-wrap: wrap; }
.pf-bar .pf-tabs { margin-bottom: 0; justify-content: flex-start; flex: 1 1 auto; }
.pf-bar .pf-info { margin-bottom: 0; color: var(--text-3); white-space: nowrap; }
.pf-bar .pf-info span { color: var(--text); font-weight: 700; }
@media (max-width: 760px) {
    .pf-bar { top: calc(var(--nav-h) + 8px); padding: var(--space-3) 0; }
    .pf-bar .container { justify-content: center; }
    .pf-bar .pf-tabs { justify-content: center; }
    .pf-bar .pf-info { display: none; }
}

/* Izgara: filtre bandından sonra nefes payı */
.pg-section { padding-top: clamp(36px, 4vw, 56px); }

/* Filtre geçiş animasyonları (projects.php JS'i bu sınıfları kullanır) */
.pg-card-in  { animation: pgIn .35s var(--ease) both; }
.pg-card-out { animation: pgOut .24s var(--ease-soft) both; }
@keyframes pgIn  { from { opacity: 0; transform: translateY(16px) scale(.98); } }
@keyframes pgOut { to   { opacity: 0; transform: scale(.97); } }

/* Boş durum — JS display:flex atadığı için kolon flex */
.pg-empty-state, .ilan-gallery-empty, .gv-empty-tab {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: var(--space-3);
}

/* Alt CTA bandı — iç kapsayıcı hizası */
.pcb-band .container {
    display: flex; align-items: center; justify-content: space-between;
    gap: var(--space-5); flex-wrap: wrap;
}
.pcb-band { margin-bottom: var(--section-y); }
.pcb-btn { flex: 0 0 auto; }

/* Sayfa başlığındaki özet rozetleri */
.ph-stats {
    display: flex; flex-wrap: wrap; gap: var(--space-3);
    margin-top: var(--space-5);
}
.ph-stats li {
    display: grid; gap: 1px;
    padding: 12px 20px;
    border-radius: var(--r-sm);
    background: var(--card);
    border: 1px solid var(--border);
    box-shadow: var(--shadow-xs);
    transition: transform var(--t), box-shadow var(--t), border-color var(--t);
}
.ph-stats li:hover { transform: translateY(-3px); box-shadow: var(--shadow); border-color: var(--border-strong); }
.ph-stats strong { font-size: 22px; line-height: 1.1; letter-spacing: -.02em; }
.ph-stats span { font-size: var(--fs-small); color: var(--text-2); }

/* ═══════════════════════════════════════════════════════════════
   ANASAYFA — premium bölümler (v3)
   ═══════════════════════════════════════════════════════════════ */

/* Bölüm başlığı + sağda "tümünü gör" bağlantısı */
.section-head {
    display: flex; align-items: flex-end; justify-content: space-between;
    gap: var(--space-5); flex-wrap: wrap;
    margin-bottom: clamp(28px, 3vw, 48px);
}
.section-head h2 { margin: 0; }
.section-link {
    display: inline-flex; align-items: center; gap: 9px;
    font-size: var(--fs-body-sm); font-weight: 600;
    color: var(--text);
    padding-bottom: 4px;
    border-bottom: 1px solid var(--border-strong);
    transition: color var(--t), border-color var(--t), gap var(--t);
}
.section-link:hover { color: var(--primary-ink); border-color: var(--primary); gap: 14px; }
.lead { font-size: clamp(17px, 1.3vw, 20px); color: var(--text-2); margin-bottom: var(--space-4); }

/* ─────────────── Firma Hakkında (split) ─────────────── */
.about-split {
    display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: clamp(36px, 5vw, 88px); align-items: center;
}
.about-visual { position: relative; }
.about-frame {
    border-radius: var(--r-img); overflow: hidden;
    aspect-ratio: 4 / 5; background: var(--surface);
    box-shadow: var(--shadow-lg);
}
.about-frame img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
.about-visual:hover .about-frame img { transform: scale(1.04); }
.about-badge {
    position: absolute; right: -18px; bottom: 36px;
    display: flex; align-items: center; gap: 12px;
    padding: 18px 26px;
    border-radius: var(--r-sm);
    background: var(--dark); color: var(--on-dark);
    box-shadow: var(--shadow-lg);
}
.about-badge strong { font-size: 38px; line-height: 1; letter-spacing: -.03em; color: var(--primary); }
.about-badge span { font-size: var(--fs-small); line-height: 1.25; color: rgba(255,255,255,.72); }

.about-body h2 { margin-bottom: var(--space-4); }
.about-points { display: grid; gap: var(--space-4); margin: var(--space-6) 0; }
.about-points li { display: flex; gap: 14px; align-items: flex-start; }
.about-points i {
    width: 26px; height: 26px; flex: 0 0 auto; margin-top: 3px;
    display: flex; align-items: center; justify-content: center;
    border-radius: 50%; font-size: .68rem;
    background: rgba(var(--primary-rgb), .16); color: var(--primary-ink);
}
.about-points strong { display: block; font-size: var(--fs-body-sm); }
.about-points span { font-size: var(--fs-small); color: var(--text-2); }
.about-actions { display: flex; flex-wrap: wrap; gap: 12px; }
@media (max-width: 940px) {
    .about-split { grid-template-columns: 1fr; }
    .about-frame { aspect-ratio: 16 / 10; }
    .about-badge { right: 16px; bottom: -22px; }
    .about-body { padding-top: var(--space-6); }
}

/* ─────────────── Neden Biz (büyük bloklar) ─────────────── */
/* 12 sütun: lider blok tam genişlik, kalan 4 blok tek satırda eşit dağılır.
   (6 sütunda 4 blok 3+1 diziliyor, alt satırda 4 sütunluk delik kalıyordu.) */
.why-blocks {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: var(--gap-grid);
}
.why-block {
    grid-column: span 3;
    padding: var(--card-pad);
    border-radius: var(--r-card);
    background: var(--card);
    border: 1px solid var(--border);
    box-shadow: var(--shadow-sm);
    transition: transform var(--t), box-shadow var(--t), border-color var(--t);
}
.why-block:hover { transform: translateY(-4px); box-shadow: var(--shadow); border-color: var(--border-strong); }
.why-block-lead {
    grid-column: span 12;
    display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--space-5) var(--space-6);
    align-items: center;
    background: var(--dark); color: var(--on-dark); border-color: transparent;
}
.why-block-lead h3 { color: #fff; font-size: clamp(26px, 2.4vw, 36px); }
.why-block-lead p  { color: rgba(255,255,255,.74); font-size: var(--fs-body); max-width: 62ch; }
.why-block-lead i  { grid-row: span 2; font-size: 2.4rem; color: var(--primary); }
.why-block > i {
    display: block; font-size: 1.5rem; color: var(--primary-ink);
    margin-bottom: var(--space-4);
}
.why-block h3 { font-size: var(--fs-h3); margin-bottom: 10px; }
.why-block p  { font-size: var(--fs-body-sm); }
@media (max-width: 1080px) { .why-block { grid-column: span 6; } }
@media (max-width: 700px)  { .why-blocks { grid-template-columns: 1fr; } .why-block, .why-block-lead { grid-column: span 1; } .why-block-lead { grid-template-columns: 1fr; } .why-block-lead i { grid-row: auto; } }

/* ─────────────── Yapım Süreci (timeline) ─────────────── */
.timeline {
    display: grid; grid-template-columns: repeat(4, 1fr);
    gap: var(--gap-grid);
    position: relative;
    counter-reset: step;
}
.timeline::before {
    content: ''; position: absolute; top: 30px; left: 8%; right: 8%;
    height: 1px; background: linear-gradient(90deg, transparent, var(--border-strong) 12%, var(--border-strong) 88%, transparent);
}
.timeline-step { position: relative; text-align: center; }
.timeline-marker {
    position: relative; z-index: 2;
    width: 60px; height: 60px; margin: 0 auto var(--space-4);
    display: flex; align-items: center; justify-content: center;
    border-radius: 50%;
    background: var(--card); border: 1px solid var(--border-strong);
    color: var(--primary-ink); font-size: 1.15rem;
    box-shadow: var(--shadow-sm);
    transition: transform var(--t), background var(--t), color var(--t), box-shadow var(--t), border-color var(--t);
}
.timeline-step:hover .timeline-marker {
    background: var(--primary); color: var(--on-primary);
    border-color: transparent; transform: translateY(-4px);
    box-shadow: var(--shadow-gold);
}
.timeline-num {
    display: block; font-size: var(--fs-small); font-weight: 800;
    letter-spacing: .16em; color: var(--primary-ink); margin-bottom: 6px;
}
.timeline-step h3 { font-size: var(--fs-h3); margin-bottom: 8px; }
.timeline-step p  { font-size: var(--fs-small); max-width: 34ch; margin: 0 auto; }
@media (max-width: 900px) {
    .timeline { grid-template-columns: repeat(2, 1fr); row-gap: var(--space-7); }
    .timeline::before { display: none; }
}
@media (max-width: 520px) { .timeline { grid-template-columns: 1fr; } }

/* ─────────────── Proje kartı (tek bileşen) ─────────────── */
/* Gövde metni kart kenarına yapışmaz; görsel (.pg-img-wrap) tam kanama kalır.
   margin-top:auto → kısa başlıklı kartta metin bloğu alta hizalanır, aynı
   satırdaki kartlarda büyük boşluk oluşmaz. */
.pg-body {
    display: flex; align-items: center; justify-content: space-between;
    gap: var(--space-4);
    padding: var(--space-5) var(--card-pad) var(--card-pad);
    margin-top: auto; min-width: 0;
}
.pg-body-text { min-width: 0; flex: 1 1 auto; }
@media (max-width: 900px) { .pg-body { padding: var(--space-4) var(--space-5) var(--space-5); } }
.pg-go {
    width: 44px; height: 44px; flex: 0 0 auto;
    display: flex; align-items: center; justify-content: center;
    border-radius: 50%;
    background: var(--surface); color: var(--text);
    transition: background var(--t), color var(--t), transform var(--t);
}
.pg-card:hover .pg-go { background: var(--primary); color: var(--on-primary); transform: translateX(3px); }

/* ─────────────── Referanslar ─────────────── */
.testi-quote { font-size: 1.6rem; color: rgba(var(--primary-rgb), .5); }
.testi-text { font-size: var(--fs-body); color: var(--text); font-style: normal; line-height: 1.6; }
.testi-author { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.testi-author > span:nth-child(2) { display: grid; }
.testi-author .testi-stars { margin-left: auto; }

/* ─────────────── SSS (split) ─────────────── */
.faq-split {
    display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
    gap: clamp(28px, 4vw, 72px); align-items: start;
}
.faq-intro h2 { margin-bottom: var(--space-3); }
.faq-intro p { margin-bottom: var(--space-5); }
.faq-split .faq-wrap { margin: 0; max-width: none; }
@media (max-width: 940px) { .faq-split { grid-template-columns: 1fr; } }

/* ─────────────── Kapanış CTA ─────────────── */
.cta-final {
    background: var(--dark); color: var(--on-dark);
    border-radius: var(--r-section);
    margin: var(--section-y) var(--container-pad) 0;
    padding: clamp(48px, 6vw, 96px) 0;
    position: relative; overflow: hidden;
}
.cta-final::before {
    content: ''; position: absolute; inset: 0; pointer-events: none;
    background:
        radial-gradient(60% 90% at 92% 10%, rgba(var(--primary-rgb), .22), transparent 66%),
        repeating-linear-gradient(-45deg, rgba(255,255,255,.03) 0 1px, transparent 1px 22px);
}
.cta-final .container { position: relative; z-index: 2; }
.cta-final-inner {
    display: flex; align-items: center; justify-content: space-between;
    gap: var(--space-7); flex-wrap: wrap;
}
.cta-final h2 { color: #fff; font-size: clamp(28px, 3.4vw, 52px); margin-bottom: var(--space-3); }
.cta-final p  { color: rgba(255,255,255,.74); max-width: 52ch; margin: 0; }
.cta-final-actions { display: flex; gap: 12px; flex-wrap: wrap; }

/* Kurumsal — görsel yoksa gösterilen boş durum.
   Eskiden satır içi style ile sabit renk (#ddd) ve sabit ölçü (4rem)
   yazılıyordu; ikisi de proje kuralını ihliydi. */
.about-img-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--surface);
    border-radius: var(--r-card);
    color: var(--border-strong);
    font-size: var(--fs-h1);
}

/* Harita kapağı (facade) — tıklanınca gerçek harita yüklenir.
   Doğrudan iframe hem 17 dış istek getiriyor hem de ziyaretçi onay
   vermeden Google'a istek gönderiyordu. */
.map-facade {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 7;
    border: 1px dashed var(--border-strong);
    border-radius: var(--r-img);
    background: var(--surface);
    cursor: pointer;
    font: inherit;
    color: var(--text);
    transition: border-color var(--t), background var(--t);
}
.map-facade:hover,
.map-facade:focus-visible { border-color: var(--primary); background: var(--card); }

.map-facade-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--space-3);
    height: 100%;
    padding: var(--space-5);
    text-align: center;
}
.map-facade-inner .ico { color: var(--primary-ink); }
.map-facade-inner strong { font-size: var(--fs-h4); }
.map-facade-note { font-size: var(--fs-small); color: var(--text-2); max-width: 38ch; }
.map-facade-btn { margin-top: var(--space-2); pointer-events: none; }

.contact-map iframe {
    width: 100%;
    aspect-ratio: 16 / 7;
    border: 0;
    border-radius: var(--r-img);
    display: block;
}


/* ═══ Dokunmatik cihazlarda paylaşım düğmesi ═══
   .project-share varsayılan olarak opacity:0 ve yalnız .pg-card:hover ile
   görünüyordu. Dokunmatik cihazda hover YOK — buton mobilde hiç
   görünmüyordu, yani işlev tamamen kayıptı.
   (hover: none) ile telefonda her zaman görünür ve 44px dokunma hedefi. */
@media (hover: none) {
    .project-share {
        opacity: 1;
        transform: none;
        width: var(--touch);
        height: var(--touch);
    }
}