/* ───────────────────────── KursAsistanı — Web Sitesi ───────────────────────── */
:root{
  --ink:#16263F; --ink-700:#243a59; --ink-500:#3a5074;
  --blue:#2BA9E1; --blue-600:#1E8FCC; --blue-050:#E8F5FC;
  --bg:#FFFFFF; --bg-2:#F6F8FB; --showcase:#EDF1F6;
  --line:#E7ECF1; --line-soft:#EFF2F6;
  --muted:#5C6E84; --muted-2:#909EB0;
  --ok:oklch(0.70 0.11 158); --ok-bg:oklch(0.95 0.045 158);
  --font:"Plus Jakarta Sans",-apple-system,system-ui,sans-serif;
  --mono:"DM Mono",ui-monospace,monospace;
  --r:18px;
  --sh:0 1px 2px rgba(16,38,63,.04), 0 20px 40px -28px rgba(16,38,63,.30);
  --sh-lg:0 30px 70px -34px rgba(16,38,63,.40);
}
*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; scroll-padding-top:84px; }
body{ margin:0; font-family:var(--font); color:var(--ink); background:var(--bg);
  -webkit-font-smoothing:antialiased; line-height:1.5; }
a{ color:inherit; text-decoration:none; }
img{ display:block; max-width:100%; }
.wrap{ max-width:1180px; margin:0 auto; padding:0 24px; }

/* eyebrow / headings */
.eyebrow{ font:600 11px/1 var(--mono); letter-spacing:.18em; text-transform:uppercase; color:var(--blue-600); }
h1,h2,h3{ letter-spacing:-.03em; margin:0; text-wrap:balance; }
.sec-head{ text-align:center; max-width:640px; margin:0 auto 56px; }
.sec-head h2{ font-size:clamp(28px,4vw,42px); font-weight:800; margin:14px 0 14px; }
.sec-head p{ color:var(--muted); font-size:17px; margin:0; text-wrap:pretty; }
.muted{ color:var(--muted); }
.mono{ font-family:var(--mono); }

/* buttons */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:9px; height:52px; padding:0 26px;
  border-radius:14px; font:700 15.5px var(--font); cursor:pointer; border:none; transition:.16s; white-space:nowrap; }
.btn svg{ width:19px; height:19px; }
.btn-pri{ background:var(--blue); color:#fff; box-shadow:0 14px 30px -10px rgba(43,169,225,.6); }
.btn-pri:hover{ background:var(--blue-600); transform:translateY(-1px); }
.btn-ink{ background:var(--ink); color:#fff; }
.btn-ink:hover{ background:var(--ink-700); transform:translateY(-1px); }
.btn-ghost{ background:#fff; color:var(--ink); border:1px solid var(--line); }
.btn-ghost:hover{ border-color:var(--ink-500); }
.btn-sm{ height:44px; padding:0 18px; font-size:14px; border-radius:12px; }

/* ── Header ─────────────────────────── */
.hd{ position:sticky; top:0; z-index:50; background:rgba(255,255,255,.78); backdrop-filter:blur(14px) saturate(150%);
  border-bottom:1px solid transparent; transition:.2s; }
.hd[data-scroll="1"]{ border-color:var(--line); box-shadow:0 6px 24px -18px rgba(16,38,63,.4); }
.hd-in{ display:flex; align-items:center; gap:18px; height:72px; }
.brand{ display:flex; align-items:center; gap:11px; }
.brand img{ width:38px; height:38px; border-radius:11px; box-shadow:0 2px 7px -2px rgba(16,38,63,.45); }
.brand .wm{ font-weight:800; font-size:18px; letter-spacing:-.02em; }
.brand .wm i{ font-style:normal; color:var(--muted-2); font-weight:700; }
.nav{ display:flex; gap:6px; margin-left:14px; }
.nav a{ padding:9px 13px; border-radius:9px; font-weight:600; font-size:14.5px; color:var(--muted); transition:.14s; }
.nav a:hover{ color:var(--ink); background:var(--bg-2); }
.hd-cta{ margin-left:auto; display:flex; align-items:center; gap:10px; }
.hd-login{ font-weight:700; font-size:14.5px; color:var(--ink); padding:9px 12px; display:flex; align-items:center; gap:7px; }
.hd-login:hover{ color:var(--blue-600); }
.burger{ display:none; width:44px; height:44px; border:1px solid var(--line); border-radius:11px; background:#fff;
  align-items:center; justify-content:center; cursor:pointer; }
.burger svg{ width:22px; height:22px; }

/* ── Hero ─────────────────────────── */
.hero{ position:relative; overflow:hidden; }
.hero::before{ content:''; position:absolute; top:-280px; right:-180px; width:760px; height:760px; border-radius:50%;
  background:radial-gradient(circle, rgba(43,169,225,.13), rgba(43,169,225,0) 62%); z-index:0; }
.hero-in{ display:grid; grid-template-columns:1.05fr .95fr; gap:40px; align-items:center;
  padding:74px 0 64px; position:relative; z-index:1; }
.hero h1{ font-size:clamp(36px,5.2vw,60px); font-weight:800; line-height:1.04; margin:18px 0 20px; }
.hero h1 b{ color:var(--blue); font-weight:800; }
.hero p.lead{ font-size:19px; color:var(--muted); margin:0 0 30px; max-width:520px; text-wrap:pretty; }
.hero-cta{ display:flex; gap:13px; flex-wrap:wrap; }
.hero-trust{ display:flex; align-items:center; gap:18px; margin-top:26px; color:var(--muted); font-size:13.5px; }
.hero-trust .dot{ width:5px; height:5px; border-radius:50%; background:var(--muted-2); }
.hero-trust b{ color:var(--ink); }

/* phone showcase */
.showcase{ position:relative; background:var(--showcase); border-radius:30px; padding:8px;
  display:flex; justify-content:center; box-shadow:var(--sh-lg); }
.showcase img{ width:330px; border-radius:24px; }
.float-card{ position:absolute; background:#fff; border:1px solid var(--line); border-radius:14px; padding:11px 14px;
  box-shadow:0 16px 34px -16px rgba(16,38,63,.45); display:flex; align-items:center; gap:10px; }
.float-card .ic{ width:34px; height:34px; border-radius:10px; display:grid; place-items:center; flex-shrink:0; }
.float-card .t{ font:700 13px var(--font); line-height:1.2; }
.float-card .s{ font:600 10.5px var(--mono); color:var(--muted-2); }
.fc-1{ top:54px; left:-30px; }
.fc-2{ bottom:60px; right:-26px; }

/* ── Stat band ─────────────────────────── */
.band{ background:var(--ink); color:#fff; }
.band-in{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; padding:40px 0; }
.band .st{ text-align:center; }
.band .st .v{ font-size:34px; font-weight:800; letter-spacing:-.03em; font-variant-numeric:tabular-nums; }
.band .st .v b{ color:var(--blue); }
.band .st .l{ font:600 12px var(--mono); letter-spacing:.06em; color:rgba(255,255,255,.6); margin-top:5px; text-transform:uppercase; }

/* ── Sections ─────────────────────────── */
section{ padding:104px 0; }
.alt{ background:var(--bg-2); }

/* feature grid */
.feat{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.fcard{ background:#fff; border:1px solid var(--line); border-radius:var(--r); padding:24px; box-shadow:var(--sh); transition:.18s; }
.fcard:hover{ transform:translateY(-3px); box-shadow:var(--sh-lg); }
.fcard .fic{ width:48px; height:48px; border-radius:13px; display:grid; place-items:center; margin-bottom:16px; }
.fcard .fic svg{ width:24px; height:24px; }
.fcard h3{ font-size:18px; font-weight:700; margin-bottom:8px; }
.fcard p{ color:var(--muted); font-size:14.5px; margin:0; text-wrap:pretty; }
.fcard .who{ margin-top:14px; font:600 11px var(--mono); letter-spacing:.04em; text-transform:uppercase; color:var(--blue-600); }

/* how it works */
.how{ display:grid; grid-template-columns:1fr 1fr; gap:32px; align-items:center; }
.how-side .step{ display:flex; gap:16px; padding:18px 0; border-top:1px solid var(--line); }
.how-side .step:first-child{ border-top:none; }
.how-side .num{ width:40px; height:40px; flex-shrink:0; border-radius:12px; background:var(--blue-050); color:var(--blue-600);
  display:grid; place-items:center; font:800 16px var(--mono); }
.how-side .step h3{ font-size:17.5px; margin-bottom:5px; }
.how-side .step p{ color:var(--muted); font-size:14.5px; margin:0; }
.shot{ border-radius:20px; overflow:hidden; box-shadow:var(--sh-lg); border:1px solid var(--line); }
.shot img{ width:100%; }
.dualshot{ display:grid; grid-template-columns:1fr 1fr; gap:18px; align-items:center; }
.dualshot .showcase{ box-shadow:var(--sh); }
.dualshot .showcase img{ width:100%; max-width:300px; }

/* pricing */
.bill-note{ display:inline-flex; align-items:center; gap:8px; background:var(--ok-bg); color:var(--ok);
  font:600 13px var(--font); padding:7px 14px; border-radius:999px; margin:0 auto 36px; }
.plans{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; align-items:stretch; }
.plan{ background:#fff; border:1px solid var(--line); border-radius:22px; padding:28px 26px; display:flex; flex-direction:column;
  box-shadow:var(--sh); position:relative; }
.plan.pop{ border:2px solid var(--blue); box-shadow:var(--sh-lg); }
.plan .tag{ position:absolute; top:-13px; left:26px; background:var(--blue); color:#fff; font:700 11px var(--mono);
  letter-spacing:.08em; text-transform:uppercase; padding:6px 12px; border-radius:999px; }
.plan .pname{ font-size:19px; font-weight:800; }
.plan .lim{ color:var(--muted); font-size:14px; margin-top:4px; }
.plan .price{ margin:22px 0 4px; display:flex; align-items:baseline; gap:6px; }
.plan .price .amt{ font-size:40px; font-weight:800; letter-spacing:-.03em; font-variant-numeric:tabular-nums; }
.plan .price .per{ color:var(--muted); font-weight:600; font-size:15px; }
.plan .yearly{ font:600 12px var(--mono); color:var(--muted-2); margin-bottom:22px; }
.plan ul{ list-style:none; padding:0; margin:0 0 26px; display:flex; flex-direction:column; gap:12px; flex:1; }
.plan li{ display:flex; align-items:flex-start; gap:10px; font-size:14.5px; color:var(--ink-700); }
.plan li svg{ width:18px; height:18px; flex-shrink:0; margin-top:1px; color:var(--ok); }
.plan .btn{ width:100%; }

/* download band */
.dl{ background:var(--ink); color:#fff; border-radius:30px; padding:54px 48px; display:grid;
  grid-template-columns:1.1fr .9fr; gap:30px; align-items:center; overflow:hidden; position:relative; }
.dl::before{ content:''; position:absolute; bottom:-160px; left:-80px; width:480px; height:480px; border-radius:50%;
  background:radial-gradient(circle, rgba(43,169,225,.22), transparent 64%); }
.dl-in{ position:relative; z-index:1; }
.dl h2{ font-size:clamp(28px,3.6vw,40px); font-weight:800; margin-bottom:14px; }
.dl p{ color:rgba(255,255,255,.72); font-size:17px; margin:0 0 28px; max-width:440px; }
.stores{ display:flex; gap:13px; flex-wrap:wrap; }
.store{ display:flex; align-items:center; gap:12px; height:58px; padding:0 20px; border-radius:14px;
  background:#fff; color:var(--ink); cursor:pointer; transition:.16s; }
.store:hover{ transform:translateY(-2px); }
.store svg{ width:26px; height:26px; }
.store .col{ display:flex; flex-direction:column; line-height:1.15; }
.store .col small{ font:600 10px var(--mono); color:var(--muted); text-transform:uppercase; letter-spacing:.04em; }
.store .col b{ font-size:16px; font-weight:800; }
.dl-phone{ position:relative; z-index:1; display:flex; justify-content:center; }
.dl-phone img{ width:260px; border-radius:22px; box-shadow:0 30px 60px -20px rgba(0,0,0,.5); }

/* FAQ */
.faq{ max-width:760px; margin:0 auto; }
.q{ border-bottom:1px solid var(--line); }
.q summary{ list-style:none; cursor:pointer; padding:22px 4px; display:flex; align-items:center; gap:16px;
  font-weight:700; font-size:17px; }
.q summary::-webkit-details-marker{ display:none; }
.q summary .pm{ margin-left:auto; width:26px; height:26px; flex-shrink:0; position:relative; transition:.2s; color:var(--blue-600); }
.q[open] summary .pm{ transform:rotate(45deg); }
.q .ans{ padding:0 4px 24px; color:var(--muted); font-size:15.5px; max-width:660px; text-wrap:pretty; }

/* footer */
.ft{ background:var(--ink); color:#fff; padding:60px 0 36px; }
.ft-top{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:30px; padding-bottom:40px; border-bottom:1px solid rgba(255,255,255,.1); }
.ft .brand .wm{ color:#fff; }
.ft .brand .wm i{ color:rgba(255,255,255,.5); }
.ft p.desc{ color:rgba(255,255,255,.6); font-size:14px; margin:16px 0 0; max-width:280px; }
.ft h4{ font:600 11px var(--mono); letter-spacing:.12em; text-transform:uppercase; color:rgba(255,255,255,.5); margin:0 0 16px; }
.ft .lk{ display:flex; flex-direction:column; gap:11px; }
.ft .lk a{ color:rgba(255,255,255,.82); font-size:14.5px; }
.ft .lk a:hover{ color:#fff; }
.ft-bot{ display:flex; align-items:center; justify-content:space-between; padding-top:26px; color:rgba(255,255,255,.5); font-size:13px; gap:16px; flex-wrap:wrap; }

/* mobile menu */
.mnav{ display:none; }

/* ── Responsive ─────────────────────────── */
@media(max-width:900px){
  .nav,.hd-login{ display:none; }
  .burger{ display:flex; }
  .hero-in{ grid-template-columns:1fr; gap:8px; padding:48px 0; }
  .hero .showcase{ margin-top:24px; }
  .band-in{ grid-template-columns:repeat(2,1fr); gap:30px 16px; }
  .feat,.plans{ grid-template-columns:1fr; }
  .how,.dualshot,.dl{ grid-template-columns:1fr; }
  .dl{ padding:40px 28px; text-align:center; }
  .dl p{ margin-left:auto; margin-right:auto; }
  .stores{ justify-content:center; }
  .dl-phone{ display:none; }
  .ft-top{ grid-template-columns:1fr 1fr; }
  section{ padding:72px 0; }
  .float-card{ display:none; }
  .mnav[data-open="1"]{ display:block; position:fixed; inset:72px 0 0; background:#fff; z-index:49; padding:18px 24px; }
  .mnav a{ display:block; padding:16px 4px; font-size:18px; font-weight:700; border-bottom:1px solid var(--line-soft); }
  .mnav .btn{ width:100%; margin-top:18px; }
}
@media(max-width:560px){
  .band-in{ grid-template-columns:1fr 1fr; }
  .ft-top{ grid-template-columns:1fr; gap:24px; }
}