/* rankzupAI marketing tasarım sistemi (l- dili) — SEO-021: landing.html'den
   ayrıştırıldı; artık ?v hash + 30-gün immutable ile önbelleklenir (sayfa başına
   40KB inline tekrar yerine tek indirme). Saf CSS — Jinja yok. */
  /* ═══════════════════════════════════════════════════════════════════════
     Landing v6 — "Editoryal sıcaklık" · insansı kimlik (AI-klişe temizliği)
     app.css'ten bağımsız, l- öneki. Çocuk sayfalar (ajanslar/metodoloji/
     compare/dogfood) bu l- dilini miras alır → palet+tipografi otomatik akar.
     Mor-indigo YOK. Gradient YOK (yalnız italik-serif + dalgalı çizgi vurgusu).
     Font: Hanken Grotesk (tek tipografi — başlık + gövde + rakam).
     ═══════════════════════════════════════════════════════════════════════ */
  .l-body {
    /* — Nötr / kağıt — */
    --ink: #171717; --ink-soft: #52525B; --ink-faint: #71717A;
    --paper: #FFFFFF; --paper-alt: #FAFAFA; --surface: #FFFFFF;
    --line: #E7E7E9; --line-2: #D9D9DE;
    /* — Aksan — */
    --clay: #C1502E; --clay-deep: #A23F1F; --clay-tint: #F3E4DA; --clay-soft: #E9CBB9;
    --pine: #1F5C4D; --pine-tint: #E4EDE8;
    --amber: #9A5C0F;
    --dark: #131316; --dark-2: #1B1B1F;
    /* — Fontlar — */
    --font-display: "Hanken Grotesk", ui-sans-serif, system-ui, "Segoe UI", Arial, sans-serif;
    --font-sans: "Hanken Grotesk", ui-sans-serif, system-ui, "Segoe UI", Arial, sans-serif;
    /* — Derinlik / biçim — */
    --sh1: 0 1px 2px rgba(0, 0, 0, .05);
    --sh2: 0 14px 34px -22px rgba(0, 0, 0, .18);
    --sh3: 0 30px 70px -38px rgba(0, 0, 0, .28);
    --r1: 4px; --r2: 7px; --r3: 11px; --r4: 14px;

    background: var(--paper); color: var(--ink);
    font-family: var(--font-sans); font-size: 16.5px; line-height: 1.62;
    font-weight: 400; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
  }
  html { scroll-behavior: smooth; }
  .l-wrap { max-width: 1200px; margin: 0 auto; padding: 0 1.5rem; }

  /* Tek tipografi: Hanken Grotesk — başlıklar kalın (700-800), temiz ve profesyonel */
  .l-body h1, .l-body h2, .l-h2, .l-hero h1, .l-feat-txt h3, .l-final h2 {
    font-family: var(--font-display);
    font-weight: 700;
    letter-spacing: -.022em;
  }

  /* — Nav: kağıt rengi, blur YOK, ince alt kural — */
  .l-navbar {
    position: sticky; top: 0; z-index: 50;
    background: var(--paper);
    border-bottom: 1px solid var(--line);
  }
  .l-nav { display: flex; align-items: center; justify-content: space-between; gap: 1rem; height: 66px; }
  .l-logo {
    display: inline-flex; align-items: baseline; font-family: var(--font-sans);
    font-weight: 700; font-size: 1.14rem; letter-spacing: -.02em; color: var(--ink); text-decoration: none;
  }
  .l-logo:hover { text-decoration: none; }
  .l-logo .mark {
    display: inline-flex; align-items: center; justify-content: center;
    width: 27px; height: 27px; margin-right: .5rem; border-radius: var(--r1);
    background: var(--clay); color: #fff; align-self: center;
    font-family: var(--font-display); font-weight: 800; font-size: 1.02rem; line-height: 1; letter-spacing: -.02em;
  }
  .l-logo .ai { color: var(--clay-deep); font-weight: 700; }
  .l-nav-menu { display: flex; align-items: center; gap: 1.7rem; }
  .l-nav-menu a {
    position: relative; color: var(--ink-soft); font-weight: 500; font-size: .93rem;
    text-decoration: none; padding: .3rem 0;
  }
  .l-nav-menu a::after {
    content: ""; position: absolute; left: 0; bottom: -2px; height: 1.5px; width: 100%;
    background: var(--clay); transform: scaleX(0); transform-origin: left; transition: transform .22s ease;
  }
  .l-nav-menu a:hover { color: var(--ink); text-decoration: none; }
  .l-nav-menu a:hover::after { transform: scaleX(1); }
  /* A: aktif bolum (scrollspy) — kalici alt cizgi + koyu metin */
  .l-nav-menu a[aria-current="true"] { color: var(--ink); }
  .l-nav-menu a[aria-current="true"]::after { transform: scaleX(1); }
  .l-nav-cta { display: flex; align-items: center; gap: 1.15rem; }
  .l-nav-cta .login-link { color: var(--ink-soft); font-weight: 600; font-size: .93rem; text-decoration: none; }
  .l-nav-cta .login-link:hover { color: var(--clay-deep); }
  /* Dil değiştirici — marketing (açık tema); app switcher'la aynı görsel dil */
  .l-lang-switch { display: inline-flex; align-items: center; overflow: hidden;
    border: 1px solid var(--line-2); border-radius: var(--r1);
    font-size: .72rem; font-weight: 700; letter-spacing: .03em; }
  .l-lang-switch a, .l-lang-switch .ls-on { padding: .5rem .62rem; line-height: 1; text-decoration: none; min-height: 40px; display: inline-flex; align-items: center; }  /* SEO-066: dokunma hedefi */
  .l-lang-switch a { color: var(--ink-soft); }
  .l-lang-switch a:hover { color: var(--ink); background: var(--clay-tint); text-decoration: none; }
  .l-lang-switch .ls-on { background: var(--clay); color: #fff; }

  /* — Butonlar: düz kil, bas-kalk (press) hissi — */
  .l-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
    border: 0; cursor: pointer; text-decoration: none; font-family: var(--font-sans);
    background: var(--clay); color: #fff; font-weight: 600; font-size: .95rem;
    padding: .72rem 1.35rem; min-height: 44px; border-radius: var(--r2); letter-spacing: -.005em;
    box-shadow: 0 1px 0 rgba(17, 17, 17, .12), 0 8px 18px -10px rgba(193, 80, 46, .30);
    transition: transform .16s cubic-bezier(.2, .7, .3, 1), box-shadow .16s, background .16s;
  }
  .l-btn:hover { background: #b0471f; transform: translateY(-1px); color: #fff; text-decoration: none;
    box-shadow: 0 1px 0 rgba(17, 17, 17, .12), 0 14px 26px -12px rgba(193, 80, 46, .34); }
  .l-btn:active { transform: translateY(0) scale(.98); box-shadow: inset 0 2px 4px rgba(17, 17, 17, .22); }
  .l-btn.small { padding: .55rem 1rem; min-height: 40px; font-size: .89rem; }
  .l-btn.big { padding: .9rem 1.8rem; min-height: 50px; font-size: 1.03rem; }
  .l-btn.wide { width: 100%; text-align: center; padding: .9rem 1.4rem; }
  .l-btn:disabled { opacity: .6; cursor: wait; transform: none; }
  .l-btn-ghost {
    display: inline-flex; align-items: center; justify-content: center; text-decoration: none;
    font-family: var(--font-sans); font-weight: 600; font-size: .93rem; letter-spacing: -.005em;
    color: var(--ink); padding: .7rem 1.3rem; min-height: 44px; border-radius: var(--r2);
    border: 1.5px solid var(--line-2); background: transparent;
    transition: border-color .16s, background .16s, color .16s;
  }
  .l-btn-ghost:hover { border-color: var(--clay); color: var(--clay-deep); background: var(--clay-tint); text-decoration: none; }
  .l-btn-ghost.wide { display: flex; width: 100%; text-align: center; }

  /* — Bölüm iskeleti: değişken ritim, sola yaslı başlık — */
  /* ── Yeni-nesil mobil menü (checkbox-hack: JS'siz açılır; sağdan kayan drawer + blur backdrop) ── */
  .l-menu-toggle { position: absolute; opacity: 0; width: 44px; height: 44px; margin: 0; padding: 0;
    right: 1rem; top: 11px; z-index: 61; cursor: pointer; }         /* görünmez ama klavyeyle odaklanabilir */
  .l-burger, .l-drawer, .l-drawer-backdrop { display: none; }       /* masaüstünde gizli */
  body:has(.l-menu-toggle:checked) { overflow: hidden; }            /* drawer açıkken sayfa kilitli (modern :has()) */

  @media (max-width: 880px) {
    .l-nav-menu, .l-nav-cta { display: none; }
    .l-menu-toggle { display: block; }

    .l-burger { display: flex; flex-direction: column; justify-content: center; gap: 5px;
      width: 44px; height: 44px; padding: 0 9px; z-index: 60; cursor: pointer;
      transition: opacity .2s ease; }
    .l-burger span { display: block; height: 2px; width: 100%; background: var(--ink); border-radius: 2px; }
    /* Drawer AÇIKKEN hamburger gizlenir — kapatma yalnız drawer içindeki X ile (çift X olmaz). */
    .l-menu-toggle:checked ~ .l-burger { opacity: 0; pointer-events: none; }
    .l-menu-toggle:focus-visible ~ .l-burger { outline: 2px solid var(--clay); outline-offset: 3px; border-radius: 8px; }

    .l-drawer-backdrop { display: block; position: fixed; inset: 0; z-index: 55;
      background: rgba(28,26,21,.45); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px);
      opacity: 0; pointer-events: none; transition: opacity .3s ease; }
    .l-menu-toggle:checked ~ .l-drawer-backdrop { opacity: 1; pointer-events: auto; }

    .l-drawer { display: flex; flex-direction: column; position: fixed; top: 0; right: 0; z-index: 56;
      height: 100dvh; width: min(86vw, 340px); background: var(--surface);
      border-left: 1px solid var(--line); box-shadow: -12px 0 40px -18px rgba(28,26,21,.5);
      transform: translateX(102%); transition: transform .32s cubic-bezier(.4,0,.2,1);
      padding: calc(env(safe-area-inset-top) + .3rem) 1.15rem calc(env(safe-area-inset-bottom) + 1.2rem);
      overscroll-behavior: contain; overflow-y: auto; }
    .l-menu-toggle:checked ~ .l-drawer { transform: translateX(0); }
    .l-drawer-head { display: flex; align-items: center; justify-content: space-between; height: 56px; flex: none; }
    .l-drawer-logo { display: inline-flex; text-decoration: none; }
    .l-drawer-logo .mark { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px;
      background: var(--clay); color: #fff; border-radius: 8px; font-size: 1.05rem; font-weight: 800; }
    .l-drawer-close { font-size: 1.9rem; line-height: 1; width: 44px; height: 44px; display: inline-flex;
      align-items: center; justify-content: center; color: var(--ink-soft); cursor: pointer; border-radius: 10px; }
    .l-drawer-close:hover { background: var(--paper-alt); color: var(--ink); }
    .l-drawer-nav { display: flex; flex-direction: column; gap: 0; margin-top: .8rem; flex: 1; }
    .l-drawer-nav a { padding: .95rem .55rem; border-radius: 10px; color: var(--ink); font-weight: 600;
      font-size: 1.08rem; text-decoration: none; border-bottom: 1px solid var(--line-soft, var(--line)); }
    .l-drawer-nav a:hover, .l-drawer-nav a:active { background: var(--clay-tint, rgba(193,80,46,.08)); color: var(--clay-deep); }
    .l-drawer-foot { display: flex; flex-direction: column; align-items: stretch; gap: .85rem; margin-top: 1.1rem; flex: none; }
    .l-drawer-foot .l-lang-switch { align-self: flex-start; }
    .l-drawer-login { color: var(--ink-soft); font-weight: 600; text-decoration: none; padding: .3rem .1rem; }
    .l-drawer-login:hover { color: var(--clay-deep); }
    .l-drawer .l-btn.wide { display: block; text-align: center; }
  }
  @media (prefers-reduced-motion: reduce) {
    .l-drawer, .l-drawer-backdrop, .l-burger span { transition: none; }
  }
  .l-sec { padding: 7.5rem 0; }
  .l-sec.alt { background: var(--paper-alt); }
  .l-sec[id] { scroll-margin-top: 84px; }
  .l-kicker {
    display: inline-flex; align-items: center; gap: .6rem;
    font-family: var(--font-sans); font-size: .74rem; font-weight: 600; letter-spacing: .11em;
    text-transform: uppercase; color: var(--clay-deep); margin-bottom: .85rem;
  }
  .l-kicker::before { content: ""; width: 26px; height: 1.5px; background: var(--clay); flex-shrink: 0; }
  .l-h2 { font-size: clamp(1.95rem, 3.4vw, 2.6rem); line-height: 1.08; letter-spacing: -.018em; margin: 0 0 .7rem; }
  /* Ortalanmış tahmin edilebilir başlık bloğu → sola yaslı, dar, asimetrik */
  .l-sec-head { text-align: left; max-width: 560px; margin: 0 0 3.4rem; }
  .l-sec-head p { color: var(--ink-soft); font-size: 1.08rem; line-height: 1.55; margin: 0; }

  /* — Hero: sol ağırlıklı, hafif taşkın form, ince kağıt dokusu — */
  .l-hero {
    padding: 5rem 0 6rem; background: var(--paper);
    background-image:
      none;
    background-size: 22px 22px; background-position: -6px -6px;
  }
  .l-hero-grid {
    display: grid; grid-template-columns: minmax(0, .84fr) minmax(0, 1.16fr);
    gap: 3.4rem; align-items: start;
  }
  .l-hero > .l-wrap { position: relative; }
  .l-hero h1 {
    font-size: clamp(2.5rem, 5vw, 3.85rem);
    font-weight: 800;
    line-height: 1.05; letter-spacing: -.028em; margin: .4rem 0 1.2rem; text-wrap: balance; color: var(--ink);
  }
  /* Vurgu → kil renkli + elle-çizilmiş dalgalı kil alt çizgi (karakter, ama temiz sans) */
  .l-grad-text {
    font-family: var(--font-display); font-weight: 800; letter-spacing: -.028em;
    color: var(--clay-deep); background: none; -webkit-text-fill-color: currentColor;
    text-decoration: underline; text-decoration-style: wavy; text-decoration-color: var(--clay);
    text-decoration-thickness: 1.6px; text-underline-offset: 7px;
  }
  .l-sub { color: var(--ink-soft); font-size: 1.14rem; line-height: 1.6; margin: 0 0 2rem; max-width: 470px; }

  .l-card {
    background: var(--surface); border: 1px solid var(--line); border-radius: var(--r3);
    box-shadow: var(--sh1); padding: 1.6rem;
  }
  .l-test-card {
    max-width: 470px; position: relative; margin-top: .5rem;
    border-color: var(--line-2); box-shadow: var(--sh2);
  }
  .l-test-card::before {
    content: ""; position: absolute; inset: -1px auto -1px -1px; width: 4px;
    border-radius: var(--r3) 0 0 var(--r3); background: var(--clay);
  }
  .l-test-card h2 { margin: 0 0 .25rem; font-family: var(--font-display); font-weight: 700; font-size: 1.2rem; letter-spacing: -.02em; color: var(--ink); }
  .l-test-card .hint { margin: 0 0 1.1rem; color: var(--ink-faint); font-size: .88rem; }
  .l-field { display: block; margin-bottom: .85rem; font-size: .82rem; font-weight: 600; color: var(--ink-soft); letter-spacing: .01em; }
  .l-field input {
    display: block; width: 100%; margin-top: .34rem; box-sizing: border-box;
    padding: .68rem .85rem; font-size: 16px; font-family: var(--font-sans); color: var(--ink);  /* SEO-008: iOS otomatik-zoom önlem (≥16px) */
    background: var(--paper); border: 1px solid #8F8672; border-radius: var(--r2);  /* K10: girdi cercevesi 3:1 */
    transition: border-color .15s, box-shadow .15s, background .15s;
  }
  .l-field input::placeholder { color: #8E8E96; }
  .l-field input:focus { outline: none; background: #fff; border-color: var(--clay); box-shadow: 0 0 0 3px var(--clay-soft); }
  .l-hp { position: absolute; left: -9999px; top: -9999px; height: 0; overflow: hidden; }
  .l-form-note { text-align: center; color: var(--ink-faint); font-size: .8rem; margin: .9rem 0 0; }
  .l-error {
    background: rgba(193, 80, 46, .07); border: 1px solid rgba(193, 80, 46, .3);
    color: #9a2f13; border-radius: var(--r2); padding: .65rem .9rem; font-size: .88rem; margin: 0 0 1rem;
  }
  .l-loading { display: none; text-align: center; color: var(--clay-deep); font-weight: 600; font-size: .88rem; margin-top: .9rem; }
  .l-loading .dot { animation: l-blink 1.2s infinite; }
  .l-loading .dot:nth-child(2) { animation-delay: .2s; }
  .l-loading .dot:nth-child(3) { animation-delay: .4s; }
  @keyframes l-blink { 0%, 60%, 100% { opacity: .25; } 30% { opacity: 1; } }

  /* — Ekran görüntüsü çerçevesi: sadeleşmiş, sıcak hairline; ince iç halka ile derinlik — */
  .l-frame {
    background: var(--surface); border: 1px solid var(--line-2); border-radius: var(--r4);
    box-shadow: var(--sh2); overflow: hidden; position: relative;
  }
  .l-frame-bar {
    display: flex; align-items: center; gap: 5px; padding: 10px 14px;
    background: var(--paper-alt); border-bottom: 1px solid var(--line);
  }
  .l-frame-bar i { width: 9px; height: 9px; border-radius: 50%; background: var(--line-2); }
  .l-frame img { display: block; width: 100%; height: auto; }
  .l-frame-cap { color: var(--ink-faint); font-size: .87rem; margin: 1rem 0 0; }
  /* Öne çıkan büyük paneller (hero + özellik) — daha derin, tutunan gölge + tık hover kaldırma */
  .l-hero-img .l-frame, .l-feat-img .l-frame, .l-duo .l-frame {
    box-shadow: var(--sh3);
    transition: transform .3s cubic-bezier(.2, .7, .3, 1), box-shadow .3s;
  }
  .l-hero-img .l-frame:hover, .l-feat-img .l-frame:hover, .l-duo .l-frame:hover {
    transform: translateY(-4px);
    box-shadow: 0 40px 84px -40px rgba(17, 17, 17, .5);
  }
  .l-hero-img { padding-top: .5rem; }

  /* — Ürün kanıtı bandı: ortalı değil, sola yaslı editoryal rakamlar — */
  .l-proof { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: var(--surface); }
  .l-proof-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
  .l-proof-item { padding: 2rem 1.4rem; text-align: left; }
  /* A: ilk kolonun metni sayfa ritminden ~22px iceride basliyordu — kenar kolonlari hizala */
  .l-proof-item:first-child { padding-left: 0; }
  .l-proof-item:last-child { padding-right: 0; }
  .l-proof-item + .l-proof-item { border-left: 1px solid var(--line); }
  .l-proof-item .big { font-family: var(--font-display); font-weight: 700; font-size: 1.55rem; letter-spacing: -.025em; color: var(--ink); line-height: 1.12; }
  .l-proof-item .sub { color: var(--ink-faint); font-size: .87rem; margin-top: .35rem; }

  /* — Kategori mesajı bandı (pazarlama) — */
  .l-catstat { background: var(--paper); border-bottom: 1px solid var(--line); padding: 4.6rem 0; }
  .l-catstat .wrap-in { max-width: 900px; }
  .l-catstat .stat-lead { margin: 0; font-family: var(--font-display); font-weight: 600; font-size: clamp(1.3rem, 2.6vw, 1.85rem); color: var(--ink); line-height: 1.4; letter-spacing: -.02em; }
  .l-catstat .stat-lead strong { color: var(--clay-deep); font-weight: 600; }
  .l-catstat .stat-src { margin: 1rem 0 0; font-size: .82rem; color: var(--ink-faint); }

  /* — Nasıl çalışır: kutu değil, asılı büyük serif rakamlar — */
  .l-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2.2rem 2.6rem; margin-bottom: 3.4rem; }
  .l-step { padding: 0; background: none; border: 0; box-shadow: none; padding-top: 1.4rem; border-top: 2px solid var(--ink); }
  .l-step:nth-child(2) { margin-top: 1.6rem; }
  .l-step:nth-child(3) { margin-top: 3.2rem; }
  .l-step .n {
    display: block; width: auto; height: auto; margin-bottom: .5rem; background: none; border-radius: 0;
    font-family: var(--font-display); color: var(--clay); font-weight: 800; font-size: 2.4rem; line-height: 1; letter-spacing: -.03em; font-variant-numeric: lining-nums tabular-nums;
  }
  .l-step h3 { margin: 0 0 .35rem; font-family: var(--font-sans); font-size: 1.05rem; font-weight: 700; letter-spacing: -.01em; color: var(--ink); }
  .l-step p { margin: 0; color: var(--ink-soft); font-size: .93rem; line-height: 1.55; }

  /* — Özellik satırları — */
  .l-feat-row {
    display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
    gap: 3.4rem; align-items: center; padding: 4.4rem 0;
  }
  .l-feat-row + .l-feat-row { border-top: 1px solid var(--line); }
  .l-feat-row.rev .l-feat-txt { order: 2; }
  .l-feat-row.rev .l-feat-img { order: 1; }
  .l-feat-txt .l-kicker { margin-bottom: .7rem; }
  .l-feat-txt h3 { font-size: clamp(1.45rem, 2.4vw, 1.8rem); line-height: 1.14; letter-spacing: -.018em; margin: 0 0 .8rem; color: var(--ink); }
  .l-feat-txt > p { color: var(--ink-soft); font-size: 1.03rem; line-height: 1.55; margin: 0 0 1.2rem; }
  .l-checks { list-style: none; margin: 0; padding: 0; }
  /* ── Platformun tamamı: bento (03.08 v2 — kurucu: "yeni nesil görünüm") ──
     Kimlik korunur: kağıt+kil, cam/gradyan-mor YOK. Hiyerarşi: 2 büyük görselli
     karo + 3 orta + 7 kompakt. Rozet köşede MUTLAK konumlu (başlık akışını bozamaz). */
  .l-bento { display: grid; grid-template-columns: repeat(12, 1fr); gap: .9rem; }
  .l-cap { position: relative; background: var(--surface); border: 1px solid var(--line);
    border-radius: 16px; padding: 1.35rem 1.4rem;
    transition: transform .35s cubic-bezier(.2,.7,.3,1), box-shadow .35s ease, border-color .35s ease; }
  .l-cap:hover { transform: translateY(-2px); border-color: rgba(193,80,46,.35);
    box-shadow: 0 18px 40px -24px rgba(28,26,21,.28); }
  .l-cap.big { grid-column: span 7; display: flex; flex-direction: column; gap: .9rem; }
  .l-cap.big.alt { grid-column: span 5; }
  .l-cap.mid { grid-column: span 4; }
  .l-cap.sm { grid-column: span 3; padding: 1.05rem 1.1rem; border-radius: 13px; }
  /* 7 kompakt kart 4+3 kırılır — son üçlü 4'er kolon alıp satırı doldurur */
  .l-cap.sm:nth-last-child(-n+3) { grid-column: span 4; }
  .l-cap h3 { margin: 0 0 .35rem; font-size: 1.02rem; letter-spacing: -.015em;
    text-transform: none; color: var(--ink); line-height: 1.3; }
  .l-cap.sm h3 { font-size: .92rem; }
  .l-cap p { margin: 0; font-size: .875rem; line-height: 1.55; color: var(--ink-soft); }
  .l-cap.sm p { font-size: .8rem; line-height: 1.5; }
  .l-cap-new { position: absolute; top: .85rem; right: .9rem; font-size: .6rem; font-weight: 800;
    letter-spacing: .07em; text-transform: uppercase; color: var(--clay-deep);
    background: color-mix(in srgb, var(--clay) 12%, transparent); border: 1px solid rgba(193,80,46,.25);
    border-radius: 99px; padding: .16rem .55rem; }
  @supports not (background: color-mix(in srgb, red 10%, blue)) {
    .l-cap-new { background: rgba(193,80,46,.10); }
  }
  .l-cap-ic { display: inline-flex; align-items: center; justify-content: center;
    width: 38px; height: 38px; border-radius: 10px; margin-bottom: .75rem;
    background: color-mix(in srgb, var(--clay) 9%, transparent); color: var(--clay-deep); }
  @supports not (background: color-mix(in srgb, red 10%, blue)) {
    .l-cap-ic { background: rgba(193,80,46,.09); }
  }
  .l-cap.sm .l-cap-ic { width: 32px; height: 32px; border-radius: 9px; margin-bottom: .55rem; }
  .l-cap-ic svg { width: 19px; height: 19px; }
  .l-cap.sm .l-cap-ic svg { width: 16px; height: 16px; }
  /* büyük karo görselleri */
  .l-cap-viz { margin-top: auto; border: 1px solid var(--line); border-radius: 12px;
    background: var(--paper); padding: .9rem .95rem; }
  .l-cap-chips { display: flex; gap: .4rem; flex-wrap: wrap; margin-top: .65rem; }
  .l-cap-chips span { font-size: .7rem; color: var(--ink-soft); border: 1px solid var(--line);
    border-radius: 99px; padding: .16rem .55rem; background: var(--surface); }
  .l-bots { display: flex; flex-direction: column; gap: .55rem; }
  .l-bot { display: flex; align-items: center; gap: .6rem; font-size: .78rem; color: var(--ink); }
  .l-bot i { flex: 0 0 auto; font-style: normal; width: 96px; font-weight: 600; letter-spacing: -.01em; }
  .l-bot .bar { flex: 1; height: 8px; border-radius: 99px; background: var(--surface);
    border: 1px solid var(--line); overflow: hidden; }
  .l-bot .bar b { display: block; height: 100%; background: var(--clay); opacity: .85; }
  .l-bot em { font-style: normal; font-size: .68rem; color: var(--ink-faint, var(--ink-soft));
    border: 1px solid var(--line); border-radius: 99px; padding: .1rem .45rem; }
  .l-cap-tools { margin: 1.5rem 0 0; text-align: center; font-size: .9rem; color: var(--ink-soft); }
  .l-cap-tools a { color: var(--clay-deep); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
  @media (max-width: 980px) {
    .l-cap.big, .l-cap.big.alt { grid-column: span 12; }
    .l-cap.mid { grid-column: span 6; }
    .l-cap.sm, .l-cap.sm:nth-last-child(-n+3) { grid-column: span 6; }
  }
  @media (max-width: 560px) {
    .l-cap.mid, .l-cap.sm, .l-cap.sm:nth-last-child(-n+3) { grid-column: span 12; }
  }
  .l-checks li { display: flex; gap: .65rem; align-items: baseline; color: var(--ink-soft); font-size: .95rem; padding: .32rem 0; }
  .l-checks .c { flex-shrink: 0; color: var(--pine); font-weight: 800; font-size: .9rem; }
  .l-duo { display: grid; grid-template-columns: 1fr 1fr; gap: 2.2rem; margin-top: 2.6rem; }
  .l-duo figure { margin: 0; }

  /* — Örnek çıktı vitrini — */
  .l-demo-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.6rem; align-items: start; }
  .l-demo { position: relative; padding: 1.5rem 1.4rem; }
  .l-demo:nth-child(2) { margin-top: 1.8rem; }
  .l-demo .tag {
    position: absolute; top: .95rem; right: .95rem;
    font-size: .64rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
    color: var(--ink-faint); background: var(--paper-alt); border: 1px solid var(--line);
    padding: .18rem .5rem; border-radius: 999px;
  }
  .l-demo h4 { margin: 0 0 1.1rem; font-size: .78rem; font-weight: 700; color: var(--ink-faint); text-transform: uppercase; letter-spacing: .07em; }
  .l-demo-score { display: flex; align-items: center; gap: 1.2rem; }
  .l-demo-score .val { font-family: var(--font-display); font-size: 2.7rem; font-weight: 800; letter-spacing: -.035em; line-height: 1; color: var(--ink); font-variant-numeric: lining-nums tabular-nums; }
  .l-demo-score .val small { font-family: var(--font-sans); font-size: 1rem; font-weight: 500; color: var(--ink-faint); }
  .l-demo-score .delta { color: var(--pine); font-weight: 700; font-size: .95rem; }
  .l-demo-score .delta small { display: block; color: var(--ink-faint); font-weight: 500; font-size: .78rem; }
  .l-demo-bar { height: 6px; border-radius: 999px; background: var(--paper-alt); margin-top: 1.2rem; overflow: hidden; }
  .l-demo-bar i { display: block; height: 100%; width: 68%; border-radius: 999px; background: var(--clay); }
  .l-feed { list-style: none; margin: 0; padding: 0; }
  .l-feed li { display: flex; gap: .65rem; align-items: baseline; padding: .6rem 0; font-size: .9rem; color: var(--ink); }
  .l-feed li + li { border-top: 1px solid var(--line); }
  .l-feed .up { color: var(--pine); font-weight: 800; flex-shrink: 0; }
  .l-feed .warn { color: var(--amber); font-weight: 800; flex-shrink: 0; }
  .l-feed .meta { display: block; color: var(--ink-faint); font-size: .78rem; margin-top: .15rem; }
  .l-mail { border: 1px solid var(--line); border-radius: var(--r2); background: var(--paper); padding: .9rem 1rem; font-size: .88rem; }
  .l-mail .from { font-weight: 700; font-size: .82rem; color: var(--clay-deep); }
  .l-mail .subj { margin-top: .18rem; color: var(--ink); font-weight: 600; }
  .l-mail .prev { margin-top: .3rem; color: var(--ink-faint); font-size: .82rem; }

  /* — Fiyatlandırma — */
  .l-plans { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.4rem; align-items: stretch; }
  .l-plan { display: flex; flex-direction: column; padding: 1.7rem 1.5rem; text-align: left; transition: transform .18s ease, box-shadow .18s ease; }
  .l-plan:hover { transform: translateY(-2px); box-shadow: var(--sh2); }
  .l-plan .name { font-family: var(--font-sans); font-weight: 700; font-size: 1rem; color: var(--ink); }
  .l-plan .price {
    font-family: var(--font-sans); font-weight: 800; letter-spacing: -.03em;
    font-variant-numeric: lining-nums tabular-nums; font-feature-settings: "tnum" 1, "lnum" 1;
    font-size: clamp(1.7rem, 1.1rem + 1.35vw, 2.15rem);
    margin-top: .5rem; color: var(--ink); line-height: 1.02;
    display: flex; align-items: baseline; flex-wrap: wrap; column-gap: .34rem; row-gap: .1rem;
  }
  .l-plan .price .amt { white-space: nowrap; }
  .l-plan .price .per { font-family: var(--font-sans); font-size: .8rem; font-weight: 600; color: var(--ink-faint); letter-spacing: 0; white-space: nowrap; }
  .l-plan .was-row { font-family: var(--font-sans); font-size: .92rem; font-weight: 600; color: var(--ink-faint); text-decoration: line-through; letter-spacing: 0; white-space: nowrap; margin-top: .55rem; line-height: 1; font-variant-numeric: lining-nums tabular-nums; }
  .l-plan .was-row + .price { margin-top: .12rem; }
  .l-plan .yearly { color: var(--ink-faint); font-size: .8rem; line-height: 1.4; margin: .35rem 0 1rem; }
  .l-plan .yearly .was { white-space: nowrap; }
  /* Aylık/Yıllık segmented toggle */
  .l-billing {
    display: flex; align-items: center; gap: .2rem; width: fit-content; margin: 0 auto 2.2rem;
    padding: .28rem; background: var(--surface); border: 1px solid var(--line); border-radius: 999px; box-shadow: var(--sh1);
  }
  .l-billing-opt {
    appearance: none; border: none; background: transparent; cursor: pointer;
    font-family: var(--font-sans); font-size: .92rem; font-weight: 600; color: var(--ink-soft);
    padding: .62rem 1.15rem; min-height: 44px; border-radius: 999px; display: inline-flex; align-items: center; gap: .5rem;  /* SEO-037: dokunma hedefi ≥44px */
    transition: background .16s ease, color .16s ease;
  }
  .l-billing-opt:hover { color: var(--ink); }
  .l-billing-opt.is-active { background: var(--ink); color: var(--paper); }
  .l-billing-save {
    font-size: .68rem; font-weight: 700; letter-spacing: .01em; padding: .12rem .5rem; border-radius: 999px;
    background: var(--pine); color: #fff; white-space: nowrap;
  }
  /* Fiyat blokları — toggle durumuna göre yalnız biri görünür */
  .l-price-block { display: none; }
  .l-price-block[data-bill="monthly"] { display: block; }
  .l-price-block[data-bill="quarterly"], .l-price-block[data-bill="yearly"] { display: none; }
  .l-plans.is-quarterly .l-price-block[data-bill="monthly"] { display: none; }
  .l-plans.is-quarterly .l-price-block[data-bill="quarterly"] { display: block; }
  .l-plans.is-yearly .l-price-block[data-bill="monthly"] { display: none; }
  .l-plans.is-yearly .l-price-block[data-bill="yearly"] { display: block; }
  .l-save-badge {
    display: inline-flex; align-items: center; margin: .5rem 0 0; padding: .26rem .7rem; border-radius: 999px;
    background: var(--pine); color: #fff; font-size: .74rem; font-weight: 700; letter-spacing: .01em; white-space: nowrap;
  }
  .l-plan .l-checks { margin-bottom: 1.4rem; }
  .l-plan .l-checks li { font-size: .88rem; padding: .24rem 0; }
  .l-plan .cta { margin-top: auto; }
  .l-plan.hot { border-color: var(--clay); position: relative; box-shadow: var(--sh1); }
  .l-plan.hot::before { content: ""; position: absolute; inset: -1px -1px auto -1px; height: 4px; border-radius: var(--r3) var(--r3) 0 0; background: var(--clay); }
  .l-plan.hot .badge {
    position: absolute; top: -11px; left: 1.5rem;
    background: var(--clay); color: #fff;
    font-family: var(--font-sans); font-size: .68rem; font-weight: 700; letter-spacing: .04em;
    padding: .22rem .7rem; border-radius: 999px; white-space: nowrap;
  }
  .l-enterprise {
    margin-top: 1.8rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem;
    border: 1px solid var(--line-2); border-left: 4px solid var(--pine); border-radius: var(--r2); padding: 1.15rem 1.5rem;
    background: var(--surface); flex-wrap: wrap;
  }
  .l-enterprise p { margin: 0; color: var(--ink-soft); font-size: .93rem; }
  .l-enterprise strong { color: var(--ink); }

  /* — SSS — */
  .l-faq { max-width: 760px; }
  .l-faq details { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r2); margin-bottom: .7rem; transition: border-color .18s, background .18s; }
  .l-faq details[open] { border-color: var(--line-2); background: var(--clay-tint); }
  .l-faq summary {
    cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 1rem;
    padding: 1.05rem 1.25rem; font-weight: 600; font-size: .99rem; letter-spacing: -.008em; color: var(--ink);
  }
  .l-faq summary::-webkit-details-marker { display: none; }
  .l-faq summary::after { content: "+"; font-family: var(--font-display); font-weight: 400; font-size: 1.5rem; line-height: 1; color: var(--clay); transition: transform .22s ease; }
  .l-faq details[open] summary::after { transform: rotate(45deg); }
  .l-faq details p { margin: 0; padding: 0 1.25rem 1.15rem; color: var(--ink-soft); font-size: .93rem; line-height: 1.62; }

  .l-honest {
    margin: 3.4rem 0 0; max-width: 700px;
    color: var(--ink-faint); font-size: .86rem; line-height: 1.6;
    border-left: 3px solid var(--line-2); padding: .3rem 0 .3rem 1.2rem; background: none;
  }

  /* — Kapanış CTA bandı: sıcak siyah, krem metin — */
  .l-final { background: var(--dark); color: #F4F4F5; padding: 6rem 0; text-align: center;
    background-image: radial-gradient(rgba(255, 255, 255, .03) 1px, transparent 1.4px); background-size: 22px 22px; }
  .l-final h2 { font-size: clamp(2rem, 3.6vw, 2.7rem); line-height: 1.1; letter-spacing: -.025em; margin: 0 0 .7rem; text-wrap: balance; color: #FAFAFA; }
  .l-final p { color: #A1A1AA; font-size: 1.05rem; line-height: 1.55; margin: 0 auto 2rem; max-width: 540px; }
  .l-final .row { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; }
  .l-final .l-btn { background: var(--clay); }
  .l-final .l-btn:hover { background: #d15a34; }
  /* A: kapanis CTA'da .l-btn.big (50px) yaninda ghost 44px kaliyordu — hizala */
  .l-final .l-btn-ghost { color: #F4F4F5; background: transparent; border-color: rgba(241, 233, 216, .5); padding: .9rem 1.8rem; min-height: 50px; font-size: 1.03rem; }
  .l-final .l-btn-ghost:hover { border-color: #F4F4F5; color: #fff; background: rgba(241, 233, 216, .08); }
  .l-final .note { color: #8E8E96; font-size: .82rem; margin: 1.2rem auto 0; }

  /* — Footer — */
  /* 09.08: footer öncesi garanti nefes — içerik bitişi footer'a yapışmasın (tüm sayfalar).
     Koyu CTA bandı (l-final) footer'a bilinçli yapışık kalır (negatif telafi). */
  .l-footer { background: var(--surface); border-top: 1px solid var(--line); padding: 3.4rem 0 2.6rem; margin-top: 4rem; }
  .l-final { margin-bottom: -4rem; }
  .l-footer-grid { display: flex; justify-content: space-between; gap: 2.6rem; flex-wrap: wrap; }
  .l-footer-brand { max-width: 320px; }
  .l-footer-brand p { color: var(--ink-faint); font-size: .88rem; line-height: 1.55; margin: .8rem 0 0; }
  .l-footer-col h5 { margin: 0 0 .8rem; font-size: .74rem; font-weight: 700; text-transform: uppercase; letter-spacing: .09em; color: var(--ink-faint); }
  .l-footer-col a { display: block; color: var(--ink-soft); font-size: .9rem; text-decoration: none; padding: .42rem 0; transition: color .15s; }  /* SEO-015: mobil dokunma hedefi ≥44px */
  .l-footer-col a:hover { color: var(--clay-deep); }
  .l-footer-base { margin-top: 2.6rem; padding-top: 1.5rem; border-top: 1px solid var(--line); color: var(--ink-faint); font-size: .82rem; display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }

  /* ═══ Sonuç sayfası (landing_result.html bu blokları kullanır) ═══ */
  .l-result { max-width: 660px; margin: 2.5rem auto 4rem; padding: 0 1.5rem; }
  .l-score-card { text-align: center; padding: 2.3rem 1.5rem 1.9rem; }
  .l-score-ring {
    width: 148px; height: 148px; border-radius: 50%; margin: 0 auto 1rem;
    display: flex; align-items: center; justify-content: center;
    background:
      radial-gradient(closest-side, var(--surface) 82%, transparent 83% 100%),
      conic-gradient(var(--clay) 0deg, var(--clay) calc(var(--p) * .55), var(--pine) calc(var(--p) * 1), var(--line) calc(var(--p) * 1));
  }
  .l-score-ring .val { font-family: var(--font-display); font-size: 2.7rem; font-weight: 800; letter-spacing: -.035em; color: var(--ink); font-variant-numeric: lining-nums tabular-nums; }
  .l-score-ring .val small { font-family: var(--font-sans); font-size: 1rem; font-weight: 600; color: var(--ink-faint); }
  .l-verdict { font-family: var(--font-display); font-size: 1.35rem; font-weight: 700; letter-spacing: -.02em; margin: 0 0 .3rem; color: var(--ink); }
  .l-verdict-sub { color: var(--ink-soft); font-size: .92rem; margin: 0; }
  .l-prompt-list { list-style: none; margin: 1.3rem 0 0; padding: 0; text-align: left; }
  .l-prompt-list li {
    display: flex; align-items: center; gap: .7rem; padding: .72rem .9rem;
    border: 1px solid var(--line); border-radius: var(--r2); margin-bottom: .55rem;
    background: var(--surface); font-size: .92rem; color: var(--ink);
  }
  .l-pass, .l-fail {
    flex-shrink: 0; width: 24px; height: 24px; border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center; font-size: .8rem; font-weight: 800;
  }
  .l-pass { background: var(--pine-tint); color: var(--pine); }
  .l-fail { background: rgba(193, 80, 46, .13); color: var(--clay-deep); }
  .l-rivals { margin-top: 1.5rem; }
  .l-rivals h3 { font-size: .78rem; font-weight: 700; color: var(--ink-faint); text-transform: uppercase; letter-spacing: .08em; margin: 0 0 .6rem; text-align: left; }
  .l-rival-chips { display: flex; flex-wrap: wrap; gap: .5rem; }
  .l-chip {
    padding: .46rem .9rem; border-radius: 999px; font-size: .9rem; font-weight: 600;
    background: var(--surface); border: 1px solid var(--line-2); color: var(--ink);
  }
  .l-chip.locked { color: var(--ink-faint); background: var(--paper-alt); border-style: dashed; }
  .l-chip.locked .blurred { filter: blur(5px); user-select: none; }
  .l-gate { margin-top: 1.3rem; text-align: left; }
  .l-gate h2 { margin: 0 0 .35rem; font-family: var(--font-display); font-size: 1.2rem; font-weight: 700; letter-spacing: -.02em; color: var(--ink); }
  .l-gate p { margin: 0 0 1rem; color: var(--ink-soft); font-size: .9rem; line-height: 1.55; }
  .l-gate-form { display: flex; gap: .6rem; }
  .l-gate-form input[type="email"] {
    flex: 1; min-width: 0; padding: .68rem .85rem; font-size: .95rem; font-family: var(--font-sans);
    background: var(--paper); border: 1px solid var(--line-2); border-radius: var(--r2); color: var(--ink);
  }
  .l-gate-form input[type="email"]:focus { outline: none; border-color: var(--clay); box-shadow: 0 0 0 3px var(--clay-soft); }
  .l-sent {
    background: var(--pine-tint); border: 1px solid rgba(31, 92, 77, .3);
    color: #17453a; border-radius: var(--r2); padding: .8rem 1rem; font-size: .92rem;
  }
  .l-cta-card { margin-top: 1.3rem; text-align: center; padding: 1.9rem 1.5rem; }
  .l-cta-card h2 { margin: 0 0 .4rem; font-family: var(--font-display); font-size: 1.3rem; font-weight: 700; letter-spacing: -.02em; color: var(--ink); }
  .l-cta-card p { margin: 0 0 1.1rem; color: var(--ink-soft); font-size: .92rem; }
  .l-again { text-align: center; margin-top: 1.5rem; font-size: .88rem; }
  .l-again a { color: var(--ink-faint); }

  /* — Focus görünürlüğü (erişilebilirlik) — */
  .l-body a:focus-visible, .l-body button:focus-visible, .l-body summary:focus-visible,
  .l-body input:focus-visible, .l-body select:focus-visible, .l-body textarea:focus-visible,
  .l-body [tabindex]:focus-visible { outline: 2.5px solid var(--clay); outline-offset: 2px; border-radius: var(--r1); }

  /* — Responsive — */
  @media (max-width: 1020px) {
    .l-hero-grid { gap: 2.6rem; }
    .l-nav-menu { gap: 1.2rem; }
  }
  @media (max-width: 880px) {
    .l-sec { padding: 4.6rem 0; }
    .l-hero { padding: 2.8rem 0 3.6rem; }
    .l-hero-grid { grid-template-columns: 1fr; }
    .l-hero .l-test-card { max-width: 100%; }
    .l-hero-img { padding-top: 0; }
    .l-sub { max-width: none; }
    .l-nav-menu { display: none; }
    .l-proof-grid { grid-template-columns: 1fr 1fr; }
    .l-proof-item:nth-child(3) { border-left: 0; }
    .l-proof-item:nth-child(n+3) { border-top: 1px solid var(--line); }
    .l-steps { grid-template-columns: 1fr; gap: 1.8rem; }
    .l-step:nth-child(2), .l-step:nth-child(3) { margin-top: 0; }
    .l-feat-row { grid-template-columns: 1fr; gap: 1.8rem; padding: 2.8rem 0; }
    .l-feat-row.rev .l-feat-txt { order: 1; }
    .l-feat-row.rev .l-feat-img { order: 2; }
    .l-duo { grid-template-columns: 1fr; }
    .l-demo-grid { grid-template-columns: 1fr; }
    .l-demo:nth-child(2) { margin-top: 0; }
    .l-plans { grid-template-columns: 1fr 1fr; }
  }
  @media (max-width: 640px) {
    .l-nav-cta .login-link { display: none; }
    /* Mobil nav tek satır: dil toggle + kısa CTA sığsın, taşma/alt satıra kayma yok */
    .l-nav { gap: .55rem; }
    .l-nav-cta { gap: .55rem; flex-wrap: nowrap; }
    .l-lang-switch { flex-shrink: 0; }
    .l-nav-cta .l-btn.small { padding: .5rem .82rem; font-size: .85rem; white-space: nowrap; }
    .l-plans { grid-template-columns: 1fr; }
    .l-gate-form { flex-direction: column; }
    .l-final .row { flex-direction: column; align-items: stretch; }
    .l-footer-grid { flex-direction: column; gap: 1.8rem; }
  }
  @media (max-width: 380px) {
    /* Çok dar telefonlar: logo metnini kısalt, gap'i iyice düşür — tek satır korunur */
    .l-nav { gap: .4rem; }
    .l-nav-cta { gap: .4rem; }
    .l-logo { font-size: 1.02rem; }
    .l-nav-cta .l-btn.small { padding: .48rem .7rem; font-size: .82rem; }
  }
  @media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .l-body *, .l-body *::before, .l-body *::after { transition: none !important; animation: none !important; }
  }

  /* ═══ Kurucu üye lansman banner'ı — sıcak kil bandı (gradient YOK) ═══ */
  .l-founder-banner {
    background: var(--clay-tint);
    border-bottom: 1px solid var(--clay-soft);
  }
  .l-founder-banner .l-wrap {
    display: flex; align-items: center; justify-content: center; gap: .7rem;
    flex-wrap: wrap; padding: .68rem 1.5rem; text-align: center;
  }
  .l-founder-banner p { margin: 0; color: #6d3116; font-size: .88rem; font-weight: 500; }
  .l-founder-banner strong { color: var(--clay-deep); font-weight: 700; }
  .l-founder-banner a.l-founder-link {
    color: var(--clay-deep); font-weight: 700; text-decoration: underline;
    text-underline-offset: 2px; white-space: nowrap;
  }
  .l-founder-banner a.l-founder-link:hover { color: var(--clay); }
  @media (max-width: 640px) {
    .l-founder-banner p { font-size: .82rem; }
  }
  /* Kurucu indirimi — fiyat kartında eski (üstü çizili) + indirimli fiyat + rozet */
  .l-plan .was { font-family: var(--font-sans); font-size: 1rem; font-weight: 500; color: var(--ink-faint); text-decoration: line-through; margin-right: .4rem; letter-spacing: 0; }
  .l-plan .yearly .was { font-size: .8rem; margin-right: .3rem; }
  .l-founder-tag {
    align-self: flex-start; max-width: 100%; margin: 0 0 1rem; padding: .24rem .66rem; border-radius: 999px;
    background: var(--pine-tint); color: var(--pine); white-space: nowrap;
    font-size: .72rem; font-weight: 700; letter-spacing: .01em;
  }

  /* ═══ İlgili sayfalar bandı — SEO iç linkleme, footer üstü ═══ */
  .l-related { border-top: 1px solid var(--line); background: var(--paper); }
  .l-related-row { display: flex; align-items: center; gap: 1.4rem; flex-wrap: wrap; padding: 1.4rem 0; }
  .l-related-label { font-size: .74rem; font-weight: 700; text-transform: uppercase; letter-spacing: .09em; color: var(--ink-faint); flex-shrink: 0; }
  .l-related-links { display: flex; gap: 1.4rem; flex-wrap: wrap; }
  .l-related-links a { color: var(--ink-soft); font-size: .88rem; font-weight: 600; text-decoration: none; transition: color .15s; }
  .l-related-links a:hover { color: var(--clay-deep); text-decoration: underline; text-underline-offset: 3px; }
  @media (max-width: 640px) {
    .l-related-row { flex-direction: column; align-items: flex-start; gap: .6rem; }
  }

/* ── Araç ekran görüntüsü figürü + dönüşüm CTA'sı (blog/compare/landing ortak) ──
   Gerçek panel SS'leri (rankzupAI dogfood) + altında aksiyon butonu. */
.tool-fig { margin: 1.8rem 0; text-align: center; }
.tool-fig img {
  width: 100%; max-width: 680px; height: auto; border-radius: 12px;
  border: 1px solid var(--line, #E7E7E9);
  box-shadow: 0 1px 2px rgba(28,26,21,.04), 0 8px 24px rgba(28,26,21,.06);
  background: var(--surface, #FFFFFF);
}
.tool-fig figcaption {
  margin: .6rem auto 0; max-width: 560px;
  font-size: .86rem; line-height: 1.5; color: var(--ink-soft, #6b6555);
}
.tool-fig .tool-cta {
  display: inline-block; margin-top: .9rem; padding: .6rem 1.15rem;
  background: var(--clay, #C1502E); color: #fff; font-weight: 640; font-size: .95rem;
  border-radius: 9px; text-decoration: none; transition: background .15s;
}
.tool-fig .tool-cta:hover { background: var(--clay-deep, #A23F1F); }
.tool-fig .tool-note { margin-top: .7rem; font-size: .95rem; color: var(--ink-soft, #52525B); }
.tool-fig .tool-note a { color: var(--clay, #C1502E); font-weight: 620; }
@media (prefers-color-scheme: dark) {
  .tool-fig img { background: #211f1a; border-color: #3a352c; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   CRO pazarlama denetimi eklentileri (lz_ i18n ile eşleşir). Marka dili: sıcak
   kağıt + kil; jenerik AI-estetiği yok. Yalnız transform/opacity animasyonu.
   ═══════════════════════════════════════════════════════════════════════════ */

/* CRO-036/038/052 · hero segment çıpası + GEO tanımı + güven kaması */
.l-hero-eyebrow { margin-bottom: .9rem; }
.l-hero-define {
  color: var(--ink-soft); font-size: .96rem; line-height: 1.55;
  max-width: 470px; margin: -.6rem 0 1rem; padding-left: .85rem;
  border-left: 2px solid var(--line-2);
}
.l-hero-trust {
  display: inline-flex; align-items: center; gap: .45rem;
  color: var(--pine, #1F5C4D); font-size: .88rem; font-weight: 600;
  margin: 0 0 1.8rem;
}
.l-hero-trust span { color: var(--clay); font-size: .7rem; }

/* CRO-048 · dogfood / kurucu-pratisyen dürüst kanıt bandı */
.l-dogproof { padding: 2.4rem 0; }
.l-dogproof-card {
  display: flex; align-items: center; justify-content: space-between; gap: 1.6rem;
  flex-wrap: wrap;
  background: var(--surface); border: 1px solid var(--line-2); border-radius: var(--r4);
  box-shadow: var(--sh1); padding: 1.6rem 1.8rem;
}
.l-dogproof-txt { flex: 1 1 380px; }
.l-dogproof-txt .l-h2 { font-size: clamp(1.3rem, 2.4vw, 1.7rem); margin: .3rem 0 .5rem; }
.l-dogproof-txt p { color: var(--ink-soft); font-size: .98rem; line-height: 1.6; margin: 0; max-width: 640px; }
.l-dogproof-card .l-btn-ghost { flex-shrink: 0; }

/* CRO-044 · problem/stakes üçlüsü */
.l-stakes-row {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.2rem;
  margin-top: 1.8rem; text-align: left;
}
.l-stake {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r3); padding: 1.1rem 1.2rem;
}
.l-stake h3 { font-size: 1rem; font-weight: 720; letter-spacing: -.01em; margin: 0 0 .4rem; color: var(--ink); }
.l-stake p { color: var(--ink-soft); font-size: .9rem; line-height: 1.55; margin: 0; }
@media (max-width: 760px) { .l-stakes-row { grid-template-columns: 1fr; } }

/* CRO-040 · "neden biz" farklılaşma şeridi (GEO ≠ SEO) */
.l-why-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.1rem; }
.l-why {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r3); padding: 1.3rem 1.3rem; border-top: 3px solid var(--clay);
}
.l-why h3 { font-size: 1rem; font-weight: 730; letter-spacing: -.01em; margin: 0 0 .45rem; color: var(--ink); }
.l-why p { color: var(--ink-soft); font-size: .9rem; line-height: 1.55; margin: 0; }
@media (max-width: 900px) { .l-why-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { .l-why-grid { grid-template-columns: 1fr; } }

/* CRO-045 · platform bento aşamalı açığa çıkarma (kompakt karolar gizli) */
.l-cap-more { grid-column: 1 / -1; margin-top: .2rem; }
.l-cap-more > summary {
  cursor: pointer; list-style: none; text-align: center;
  font-weight: 640; font-size: .92rem; color: var(--clay-deep);
  padding: .7rem 1rem; border: 1.5px dashed var(--line-2); border-radius: var(--r2);
  background: var(--surface); transition: border-color .15s, background .15s;
}
.l-cap-more > summary::-webkit-details-marker { display: none; }
.l-cap-more > summary::after { content: " ↓"; }
.l-cap-more[open] > summary::after { content: " ↑"; }
.l-cap-more > summary:hover { border-color: var(--clay); background: var(--clay-tint); }
.l-cap-more-grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; margin-top: 1rem;
}
@media (max-width: 900px) { .l-cap-more-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { .l-cap-more-grid { grid-template-columns: 1fr; } }

/* CRO-017 · ek motorlar <details> toggle (l-engine-opts artık details) */
details.l-engine-opts > summary {
  cursor: pointer; list-style: none; display: block;
}
details.l-engine-opts > summary::-webkit-details-marker { display: none; }
details.l-engine-opts > summary::after { content: " +"; color: var(--ink-faint); font-weight: 700; }
details.l-engine-opts[open] > summary::after { content: " –"; }
details.l-engine-opts > summary:hover { color: var(--clay-deep); }

/* 22.08 UI ilkeleri: seçim rengi markayla hizalı */
.l-body ::selection { background: #F3D8CB; color: #171717; }

/* ── 22.08 UI ilkeleri ── */
.l-body p { text-wrap: pretty; }
@media (pointer: coarse) {
  .l-btn, .l-btn-ghost, .l-nav-menu a { min-height: 44px; }
}