/* EasyEkstre tanıtım sayfası — sistem yazı tipi, harici kaynak yok. */
:root {
  --bg: #f6f7f9;
  --surface: #ffffff;
  --text: #162133;
  --muted: #59677b;
  --line: #e2e7ee;
  --navy: #17273e;
  --stage: #17273e;
  --stage-muted: #c8d5e5;
  --on-navy: #ffffff;
  --btn-bg: #17273e;
  --btn-fg: #ffffff;
  --link: #205b9e;
  --focus: #2a76c6;
  --ok: #176b4c;
  --ok-soft: #eaf5ef;
  --ease: cubic-bezier(0.23, 1, 0.32, 1);
  --pad: clamp(16px, 4vw, 32px);
  color-scheme: light dark;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #0d1420;
    --surface: #151f2e;
    --text: #edf2f9;
    --muted: #a5b2c5;
    --line: #2a3749;
    --stage: #1a2d47;
    --btn-bg: #edf2f9;
    --btn-fg: #17273e;
    --link: #8cc1ff;
    --focus: #8cc1ff;
    --ok: #90d7b4;
    --ok-soft: #21392f;
  }
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; -webkit-tap-highlight-color: transparent; scroll-behavior: smooth; }
body {
  margin: 0; background: var(--bg); color: var(--text);
  font: 400 1rem/1.6 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  -webkit-font-smoothing: antialiased; overflow-x: hidden;
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--link); text-underline-offset: 3px; }
h1, h2, h3 { margin: 0; line-height: 1.15; }
p { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; border-radius: 6px; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.wrap { width: min(1120px, 100% - 2 * var(--pad)); margin-inline: auto; }
[hidden] { display: none !important; }

.skip { position: absolute; left: 8px; top: -60px; z-index: 100; background: #fff; color: #17273e; padding: 10px 14px; border-radius: 10px; }
.skip:focus { top: 8px; }

/* Üst çubuk */
.site-header { background: var(--bg); }
.header-row { display: flex; align-items: center; gap: 16px; min-height: 64px; }
.brand { display: inline-flex; align-items: center; gap: 10px; font-weight: 700; font-size: 1.125rem; color: inherit; text-decoration: none; letter-spacing: -0.01em; }
.brand img { border-radius: 8px; }
.nav { display: none; margin-left: auto; gap: 4px; }
.nav a { color: inherit; text-decoration: none; padding: 10px 14px; border-radius: 10px; font-weight: 500; opacity: 0.85; min-height: 44px; display: inline-flex; align-items: center; }
.header-row .btn { margin-left: auto; }
@media (min-width: 720px) { .nav { display: flex; } .header-row .btn { margin-left: 8px; } }

/* Düğmeler */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 48px; padding: 0 22px; border-radius: 14px; border: 1.5px solid transparent;
  font: 600 1rem/1 inherit; font-family: inherit; text-decoration: none; cursor: pointer;
  touch-action: manipulation; transition: transform 160ms var(--ease), background-color 160ms ease-out, border-color 160ms ease-out;
}
.btn:active { transform: scale(0.97); }
.btn-sm { min-height: 44px; padding: 0 16px; font-size: 0.9375rem; }
.btn-primary { background: var(--btn-bg); color: var(--btn-fg); }
.btn-outline { background: transparent; color: var(--text); border-color: var(--muted); }
.btn-light { background: #fff; color: #17273e; }
.btn-ghost { background: transparent; color: #fff; border-color: rgba(255, 255, 255, 0.5); }
@media (hover: hover) and (pointer: fine) {
  .btn-primary:hover { opacity: 0.9; }
  .btn-outline:hover { border-color: var(--text); }
  .btn-ghost:hover { background: rgba(255, 255, 255, 0.1); }
  .btn-light:hover { background: #e9eef5; }
  .nav a:hover { opacity: 1; background: rgba(127, 140, 160, 0.14); }
}

.eyebrow { font-size: 0.875rem; font-weight: 600; letter-spacing: 0.02em; color: var(--muted); margin-bottom: 14px; }
.lede { font-size: 1.125rem; color: var(--muted); max-width: 38em; margin-top: 18px; }
.cta-row { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-top: 28px; }
.soon-row { margin-top: 20px; display: flex; flex-wrap: wrap; gap: 8px; }
.soon { display: inline-flex; align-items: center; min-height: 32px; padding: 0 12px; border-radius: 999px; border: 1px dashed var(--muted); color: var(--muted); font-size: 0.8125rem; font-weight: 500; }


/* ============ V2 — HİKÂYE ============ */
.story-hero { padding: 40px 0 24px; min-height: min(68svh, 640px); display: flex; flex-direction: column; justify-content: center; }
.v2 h1 { font-size: clamp(2.5rem, 10vw, 5.5rem); letter-spacing: -0.04em; font-weight: 750; line-height: 1.02; max-width: 12em; text-wrap: balance; }
.chapter { display: grid; gap: 24px; align-items: center; padding-block: 56px; border-top: 1px solid var(--line); }
.chapter .kipo { width: clamp(150px, 44vw, 280px); margin-inline: auto; }
@media (min-width: 800px) {
  .chapter { grid-template-columns: 300px 1fr; gap: 64px; padding-block: 88px; }
  .chapter.flip { grid-template-columns: 1fr 300px; }
  .chapter.flip .kipo { order: 2; }
}
.chap-n { font-size: 0.875rem; font-weight: 600; color: var(--muted); letter-spacing: 0.04em; margin-bottom: 12px; text-transform: uppercase; }
.chapter h2 { font-size: clamp(1.75rem, 5vw, 3rem); letter-spacing: -0.03em; font-weight: 700; text-wrap: balance; }
.chapter p:not(.chap-n):not(.muted) { font-size: 1.125rem; color: var(--muted); margin-top: 16px; max-width: 34em; }
.story-price { margin: 20px 0 24px; padding: 20px 22px; background: var(--surface); border: 1px solid var(--line); border-radius: 20px; max-width: 34em; display: grid; gap: 6px; }
.story-price p { font-size: 1.0625rem !important; margin: 0 !important; color: var(--text) !important; }
.story-price p.muted { color: var(--muted) !important; font-size: 0.9375rem !important; }
.story-price .or { color: var(--muted); }
.js .reveal { opacity: 0; transform: translateY(16px); transition: opacity 420ms var(--ease), transform 420ms var(--ease); }
.js .reveal.is-in { opacity: 1; transform: none; }

/* ============ SSS ============ */
.faq h2 { font-size: clamp(1.5rem, 4vw, 2.125rem); letter-spacing: -0.02em; margin-bottom: 28px; }
.faq { padding: 56px 0 64px; border-top: 1px solid var(--line); margin-top: 24px; }
.faq-wrap { max-width: 800px; }
.qa { display: grid; gap: 10px; }
details { background: var(--surface); border: 1px solid var(--line); border-radius: 16px; }
summary { cursor: pointer; list-style: none; padding: 16px 48px 16px 18px; font-weight: 600; min-height: 48px; position: relative; touch-action: manipulation; }
summary::-webkit-details-marker { display: none; }
summary::after { content: ""; position: absolute; right: 20px; top: 50%; width: 9px; height: 9px; border: solid var(--muted); border-width: 0 2px 2px 0; transform: translateY(-70%) rotate(45deg); transition: transform 160ms var(--ease); }
details[open] summary::after { transform: translateY(-30%) rotate(-135deg); }
details p { padding: 0 18px 18px; color: var(--muted); }

/* Altbilgi */
.site-footer { background: var(--stage); color: var(--on-navy); padding: 48px 0 32px; padding-bottom: calc(32px + env(safe-area-inset-bottom, 0px)); }
.site-footer a { color: #cfe3ff; }
.foot-grid { display: grid; gap: 32px; }
@media (min-width: 760px) { .foot-grid { grid-template-columns: 1.5fr 1fr 1fr; } }
.brand-foot { margin: 0 0 10px; }
.foot-note { color: var(--stage-muted); margin-bottom: 16px; }
address { font-style: normal; color: var(--stage-muted); line-height: 1.8; font-size: 0.9375rem; }
.foot-h { font-size: 0.875rem; letter-spacing: 0.04em; text-transform: uppercase; color: var(--stage-muted); margin-bottom: 12px; font-weight: 600; }
.site-footer ul { display: grid; gap: 4px; font-size: 0.9375rem; color: var(--stage-muted); }
.site-footer li a { display: inline-flex; min-height: 32px; align-items: center; }
.copy { margin-top: 32px; padding-top: 20px; border-top: 1px solid rgba(200, 213, 229, 0.2); color: var(--stage-muted); font-size: 0.8125rem; }
.site-footer :focus-visible { outline-color: #8cc1ff; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .js .reveal { opacity: 1; transform: none; transition: none; }
  .btn, summary::after { transition: none; }
}

/* Yasal sayfalar (build-landing-legal.mjs) */
.legal { max-width: 760px; padding-block: 40px 64px; }
.legal h1 { font-size: clamp(1.75rem, 5vw, 2.5rem); letter-spacing: -0.03em; margin-bottom: 20px; }
.legal h2 { font-size: 1.375rem; letter-spacing: -0.01em; margin: 36px 0 12px; }
.legal h3 { font-size: 1.125rem; margin: 24px 0 8px; }
.legal p, .legal li { color: var(--text); }
.legal p { margin-top: 12px; overflow-wrap: anywhere; }
.legal ul, .legal ol { margin: 12px 0 0 1.25em; display: grid; gap: 6px; }
.legal ul { list-style: disc; }
.legal ol { list-style: decimal; }
.legal blockquote { margin-top: 12px; padding: 14px 16px; border-radius: 14px; background: var(--surface); border: 1px solid var(--line); border-left: 4px solid var(--navy); }
.legal code { font-size: 0.9em; background: var(--surface); padding: 1px 5px; border-radius: 6px; }
.copy-solo { margin-top: 0; border-top: 0; padding-top: 0; }