/* ==================================================================
   AKILLI KARŞILAMA · A · "Gece" — kurumsal sayfalar, bölüm B (Faz 2 · 02)
   Hakkımızda (/hakkimizda), Demo Talep Et (/demo) ve İletişim (/contact,
   06.16: demo formunun bileşenleriyle).

   Yeni görsel dil DEĞİL: stil.css'in değişkenleri ve bileşenleri
   (.section, .sec-head, .card, .steps, .closing-card, .btn …) kullanılır.
   Burada yalnızca bu iki sayfaya özgü parçalar var: sayfa başı, iletişim
   kartları, bekleyen bilgi işareti ve demo formu. Sınıflar "kb-" önekli.
   Derlenmez, doğrudan sunulur; değişince görünümdeki ?v= artırılır.
================================================================== */
:root{
  /* Hata rengi: KVKK kutusuyla aynı (theme/css/kvkk.css, --kvkk-hata). */
  --kb-hata:#b42318;
  --kb-hata-zemin:#fdf3f2;
  /* Müşteriden bekleyen bilgi işareti (hukuki.css'teki işaretin Gece karşılığı). */
  --kb-bekle-zemin:#fff6d6;
  --kb-bekle-cizgi:#b7791f;
  --kb-bekle-yazi:#6b4a0e;
}

/* ---------------- Sayfa başı (kahramanın sakin hâli) ---------------- */
.kb-bas{position:relative;overflow:hidden;padding:calc(var(--header-h) + var(--space-8)) 0 var(--space-8);background:radial-gradient(55% 70% at 88% 100%,var(--c-dusk-a55),transparent 70%),linear-gradient(180deg,var(--c-surface) 0%,var(--sky-top) 55%,var(--c-dawn-bot) 100%)}
.kb-bas-grid{display:grid;gap:var(--space-7);align-items:end}
@media (min-width:61.25em){.kb-bas-grid{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}}
.kb-bas h1{font-size:clamp(2.3rem,1.3rem + 3.8vw,4.6rem);letter-spacing:var(--tracking-display);line-height:1;margin:var(--space-4) 0 var(--space-5)}
.kb-bas h1 em{color:var(--c-accent-ink)}
.kb-bas .lead{color:var(--c-ink-3)}
.kb-bas .hero-notes{margin-top:var(--space-5)}
html:not(.js) .mobile-menu + main .kb-bas{padding-top:var(--space-7)}

/* "Kısaca" kartı: tanım listesi */
.kb-kisaca{display:grid;gap:var(--space-4)}
.kb-kisaca h2{font-size:var(--fs-l);letter-spacing:-.02em}
.kb-kisaca dl{display:grid;gap:var(--space-3);margin:0}
.kb-kisaca dl > div{display:grid;gap:var(--space-1);padding-top:var(--space-3);border-top:var(--border)}
.kb-kisaca dt{font-family:var(--font-display);font-weight:var(--fw-bold);font-size:var(--fs-xs);letter-spacing:.1em;text-transform:uppercase;color:var(--c-accent-ink-2)}
.kb-kisaca dd{margin:0;font-size:var(--fs-s);color:var(--c-ink)}

/* ---------------- Üçlü kart ızgarası ---------------- */
.kb-uclu{display:grid;gap:var(--space-4)}
@media (min-width:47.5em){.kb-uclu{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* ---------------- Yaklaşım (koyu bölüm) ---------------- */
.kb-yaklasim{background:linear-gradient(180deg,var(--c-ink-3),var(--c-ink-2) 55%,var(--c-ink));color:var(--c-on-dark);--c-focus:var(--c-accent)}
.kb-ilkeler{display:grid;gap:var(--space-4)}
@media (min-width:47.5em){.kb-ilkeler{grid-template-columns:repeat(2,minmax(0,1fr))}}
.kb-ilke{display:grid;gap:var(--space-3);align-content:start}
.kb-ilke .step-num{color:var(--c-accent)}
.kb-ilke h3{font-size:var(--fs-xl);letter-spacing:-.025em}
.kb-ilke .link{display:inline;min-height:0}

/* ---------------- Ekip: müşteriden bekleyen bölüm ---------------- */
.kb-bekleyen{display:grid;gap:var(--space-4);justify-items:start;border-style:dashed;border-color:var(--kb-bekle-cizgi);background:var(--c-bg);box-shadow:none}
.kb-bekleyen .brand-mark{width:3rem;height:3rem}
.kb-bekleyen p{max-width:60ch}

/* Müşteri yanıtı bekleyen bilgi (<x-hukuki.bekleniyor>): görünür, sarı ve kesik çizgili. */
.hukuki-bekleniyor{background:var(--kb-bekle-zemin);color:var(--kb-bekle-yazi);border:.09375rem dashed var(--kb-bekle-cizgi);border-radius:.375rem;padding:.05em .4em;font-weight:var(--fw-semibold);font-size:.94em;overflow-wrap:anywhere;-webkit-box-decoration-break:clone;box-decoration-break:clone}

/* ---------------- İletişim kartları ---------------- */
.kb-kanallar{display:grid;gap:var(--space-4)}
@media (min-width:40em){.kb-kanallar{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:72.5em){.kb-kanallar{grid-template-columns:repeat(4,minmax(0,1fr))}}
.kb-kanal{display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-5)}
.kb-kanal .ic{width:3rem;height:3rem;border-radius:var(--radius-s);background:var(--c-surface);display:grid;place-items:center;color:var(--c-accent-ink)}
.kb-kanal .ic svg{width:1.5rem;height:1.5rem}
.kb-kanal small{font-family:var(--font-display);font-weight:var(--fw-bold);font-size:var(--fs-xs);letter-spacing:.1em;text-transform:uppercase;color:var(--c-accent-ink-2)}
.kb-kanal a,.kb-kanal address{font-style:normal;font-family:var(--font-display);font-weight:var(--fw-bold);font-size:var(--fs-body);line-height:1.35;overflow-wrap:anywhere}
.kb-kanal a{display:inline-flex;align-items:center;min-height:var(--tap);text-decoration:underline;text-decoration-color:var(--c-accent-ink);text-underline-offset:.3em;text-decoration-thickness:var(--bw-2)}
.kb-kanal a:hover{text-decoration-color:var(--c-ink)}
.kb-kanal address{white-space:pre-line}
.kb-kanal .kb-saat{margin:0;font-size:var(--fs-s);line-height:1.5;color:var(--c-muted)}
.kb-eylemler{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3);margin-top:var(--space-6)}

/* ---------------- Demo: form ve yan sütun ---------------- */
.kb-demo{padding-top:var(--space-7)}
.kb-demo-grid{display:grid;gap:var(--space-7);align-items:start}
@media (min-width:61.25em){.kb-demo-grid{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:var(--space-8)}}
.kb-form-kart{padding:clamp(1.25rem,.8rem + 2vw,2.5rem);box-shadow:var(--shadow-2);overflow:visible}
.kb-form-kart > h2{font-size:var(--fs-2xl);letter-spacing:-.035em}
.kb-form-kart > p{margin-top:var(--space-2)}
.kb-form{display:grid;gap:var(--space-5);margin-top:var(--space-6)}
.kb-alanlar{display:grid;gap:var(--space-5)}
@media (min-width:40em){.kb-alanlar{grid-template-columns:repeat(2,minmax(0,1fr))}.kb-alanlar .kb-alan--genis{grid-column:1 / -1}}
.kb-alan{display:grid;gap:var(--space-2);align-content:start;min-width:0}
.kb-alan label{font-family:var(--font-display);font-weight:var(--fw-bold);font-size:var(--fs-s);line-height:1.3}
.kb-alan label span{font-family:var(--font-body);font-weight:var(--fw-medium);color:var(--c-muted)}
.kb-alan input,.kb-alan select,.kb-alan textarea{width:100%;min-height:3.25rem;margin:0;padding:var(--space-3) var(--space-4);border:var(--bw) solid var(--c-line);border-radius:var(--radius-s);background:var(--c-bg);color:var(--c-ink);font-family:var(--font-body);font-size:var(--fs-body);line-height:1.4;transition:border-color var(--dur-1),box-shadow var(--dur-1),background-color var(--dur-1)}
.kb-alan textarea{min-height:8.5rem;resize:vertical}
.kb-alan select{-webkit-appearance:none;appearance:none;padding-right:var(--space-7);cursor:pointer;background:var(--c-bg) no-repeat right var(--space-4) center/.85rem url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 4.5 6 8.5l4-4' fill='none' stroke='%23172a24' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.kb-alan input:hover,.kb-alan select:hover,.kb-alan textarea:hover{border-color:var(--c-ink-a40)}
.kb-alan input:focus,.kb-alan select:focus,.kb-alan textarea:focus{outline:0;border-color:var(--c-accent-ink);background-color:var(--c-card);box-shadow:0 0 0 var(--ring) var(--c-accent-a30)}
.kb-alan [aria-invalid="true"]{border-color:var(--kb-hata);background-color:var(--kb-hata-zemin)}
.kb-hata{display:flex;gap:var(--space-2);align-items:flex-start;font-size:var(--fs-s);font-weight:var(--fw-semibold);line-height:1.4;color:var(--kb-hata)}
.kb-durum{padding:var(--space-4) var(--space-5);border-radius:var(--radius-m);font-weight:var(--fw-semibold);font-size:var(--fs-s);line-height:1.5}
.kb-durum.basarili{background:var(--c-accent-soft);color:var(--c-ink);border:var(--bw) solid var(--c-accent-ink)}
.kb-durum.uyari{background:var(--kb-hata-zemin);color:var(--kb-hata);border:var(--bw) solid var(--kb-hata)}
.kb-form .kvkk-onay{margin-top:0}
.kb-gonder{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3) var(--space-5)}
.kb-gonder .btn{min-width:min(100%,16rem)}
.kb-gonder .btn[disabled]{opacity:.6;cursor:progress;transform:none}
.kb-gonder small{color:var(--c-muted);font-size:var(--fs-xs)}
@media (max-width:39.9375em){.kb-gonder .btn{width:100%}}
/* Tuzak alanı (06.10): ekranda ve ekran okuyucuda görünmez, sekmeyle odaklanmaz. */
.kb-tuzak{position:absolute!important;left:-100vw;width:var(--bw);height:var(--bw);overflow:hidden}

.kb-yan{display:grid;gap:var(--space-6)}
@media (min-width:61.25em){.kb-yan{position:sticky;top:calc(var(--header-h) + var(--space-5))}}
.kb-yan h2{font-size:var(--fs-xl);letter-spacing:-.025em;margin-bottom:var(--space-4)}
.kb-liste{display:grid;gap:var(--space-3);font-size:var(--fs-s)}
.kb-liste li{display:flex;gap:var(--space-3);align-items:flex-start}
.kb-liste li::before{content:'';flex:none;width:1.25rem;height:1.25rem;margin-top:.1rem;border-radius:50%;background:var(--c-surface) no-repeat center/60% url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 6.5 5 9l5-6' fill='none' stroke='%23438253' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.kb-liste b{font-family:var(--font-display)}
.kb-adimlar{display:grid;gap:var(--space-4)}
.kb-adimlar li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--space-1) var(--space-4);align-items:baseline}
.kb-adimlar .step-num{grid-row:span 2;font-size:var(--fs-2xl)}
.kb-adimlar h3{font-size:var(--fs-l);letter-spacing:-.02em}
.kb-adimlar p{color:var(--c-muted);font-size:var(--fs-s)}
.kb-hemen{display:grid;gap:var(--space-2);padding:var(--space-5);border-radius:var(--radius-l);background:var(--c-ink);color:var(--c-on-dark);--c-focus:var(--c-accent)}
.kb-hemen h2{margin-bottom:0;font-size:var(--fs-l)}
.kb-hemen p{color:var(--c-on-dark-muted);font-size:var(--fs-s)}
.kb-hemen .kb-hemen-baglantilar{display:flex;flex-wrap:wrap;gap:0 var(--space-5)}
.kb-hemen a{display:inline-flex;align-items:center;min-height:var(--tap);font-weight:var(--fw-semibold);color:var(--c-on-dark);text-decoration:underline;text-decoration-color:var(--c-accent);text-underline-offset:.3em;text-decoration-thickness:var(--bw-2)}
.kb-hemen a:hover{color:var(--c-accent)}

/* ---------------- İletişim: yan sütundaki kanal listesi (/contact) ---------------- */
.kb-rehber{display:grid;gap:var(--space-3)}
.kb-rehber li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--space-4);align-items:center;padding:var(--space-4);border:var(--border);border-radius:var(--radius-m);background:var(--c-card)}
.kb-rehber .ic{width:2.75rem;height:2.75rem;border-radius:var(--radius-s);background:var(--c-surface);display:grid;place-items:center;color:var(--c-accent-ink)}
.kb-rehber .ic svg{width:1.375rem;height:1.375rem}
.kb-rehber small{display:block;font-family:var(--font-display);font-weight:var(--fw-bold);font-size:var(--fs-xs);letter-spacing:.1em;text-transform:uppercase;color:var(--c-accent-ink-2)}
.kb-rehber a,.kb-rehber address{font-style:normal;font-family:var(--font-display);font-weight:var(--fw-bold);font-size:var(--fs-body);line-height:1.35;overflow-wrap:anywhere}
.kb-rehber a{display:inline-flex;align-items:center;min-height:var(--tap);text-decoration:underline;text-decoration-color:var(--c-accent-ink);text-underline-offset:.3em;text-decoration-thickness:var(--bw-2)}
.kb-rehber a:hover{text-decoration-color:var(--c-ink)}
.kb-rehber address{white-space:pre-line;padding-top:var(--space-1)}
.kb-rehber .kb-saat{margin:0;padding-top:var(--space-1);font-family:var(--font-display);font-weight:var(--fw-bold);font-size:var(--fs-body);line-height:1.35}
.kb-rehber p{font-size:var(--fs-s);padding-top:var(--space-1)}