/* ÜRETİLMİŞ DOSYA — elle düzenlenmez.
 * Kaynak: src/designs/16-proje-arsiv/section.css
 *
 * Her bildirime `!important` eklendi. Sebep:
 * florax teması `.post-entry h2 { font-size: 36px !important }` gibi
 * kurallar taşıyor ve `!important` özgüllüğü dinlemiyor. Ayrıntı:
 * scripts/gs-important.mjs başlığı ve assets/base.css.
 */
/* ─── 16-proje-arsiv · PROJELER ARŞİVİ ────────────────────────────────────────
 *
 * Tez: sayfa bir İŞ BİTİRME CETVELİDİR (Section.tsx başındaki nota bak).
 *
 * 🔒 Kurallar diğer yüzeylerle aynı ve hepsi ölçülmüş: `!important` yazılmaz ·
 * çıplak hex yok · punto yalnız `--gs-fs-1…7` · boşluk yalnız `--gs-bo-1…6` ·
 * `opacity`/`transform` TANIMLANMAZ (Ö-023) · kenarlık `border` kısayoluyla
 * (Ö-135) · `<a>` kendi kutusunu bildirir (Ö-118) · koyu zeminde
 * `:focus-visible` ezilir (Ö-113).
 */

.gs-16-proje-arsiv {
    --pa-zemin: var(--gs-koyu-zemin);
    --pa-yuzey: var(--gs-koyu-yuzey);
    --pa-metin: var(--gs-koyu-metin);
    --pa-ikincil: var(--gs-koyu-ikincil);
    --pa-silik: var(--gs-koyu-silik);
    --pa-hat: var(--gs-koyu-hat);
    --pa-eylem: var(--gs-primary);

    --pa-aralik: 0.14em;
    --pa-sinir: min(92vw, 74rem);
    --pa-yil-w: 4rem;
    --pa-kapak-w: 7rem;

    background: var(--pa-zemin) !important;
    color: var(--pa-ikincil) !important;
}

.gs-16-proje-arsiv .pa {
    background-image: repeating-linear-gradient(
        135deg,
        rgb(var(--gs-koyu-isik-rgb) / 0.016) 0,
        rgb(var(--gs-koyu-isik-rgb) / 0.016) 1px,
        transparent 1px,
        transparent 7px
    ) !important;
}

.gs-16-proje-arsiv .pa-sinir {
    width: var(--pa-sinir) !important;
    margin-inline: auto !important;
}

/* ── METİN KATMANLARI — §5 ④ ─────────────────────────────────────────────── */

.gs-16-proje-arsiv .pa-etiket {
    margin: 0 0 var(--gs-bo-3) !important;
    font-size: var(--gs-fs-1) !important;
    font-weight: 700 !important;
    letter-spacing: var(--pa-aralik) !important;
    text-transform: uppercase !important;
    color: var(--pa-silik) !important;
}

.gs-16-proje-arsiv .pa-h2 {
    margin: 0 0 var(--gs-bo-4) !important;
    font-size: var(--gs-fs-6) !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    letter-spacing: -0.012em !important;
    color: var(--pa-metin) !important;
}

.gs-16-proje-arsiv .pa-gizli-baslik {
    position: absolute !important;
    inset-block-start: 0 !important;
    inset-inline-start: 0 !important;
    width: 1px !important;
    height: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
}

/* ── BANNER — §5 ⑫ ───────────────────────────────────────────────────────── */

.gs-16-proje-arsiv .pa-banner {
    padding-block: var(--gs-ritim) var(--gs-bo-6) !important;
    border-bottom: 1px solid var(--pa-hat) !important;
}

.gs-16-proje-arsiv .pa-baslik {
    margin: 0 0 var(--gs-bo-4) !important;
    max-width: 16ch !important;
    font-size: var(--gs-fs-7) !important;
    font-weight: 800 !important;
    line-height: 1.05 !important;
    letter-spacing: -0.028em !important;
    color: var(--pa-metin) !important;
}

.gs-16-proje-arsiv .pa-ozet {
    margin: 0 !important;
    max-width: 56ch !important;
    font-size: var(--gs-fs-4) !important;
    line-height: 1.65 !important;
    color: var(--pa-ikincil) !important;
}

/* ── CETVEL ──────────────────────────────────────────────────────────────── */

.gs-16-proje-arsiv .pa-cetvel {
    padding-block: var(--gs-ritim) !important;
}

/* ⚠️ Başlık şeridi dar ekranda GİZLENİR: orada satır tek sütuna iniyor ve
   üç başlık hiçbir şeyin üstünde durmuyor olurdu — başlık yalan söylerdi
   (Ö-108'in dersinin bu bölümdeki karşılığı). */
.gs-16-proje-arsiv .pa-tablo-bas {
    display: none !important;
}

.gs-16-proje-arsiv .pa-tablo-et {
    font-size: var(--gs-fs-1) !important;
    font-weight: 700 !important;
    letter-spacing: var(--pa-aralik) !important;
    text-transform: uppercase !important;
    color: var(--pa-silik) !important;
}

.gs-16-proje-arsiv .pa-liste {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    border-top: 1px solid var(--pa-hat) !important;
}

.gs-16-proje-arsiv .pa-satir {
    border-bottom: 1px solid var(--pa-hat) !important;
}

/* Satırın TAMAMI bağlantıdır: dokunma hedefi bir kelime değil bir kayıt. */
.gs-16-proje-arsiv .pa-bag {
    display: grid !important;
    grid-template-columns: var(--pa-kapak-w) minmax(0, 1fr) !important;
    gap: var(--gs-bo-2) var(--gs-bo-4) !important;
    align-items: center !important;
    padding-block: var(--gs-bo-4) !important;
    text-decoration: none !important;
    color: inherit !important;
}

/* ── YIL — cetvelin okuma anahtarı ───────────────────────────────────────── */

.gs-16-proje-arsiv .pa-yil {
    grid-column: 2 !important;
    font-size: var(--gs-fs-2) !important;
    font-weight: 700 !important;
    font-variant-numeric: tabular-nums !important;
    letter-spacing: var(--pa-aralik) !important;
    color: var(--pa-silik) !important;
}

/* ── KAPAK — çerçeve ① ───────────────────────────────────────────────────── */

.gs-16-proje-arsiv .pa-cerceve {
    position: relative !important;
    grid-row: span 3 !important;
    display: block !important;
    aspect-ratio: 4 / 3 !important;
    border: 1px solid var(--pa-hat) !important;
    border-top-color: rgb(var(--gs-koyu-isik-rgb) / 0.09) !important;
    border-radius: 0 !important;
    overflow: hidden !important;
    background: var(--pa-yuzey) !important;
}

.gs-16-proje-arsiv .pa-kapak {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

/* Köşe işareti — arşivde TEK kol yeter: kart küçük, iki kol gürültü olurdu. */
.gs-16-proje-arsiv .pa-cerceve::after {
    content: "" !important;
    position: absolute !important;
    z-index: 2 !important;
    inset-block-end: 0.4rem !important;
    inset-inline-start: 0.4rem !important;
    width: 0.75rem !important;
    height: 0.75rem !important;
    border-bottom: 1px solid rgb(255 255 255 / 0.34) !important;
    border-left: 1px solid rgb(255 255 255 / 0.34) !important;
    pointer-events: none !important;
}

.gs-16-proje-arsiv .pa-govde {
    grid-column: 2 !important;
    display: block !important;
}

.gs-16-proje-arsiv .pa-ad {
    display: block !important;
    font-size: var(--gs-fs-5) !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    color: var(--pa-metin) !important;
}

.gs-16-proje-arsiv .pa-konum {
    display: block !important;
    margin-top: var(--gs-bo-1) !important;
    font-size: var(--gs-fs-3) !important;
    line-height: 1.5 !important;
    color: var(--pa-ikincil) !important;
}

/* Numara dar ekranda gizli: cetvelin sırası zaten yıldan okunuyor. */
.gs-16-proje-arsiv .pa-no {
    display: none !important;
    font-size: var(--gs-fs-2) !important;
    font-weight: 700 !important;
    font-variant-numeric: tabular-nums !important;
    color: var(--pa-silik) !important;
}

/* Alt çizgi `:hover`da açılır — §5 ⑥'nın satır ölçeğindeki karşılığı. */
.gs-16-proje-arsiv .pa-bag:hover .pa-ad {
    text-decoration: underline !important;
    text-underline-offset: 0.22em !important;
}

/* ── BOŞ HÂL — §5 ⑧ ──────────────────────────────────────────────────────── */

.gs-16-proje-arsiv .pa-bos {
    padding-block: var(--gs-bo-6) !important;
    font-size: var(--gs-fs-3) !important;
    font-style: italic !important;
    color: var(--pa-silik) !important;
}

/* ── KAPANIŞ — §5 ⑬ ──────────────────────────────────────────────────────── */

.gs-16-proje-arsiv .pa-kapanis {
    display: grid !important;
    gap: var(--gs-bo-6) !important;
    padding-block: var(--gs-ritim) !important;
    border-top: 1px solid var(--pa-hat) !important;
}

.gs-16-proje-arsiv .pa-govde-metin {
    margin: 0 !important;
    max-width: 56ch !important;
    font-size: var(--gs-fs-4) !important;
    line-height: 1.65 !important;
    color: var(--pa-ikincil) !important;
}

.gs-16-proje-arsiv .pa-dugme {
    display: inline-flex !important;
    gap: 0.7rem !important;
    align-items: center !important;
    justify-self: start !important;
    padding: 0.9rem 1.6rem !important;
    border: 0 solid transparent !important;
    border-radius: 0 !important;
    background: var(--pa-eylem) !important;
    color: var(--gs-white) !important;
    font-size: var(--gs-fs-4) !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
}

.gs-16-proje-arsiv .pa-dugme-ok {
    font-weight: 400 !important;
}

/* ── ODAK — koyu zeminde EZİLİR (Ö-113) ──────────────────────────────────── */

.gs-16-proje-arsiv a:focus-visible {
    outline: 2px solid var(--pa-metin) !important;
    outline-offset: 3px !important;
}

/* ── 768px ve üzeri — cetvel açılır ──────────────────────────────────────── */

@media (min-width: 768px) {
    .gs-16-proje-arsiv {
        --pa-kapak-w: 11rem;
    }

    .gs-16-proje-arsiv .pa-tablo-bas,
    .gs-16-proje-arsiv .pa-bag {
        display: grid !important;
        grid-template-columns: var(--pa-yil-w) var(--pa-kapak-w) minmax(0, 1fr) 3rem !important;
        gap: var(--gs-bo-5) !important;
        align-items: center !important;
    }

    .gs-16-proje-arsiv .pa-tablo-bas {
        padding-block: var(--gs-bo-2) !important;
        border-bottom: 1px solid var(--pa-hat) !important;
    }

    /* Başlık şeridinde kapak sütunu boş kalır — üstünde duracak bir söz yok. */
    .gs-16-proje-arsiv .pa-tablo-et:first-child {
        grid-column: 1 !important;
    }

    .gs-16-proje-arsiv .pa-tablo-et:nth-child(2) {
        grid-column: 3 !important;
    }

    .gs-16-proje-arsiv .pa-tablo-et:last-child {
        display: none !important;
    }

    .gs-16-proje-arsiv .pa-yil {
        grid-column: 1 !important;
        font-size: var(--gs-fs-5) !important;
        color: var(--pa-metin) !important;
    }

    .gs-16-proje-arsiv .pa-cerceve {
        grid-row: auto !important;
    }

    .gs-16-proje-arsiv .pa-govde {
        grid-column: 3 !important;
    }

    .gs-16-proje-arsiv .pa-no {
        display: block !important;
        grid-column: 4 !important;
        text-align: end !important;
    }

    .gs-16-proje-arsiv .pa-kapanis {
        grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr) !important;
        align-items: center !important;
    }

    .gs-16-proje-arsiv .pa-dugme {
        justify-self: end !important;
    }
}

/* ── 1025px ve üzeri ─────────────────────────────────────────────────────── */

@media (min-width: 1025px) {
    .gs-16-proje-arsiv {
        --pa-yil-w: 5rem;
        --pa-kapak-w: 14rem;
    }
}