/* PharmHive — yeni tasarim (Faz 3)
   ====================================================================
   HER KURAL `body[data-yeni]` ILE KAPSAMLI. Sebebi gecis: 22 sayfa tek
   seferde tasinmiyor, sayfa sayfa gidiyoruz. Isaretsiz sayfalar bu
   dosyayi yuklese bile hicbir kural onlara degmiyor.

   Kabuk (nav / afis / altbilgi) markup'i TUM sayfalarda ayni tek
   kaynaktan geliyor - src/shell/. Onu degistiremeyiz, cunku henuz
   tasinmamis 21 sayfa da ayni markup'i kullaniyor. Bu yuzden kabugun
   yeni gorunumu markup degisikligiyle degil, buradaki `body[data-yeni]`
   gecersiz kilmalariyla saglaniyor. Tek markup, iki gorunum.

   Yon karari (2026-09-06, Yigit onayladi): orijinalin evrimi.
   Sari degrade hero, ortalanmis duzen, siyah buton, beyaz/#f9f9f9
   donusum korundu; tipografi, bosluk ve kontrast duzeltildi.

   Renk kurali: sari (#fbbc05) ve turkuaz beyaz zeminde ASLA yazi
   olmaz - kontrastlari 1.71 ve 1.94. Dolgu, kenarlik, ikon olarak
   kullanilirlar. Koyu zeminde yazi olabilirler (orada 9-12).
   -------------------------------------------------------------------- */

body[data-yeni] {
    font-family: var(--yt-metin);
    font-size: .96875rem;              /* 15.5px — orijinal 14px'ti */
    line-height: 1.7;
    color: var(--murekkep);
    background: var(--zemin);
    -webkit-font-smoothing: antialiased;
}

body[data-yeni] h1,
body[data-yeni] h2,
body[data-yeni] h3,
body[data-yeni] h4 {
    font-family: var(--yt-baslik);
    font-weight: var(--kalin-tam);
    letter-spacing: -0.03em;
    line-height: 1.15;
    text-wrap: balance;
    margin: 0;
}

body[data-yeni] p { margin: 0; }
body[data-yeni] ul { margin: 0; padding: 0; list-style: none; }

/* Klavye odagi her yerde gorunur — denetimde eksikti. */
body[data-yeni] :focus-visible {
    outline: 2px solid var(--mavi-yazi);
    outline-offset: 3px;
    border-radius: var(--y-sm);
}

body[data-yeni] .yeni-kap {
    max-width: 1100px;
    margin: 0 auto;
    padding-inline: clamp(1rem, 4vw, 2rem);
}

/* ══════════ KABUK: NAV ══════════
   Markup src/shell/nav.html — degismedi, sadece gorunumu geciliyor. */

body[data-yeni] nav#globalnav {
    background: var(--zemin-alt);
    border-bottom: 1px solid var(--cizgi);
}
body[data-yeni] .nav-container { max-width: 1100px; }

body[data-yeni] .logo-text {
    font-family: var(--yt-baslik);
    font-weight: var(--kalin-tam);
    font-size: 20px;
    letter-spacing: -0.03em;
    /* Orijinalde sari yaziydi: acik zeminde kontrast 1.66, okunmuyordu.
       Sari yanindaki logo gorselinde tam tonuyla duruyor; yazi murekkebe
       alindi (15.9). Marka kimligi isarette, okunurluk yazida. */
    color: var(--murekkep);
}

body[data-yeni] .nav-links > li > a {
    font-family: var(--yt-metin);
    font-size: .8125rem;
    font-weight: var(--kalin-orta);
    color: var(--murekkep-alt);
    padding: 8px 12px;
    border-radius: var(--y-sm);
    transition: background var(--gecis-hizli), color var(--gecis-hizli);
}
body[data-yeni] .nav-links > li > a:hover {
    background: #eceef1;
    color: var(--murekkep);
}
/* Etkin sayfa: sari dolgu. shell.js bu sinifi veriyor.
   Yazi rengi burada TANIMLANMIYOR: base.css'te `color:#000 !important`
   duruyor ve zaten kazaniyor. Siyah, sari uzerinde 12.4 kontrast veriyor —
   benim koyacagim tondan daha iyi, dokunmaya gerek yok. Butun sayfalar
   tasindiginda base.css sadelesirken bu not birlikte gozden gecirilecek. */
body[data-yeni] .nav-links > li > a.nav-active {
    background: var(--sari);
    font-weight: var(--kalin-yari);
}

body[data-yeni] .dropdown-menu {
    border: 1px solid var(--cizgi);
    border-radius: var(--y-md);
    box-shadow: var(--g-lg);
    overflow: hidden;
}
body[data-yeni] .dropdown-menu a {
    font-size: .8125rem;
    color: var(--murekkep-alt);
}

body[data-yeni] .menu-toggle {
    min-width: var(--dokunma);
    min-height: var(--dokunma);
    border-radius: var(--y-md);
}

/* ══════════ KABUK: ORTAK AFISI ══════════ */

body[data-yeni] .carousel-banner {
    background: var(--zemin);
    border-bottom: 1px solid var(--cizgi);
}
body[data-yeni] .carousel-item {
    border: 1px solid var(--cizgi);
    border-radius: var(--y-md);
    background: var(--zemin);
}
body[data-yeni] .carousel-title {
    font-size: .6875rem;
    font-weight: var(--kalin-yari);
    letter-spacing: .06em;
    color: var(--murekkep-alt);   /* 10px — kucuk metin, --murekkep-sol yetmez */
}
body[data-yeni] .carousel-name {
    font-weight: var(--kalin-yari);
    font-size: .75rem;
    color: var(--murekkep);
}

/* ══════════ KABUK: ALTBILGI ══════════ */

body[data-yeni] footer {
    background: var(--murekkep);
    color: #b9bfca;
}
body[data-yeni] .footer-container { max-width: 1100px; }
body[data-yeni] .footer-column h4 {
    font-family: var(--yt-metin);
    font-size: .6875rem;
    font-weight: var(--kalin-yari);
    letter-spacing: var(--arali-etiket);
    text-transform: uppercase;
    /* Koyu zeminde sari serbest — kontrasti 9.87 */
    color: var(--sari);
    margin-bottom: var(--b-4);
}
body[data-yeni] .footer-column a {
    font-size: .8125rem;
    color: #b9bfca;
    text-decoration: none;
}
body[data-yeni] .footer-column a:hover { color: #fff; }
body[data-yeni] .footer-bottom {
    border-top: 1px solid #2f333c;
    font-size: .75rem;
    color: #868d99;                     /* koyu zeminde 5.04 */
}

/* ══════════ SAYFA: BUTON ══════════
   Orijinal: siyah zemin, beyaz yazi, 6px. Korundu, yaricap 10px. */

body[data-yeni] .yeni-dugme {
    font-family: var(--yt-metin);
    font-size: .875rem;
    font-weight: var(--kalin-yari);
    min-height: var(--dokunma);
    padding: 12px 26px;
    border: none;
    border-radius: var(--y-md);
    cursor: pointer;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: var(--murekkep);
    color: #fff;
    transition: background var(--gecis-hizli), transform var(--gecis-hizli);
}
body[data-yeni] .yeni-dugme:hover { background: #000; transform: translateY(-1px); }

/* Sari hero uzerinde ikincil buton */
body[data-yeni] .yeni-dugme.acik {
    background: rgba(255,255,255,.92);
    color: var(--murekkep);
}
body[data-yeni] .yeni-dugme.acik:hover { background: #fff; }

/* ══════════ SAYFA: HERO ══════════
   Orijinalin kendi degradesi, birebir. */

body[data-yeni] .yeni-hero {
    background: linear-gradient(135deg, var(--sari) 0%, var(--sari-acik) 100%);
    text-align: center;
    padding: clamp(3.25rem, 6vw, 5rem) var(--b-5);
}
body[data-yeni] .yeni-hero h1 {
    font-size: clamp(2.125rem, 4.6vw, 2.875rem);   /* orijinal 36px sabitti */
    color: #1a1400;                                 /* sari uzerinde 10.75 */
    margin-bottom: var(--b-4);
}
body[data-yeni] .yeni-hero p {
    font-size: 1.0625rem;
    line-height: 1.6;
    color: #3a2c00;                                 /* 7.98 */
    max-width: 640px;                               /* orijinalle ayni */
    margin: 0 auto var(--b-6);
}
body[data-yeni] .yeni-eylem {
    display: flex;
    gap: var(--b-3);
    justify-content: center;
    flex-wrap: wrap;
}

/* ══════════ SAYFA: BOLUM ══════════
   Orijinalin beyaz / #f9f9f9 donusumu korundu. Bosluk 40px -> 72px:
   orijinalde bolumler birbirine yapisikti. */

body[data-yeni] .yeni-bolum { padding: clamp(3rem, 5.5vw, 4.5rem) 0; }
body[data-yeni] .yeni-bolum.gri { background: var(--zemin-alt); }

body[data-yeni] .yeni-bolum-basligi { text-align: center; margin-bottom: var(--b-7); }
body[data-yeni] .yeni-bolum-basligi h2 {
    font-size: clamp(1.5rem, 2.6vw, 1.6875rem);    /* orijinal 20px, h1'e cok yakindi */
    margin-bottom: var(--b-3);
}
body[data-yeni] .yeni-bolum-basligi p {
    color: var(--murekkep-alt);
    max-width: 56ch;
    margin: 0 auto;
}
/* Sari yazi olamiyor; basligin altinda cizgi olarak duruyor. */
body[data-yeni] .yeni-bolum-basligi::after {
    content: "";
    display: block;
    width: 44px; height: 3px;
    border-radius: 2px;
    background: var(--sari);
    margin: var(--b-4) auto 0;
}

/* ══════════ SAYFA: SAYAÇLAR ══════════ */

body[data-yeni] .yeni-sayilar {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: var(--b-4);
}
body[data-yeni] .yeni-sayi {
    text-align: center;
    padding: var(--b-5) var(--b-4);
    background: var(--zemin);
    border: 1px solid var(--cizgi);      /* orijinalde tamamen ciplakti */
    border-radius: var(--y-lg);
    transition: border-color var(--gecis-hizli), box-shadow var(--gecis-hizli);
}
body[data-yeni] .yeni-sayi:hover {
    border-color: var(--sari);
    box-shadow: 0 4px 16px rgba(251,188,5,.16);
}
body[data-yeni] .yeni-sayi-deger {
    display: block;
    font-family: var(--yt-baslik);
    font-weight: var(--kalin-tam);
    font-size: 2.5rem;
    line-height: 1;
    letter-spacing: -0.04em;
    font-variant-numeric: tabular-nums;
    margin-bottom: var(--b-3);
}
body[data-yeni] .yeni-sayi-etiket {
    font-size: .8125rem;
    color: var(--murekkep-alt);
    line-height: 1.4;
}

/* ══════════ SAYFA: IKI SUTUN ══════════ */

body[data-yeni] .yeni-ikili {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: clamp(2rem, 4vw, 3.5rem);
}
body[data-yeni] .yeni-ikili h2 { font-size: 1.5rem; margin-bottom: var(--b-4); }
body[data-yeni] .yeni-ikili p { color: var(--murekkep-alt); max-width: var(--olcu-metin); }
body[data-yeni] .yeni-ikili p + p { margin-top: var(--b-4); }

body[data-yeni] .yeni-hedefler { display: grid; gap: var(--b-3); }
body[data-yeni] .yeni-hedefler li {
    display: grid;
    grid-template-columns: 20px 1fr;
    gap: var(--b-3);
    align-items: start;
    color: var(--murekkep-alt);
    font-size: .90625rem;
    line-height: 1.6;
}
body[data-yeni] .yeni-hedefler li::before {
    content: "\2713";
    font-size: .75rem;
    font-weight: 700;
    color: var(--yesil-yazi);
    line-height: 1.7;
}

/* ══════════ SAYFA: KARTLAR ══════════
   Orijinalin sari hover golgesi korundu — o efekt sitenin kendi imzasi. */

body[data-yeni] .yeni-kartlar {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: var(--b-4);
}
body[data-yeni] .yeni-kart {
    background: var(--zemin);
    border: 1px solid var(--cizgi);
    border-radius: var(--y-lg);
    padding: var(--b-5);
    text-align: center;
    transition: border-color var(--gecis-hizli), box-shadow var(--gecis-hizli),
                transform var(--gecis-hizli);
}
body[data-yeni] .yeni-kart:hover {
    border-color: var(--sari);
    box-shadow: 0 8px 24px rgba(251,188,5,.12);
    transform: translateY(-2px);
}
body[data-yeni] .yeni-kart-im { font-size: 30px; line-height: 1; margin-bottom: var(--b-4); }
body[data-yeni] .yeni-kart h3 {
    font-size: 1.0625rem;
    font-weight: var(--kalin-yari);
    line-height: 1.3;
    margin-bottom: var(--b-2);
}
body[data-yeni] .yeni-kart p {
    font-size: .875rem;
    color: var(--murekkep-alt);
    line-height: 1.6;
}

/* ══════════ SAYFA: UYELIK ══════════ */

body[data-yeni] .yeni-uyelik {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: var(--b-4);
    max-width: 780px;
    margin: 0 auto;
}
body[data-yeni] .yeni-uye {
    background: var(--zemin);
    border: 1px solid var(--cizgi);
    border-radius: var(--y-lg);
    padding: var(--b-6) var(--b-5);
    text-align: center;
    transition: border-color var(--gecis-hizli), box-shadow var(--gecis-hizli);
}
body[data-yeni] .yeni-uye:hover {
    border-color: var(--sari);
    box-shadow: 0 8px 24px rgba(251,188,5,.12);
}
body[data-yeni] .yeni-uye.one-cikan { border-color: var(--sari); border-width: 2px; }
body[data-yeni] .yeni-uye-im { font-size: 34px; line-height: 1; margin-bottom: var(--b-3); }
body[data-yeni] .yeni-uye-rol {
    display: inline-block;
    font-size: .6875rem;
    font-weight: 700;
    letter-spacing: var(--arali-etiket);
    text-transform: uppercase;
    color: #6b5200;                      /* #fff4d1 uzerinde 6.75 */
    background: #fff4d1;
    padding: 4px 10px;
    border-radius: var(--y-tam);
    margin-bottom: var(--b-3);
}
body[data-yeni] .yeni-uye h3 { font-size: 1.375rem; margin-bottom: var(--b-3); }
body[data-yeni] .yeni-uye p {
    font-size: .875rem;
    color: var(--murekkep-alt);
    line-height: 1.6;
}

/* ══════════ SAYFA: KURESEL ERISIM ══════════ */

body[data-yeni] .yeni-kitalar {
    display: grid;
    /* 420px taban: genis ekranda 2 sutun. 250px'te 4 sutun oluyordu ve
       ulke satiri "ad + ortak + rozet"i yan yana sigdiramiyordu; ortak
       adlari uc noktayla kesiliyordu. Icerik kesmek yerine sutun sayisi
       dusuruldu. */
    grid-template-columns: repeat(auto-fit, minmax(420px, 1fr));
    gap: var(--b-4);
    /* Her kart KENDI icerigi kadar. Varsayilan `stretch` ile Africa
       kartu -icinde tek satir "Coming soon" var- Avrupa'nin boyuna
       cekiliyor ve 926px'lik bos bir kutuya donusuyordu. */
    align-items: start;
}
body[data-yeni] .yeni-kita {
    background: var(--zemin);
    border: 1px solid var(--cizgi);
    border-radius: var(--y-lg);
    overflow: hidden;
}
body[data-yeni] .yeni-kita-ust {
    display: flex;
    align-items: center;
    gap: var(--b-3);
    padding: var(--b-4) var(--b-5);
    background: var(--zemin-alt);
    border-bottom: 1px solid var(--cizgi);
}
body[data-yeni] .yeni-kita-ust h3 { font-size: 1.0625rem; }
body[data-yeni] .yeni-kita-adet {
    margin-left: auto;
    font-size: .6875rem;
    font-weight: var(--kalin-yari);
    color: var(--murekkep-alt);
    background: var(--zemin);
    border: 1px solid var(--cizgi);
    border-radius: var(--y-tam);
    padding: 3px 10px;
    font-variant-numeric: tabular-nums;
}
/* Ulke satiri TEK SATIR: bayrak · ad · ortak · rozet yan yana.
   Once ad ve ortak alt alta duruyordu; dar sutunda ikisi de sariyor ve
   satir 65-92px'e cikiyordu. 14 ulkeyle bu, ana sayfada 1.6 metrelik
   bir blok demekti. Yan yana dizilince satir ~40px'e iniyor. */
body[data-yeni] .yeni-ulke {
    display: flex;
    align-items: baseline;
    gap: var(--b-2);
    padding: 9px var(--b-4);
    flex-wrap: nowrap;
}
body[data-yeni] .yeni-ulke + .yeni-ulke { border-top: 1px solid var(--cizgi); }
body[data-yeni] .yeni-bayrak { font-size: 18px; line-height: 1; }
/* Ad ve ortak YAN YANA. Onceki halinde .yeni-ulke-ad display:block idi,
   yani ikisi alt alta diziliyordu; dar sutunda ikisi de sariyor ve satir
   64-91px'e cikiyordu. 14 ulkeyle bu, ana sayfada 1.6 metrelik bir blok
   demekti. */
body[data-yeni] .yeni-ulke > span:nth-child(2) {
    display: flex;
    align-items: baseline;
    gap: var(--b-2);
    flex: 1;
    min-width: 0;
}
body[data-yeni] .yeni-ulke-ad {
    font-weight: var(--kalin-yari);
    font-size: .8125rem;
    line-height: 1.35;
    white-space: nowrap;
}
/* --murekkep-sol beyazda 3.43 verir ve token'in kendi notu "sadece buyuk
   metin" diyor. Burasi kucuk metin: esik 4.5. --murekkep-alt (5.92).
   Daralinca ortak adi kesilir; ulke adi hep tam gorunur. */
body[data-yeni] .yeni-ulke-ort {
    font-size: .6875rem;
    color: var(--murekkep-alt);
    line-height: 1.35;
    margin-left: auto;
    white-space: nowrap;
    /* Sutunlar genisletildigi icin normalde kesme olmuyor; cok dar bir
       ekranda tasmasin diye guvenlik agi olarak duruyor. */
    overflow: hidden;
    text-overflow: ellipsis;
}
body[data-yeni] .yeni-aktif {
    font-size: .6875rem;
    font-weight: 700;
    letter-spacing: .04em;
    color: var(--olumlu);                /* kendi zemini --olumlu-alan */
    background: var(--olumlu-alan);
    border-radius: var(--y-tam);
    padding: 3px 8px;
    white-space: nowrap;
}

@media (prefers-reduced-motion: reduce) {
    body[data-yeni] * { transition: none !important; }
    body[data-yeni] .yeni-kart:hover,
    body[data-yeni] .yeni-dugme:hover { transform: none; }
}

/* ══════════════════════════════════════════════════════════════════
   AILE: KOMITELER  (indeks + 5 detay sayfasi)
   ══════════════════════════════════════════════════════════════════ */

/* ── Gorselli hero — komite detay sayfalarinin ustu ──
   Ayni sari degrade, ustune komite kapak gorseli. */
body[data-yeni] .yeni-hero-gorsel {
    width: 84px; height: 84px;
    object-fit: contain;
    margin: 0 auto var(--b-4);
    display: block;
    border-radius: var(--y-lg);
    background: rgba(255,255,255,.55);
    padding: var(--b-2);
}

/* Geri baglantisi — hero icinde, sari uzerinde */
body[data-yeni] .yeni-geri {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: var(--dokunma);
    padding: 10px 20px;
    border: 1.5px solid rgba(26,20,0,.28);
    border-radius: var(--y-md);
    background: transparent;
    color: #1a1400;                        /* sari uzerinde 10.75 */
    font-family: var(--yt-metin);
    font-size: .875rem;
    font-weight: var(--kalin-yari);
    cursor: pointer;
    transition: background var(--gecis-hizli), border-color var(--gecis-hizli);
}
body[data-yeni] .yeni-geri:hover {
    background: rgba(255,255,255,.55);
    border-color: #1a1400;
}
/* Sayfa sonundaki geri butonu — beyaz zeminde */
body[data-yeni] .yeni-geri.duz {
    border-color: var(--cizgi-koyu);
    color: var(--murekkep);
}
body[data-yeni] .yeni-geri.duz:hover {
    background: var(--murekkep);
    border-color: var(--murekkep);
    color: #fff;
}

/* ── Komite indeks izgarasi ──
   Her komitenin kendi rengi --renk ile geliyor. Renk sadece dolgu ve
   golge olarak kullaniliyor; uzerine yazi yazilmiyor. Bu yuzden turkuaz
   (#57f4d8) ve pembe gibi acik tonlar burada serbest. */
body[data-yeni] .yeni-komiteler {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: var(--b-4);
}
body[data-yeni] .yeni-komite {
    background: var(--zemin);
    border: 1px solid var(--cizgi);
    border-top: 3px solid var(--renk, var(--sari));
    border-radius: var(--y-lg);
    padding: var(--b-5);
    text-align: center;
    cursor: pointer;
    transition: transform var(--gecis-orta), box-shadow var(--gecis-orta),
                border-color var(--gecis-orta);
}
body[data-yeni] .yeni-komite:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 32px var(--golge, rgba(251,188,5,.18));
}
body[data-yeni] .yeni-komite img {
    width: 68px; height: 68px;
    object-fit: contain;
    margin: 0 auto var(--b-4);
    display: block;
}
body[data-yeni] .yeni-komite h3 {
    font-size: 1.0625rem;
    font-weight: var(--kalin-yari);
    line-height: 1.3;
    margin-bottom: var(--b-2);
}
body[data-yeni] .yeni-komite p {
    font-size: .875rem;
    color: var(--murekkep-alt);
    line-height: 1.55;
    margin-bottom: var(--b-4);
}
body[data-yeni] .yeni-komite-git {
    font-size: .8125rem;
    font-weight: var(--kalin-yari);
    color: var(--mavi-yazi);
}

/* ── Odak alanlari listesi ── */
body[data-yeni] .yeni-odak { display: grid; gap: var(--b-3); }
body[data-yeni] .yeni-odak li {
    display: grid;
    grid-template-columns: 18px 1fr;
    gap: var(--b-3);
    align-items: start;
    font-size: .90625rem;
    line-height: 1.6;
    color: var(--murekkep-alt);
}
body[data-yeni] .yeni-odak li::before {
    content: "";
    width: 9px; height: 9px;
    margin-top: .6em;
    border-radius: 2px;
    background: var(--renk, var(--sari));
}

/* ── Proje karti (komite ve proje sayfalarinda ortak) ── */
body[data-yeni] .yeni-projeler {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: var(--b-4);
}
body[data-yeni] .yeni-proje {
    background: var(--zemin);
    border: 1px solid var(--cizgi);
    border-radius: var(--y-lg);
    padding: var(--b-5);
    cursor: pointer;
    text-align: left;
    transition: border-color var(--gecis-hizli), box-shadow var(--gecis-hizli),
                transform var(--gecis-hizli);
}
body[data-yeni] .yeni-proje:hover {
    border-color: var(--sari);
    box-shadow: 0 8px 24px rgba(251,188,5,.12);
    transform: translateY(-2px);
}
body[data-yeni] .yeni-etiket {
    display: inline-block;
    font-size: .6875rem;
    font-weight: 700;
    letter-spacing: var(--arali-etiket);
    text-transform: uppercase;
    color: var(--murekkep-alt);
    background: var(--zemin-alt);
    border: 1px solid var(--cizgi);
    border-radius: var(--y-tam);
    padding: 4px 10px;
    margin-bottom: var(--b-3);
}
body[data-yeni] .yeni-proje h4 {
    font-size: 1.0625rem;
    font-weight: var(--kalin-yari);
    line-height: 1.35;
    margin-bottom: var(--b-2);
}
body[data-yeni] .yeni-proje p {
    font-size: .875rem;
    color: var(--murekkep-alt);
    line-height: 1.6;
}
body[data-yeni] .yeni-proje-git {
    display: inline-block;
    margin-top: var(--b-3);
    font-size: .8125rem;
    font-weight: var(--kalin-yari);
    color: var(--mavi-yazi);
}

/* ── Uye mektuplari ── */
body[data-yeni] .yeni-mektup {
    max-width: 780px;
    margin: 0 auto;
    background: var(--zemin);
    border: 1px solid var(--cizgi);
    border-radius: var(--y-lg);
    padding: var(--b-6) var(--b-5);
}
/* Saf sus. aria-hidden tasiyor: ekran okuyucu atliyor, kontrast kurali
   disinda kaliyor (WCAG 1.4.3 "pure decoration"). Sari burada serbest. */
body[data-yeni] .yeni-tirnak {
    font-family: var(--yt-baslik);
    font-size: 46px;
    line-height: .7;
    color: var(--sari);
    margin-bottom: var(--b-3);
}
body[data-yeni] .yeni-mektup-metin {
    font-size: .96875rem;
    line-height: 1.75;
    color: var(--murekkep-alt);
    margin-bottom: var(--b-5);
}
body[data-yeni] .yeni-imza {
    display: flex;
    align-items: center;
    gap: var(--b-4);
    padding-top: var(--b-4);
    border-top: 1px solid var(--cizgi);
    flex-wrap: wrap;
}
body[data-yeni] .yeni-imza img {
    width: 52px; height: 52px;
    border-radius: 50%;
    object-fit: cover;
    flex: none;
}
body[data-yeni] .yeni-imza-ad {
    font-weight: var(--kalin-yari);
    font-size: .9375rem;
    margin-bottom: 3px;
}
body[data-yeni] .yeni-imza-detay {
    display: flex;
    flex-wrap: wrap;
    gap: var(--b-2);
    font-size: .75rem;
    color: var(--murekkep-alt);
}
body[data-yeni] .yeni-imza-detay span {
    background: var(--zemin-alt);
    border: 1px solid var(--cizgi);
    border-radius: var(--y-tam);
    padding: 2px 9px;
}

/* ── "Yakinda aciliyor" blogu — henuz baslamamis komiteler ── */
body[data-yeni] .yeni-yakinda {
    max-width: 620px;
    margin: 0 auto;
    text-align: center;
    background: var(--zemin-alt);
    border: 1px solid var(--cizgi);
    border-radius: var(--y-lg);
    padding: var(--b-7) var(--b-5);
}
body[data-yeni] .yeni-yakinda-im { font-size: 38px; line-height: 1; margin-bottom: var(--b-4); }
body[data-yeni] .yeni-yakinda h2 { font-size: 1.5rem; margin-bottom: var(--b-3); }
body[data-yeni] .yeni-yakinda p {
    font-size: .9375rem;
    color: var(--murekkep-alt);
    line-height: 1.7;
    max-width: 52ch;
    margin: 0 auto;
}

/* ══════════════════════════════════════════════════════════════════
   AILE: PROJELER  (liste + 3 detay sayfasi)
   ══════════════════════════════════════════════════════════════════ */

/* ── Durum rozeti — projenin nerede oldugunu soyler ──
   Renk anlam tasiyor: devam eden / yaklasan / tamamlanan. Bu yuzden
   marka renklerinden degil, anlam renklerinden (--olumlu vb.) geliyor. */
body[data-yeni] .yeni-durum {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: .6875rem;
    font-weight: 700;
    letter-spacing: var(--arali-etiket);
    text-transform: uppercase;
    border-radius: var(--y-tam);
    padding: 4px 10px;
    white-space: nowrap;
}
body[data-yeni] .yeni-durum.bitti   { color: var(--olumlu); background: var(--olumlu-alan); }
body[data-yeni] .yeni-durum.suruyor { color: var(--uyari);  background: var(--uyari-alan); }

/* ── Liste satiri — yaklasan / tamamlanan projeler ── */
body[data-yeni] .yeni-liste { display: grid; gap: var(--b-4); }
body[data-yeni] .yeni-satir {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--b-5);
    align-items: start;
    background: var(--zemin);
    border: 1px solid var(--cizgi);
    border-radius: var(--y-lg);
    padding: var(--b-5);
    transition: border-color var(--gecis-hizli), box-shadow var(--gecis-hizli);
}
body[data-yeni] .yeni-satir.tiklanir { cursor: pointer; }
body[data-yeni] .yeni-satir.tiklanir:hover {
    border-color: var(--sari);
    box-shadow: 0 8px 24px rgba(251,188,5,.12);
}
body[data-yeni] .yeni-satir-ust {
    display: flex;
    flex-wrap: wrap;
    gap: var(--b-2);
    align-items: center;
    margin-bottom: var(--b-3);
}
body[data-yeni] .yeni-satir h4 {
    font-size: 1.0625rem;
    font-weight: var(--kalin-yari);
    line-height: 1.35;
    margin-bottom: var(--b-2);
}
body[data-yeni] .yeni-satir > div > p {
    font-size: .875rem;
    color: var(--murekkep-alt);
    line-height: 1.65;
    margin-bottom: var(--b-4);
}
/* Kunye satiri: ortak, ulke, tarih, sorumlu */
body[data-yeni] .yeni-kunye {
    display: flex;
    flex-wrap: wrap;
    gap: var(--b-2);
    font-size: .75rem;
    color: var(--murekkep-alt);
}
body[data-yeni] .yeni-kunye span {
    background: var(--zemin-alt);
    border: 1px solid var(--cizgi);
    border-radius: var(--y-tam);
    padding: 3px 10px;
}
body[data-yeni] .yeni-satir-eylem {
    display: flex;
    flex-direction: column;
    gap: var(--b-2);
    align-items: stretch;
}
body[data-yeni] .yeni-kucuk-dugme {
    font-family: var(--yt-metin);
    font-size: .8125rem;
    font-weight: var(--kalin-yari);
    min-height: var(--dokunma);
    padding: 10px 18px;
    border: 1.5px solid var(--cizgi-koyu);
    border-radius: var(--y-md);
    background: transparent;
    color: var(--murekkep);
    cursor: pointer;
    white-space: nowrap;
    transition: background var(--gecis-hizli), color var(--gecis-hizli),
                border-color var(--gecis-hizli);
}
body[data-yeni] .yeni-kucuk-dugme:hover {
    background: var(--murekkep);
    border-color: var(--murekkep);
    color: #fff;
}
body[data-yeni] .yeni-tur {
    font-size: .6875rem;
    font-weight: var(--kalin-yari);
    color: var(--murekkep-alt);
    background: var(--zemin-alt);
    border: 1px solid var(--cizgi);
    border-radius: var(--y-md);
    padding: 6px 12px;
    white-space: nowrap;
    text-align: center;
}

/* ── Proje detay: kunye izgarasi ── */
body[data-yeni] .yeni-kunye-izgara {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: var(--b-4);
    margin-top: var(--b-6);
}
body[data-yeni] .yeni-kunye-kutu {
    background: var(--zemin);
    border: 1px solid var(--cizgi);
    border-radius: var(--y-lg);
    padding: var(--b-4) var(--b-5);
    display: flex;
    align-items: center;
    gap: var(--b-4);
}
body[data-yeni] .yeni-kunye-kutu img {
    width: 52px; height: 52px;
    border-radius: 50%;
    object-fit: cover;
    flex: none;
}
body[data-yeni] .yeni-kunye-kutu h4 {
    font-family: var(--yt-metin);
    font-size: .6875rem;
    font-weight: 700;
    letter-spacing: var(--arali-etiket);
    text-transform: uppercase;
    color: var(--murekkep-alt);
    margin-bottom: 4px;
}
body[data-yeni] .yeni-kunye-kutu p {
    font-size: .9375rem;
    font-weight: var(--kalin-orta);
    line-height: 1.35;
}
body[data-yeni] .yeni-kunye-kutu p + p {
    font-size: .75rem;
    font-weight: var(--kalin-metin);
    color: var(--murekkep-alt);
    margin-top: 2px;
}

/* ── Ciktilar ── */
body[data-yeni] .yeni-ciktilar {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: var(--b-4);
}
body[data-yeni] .yeni-cikti {
    background: var(--zemin);
    border: 1px solid var(--cizgi);
    border-left: 3px solid var(--sari);
    border-radius: var(--y-lg);
    padding: var(--b-5);
}
body[data-yeni] .yeni-cikti h4 {
    font-size: .9375rem;
    font-weight: var(--kalin-yari);
    line-height: 1.35;
    margin-bottom: var(--b-2);
}
body[data-yeni] .yeni-cikti p {
    font-size: .875rem;
    color: var(--murekkep-alt);
    line-height: 1.65;
}

/* ── Tek sutunlu icerik blogu (proje detay bolumleri) ── */
body[data-yeni] .yeni-tek { max-width: 860px; margin: 0 auto; }
body[data-yeni] .yeni-tek h3 {
    font-size: 1.375rem;
    margin-bottom: var(--b-4);
}
body[data-yeni] .yeni-tek > p {
    color: var(--murekkep-alt);
    max-width: var(--olcu-metin);
}

@media (max-width: 720px) {
    body[data-yeni] .yeni-satir { grid-template-columns: 1fr; }
    body[data-yeni] .yeni-satir-eylem { flex-direction: row; flex-wrap: wrap; }
}

/* ══════════════════════════════════════════════════════════════════
   AILE: ILETISIM · MAKALE LISTESI · ETKINLIKLER
   ══════════════════════════════════════════════════════════════════ */

/* ── Iletisim kanallari ── */
body[data-yeni] .yeni-kanallar {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: var(--b-4);
    max-width: 820px;
    margin: 0 auto;
}
body[data-yeni] .yeni-kanal {
    background: var(--zemin);
    border: 1px solid var(--cizgi);
    border-radius: var(--y-lg);
    padding: var(--b-5);
    transition: border-color var(--gecis-hizli), box-shadow var(--gecis-hizli);
}
body[data-yeni] .yeni-kanal:hover {
    border-color: var(--sari);
    box-shadow: 0 8px 24px rgba(251,188,5,.12);
}
body[data-yeni] .yeni-kanal-ad {
    font-family: var(--yt-baslik);
    font-size: 1rem;
    font-weight: var(--kalin-yari);
    letter-spacing: var(--arali-orta);
    margin-bottom: var(--b-2);
}
body[data-yeni] .yeni-kanal-not {
    font-size: .8125rem;
    color: var(--murekkep-alt);
    margin-bottom: var(--b-3);
}
body[data-yeni] .yeni-kanal a {
    font-size: .9375rem;
    font-weight: var(--kalin-yari);
    color: var(--mavi-yazi);
    word-break: break-word;
}

/* ── Makale listesi: arama ve suzgec ── */
body[data-yeni] .yeni-arama {
    position: relative;
    max-width: 520px;
    margin: 0 auto var(--b-5);
}
body[data-yeni] .yeni-arama svg {
    position: absolute;
    left: 14px; top: 50%;
    transform: translateY(-50%);
    color: var(--murekkep-alt);
    pointer-events: none;
}
body[data-yeni] .yeni-arama input {
    width: 100%;
    font-family: var(--yt-metin);
    font-size: 1rem;                      /* 16px altinda iOS Safari odakta yakinlastirir (Kc2) */
    color: var(--murekkep);
    background: var(--zemin);
    /* Girdi kenarligi dekoratif degil: gorulemezse alan gorulemez.
       --cizgi-girdi tam bu esik icin (beyazda 3.00). */
    border: 1.5px solid var(--cizgi-girdi);
    border-radius: var(--y-md);
    padding: 12px 16px 12px 40px;
    min-height: var(--dokunma);
}
body[data-yeni] .yeni-arama input::placeholder { color: var(--murekkep-alt); }
body[data-yeni] .yeni-arama input:focus { border-color: var(--mavi-yazi); }

body[data-yeni] .yeni-suzgecler {
    display: flex;
    flex-wrap: wrap;
    gap: var(--b-2);
    align-items: center;
    justify-content: center;
    margin-bottom: var(--b-4);
}
body[data-yeni] .yeni-suzgec-etiket {
    font-size: .75rem;
    font-weight: var(--kalin-yari);
    color: var(--murekkep-alt);
}
/* Suzgec dugmeleri: secili olan DOLU, digerleri cizgili.
   Secili durum sadece renkle degil, dolgu+kalinlikla da belli oluyor -
   renk korlugunde de ayirt edilebilir. */
body[data-yeni] .yeni-suzgec {
    font-family: var(--yt-metin);
    font-size: .8125rem;
    font-weight: var(--kalin-orta);
    min-height: var(--dokunma);
    padding: 9px 16px;
    border: 1.5px solid var(--cizgi-koyu);
    border-radius: var(--y-tam);
    background: transparent;
    color: var(--murekkep-alt);
    cursor: pointer;
    transition: background var(--gecis-hizli), color var(--gecis-hizli),
                border-color var(--gecis-hizli);
}
body[data-yeni] .yeni-suzgec:hover {
    border-color: var(--murekkep);
    color: var(--murekkep);
}
body[data-yeni] .yeni-suzgec[aria-pressed="true"] {
    background: var(--murekkep);
    border-color: var(--murekkep);
    color: #fff;
    font-weight: var(--kalin-yari);
}
body[data-yeni] .yeni-siralama {
    font-family: var(--yt-metin);
    font-size: .8125rem;
    min-height: var(--dokunma);
    padding: 9px 14px;
    border: 1.5px solid var(--cizgi-girdi);
    border-radius: var(--y-md);
    background: var(--zemin);
    color: var(--murekkep);
    cursor: pointer;
}
body[data-yeni] .yeni-sayim {
    text-align: center;
    font-size: .8125rem;
    color: var(--murekkep-alt);
    margin-bottom: var(--b-5);
}

/* ── Makale karti (articles.js uretiyor) ── */
body[data-yeni] .yeni-makaleler { display: grid; gap: var(--b-4); }
body[data-yeni] .yeni-makale {
    display: block;
    background: var(--zemin);
    border: 1px solid var(--cizgi);
    border-radius: var(--y-lg);
    padding: var(--b-6);
    text-decoration: none;
    color: inherit;
    transition: border-color var(--gecis-hizli), box-shadow var(--gecis-hizli);
}
body[data-yeni] .yeni-makale:hover {
    border-color: var(--sari);
    box-shadow: 0 8px 24px rgba(251,188,5,.12);
}
body[data-yeni] .yeni-makale-rozetler {
    display: flex;
    gap: var(--b-2);
    flex-wrap: wrap;
    margin-bottom: var(--b-4);
}
/* Komite rozeti: marka rengi uzerine BEYAZ yazi AA'yi gecmiyordu
   (yesil 3.06, mavi 3.56, kirmizi 3.92). Cozum, rengi acik tonda zemin
   olarak kullanip yaziyi ayni tonun koyu metin varyantiyla yazmak.
   Komite yine renginden taniniyor, yazi da okunuyor. */
body[data-yeni] .yeni-komite-rozet {
    font-size: .6875rem;
    font-weight: 700;
    border-radius: var(--y-tam);
    padding: 4px 11px;
    border: 1px solid currentColor;
}
/* Cift olarak dogrulanmis zemin+yazi token'lari; bkz. tokens.css. */
body[data-yeni] .yeni-komite-rozet.biological  { color: var(--yesil-alan-yazi);   background: var(--yesil-alan); }
body[data-yeni] .yeni-komite-rozet.sustainable { color: var(--mavi-alan-yazi);    background: var(--mavi-alan); }
body[data-yeni] .yeni-komite-rozet.womens      { color: var(--kirmizi-alan-yazi); background: var(--kirmizi-alan); }

body[data-yeni] .yeni-makale h3 {
    font-size: 1.25rem;
    line-height: 1.35;
    margin-bottom: var(--b-3);
}
body[data-yeni] .yeni-makale-ozet {
    font-size: .875rem;
    color: var(--murekkep-alt);
    line-height: 1.7;
    margin-bottom: var(--b-4);
    max-width: var(--olcu-metin);
}
body[data-yeni] .yeni-makale-kunye {
    display: flex;
    flex-wrap: wrap;
    gap: var(--b-4);
    font-size: .75rem;
    color: var(--murekkep-alt);
}
body[data-yeni] .yeni-makale-kunye strong { color: var(--murekkep); font-weight: var(--kalin-yari); }
body[data-yeni] .yeni-makale-git {
    display: inline-block;
    margin-top: var(--b-4);
    font-size: .8125rem;
    font-weight: var(--kalin-yari);
    /* Orijinalde bu satir sari yaziyla yazilmisti: beyazda 1.71,
       okunmuyordu. Mavi metin varyantina alindi. */
    color: var(--mavi-yazi);
}

body[data-yeni] .yeni-bos-sonuc {
    text-align: center;
    padding: var(--b-8) var(--b-5);
    background: var(--zemin-alt);
    border: 1px solid var(--cizgi);
    border-radius: var(--y-lg);
}
body[data-yeni] .yeni-bos-sonuc-im { font-size: 34px; line-height: 1; margin-bottom: var(--b-3); }
body[data-yeni] .yeni-bos-sonuc h3 { font-size: 1.125rem; margin-bottom: var(--b-2); }
body[data-yeni] .yeni-bos-sonuc p { font-size: .875rem; color: var(--murekkep-alt); }

/* ── Icerigi bekleyen sayfa ──
   /events/ govdesi BILEREK BOS. Buraya dolgu metin yazilmiyor; sayfa
   iskeleti duruyor, icerik Yigit'ten gelecek. */
body[data-yeni] .yeni-bos-sayfa { min-height: 28vh; }

/* Gorsel olarak gizli, ekran okuyucuya acik etiket.
   Arama kutusu ve siralama menusunun yanindaki metin gorsel olarak
   yeterliydi ama <label> bagi yoktu; simdi var. */
body[data-yeni] .yeni-gizli-etiket {
    position: absolute;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

/* ══════════════════════════════════════════════════════════════════
   AILE: HESAP  (giris, sertifika dogrulama, profil)
   Bu uc sayfada afis ve altbilgi gizli (build_page.py -> CIPLAK),
   yani sayfa tek basina duruyor. Ortalanmis dar bir sutun.
   ══════════════════════════════════════════════════════════════════ */

body[data-yeni] .yeni-tek-sutun {
    max-width: 460px;
    margin: 0 auto;
    padding: clamp(2.5rem, 6vw, 4.5rem) var(--b-5);
}
body[data-yeni] .yeni-tek-sutun.genis { max-width: 720px; }

body[data-yeni] .yeni-form-basligi { text-align: center; margin-bottom: var(--b-6); }
body[data-yeni] .yeni-form-im { font-size: 40px; line-height: 1; margin-bottom: var(--b-3); }
body[data-yeni] .yeni-form-basligi h1 { font-size: 1.75rem; margin-bottom: var(--b-2); }
body[data-yeni] .yeni-form-basligi p { font-size: .9375rem; color: var(--murekkep-alt); }

body[data-yeni] .yeni-kutu {
    background: var(--zemin);
    border: 1px solid var(--cizgi);
    border-radius: var(--y-lg);
    padding: var(--b-6);
    box-shadow: var(--g-md);
}

body[data-yeni] .yeni-alan { margin-bottom: var(--b-4); }
body[data-yeni] .yeni-alan label {
    display: block;
    font-size: .8125rem;
    font-weight: var(--kalin-yari);
    margin-bottom: var(--b-2);
}
body[data-yeni] .yeni-girdi {
    width: 100%;
    font-family: var(--yt-metin);
    font-size: 1rem;                      /* 16px altinda iOS Safari odakta yakinlastirir (Kc2) */
    color: var(--murekkep);
    background: var(--zemin);
    /* Kenarlik dekoratif degil: gorulemezse alanin nerede bittigi
       gorulemez. --cizgi-girdi tam bu esik icin (beyazda 3.00). */
    border: 1.5px solid var(--cizgi-girdi);
    border-radius: var(--y-md);
    padding: 12px 14px;
    min-height: var(--dokunma);
}
body[data-yeni] .yeni-girdi::placeholder { color: var(--murekkep-alt); }
body[data-yeni] .yeni-girdi:focus { border-color: var(--mavi-yazi); outline-offset: 1px; }

body[data-yeni] .yeni-girdi-grup { display: flex; gap: var(--b-2); }
body[data-yeni] .yeni-girdi-grup .yeni-girdi { flex: 1; min-width: 0; }
body[data-yeni] .yeni-goz {
    flex: none;
    min-width: var(--dokunma);
    min-height: var(--dokunma);
    border: 1.5px solid var(--cizgi-girdi);
    border-radius: var(--y-md);
    background: var(--zemin);
    cursor: pointer;
    font-size: 16px;
}

/* Birincil eylem. Sari zemin + koyu yazi: sari uzerinde #2e2200
   kontrasti 9.14, orijinaldeki sari butonun kimligi korunuyor. */
body[data-yeni] .yeni-ana-dugme {
    width: 100%;
    font-family: var(--yt-metin);
    font-size: .9375rem;
    font-weight: 700;
    min-height: 48px;
    border: none;
    border-radius: var(--y-md);
    background: linear-gradient(135deg, var(--sari), var(--sari-acik));
    color: #2e2200;
    cursor: pointer;
    transition: filter var(--gecis-hizli), transform var(--gecis-hizli);
}
body[data-yeni] .yeni-ana-dugme:hover { filter: brightness(.94); transform: translateY(-1px); }
body[data-yeni] .yeni-ana-dugme:disabled { opacity: .6; cursor: default; transform: none; }

body[data-yeni] .yeni-form-alt {
    text-align: center;
    margin-top: var(--b-5);
    font-size: .875rem;
    color: var(--murekkep-alt);
}
body[data-yeni] .yeni-form-alt a { color: var(--mavi-yazi); font-weight: var(--kalin-yari); cursor: pointer; }
body[data-yeni] .yeni-form-not {
    text-align: center;
    margin-top: var(--b-5);
    font-size: .75rem;
    color: var(--murekkep-alt);
    line-height: 1.7;
}
body[data-yeni] .yeni-sag {
    display: flex;
    justify-content: flex-end;
    margin-bottom: var(--b-4);
    font-size: .8125rem;
}
/* Tek basina duran bir kontrol - cumle icindeki satir ici bir baglanti
   degil. Metin yuksekligi 16px'ti; dokunma hedefi olarak kucuk.
   Dolgu ile 44px'e cikariliyor. */
body[data-yeni] .yeni-sag a {
    color: var(--mavi-yazi);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    min-height: var(--dokunma);
    padding: 0 var(--b-2);
    border-radius: var(--y-sm);
}

/* ── Durum kutusu — hata / basari (login hatasi, sertifika sonucu) ──
   Zemin ve yazi CIFT olarak dogrulanmis token'lardan geliyor. */
body[data-yeni] .yeni-durum-kutu {
    border-radius: var(--y-lg);
    padding: var(--b-5) var(--b-6);
    text-align: center;
    margin-bottom: var(--b-4);
}
body[data-yeni] .yeni-durum-kutu.hata {
    background: var(--olumsuz-alan);
    border: 1px solid var(--olumsuz);
    color: var(--olumsuz);
}
body[data-yeni] .yeni-durum-kutu.basarili {
    background: var(--olumlu-alan);
    border: 1px solid var(--olumlu);
    color: var(--olumlu);
}
body[data-yeni] .yeni-durum-im { font-size: 36px; line-height: 1; margin-bottom: var(--b-3); }
body[data-yeni] .yeni-durum-baslik {
    font-family: var(--yt-baslik);
    font-size: 1rem;
    font-weight: var(--kalin-tam);
    margin-bottom: var(--b-2);
}
body[data-yeni] .yeni-durum-kutu p:last-child {
    font-size: .8125rem;
    color: var(--murekkep-alt);
}

/* Sertifika detay satirlari */
body[data-yeni] .yeni-sertifika { text-align: left; }
body[data-yeni] .yeni-sertifika-ust {
    display: flex;
    align-items: center;
    gap: var(--b-4);
    padding-bottom: var(--b-5);
    margin-bottom: var(--b-5);
    border-bottom: 1px solid var(--cizgi);
}
body[data-yeni] .yeni-sertifika-satir {
    display: flex;
    justify-content: space-between;
    gap: var(--b-4);
    padding: var(--b-3) 0;
    font-size: .875rem;
    border-bottom: 1px solid var(--cizgi);
}
body[data-yeni] .yeni-sertifika-satir:last-child { border-bottom: none; }
body[data-yeni] .yeni-sertifika-satir dt { color: var(--murekkep-alt); }
body[data-yeni] .yeni-sertifika-satir dd { margin: 0; font-weight: var(--kalin-yari); text-align: right; }

/* Sertifika sonucu — verify.js uretiyor */
body[data-yeni] .yeni-sertifika-alt {
    display: flex;
    align-items: center;
    gap: var(--b-2);
    flex-wrap: wrap;
    margin-top: var(--b-4);
    padding-top: var(--b-4);
    border-top: 1px solid var(--cizgi);
}
body[data-yeni] .yeni-sertifika-rozet {
    font-size: .6875rem;
    font-weight: 700;
    border-radius: var(--y-tam);
    padding: 4px 11px;
    border: 1px solid currentColor;
}
/* Sertifika turu rengi: uyelik yesil, proje mavi. Cift olarak
   dogrulanmis zemin+yazi token'lari kullaniliyor. */
body[data-yeni] .yeni-sertifika.uyelik .yeni-sertifika-rozet {
    color: var(--yesil-alan-yazi); background: var(--yesil-alan);
}
body[data-yeni] .yeni-sertifika.proje .yeni-sertifika-rozet {
    color: var(--mavi-alan-yazi); background: var(--mavi-alan);
}
body[data-yeni] .yeni-sertifika.proje { background: var(--mavi-alan); border-color: var(--mavi-alan-yazi); }
body[data-yeni] .yeni-sertifika.proje .yeni-durum-baslik { color: var(--mavi-alan-yazi); }
body[data-yeni] .yeni-sertifika.uyelik .yeni-durum-baslik { color: var(--yesil-alan-yazi); }
body[data-yeni] .yeni-sertifika-kod {
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: .6875rem;
    color: var(--murekkep-alt);
}
body[data-yeni] .yeni-sertifika dl { margin: 0; }

/* ══════════════════════════════════════════════════════════════════
   SAYFA: PROFIL
   Iletisim listesi modali (.cl-*) profile.css'te kaliyor - o blok
   zaten sinif tabanli ve gercek kisilerin iletisim bilgilerini
   tasidigi icin markup'ina dokunulmadi.
   ══════════════════════════════════════════════════════════════════ */

body[data-yeni] .yeni-profil-ust {
    background: linear-gradient(135deg, var(--sari) 0%, var(--sari-acik) 100%);
    padding: var(--b-6) var(--b-5);
}
body[data-yeni] .yeni-profil-ust-ic {
    max-width: 1100px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    gap: var(--b-4);
    flex-wrap: wrap;
}
body[data-yeni] .yeni-profil-im { font-size: 40px; line-height: 1; }
body[data-yeni] .yeni-profil-kim { flex: 1; min-width: 220px; }
body[data-yeni] .yeni-profil-ustbaslik {
    font-size: .6875rem;
    font-weight: 700;
    letter-spacing: var(--arali-etiket);
    text-transform: uppercase;
    color: #5c4500;                      /* sari uzerinde 5.33 */
    margin-bottom: 4px;
}
body[data-yeni] .yeni-profil-kim h1 {
    font-size: 1.625rem;
    color: #1a1400;                      /* sari uzerinde 10.75 */
    margin-bottom: 2px;
}
body[data-yeni] .yeni-profil-eposta { font-size: .875rem; color: #3a2c00; }
body[data-yeni] .yeni-profil-sag {
    display: flex;
    align-items: center;
    gap: var(--b-3);
    flex-wrap: wrap;
}
body[data-yeni] .yeni-uyelik-rozet {
    font-size: .75rem;
    font-weight: 700;
    color: #1a1400;
    background: rgba(255,255,255,.6);
    border-radius: var(--y-tam);
    padding: 7px 14px;
}
body[data-yeni] .yeni-cikis {
    font-family: var(--yt-metin);
    font-size: .8125rem;
    font-weight: var(--kalin-yari);
    min-height: var(--dokunma);
    padding: 10px 18px;
    border: 1.5px solid #1a1400;
    border-radius: var(--y-md);
    background: transparent;
    color: #1a1400;
    cursor: pointer;
    transition: background var(--gecis-hizli);
}
body[data-yeni] .yeni-cikis:hover { background: rgba(255,255,255,.55); }

body[data-yeni] .yeni-duyuru {
    display: flex;
    align-items: flex-start;
    gap: var(--b-3);
    max-width: 1100px;
    margin: var(--b-5) auto 0;
    padding: var(--b-4) var(--b-5);
    background: var(--uyari-alan);
    border: 1px solid var(--uyari);
    border-radius: var(--y-lg);
}
body[data-yeni] .yeni-duyuru p { font-size: .875rem; line-height: 1.6; color: var(--murekkep); }
body[data-yeni] .yeni-duyuru strong { color: var(--uyari); font-weight: var(--kalin-yari); }

body[data-yeni] .yeni-profil-izgara {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: var(--b-4);
}
body[data-yeni] .yeni-panel {
    background: var(--zemin);
    border: 1px solid var(--cizgi);
    border-radius: var(--y-lg);
    padding: var(--b-5);
}
body[data-yeni] .yeni-panel-ust {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--b-3);
    margin-bottom: var(--b-5);
    padding-bottom: var(--b-4);
    border-bottom: 1px solid var(--cizgi);
}
body[data-yeni] .yeni-panel-baslik {
    font-family: var(--yt-baslik);
    font-size: 1rem;
    font-weight: var(--kalin-tam);
    letter-spacing: var(--arali-orta);
}
body[data-yeni] .yeni-aktif-rozet {
    font-size: .6875rem;
    font-weight: 700;
    letter-spacing: var(--arali-etiket);
    text-transform: uppercase;
    color: var(--olumlu);
    background: var(--olumlu-alan);
    border-radius: var(--y-tam);
    padding: 4px 10px;
}
body[data-yeni] .yeni-veri-izgara {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: var(--b-4);
}
body[data-yeni] .yeni-veri-etiket {
    font-size: .6875rem;
    font-weight: 700;
    letter-spacing: var(--arali-etiket);
    text-transform: uppercase;
    color: var(--murekkep-alt);
    margin-bottom: 4px;
}
body[data-yeni] .yeni-veri-deger { font-size: .9375rem; font-weight: var(--kalin-orta); line-height: 1.4; }

body[data-yeni] .yeni-rol {
    display: flex;
    align-items: flex-start;
    gap: var(--b-3);
    margin-bottom: var(--b-4);
}
body[data-yeni] .yeni-rol-im { font-size: 26px; line-height: 1; }
body[data-yeni] .yeni-rol-baslik { font-size: .9375rem; font-weight: var(--kalin-yari); }
body[data-yeni] .yeni-rol-komite { font-size: .8125rem; color: var(--murekkep-alt); }
body[data-yeni] .yeni-rol-aciklama {
    font-size: .875rem;
    color: var(--murekkep-alt);
    line-height: 1.65;
    margin-bottom: var(--b-5);
}

body[data-yeni] .yeni-hizli {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: var(--b-3);
    margin-top: var(--b-4);
}
body[data-yeni] .yeni-hizli-dugme {
    display: flex;
    align-items: center;
    gap: var(--b-2);
    font-family: var(--yt-metin);
    font-size: .875rem;
    font-weight: var(--kalin-yari);
    min-height: var(--dokunma);
    padding: 12px 16px;
    border: 1px solid var(--cizgi);
    border-radius: var(--y-md);
    background: var(--zemin-alt);
    color: var(--murekkep);
    cursor: pointer;
    text-align: left;
    transition: border-color var(--gecis-hizli), background var(--gecis-hizli);
}
body[data-yeni] .yeni-hizli-dugme:hover {
    border-color: var(--sari);
    background: rgba(251,188,5,.06);
}
/* Vurgulu eylem: sari dolgu, koyu yazi (9.14) */
body[data-yeni] .yeni-hizli-dugme.vurgulu {
    background: var(--sari);
    border-color: var(--sari);
    color: #2e2200;
}
body[data-yeni] .yeni-hizli-dugme.vurgulu:hover { background: var(--sari-koyu, #e0a800); border-color: var(--sari-koyu, #e0a800); }
body[data-yeni] .yeni-yardim { font-size: .8125rem; color: var(--murekkep-alt); }
body[data-yeni] .yeni-yardim strong { color: var(--murekkep); font-weight: var(--kalin-yari); }

/* ══════════════════════════════════════════════════════════════════
   AILE: BASVURULAR
   .position-card / .position-body / .pos-chevron / .pos-tag sinif
   isimleri KORUNUYOR - shell.js'teki togglePosition() ve toggleFaq()
   onlara bagli. Sadece gorunumleri geciliyor.
   ══════════════════════════════════════════════════════════════════ */

/* Adim karti: burada numara MESRU — "Choose a Position" once, "Send Your
   Application" sonra geliyor. Gercek bir sira oldugu icin numaralaniyor. */
body[data-yeni] .yeni-adimlar {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: var(--b-4);
}
body[data-yeni] .yeni-adim {
    background: var(--zemin);
    border: 1px solid var(--cizgi);
    border-radius: var(--y-lg);
    padding: var(--b-5);
}
body[data-yeni] .yeni-adim-no {
    display: inline-grid;
    place-items: center;
    width: 32px; height: 32px;
    border-radius: 50%;
    background: var(--sari);
    color: #2e2200;                      /* sari uzerinde 9.14 */
    font-family: var(--yt-baslik);
    font-weight: var(--kalin-tam);
    font-size: .9375rem;
    margin-bottom: var(--b-4);
}
body[data-yeni] .yeni-adim h4 {
    font-size: .9375rem;
    font-weight: var(--kalin-yari);
    line-height: 1.35;
    margin-bottom: var(--b-2);
}
body[data-yeni] .yeni-adim p { font-size: .8125rem; color: var(--murekkep-alt); line-height: 1.65; }
body[data-yeni] .yeni-adim strong { color: var(--murekkep); font-weight: var(--kalin-yari); }

/* CV gereksinimleri kutusu */
body[data-yeni] .yeni-bilgi-kutu {
    background: var(--zemin-alt);
    border: 1px solid var(--cizgi);
    border-left: 3px solid var(--sari);
    border-radius: var(--y-lg);
    padding: var(--b-6);
    margin-top: var(--b-6);
}
body[data-yeni] .yeni-bilgi-kutu h3 { font-size: 1.125rem; margin-bottom: var(--b-5); }
body[data-yeni] .yeni-bilgi-ikili {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: var(--b-5);
    margin-bottom: var(--b-5);
}
body[data-yeni] .yeni-bilgi-etiket {
    font-size: .6875rem;
    font-weight: 700;
    letter-spacing: var(--arali-etiket);
    text-transform: uppercase;
    color: var(--murekkep-alt);
    margin-bottom: var(--b-3);
}
body[data-yeni] .yeni-bilgi-kutu ul { display: grid; gap: var(--b-2); }
body[data-yeni] .yeni-bilgi-kutu li {
    display: grid;
    grid-template-columns: 16px 1fr;
    gap: var(--b-2);
    font-size: .875rem;
    color: var(--murekkep-alt);
    line-height: 1.6;
}
body[data-yeni] .yeni-bilgi-kutu li::before {
    content: "";
    width: 7px; height: 7px;
    margin-top: .55em;
    border-radius: 2px;
    background: var(--sari);
}
body[data-yeni] .yeni-bilgi-not { font-size: .8125rem; color: var(--murekkep-alt); line-height: 1.7; }

/* Grup basligi (Executive Committee vb.) */
body[data-yeni] .yeni-grup-basligi {
    font-family: var(--yt-metin);
    font-size: .6875rem;
    font-weight: 700;
    letter-spacing: var(--arali-etiket);
    text-transform: uppercase;
    color: var(--murekkep-alt);
    padding-bottom: var(--b-3);
    margin-bottom: var(--b-4);
    border-bottom: 2px solid var(--sari);
}

/* ── Pozisyon akordiyonu ── */
body[data-yeni] .yeni-pozisyonlar { display: grid; gap: var(--b-3); }
body[data-yeni] .position-card {
    background: var(--zemin);
    border: 1px solid var(--cizgi);
    border-radius: var(--y-lg);
    overflow: hidden;
    cursor: pointer;
    transition: border-color var(--gecis-hizli), box-shadow var(--gecis-hizli);
}
body[data-yeni] .position-card:hover {
    border-color: var(--sari);
    box-shadow: 0 4px 16px rgba(251,188,5,.10);
}
body[data-yeni] .position-header {
    display: flex;
    align-items: center;
    gap: var(--b-4);
    padding: var(--b-5);
    min-height: var(--dokunma);
}
body[data-yeni] .yeni-pozisyon-im { font-size: 26px; line-height: 1; flex: none; }
body[data-yeni] .yeni-pozisyon-ad {
    font-family: var(--yt-baslik);
    font-size: 1.0625rem;
    font-weight: var(--kalin-tam);
    letter-spacing: var(--arali-orta);
    margin-bottom: var(--b-2);
}
body[data-yeni] .yeni-pozisyon-etiketler { display: flex; flex-wrap: wrap; gap: 6px; }
body[data-yeni] .pos-tag {
    font-size: .6875rem;
    color: var(--murekkep-alt);
    background: var(--zemin-alt);
    border: 1px solid var(--cizgi);
    border-radius: var(--y-tam);
    padding: 3px 10px;
}
/* Renkli etiketler: hepsi cift olarak dogrulanmis zemin+yazi. */
body[data-yeni] .pos-tag.green { color: var(--yesil-alan-yazi);   background: var(--yesil-alan);   border-color: currentColor; }
body[data-yeni] .pos-tag.blue  { color: var(--mavi-alan-yazi);    background: var(--mavi-alan);    border-color: currentColor; }
body[data-yeni] .pos-tag.pink  { color: var(--kirmizi-alan-yazi); background: var(--kirmizi-alan); border-color: currentColor; }

body[data-yeni] .pos-chevron {
    margin-left: auto;
    flex: none;
    font-size: 12px;
    color: var(--murekkep-alt);
    transition: transform var(--gecis-orta);
}
body[data-yeni] .pos-chevron.open { transform: rotate(180deg); }

body[data-yeni] .position-body {
    display: none;
    padding: 0 var(--b-5) var(--b-5);
    border-top: 1px solid var(--cizgi);
}
body[data-yeni] .position-body.open { display: block; }
/* Tiklama basliga bagli kartlar: govde uzun metin tasiyor, icine tiklamak
   (metin secmek, okumak) karti kapatmamali. */
body[data-yeni] .position-card:has(> .position-header[onclick]) { cursor: auto; }
body[data-yeni] .position-header[onclick] { cursor: pointer; }
body[data-yeni] .yeni-pozisyonlar + .yeni-grup-basligi { margin-top: var(--b-6); }
body[data-yeni] .yeni-pozisyonlar + .yeni-pozisyonlar,
body[data-yeni] .yeni-grup-basligi:first-child { margin-top: 0; }
body[data-yeni] .yeni-pozisyon-metin {
    font-size: .875rem;
    color: var(--murekkep-alt);
    line-height: 1.7;
    max-width: 72ch;
}
body[data-yeni] .yeni-alt-baslik {
    font-family: var(--yt-baslik);
    font-size: .875rem;
    font-weight: var(--kalin-yari);
    color: var(--murekkep);
    margin: var(--b-4) 0 var(--b-2);
}
body[data-yeni] .yeni-sorumluluk-baslik {
    font-size: .6875rem;
    font-weight: 700;
    letter-spacing: var(--arali-etiket);
    text-transform: uppercase;
    color: var(--murekkep-alt);
    margin: var(--b-5) 0 var(--b-3);
}
body[data-yeni] .yeni-sorumluluklar { display: grid; gap: var(--b-2); }
body[data-yeni] .yeni-sorumluluklar li {
    display: grid;
    grid-template-columns: 16px 1fr;
    gap: var(--b-2);
    font-size: .875rem;
    color: var(--murekkep-alt);
    line-height: 1.65;
}
body[data-yeni] .yeni-sorumluluklar li::before {
    content: "";
    width: 7px; height: 7px;
    margin-top: .6em;
    border-radius: 2px;
    background: var(--sari);
}
body[data-yeni] .yeni-sorumluluklar strong { color: var(--murekkep); font-weight: var(--kalin-yari); }
body[data-yeni] .yeni-pozisyon-basvur {
    display: inline-flex;
    align-items: center;
    min-height: var(--dokunma);
    margin-top: var(--b-5);
    padding: 11px 20px;
    border-radius: var(--y-md);
    background: var(--murekkep);
    color: #fff;
    font-size: .875rem;
    font-weight: var(--kalin-yari);
    text-decoration: none;
}
body[data-yeni] .yeni-pozisyon-basvur:hover { background: #000; }

/* ── Sikca sorulanlar (member-applications) ── */
body[data-yeni] .yeni-sss-liste { display: grid; }
body[data-yeni] .yeni-sss { border-bottom: 1px solid var(--cizgi); }
body[data-yeni] .yeni-sss:last-child { border-bottom: none; }
body[data-yeni] .yeni-sss-ust {
    display: flex;
    align-items: flex-start;
    gap: var(--b-4);
    padding: var(--b-5) 0;
    cursor: pointer;
    min-height: var(--dokunma);
}
body[data-yeni] .yeni-sss-q {
    flex: none;
    display: grid;
    place-items: center;
    width: 30px; height: 30px;
    border-radius: var(--y-sm);
    background: var(--olumlu);
    color: #fff;                          /* --olumlu uzerinde 5.00 */
    font-family: var(--yt-baslik);
    font-weight: var(--kalin-tam);
    font-size: .8125rem;
}
body[data-yeni] .yeni-sss-ust h3 {
    flex: 1;
    font-size: 1rem;
    font-weight: var(--kalin-yari);
    line-height: 1.45;
    letter-spacing: var(--arali-orta);
    margin-top: 3px;
}
body[data-yeni] .yeni-sss-ok {
    flex: none;
    font-size: 12px;
    color: var(--murekkep-alt);
    margin-top: 8px;
    transition: transform var(--gecis-orta);
}
body[data-yeni] .yeni-sss-ust.open .yeni-sss-ok { transform: rotate(180deg); }

body[data-yeni] .faq-body { display: none; padding: 0 0 var(--b-5) 46px; }
body[data-yeni] .faq-body.open { display: block; }
body[data-yeni] .faq-body p {
    font-size: .90625rem;
    color: var(--murekkep-alt);
    line-height: 1.8;
    margin-bottom: var(--b-3);
    max-width: var(--olcu-metin);
}
body[data-yeni] .faq-body ul { display: grid; gap: var(--b-2); margin-bottom: var(--b-3); }
body[data-yeni] .faq-body li {
    display: grid;
    grid-template-columns: 16px 1fr;
    gap: var(--b-2);
    font-size: .875rem;
    color: var(--murekkep-alt);
    line-height: 1.7;
}
body[data-yeni] .faq-body li::before {
    content: "";
    width: 7px; height: 7px;
    margin-top: .65em;
    border-radius: 2px;
    background: var(--sari);
}
body[data-yeni] .faq-body strong { color: var(--murekkep); font-weight: var(--kalin-yari); }
/* SSS govdesindeki serbest kutular (vurgu notlari, komite rozet gruplari) */
body[data-yeni] .faq-body > div {
    display: flex;
    flex-wrap: wrap;
    gap: var(--b-2);
    margin-bottom: var(--b-4);
}
body[data-yeni] .faq-body > div > span {
    font-size: .8125rem;
    color: var(--murekkep-alt);
    background: var(--zemin-alt);
    border: 1px solid var(--cizgi);
    border-radius: var(--y-tam);
    padding: 6px 13px;
}
body[data-yeni] .faq-body > div > div {
    display: flex;
    align-items: center;
    gap: var(--b-2);
    font-size: .8125rem;
    font-weight: var(--kalin-orta);
    background: var(--zemin-alt);
    border: 1px solid var(--cizgi);
    border-radius: var(--y-md);
    padding: 8px 14px;
}
body[data-yeni] .faq-body > div > div p { margin: 0; color: var(--murekkep); font-size: .8125rem; }
body[data-yeni] .faq-body > div > p {
    background: var(--uyari-alan);
    border: 1px solid var(--uyari);
    border-radius: var(--y-md);
    padding: var(--b-4);
    color: var(--murekkep);
    margin: 0;
}

/* Komite kartinin govdesindeki basvuru baglantisi */
body[data-yeni] .position-body > a {
    display: inline-flex;
    align-items: center;
    min-height: var(--dokunma);
    margin-top: var(--b-4);
    padding: 11px 22px;
    border-radius: var(--y-md);
    background: var(--sari);
    color: #2e2200;                       /* sari uzerinde 9.14 */
    font-size: .875rem;
    font-weight: 700;
    text-decoration: none;
}
body[data-yeni] .position-body > a:hover { filter: brightness(.94); }
body[data-yeni] .position-body > p { font-size: .875rem; color: var(--murekkep-alt); line-height: 1.7; margin-bottom: var(--b-3); }
body[data-yeni] .position-body > ul { display: grid; gap: var(--b-2); }
body[data-yeni] .position-body > ul li {
    display: grid; grid-template-columns: 16px 1fr; gap: var(--b-2);
    font-size: .875rem; color: var(--murekkep-alt); line-height: 1.65;
}
body[data-yeni] .position-body > ul li::before {
    content: ""; width: 7px; height: 7px; margin-top: .6em;
    border-radius: 2px; background: var(--sari);
}

/* Hero altindaki not satiri */
/* Tek satirlik bir not; genis bir hap degil. Icerigi kadar yer kaplasin
   diye max-width kaldirildi ve inline-block birakildi. */
body[data-yeni] .yeni-hero-not {
    font-size: .8125rem !important;
    font-weight: var(--kalin-orta);
    color: #3a2c00 !important;
    background: rgba(255,255,255,.55);
    border-radius: var(--y-tam);
    padding: 7px 16px;
    display: inline-block;
    max-width: none !important;
    margin: 0 auto !important;
}

/* Kapanis cagrisi — koyu bant */
body[data-yeni] .yeni-cagri {
    background: var(--murekkep);
    text-align: center;
    padding: clamp(3rem, 6vw, 4.5rem) var(--b-5);
}
body[data-yeni] .yeni-cagri h2 {
    font-size: clamp(1.625rem, 3vw, 2rem);
    color: var(--sari);                   /* koyu zeminde 10.5 */
    margin-bottom: var(--b-3);
}
body[data-yeni] .yeni-cagri p {
    font-size: .9375rem;
    color: #b9bfca;                       /* koyu zeminde 9.13 */
    line-height: 1.7;
    max-width: 540px;
    margin: 0 auto var(--b-6);
}
body[data-yeni] .yeni-cagri-dugme {
    display: inline-flex;
    align-items: center;
    min-height: 52px;
    padding: 16px 42px;
    border-radius: var(--y-md);
    background: var(--sari);
    color: #2e2200;
    font-size: 1rem;
    font-weight: 800;
    text-decoration: none;
}
body[data-yeni] .yeni-cagri-dugme:hover { filter: brightness(.94); }

/* ══════════════════════════════════════════════════════════════════
   AILE: MAKALELER (uzun okuma sayfalari)
   Bu iki sayfada HIC sinif yoktu - her sey satir ici stildi. Diger
   sayfalarda bilesen bilesen calistim; burada dogru olan tipografi
   katmani: metin akisini etiketin kendisi tasiyor.
   ══════════════════════════════════════════════════════════════════ */

body[data-yeni] .yeni-makale-ust {
    display: flex;
    align-items: center;
    gap: var(--b-3);
    flex-wrap: wrap;
    padding: var(--b-4) 0;
    border-bottom: 1px solid var(--cizgi);
    font-size: .8125rem;
    color: var(--murekkep-alt);
}
body[data-yeni] .yeni-makale-ust .ayrac { color: var(--murekkep-sol); }
body[data-yeni] .yeni-makale-ust .simdiki { color: var(--murekkep); font-weight: var(--kalin-orta); }

body[data-yeni] .yeni-makale-basligi {
    padding: clamp(2.5rem, 5vw, 4rem) 0 var(--b-6);
    border-bottom: 1px solid var(--cizgi);
    margin-bottom: var(--b-7);
}
body[data-yeni] .yeni-makale-basligi h1 {
    font-size: clamp(1.875rem, 4vw, 2.625rem);
    line-height: 1.15;
    margin: var(--b-4) 0 var(--b-5);
}
body[data-yeni] .yeni-yazarlar-etiket {
    font-size: .6875rem;
    font-weight: 700;
    letter-spacing: var(--arali-etiket);
    text-transform: uppercase;
    color: var(--murekkep-alt);
    margin-bottom: var(--b-3);
}
body[data-yeni] .yeni-yazarlar { display: flex; flex-wrap: wrap; gap: var(--b-2); }
body[data-yeni] .yeni-yazarlar span {
    font-size: .8125rem;
    background: var(--zemin-alt);
    border: 1px solid var(--cizgi);
    border-radius: var(--y-tam);
    padding: 4px 12px;
}

/* ── Metin akisi ──
   Olcu 68ch degil 72ch: bilimsel metinde uzun terimler var, cok dar
   sutun sozcuk arasi bosluklari bozuyor. */
body[data-yeni] .yeni-metin {
    max-width: 72ch;
    margin: 0 auto;
    font-size: 1.0625rem;      /* 17px — uzun okuma icin govde metninden buyuk */
    line-height: 1.8;
    color: var(--murekkep);
}
body[data-yeni] .yeni-metin > h2 {
    font-size: clamp(1.375rem, 2.6vw, 1.75rem);
    margin: var(--b-8) 0 var(--b-4);
    padding-top: var(--b-5);
    border-top: 2px solid var(--sari);
}
body[data-yeni] .yeni-metin > h2:first-child { margin-top: 0; border-top: none; padding-top: 0; }
body[data-yeni] .yeni-metin h3 {
    font-size: 1.1875rem;
    font-weight: var(--kalin-yari);
    line-height: 1.4;
    margin: var(--b-6) 0 var(--b-3);
}
body[data-yeni] .yeni-metin p { margin-bottom: var(--b-4); }
body[data-yeni] .yeni-metin em { color: var(--murekkep-alt); }
body[data-yeni] .yeni-metin strong { font-weight: var(--kalin-yari); }
body[data-yeni] .yeni-metin a { color: var(--mavi-yazi); }
body[data-yeni] .yeni-metin ul,
body[data-yeni] .yeni-metin ol {
    margin: 0 0 var(--b-5);
    padding-left: var(--b-5);
    display: grid;
    gap: var(--b-2);
}
body[data-yeni] .yeni-metin ol { list-style: decimal; }
body[data-yeni] .yeni-metin ul { list-style: none; padding-left: 0; }
body[data-yeni] .yeni-metin ul li {
    display: grid;
    grid-template-columns: 18px 1fr;
    gap: var(--b-3);
}
body[data-yeni] .yeni-metin ul li::before {
    content: "";
    width: 7px; height: 7px;
    margin-top: .72em;
    border-radius: 2px;
    background: var(--sari);
}
body[data-yeni] .yeni-metin li { line-height: 1.75; }

/* Grafikler ve tablolar metin sutunundan tasabilir */
body[data-yeni] .yeni-sekil {
    margin: var(--b-7) 0;
    padding: var(--b-5);
    background: var(--zemin-alt);
    border: 1px solid var(--cizgi);
    border-radius: var(--y-lg);
}
/* Grafik betigi tuvalin genisligini canvas.offsetWidth'ten okuyor. Genislik
   verilmezse tuval 300px varsayilaninda kalir ve cubuklar sola tasip kirpilir
   (bu hata yeni tasarimdan once de vardi). width:100% kutu genisligini verir;
   min-width 7 grubun sigdigi en dar olcu — altina inince tuval kendi kutusunda
   yana kayar (genis tablolarla ayni desen), sayfa govdesi kaymaz. */
body[data-yeni] .yeni-sekil canvas { display: block; width: 100%; min-width: 480px; }
body[data-yeni] .yeni-sekil .yeni-tablo-sarma { margin: 0; }
body[data-yeni] .yeni-sekil-alt {
    font-size: .8125rem;
    color: var(--murekkep-alt);
    line-height: 1.6;
    margin-top: var(--b-3);
    text-align: center;
    font-style: italic;
}
body[data-yeni] .yeni-metin .yeni-sekil > p:last-child { margin-bottom: 0; }

/* Genis tablo kendi kutusunda kayar; sayfa govdesi yana kaymaz. */
body[data-yeni] .yeni-tablo-sarma {
    overflow-x: auto;
    margin: var(--b-6) 0;
    border: 1px solid var(--cizgi);
    border-radius: var(--y-lg);
}
body[data-yeni] .yeni-metin table {
    width: 100%;
    border-collapse: collapse;
    font-size: .875rem;
    min-width: 520px;
}
body[data-yeni] .yeni-metin th,
body[data-yeni] .yeni-metin td {
    text-align: left;
    padding: var(--b-3) var(--b-4);
    border-bottom: 1px solid var(--cizgi);
    line-height: 1.6;
    vertical-align: top;
}
body[data-yeni] .yeni-metin th {
    font-size: .6875rem;
    font-weight: 700;
    letter-spacing: var(--arali-etiket);
    text-transform: uppercase;
    color: var(--murekkep-alt);
    background: var(--zemin-alt);
    white-space: nowrap;
}
body[data-yeni] .yeni-metin tbody tr:last-child td { border-bottom: none; }

/* Kaynakca */
body[data-yeni] .yeni-kaynakca {
    margin-top: var(--b-8);
    padding-top: var(--b-6);
    border-top: 2px solid var(--sari);
}
body[data-yeni] .yeni-kaynakca ol {
    font-size: .8125rem;
    line-height: 1.75;
    color: var(--murekkep-alt);
}
body[data-yeni] .yeni-kaynakca a { word-break: break-word; }

/* ── Makale govdesindeki dergi bilesenleri ──
   Faz 3 donusturme betigi (donustur_makale.py) bu bloklarin satir ici
   stillerini sildi ama yerine sinif koymadi; bazi sarmalayici div'leri
   de yuttu, o yuzden kutular duz metin gibi alt alta akiyordu.
   Yapi ve gorunum arsivdeki orijinalden geri getirildi
   (src/archive/spa-source.html); metne dokunulmadi.
   Renkler orijinalin ham hex'leri yerine paletin jetonlariyla yazildi,
   boylece kontrast dogrulamasi tek yerden gecerli kaliyor. */

/* Kunye: yayinci / akademik yil / ulke */
body[data-yeni] .yeni-yayin-bilgi {
    display: flex;
    flex-wrap: wrap;
    gap: var(--b-3) var(--b-6);
    padding-top: var(--b-5);
    margin-bottom: var(--b-6);
    border-top: 1px solid var(--cizgi);
    font-size: .875rem;
    color: var(--murekkep-alt);
    line-height: 1.6;
}
body[data-yeni] .yeni-yayin-bilgi span {
    display: block;
    font-size: .6875rem;
    font-weight: 700;
    letter-spacing: var(--arali-etiket);
    text-transform: uppercase;
    color: var(--murekkep);
    margin-bottom: 2px;
}

/* Icindekiler */
body[data-yeni] .yeni-icindekiler {
    background: var(--zemin-alt);
    border: 1px solid var(--cizgi);
    border-radius: var(--y-lg);
    padding: var(--b-5) var(--b-6);
    margin-bottom: var(--b-7);
}
body[data-yeni] .yeni-icindekiler-baslik {
    font-size: .6875rem;
    font-weight: 700;
    letter-spacing: var(--arali-etiket);
    text-transform: uppercase;
    color: var(--murekkep-alt);
    margin-bottom: var(--b-3);
}
body[data-yeni] .yeni-metin .yeni-icindekiler ol {
    list-style: none;
    padding: 0;
    margin: 0;
    gap: var(--b-1);
}
body[data-yeni] .yeni-icindekiler a {
    display: flex;
    gap: var(--b-3);
    padding: 5px 0;
    font-size: .9375rem;
    font-weight: var(--kalin-orta);
    color: var(--murekkep);
    text-decoration: none;
    line-height: 1.5;
}
body[data-yeni] .yeni-icindekiler a:hover { color: var(--mavi-yazi); text-decoration: underline; }
body[data-yeni] .yeni-icindekiler a > span { color: var(--murekkep-alt); flex: none; }

/* Bolum rozeti ve bolum basligi */
body[data-yeni] .yeni-makale-bolum { margin-bottom: var(--b-8); }
body[data-yeni] .yeni-makale-bolum:last-child { margin-bottom: 0; }
body[data-yeni] .yeni-bolum-rozet {
    display: inline-block;
    font-size: .6875rem;
    font-weight: 700;
    letter-spacing: var(--arali-etiket);
    text-transform: uppercase;
    color: var(--mavi-alan-yazi);
    background: var(--mavi-alan);
    border-radius: var(--y-tam);
    padding: 4px 11px;
}
body[data-yeni] .yeni-bolum-rozet.yesil { color: var(--yesil-alan-yazi); background: var(--yesil-alan); }
/* Orijinalde ham #fbbc05 sari yaziydi; kendi acik zemininde okunmuyordu.
   Paletin dogrulanmis uyari cifti kullanildi. */
body[data-yeni] .yeni-bolum-rozet.sari { color: var(--uyari); background: var(--uyari-alan); }
body[data-yeni] .yeni-metin .yeni-makale-bolum h2 {
    font-size: clamp(1.375rem, 2.6vw, 1.75rem);
    margin: var(--b-3) 0 var(--b-5);
    padding: 0 0 var(--b-3);
    border-top: none;
    border-bottom: 1px solid var(--cizgi);
}

/* Alt bolum (2.1, 3.2, adim 1 ...) — solda ince aksan cizgisi */
body[data-yeni] .yeni-altbolum {
    border-left: 3px solid var(--mavi);
    padding-left: var(--b-5);
    margin-bottom: var(--b-6);
}
body[data-yeni] .yeni-metin .yeni-altbolum h3 { margin-top: 0; }
body[data-yeni] .yeni-altbolum h3 > span { color: var(--mavi-yazi); }
body[data-yeni] .yeni-altbolum.sari { border-left-color: var(--sari); }
body[data-yeni] .yeni-altbolum.sari h3 > span { color: var(--uyari); }
body[data-yeni] .yeni-metin .yeni-altbolum > p:last-child { margin-bottom: 0; }

/* Sekil kutusu basligi (.yeni-sekil kutusunun kendisi yukarida tanimli) */
body[data-yeni] .yeni-sekil-baslik {
    font-size: .6875rem;
    font-weight: 700;
    letter-spacing: var(--arali-etiket);
    text-transform: uppercase;
    color: var(--murekkep-alt);
    margin-bottom: var(--b-4);
    line-height: 1.5;
}
/* Sekil icindeki kart izgarasi */
body[data-yeni] .yeni-sekil-izgara {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: var(--b-3);
}
body[data-yeni] .yeni-sekil-kart {
    background: var(--zemin);
    border: 1px solid var(--cizgi);
    border-radius: var(--y-md);
    padding: var(--b-4);
    text-align: center;
}
body[data-yeni] .yeni-sekil-kart.sola { text-align: left; }
body[data-yeni] .yeni-sekil-im { font-size: 26px; line-height: 1; margin-bottom: var(--b-2); }
body[data-yeni] .yeni-sekil-kart.sola .yeni-sekil-im {
    width: 36px; height: 36px;
    display: flex; align-items: center; justify-content: center;
    font-size: 18px;
    background: var(--mavi-alan);
    border-radius: var(--y-sm);
    margin-bottom: var(--b-3);
}
body[data-yeni] .yeni-metin .yeni-sekil-kart p {
    font-size: .8125rem;
    font-weight: var(--kalin-yari);
    color: var(--murekkep);
    line-height: 1.4;
    margin-bottom: var(--b-1);
}
body[data-yeni] .yeni-metin .yeni-sekil-kart p + p {
    font-size: .75rem;
    font-weight: var(--kalin-metin);
    color: var(--murekkep-alt);
    line-height: 1.5;
    margin-bottom: 0;
}

/* Sekil icindeki satir listesi: ikon + iki satir metin */
body[data-yeni] .yeni-sekil-liste { display: grid; gap: var(--b-2); }
body[data-yeni] .yeni-sekil-satir {
    display: flex;
    align-items: center;
    gap: var(--b-4);
    background: var(--zemin);
    border: 1px solid var(--cizgi);
    border-radius: var(--y-md);
    padding: var(--b-3) var(--b-4);
}
body[data-yeni] .yeni-sekil-satir > span { font-size: 22px; line-height: 1; flex: none; }
body[data-yeni] .yeni-metin .yeni-sekil-satir p {
    font-size: .8125rem;
    font-weight: var(--kalin-yari);
    color: var(--murekkep);
    line-height: 1.4;
    margin-bottom: 2px;
}
body[data-yeni] .yeni-metin .yeni-sekil-satir p + p {
    font-size: .75rem;
    font-weight: var(--kalin-metin);
    color: var(--murekkep-alt);
    line-height: 1.55;
    margin-bottom: 0;
}

/* Ikili karsilastirma kutulari (pseudo-persistent / truly persistent) */
body[data-yeni] .yeni-ikili {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: var(--b-3);
    margin: var(--b-6) 0;
}
body[data-yeni] .yeni-ikili-kutu {
    border: 1.5px solid;
    border-radius: var(--y-lg);
    padding: var(--b-5);
}
body[data-yeni] .yeni-ikili-kutu.mavi    { background: var(--mavi-alan);    border-color: var(--mavi-alan-yazi); }
body[data-yeni] .yeni-ikili-kutu.kirmizi { background: var(--kirmizi-alan); border-color: var(--kirmizi-alan-yazi); }
body[data-yeni] .yeni-metin .yeni-ikili-kutu p {
    font-size: .875rem;
    color: var(--murekkep);
    line-height: 1.65;
    margin-bottom: 0;
}
body[data-yeni] .yeni-metin .yeni-ikili-kutu p.yeni-ikili-baslik {
    font-size: .6875rem;
    font-weight: 700;
    letter-spacing: var(--arali-etiket);
    text-transform: uppercase;
    margin-bottom: var(--b-2);
}
body[data-yeni] .yeni-ikili-kutu.mavi    p.yeni-ikili-baslik { color: var(--mavi-alan-yazi); }
body[data-yeni] .yeni-ikili-kutu.kirmizi p.yeni-ikili-baslik { color: var(--kirmizi-alan-yazi); }

/* Vurgu kutusu (uyari / anahtar endise) */
body[data-yeni] .yeni-vurgu-kutu {
    display: flex;
    gap: var(--b-4);
    align-items: flex-start;
    background: var(--uyari-alan);
    border: 1.5px solid var(--uyari);
    border-radius: var(--y-lg);
    padding: var(--b-5);
    margin: var(--b-6) 0;
}
body[data-yeni] .yeni-vurgu-kutu > span { font-size: 22px; line-height: 1; flex: none; }
body[data-yeni] .yeni-metin .yeni-vurgu-kutu p {
    font-size: .9375rem;
    color: var(--murekkep);
    line-height: 1.7;
    margin-bottom: 0;
}

/* Cikarimlar (Key Takeaways) */
body[data-yeni] .yeni-cikarimlar {
    background: var(--zemin-alt);
    border: 1px solid var(--cizgi);
    border-radius: var(--y-lg);
    padding: var(--b-5) var(--b-6);
    margin-top: var(--b-6);
}
body[data-yeni] .yeni-cikarim-liste { display: grid; gap: var(--b-3); }
body[data-yeni] .yeni-cikarim { display: flex; gap: var(--b-3); align-items: flex-start; }
body[data-yeni] .yeni-cikarim > span {
    flex: none;
    font-family: var(--yt-sayi);
    font-size: .875rem;
    font-weight: 800;
    color: var(--mavi-yazi);
    line-height: 1.6;
}
body[data-yeni] .yeni-metin .yeni-cikarim p {
    font-size: .9375rem;
    color: var(--murekkep);
    line-height: 1.6;
    margin-bottom: 0;
}

/* Kaynak kutusu: deneme sonu kaynaklari ve bolum kaynakcasi */
body[data-yeni] .yeni-kaynak-kutu {
    background: var(--zemin-alt);
    border: 1px solid var(--cizgi);
    border-radius: var(--y-md);
    padding: var(--b-4) var(--b-5);
    margin-top: var(--b-5);
}
body[data-yeni] .yeni-metin .yeni-kaynak-kutu p {
    font-size: .8125rem;
    color: var(--murekkep-alt);
    line-height: 1.75;
    margin-bottom: var(--b-2);
}
body[data-yeni] .yeni-metin .yeni-kaynak-kutu p:last-child { margin-bottom: 0; }
body[data-yeni] .yeni-metin .yeni-kaynak-kutu p.yeni-kaynak-baslik {
    font-size: .6875rem;
    font-weight: 700;
    letter-spacing: var(--arali-etiket);
    text-transform: uppercase;
    color: var(--murekkep);
    margin-bottom: var(--b-3);
}
/* Uzun DOI ve URL'ler kutudan tasmasin */
body[data-yeni] .yeni-kaynak-kutu a { word-break: break-word; }

/* ══════════════════════════════════════════════════════════════════
   SAYFA: ANA SAYFA
   .updates-card / .committee-slide / .letter-slide / .letter-dot /
   .counter sinif isimleri KORUNUYOR - shell.js'teki scrollUpdates,
   scrollCommittees, goToSlide ve sayac animasyonu onlara bagli.
   ══════════════════════════════════════════════════════════════════ */

/* Ana sayfa hero'su, diger 21 sayfadaki .yeni-hero ile AYNI olcude.
   base.css bu blogu 800px genisliginde, 80px ust marjli, yuvarlak
   kosheli bir kart yapiyor. Once onu birakip icine tam-genislik hero
   tipografisi koymustum: 800px'lik kutuda 52px baslik iki satira
   boluniyor, blok 529px yuksekliginde bir sari levhaya donusuyordu.
   Kart bicimi iptal edildi - ana sayfa da diger sayfalar gibi kenardan
   kenara bant. Sitede tek bir hero bicimi var. */
body[data-yeni] .welcome-section {
    background: linear-gradient(135deg, var(--sari) 0%, var(--sari-acik) 100%);
    text-align: center;
    padding: clamp(3.25rem, 6vw, 5rem) var(--b-5);
    margin: 0 !important;
    max-width: none !important;
    border-radius: 0 !important;
}
body[data-yeni] .welcome-section h1 {
    font-size: clamp(2.125rem, 4.6vw, 2.875rem);
    color: #1a1400;
    max-width: 20ch;
    margin: 0 auto var(--b-4);
}
body[data-yeni] .welcome-section > p {
    font-size: 1.0625rem;
    line-height: 1.6;
    color: #3a2c00;
    max-width: 640px;
    margin: 0 auto var(--b-4);
}
body[data-yeni] .welcome-buttons {
    display: flex;
    gap: var(--b-3);
    justify-content: center;
    flex-wrap: wrap;
    margin-top: var(--b-6);
}

/* Bolum ust cubugu: baslik solda, kaydirma oklari sagda */
body[data-yeni] .yeni-serit-ust {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--b-4);
    margin-bottom: var(--b-5);
}
body[data-yeni] .yeni-serit-ust h2 { font-size: clamp(1.375rem, 2.4vw, 1.625rem); }
body[data-yeni] .yeni-oklar { display: flex; gap: var(--b-2); flex: none; }
body[data-yeni] .yeni-ok {
    width: var(--dokunma); height: var(--dokunma);
    display: grid; place-items: center;
    border: 1.5px solid var(--cizgi-koyu);
    border-radius: 50%;
    background: var(--zemin);
    color: var(--murekkep);
    font-size: 17px;
    cursor: pointer;
    transition: background var(--gecis-hizli), border-color var(--gecis-hizli), color var(--gecis-hizli);
}
body[data-yeni] .yeni-ok:hover { background: var(--murekkep); border-color: var(--murekkep); color: #fff; }

/* Yatay kaydirilan seritler */
body[data-yeni] #updates-track,
body[data-yeni] #committees-track { overflow: hidden; }
body[data-yeni] #updates-inner,
body[data-yeni] #committees-inner {
    display: flex;
    gap: 20px;                            /* shell.js kart genisligine +20 ekliyor */
    transition: transform var(--gecis-orta);
}
body[data-yeni] .updates-card {
    flex: none;
    width: 300px;
    background: var(--zemin);
    border: 1px solid var(--cizgi);
    border-radius: var(--y-lg);
    padding: var(--b-5);
    cursor: pointer;
    display: flex;
    flex-direction: column;
    gap: var(--b-3);
    transition: border-color var(--gecis-hizli), box-shadow var(--gecis-hizli), transform var(--gecis-hizli);
}
body[data-yeni] .updates-card:hover {
    border-color: var(--sari);
    box-shadow: 0 8px 24px rgba(251,188,5,.12);
    transform: translateY(-2px);
}
/* Kart icindeki rozetler daha kucuk: 300px'lik kartta 3 rozet
   3-4 siraya sariyordu ve rozet blogu tek basina 118px yer kapliyordu. */
body[data-yeni] .updates-card .yeni-makale-rozetler { gap: 6px; }
body[data-yeni] .updates-card .yeni-etiket,
body[data-yeni] .updates-card .yeni-durum {
    font-size: .6875rem;
    padding: 3px 8px;
    margin-bottom: 0;
    letter-spacing: .06em;
}
body[data-yeni] .updates-card h4 {
    font-size: 1rem;
    font-weight: var(--kalin-yari);
    line-height: 1.4;
}
body[data-yeni] .updates-card > p {
    font-size: .875rem;
    color: var(--murekkep-alt);
    line-height: 1.6;
    /* Paragraf 3 satirda kesiliyor. flex:1 KALDIRILDI: paragrafi
       buyutuyor ve line-clamp'i etkisiz birakiyordu (kutu 8 satir
       boyunda oluyordu, kirpma gorunmuyordu). */
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
/* Butonu asagi iten bosluk: kartlar esit boyda kalsin, buton hep altta. */
body[data-yeni] .updates-card .welcome-btn { margin-top: auto; }
body[data-yeni] .updates-card .welcome-btn {
    align-self: flex-start;
    font-family: var(--yt-metin);
    font-size: .8125rem;
    font-weight: var(--kalin-yari);
    min-height: var(--dokunma);
    padding: 10px 18px;
    border: none;
    border-radius: var(--y-md);
    background: var(--murekkep);
    color: #fff;
    cursor: pointer;
}
body[data-yeni] .updates-card .welcome-btn:hover { background: #000; }

/* base.css bu kartlari renk dolu kutu + BEYAZ yazi yapiyor:
   .committee-item { color:#fff } + .biological-pharma { background:#34a853 }
   Beyaz yazi o zeminlerde 3.06 / 3.56 / 3.92 - ucu de AA'nin altinda.
   Ayrica zemini beyaza cekince yazi rengi beyaz kaliyor ve kontrast
   1.00 oluyordu (denetim yakaladi).
   Cozum /committees/ sayfasindakiyle ayni: beyaz kart, murekkep yazi,
   komite rengi ust kenarlikta. Renk yine kimligi tasiyor, yazi okunuyor. */
body[data-yeni] .committee-slide {
    flex: none;
    width: 260px;
    background: var(--zemin) !important;
    color: var(--murekkep);
    border: 1px solid var(--cizgi);
    border-top: 3px solid var(--renk, var(--sari));
    border-radius: var(--y-lg);
    padding: var(--b-5);
    text-align: center;
    cursor: pointer;
    transition: border-color var(--gecis-hizli), box-shadow var(--gecis-hizli), transform var(--gecis-hizli);
}
body[data-yeni] .committee-slide:hover {
    border-color: var(--sari);
    box-shadow: 0 8px 24px rgba(251,188,5,.12);
    transform: translateY(-3px);
}
body[data-yeni] .committee-icon {
    width: 64px; height: 64px;
    object-fit: contain;
    margin: 0 auto var(--b-4);
    display: block;
}
body[data-yeni] .committee-slide h3 {
    font-size: 1.0625rem;
    font-weight: var(--kalin-yari);
    line-height: 1.3;
    margin-bottom: var(--b-2);
}
body[data-yeni] .committee-slide p { font-size: .875rem; color: var(--murekkep-alt); line-height: 1.6; opacity: 1; }
/* Komite rengi ust kenarlikta - base.css'teki zemin renkleriyle ayni tonlar */
body[data-yeni] .committee-slide.biological-pharma   { --renk: var(--yesil); }
body[data-yeni] .committee-slide.sustainable-pharma  { --renk: var(--mavi); }
body[data-yeni] .committee-slide.womens-health       { --renk: var(--kirmizi); }
body[data-yeni] .committee-slide.medical-affairs     { --renk: var(--turkuaz); }
body[data-yeni] .committee-slide.humanitarian-pharma { --renk: #ff77e5; }

/* Mektup kaydiricisi — shell.js .active sinifini degistiriyor */
body[data-yeni] .letters-slider { position: relative; max-width: 800px; margin: 0 auto; }
body[data-yeni] .letter-slide { display: none; }
body[data-yeni] .letter-slide.active { display: block; }
body[data-yeni] .yeni-noktalar {
    display: flex;
    justify-content: center;
    gap: var(--b-2);
    margin-top: var(--b-5);
}
/* Dokunma hedefi dugmenin KENDISI 44px; nokta ::before ile ciziliyor.
   Onceki denemede gorunmez bir ::after katmani eklemistim - tiklama
   calisiyordu ama olculebilir hedef hala 10px gorunuyordu, yani
   denetimden gecmiyordu. Olculebilir olan dogru olan. */
body[data-yeni] .letter-dot {
    width: var(--dokunma); height: var(--dokunma);
    padding: 0;
    border: none;
    background: transparent;
    cursor: pointer;
    display: grid;
    place-items: center;
}
body[data-yeni] .letter-dot::before {
    content: "";
    width: 10px; height: 10px;
    border-radius: 50%;
    background: var(--cizgi-koyu);
    transition: background var(--gecis-hizli), width var(--gecis-hizli);
}
body[data-yeni] .letter-dot.active::before {
    background: var(--sari);
    width: 26px;
    border-radius: var(--y-tam);
}

/* Sayaclar */
body[data-yeni] .stat-counter-card-h {
    text-align: center;
    padding: var(--b-5) var(--b-4);
    background: var(--zemin);
    border: 1px solid var(--cizgi);
    border-radius: var(--y-lg);
    transition: border-color var(--gecis-hizli), box-shadow var(--gecis-hizli);
}
body[data-yeni] .stat-counter-card-h:hover {
    border-color: var(--sari);
    box-shadow: 0 4px 16px rgba(251,188,5,.16);
}
/* base.css bu iki ogeyi --accent-yellow yapiyor: beyazda 1.71, yani
   40px olmasina ragmen okunmuyor (buyuk metin esigi bile 3.0).
   Rakam mürekkebe aliniyor; sari, kartin hover kenarliginda kaliyor. */
body[data-yeni] .counter,
body[data-yeni] .stat-suffix-h {
    font-family: var(--yt-baslik);
    font-weight: var(--kalin-tam);
    font-size: 2.5rem;
    line-height: 1;
    letter-spacing: -0.04em;
    font-variant-numeric: tabular-nums;
    color: var(--murekkep);
}
body[data-yeni] .stat-counter-card-h p {
    font-size: .8125rem;
    color: var(--murekkep-alt);
    line-height: 1.4;
    margin-top: var(--b-3);
}

/* Dunya haritasi filigrani */
body[data-yeni] .yeni-harita { position: relative; overflow: hidden; }
body[data-yeni] .yeni-harita > svg {
    position: absolute;
    inset: 0;
    width: 100%; height: 100%;
    color: var(--sari);
    opacity: .07;
    pointer-events: none;
}
body[data-yeni] .yeni-harita > .yeni-kap { position: relative; }

body[data-yeni] .yeni-kita-bos {
    padding: var(--b-6) var(--b-5);
    text-align: center;
    font-size: .875rem;
    color: var(--murekkep-alt);
}

/* ══════════════════════════════════════════════════════════════════
   base.css SIZINTISI — <section> etiketinin kendisi
   ══════════════════════════════════════════════════════════════════
   base.css'te etiket seviyesinde bir kural var:
       section { max-width:1440px; margin:0 auto; padding:80px 40px }
   ve mobilde ayni kural `padding: 40px 16px !important` ile tekrarlaniyor.

   Bu, yeni tasarimda <section> kullandigim HER yere siziyordu. En gorunur
   sonucu: kita kartlari (.yeni-kita birer <section>) 160px bosuna dikey
   dolgu aliyordu - "Coming soon" yazan Africa karti 309px oluyordu.
   Mobildeki !important'li surum ise kendi bolum aralarimi da eziyordu.

   Etiket seviyesindeki kural tek yerde etkisizlestiriliyor; dolgular
   asagida sinif bazinda, ayni onem seviyesinde yeniden veriliyor.
   Butun sayfalar tasindiginda base.css sadelesirken bu blok kalkacak. */
body[data-yeni] section {
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    width: auto;
}
body[data-yeni] .yeni-bolum { padding: clamp(3rem, 5.5vw, 4.5rem) 0 !important; }
body[data-yeni] .yeni-hero  { padding: clamp(3.25rem, 6vw, 5rem) var(--b-5) !important; }
body[data-yeni] .yeni-cagri { padding: clamp(3rem, 6vw, 4.5rem) var(--b-5) !important; }
body[data-yeni] .yeni-kita  { padding: 0 !important; }

/* ══════════════════════════════════════════════════════════════════
   base.css SIZINTISI — mobildeki !important'li kurallar
   ══════════════════════════════════════════════════════════════════
   768px altinda base.css 20 ayri !important bildirimi uyguluyor.
   Cogu kabuga ait ve dogru (nav, hamburger, altbilgi, body padding);
   ama yedisi yeni tasarimin kendi olculerini eziyordu. Tarayicida
   tek tek degil toplu olarak tarandi (base.css'in !important kurallari
   ile bu sayfadaki ogeler eslestirilerek), sonra hepsi burada
   karsilandi.

   Butun sayfalar tasindiginda base.css sadelesirken bu blok kalkacak. */
@media (max-width: 768px) {
    /* `section > div { padding:0 !important }` kap bosluklarini
       siliyordu: "Latest Updates" basligi ekranin sol kenarina
       yapisiyordu. */
    body[data-yeni] .yeni-kap {
        max-width: 100% !important;
        padding-inline: clamp(1rem, 4vw, 1.5rem) !important;
    }

    /* `.card { padding !important }` guncelleme kartlarini eziyordu */
    body[data-yeni] .updates-card { padding: var(--b-4) !important; }
    body[data-yeni] .updates-card h4 { font-size: .9375rem !important; }

    /* `.committee-item*` kurallari komite kartlarini eziyordu */
    body[data-yeni] .committee-slide {
        min-height: 0 !important;
        padding: var(--b-5) !important;
    }
    body[data-yeni] .committee-icon {
        width: 56px !important;
        height: 56px !important;
        margin-bottom: var(--b-3) !important;
    }
    body[data-yeni] .committee-slide h3 { font-size: 1rem !important; }
    body[data-yeni] .committee-slide p  { font-size: .8125rem !important; }

    /* Sayac kartlarina soldan cizgi ekliyordu; kart zaten cerceveli */
    body[data-yeni] .stat-counter-card-h { border-left: 1px solid var(--cizgi) !important; }

    /* Dar ekranda kita kartlari tek sutun */
    body[data-yeni] .yeni-kitalar { grid-template-columns: 1fr; }
}

/* ══════════════════════════════════════════════════════════════════
   YENILEME KATMANI  (2026-09-07)
   ══════════════════════════════════════════════════════════════════
   Yigit: "baya benziyo orjinale, biraz daha yenilenmis birsey
   bekliyorum." Onceki tur orijinale fazla sadik kalmisti.

   Ne DEGISMIYOR: sari kimlik, ortalanmis duzen, siyah butonlar,
   beyaz/acik donusum, sicaklik. Yani "fazla sert" bulunan yone
   donulmuyor.

   Ne DEGISIYOR: derinlik ve motif.
     · duz 1px cerceveli kutular -> katmanli golgeli kartlar
     · soguk gri -> sariya egimli sicak notr
     · petek dokusu: markanin adindaki fikir ilk kez gorunuyor
     · bolum basliklarinda altigen isaret
     · daha buyuk tipografi karsitligi
     · kaydirmada beliren ogeler (altyapi shell.js'te zaten vardi)
   ────────────────────────────────────────────────────────────────── */

/* ── Petek: sari alanlarin uzerinde ── */
body[data-yeni] .yeni-hero,
body[data-yeni] .welcome-section {
    position: relative;
    background-image: var(--petek),
                      linear-gradient(135deg, var(--sari) 0%, var(--sari-acik) 100%);
    background-size: var(--petek-olcu), auto;
    background-position: center, 0 0;
}
/* Koyu cagri bandinda da ayni doku, beyaza cevrilmis */
body[data-yeni] .yeni-cagri { position: relative; }

/* ── Kartlar: cerceve degil derinlik ── */
body[data-yeni] .yeni-kart,
body[data-yeni] .yeni-sayi,
body[data-yeni] .yeni-uye,
body[data-yeni] .yeni-kita,
body[data-yeni] .yeni-proje,
body[data-yeni] .yeni-komite,
body[data-yeni] .yeni-kanal,
body[data-yeni] .yeni-mektup,
body[data-yeni] .yeni-panel,
body[data-yeni] .yeni-kutu,
body[data-yeni] .yeni-satir,
body[data-yeni] .yeni-makale,
body[data-yeni] .position-card,
body[data-yeni] .updates-card,
body[data-yeni] .committee-slide,
body[data-yeni] .yeni-kunye-kutu,
body[data-yeni] .yeni-cikti {
    border-color: rgba(21, 23, 28, .07);
    box-shadow: var(--g-md);
}
body[data-yeni] .yeni-kart:hover,
body[data-yeni] .yeni-uye:hover,
body[data-yeni] .yeni-proje:hover,
body[data-yeni] .yeni-komite:hover,
body[data-yeni] .yeni-kanal:hover,
body[data-yeni] .position-card:hover,
body[data-yeni] .updates-card:hover,
body[data-yeni] .committee-slide:hover,
body[data-yeni] .yeni-makale:hover,
body[data-yeni] .yeni-satir.tiklanir:hover,
body[data-yeni] .yeni-sayi:hover {
    box-shadow: var(--g-sari);
    border-color: rgba(251, 188, 5, .45);
    transform: translateY(-3px);
}
body[data-yeni] .yeni-kart,
body[data-yeni] .yeni-uye,
body[data-yeni] .yeni-proje,
body[data-yeni] .yeni-komite,
body[data-yeni] .yeni-kanal,
body[data-yeni] .position-card,
body[data-yeni] .updates-card,
body[data-yeni] .committee-slide,
body[data-yeni] .yeni-makale,
body[data-yeni] .yeni-satir,
body[data-yeni] .yeni-sayi {
    transition: box-shadow var(--gecis-orta), transform var(--gecis-orta),
                border-color var(--gecis-orta);
}

/* ── Bolum basligi: cizgi degil altigen ──
   Marka isareti bolum ayraci olarak calisiyor. */
body[data-yeni] .yeni-bolum-basligi::after {
    width: 18px;
    height: 20px;
    background: var(--sari);
    border-radius: 3px;
    clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
    margin-top: var(--b-5);
}
body[data-yeni] .yeni-bolum-basligi h2 {
    font-size: clamp(1.75rem, 3.2vw, 2.125rem);
    letter-spacing: -0.035em;
}
body[data-yeni] .yeni-bolum-basligi p { font-size: 1rem; margin-top: var(--b-2); }

/* ── Serit basliklari da ayni olcege ── */
body[data-yeni] .yeni-serit-ust h2 {
    font-size: clamp(1.75rem, 3.2vw, 2.125rem);
    letter-spacing: -0.035em;
}

/* ── Hero: daha guclu tipografi ── */
body[data-yeni] .welcome-section h1,
body[data-yeni] .yeni-hero h1 {
    font-size: clamp(2.375rem, 5.2vw, 3.5rem);
    letter-spacing: -0.04em;
    line-height: 1.06;
}
body[data-yeni] .yeni-hero p,
body[data-yeni] .welcome-section > p { font-size: 1.125rem; }

/* ── Butonlar: daha dolgun ── */
body[data-yeni] .yeni-dugme {
    padding: 14px 28px;
    border-radius: var(--y-md);
    box-shadow: 0 2px 6px rgba(21,23,28,.18);
}
body[data-yeni] .yeni-dugme:hover { transform: translateY(-2px); box-shadow: 0 6px 16px rgba(21,23,28,.24); }
body[data-yeni] .yeni-dugme.acik { box-shadow: 0 2px 6px rgba(26,20,0,.12); }

/* ── Nav: kaydirinca zeminden ayrilsin ──
   backdrop-filter nav'in KENDISINDE DEGIL, ::before katmaninda. Sebep:
   backdrop-filter, position:fixed torunlari icin kapsayan blok olusturur.
   Hamburger menusu (.nav-links.mobile-open) fixed + top:66px + bottom:0;
   filtre nav'dayken bu olculer ekrana degil 66px'lik nav'a gore
   hesaplandi -> menu 1px yukseklikte acildi, telefonda "buton calismiyor"
   gorundu (2026-09-13, 375 ve 900px'te olculdu). Sozde oge menunun atasi
   degil, o yuzden kapsayan blogu degistirmiyor. nav z-index:1000 ile
   kendi yigin baglamini kurdugu icin z-index:-1 nav'in icinde kaliyor. */
body[data-yeni] nav#globalnav {
    background: rgba(250, 248, 243, .88);
    border-bottom-color: rgba(21,23,28,.07);
}
body[data-yeni] nav#globalnav::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    backdrop-filter: saturate(180%) blur(12px);
    -webkit-backdrop-filter: saturate(180%) blur(12px);
}

/* ── Kaydirmada belirme ──
   shell.js zaten .card/.committee-item/.footer-column'a fade-in-up
   ekliyordu; yeni siniflar da ayni akisa katiliyor (shell.js'teki
   hedef listesine eklendiler). */
body[data-yeni] .fade-in-up { transition-duration: .55s; }

@media (prefers-reduced-motion: reduce) {
    body[data-yeni] .fade-in-up { opacity: 1 !important; transform: none !important; }
}

/* ══════════════════════════════════════════════════════════════════
   OUR GLOBAL REACH — yeniden duzenlendi (2026-09-07)
   ══════════════════════════════════════════════════════════════════
   Onceki hali her kitayi ayri bir KART yapiyordu ve kartlari 2 sutunlu
   bir izgaraya diziyordu. Kitalarin ulke sayisi cok farkli oldugu icin
   kart boylari da cok farkli cikiyordu:
       Europe 416px · Africa 149px · Americas 99px · Asia 226px
   Yan yana gelen iki kartin altinda buyuk bos alanlar kaliyordu; blok
   tirtikli ve bozuk goruniyordu.

   Yeni duzen: kita bir KART degil, bir BASLIK GRUBU. Ulkeler onun
   altinda kendi izgarasina diziliyor. Boylece her kita satirinin
   yuksekligi kendi icerigi kadar oluyor, bos alan kalmiyor ve blok
   bir dizin gibi okunuyor.

   Markup DEGISMEDI - ayni yapinin gorunumu geciliyor. */

body[data-yeni] .yeni-kitalar {
    grid-template-columns: 1fr !important;
    gap: var(--b-6);
}

/* Kita: kart degil, grup */
body[data-yeni] .yeni-kita {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    overflow: visible;
}

/* Kita basligi: ince kural uzerinde tek satir */
body[data-yeni] .yeni-kita-ust {
    background: transparent !important;
    border-bottom: 2px solid var(--sari) !important;
    padding: 0 0 var(--b-3) !important;
    margin-bottom: var(--b-4);
    gap: var(--b-3);
}
body[data-yeni] .yeni-kita-ust h3 {
    font-size: 1.125rem !important;
    letter-spacing: var(--arali-orta);
}
body[data-yeni] .yeni-kita-adet {
    background: transparent;
    border: none;
    padding: 0;
    font-size: .75rem;
    color: var(--murekkep-alt);
}

/* Ulkeler: satir listesi degil, kompakt izgara */
body[data-yeni] .yeni-kita > div {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    gap: var(--b-3);
}
body[data-yeni] .yeni-ulke {
    background: var(--zemin);
    border: 1px solid rgba(21,23,28,.07);
    border-radius: var(--y-md);
    box-shadow: var(--g-sm);
    padding: 11px var(--b-4) !important;
    transition: border-color var(--gecis-hizli), box-shadow var(--gecis-hizli),
                transform var(--gecis-hizli);
}
body[data-yeni] .yeni-ulke:hover {
    border-color: rgba(251,188,5,.45);
    box-shadow: var(--g-md);
    transform: translateY(-2px);
}
/* Izgaraya gecince ust cizgi gereksiz - her kutu kendi cercevesinde */
body[data-yeni] .yeni-ulke + .yeni-ulke { border-top: 1px solid rgba(21,23,28,.07); }

/* Dar kutuda ad ve ortak alt alta: yan yana sigmiyor ve kesilirdi */
body[data-yeni] .yeni-ulke > span:nth-child(2) {
    flex-direction: column;
    align-items: flex-start;
    gap: 1px;
}
body[data-yeni] .yeni-ulke-ort { margin-left: 0; }

/* "Coming soon" — bos kita */
body[data-yeni] .yeni-kita-bos {
    padding: var(--b-5) !important;
    text-align: left;
    background: var(--zemin-alt);
    border: 1px dashed var(--cizgi-koyu);
    border-radius: var(--y-md);
}

@media (max-width: 480px) {
    body[data-yeni] .yeni-kita > div { grid-template-columns: 1fr; }
}

/* ══════════════════════════════════════════════════════════════════
   NAV ORTALAMA  (2026-09-13)
   ══════════════════════════════════════════════════════════════════
   Yigit: "Home About falan onlar cok ortali durmuyor."
   Olculdugunde (1280px): sayfa merkezi 632px, baglantilarin merkezi
   608px. Iki sebep:
     1. .nav-container flex + space-between. Solda logo 165px, sagda
        Sign In 77px - farkli genislikte oldugu icin aradaki flex:1
        grup sayfanin ortasina degil, ikisinin arasina ortalaniyordu.
     2. "Apply Now" baglanti listesinin (<ul>) icindeydi; ortalama onu
        da hesaba katiyor, metin baglantilarini sola itiyordu.

   Cozum (sadece masaustu): 1fr auto 1fr izgarasi. Iki yan sutun ESIT
   genislikte oldugu icin ortadaki sutun sayfanin tam ortasina oturuyor.
   DIKKAT: yan sutun icerigi sutundan genis gelirse ortaya tasar - oturum
   acilinca uzun kullanici adi tam bunu yapti (asagida .nav-sag kurali).
   APPLY NOW TEK OGE. Ilk surumde sag gruba ikinci bir kopya eklenmis ve
   biri CSS ile gizleniyordu. Tarayici eski CSS'i onbellekten verince iki
   buton birden goruniyordu. Artik markup'ta tek <a class="nav-basvur">
   var; shell.js onu genis ekranda sag gruba, dar ekranda menuye TASIYOR.
   Gizleme kurali yok: CSS eski kalsa da, JS calismasa da ekranda tek buton. */

body[data-yeni] .nav-basvur {
    font-family: var(--yt-metin);
    font-size: .8125rem;
    font-weight: 700;
    min-height: 38px;
    padding: 8px 16px;
    border: none;
    border-radius: var(--y-md);
    background: linear-gradient(135deg, var(--sari), var(--sari-acik));
    color: #2e2200;                       /* sari uzerinde 9.14 */
    cursor: pointer;
    white-space: nowrap;
    box-shadow: 0 1px 3px rgba(251,188,5,.35);
    transition: filter var(--gecis-hizli), transform var(--gecis-hizli);
}
body[data-yeni] .nav-basvur:hover { filter: brightness(.95); transform: translateY(-1px); }

/* Oturum acilinca "Verify" ile "Apply Now" ust uste biniyordu (Yigit, 2026-09-14).
   auth-nav.js "Sign In" (77px) yerine "🐝 ad" yaziyor. .nav-container en fazla
   1100px oldugu icin sag sutun ~228px'te sabit kaliyor; Apply Now (~134px) +
   bosluk + giris butonu buna ancak ad ~84px'e kadarsa sigiyor. Sigmayinca
   justify-self:end sag grubu SOLA tasiriyordu: "🐝 yigitgokgz" 11-29px,
   uzun bir ad 106px'e kadar Verify'in ustune bindi (olculdu).
   Cozum: oturum ACIKKEN sag grup sutununu asamaz; sigmayan ad ucuna "…"
   koyarak kisalir (tam ad title'da), buton yan dolgusu 16 -> 10px (ada yer).
   Sayi yok - ada her genislikte kalan yer kadar alan.
   Yalnizca oturum acikken: ilk surum kurali her duruma uyguluyordu ve
   1080px'te "Sign In"i de "Sign…" yapiyordu (olculdu). Oturumsuz nav eski,
   olculmus davranisinda kaliyor. :has desteklemeyen eski tarayicida kural
   devre disi - orada davranis duzeltme oncesiyle ayni. */
body[data-yeni] .nav-sag:has(#nav-login-btn[data-signed-in]) { max-width: 100%; min-width: 0; }
body[data-yeni] #nav-login-btn[data-signed-in] {
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding-left: 10px !important;
    padding-right: 10px !important;
}

/* KADEME SINIRLARI KUSURATLI: max-width 1023.98px / min-width 768.02px.
   Olcekli ekranda genislik 1023.5 gibi kusuratli cikabiliyor. Sinirlar
   1023px ve 1024px olunca arada yarim piksellik bir bosluk kaliyordu;
   oraya dusen ekran HICBIR kurali almiyor, eski bozuk flex duzenine
   donuyordu (1023px'te olculdu: sapma 35px, Sign In ekran disinda).
   Ayni bosluk base.css'in max-width:768px siniriyla da vardi.

   Kademe 1 (>=1024px): tam ortali izgara.
   Olculdu: 1280 ve 1104px'te sapma 0, cakisma yok. */
@media (min-width: 1024px) {
    body[data-yeni] .nav-container {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
        align-items: center;
        column-gap: var(--b-4);
    }
    body[data-yeni] .logo-area { justify-self: start; }
    body[data-yeni] .nav-links { flex: none; justify-self: center; }
    body[data-yeni] .nav-sag   { justify-self: end; }
}
/* Kademe 2 (1024-1079px): ayni izgara, baglanti dolgulari sikilasiyor.
   Tam dolguyla 1024px'te Verify sag grupla 6px cakisiyordu. */
@media (min-width: 1024px) and (max-width: 1079px) {
    body[data-yeni] .nav-links > li > a { padding: 8px 8px; font-size: .78rem; }
    body[data-yeni] .nav-container { column-gap: var(--b-2); }
}

/* Kademe 3 (769-1023px, tablet): hamburger menu.
   8 baglanti + logo + sag grup bu aralikta tek satira SIGMIYOR.
   Canli sitede (master) 900px'te Sign In zaten ekranin disina itilmis,
   Apply Now sag kenardan kesiliyordu - yani bu eski bir sorun. base.css
   hamburger'i yalnizca <=768px'te aciyordu; asagidaki kurallar onun
   mobil menu kurallarinin (base.css ~799-850) bu araliga birebir tasinmis
   hali. Davranis ayni: shell.js'teki toggleMobileMenu() .mobile-open
   sinifini degistiriyor. */
@media (min-width: 768.02px) and (max-width: 1023.98px) {
    body[data-yeni] .menu-toggle {
        display: flex !important;
        align-items: center;
        justify-content: center;
    }
    body[data-yeni] .nav-links { display: none !important; }
    body[data-yeni] .nav-links.mobile-open {
        display: flex !important;
        flex-direction: column;
        position: fixed;
        top: 66px; left: 0; right: 0; bottom: 0;
        width: 100%;
        background: var(--zemin);
        border-top: 1px solid var(--cizgi);
        z-index: 998;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }
    body[data-yeni] .nav-links.mobile-open > li {
        width: 100%;
        border-left: none;
        border-bottom: 1px solid var(--cizgi);
    }
    body[data-yeni] .nav-links.mobile-open > li:last-child { border-bottom: none; }
    body[data-yeni] .dropdown-menu { display: none !important; }
}

/* Hamburger acikken menu ogeleri (<=1023px): masaustu dolgusu (8px 12px)
   burada da uygulaniyordu ve dokunma hedefi kucuk kaliyordu. */
@media (max-width: 1023.98px) {
    body[data-yeni] .nav-links.mobile-open > li > a {
        display: block;
        padding: 16px 24px;
        font-size: 1rem;
        border-radius: 0;
        color: var(--murekkep) !important;
    }
}

/* ══════════════════════════════════════════════════════════════════
   OTURUM B DUZELTMELERI (2026-09-14) — bkz. Hata-Ayiklama-Raporu.md
   ══════════════════════════════════════════════════════════════════ */

/* Ö2 — Afis icerigin ustunu ortuyordu.
   Afis position:fixed idi, govde ustten SABIT bosluk aliyordu (masaustu
   66px padding + 60px margin = 126px, mobil 130px). Afisin gercek boyu
   yeni tipografiyle 91px: alt kenari 157px'te, icerik 126px'te basliyordu
   -> 1280px'te 30.6px ortme (olculdu). Eski tasarimda da 16-20px ortuyordu;
   bosluk elle tutturulan bir sayi oldugu icin her yazi tipi degisikliginde
   yeniden bozuluyor.
   Cozum sayisiz: afis akisa donuyor (sticky). Nav'in hemen altinda kendi
   boyu kadar yer kapliyor, kaydirinca yine nav'in altina yapisik kaliyor -
   gorulen davranis ayni, ama icerik afisin boyu ne olursa olsun tam
   altindan basliyor. html/body'de overflow yok, sticky calisiyor.
   Afissiz sayfalar (login/profile/verify) bu kuralin disinda, degismedi. */
body[data-yeni]:not([data-no-carousel]) {
    padding-top: 66px !important;
    margin-top: 0 !important;
}
body[data-yeni] .carousel-banner {
    position: sticky;
    top: 66px;
}

/* Ö4 — Mektup kaydiricisi slayt degistikce zipliyordu.
   Slaytlar display:none/block ile degisiyordu; kutu her seferinde o
   mektubun boyuna iniyordu (1280px'te 436<->382px). Altindaki her sey
   4.5 saniyede bir yukari asagi kayiyordu.
   Cozum: bes slayt ayni izgara hucresinde ust uste; kutu en uzun mektubun
   boyunu aliyor ve bir daha degismiyor. Gecis display yerine opacity ile.
   Pasif slayt visibility:hidden - ekran okuyucu ve klavye yalnizca
   gorunen mektubu goruyor.
   Raporun "ilk mektup gorunmez basliyor" kismi olcum yanilgisiydi: on
   plandaki sekmede ilk slayt 600ms'de tam gorunur (arka plan sekmesinde
   animasyon ilerlemiyor). Yeni hal animasyona hic bagli degil - ilk slayt
   ilk karede gorunur. */
body[data-yeni] .letters-slider {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: center;
}
body[data-yeni] .letter-slide,
body[data-yeni] .letter-slide.active {
    display: block;
    grid-area: 1 / 1;
    animation: none;
}
body[data-yeni] .letter-slide {
    opacity: 0;
    visibility: hidden;
    transition: opacity .5s ease, visibility 0s linear .5s;
}
body[data-yeni] .letter-slide.active {
    opacity: 1;
    visibility: visible;
    transition: opacity .5s ease;
}
body[data-yeni] .yeni-noktalar { grid-area: 2 / 1; }

/* Ö5 — "Yukari don" butonu. Markup modals.html'e geri kondu; base.css'teki
   kurallar (44px sari daire) duruyor. Gizliyken opacity 0 ama klavyeyle
   odaklanabiliyordu - gorunmez odak. visibility bunu kapatiyor. */
body[data-yeni] #back-to-top {
    background: var(--sari);
    color: #2e2200;                       /* sari uzerinde 9.14 */
    box-shadow: var(--g-lg);
    visibility: hidden;
    transition: opacity .3s ease, transform .3s ease, visibility 0s linear .3s;
}
body[data-yeni] #back-to-top.show {
    visibility: visible;
    transition: opacity .3s ease, transform .3s ease;
}
body[data-yeni] #back-to-top:focus-visible {
    outline: 3px solid var(--murekkep);
    outline-offset: 3px;
}

/* Sayfa ici baglantilar (raporda yoktu, Oturum B'de bulundu).
   Makale icindekilerindeki #essay3 gibi baglantilar hedefi ekranin en
   ustune getiriyordu; nav + afis orada 157px kapladigi icin baslik
   kapagin altinda kaliyordu (olculdu: 157px gizli). --ust-kapak'i
   shell.js olcuyor - afisin boyu yazi tipiyle degisebiliyor. Deger
   gelmezse 157px yedegi kullaniliyor. */
html { scroll-padding-top: calc(var(--ust-kapak, 157px) + 1rem); }

/* Kc4/Kc5 — Tiklanabilir kartlar artik gercek baglanti (<a>).
   Onceden div onclick'ti: klavyeyle odaklanamiyor, orta tikla yeni sekmede
   acilamiyor, ekran okuyucu baglanti olarak duyurmuyordu. Ana sayfadaki
   komite kartlari da genel /committees/ yerine komitenin kendi sayfasina
   gidiyor. <a> satir ici dogdugu icin display'i olmayan kartlara blok
   veriliyor; tarayicinin baglanti rengi ve alt cizgisi sifirlaniyor.
   (events.html'deki .yeni-satir.tiklanir div kaldi: icinde kendi
   butonlari var, klavye onlarla zaten ulasiyor.) */
body[data-yeni] a.yeni-komite,
body[data-yeni] a.yeni-proje { display: block; }
body[data-yeni] a.yeni-komite,
body[data-yeni] a.yeni-proje,
body[data-yeni] a.committee-slide,
body[data-yeni] a.updates-card {
    color: var(--murekkep);
    text-decoration: none;
}
/* Genel :focus-visible kurali koseyi --y-sm'e cekiyor; kartta odak
   halkasi kartin kendi kosesini izlesin. */
body[data-yeni] a.yeni-komite:focus-visible,
body[data-yeni] a.yeni-proje:focus-visible,
body[data-yeni] a.committee-slide:focus-visible,
body[data-yeni] a.updates-card:focus-visible { border-radius: var(--y-lg); }
/* Kart icindeki "Read Article →" artik <span> (baglanti icinde buton
   gecersiz HTML). Buton gibi dikey ortali; karta gelince koyulasiyor. */
body[data-yeni] .updates-card span.welcome-btn { display: inline-flex; align-items: center; }
/* base.css <=768px'te .welcome-btn'e flex:1 veriyor (ana sayfa karsilama
   butonlarini yan yana esitlemek icin). Dikey kartta bu, butonu kartin
   bos alanini doldurana kadar uzatiyordu - 375px'te 150px (olculdu). */
body[data-yeni] .updates-card .welcome-btn { flex: none; }
body[data-yeni] .updates-card:hover .welcome-btn { background: #000; }

/* Kc3 — Kucuk yazi: bu dosyadaki 9px (.5625rem) ve 10px (.625rem) yazi
   boyutlarinin hepsi 11px'e (.6875rem) cikarildi - rozetler, etiketler,
   afis basligi, kunye basliklari. En kucuk yazi artik 11px.
   "Sign In" dokunmatik ekranda 77x31px'ti: parmakla kullanilan cihazda en
   az 44px, faredeki gorunum ayni. Satir ici onmouseover yaziyi sariya
   ceviriyordu (acik zeminde 1.62, okunmuyor) - yazi rengi sabit, sari
   kenarlikta kaliyor. */
/* Yazi tabani 11px'e cikinca /applications/members/ hero'sundaki uzun
   rozet ("Now Open — 2026/27 Team Member Applications") white-space:nowrap
   yuzunden 360px'te 30px tasti - Oturum B'nin tam site taramasi yakaladi.
   Rozet artik sigmazsa satir atliyor; sigan rozetler tek satir kaliyor
   (inline-flex genisligi icerigi kadar, sarma yalnizca yer bitince). */
body[data-yeni] .yeni-durum {
    max-width: 100%;
    white-space: normal;
    line-height: 1.4;
    text-align: center;
}

body[data-yeni] #nav-login-btn { color: var(--murekkep) !important; }
@media (pointer: coarse) {
    body[data-yeni] #nav-login-btn { min-height: var(--dokunma); }
}

@media (prefers-reduced-motion: reduce) {
    body[data-yeni] .letter-slide,
    body[data-yeni] .letter-slide.active,
    body[data-yeni] #back-to-top { transition: none; }
}