/* ==========================================================================
   KURUMSAL BOLUM (.krm)
   --------------------------------------------------------------------------
   Solda kurumsal menu, sagda icerik. Menu yapiskan: uzun metinlerde
   kullanici diger kurumsal sayfalara gecmek icin yukari donmez.

   Icerik metni (.krm__yz) tek bir tipografi olceginden beslenir; kurumsal
   sayfalarin govdesi editorden gelecegi icin baslik/paragraf/liste
   stilleri sinif adina degil ETIKETE baglanir.
   ========================================================================== */
.krm { display: grid; grid-template-columns: 248px minmax(0, 1fr);
       gap: var(--s5); align-items: start; }

.krm__yan { display: flex; flex-direction: column; gap: var(--s4);
            position: sticky; top: calc(var(--hd-h-s) + var(--s4)); }
.krm__ana { min-width: 0; display: flex; flex-direction: column; gap: var(--s5); }


/* ==========================================================================
   1. SOL MENU
   ========================================================================== */
.krm__mn { background: var(--white); border: 1px solid var(--line);
           border-radius: var(--r3); box-shadow: var(--sh1); overflow: hidden; }

.krm__mn-b { display: flex; align-items: center; gap: 7px;
             padding: var(--s3) var(--s4);
             font-size: var(--fs-3xs); font-weight: var(--fw-800);
             letter-spacing: var(--ls-cap); text-transform: uppercase;
             color: var(--white); background: var(--g-koyu); }
.krm__mn-b svg { color: var(--brand); }

.krm__mn ul { list-style: none; padding: var(--s2); }
.krm__mn a { display: flex; align-items: center; justify-content: space-between;
             gap: var(--s2); padding: 9px var(--s3);
             font-size: var(--fs-3xs); font-weight: var(--fw-600);
             line-height: 1.4; color: var(--tx-soft);
             border-radius: var(--r2); border-left: 2px solid transparent;
             transition: all var(--t1); }
.krm__mn a:hover { color: var(--brand-700); background: var(--mist); }
.krm__mn a.on { font-weight: var(--fw-800); color: var(--brand-700);
                background: var(--brand-50); border-left-color: var(--brand); }
.krm__mn a svg { color: var(--tx-faint); }

/* -- Yan destek karti -- */
.krm__dst { padding: var(--s4); background: var(--mist);
            border: 1px solid var(--line); border-radius: var(--r3); }
.krm__dst span { display: flex; align-items: center; gap: var(--s2);
                 font-size: var(--fs-3xs); font-weight: var(--fw-800); color: var(--tx); }
.krm__dst span svg { color: var(--brand); }
.krm__dst p { margin: 6px 0 var(--s3); font-size: 10px; line-height: 1.6;
              color: var(--tx-mute); }
.krm__dst .bt + .bt { margin-top: var(--s2); }


/* ==========================================================================
   2. ICERIK KUTUSU VE METIN
   ========================================================================== */
.krm__kt { padding: var(--s6); background: var(--white);
           border: 1px solid var(--line); border-radius: var(--r3); }

.krm__yz { font-size: var(--fs-2xs); line-height: 1.85; color: var(--tx-soft); }
.krm__yz > * + * { margin-top: var(--s4); }
.krm__yz h2 { font-size: var(--fs-h4); font-weight: var(--fw-800);
              letter-spacing: var(--ls-tt); color: var(--tx); margin-top: var(--s6); }
.krm__yz h3 { font-size: var(--fs-s); font-weight: var(--fw-800);
              color: var(--brand-700); margin-top: var(--s5); }
.krm__yz > h2:first-child, .krm__yz > h3:first-child { margin-top: 0; }
.krm__yz b, .krm__yz strong { font-weight: var(--fw-700); color: var(--tx); }
.krm__yz ul { list-style: none; display: flex; flex-direction: column; gap: var(--s2); }
.krm__yz ul li { position: relative; padding-left: var(--s5); }
.krm__yz ul li::before { content: ''; position: absolute; left: 4px; top: .72em;
                         width: 6px; height: 6px; border-radius: var(--rp);
                         background: var(--brand); }
.krm__yz img { border-radius: var(--r2); }
/* Metin icindeki baglantilar altı cizili; DUGMELER haric.
   ".krm__yz a" (0,1,1) ozgullugu ".bt--b" (0,1,0) kuralini yeniyordu:
   turuncu zeminli dugmenin yazisi koyu turuncuya donup altı ciziliyordu.
   :not(.bt) ile metin baglantisi ile dugme ayrilir. */
.krm__yz a:not(.bt) { color: var(--brand-700); text-decoration: underline;
                      text-underline-offset: 3px; }


/* ==========================================================================
   3. GRUP SIRKETLERI
   ========================================================================== */
.krm__grp { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(150px, 100%), 1fr));
            gap: var(--s3); margin-top: var(--s5); }
.krm__gr { display: flex; align-items: center; justify-content: center;
           min-height: 84px; padding: var(--s4);
           background: var(--white); border: 1px solid var(--line);
           border-radius: var(--r2); transition: all var(--t1); }
.krm__gr:hover { border-color: var(--brand-200); box-shadow: var(--sh1);
                 transform: translateY(-2px); }
.krm__gr img { max-width: 100%; max-height: 44px; width: auto; height: auto;
               object-fit: contain; }


/* ==========================================================================
   4. HAKKIMIZDA — ozel bolumler
   ========================================================================== */
/* -- Acilis: buyuk anlatim + rakamlar -- */
.hkk__giris { position: relative; overflow: hidden;
              padding: var(--s8) var(--s7);
              color: var(--white); background: var(--g-koyu);
              border-radius: var(--r4); }
.hkk__giris::after { content: ''; position: absolute; right: -90px; top: -90px;
                     width: 300px; height: 300px; border-radius: var(--rp);
                     background: radial-gradient(circle, rgba(244,125,24,.28), transparent 68%); }
.hkk__giris > * { position: relative; z-index: 1; }
.hkk__kicker { display: inline-flex; align-items: center; gap: 7px;
               padding: 5px var(--s3); margin-bottom: var(--s4);
               font-size: 10px; font-weight: var(--fw-800);
               letter-spacing: var(--ls-cap); text-transform: uppercase;
               color: var(--brand); background: rgba(244,125,24,.12);
               border: 1px solid rgba(244,125,24,.3); border-radius: var(--rp); }
.hkk__giris h2 { color: #fff; max-width: 20ch; font-size: var(--fs-h2); font-weight: var(--fw-800);
                 line-height: 1.16; letter-spacing: var(--ls-tt); }
.hkk__giris h2 em { font-style: normal; color: var(--brand); }
.hkk__giris p { max-width: 62ch; margin-top: var(--s4);
                font-size: var(--fs-2xs); line-height: 1.85; color: rgba(255,255,255,.76); }

/* -- Rakamlar -- */
.hkk__ryt { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(140px, 100%), 1fr));
            gap: 1px; margin-top: var(--s6); overflow: hidden;
            background: rgba(255,255,255,.12); border-radius: var(--r3); }
.hkk__ry { padding: var(--s4); background: #174A37; }
.hkk__ry b { display: block; font-size: var(--fs-h3); font-weight: var(--fw-800);
             line-height: 1; color: var(--brand); font-variant-numeric: tabular-nums; }
.hkk__ry span { display: block; margin-top: 5px; font-size: 10px; line-height: 1.45;
                color: rgba(255,255,255,.66); }

/* -- Degerler -- */
.hkk__dgr { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr));
            gap: var(--s4); }
.hkk__d { padding: var(--s5); background: var(--white);
          border: 1px solid var(--line); border-radius: var(--r3);
          transition: all var(--t1); }
.hkk__d:hover { border-color: var(--brand-200); box-shadow: var(--sh1);
                transform: translateY(-2px); }
.hkk__d-i { display: inline-flex; align-items: center; justify-content: center;
            width: 40px; height: 40px; margin-bottom: var(--s3);
            color: var(--brand); background: var(--brand-50); border-radius: var(--r2); }
.hkk__d b { display: block; font-size: var(--fs-2xs); font-weight: var(--fw-800);
            color: var(--tx); }
.hkk__d p { margin-top: 6px; font-size: var(--fs-3xs); line-height: 1.7; color: var(--tx-mute); }

/* -- Zaman cizgisi -- */
.hkk__zm { position: relative; list-style: none; padding-left: var(--s6); }
.hkk__zm::before { content: ''; position: absolute; left: 7px; top: 6px; bottom: 6px;
                   width: 2px; background: linear-gradient(var(--brand), var(--line)); }
.hkk__zm li { position: relative; padding-bottom: var(--s5); }
.hkk__zm li:last-child { padding-bottom: 0; }
.hkk__zm li::before { content: ''; position: absolute; left: calc(var(--s6) * -1 + 3px);
                      top: 5px; width: 11px; height: 11px; border-radius: var(--rp);
                      background: var(--white); border: 3px solid var(--brand); }
.hkk__zm b { font-size: var(--fs-3xs); font-weight: var(--fw-800); color: var(--brand-700);
             font-variant-numeric: tabular-nums; }
.hkk__zm span { display: block; margin-top: 3px; font-size: var(--fs-3xs);
                line-height: 1.7; color: var(--tx-soft); }

/* -- Belgeler / uyelikler -- */
.hkk__bl { display: flex; flex-wrap: wrap; gap: var(--s2); }
.hkk__bl i { display: inline-flex; align-items: center; gap: 5px;
             padding: 6px var(--s3); font-size: 10px; font-style: normal;
             font-weight: var(--fw-800); letter-spacing: .02em;
             color: var(--tx); background: var(--mist);
             border: 1px solid var(--line); border-radius: var(--rp); }
.hkk__bl i svg { color: var(--brand); }


/* ==========================================================================
   5. EKIBIMIZ
   ========================================================================== */
.ekp__b { display: flex; align-items: baseline; gap: var(--s3); flex-wrap: wrap;
          margin-bottom: var(--s4); }
.ekp__b h2 { font-size: var(--fs-h4); font-weight: var(--fw-800);
             letter-spacing: var(--ls-tt); color: var(--tx); }
.ekp__b span { font-size: var(--fs-3xs); color: var(--tx-mute); }

.ekp__iz { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(210px, 100%), 1fr));
           gap: var(--s4); }

.ekp__k { overflow: hidden; background: var(--white);
          border: 1px solid var(--line); border-radius: var(--r3);
          transition: border-color var(--t1), box-shadow var(--t1), transform var(--t1); }
.ekp__k:hover { border-color: var(--brand-200); box-shadow: var(--sh2);
                transform: translateY(-3px); }

.ekp__f { position: relative; aspect-ratio: 1 / 1; overflow: hidden;
          background: var(--mist-2); }
.ekp__f img { width: 100%; height: 100%; object-fit: cover;
              filter: saturate(.92); transition: transform var(--t3), filter var(--t2); }
.ekp__k:hover .ekp__f img { transform: scale(1.05); filter: saturate(1.05); }

/* Fotografin altina yumusak bir gecis — isim serit zemininde okunur kalsin */
.ekp__f::after { content: ''; position: absolute; inset: auto 0 0 0; height: 46%;
                 background: linear-gradient(transparent, rgba(16,30,54,.55));
                 opacity: 0; transition: opacity var(--t2); }
.ekp__k:hover .ekp__f::after { opacity: 1; }

.ekp__bg { padding: var(--s4); }
.ekp__ad { font-size: var(--fs-2xs); font-weight: var(--fw-800); line-height: 1.3;
           color: var(--tx); }
.ekp__gv { display: block; margin-top: 3px; font-size: var(--fs-3xs);
           line-height: 1.45; color: var(--brand-700); }

.ekp__ktl { margin-top: var(--s5); display: flex; align-items: center; justify-content: space-between;
            gap: var(--s5); flex-wrap: wrap;
            padding: var(--s5) var(--s6);
            background: var(--brand-50); border: 1px solid var(--brand-200);
            border-radius: var(--r3); }
.ekp__ktl b { display: block; font-size: var(--fs-2xs); font-weight: var(--fw-800);
              color: var(--tx); }
.ekp__ktl p { margin-top: 4px; font-size: var(--fs-3xs); line-height: 1.6;
              color: var(--tx-soft); }


/* ==========================================================================
   6. DAR EKRAN
   ========================================================================== */
@media (max-width: 940px) {
  .krm { grid-template-columns: minmax(0, 1fr); }
  .krm__yan { position: static; }
  .hkk__giris { padding: var(--s6) var(--s5); }
  .hkk__giris h2 { font-size: var(--fs-h3); }
}

@media (max-width: 620px) {
  .krm__kt { padding: var(--s4); }
  .ekp__iz { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s3); }
  .ekp__bg { padding: var(--s3); }
}


/* ==========================================================================
   7. ORTAK KUCUK PARCALAR
   --------------------------------------------------------------------------
   Kurumsal sayfalarin birkacinda tekrar eden yerlesim ve metin ogeleri.
   Lokasyon sayfasindan sinif odunc almak yerine burada tanimlidir:
   iki bolum birbirinin stil dosyasina bagimli olmasin.
   ========================================================================== */
.krm__iki { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
            gap: var(--s4); align-items: start; }

.krm__not { margin-top: var(--s4); font-size: var(--fs-3xs);
            line-height: 1.7; color: var(--tx-mute); }

.krm__l { display: inline-flex; align-items: center; gap: 4px; margin-top: var(--s4);
          font-size: 10px; font-weight: var(--fw-700); color: var(--brand-700);
          transition: gap var(--t1); }
.krm__l:hover { gap: 8px; color: var(--brand); }

.krm__gir { max-width: 74ch; font-size: var(--fs-2xs); line-height: 1.85;
            color: var(--tx-soft); }

.krm__ey { display: flex; gap: var(--s2); flex-wrap: wrap; }

.krm__kb { display: flex; align-items: center; gap: var(--s2); margin-bottom: var(--s3);
           font-size: 10px; font-weight: var(--fw-800); letter-spacing: var(--ls-cap);
           text-transform: uppercase; color: var(--tx-faint); }
.krm__kb svg { color: var(--brand); }


/* ==========================================================================
   KARIYER (.kry)
   --------------------------------------------------------------------------
   Uc parca: calisma kulturu kartlari, acilir ilan listesi, basvuru formu.
   Ilanlar <details> uzerine kurulu — JS calismasa da acilip kapanir.
   ========================================================================== */

/* -- 1. Calisma kulturu -- */
.kry__dgr { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(210px, 100%), 1fr));
            gap: var(--s4); margin-bottom: var(--s7); }
.kry__dgr-k { padding: var(--s5); background: var(--mist);
              border: 1px solid var(--line-soft); border-radius: var(--r3); }
.kry__dgr-i { display: inline-flex; align-items: center; justify-content: center;
              width: 40px; height: 40px; margin-bottom: var(--s3);
              color: var(--brand); background: var(--white);
              border: 1px solid var(--brand-200); border-radius: var(--r2); }
.kry__dgr-k b { display: block; margin-bottom: 4px;
                font-size: var(--fs-2xs); font-weight: var(--fw-800); color: var(--tx); }
.kry__dgr-k p { font-size: var(--fs-3xs); line-height: 1.7; color: var(--tx-mute); }

/* -- 2. Ilan listesi -- */
.kry__ls { display: flex; flex-direction: column; gap: var(--s3); margin-bottom: var(--s8); }

.kry__o { background: var(--white); border: 1px solid var(--line);
          border-radius: var(--r3);
          transition: border-color var(--t2), box-shadow var(--t2); }
.kry__o:hover { border-color: var(--brand-200); }
.kry__o[open] { border-color: var(--brand); box-shadow: var(--sh2); }

.kry__s { display: flex; align-items: center; justify-content: space-between;
          gap: var(--s4); padding: var(--s4) var(--s5);
          cursor: pointer; list-style: none; }
.kry__s::-webkit-details-marker { display: none; }
.kry__s-m { min-width: 0; }
.kry__s-m b { display: block; font-size: var(--fs-s); font-weight: var(--fw-800);
              color: var(--tx); }
.kry__s-m small { display: block; margin-top: 3px;
                  font-size: var(--fs-3xs); line-height: 1.6; color: var(--tx-mute); }
.kry__o[open] .kry__s-m b { color: var(--brand-700); }

.kry__ik { flex: none; display: inline-flex; align-items: center; justify-content: center;
           width: 30px; height: 30px; color: var(--brand);
           background: var(--mist); border: 1px solid var(--line);
           border-radius: var(--rp); transition: transform var(--t2), background var(--t2); }
.kry__o[open] .kry__ik { transform: rotate(180deg); color: var(--white);
                         background: var(--brand); border-color: var(--brand); }

.kry__c { padding: 0 var(--s5) var(--s5); }

.kry__et { display: flex; flex-wrap: wrap; gap: var(--s2);
           padding-bottom: var(--s4); margin-bottom: var(--s4);
           border-bottom: 1px solid var(--line-soft); }
.kry__et li { display: inline-flex; align-items: center; gap: 5px;
              padding: 5px var(--s3); font-size: var(--fs-3xs); font-weight: var(--fw-600);
              color: var(--tx-soft); background: var(--mist); border-radius: var(--rp); }
.kry__et svg { color: var(--brand); }

.kry__iki { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: var(--s5) var(--s7); margin-bottom: var(--s5); }
.kry__iki h3 { margin-bottom: var(--s3); font-size: var(--fs-2xs);
               font-weight: var(--fw-800); letter-spacing: var(--ls-cap);
               text-transform: uppercase; color: var(--tx-mute); }
.kry__nk { display: flex; flex-direction: column; gap: var(--s2); }
.kry__nk li { display: flex; align-items: flex-start; gap: var(--s2);
              font-size: var(--fs-2xs); line-height: 1.65; color: var(--tx-soft); }
.kry__nk svg { flex: none; margin-top: 3px; color: var(--ok); }

/* -- 3. Basvuru formu -- */
.kry__bsv { scroll-margin-top: calc(var(--hd-h-s) + var(--s6)); }
.kry__frm { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: var(--s4); padding: var(--s6);
            background: var(--mist); border: 1px solid var(--line);
            border-radius: var(--r3); }

.kry__sonuc { display: flex; align-items: flex-start; gap: var(--s3);
              padding: var(--s4) var(--s5); margin-bottom: var(--s4);
              font-size: var(--fs-2xs); line-height: 1.65; border-radius: var(--r2); }
.kry__sonuc svg { flex: none; margin-top: 1px; }
.kry__sonuc--ok   { color: var(--ok); background: #EAF7F0; border: 1px solid #C9E9D8; }
.kry__sonuc--hata { color: var(--no); background: #FDF0EF; border: 1px solid #F5D2CF; }

/* CV secici — yerlesik dosya dugmesi her tarayicida farkli gorunuyor */
.kry__cv { display: flex; align-items: center; gap: var(--s3); flex-wrap: wrap; }
.kry__cv-b { display: inline-flex; align-items: center; gap: var(--s2);
             min-height: 44px; padding: 0 var(--s5);
             font-size: var(--fs-3xs); font-weight: var(--fw-700);
             color: var(--brand-700); background: var(--white);
             border: 1.5px solid var(--brand-200); border-radius: var(--r2);
             cursor: pointer; transition: all var(--t1); }
.kry__cv-b:hover { color: var(--white); background: var(--brand); border-color: var(--brand); }
.kry__cv-b svg { transform: rotate(180deg); }
.kry__cv-a { min-width: 0; font-size: var(--fs-3xs); color: var(--tx-mute);
             overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kry__cv-a.on { font-weight: var(--fw-700); color: var(--tx); }
/* Klavye ile gezerken gizli input odaklaninca dugme belli olsun */
.kry__cv input:focus-visible + .kry__cv-b { outline: 3px solid var(--brand);
                                            outline-offset: 2px; }

/* Guvenlik kodu */
.kry__kap { display: flex; align-items: center; gap: var(--s3); flex-wrap: wrap; }
.kry__kap img { border: 1px solid var(--line); border-radius: var(--r2); }
.kry__kap-y { display: inline-flex; align-items: center; justify-content: center;
              width: 44px; height: 44px; color: var(--brand-700);
              background: var(--white); border: 1.5px solid var(--brand-200);
              border-radius: var(--r2); cursor: pointer; transition: all var(--t1); }
.kry__kap-y:hover { color: var(--white); background: var(--brand); border-color: var(--brand); }
.kry__kap-g { flex: 1; min-width: 140px; max-width: 220px;
              letter-spacing: .28em; text-transform: uppercase;
              font-weight: var(--fw-800); }

.kry__gonder { grid-column: 1 / -1; display: flex; align-items: center;
               gap: var(--s5); flex-wrap: wrap; padding-top: var(--s2); }
.kry__kvkk { flex: 1; min-width: 220px;
             font-size: var(--fs-3xs); line-height: 1.6; color: var(--tx-mute); }
.kry__kvkk a { font-weight: var(--fw-700); color: var(--brand);
               text-decoration: underline; text-underline-offset: 3px; }

@media (max-width: 720px) {
  .kry__iki { grid-template-columns: minmax(0, 1fr); }
  .kry__frm { grid-template-columns: minmax(0, 1fr); padding: var(--s5) var(--s4); }
  .kry__s { padding: var(--s4); }
  .kry__c { padding: 0 var(--s4) var(--s4); }
}

/* Grup logolari ayni tuvalde (img/grup/renkli, 480x200): hepsi ayni genislikte
   basilir, boylece gozle esit buyuklukte gorunur (eskiden max-height 44px ile
   ince/genis logolar — or. Kibris — kucuk kaliyordu). */
.krm__gr--esit { padding: var(--s2) var(--s3); }
.krm__gr--esit img { width: 100%; max-width: 230px; max-height: none; height: auto; }