/* ============================================================
   Kılıçoğlu Hukuk – kamuya açık site temel stilleri
   Tasarım kaynağı: wwwroot/templates/kilicoglu-hukuk/*.dc.html
   Sayfa içerikleri veritabanında inline style ile saklanır;
   bu dosya yalnızca tema değişkenleri, animasyonlar, üst/alt
   menü, form ve duyarlı davranışları içerir.
   ============================================================ */

/* Tema token'lari
   --s1 / --s2 / --s1h : yuzeyler (ana / derin / alternatif-hover)
   --t1  / --t1rgb     : ana metin (rgb biçimi saydam metin ve kenarlik icin)
   --gt  / --gtrgb     : vurgu (altin)
   --gt-soft           : vurgu hover
   --on-gt             : vurgu zemini uzerindeki metin
   --s2rgb             : derin yuzeyin saydam kullanimi (sabit header, acilir menu)
   Renkler mevcut paletten alinmistir; yeni renk uretilmemistir. */
:root {
    --s1: #0B1B33;
    --s2: #07122A;
    --s2rgb: 7, 18, 42;
    --s1h: #10254A;
    --t1: #F5F1E8;
    --t1rgb: 245, 241, 232;
    --gt: #C9A24A;
    --gtrgb: 201, 162, 74;
    --gt-soft: #E0BE6A;
    --on-gt: #0B1B33;
    /* Sabit marka renkleri: tema ile degismemesi gereken yuzeylerde kullanilir
       (ornegin iletisim sayfasindaki acik form karti). */
    --gold: #C9A24A;
    --gold-soft: #E0BE6A;
    --gold-dark: #8A6D2B;
    --navy: #0B1B33;
    --navy-deep: #07122A;
    --cream: #F5F1E8;
    --serif: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
    --sans: Manrope, 'Segoe UI', system-ui, -apple-system, sans-serif;
    --header-h: 88px;
}

:root[data-theme="light"] {
    --s1: #FFFFFF;
    --s2: #EFE9DC;
    --s2rgb: 239, 233, 220;
    --s1h: #F5F1E8;
    --t1: #0B1B33;
    --t1rgb: 11, 27, 51;
    --gt: #8A6D2B;
    --gtrgb: 138, 109, 43;
    --gt-soft: #C9A24A;
    --on-gt: #FFFFFF;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

/* DIKKAT - bu iki satir bilerek tema-duyarli DEGIL.
   Ic sayfalarin govdesi (blog, iletisim, hizmetler...) veritabanindaki
   icerikten geliyor ve o icerik hala sabit renkli: kendi zemini olmayan
   metinler "color:#0B1B33" ile geliyor. Govde --s1'e cevrilirse koyu temada
   lacivert zemin uzerine lacivert yazi dusuyor (olculen kontrast orani 1.00).
   Sablon + veritabani icerigi semantik token'lara tasindiktan sonra burasi
   "background: var(--s1); color: var(--t1);" olarak degistirilmelidir. */
body {
    margin: 0;
    background: var(--cream);
    color: var(--navy);
    font-family: var(--sans);
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
}

/* Ana sayfa icerigi token'lara tasinmis durumda; bu yuzden tema ile degisir. */
body.home-page { background: var(--s1); color: var(--t1); }

a { color: var(--gt); }
a:hover { color: var(--gt-soft); }

::selection { background: var(--gt); color: var(--on-gt); }

img { max-width: 100%; }

/* Mobil tarayicilar dokunulan baglantinin uzerine varsayilan olarak acik mavi
   bir kare basiyor (rgba(51,181,229,.4)). Marka paletiyle uyusmadigi icin
   kapatiliyor; dokunma geri bildirimi asagida kendi renklerimizle veriliyor. */
a, button, [role="button"], input, select, textarea, label, summary {
    -webkit-tap-highlight-color: transparent;
}

/* Kaldirilan varsayilan vurgunun yerine kisa, marka renkli dokunma geri
   bildirimi. Yalnizca parmak/fare basili iken gorunur. */
.kh-lang a:active,
.kh-nav__link:active,
.kh-mobile-nav a:active,
.kh-footer__col a:active,
.kh-footer__legal a:active,
.kh-theme-toggle:active,
.kh-burger:active {
    background: rgba(var(--gtrgb), .16);
}

/* ---------------------------------------------------------- */
/* Animasyonlar                                                */
/* ---------------------------------------------------------- */

@keyframes rise { from { opacity: 0; transform: translateY(34px); } to { opacity: 1; transform: none; } }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes ticker { to { transform: translateX(-50%); } }
@keyframes floaty { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }
@keyframes lineGrow { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes pulse { 0%, 100% { opacity: .35; transform: scale(1); } 50% { opacity: .7; transform: scale(1.05); } }
@keyframes waPing { 0% { transform: scale(1); opacity: .7; } 100% { transform: scale(1.6); opacity: 0; } }

@media (prefers-reduced-motion: reduce) {
    * { animation-duration: .01ms !important; transition-duration: .01ms !important; }
    [data-reveal] { opacity: 1 !important; transform: none !important; }
}

/* IntersectionObserver desteklenmiyorsa içerik gizli kalmasın. */
.no-reveal [data-reveal] { opacity: 1 !important; transform: none !important; }

/* ---------------------------------------------------------- */
/* Razor görünümlerinde kullanılan anlamlı hover sınıfları     */
/* (veritabanındaki içerik, üretilen kh-s* sınıflarını kullanır) */
/* ---------------------------------------------------------- */

.kh-link-gold:hover, .kh-link-gold:focus-visible { color: var(--gold-dark) !important; }
.kh-link-arrow:hover, .kh-link-arrow:focus-visible { gap: 20px !important; color: var(--gold-dark) !important; }
.kh-card-soft:hover, .kh-card-soft:focus-visible { background: var(--s1h) !important; }
.kh-btn-cream:hover, .kh-btn-cream:focus-visible { background: var(--gold) !important; }

.kh-btn-navy:hover, .kh-btn-navy:focus-visible {
    background: var(--gold) !important;
    color: var(--navy) !important;
    transform: translateY(-2px) !important;
}

.kh-btn-gold:hover, .kh-btn-gold:focus-visible {
    background: var(--cream) !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 18px 40px rgba(201, 162, 74, .25) !important;
}

.kh-btn-ghost:hover, .kh-btn-ghost:focus-visible {
    border-color: var(--gold) !important;
    color: var(--gold) !important;
    background: rgba(201, 162, 74, .06) !important;
}

/* ---------------------------------------------------------- */
/* Üst menü                                                    */
/* ---------------------------------------------------------- */

.kh-header {
    position: fixed;
    top: 0; left: 0; right: 0;
    z-index: 100;
    background: transparent;
    box-shadow: none;
    backdrop-filter: none;
    transition: background .45s ease, box-shadow .45s ease, backdrop-filter .45s ease;
}

/* Seffaf header yalnizca ana sayfanin en ustunde olusur ve her zaman koyu hero
   gorselinin uzerinde durur. Hero, veritabanindaki icerikten sabit renkle
   geldigi icin acik temada da koyu kalir; dolayisiyla buradaki yazilar temadan
   bagimsiz acik olmalidir. Token'lar bu kapsamda koyu tema degerlerine
   sabitleniyor, boylece marka adi, menu, dil secici, tema butonu ve burger
   otomatik olarak dogru cozuluyor.
   Sayfa asagi kaydirilinca header ".is-solid" olur, zemini tema-duyarli hale
   gelir ve token'lar normal tema degerlerine geri doner.
   Hero icerigi token'lara tasindiktan sonra bu blok kaldirilabilir. */
.kh-header:not(.is-solid) {
    --s1: #0B1B33;
    --t1: #F5F1E8;
    --t1rgb: 245, 241, 232;
    --gt: #C9A24A;
    --gtrgb: 201, 162, 74;
    --on-gt: #0B1B33;
}

.kh-header.is-solid {
    background: rgba(var(--s2rgb), .92);
    box-shadow: 0 10px 40px rgba(0, 0, 0, .25);
    backdrop-filter: blur(14px);
}

.kh-header__bar {
    max-width: 1280px;
    margin: 0 auto;
    padding: 24px 28px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    transition: padding .45s ease;
}

.kh-header.is-scrolled .kh-header__bar { padding: 14px 28px; }

.kh-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
    flex-shrink: 0;
}

.kh-brand svg { flex-shrink: 0; }
.kh-brand img { width: 42px; height: 42px; object-fit: contain; display: block; }

.kh-brand__text { display: flex; flex-direction: column; gap: 3px; line-height: 1; }

.kh-brand__name {
    font-family: var(--serif);
    font-size: 21px;
    font-weight: 600;
    letter-spacing: .18em;
    color: var(--t1);
    text-transform: uppercase;
    white-space: nowrap;
}

.kh-brand__sub {
    font-family: var(--sans);
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: .34em;
    color: var(--gt);
    text-transform: uppercase;
    white-space: nowrap;
}

.kh-nav { display: flex; align-items: center; gap: 34px; }

.kh-nav__link {
    position: relative;
    font-family: var(--sans);
    font-size: 12.5px;
    font-weight: 600;
    letter-spacing: .16em;
    text-transform: uppercase;
    text-decoration: none;
    color: var(--t1);
    padding: 6px 0;
    white-space: nowrap;
    border-bottom: 1px solid transparent;
    transition: color .3s, border-color .3s;
}

.kh-nav__link:hover { color: var(--gt); }
.kh-nav__link.is-active { color: var(--gt); border-bottom-color: var(--gt); }

.kh-nav__item { position: relative; display: flex; align-items: center; }

.kh-nav__caret { font-size: 8px; margin-left: 6px; opacity: .65; }

.kh-nav__dropdown {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translate(-50%, 8px);
    min-width: 220px;
    padding: 12px 0;
    background: rgba(var(--s2rgb), .97);
    border: 1px solid rgba(var(--gtrgb), .28);
    box-shadow: 0 24px 60px rgba(0, 0, 0, .4);
    backdrop-filter: blur(14px);
    opacity: 0;
    visibility: hidden;
    transition: opacity .25s, transform .25s, visibility .25s;
}

.kh-nav__item:hover .kh-nav__dropdown,
.kh-nav__item:focus-within .kh-nav__dropdown {
    opacity: 1;
    visibility: visible;
    transform: translate(-50%, 0);
}

.kh-nav__dropdown a {
    display: block;
    padding: 10px 22px;
    font-size: 13.5px;
    font-weight: 500;
    letter-spacing: .04em;
    color: rgba(var(--t1rgb), .8);
    text-decoration: none;
    white-space: nowrap;
    transition: color .25s, background .25s;
}

.kh-nav__dropdown a:hover,
.kh-nav__dropdown a.is-active { color: var(--gt); background: rgba(var(--gtrgb), .08); }

.kh-header__tools { display: flex; align-items: center; gap: 14px; }

.kh-lang { display: inline-flex; border: 1px solid rgba(var(--gtrgb), .35); }

.kh-lang a {
    text-decoration: none;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .14em;
    padding: 9px 12px;
    color: rgba(var(--t1rgb), .5);
    transition: color .3s;
}

.kh-lang a:hover { color: var(--gt); }
.kh-lang a.is-active { color: var(--gt); }
.kh-lang__sep { width: 1px; background: rgba(var(--gtrgb), .35); }

.kh-theme-toggle {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid rgba(var(--gtrgb), .4);
    background: transparent;
    color: var(--gt);
    cursor: pointer;
    display: grid;
    place-items: center;
    padding: 0;
    transition: background .3s, color .3s;
}

.kh-theme-toggle:hover { background: var(--gt); color: var(--on-gt); }
.kh-theme-toggle .kh-icon-moon { display: none; }
:root[data-theme="light"] .kh-theme-toggle .kh-icon-sun { display: none; }
:root[data-theme="light"] .kh-theme-toggle .kh-icon-moon { display: block; }

.kh-cta {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-family: var(--sans);
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    text-decoration: none;
    color: var(--on-gt);
    background: var(--gt);
    padding: 13px 22px;
    white-space: nowrap;
    transition: background .3s, transform .3s;
}

.kh-cta:hover { background: var(--t1); color: var(--s1); transform: translateY(-2px); }

.kh-burger {
    display: none;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 6px;
    width: 44px;
    height: 44px;
    background: transparent;
    border: 1px solid rgba(var(--gtrgb), .5);
    cursor: pointer;
    padding: 0;
}

.kh-burger span { width: 22px; height: 1.5px; background: var(--t1); display: block; transition: transform .3s, opacity .3s; }
.kh-header.is-open .kh-burger span:nth-child(1) { transform: translateY(7.5px) rotate(45deg); }
.kh-header.is-open .kh-burger span:nth-child(2) { opacity: 0; }
.kh-header.is-open .kh-burger span:nth-child(3) { transform: translateY(-7.5px) rotate(-45deg); }

.kh-mobile-nav {
    display: none;
    background: var(--s1);
    border-top: 1px solid rgba(var(--gtrgb), .25);
    padding: 24px 28px 36px;
    flex-direction: column;
    gap: 6px;
    max-height: calc(100vh - var(--header-h));
    overflow-y: auto;
}

.kh-header.is-open .kh-mobile-nav { display: flex; }

.kh-mobile-nav a {
    font-family: var(--serif);
    font-size: 30px;
    font-weight: 500;
    text-decoration: none;
    color: var(--t1);
    padding: 10px 0;
    border-bottom: 1px solid rgba(var(--t1rgb), .08);
}

.kh-mobile-nav a.is-active { color: var(--gt); }
.kh-mobile-nav .kh-mobile-nav__sub { font-size: 20px; padding-left: 18px; color: rgba(var(--t1rgb), .72); }

/* ".kh-mobile-nav a" kurali tur secicisi tasidigi icin ".kh-cta"yi eziyordu;
   vurgu zemini uzerindeki yazi rengi burada geri veriliyor. */
.kh-mobile-nav .kh-cta { margin-top: 18px; justify-content: center; padding: 16px 22px; font-size: 13px; color: var(--on-gt); }

.kh-mobile-nav__lang { display: flex; align-items: center; gap: 12px; padding-top: 18px; }

/* ".kh-mobile-nav a" kurali (30px serif, yatay padding yok, alt cizgi) dil
   baglantilarini da yakaliyor ve TR/EN kutunun icine sikisiyordu. Secici
   burada daha ozel oldugu icin dil secicisi kendi tipografisine geri doner;
   dokunma hedefi de mobil icin biraz buyutuldu. */
.kh-mobile-nav__lang .kh-lang a {
    font-family: var(--sans);
    font-size: 12px;
    line-height: 1;
    padding: 14px 18px;
    border-bottom: 0;
}

@media (max-width: 1023px) {
    .kh-nav, .kh-header__tools .kh-cta { display: none; }
    .kh-burger { display: flex; }
}

/* ---------------------------------------------------------- */
/* WhatsApp yüzen düğme                                        */
/* ---------------------------------------------------------- */

.kh-wa {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 99;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 8px 22px 8px 8px;
    border-radius: 999px;
    background: var(--s1);
    border: 1px solid rgba(var(--gtrgb), .35);
    box-shadow: 0 14px 40px rgba(0, 0, 0, .35);
    text-decoration: none;
    color: var(--t1);
    font-family: var(--sans);
    transition: transform .3s, box-shadow .3s;
}

.kh-wa:hover { color: var(--t1); transform: translateY(-3px); box-shadow: 0 20px 50px rgba(0, 0, 0, .45); }

.kh-wa__avatar { position: relative; width: 52px; height: 52px; flex-shrink: 0; }
.kh-wa__avatar img { width: 52px; height: 52px; border-radius: 50%; object-fit: cover; object-position: center 30%; border: 2px solid var(--gt); display: block; }
.kh-wa__dot { position: absolute; right: 0; bottom: 1px; width: 14px; height: 14px; border-radius: 50%; background: #25D366; border: 2px solid var(--s1); }
.kh-wa__ping { position: absolute; right: -2px; bottom: -1px; width: 18px; height: 18px; border-radius: 50%; border: 2px solid #25D366; animation: waPing 2.2s ease-out infinite; }
.kh-wa__text { display: flex; flex-direction: column; gap: 3px; line-height: 1; white-space: nowrap; }
.kh-wa__text strong { font-size: 15px; font-weight: 700; }
.kh-wa__text span { font-size: 11px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--gt); }
.kh-wa__arrow { color: rgba(var(--t1rgb), .6); font-size: 16px; margin-left: 4px; }

@media (max-width: 600px) {
    .kh-wa { right: 16px; bottom: 16px; padding: 6px; }
    .kh-wa__text, .kh-wa__arrow { display: none; }
}

/* ---------------------------------------------------------- */
/* Alt menü                                                    */
/* ---------------------------------------------------------- */

.kh-footer { background: var(--s2); color: var(--t1); font-family: var(--sans); position: relative; overflow: hidden; }

.kh-footer__grid-bg {
    position: absolute;
    inset: 0;
    background-image: linear-gradient(rgba(var(--gtrgb), .06) 1px, transparent 1px), linear-gradient(90deg, rgba(var(--gtrgb), .06) 1px, transparent 1px);
    background-size: 80px 80px;
    pointer-events: none;
}

.kh-footer__inner { position: relative; max-width: 1280px; margin: 0 auto; padding: 88px 28px 40px; }

.kh-footer__top {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 48px 40px;
    padding-bottom: 56px;
    border-bottom: 1px solid rgba(var(--t1rgb), .1);
}

.kh-footer__about { display: flex; flex-direction: column; gap: 22px; max-width: 340px; }
.kh-footer__about p { margin: 0; font-size: 14.5px; line-height: 1.75; color: rgba(var(--t1rgb), .65); }

.kh-footer__social { display: flex; gap: 10px; }

.kh-footer__social a {
    width: 40px;
    height: 40px;
    border: 1px solid rgba(var(--gtrgb), .35);
    display: grid;
    place-items: center;
    color: var(--gt);
    text-decoration: none;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .05em;
    transition: background .3s, color .3s;
}

.kh-footer__social a:hover { background: var(--gt); color: var(--on-gt); }

.kh-footer__col { display: flex; flex-direction: column; gap: 14px; }

.kh-footer__col h4 {
    margin: 0 0 8px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .2em;
    text-transform: uppercase;
    color: var(--gt);
}

.kh-footer__col a { color: rgba(var(--t1rgb), .75); text-decoration: none; font-size: 15px; transition: color .3s; }
.kh-footer__col a:hover { color: var(--gt); }
.kh-footer__col p { margin: 0; font-size: 15px; line-height: 1.7; color: rgba(var(--t1rgb), .75); }
.kh-footer__col .kh-footer__hours { font-size: 14px; color: rgba(var(--t1rgb), .55); }
.kh-footer__col .kh-footer__strong { color: var(--t1); }

.kh-footer__bottom {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 18px 24px;
    padding-top: 28px;
    font-size: 13px;
    color: rgba(var(--t1rgb), .45);
}

.kh-footer__lang { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.kh-footer__lang-label { font-size: 11.5px; letter-spacing: .16em; text-transform: uppercase; color: rgba(var(--t1rgb), .45); }
.kh-footer__legal { display: flex; gap: 24px; flex-wrap: wrap; }
.kh-footer__legal a { color: rgba(var(--t1rgb), .45); text-decoration: none; transition: color .3s; }
.kh-footer__legal a:hover { color: var(--gt); }

/* ---------------------------------------------------------- */
/* Dinamik form (açık / koyu tema)                             */
/* ---------------------------------------------------------- */

.kh-form { font-family: var(--sans); position: relative; }

/* Alanlar arasi dikey ritim <form> uzerinde kurulur; sarmalayici yalnizca yuzeyi tasir. */
.kh-form form { display: flex; flex-direction: column; gap: 22px; }

.kh-form__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; flex-wrap: wrap; }
.kh-form__head-text { display: flex; flex-direction: column; gap: 6px; }
.kh-form__title { margin: 0; font-family: var(--serif); font-size: 32px; font-weight: 500; line-height: 1.15; }
.kh-form__note { margin: 0; font-size: 13.5px; }

.kh-form__badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--gt);
    border: 1px solid rgba(var(--gtrgb), .4);
    padding: 8px 12px;
    white-space: nowrap;
}

.kh-form__badge i { width: 6px; height: 6px; border-radius: 50%; background: #25D366; display: block; }

.kh-form__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; }
.kh-form__field { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.kh-form__field.is-full { grid-column: 1 / -1; }

.kh-form__label { font-size: 11.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }

.kh-form input[type="text"],
.kh-form input[type="email"],
.kh-form input[type="tel"],
.kh-form input[type="number"],
.kh-form input[type="date"],
.kh-form input[type="datetime-local"],
.kh-form input[type="file"],
.kh-form select,
.kh-form textarea {
    font-family: var(--sans);
    font-size: 15px;
    width: 100%;
    outline: none;
    transition: border-color .3s, background .3s;
}

.kh-form textarea { resize: vertical; min-height: 110px; }
.kh-form select { appearance: auto; }

.kh-form__consent { display: flex; gap: 12px; align-items: flex-start; font-size: 13px; line-height: 1.5; margin-top: 4px; }
.kh-form__consent input { margin-top: 3px; accent-color: var(--gt); width: 16px; height: 16px; flex-shrink: 0; }

.kh-form__submit {
    margin-top: 4px;
    font-family: var(--sans);
    border: 0;
    padding: 19px 30px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    cursor: pointer;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
    white-space: nowrap;
    transition: background .3s, color .3s, transform .3s, box-shadow .3s;
}

.kh-form__submit[disabled] { opacity: .6; cursor: progress; }

.kh-form__error { display: none; font-size: 13.5px; line-height: 1.5; padding: 12px 16px; border: 1px solid #C0392B; color: #E06A5B; background: rgba(192, 57, 43, .08); }
.kh-form__error.is-visible { display: block; }

.kh-form__success { display: flex; flex-direction: column; gap: 16px; padding: 40px 0; text-align: center; align-items: center; }
.kh-form__success-mark { width: 64px; height: 64px; border-radius: 50%; display: grid; place-items: center; font-size: 28px; }
.kh-form__success h3 { margin: 0; font-family: var(--serif); font-size: 34px; font-weight: 500; }
.kh-form__success p { margin: 0; line-height: 1.7; }

.kh-form .is-error { border-color: #C0392B !important; }

/* --- Koyu yüzey (ana sayfa iletişim bölümü) --- */

.kh-form--dark {
    background: rgba(var(--t1rgb), .03);
    backdrop-filter: blur(16px);
    border: 1px solid rgba(var(--gtrgb), .28);
    padding: 44px 40px;
    box-shadow: 0 40px 90px rgba(0, 0, 0, .25);
    color: var(--t1);
}

.kh-form--dark::before {
    content: "";
    position: absolute;
    top: -1px; left: 40px; right: 40px;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--gt), transparent);
}

.kh-form--dark .kh-form__note { color: rgba(var(--t1rgb), .6); }
.kh-form--dark .kh-form__label { color: rgba(var(--t1rgb), .6); }
.kh-form--dark .kh-form__consent { color: rgba(var(--t1rgb), .7); }
.kh-form--dark .kh-form__success p { color: rgba(var(--t1rgb), .7); }
.kh-form--dark .kh-form__success-mark { border: 1px solid var(--gt); color: var(--gt); }

.kh-form--dark input[type="text"],
.kh-form--dark input[type="email"],
.kh-form--dark input[type="tel"],
.kh-form--dark input[type="number"],
.kh-form--dark input[type="date"],
.kh-form--dark input[type="datetime-local"],
.kh-form--dark input[type="file"],
.kh-form--dark select,
.kh-form--dark textarea {
    padding: 15px 16px;
    border: 1px solid rgba(var(--t1rgb), .16);
    background: rgba(var(--t1rgb), .04);
    color: var(--t1);
}

.kh-form--dark input:focus,
.kh-form--dark select:focus,
.kh-form--dark textarea:focus { border-color: var(--gt); background: rgba(var(--gtrgb), .06); }

.kh-form--dark .kh-form__submit { background: var(--gt); color: var(--on-gt); }
.kh-form--dark .kh-form__submit:hover { background: var(--t1); color: var(--s1); transform: translateY(-2px); box-shadow: 0 16px 36px rgba(var(--gtrgb), .25); }

/* --- Açık yüzey (iletişim sayfası kartı) --- */

.kh-form--light {
    background: #FFFDF8;
    padding: 38px 34px;
    box-shadow: 0 40px 90px rgba(11, 27, 51, .18);
    color: var(--navy);
    animation: rise 1s .45s cubic-bezier(.2, .7, .2, 1) both;
}

.kh-form--light form { gap: 15px; }
.kh-form--light .kh-form__title { font-size: 29px; }
.kh-form--light .kh-form__note { font-size: 13.5px; color: rgba(11, 27, 51, .6); }
.kh-form--light .kh-form__label { font-size: 11px; color: rgba(11, 27, 51, .6); }
.kh-form--light .kh-form__field { gap: 4px; }
.kh-form--light .kh-form__consent { color: rgba(11, 27, 51, .7); font-size: 12.5px; }
.kh-form--light .kh-form__consent a { color: var(--gold-dark); }
.kh-form--light .kh-form__grid { gap: 16px; }
.kh-form--light .kh-form__success p { color: rgba(11, 27, 51, .7); max-width: 380px; }
.kh-form--light .kh-form__success-mark { background: var(--navy); color: var(--gold); }
.kh-form--light textarea { min-height: 84px; }
.kh-form--light .kh-form__submit { padding: 16px 28px; }

.kh-form--light input[type="text"],
.kh-form--light input[type="email"],
.kh-form--light input[type="tel"],
.kh-form--light input[type="number"],
.kh-form--light input[type="date"],
.kh-form--light input[type="datetime-local"],
.kh-form--light input[type="file"],
.kh-form--light select,
.kh-form--light textarea {
    padding: 11px 0;
    border: 0;
    border-bottom: 1px solid rgba(11, 27, 51, .3);
    background: transparent;
    color: var(--navy);
}

.kh-form--light input:focus,
.kh-form--light select:focus,
.kh-form--light textarea:focus { border-bottom-color: var(--gold); }

.kh-form--light .kh-form__submit { margin-top: 6px; background: var(--navy); color: var(--cream); }
.kh-form--light .kh-form__submit:hover { background: var(--gold); color: var(--navy); transform: translateY(-2px); }

/* ---------------------------------------------------------- */
/* Bülten formu (blog sayfası)                                 */
/* ---------------------------------------------------------- */

.kh-newsletter { display: flex; flex-wrap: wrap; gap: 12px; }

.kh-newsletter input {
    flex: 1;
    min-width: 240px;
    font-family: var(--sans);
    font-size: 15px;
    padding: 16px 18px;
    border: 1px solid rgba(var(--t1rgb), .25);
    background: transparent;
    color: var(--t1);
    outline: none;
    transition: border-color .3s;
}

.kh-newsletter input:focus { border-color: var(--gt); }

.kh-newsletter button {
    font-family: var(--sans);
    background: var(--gt);
    color: var(--on-gt);
    border: 0;
    padding: 16px 26px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background .3s;
}

.kh-newsletter button:hover { background: var(--t1); color: var(--s1); }

/* ---------------------------------------------------------- */
/* 404                                                         */
/* ---------------------------------------------------------- */

.kh-404 {
    min-height: 100vh;
    background: var(--s2);
    color: var(--t1);
    display: flex;
    align-items: center;
    padding: 180px 28px 120px;
    position: relative;
    overflow: hidden;
}

.kh-404__grid-bg {
    position: absolute;
    inset: 0;
    background-image: linear-gradient(rgba(var(--gtrgb), .07) 1px, transparent 1px), linear-gradient(90deg, rgba(var(--gtrgb), .07) 1px, transparent 1px);
    background-size: 96px 96px;
    mask-image: radial-gradient(ellipse at 70% 30%, #000 15%, transparent 70%);
    -webkit-mask-image: radial-gradient(ellipse at 70% 30%, #000 15%, transparent 70%);
    pointer-events: none;
}

.kh-404__inner {
    position: relative;
    max-width: 1280px;
    margin: 0 auto;
    width: 100%;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr));
    gap: 56px;
    align-items: center;
}

.kh-404__code {
    font-family: var(--serif);
    font-size: clamp(120px, 20vw, 260px);
    line-height: .9;
    color: rgba(var(--gtrgb), .22);
    font-weight: 600;
    text-align: center;
}

/* ---------------------------------------------------------- */
/* Mobil düzeltmeler                                           */
/* ---------------------------------------------------------- */

@media (max-width: 900px) {
    .kh-form--dark { padding: 32px 24px; }
    .kh-form--light { padding: 30px 22px; }
    .kh-form--dark::before { left: 24px; right: 24px; }
    /* Dar ekranda form ve bilgi sütunu alt alta geldiğinde üst boşluk gereksiz kalıyor. */
    .contact-page [data-kh-contact-info] { padding-top: 0 !important; }
}

@media (max-width: 480px) {
    /* Dar ekranda ust seritte yer kalmiyor; dil secici mobil menude zaten var. */
    .kh-header__tools .kh-lang { display: none; }
}

@media (max-width: 640px) {
    .kh-header__bar { padding: 16px 20px; }
    .kh-header.is-scrolled .kh-header__bar { padding: 12px 20px; }
    .kh-footer__inner { padding: 64px 20px 32px; }
    .kh-brand__name { font-size: 18px; letter-spacing: .14em; }
    .kh-mobile-nav a { font-size: 25px; }
}
