/* YURDAKUL MÜHENDİSLİK — web sitesi
   Marka: lacivert #1E1A50 · altın #B9A46A · ayraç #A9A6BC · açık zemin #F4F3F8
   Tipografi: Poppins (başlık/etiket) + Lato (gövde). Büyük, rahat okunur puntolar. */

:root{
  --laci:#1E1A50; --laci-2:#2A2568; --altin:#B9A46A; --altin-2:#CDBB8C;
  --ayrac:#A9A6BC; --zemin:#F4F3F8; --beyaz:#FFFFFF;
  --metin:#1E1A50; --metin-2:#4A4770; --metin-3:#75729A;
  --en:1280px; --dar:860px;
  --f-b:'Poppins',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --f-g:'Lato',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --golge:0 1px 2px rgba(30,26,80,.06), 0 8px 28px rgba(30,26,80,.08);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth}
body{
  margin:0; background:var(--beyaz); color:var(--metin);
  font-family:var(--f-g); font-size:20px; line-height:1.72;
  font-weight:400; -webkit-font-smoothing:antialiased;
}
img{max-width:100%; display:block}
a{color:inherit}
h1,h2,h3,h4{font-family:var(--f-b); font-weight:600; color:var(--laci); margin:0; line-height:1.18; letter-spacing:-.015em}
p{margin:0 0 1.15em}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

.kap{max-width:var(--en); margin:0 auto; padding:0 32px}
.kap-dar{max-width:var(--dar); margin:0 auto; padding:0 32px}

/* ---------------------------------------------------------- üst bar */
.ust{position:sticky; top:0; z-index:60; background:rgba(255,255,255,.94);
     backdrop-filter:saturate(1.5) blur(12px); border-bottom:1px solid #E7E5F0}
.ust-ic{display:flex; align-items:center; gap:28px; height:100px}
.marka{display:flex; align-items:center; gap:14px; text-decoration:none; margin-right:auto}
.marka img{height:55px; width:auto}
.marka b{font-family:var(--f-b); font-size:23px; font-weight:600; letter-spacing:.02em; color:var(--laci); line-height:1.15}
.marka span{display:block; font-family:var(--f-b); font-size:14px; font-weight:500; letter-spacing:.16em;
            text-transform:uppercase; color:var(--altin)}
nav.gez{display:flex; gap:30px; align-items:center}
nav.gez a{font-family:var(--f-b); font-size:16.5px; font-weight:500; color:var(--metin-2);
          text-decoration:none; padding:6px 0; border-bottom:2px solid transparent; white-space:nowrap}
nav.gez a:hover{color:var(--laci); border-bottom-color:var(--altin)}
nav.gez a.aktif{color:var(--laci); border-bottom-color:var(--altin)}
.dil{display:flex; align-items:center; gap:2px; font-family:var(--f-b); font-size:15px; font-weight:600}
.dil a{text-decoration:none; color:var(--metin-3); padding:5px 9px; border-radius:6px}
.dil a.aktif{color:var(--beyaz); background:var(--laci)}
.mnu{display:none; background:none; border:0; cursor:pointer; padding:10px; color:var(--laci)}
.mnu svg{width:28px;height:28px}

/* ------------------------------------------------------------- hero */
.hero{position:relative; min-height:min(78vh,700px); display:flex; align-items:flex-end;
      background:var(--laci); overflow:hidden}
.hero img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.42}
.hero::after{content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(30,26,80,.55) 0%, rgba(30,26,80,.25) 40%, rgba(30,26,80,.92) 100%)}
.hero-ic{position:relative; z-index:2; width:100%; padding:0 0 72px}
.hero h1{color:var(--beyaz); font-size:clamp(38px,5.2vw,66px); font-weight:600; max-width:16ch; margin-bottom:22px}
.hero p{color:#E6E3F2; font-size:clamp(19px,1.6vw,23px); max-width:56ch; margin-bottom:30px}
.hero .etiket{color:var(--altin-2)}

.etiket{font-family:var(--f-b); font-size:13.5px; font-weight:600; letter-spacing:.2em;
        text-transform:uppercase; color:var(--altin); margin-bottom:16px; display:block}

.dugme{display:inline-flex; align-items:center; gap:10px; font-family:var(--f-b); font-weight:600;
       font-size:17px; text-decoration:none; padding:15px 30px; border-radius:2px;
       background:var(--altin); color:#1a1730; border:1px solid var(--altin); transition:.16s}
.dugme:hover{background:#C9B47C; border-color:#C9B47C}
.dugme.bos{background:transparent; color:var(--beyaz); border-color:rgba(255,255,255,.5)}
.dugme.bos:hover{background:rgba(255,255,255,.12); border-color:#fff}
.dugme.koyu{background:var(--laci); border-color:var(--laci); color:#fff}
.dugme.koyu:hover{background:var(--laci-2); border-color:var(--laci-2)}

/* ---------------------------------------------------------- sayılar */
.sayilar{background:var(--laci); color:#fff}
.sayilar .kap{display:grid; grid-template-columns:repeat(3,1fr); gap:8px; padding-top:52px; padding-bottom:52px}
.sayi{text-align:center; padding:0 12px}
.sayi b{display:block; font-family:var(--f-b); font-size:clamp(38px,4vw,54px); font-weight:600;
        color:var(--altin-2); line-height:1.05; letter-spacing:-.02em}
.sayi span{display:block; margin-top:8px; font-family:var(--f-b); font-size:15px; font-weight:500;
           letter-spacing:.12em; text-transform:uppercase; color:#BDB9D6}

/* ---------------------------------------------------------- bölümler */
section{padding:104px 0}
section.acik{background:var(--zemin)}
.bas{max-width:62ch; margin-bottom:56px}
.bas h2{font-size:clamp(30px,3.4vw,44px); margin-bottom:18px}
.bas p{color:var(--metin-2); font-size:21px; margin:0}
.bas-sat{display:flex; align-items:flex-end; justify-content:space-between; gap:32px; flex-wrap:wrap}

/* ------------------------------------------------------ proje kartlar */
.izgara{display:grid; grid-template-columns:repeat(3,1fr); gap:34px}
.kart{display:block; text-decoration:none; background:var(--beyaz); border:1px solid #E7E5F0;
      border-radius:3px; overflow:hidden; transition:.2s; box-shadow:var(--golge)}
.kart:hover{transform:translateY(-4px); box-shadow:0 2px 4px rgba(30,26,80,.06), 0 18px 44px rgba(30,26,80,.16)}
.kart-gorsel{position:relative; aspect-ratio:4/3; background:var(--laci); overflow:hidden}
.kart-gorsel img{width:100%; height:100%; object-fit:cover; transition:.4s}
.kart:hover .kart-gorsel img{transform:scale(1.045)}
.kart-yazi{padding:24px 26px 28px}
.kart .kat{font-family:var(--f-b); font-size:12.5px; font-weight:600; letter-spacing:.16em;
           text-transform:uppercase; color:var(--altin); display:block; margin-bottom:10px}
.kart h3{font-size:21px; line-height:1.32; margin-bottom:10px}
.kart .yer{font-size:17px; color:var(--metin-3); margin:0}
.rozet{display:inline-block; font-family:var(--f-b); font-size:11.5px; font-weight:600; letter-spacing:.14em;
       background:var(--laci); color:var(--altin-2); padding:4px 9px; border-radius:2px; margin-left:8px;
       vertical-align:middle}

/* ------------------------------------------------------- uzmanlık */
.uzm{display:grid; grid-template-columns:repeat(3,1fr); gap:2px; background:#E7E5F0; border:1px solid #E7E5F0}
.uzm > div{background:var(--beyaz); padding:38px 34px}
.uzm h3{font-size:22px; margin-bottom:16px; padding-bottom:16px; border-bottom:2px solid var(--altin); display:inline-block}
.uzm ul{margin:0; padding:0; list-style:none}
.uzm li{font-size:17.5px; line-height:1.6; color:var(--metin-2); padding:6px 0 6px 20px; position:relative}
.uzm li::before{content:""; position:absolute; left:0; top:15px; width:7px; height:1px; background:var(--ayrac)}

/* ------------------------------------------------------- metin bloğu */
.yazi{font-size:20.5px; line-height:1.78; color:var(--metin-2)}
.yazi p{margin-bottom:1.3em}
.yazi h2{margin:1.6em 0 .6em; font-size:32px}
.yazi strong{color:var(--laci); font-weight:700}

/* --------------------------------------------------------- ekip */
.ekip-bas{font-size:22px; margin:44px 0 18px; padding-bottom:14px;
          border-bottom:2px solid var(--altin); display:inline-block}
.ekip{display:grid; grid-template-columns:repeat(2,1fr); gap:2px; background:#E7E5F0; border:1px solid #E7E5F0}
.ekip.tek{grid-template-columns:1fr}
.ekip > div{background:var(--beyaz); padding:26px 30px}
.ekip b{display:block; font-family:var(--f-b); font-size:20px; font-weight:600; color:var(--laci);
        line-height:1.3; margin-bottom:8px}
.ekip span{display:block; font-size:16.5px; line-height:1.45; color:var(--metin-2)}
.ekip .okul{color:var(--metin-3)}
.ekip .ofis{font-family:var(--f-b); font-size:13px; font-weight:600; letter-spacing:.14em;
            text-transform:uppercase; color:var(--altin); margin-top:6px}

/* ------------------------------------------------------ liste/etiket */
.rozetler{display:flex; flex-wrap:wrap; gap:12px; list-style:none; padding:0; margin:0}
.rozetler li{font-family:var(--f-b); font-size:16px; font-weight:500; color:var(--metin-2);
             border:1px solid var(--ayrac); border-radius:2px; padding:10px 18px; background:var(--beyaz)}

/* ------------------------------------------------ proje detay sayfası */
.detay-ust{background:var(--laci); color:#fff; padding:0}
.detay-gorsel{position:relative; height:min(64vh,560px); overflow:hidden; background:var(--laci)}
.detay-gorsel img{width:100%;height:100%;object-fit:cover; opacity:.85}
.detay-bas{padding:64px 0 0}
.detay-bas h1{font-size:clamp(32px,4vw,52px); max-width:20ch; margin-bottom:18px}
.detay-govde{display:grid; grid-template-columns:1.55fr 1fr; gap:72px; align-items:start; padding:72px 0 0}
.kunye{border-top:2px solid var(--laci); padding-top:6px}
.kunye dl{margin:0}
.kunye dt{font-family:var(--f-b); font-size:12.5px; font-weight:600; letter-spacing:.16em;
          text-transform:uppercase; color:var(--altin); margin-top:22px}
.kunye dd{margin:4px 0 0; font-size:18.5px; color:var(--laci); line-height:1.5}
.detay-foto{display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:64px}
.detay-foto .genis{grid-column:1/-1}
.detay-foto img{width:100%; border-radius:2px}

/* ------------------------------------------------- tüm projeler tablo */
.suzgec{display:flex; gap:16px; flex-wrap:wrap; align-items:center; margin-bottom:28px}
.suzgec input,.suzgec select{font-family:var(--f-g); font-size:17.5px; color:var(--laci);
  padding:13px 16px; border:1px solid var(--ayrac); border-radius:2px; background:var(--beyaz); min-width:200px}
.suzgec input{flex:1 1 280px}
.suzgec input:focus,.suzgec select:focus{outline:2px solid var(--altin); outline-offset:1px}
.sonuc{font-family:var(--f-b); font-size:16px; color:var(--metin-3); margin-bottom:18px}
.tablo-sar{overflow-x:auto; border:1px solid #E7E5F0}
table.projeler{width:100%; border-collapse:collapse; font-size:16px; background:var(--beyaz); table-layout:fixed; min-width:1180px}
table.projeler th{font-family:var(--f-b); font-size:12.5px; font-weight:600; letter-spacing:.1em;
  text-transform:uppercase; text-align:left; color:#fff; background:var(--laci); padding:14px 14px; white-space:nowrap}
table.projeler td{padding:14px 12px; border-top:1px solid #EFEDF5; color:var(--metin-2);
  vertical-align:top; overflow-wrap:break-word; word-break:normal; hyphens:none}
table.projeler tr:nth-child(even) td{background:#FBFAFD}
table.projeler td.ad{color:var(--laci); font-weight:600; font-family:var(--f-b); font-size:16px}
/* Genişlikler, bölünemeyen en uzun kelimelere göre hesaplandı:
   Mimar TABANLIOĞLU / KO&PARTNERS · Yer KAHRAMANMARAŞ, YEKATERİNBURG ·
   Ülke TÜRKMENİSTAN · İşveren GİRİŞİMCİLER · Durum "Devam Ediyor" rozeti.
   Kelime ortasından bölünme olmamalı — değiştirirken tarayıcıda kontrol edin. */
table.projeler col.c1{width:18.5%} table.projeler col.c2{width:13%}
table.projeler col.c3{width:12.5%} table.projeler col.c4{width:13.5%}
table.projeler col.c5{width:12.5%} table.projeler col.c6{width:13%}
table.projeler col.c7{width:5%}    table.projeler col.c8{width:12%}
/* ikincil sütunlar biraz daha küçük punto — kısa kod/ad yazıları */
table.projeler td:nth-child(2),table.projeler td:nth-child(3),
table.projeler td:nth-child(4),table.projeler td:nth-child(5){font-size:15px}
.durum{display:inline-block; font-family:var(--f-b); font-size:12.5px; font-weight:600; padding:4px 10px;
       border-radius:2px; white-space:nowrap}
.durum.d1{background:#E8F3EC; color:#22694A}
.durum.d2{background:#FCF3E0; color:#8A6A16}

/* ---------------------------------------------------------- iletişim */
.ilet{display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:start}
.ilet dt{font-family:var(--f-b); font-size:12.5px; font-weight:600; letter-spacing:.16em;
         text-transform:uppercase; color:var(--altin); margin-top:26px}
.ilet dd{margin:6px 0 0; font-size:20px; color:var(--laci)}
.ilet dd a{text-decoration:none; border-bottom:1px solid var(--ayrac)}
.ilet dd a:hover{border-bottom-color:var(--altin)}
.harita{border:0; width:100%; height:420px; filter:grayscale(.35) contrast(1.02)}

/* ------------------------------------------------------------- şerit */
.serit{background:var(--laci); color:#fff; text-align:center; padding:96px 0}
.serit h2{color:#fff; font-size:clamp(28px,3.2vw,40px); max-width:22ch; margin:0 auto 20px}
.serit p{color:#BDB9D6; font-size:20px; max-width:56ch; margin:0 auto 32px}

/* ------------------------------------------------------------ altbilgi */
footer{background:#15123A; color:#B7B3D2; padding:48px 0 28px; font-size:17px}
footer .kap{display:grid; grid-template-columns:1.4fr 1fr 1.1fr; gap:40px}
footer h4{color:#fff; font-family:var(--f-b); font-size:14px; font-weight:600; letter-spacing:.16em;
          text-transform:uppercase; margin-bottom:14px}
footer a{color:#B7B3D2; text-decoration:none; display:block; padding:3px 0; line-height:1.45}
footer a:hover{color:var(--altin-2)}
footer img.logo{height:52px; margin-bottom:20px}
.alt{border-top:1px solid #2A2758; margin-top:34px; padding-top:20px; font-size:15.5px; color:#7D799E;
     display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap}

/* ------------------------------------------------------------ mobil */
@media (max-width:1080px){
  .izgara{grid-template-columns:repeat(2,1fr)}
  .uzm{grid-template-columns:repeat(2,1fr)}
  .detay-govde{grid-template-columns:1fr; gap:44px}
  footer .kap{grid-template-columns:1fr 1fr}
}
@media (max-width:820px){
  body{font-size:19px}
  .kap,.kap-dar{padding:0 22px}
  section{padding:72px 0}
  nav.gez{position:fixed; inset:100px 0 auto; background:#fff; flex-direction:column; align-items:stretch;
          gap:0; padding:12px 22px 24px; border-bottom:1px solid #E7E5F0; display:none}
  nav.gez.acik{display:flex}
  nav.gez a{padding:16px 0; border-bottom:1px solid #EFEDF5; font-size:19px}
  .mnu{display:block; order:3}
  .izgara,.uzm,.ekip,.ilet{grid-template-columns:1fr}
  .sayilar .kap{grid-template-columns:repeat(3,1fr); gap:8px}
  .sayi{padding:0 4px}
  .sayi span{font-size:12.5px; letter-spacing:.08em}
  .detay-foto{grid-template-columns:1fr}
  footer .kap{grid-template-columns:1fr}
}

@media print{ .ust,.mnu,footer,.serit{display:none} }

/* --- ek --- */
.dugmeler{display:flex; gap:14px; flex-wrap:wrap}
.ft-marka{display:flex; align-items:center; gap:14px; margin-bottom:16px}
.ft-marka img{height:46px; width:auto}
.ft-marka b{font-family:var(--f-b); font-size:20px; font-weight:600; letter-spacing:.02em; color:#fff; line-height:1.15}
.ft-marka span{display:block; font-family:var(--f-b); font-size:12.5px; font-weight:500; letter-spacing:.16em;
               text-transform:uppercase; color:var(--altin)}
.kart-yazi{min-height:150px}
@media (max-width:820px){ .kart-yazi{min-height:0} }

/* ---------------------------- yorum kutusu (yalnızca inceleme sürümünde) */
.gizli{position:absolute;left:-9999px}
.yb{position:fixed; right:24px; bottom:24px; z-index:80; font-family:var(--f-g)}
.yb-dug{font-family:var(--f-b); font-size:16px; font-weight:600; color:#1a1730; background:var(--altin);
        border:0; border-radius:2px; padding:15px 26px; cursor:pointer; box-shadow:0 8px 28px rgba(30,26,80,.28)}
.yb-dug:hover{background:#C9B47C}
.yb-panel{display:none; position:absolute; right:0; bottom:64px; width:min(400px,calc(100vw - 48px));
          background:#fff; border:1px solid var(--ayrac); border-radius:3px; padding:26px 26px 24px;
          box-shadow:0 12px 48px rgba(30,26,80,.26)}
.yb.acik .yb-panel{display:block}
.yb.acik .yb-dug{background:var(--laci); color:#fff; border:1px solid var(--altin)}
.yb-panel h4{font-family:var(--f-b); font-size:20px; font-weight:600; color:var(--laci); margin:0 0 6px}
.yb-alt{font-size:15px; line-height:1.5; color:var(--metin-3); margin:0 0 18px}
.yb-panel label{display:block; font-family:var(--f-b); font-size:13px; font-weight:600; letter-spacing:.1em;
                text-transform:uppercase; color:var(--altin); margin-bottom:14px}
.yb-panel input[type=text],.yb-panel select,.yb-panel textarea{
  display:block; width:100%; margin-top:6px; font-family:var(--f-g); font-size:17px; color:var(--laci);
  padding:11px 13px; border:1px solid var(--ayrac); border-radius:2px; background:#fff;
  text-transform:none; letter-spacing:0; font-weight:400}
.yb-panel textarea{resize:vertical; line-height:1.5}
.yb-panel input:focus,.yb-panel select:focus,.yb-panel textarea:focus{outline:2px solid var(--altin); outline-offset:1px}
.yb-sat{display:flex; gap:12px; align-items:center; margin-top:4px}
.yb-sat .dugme{padding:12px 24px; font-size:16px}
.yb-kapat{background:none; border:0; font-family:var(--f-b); font-size:15px; color:var(--metin-3); cursor:pointer}
.yb-kapat:hover{color:var(--laci)}
@media (max-width:820px){
  .yb{right:16px; bottom:16px}
  .yb-panel{bottom:60px; max-height:70vh; overflow-y:auto}
}

/* ------------------------------------------------------- meslek kuruluşları */
.uyelikler{display:grid; grid-template-columns:repeat(3,1fr); gap:2px;
           background:#E7E5F0; border:1px solid #E7E5F0}
.uye{background:var(--beyaz); padding:30px 26px; display:flex; flex-direction:column;
     align-items:center; justify-content:center; gap:14px; text-align:center; min-height:170px}
.uye img{max-height:64px; max-width:180px; width:auto; object-fit:contain}
.uye span{font-size:15.5px; line-height:1.4; color:var(--metin-3)}
.uye.yazi-uye b{font-family:var(--f-b); font-size:26px; font-weight:600; color:var(--laci);
                letter-spacing:.02em}
@media (max-width:820px){ .uyelikler{grid-template-columns:repeat(2,1fr)} }

/* ------------------------------------------------- tabloda sıralama / sütunlar */
table.projeler th{cursor:pointer; user-select:none; position:relative}
table.projeler th:hover{background:var(--laci-2)}
table.projeler th span{border-bottom:1px dotted rgba(255,255,255,.45); padding-bottom:1px}
table.projeler th.artan span::after{content:" ▲"; font-size:9px; border:0}
table.projeler th.azalan span::after{content:" ▼"; font-size:9px; border:0}
table.projeler th.ort, table.projeler td.ort{text-align:center}
table.projeler td.ort .rozet{margin-left:0}
table.projeler td.kat{font-size:14.5px; letter-spacing:.01em}
.ipucu{font-family:var(--f-g); font-size:15px; color:var(--metin-3)}