/* ==========================================================================
   AKD TRANS - Kurumsal Renk Sistemi (tek kaynak)
   --------------------------------------------------------------------------
   Renkler dogrudan kurumsal materyallerden olculerek cikarilmistir:
     - akd-trans-logo.png / favicon.png  -> #1E2C33 (antrasit), #FF7020 (turuncu)
     - kurumsal kartvizit gorseli        -> #014E53 (petrol), #F1F0EC (kirik beyaz),
                                            #142228 (koyu zemin), #FE6715 (turuncu)
   Kartvizitteki turuncu (#FE6715) logo turuncusuyla (#FF7020) ayni ailededir;
   tekillestirmek icin tum sitede logo turuncusu esas alinir.

   KURAL: Sayfa/bilesen CSS'lerinde ham hex YAZILMAZ. Yalnizca asagidaki
   semantik degiskenler kullanilir. Renk degisikligi tek yerden yapilir.
   Kontrast oranlari icin: MARKA-RENKLERI.md
   ========================================================================== */

:root {
  /* ---------- 1. Ham palet (marka skalalari) ---------- */

  /* Antrasit - logo yazi rengi. Govde metni ve koyu yuzeyler. */
  --akd-ink-50:  #F6F7F7;
  --akd-ink-100: #EBECED;
  --akd-ink-200: #D6D9DA;
  --akd-ink-300: #B7BBBE;
  --akd-ink-400: #8A9195;
  --akd-ink-500: #626B70;
  --akd-ink-600: #424E54;
  --akd-ink-700: #354248;
  --akd-ink-800: #29363D;
  --akd-ink-900: #1E2C33;  /* LOGO ANA RENGI */
  --akd-ink-950: #162127;

  /* Turuncu - logo vurgu rengi. Yalnizca kontrollu vurgu olarak. */
  --akd-orange-50:  #FFF6F2;
  --akd-orange-100: #FFECE2;
  --akd-orange-200: #FFDAC5;
  --akd-orange-300: #FFBF9B;
  --akd-orange-400: #FF985E;
  --akd-orange-500: #FF7020;  /* LOGO TURUNCUSU */
  --akd-orange-600: #D8611F;
  --akd-orange-700: #C25219;  /* beyaz zeminde AA gecen link/odak tonu (4.65:1) */
  --akd-orange-750: #A34612;  /* kucuk punto etiketler; kirik beyaz zeminde de AA (5.35:1) */
  --akd-orange-800: #86421C;
  --akd-orange-900: #5A311B;

  /* Petrol - kartvizitten gelen kurumsal ikincil renk. Genis koyu yuzeyler. */
  --akd-teal-50:  #F2F6F6;
  --akd-teal-100: #E3ECEC;
  --akd-teal-200: #C7D8D9;
  --akd-teal-300: #99B8BA;
  --akd-teal-400: #578A8D;
  --akd-teal-500: #014E53;  /* KARTVIZIT PETROL RENGI */
  --akd-teal-600: #034448;
  --akd-teal-700: #05393E;
  --akd-teal-800: #072E33;
  --akd-teal-900: #092429;

  /* Notr zeminler */
  --akd-white:   #FFFFFF;
  --akd-paper:   #F1F0EC;  /* kartvizitin kirik beyaz zemini */
  --akd-night:   #142228;  /* kartvizitin koyu zemini */

  /* Koyu zeminin RGB bileseni - saydamlik gereken yerlerde (ortu/scrim) */
  --akd-night-rgb: 20, 34, 40;

  /* ---------- 2. Semantik tokenlar (kodda bunlar kullanilir) ---------- */

  /* Marka */
  --color-brand:            var(--akd-teal-500);
  --color-brand-strong:     var(--akd-teal-700);
  --color-brand-soft:       var(--akd-teal-100);
  --color-accent:           var(--akd-orange-500);
  --color-accent-strong:    var(--akd-orange-700);
  --color-accent-soft:      var(--akd-orange-100);

  /* Yuzeyler - agirlikli beyaz / cok acik gri */
  --surface:                var(--akd-white);
  --surface-muted:          var(--akd-ink-50);
  --surface-paper:          var(--akd-paper);
  --surface-brand:          var(--akd-teal-500);
  --surface-dark:           var(--akd-night);
  --surface-header:         var(--akd-white);
  --surface-topbar:         var(--akd-ink-900);
  --surface-footer:         var(--akd-ink-950);

  /* Metin */
  --text-strong:            var(--akd-ink-900);  /* 14.35:1 / beyaz    - AAA */
  --text-body:              #33434B;             /*  9.94:1 / beyaz    - AAA */
  --text-muted:             #4A5A63;             /*  7.16:1 / beyaz    - AAA */
  --text-on-dark:           var(--akd-paper);    /* 13.29:1 / #142228  - AAA */
  --text-on-dark-muted:     var(--akd-ink-300);
  --text-on-brand:          var(--akd-white);    /*  9.48:1 / petrol   - AAA */
  --text-on-accent:         var(--akd-ink-900);  /*  5.19:1 / turuncu  - AA  */

  /* Baglantilar */
  --link:                   var(--akd-teal-500);
  --link-hover:             var(--akd-orange-700);
  --link-on-dark:           var(--akd-orange-500);

  /* Kenarlik ve ayraclar
     --border / --border-soft / --border-strong yalnizca DEKORATIF ayraclardir.
     Form alani, buton cercevesi gibi islevsel kenarliklarda --border-input
     kullanilir; bu ton beyaza karsi 3.20:1 ile WCAG 1.4.11'i saglar. */
  --border:                 var(--akd-ink-200);
  --border-soft:            var(--akd-ink-100);
  --border-strong:          var(--akd-ink-300);
  --border-input:           var(--akd-ink-400);  /* 3.20:1 / beyaz - AA (UI) */
  --border-input-focus:     var(--akd-teal-500);
  --border-on-dark:         rgba(241, 240, 236, 0.18);
  --rule-accent:            var(--akd-orange-500);  /* dekoratif cizgi */

  /* Odak halkasi - WCAG 2.4.11 icin komsu renge karsi >= 3:1 */
  --focus-ring:             var(--akd-orange-700);
  --focus-ring-on-dark:     var(--akd-orange-500);

  /* Durum renkleri - marka ailesiyle uyumlu tutuldu */
  --state-success:          #17683F;
  --state-success-soft:     #E6F2EB;
  --state-error:            #B3261E;
  --state-error-soft:       #FBEAE9;

  /* Tarayici arayuzu (meta theme-color ile ayni deger) */
  --theme-color:            #1E2C33;
}

/* ==========================================================================
   Marka bilesen temelleri
   Yalnizca renk katmani; yerlesim ve tipografi site CSS'inde tanimlanir.
   ========================================================================== */

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

h1, h2, h3, h4, h5, h6 { color: var(--text-strong); }

a { color: var(--link); }
a:hover,
a:focus-visible { color: var(--link-hover); }

:focus-visible {
  outline: 3px solid var(--focus-ring);
  outline-offset: 2px;
}

/* --- Ana buton: Teklif Al ---------------------------------------------
   Logo kilidinin birebir aynisi: turuncu zemin + antrasit metin (5.19:1 AA).
   Turuncu uzerinde BEYAZ metin kullanilmaz (2.77:1, AA'yi gecmez).       */
.btn-primary {
  background-color: var(--color-accent);
  color: var(--text-on-accent);
  border: 1px solid var(--color-accent);
}
.btn-primary:hover {
  background-color: var(--akd-orange-400);
  border-color: var(--akd-orange-400);
  color: var(--text-on-accent);
}

/* Beyaz metin gereken yerler icin koyultulmus turuncu (4.65:1 AA). */
.btn-primary--solid {
  background-color: var(--color-accent-strong);
  color: var(--akd-white);
  border: 1px solid var(--color-accent-strong);
}
.btn-primary--solid:hover {
  background-color: var(--akd-orange-800);
  border-color: var(--akd-orange-800);
}

/* --- Ikincil buton: WhatsApp ile Gorus / kurumsal aksiyonlar --- */
.btn-secondary {
  background-color: var(--surface-brand);
  color: var(--text-on-brand);
  border: 1px solid var(--surface-brand);
}
.btn-secondary:hover {
  background-color: var(--akd-teal-600);
  border-color: var(--akd-teal-600);
}

/* --- Ucuncul / dis hatli buton --- */
.btn-outline {
  background-color: transparent;
  color: var(--text-strong);
  border: 1px solid var(--border-strong);
}
.btn-outline:hover {
  border-color: var(--color-brand);
  color: var(--color-brand);
}

/* --- Koyu bolumler (ust serit, footer, CTA alani) --- */
.on-dark {
  background-color: var(--surface-dark);
  color: var(--text-on-dark);
}
.on-dark h1, .on-dark h2, .on-dark h3,
.on-dark h4, .on-dark h5, .on-dark h6 { color: var(--text-on-dark); }
/* :not(.btn) zorunlu: aksi halde bu kural turuncu butonun metnini de turuncuya
   cevirir ve buton okunamaz hale gelir (1:1). */
.on-dark a:not(.btn) { color: var(--link-on-dark); }
.on-dark :focus-visible { outline-color: var(--focus-ring-on-dark); }
.on-dark .btn-primary { color: var(--text-on-accent); }
.on-dark .btn-outline {
  color: var(--text-on-dark);
  border-color: var(--border-on-dark);
}
.on-dark .btn-outline:hover {
  border-color: var(--color-accent);
  color: var(--color-accent);
}

/* --- Petrol zeminli bolum (kartvizit dilinden) --- */
.on-brand {
  background-color: var(--surface-brand);
  color: var(--text-on-brand);
}
.on-brand h1, .on-brand h2, .on-brand h3 { color: var(--text-on-brand); }
/* Petrol zemin koyu oldugu icin baglanti tonu orange-300'e acilir (5.95:1).
   orange-400 bu zeminde 4.47:1 ile AA'nin altinda kaldigi icin kullanilmaz.
   :not(.btn) zorunlu: butonlar kendi zemin/metin ciftini korur. */
.on-brand a:not(.btn) { color: var(--akd-orange-300); }
.on-brand :focus-visible { outline-color: var(--focus-ring-on-dark); }
.on-brand .btn-primary { color: var(--text-on-accent); }
.on-brand .btn-outline {
  color: var(--text-on-brand);            /* 9.48:1 / petrol */
  border-color: rgba(255, 255, 255, 0.42);
}
.on-brand .btn-outline:hover {
  color: var(--akd-orange-300);           /* 5.95:1 / petrol */
  border-color: var(--akd-orange-300);
}

/* --- Form alanlari (Teklif Al formu) --- */
.field {
  background-color: var(--surface);
  color: var(--text-strong);
  border: 1px solid var(--border-input);
}
.field::placeholder { color: var(--text-muted); }
.field:focus-visible {
  border-color: var(--border-input-focus);
  outline: 3px solid var(--focus-ring);
  outline-offset: 1px;
}
.field[aria-invalid="true"] { border-color: var(--state-error); }

.field-label { color: var(--text-strong); }
.field-hint  { color: var(--text-muted); }
.field-error { color: var(--state-error); }        /* 6.54:1 / beyaz - AAA */
.form-note--error   { background-color: var(--state-error-soft);   color: var(--text-strong); }
.form-note--success { background-color: var(--state-success-soft); color: var(--text-strong); }

/* --- Vurgu cizgisi: baslik alti kisa turuncu kural (dekoratif) --- */
.rule-accent {
  border: 0;
  border-top: 3px solid var(--rule-accent);
  width: 56px;
  margin: 0 0 1.25rem;
}

/* --- Slogan vurgusu: "Sinirlari Asan Guven." --- */
.slogan { color: var(--color-brand); }
.on-dark .slogan,
.on-brand .slogan { color: var(--color-accent); }

/* Secim rengi */
::selection {
  background-color: var(--color-accent);
  color: var(--text-on-accent);
}

/* Hareket tercihi */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
