/* ============================================================================
   CCG marka katmani — navy.css'ten SONRA yuklenir.
   ----------------------------------------------------------------------------
   Neden gerekli: navy.css tum "primary" bilesenlerini #343f52'ye, yani govde
   metniyle ayni renge cekiyor. Sonucta buton, etiket ve baslik ayni agirlikta
   duruyor ve hicbir sey one cikmiyor.

   Marka renkleri sitedeki logonun piksellerinden alindi (iki logo dosyasinda da
   ayni): antrasit #424A52 + turuncu #F15900.

   Kontrast (beyaz uzerinde, olculdu):
     #F15900 -> 3.40  buyuk metin / grafik / dolgu icin uygun, kucuk metin DEGIL
     #CE4C00 -> 4.51  beyaz yazi tasiyan butonlar icin AA gecer
     #424A52 -> 9.00  govde metni

   Kural: TURUNCU BOYAR, KOYU TURUNCU KONUSUR.
   Doz bilincli olarak olculu: vurgu ogeleri turuncu, zeminler ve govde metni
   antrasit kalir.
   ========================================================================== */

:root {
    --ccg-orange: #F15900;
    --ccg-orange-deep: #CE4C00;
    --ccg-orange-dark: #B84300;
    /* Koyu zeminlerde kullanilir; marka turuncusu antrasit uzerinde
       kucuk metin icin yeterli kontrast vermiyor (2.64 < 4.5). */
    --ccg-orange-light: #FFA366;
    --ccg-orange-soft: #FDEEE5;
    --ccg-charcoal: #424A52;
    --bs-primary: #F15900;
    --bs-primary-rgb: 241, 89, 0;
}

/* --- Butonlar: beyaz yazi tasidiklari icin KOYU turuncu ------------------- */
.btn-primary {
    background-color: var(--ccg-orange-deep);
    border-color: var(--ccg-orange-deep);
    color: #fff;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.show > .btn-primary.dropdown-toggle {
    background-color: var(--ccg-orange-dark);
    border-color: var(--ccg-orange-dark);
    color: #fff;
}

.btn-primary:focus-visible {
    outline: 2px solid var(--ccg-orange-deep);
    outline-offset: 2px;
    box-shadow: none;
}

.btn-outline-primary {
    color: var(--ccg-orange-deep);
    border-color: var(--ccg-orange-deep);
}

.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active {
    background-color: var(--ccg-orange-deep);
    border-color: var(--ccg-orange-deep);
    color: #fff;
}

/* --- Metin vurgusu: kucuk boyutta okunmasi gerektigi icin koyu ton -------- */
.text-primary {
    color: var(--ccg-orange-deep) !important;
}

/* --- Menu: aktif ve uzerine gelinen baglanti ------------------------------ */
.navbar-light .navbar-nav .nav-link:focus,
.navbar-light .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link.active,
.navbar-light .navbar-nav .show > .nav-link {
    color: var(--ccg-orange-deep);
}

/* Aktif sayfa ayrica ince bir turuncu cizgiyle isaretlenir; renk tek basina
   ayirt edici sinyal olarak yeterli sayilmaz. */
.navbar-light .navbar-nav .nav-link.active {
    box-shadow: inset 0 -2px 0 var(--ccg-orange);
}

/* --- Ikon listesi madde imleri (anasayfa "Wer sind wir" bloklari) --------- */
.icon-list.bullet-bg.bullet-soft-primary span:first-child {
    background-color: var(--ccg-orange-soft);
}

.icon-list.bullet-bg.bullet-soft-primary span:first-child i {
    color: var(--ccg-orange-deep);
}

/* --- Hizmet kartlari ------------------------------------------------------
   Not: Buraya once turuncu bir ust cizgi konmustu, KALDIRILDI. Kart
   gorsellerinin kendi icinde zaten turuncu bir CCG seridi var; cizgi onun
   uzerine denk gelip gorunmez oluyordu ve iki bant ust uste biniyordu.
   Turuncu sinyali kartlarda baslik baglantisinin hover'inda veriliyor. */
.card-service .post-title a:hover {
    color: var(--ccg-orange-deep);
}

/* --- Bolum etiketi (baslik DEGIL, etiket) -------------------------------- */
.ls-wide {
    letter-spacing: .12em;
}

/* --- Baglantilar govde metni icinde ayirt edilebilir olmali --------------- */
.post-content a:not(.btn),
.card-body p a:not(.btn) {
    color: var(--ccg-orange-deep);
    text-decoration: underline;
    text-underline-offset: 2px;
}

/* ==========================================================================
   Kariyer / ise alim blogu (anasayfa)
   Zemin marka antrasiti; turuncu yalnizca etiket, isaret ve butonda.
   "Olculu doz" karari boyle uygulandi: turuncu ZEMIN olarak kullanilmiyor.
   ========================================================================== */
.career-cta {
    background: var(--ccg-charcoal);
    color: #fff;
}

/* Koyu zeminde turuncunun ACIK tonu kullanilir.
   Marka turuncusu #F15900 antrasit uzerinde yalnizca 2.64 kontrast verir;
   kucuk metin icin AA esigi 4.5. #FFA366 -> 4.58 ile gecer.
   Beyaz zeminde ise bunun tersi gecerli: orada #CE4C00 kullaniliyor. */
.career-cta-eyebrow {
    color: var(--ccg-orange-light);
    font-size: .8rem;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    margin-bottom: .75rem;
}

/* Metin ayarlarda normal yazimda tutuluyor; buyuk harf yalnizca gorsel bir
   tercih, ekran okuyucu dogru telaffuz etsin diye CSS ile veriliyor. */
.career-cta-title {
    color: #fff;
    text-transform: uppercase;
    letter-spacing: -.01em;
    line-height: 1.12;
    text-wrap: balance;
}

.career-cta-sub {
    color: rgba(255, 255, 255, .8);
}

.career-cta-list ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: .85rem;
}

@media (min-width: 576px) {
    .career-cta-list ul {
        grid-template-columns: 1fr 1fr;
        column-gap: 2rem;
    }
}

.career-cta-list li {
    color: rgba(255, 255, 255, .92);
    font-size: 1.0625rem;
    line-height: 1.5;
    /* Emoji metnin ICINDE (CMS'ten oyle geliyor). Asili girinti olmadan
       satir sardiginda ikinci satir emoji'nin altina kayiyor. */
    padding-left: 2em;
    text-indent: -2em;
}

/* --- Avantaj karti --- */
.career-cta-card {
    background: #fff;
    border-radius: 1rem;
    padding: 1.75rem;
    box-shadow: 0 18px 40px rgba(0, 0, 0, .22);
}

.career-cta-card-title {
    color: var(--ccg-charcoal);
    text-transform: uppercase;
    letter-spacing: .06em;
    font-size: .95rem;
    margin-bottom: 1rem;
}

.career-cta-benefits ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: .7rem;
}

.career-cta-benefits li {
    position: relative;
    padding-left: 1.75rem;
    color: #424A52;
    line-height: 1.5;
}

/* Onay isareti CSS'ten geliyor: rengini kontrol edebiliyoruz ve metnin
   icinde karakter olarak durmadigi icin ekran okuyucu tekrar etmiyor. */
.career-cta-benefits li::before {
    content: "";
    position: absolute;
    left: 0;
    top: .45em;
    width: 1rem;
    height: .5rem;
    border-left: 2.5px solid var(--ccg-orange-deep);
    border-bottom: 2.5px solid var(--ccg-orange-deep);
    transform: rotate(-45deg);
}

.career-cta-btn {
    width: 100%;
    margin-top: 1.5rem;
    text-transform: uppercase;
    letter-spacing: .05em;
    font-weight: 700;
}

/* --- Klavye odagi her yerde gorunur -------------------------------------- */
a:focus-visible,
button:focus-visible {
    outline: 2px solid var(--ccg-orange-deep);
    outline-offset: 2px;
}