/* ============================================================
   KORUMA — Kurumsal Tasarım Sistemi
   ============================================================ */
:root {
  --navy-950:#0b2239; --navy-900:#12395c; --navy-800:#1a4a75;
  --navy-700:#2d4660; --navy-600:#40658b; --navy-500:#527ea5;
  --navy-400:#7599bd; --navy-300:#a3bdd5; --navy-200:#cad9e8;
  --navy-100:#e5ecf4; --navy-50:#f3f6fa;

  --teal-700:#00776e; --teal-600:#009588; --teal-500:#00baa7;
  --teal-400:#00d3bd; --teal-300:#46ecd5; --teal-50:#f0fdfa;

  --slate-50:#f8fafc; --slate-100:#f1f5f9; --slate-200:#e2e8f0;
  --slate-300:#cad5e2; --slate-400:#90a1b9; --slate-500:#62748e;
  --slate-600:#45556c; --slate-700:#314158; --slate-800:#1d293d;
  --slate-900:#0f172b;

  --red-50:#fef2f2; --red-200:#ffcaca; --red-600:#e40014; --red-800:#9f0712;

  --font-sans:'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-serif:'Source Serif 4', Georgia, 'Times New Roman', serif;

  --tracking-label:.14em;
  --tracking-button:.06em;

  --radius-sm:3px; --radius:4px; --radius-md:6px; --radius-lg:8px;

  --shadow-sm:0 1px 2px 0 rgb(15 23 43 / .05);
  --shadow-md:0 4px 12px -2px rgb(15 23 43 / .08), 0 2px 4px -2px rgb(15 23 43 / .06);

  --container:1100px;
}

/* ---------- Reset ---------- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  font-family:var(--font-sans);
  font-size:15px;
  line-height:1.65;
  color:var(--slate-700);
  background:#fff;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  display:flex;flex-direction:column;min-height:100vh;
}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;background:none;border:0;color:inherit}
input,textarea,select{font:inherit;color:inherit}
ul{list-style:none}
::selection{background:var(--navy-900);color:#fff}
:focus-visible{outline:2px solid var(--navy-700);outline-offset:2px;border-radius:2px}

/* ---------- Tipografi ---------- */
h1,h2,h3,h4{font-family:var(--font-serif);font-weight:500;color:var(--navy-950);letter-spacing:-.01em;line-height:1.2}
h1{font-size:clamp(2rem, 1.4rem + 2.4vw, 3.25rem);line-height:1.1}
h2{font-size:clamp(1.5rem, 1.15rem + 1.4vw, 2rem)}
h3{font-size:1.05rem;font-weight:600}
h4{font-size:.95rem;font-weight:600}
p{color:var(--slate-600)}

.eyebrow{
  font-family:var(--font-sans);
  font-size:11px;font-weight:600;
  text-transform:uppercase;letter-spacing:var(--tracking-label);
  color:var(--teal-700);
}
.eyebrow--onDark{color:var(--teal-400)}
.eyebrow--muted{color:var(--slate-500)}

.lead{font-size:1.0625rem;line-height:1.7;color:var(--slate-600)}

/* ---------- Yerleşim ---------- */
.container{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:24px}
.section{padding-block:72px}
.section--tight{padding-block:48px}
.section--alt{background:var(--slate-50);border-block:1px solid var(--slate-200)}
.section__head{max-width:720px;margin-bottom:40px}
.section__head h2{margin-top:12px}
.section__head p{margin-top:12px}

/* ---------- Top bar (acil) ---------- */
.topbar{background:var(--navy-950);border-bottom:1px solid var(--navy-800)}
.topbar__inner{
  display:flex;flex-wrap:wrap;justify-content:center;gap:8px 24px;
  padding:9px 0;font-size:12px;
}
.topbar__label{font-weight:600;color:#fff;letter-spacing:.02em}
.topbar__item{color:var(--slate-400)}
.topbar__item strong{color:var(--teal-400);font-weight:600}

/* ---------- Header ---------- */
.header{
  position:sticky;top:0;z-index:40;
  background:rgba(255,255,255,.94);
  backdrop-filter:saturate(180%) blur(12px);
  border-bottom:1px solid var(--slate-200);
}
.header__inner{display:flex;align-items:center;justify-content:space-between;height:70px}
.brand{display:flex;align-items:center;gap:12px}
.brand__mark{
  width:38px;height:38px;border-radius:var(--radius);
  background:var(--navy-900);color:#fff;
  display:grid;place-items:center;flex-shrink:0;
}
.brand__mark svg{width:21px;height:21px}
.brand__text{display:flex;flex-direction:column;line-height:1}
.brand__name{
  font-family:var(--font-serif);
  font-size:20px;
  font-weight:600;
  color:var(--navy-950);
  letter-spacing:-.02em;
  display:inline-flex;
  align-items:baseline;
}
/* İlk harf — belirgin drop-cap */
.brand__initial{
  font-family:var(--font-serif);
  font-size:1.55em;          /* kelimenin geri kalanından belirgin biçimde büyük */
  font-weight:700;
  line-height:.85;
  color:var(--navy-950);
  display:inline-block;
  transform:translateY(.06em);
  margin-right:.01em;
}
.brand__tag{
  font-size:10px;font-weight:500;
  text-transform:uppercase;letter-spacing:var(--tracking-label);
  color:var(--slate-500);
  margin-top:4px;
}
.nav{display:flex;align-items:center;gap:28px}
.nav__link{font-size:14px;font-weight:500;color:var(--slate-600);transition:color .15s}
.nav__link:hover{color:var(--navy-900)}

/* ---------- Butonlar ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-family:var(--font-sans);
  font-size:13px;font-weight:600;
  text-transform:uppercase;letter-spacing:var(--tracking-button);
  padding:11px 22px;border-radius:var(--radius);
  border:1px solid transparent;
  transition:background-color .15s, border-color .15s, color .15s;
  white-space:nowrap;
}
.btn--primary{background:var(--navy-900);color:#fff}
.btn--primary:hover{background:var(--navy-800)}
.btn--accent{background:var(--teal-600);color:#fff}
.btn--accent:hover{background:var(--teal-500)}
.btn--ghost{border-color:var(--navy-700);color:#fff}
.btn--ghost:hover{border-color:var(--teal-400);color:var(--teal-300)}
.btn--outline{border-color:var(--slate-300);color:var(--slate-700);text-transform:none;letter-spacing:0;font-weight:500;font-size:14px}
.btn--outline:hover{background:var(--slate-50);border-color:var(--slate-400)}
.btn--sm{padding:9px 16px;font-size:12px}
.btn--block{width:100%}
.btn:disabled{opacity:.4;cursor:not-allowed}

/* ---------- Hero ---------- */
.hero{
  position:relative;overflow:hidden;
  background:var(--navy-950);color:#fff;
  padding-block:88px 96px;
}
.hero::before{
  content:"";position:absolute;inset:0;opacity:.05;pointer-events:none;
  background-image:linear-gradient(#fff 1px,transparent 1px),
                   linear-gradient(90deg,#fff 1px,transparent 1px);
  background-size:52px 52px;
}
.hero__grid{
  position:relative;
  display:grid;gap:56px;align-items:center;
  grid-template-columns:1fr;
}
@media (min-width:900px){ .hero__grid{grid-template-columns:1.55fr 1fr} }
.hero h1{color:#fff;margin-top:20px}
.hero h1 .accent{color:var(--teal-300);display:block}
.hero__lead{margin-top:22px;font-size:16px;line-height:1.7;color:var(--slate-300);max-width:560px}
.hero__lead strong{color:#fff;font-weight:600}
.hero__cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.hero__foot{
  display:flex;align-items:center;gap:10px;
  margin-top:28px;font-size:12px;color:var(--slate-400);
}
.hero__foot::before{
  content:"";width:6px;height:6px;border-radius:50%;
  background:var(--teal-400);flex-shrink:0;
}

/* İstatistik kartı */
.stats{
  border:1px solid var(--navy-700);border-radius:var(--radius-md);
  background:rgba(18,57,92,.55);
  overflow:hidden;
}
.stats__row{
  display:flex;align-items:baseline;justify-content:space-between;
  padding:20px 26px;border-bottom:1px solid var(--navy-800);
}
.stats__row:last-of-type{border-bottom:0}
.stats__label{font-size:13px;color:var(--slate-400)}
.stats__value{font-family:var(--font-serif);font-size:28px;font-weight:500;color:#fff;line-height:1}
.stats__foot{padding:14px 26px;border-top:1px solid var(--navy-800);background:rgba(11,34,57,.4)}
.stats__foot a{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:var(--tracking-label);color:var(--teal-400)}
.stats__foot a:hover{color:var(--teal-300)}

/* ---------- İlkeler / Feature kartları ---------- */
.cards{display:grid;gap:20px;grid-template-columns:1fr}
@media (min-width:640px){ .cards{grid-template-columns:repeat(2,1fr)} }
@media (min-width:960px){ .cards--3{grid-template-columns:repeat(3,1fr)} }

.card{
  background:#fff;border:1px solid var(--slate-200);
  border-top:3px solid var(--navy-900);
  border-radius:var(--radius-md);padding:28px;
}
.card__num{font-family:var(--font-serif);font-size:13px;font-weight:600;color:var(--teal-700)}
.card h3{margin-top:10px;color:var(--navy-950)}
.card p{margin-top:10px;font-size:14px;line-height:1.65}

/* ---------- CTA bandı ---------- */
.cta-band{background:var(--navy-900);color:#fff}
.cta-band__inner{
  display:flex;flex-wrap:wrap;gap:24px;
  align-items:center;justify-content:space-between;padding-block:48px;
}
.cta-band h3{color:#fff;font-family:var(--font-serif);font-size:20px;font-weight:500}
.cta-band p{color:var(--slate-300);font-size:14px;margin-top:6px;max-width:560px}
.cta-band__actions{display:flex;flex-wrap:wrap;gap:12px}

/* ---------- Footer ---------- */
.footer{border-top:4px solid var(--teal-600);background:var(--navy-950);color:var(--slate-400);margin-top:auto}
.footer__grid{
  display:grid;gap:36px;padding-block:56px;
  grid-template-columns:1fr;
}
@media (min-width:720px){ .footer__grid{grid-template-columns:repeat(3,1fr)} }
.footer h4{
  font-family:var(--font-sans);font-size:11px;font-weight:600;
  text-transform:uppercase;letter-spacing:var(--tracking-label);
  color:#fff;margin-bottom:14px;
}
.footer p{font-size:13.5px;line-height:1.7;color:var(--slate-400)}
.footer ul{display:flex;flex-direction:column;gap:9px}
.footer a{font-size:13.5px;color:var(--slate-400);transition:color .15s}
.footer a:hover{color:var(--teal-300)}
.footer__bottom{
  border-top:1px solid var(--navy-800);padding-block:18px;
  text-align:center;font-size:12px;color:var(--slate-500);
}

/* ---------- Form / Auth sayfaları ---------- */
.auth{
  flex:1;display:grid;place-items:center;
  background:var(--slate-50);padding:64px 24px;
}
.auth__card{
  width:100%;max-width:440px;background:#fff;
  border:1px solid var(--slate-200);border-top:3px solid var(--navy-900);
  border-radius:var(--radius-md);padding:36px;
  box-shadow:var(--shadow-sm);
}
.auth__card h1{font-size:24px;color:var(--navy-950)}
.auth__card > p{margin-top:6px;font-size:14px;color:var(--slate-500);line-height:1.6}
.form{margin-top:26px;display:flex;flex-direction:column;gap:16px}
.field label{
  display:block;font-size:13px;font-weight:500;color:var(--slate-700);
  margin-bottom:6px;
}
.field label span{color:var(--slate-400);font-weight:400}
.field input{
  width:100%;padding:10px 12px;
  border:1px solid var(--slate-300);border-radius:var(--radius);
  background:#fff;outline:none;
  transition:border-color .15s, box-shadow .15s;
  font-size:14px;
}
.field input:focus{
  border-color:var(--navy-600);
  box-shadow:0 0 0 3px rgba(18,57,92,.08);
}
.auth__foot{margin-top:20px;text-align:center;font-size:13.5px;color:var(--slate-500)}
.auth__foot a{font-weight:500;color:var(--navy-900)}
.auth__foot a:hover{text-decoration:underline}

/* ---------- Nasıl Çalışır ---------- */
.steps{display:flex;flex-direction:column;gap:16px;margin-top:36px}
.step{
  display:flex;gap:20px;padding:26px;
  background:#fff;border:1px solid var(--slate-200);border-radius:var(--radius-md);
}
.step__num{
  flex-shrink:0;width:34px;height:34px;border-radius:50%;
  background:var(--navy-900);color:#fff;
  display:grid;place-items:center;font-weight:600;font-size:14px;
}
.step h3{color:var(--navy-950);margin-bottom:6px}
.step p{font-size:14px;line-height:1.65}

/* ---------- Uyarı kutusu ---------- */
.alert{
  border:1px solid var(--red-200);background:var(--red-50);
  border-radius:var(--radius-md);padding:22px 26px;
  font-size:14px;line-height:1.65;color:var(--red-800);
}
.alert strong{color:var(--red-800);font-weight:600}

/* ---------- Yeni vaka sihirbazı ---------- */
.wizard{margin-top:24px}
.wizard__steps{display:flex;gap:8px}
.wizard__step{
  flex:1;padding:9px 12px;text-align:center;
  font-size:11px;font-weight:600;letter-spacing:.02em;
  border-radius:var(--radius);
  background:var(--slate-100);color:var(--slate-500);
}
.wizard__step--active{background:var(--navy-900);color:#fff}
.wizard__panel{
  margin-top:24px;padding:28px;
  background:#fff;border:1px solid var(--slate-200);border-radius:var(--radius-md);
}
.choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}
.choice{
  padding:11px 14px;border:1px solid var(--slate-300);border-radius:var(--radius);
  font-size:13.5px;color:var(--slate-700);text-align:left;
  transition:border-color .15s, background .15s;
}
.choice:hover{border-color:var(--navy-500);background:var(--slate-50)}
.choice--active{border-color:var(--navy-900);background:var(--navy-50);color:var(--navy-900);font-weight:500}
.wizard__actions{display:flex;justify-content:space-between;margin-top:28px}

/* ---------- Yardımcı ---------- */
.mt-24{margin-top:24px}
.mt-32{margin-top:32px}
.text-center{text-align:center}

/* ---------- Statik görünüm ---------- */
.k-page{display:none}
.k-page.k-active{display:block}
#k-notice{display:none}
#k-notice.k-show{display:block}

/* ---------- Duyarlı ---------- */
@media (max-width:640px){
  .section{padding-block:56px}
  .hero{padding-block:64px 72px}
  .nav{gap:16px}
  .nav__link{font-size:13px}
  .brand__tag{display:none}
  .header__inner{height:62px}
  .brand__name{font-size:18px}
  .cta-band__inner{padding-block:40px}
}
@media (max-width:480px){
  .nav__link:not(.btn){display:none}
  .topbar__inner{gap:6px 16px;font-size:11px}
}