/* Translate — "Instrument-Elevated" tasarım dili (DESIGN-LANGUAGE.md'ye birebir). Tek aksan: jade. */
:root, [data-mode="light"] {
  --bg:#FAFBFC; --surface:#FFFFFF; --text:#0F141A; --text-muted:#5A6672;
  --border:#E3E8EE; --accent:#0E9C8A; --accent-ink:#0B7A6C;
  --good:#1F8A5B; --bad:#CF4439; --warn:#B5790A; --highlight:#F59E0B;
}
[data-mode="dark"] {
  --bg:#0B0F14; --surface:#131922; --text:#E6EBF1; --text-muted:#8A96A4;
  --border:#1F2937; --accent:#18C2AC; --accent-ink:#4FD6C4;
  --good:#3BAE7A; --bad:#E0675B; --warn:#D79A2E; --highlight:#FBBF24;
}
* { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body {
  margin:0; background:var(--bg); color:var(--text);
  font:400 16px/1.6 "Inter", system-ui, -apple-system, sans-serif;
  font-feature-settings:"cv05","ss01"; -webkit-font-smoothing:antialiased;
}
h1,h2,h3 { line-height:1.15; letter-spacing:-0.01em; margin:0; }
a { color:var(--accent-ink); text-decoration:none; }
a:hover { text-decoration:underline; }
.tnum { font-variant-numeric:tabular-nums; }

/* Sesler */
.verdict { font-family:"Newsreader", Georgia, serif; font-weight:500; letter-spacing:-0.02em; }
.mono { font-family:"IBM Plex Mono", ui-monospace, monospace; }
.eyebrow {
  font-family:"IBM Plex Mono", monospace; font-size:12px; letter-spacing:0.14em;
  text-transform:uppercase; color:var(--accent-ink);
}

/* Layout */
.wrap { max-width:1080px; margin:0 auto; padding:0 24px; }
.hairline { height:1px; background:var(--border); border:0; margin:0; }
section { padding:72px 0; }
.muted { color:var(--text-muted); }

/* Üst bant */
.topbar { position:sticky; top:0; z-index:10; background:color-mix(in srgb,var(--bg) 86%, transparent); backdrop-filter:saturate(120%) blur(8px); border-bottom:1px solid var(--border); }
.topbar .wrap { display:flex; align-items:center; gap:20px; height:60px; }
.wordmark { font-family:"Newsreader", serif; font-weight:500; font-size:20px; letter-spacing:-0.01em; }
.wordmark b { color:var(--accent-ink); font-weight:500; }
.topbar nav { margin-left:auto; display:flex; gap:22px; align-items:center; }
.topbar nav a { color:var(--text-muted); font-size:14px; }
.topbar nav a:hover { color:var(--text); text-decoration:none; }

/* Butonlar */
.btn { display:inline-flex; align-items:center; gap:8px; height:42px; padding:0 18px; border-radius:8px;
  border:1px solid var(--border); background:var(--surface); color:var(--text); font:500 15px "Inter",sans-serif; cursor:pointer; transition:border-color .15s, background .15s; }
.btn:hover { border-color:var(--accent); }
.btn-accent { background:var(--accent); border-color:var(--accent); color:#06231F; }
[data-mode="dark"] .btn-accent { color:#04211C; }
.btn-accent:hover { filter:brightness(1.04); }
.btn:focus-visible, a:focus-visible, textarea:focus-visible, select:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }

/* Hero */
.hero { padding:88px 0 64px; }
.hero h1 { font-size:clamp(34px, 5.2vw, 56px); max-width:18ch; }
.hero .lead { font-size:19px; color:var(--text-muted); max-width:60ch; margin-top:20px; }
.hero .cta { margin-top:34px; display:flex; gap:12px; flex-wrap:wrap; }
.promise { margin-top:40px; display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--border); border:1px solid var(--border); border-radius:10px; overflow:hidden; }
.promise div { background:var(--surface); padding:18px 20px; }
.promise .k { font-family:"IBM Plex Mono",monospace; font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--accent-ink); }
.promise .v { margin-top:6px; font-size:15px; }

/* Süreç (7 kapı) — bir sayfa = bir iş; verdict-önce: önce vaat, sonra adımlar */
.steps { display:grid; gap:1px; background:var(--border); border:1px solid var(--border); border-radius:10px; overflow:hidden; }
.step { background:var(--surface); padding:20px 22px; display:grid; grid-template-columns:40px 1fr; gap:16px; align-items:baseline; }
.step .n { font-family:"IBM Plex Mono",monospace; color:var(--accent-ink); font-size:14px; }
.step h3 { font-size:16px; font-weight:600; }
.step p { margin:6px 0 0; color:var(--text-muted); font-size:14.5px; }

/* Paketler — iki kart, net hiyerarşi (kart-çorbası değil) */
.pkgs { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.pkg { background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:24px; }
.pkg h3 { font-family:"Newsreader",serif; font-weight:500; font-size:22px; }
.pkg ul { margin:14px 0 0; padding-left:18px; color:var(--text-muted); font-size:14.5px; }
.pkg li { margin:6px 0; }

/* Künye / specimen footer (imza) */
.specimen { font-family:"IBM Plex Mono",monospace; font-size:12px; color:var(--text-muted); letter-spacing:.04em;
  border-top:1px solid var(--border); padding:16px 0; display:flex; gap:18px; flex-wrap:wrap; align-items:center; }
.specimen .seal { width:8px; height:8px; border-radius:50%; background:var(--accent); box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 22%, transparent); }

/* Footer */
footer { border-top:1px solid var(--border); padding:32px 0; color:var(--text-muted); font-size:13.5px; }

/* ——— Workspace (app) ——— */
.app { display:grid; grid-template-columns:248px 1fr; min-height:calc(100vh - 60px); }
.side { border-right:1px solid var(--border); padding:28px 22px; background:var(--surface); }
.side .eyebrow { display:block; margin-bottom:16px; }
.flow { list-style:none; margin:0; padding:0; }
.flow li { display:grid; grid-template-columns:26px 1fr; gap:10px; padding:11px 0; align-items:baseline; color:var(--text-muted); font-size:14px; }
.flow li .n { font-family:"IBM Plex Mono",monospace; color:var(--accent-ink); font-size:13px; }
.flow li.active { color:var(--text); }
.flow li.done .n::after { content:" ✓"; color:var(--good); }
.body { padding:32px 36px; max-width:760px; }

.field { margin-bottom:18px; }
.field label { display:block; font-size:13px; color:var(--text-muted); margin-bottom:7px; font-family:"IBM Plex Mono",monospace; letter-spacing:.04em; text-transform:uppercase; }
textarea, select, input[type=text] { width:100%; background:var(--surface); color:var(--text); border:1px solid var(--border); border-radius:9px; padding:12px 13px; font:400 15px/1.55 "Inter",sans-serif; }
textarea { min-height:130px; resize:vertical; }
.row { display:flex; gap:14px; flex-wrap:wrap; }
.row .field { flex:1; min-width:150px; }
.checks { display:flex; gap:18px; flex-wrap:wrap; margin:4px 0 22px; }
.checks label { display:inline-flex; gap:8px; align-items:center; font-size:14px; color:var(--text); text-transform:none; font-family:inherit; letter-spacing:0; }

/* Rapor — verdict-önce */
.result { margin-top:30px; }
.result.hidden { display:none; }
.verdict-block { border:1px solid var(--border); border-left:3px solid var(--accent); border-radius:10px; background:var(--surface); padding:22px 24px; }
.verdict-block .label { font-family:"IBM Plex Mono",monospace; font-size:11.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--text-muted); }
.verdict-block .out { font-family:"Newsreader",serif; font-size:21px; line-height:1.5; margin-top:8px; }
.status-line { display:flex; gap:10px; align-items:center; margin-top:16px; font-size:14px; }
.dot { width:9px; height:9px; border-radius:50%; flex:none; }
.dot.good { background:var(--good); } .dot.bad { background:var(--bad); } .dot.warn { background:var(--warn); }
.chips { display:flex; gap:8px; flex-wrap:wrap; margin-top:14px; }
.chip { font-family:"IBM Plex Mono",monospace; font-size:12.5px; border:1px solid var(--border); border-radius:6px; padding:3px 9px; color:var(--text-muted); }
.chip b { color:var(--text); font-weight:600; }
.notes { margin:18px 0 0; padding:0; list-style:none; }
.notes li { font-size:14px; color:var(--text-muted); padding:4px 0 4px 18px; position:relative; }
.notes li::before { content:"·"; position:absolute; left:4px; color:var(--accent-ink); }
.blocked .verdict-block { border-left-color:var(--bad); }

.spinner { display:inline-block; width:14px; height:14px; border:2px solid var(--border); border-top-color:var(--accent); border-radius:50%; animation:spin .7s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .spinner { animation:none; } }

@media (max-width: 820px) {
  .app { grid-template-columns:1fr; } .side { border-right:0; border-bottom:1px solid var(--border); }
  .promise, .pkgs { grid-template-columns:1fr; }
}

/* ===== Workspace v2: modlar · segment · dropzone · canlı akış · export ===== */
.modes { display:flex; flex-direction:column; gap:8px; }
.mode { display:flex; gap:11px; align-items:flex-start; text-align:left; padding:11px 12px; border:1px solid var(--border); border-radius:10px; background:var(--surface); cursor:pointer; font:inherit; color:var(--text); transition:border-color .15s, background .15s; }
.mode:hover { border-color:var(--accent); }
.mode.active { border-color:var(--accent); background:color-mix(in srgb,var(--accent) 8%, var(--surface)); }
.mode .mi { font-size:17px; line-height:1.2; }
.mode .mt { display:flex; flex-direction:column; }
.mode .mt b { font-size:13.5px; font-weight:600; }
.mode .mt small { color:var(--text-muted); font-size:12px; margin-top:1px; }

/* canlı akış (dönen süreç) — .fi gösterge */
.flow { list-style:none; margin:0; padding:0; }
.flow li { display:grid; grid-template-columns:22px 1fr; gap:11px; align-items:center; padding:9px 0; color:var(--text-muted); font-size:13.5px; }
.flow li .fi { width:14px; height:14px; border-radius:50%; border:1.5px solid var(--border); position:relative; transition:all .2s; }
.flow li.running { color:var(--text); }
.flow li.running .fi { border-color:var(--accent); border-top-color:transparent; animation:spin .7s linear infinite; }
.flow li.done { color:var(--text); }
.flow li.done .fi { border-color:var(--accent); background:var(--accent); }
.flow li.done .fi::after { content:"✓"; position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-size:9px; color:#06231F; }
.flow li.muted-step { opacity:.38; }
@media (prefers-reduced-motion: reduce){ .flow li.running .fi{ animation:none; border-top-color:var(--accent); } }

/* segment: dosya/metin */
.seg { display:inline-flex; background:var(--surface); border:1px solid var(--border); border-radius:9px; padding:3px; gap:3px; margin-bottom:18px; }
.seg-btn { border:0; background:transparent; color:var(--text-muted); font:500 14px Inter,sans-serif; padding:8px 16px; border-radius:7px; cursor:pointer; transition:all .15s; }
.seg-btn.active { background:var(--accent); color:#06231F; }
[data-mode="dark"] .seg-btn.active { color:#04211C; }

.pane { margin-bottom:18px; }
.dropzone { border:1.5px dashed var(--border); border-radius:12px; padding:34px 20px; text-align:center; transition:border-color .15s, background .15s; }
.dropzone.over { border-color:var(--accent); background:color-mix(in srgb,var(--accent) 6%, var(--surface)); }
.dropzone .dz-main { font-size:15px; font-weight:500; }
.dropzone .dz-sub { font-family:"IBM Plex Mono",monospace; font-size:12px; margin-top:6px; }

/* gelişmiş seçenekler */
.adv { margin:4px 0 20px; border:1px solid var(--border); border-radius:9px; padding:0 14px; }
.adv summary { cursor:pointer; padding:12px 0; font-size:14px; color:var(--text-muted); list-style:none; }
.adv summary::-webkit-details-marker { display:none; }
.adv summary::before { content:"▸ "; color:var(--accent-ink); }
.adv[open] summary::before { content:"▾ "; }
.adv[open] { padding-bottom:14px; }

/* export + türev */
.exportbar { margin-top:22px; padding-top:18px; border-top:1px solid var(--border); }
.exp-btns { display:flex; gap:8px; flex-wrap:wrap; margin-top:10px; }
.exportbar.hidden, .derive.hidden { display:none; }

/* proofread önerileri */
.sug { border-left:2px solid var(--border); padding:8px 0 8px 14px; margin:10px 0; }
.sug-i { font-size:14px; font-weight:500; }
.sug-s { font-size:14px; color:var(--text-muted); margin-top:3px; }

/* ===== Landing v2 (SIGLUM) ===== */
.brand { display:inline-flex; align-items:center; gap:9px; letter-spacing:.04em; }
.seal-badge { width:30px;height:30px;border-radius:50%;border:1.5px solid var(--accent);display:inline-flex;align-items:center;justify-content:center;font-family:"Newsreader",serif;font-weight:600;color:var(--accent-ink);font-size:16px;flex:none; }
.lang-toggle { background:transparent;border:1px solid var(--border);border-radius:7px;padding:7px 12px;font:500 13px Inter,sans-serif;color:var(--text-muted);cursor:pointer; }
.lang-toggle:hover { border-color:var(--accent); }
.lang-toggle span { margin:0 5px;color:var(--border); }

/* dönüşüm diyagramı */
.flowdiagram { display:flex; align-items:stretch; gap:14px; margin:46px 0 0; text-align:left; }
.fd-card { flex:1 1 0; background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:20px; }
.fd-tag { font-family:"IBM Plex Mono",monospace; font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--accent-ink); }
.fd-title { font-family:"Newsreader",serif; font-size:17px; line-height:1.35; margin:10px 0 14px; }
.fd-meta { display:flex; gap:12px; align-items:center; font-size:12.5px; color:var(--text-muted); flex-wrap:wrap; }
.fd-meta .lock { margin-left:auto; color:var(--accent); }
.fd-link { align-self:center; flex:0 0 46px; height:2px; background:repeating-linear-gradient(90deg,var(--accent) 0 6px,transparent 6px 13px); background-size:26px 2px; opacity:.7; animation:flow 1.1s linear infinite; }
.fd-seal { align-self:center; flex:0 0 auto; width:78px;height:78px;border-radius:50%;border:2px solid var(--accent);background:var(--surface);display:flex;align-items:center;justify-content:center;font-family:"Newsreader",serif;font-weight:600;font-size:34px;color:var(--accent-ink);position:relative; }
.fd-ring { position:absolute; inset:-6px; border-radius:50%; border:1.5px solid var(--accent); opacity:.5; animation:pulse 2.4s ease-out infinite; }
@keyframes flow { to { background-position:26px 0; } }
@keyframes pulse { 0%{transform:scale(1);opacity:.5} 70%{transform:scale(1.22);opacity:0} 100%{opacity:0} }
.fd-chips { display:flex; gap:9px; flex-wrap:wrap; justify-content:center; margin-top:22px; }
.fd-chip { font-family:"IBM Plex Mono",monospace; font-size:12.5px; border:1px solid var(--border); border-radius:999px; padding:6px 13px; color:var(--text); background:var(--surface); opacity:0; transform:translateY(6px); animation:chipIn .5s ease forwards; animation-delay:var(--d,0s); }
@keyframes chipIn { to { opacity:1; transform:translateY(0); } }

/* özellik kartları */
.lp-features { display:grid; grid-template-columns:repeat(5,1fr); gap:1px; background:var(--border); border:1px solid var(--border); border-radius:14px; overflow:hidden; }
.lpf { background:var(--surface); padding:22px 18px; }
.lpf-ic { font-size:22px; }
.lpf h3 { font-family:"Newsreader",serif; font-weight:500; font-size:18px; margin:10px 0 6px; }
.lpf p { font-size:13.5px; color:var(--text-muted); margin:0; }
.lpf-chk { margin-top:14px; font-size:12.5px; color:var(--accent-ink); font-family:"IBM Plex Mono",monospace; }

/* güven şeridi */
.trustband { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--border); border:1px solid var(--border); border-radius:14px; overflow:hidden; }
.tb { background:var(--surface); padding:20px; display:flex; gap:13px; align-items:flex-start; }
.tb-ic { font-size:20px; }
.tb b { font-size:14px; display:block; }
.tb small { color:var(--text-muted); font-size:12.5px; display:block; margin-top:3px; }

@media (prefers-reduced-motion: reduce){ .fd-link{animation:none;} .fd-ring{animation:none;opacity:.3;} .fd-chip{animation:none;opacity:1;transform:none;} }
@media (max-width:900px){ .lp-features{grid-template-columns:repeat(2,1fr);} .trustband{grid-template-columns:repeat(2,1fr);} .flowdiagram{flex-direction:column;} .fd-link{display:none;} .topbar nav{gap:14px;} }
