/* ============================================================================
   corporate — Kurumsal tema
   ============================================================================

   Kime: cati marka, holding, kurumsal tanitim siteleri.
   Karakter: genis tipografi, bol dikey bosluk, sakin kontrast, tek vurgu rengi.
   Donusum cagrisi yoktur; ziyaretci ilgili markaya yonlendirilir.

   KURALLAR
   - Bu dosya cekirdek CSS'in (bootstrap + site.css + sablon) UZERINE yuklenir.
     Amac ezmek degil, tonu degistirmek: renk, tipografi, bosluk ve kenarlik.
   - Sayfa veya modul OZEL kural yazilmaz. Yalnizca modul katalogunun gercek
     sinif adlari hedeflenir (hero-module__*, content-module, cta-module,
     Bootstrap card/btn). Tek bir sayfayi duzeltmek icin buraya kural eklenmez.
   - Renk ve olcu degerleri dogrudan yazilmaz, token uzerinden kullanilir.
     Yeni tema yazan bu dosyayi kopyalayip yalnizca :root blogunu degistirebilmeli.
   ============================================================================ */

:root {
    /* Marka — degerler Kando logosundan olculdu */
    --kt-accent: #1a2fff;
    --kt-accent-strong: #0f1fd6;
    --kt-ink: #0d1a40;

    /* Metin */
    --kt-text: #1f2733;
    --kt-text-soft: #5a6473;
    --kt-heading: var(--kt-ink);

    /* Yuzey */
    --kt-surface: #ffffff;
    --kt-surface-alt: #f6f7f9;
    --kt-border: #e3e6ea;

    /* Dikey ritim — kurumsal tonun asil kaynagi bosluktur */
    --kt-section-y: 5.5rem;
    --kt-block-gap: 2.5rem;

    /* Tipografi */
    --kt-heading-weight: 600;
    --kt-heading-tracking: -0.015em;
    --kt-body-line: 1.75;
    --kt-radius: 4px;
}

/* --- Taban -------------------------------------------------------------- */

body {
    color: var(--kt-text);
    line-height: var(--kt-body-line);
    background-color: var(--kt-surface);
}

h1, h2, h3, h4, h5, h6,
.main_title {
    color: var(--kt-heading);
    font-weight: var(--kt-heading-weight);
    letter-spacing: var(--kt-heading-tracking);
    line-height: 1.25;
}

h1 { font-size: clamp(2rem, 1.4rem + 2.2vw, 3.25rem); }
h2 { font-size: clamp(1.6rem, 1.2rem + 1.4vw, 2.35rem); }
h3 { font-size: clamp(1.25rem, 1.05rem + 0.7vw, 1.6rem); }

p, .lead, .content-body {
    color: var(--kt-text);
}

.lead {
    font-size: 1.125rem;
    font-weight: 400;
    color: var(--kt-text-soft);
}

a {
    color: var(--kt-accent);
    text-decoration: none;
}

a:hover,
a:focus-visible {
    color: var(--kt-accent-strong);
    text-decoration: underline;
}

/* Erisilebilirlik: odak izi cekirdekte zayif kaliyor, kurumsal yuzeyde net olmali */
a:focus-visible,
.btn:focus-visible {
    outline: 2px solid var(--kt-accent);
    outline-offset: 2px;
}

/* --- Dikey ritim -------------------------------------------------------- */

.content-module,
.cta-module,
.hero-module__inner {
    padding-top: var(--kt-section-y);
    padding-bottom: var(--kt-section-y);
}

.content-module + .content-module {
    padding-top: 0;
}

.content-body > * + * {
    margin-top: var(--kt-block-gap);
}

/* --- Hero --------------------------------------------------------------- */

.hero-module__overlay {
    /* Kurumsal tonda karartma daha hafif; gorsel one cikar, metin yine okunur */
    background: linear-gradient(90deg, rgba(13, 26, 64, .72) 0%, rgba(13, 26, 64, .35) 100%);
}

.hero-module__content {
    max-width: 46rem;
}

.hero-module__content h1 {
    color: #fff;
}

.hero-module__content p {
    color: rgba(255, 255, 255, .88);
    font-size: 1.125rem;
}

.hero-module__cta {
    margin-top: 2rem;
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
}

/* --- Butonlar ----------------------------------------------------------- */
/* Kurumsal yuzeyde buton "satin al" degil "devam et" tonunda durur:
   dolgu yerine sinir, yuksek kontrast yerine sakin vurgu. */

.btn {
    border-radius: var(--kt-radius);
    font-weight: 500;
    letter-spacing: .01em;
    padding: .7rem 1.5rem;
}

.btn-primary {
    background-color: var(--kt-accent);
    border-color: var(--kt-accent);
}

.btn-primary:hover,
.btn-primary:focus-visible {
    background-color: var(--kt-accent-strong);
    border-color: var(--kt-accent-strong);
}

.btn-light {
    background-color: transparent;
    border-color: rgba(255, 255, 255, .7);
    color: #fff;
}

.btn-light:hover,
.btn-light:focus-visible {
    background-color: rgba(255, 255, 255, .12);
    border-color: #fff;
    color: #fff;
}

/* --- Kartlar (markalar, faaliyet alanlari) ------------------------------ */
/* Golge yok: kurumsal yuzeyde derinlik yerine hizalama ve bosluk kullanilir. */

.card {
    background-color: var(--kt-surface);
    border: 1px solid var(--kt-border);
    border-radius: var(--kt-radius);
    box-shadow: none;
    transition: border-color .18s ease;
}

.card:hover {
    border-color: var(--kt-accent);
}

.card-body {
    padding: 1.75rem;
}

.card-title {
    font-size: 1.15rem;
    margin-bottom: .6rem;
}

.card-text {
    color: var(--kt-text-soft);
    margin-bottom: 0;
}

/* --- CTA seridi --------------------------------------------------------- */
/* Satis cagrisi degil, yonlendirme bandi. */

.cta-module {
    background-color: var(--kt-surface-alt);
    border-top: 1px solid var(--kt-border);
    border-bottom: 1px solid var(--kt-border);
    text-align: center;
}

.cta-module h2 {
    margin-bottom: .75rem;
}

/* --- Dar ekran ---------------------------------------------------------- */

@media (max-width: 767.98px) {
    :root {
        --kt-section-y: 3.25rem;
        --kt-block-gap: 1.75rem;
    }

    .card-body {
        padding: 1.35rem;
    }
}

/* --- Baski -------------------------------------------------------------- */

/* ---------------------------------------------------------------------------
   Marka / urun karti
   _FeaturesModule kart yerlesimine image + badge + link eklendi. Cati marka
   sitesinde bunlar logo, statu rozeti ve markanin kendi adresi olarak
   kullaniliyor. Uc alan da opsiyonel; yoksa kart eskisi gibi ikonla cikar.
   --------------------------------------------------------------------------- */

.feature-image {
    /* Logolar farkli en-boy oranlarinda. Sabit yukseklik + contain, kartlarin
       ayni hizada durmasini saglar; logo kirpilmaz ve bozulmaz. */
    display: flex;
    align-items: center;
    justify-content: center;
    height: 64px;
}

.feature-image img {
    max-height: 100%;
    max-width: 70%;
    width: auto;
    object-fit: contain;
}

.feature-badge {
    background-color: color-mix(in srgb, var(--kt-accent) 12%, transparent);
    color: var(--kt-accent-strong);
    border: 1px solid color-mix(in srgb, var(--kt-accent) 28%, transparent);
    border-radius: 999px;
    font-weight: 600;
    font-size: .75rem;
    letter-spacing: .02em;
    padding: .3rem .75rem;
}

/* Baglantili kart tiklanabilir oldugunu belli etmeli. Kurumsal tonda buyutec
   ya da golge degil, yalnizca vurgu kenarligi ve hafif yukselme. */
.feature-card--linked {
    cursor: pointer;
}

.feature-card--linked:hover,
.feature-card--linked:focus-within {
    border-color: var(--kt-accent);
    transform: translateY(-2px);
}

.feature-card--linked {
    transition: border-color .18s ease, transform .18s ease;
}

/* stretched-link odaklandiginda kartin tamami gorunur olmali; aksi halde
   klavyeyle gezen kullanici nerede oldugunu anlayamaz. */
.feature-card--linked:focus-within {
    outline: 2px solid var(--kt-accent);
    outline-offset: 3px;
}

/* Hero ikinci butonu: birincil butonun yaninda, onunla yarismayan cerceveli
   bicim. Kurumsal tonda iki dolu buton yan yana agir duruyor. */
.hero-module__cta--secondary {
    margin-left: .75rem;
    background: transparent;
    border-color: color-mix(in srgb, #fff 70%, transparent);
    color: #fff;
}

.hero-module__cta--secondary:hover,
.hero-module__cta--secondary:focus-visible {
    background: color-mix(in srgb, #fff 14%, transparent);
    border-color: #fff;
    color: #fff;
}

@media (max-width: 575.98px) {
    /* Dar ekranda butonlar alt alta; yan yana sigmiyor. */
    .hero-module__cta--secondary {
        margin-left: 0;
        margin-top: .75rem;
    }
}

@media print {
    .hero-module__overlay,
    .cta-module {
        background: none;
    }

    a {
        color: var(--kt-ink);
        text-decoration: underline;
    }
}

/* ---- Sayfa basligi / breadcrumb ---- */
/* NEDEN VAR: _HeaderBreadcrumbModule <ol class="breadcrumb"> icine DUZ <li>
   basiyor; Bootstrap ayraci .breadcrumb-item + .breadcrumb-item::before
   seklinde tanimli oldugu icin hic uygulanmiyor ve ogeler bitisik cikiyordu
   ("Ana SayfaMarkalarimiz" - canli olcum, kandogroup.com.tr/markalar).
   Ayrac modul markup'inda degil TEMADA tanimlandi: ayni markup butun tenant
   temalarinda kullaniliyor ve bazilari duz <li> uzerine kendi stilini
   kurmus olabilir; markup degistirmek onlari kirardi. */
.page_title .breadcrumb {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin: 0;
    padding: 0;
    list-style: none;
}

.page_title .breadcrumb li + li::before {
    content: "/";
    padding: 0 .5rem;
    opacity: .55;
}

.page_title .breadcrumb li.active {
    font-weight: 600;
}