/* ═══════════════════════════════════════════════════════════════
   Convert Run — public site

   Aydınlık ve sıcak bir zemin. Kalıcı koyu tema, tek vurgu rengi
   olarak mor ve büyük yarıçaplı kartlar bugün "şablondan çıkma"
   gibi okunuyor; buradaki karar bunun tersi: kâğıt beyazı yüzey,
   ince saç çizgileri, ölçülü gölge ve tek bir sıcak vurgu.

   Uygulamanın kendi belirteçlerinden bilinçli olarak ayrı: pazarlama
   yüzeyi ile araç yüzeyi aynı görünmek zorunda değil.
   ═══════════════════════════════════════════════════════════════ */

.landing {
  /* ── Yüzeyler: saf beyaz değil, sıcak kâğıt ── */
  --paper: #fbfaf8;
  --paper-raised: #ffffff;
  --paper-sunken: #f4f2ed;
  --paper-deep: #ecebe5;

  /* ── Koyu bant: sayfanın tamamı değil, bir tanesi ── */
  --ink-950: #121211;
  --ink-900: #1c1c1a;
  --ink-800: #2a2a27;

  --text: #14140f;
  --text-dim: #56534c;
  --text-faint: #6f6b62;
  --text-on-ink: #f6f4f0;
  --text-on-ink-dim: #a8a49b;

  --line-faint: rgba(20, 20, 15, 0.07);
  --line: rgba(20, 20, 15, 0.13);
  --line-strong: rgba(20, 20, 15, 0.24);

  /* ── Tek vurgu. İkinci bir renk eklemek zenginlik değil,
        kararsızlık okunuyor. ── */
  --signal: #c93a09;
  --signal-ink: #ff6a34;
  --signal-soft: rgba(201, 58, 9, 0.09);
  --signal-line: rgba(201, 58, 9, 0.26);

  --ok: #0f7a53;

  /* ── Aydınlık yüzeyde gölge çok az olmalı; fazlası kirli görünür ── */
  --lift-1: 0 1px 2px rgba(20, 20, 15, 0.04);
  --lift-2: 0 4px 16px -6px rgba(20, 20, 15, 0.11);
  --lift-3: 0 28px 56px -24px rgba(20, 20, 15, 0.22), 0 2px 6px rgba(20, 20, 15, 0.04);

  position: relative;
  min-height: 100vh;
  background: var(--paper);
  color: var(--text);
  overflow-x: clip;
}

/* Kâğıt dokusu: düz renk yüzeyler ekranda "boş" duruyor. */
.landing::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: 0.5;
  mix-blend-mode: multiply;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='0.045'/%3E%3C/svg%3E");
}

.landing > * { position: relative; z-index: 1; }

.lp-container {
  width: 100%;
  max-width: 1200px;
  margin-inline: auto;
  padding-inline: 24px;
}

.lp-narrow { max-width: 780px; }

/* ── Tipografi ─────────────────────────────────────────────────
   Büyük boyutta sıkı harf aralığı, küçük boyutta gevşek. Tek bir
   ölçek kullanmak metni ya kalabalık ya dağınık gösteriyor. */

.lp-display {
  margin: 0;
  font-size: clamp(2.6rem, 6.6vw, 5.1rem);
  line-height: 0.99;
  letter-spacing: -0.038em;
  font-weight: 660;
}

.lp-h2 {
  margin: 0;
  font-size: clamp(1.75rem, 3.6vw, 2.7rem);
  line-height: 1.1;
  letter-spacing: -0.03em;
  font-weight: 640;
  max-width: 18ch;
}

.lp-h3 {
  margin: 0;
  font-size: 1.04rem;
  line-height: 1.32;
  letter-spacing: -0.014em;
  font-weight: 600;
}

.lp-lead {
  margin: 20px 0 0;
  max-width: 56ch;
  color: var(--text-dim);
  font-size: clamp(1rem, 1.35vw, 1.11rem);
  line-height: 1.64;
  letter-spacing: -0.006em;
}

.lp-body { margin: 16px 0 0; color: var(--text-dim); line-height: 1.7; }
.lp-accent { color: var(--signal); }

/* Bölüm numarası: editoryal ritim, dekorasyon değil. */
.lp-index {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 20px;
  color: var(--text-faint);
  font-size: 0.74rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.lp-index::before {
  content: "";
  width: 28px;
  height: 1px;
  background: var(--signal);
}

/* ── Navigasyon ───────────────────────────────────────────────── */

.lp-nav {
  position: sticky;
  top: 0;
  z-index: 60;
  background: color-mix(in srgb, var(--paper) 82%, transparent);
  backdrop-filter: blur(18px) saturate(180%);
  border-bottom: 1px solid var(--line-faint);
}

.lp-nav__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  height: 66px;
}

.lp-brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  color: var(--text);
}

.lp-brand__mark {
  display: grid;
  place-items: center;
  width: 27px;
  height: 27px;
  border-radius: 7px;
  background: var(--signal);
  color: #fff;
  font-weight: 800;
  font-size: 0.82rem;
  letter-spacing: -0.02em;
}

.lp-brand__word { font-weight: 620; letter-spacing: -0.01em; font-size: 0.95rem; }

.lp-nav__links { display: none; gap: 28px; }

.lp-nav__links a {
  position: relative;
  color: var(--text-dim);
  text-decoration: none;
  font-size: 0.875rem;
  letter-spacing: -0.005em;
  padding-block: 4px;
  transition: color 0.18s ease;
}

.lp-nav__links a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0;
  height: 1.5px;
  background: var(--signal);
  transition: width 0.24s cubic-bezier(0.4, 0, 0.2, 1);
}

.lp-nav__links a:hover { color: var(--text); }
.lp-nav__links a:hover::after { width: 100%; }

.lp-nav__actions { display: flex; align-items: center; gap: 16px; }

.lp-link { color: var(--text-dim); text-decoration: none; font-size: 0.875rem; transition: color 0.18s ease; }
.lp-link:hover { color: var(--text); }

/* ── Düğmeler ──────────────────────────────────────────────────
   Büyük yarıçap ve parlak gölge şablon gibi okunuyor. Küçük
   yarıçap, kesin dolgu, içeriden bir ışık çizgisi. */

.lp-btn {
  --btn-py: 0.6rem;
  --btn-px: 1.1rem;

  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: var(--btn-py) var(--btn-px);
  border-radius: 8px;
  border: 1px solid transparent;
  font-family: inherit;
  font-weight: 560;
  font-size: 0.9rem;
  letter-spacing: -0.008em;
  text-decoration: none;
  cursor: pointer;
  white-space: nowrap;
  overflow: hidden;
  transition:
    background-color 0.18s ease,
    border-color 0.18s ease,
    color 0.18s ease,
    box-shadow 0.18s ease,
    transform 0.18s cubic-bezier(0.4, 0, 0.2, 1);
}

.lp-btn--primary {
  background: var(--signal);
  color: #fff;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.22) inset,
    0 2px 6px rgba(201, 58, 9, 0.22),
    0 8px 22px -10px rgba(201, 58, 9, 0.5);
}

/* Üzerine gelince soldan sağa geçen ince bir ışık. */
.lp-btn--primary::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(100deg, transparent 22%, rgba(255, 255, 255, 0.3) 50%, transparent 78%);
  transform: translateX(-120%);
  transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.lp-btn--primary:hover { background: #ab3006; transform: translateY(-1px); }
.lp-btn--primary:hover::after { transform: translateX(120%); }

.lp-btn--ghost {
  background: var(--paper-raised);
  border-color: var(--line);
  color: var(--text);
  box-shadow: var(--lift-1);
}

.lp-btn--ghost:hover { border-color: var(--line-strong); transform: translateY(-1px); box-shadow: var(--lift-2); }

.lp-btn--lg { --btn-py: 0.82rem; --btn-px: 1.5rem; font-size: 0.97rem; }
.lp-btn--sm { --btn-py: 0.44rem; --btn-px: 0.85rem; font-size: 0.84rem; }
.lp-btn--block { display: flex; width: 100%; margin-top: auto; }

.lp-btn:focus-visible { outline: 2px solid var(--signal); outline-offset: 2px; }

/* ── Hero ─────────────────────────────────────────────────────── */

.lp-hero {
  position: relative;
  padding-block: clamp(56px, 8vw, 104px) clamp(48px, 7vw, 88px);
  overflow: hidden;
}

/* Tek ve yumuşak bir ışık — iki renkli bulut yerine. */
.lp-hero__light {
  position: absolute;
  top: -46%;
  left: 50%;
  width: min(1200px, 140%);
  aspect-ratio: 1;
  transform: translateX(-50%);
  background: radial-gradient(closest-side, rgba(201, 58, 9, 0.1), transparent 70%);
  pointer-events: none;
}

.lp-hero__rule {
  position: absolute;
  inset-inline: 0;
  bottom: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--line), transparent);
}

.lp-hero__inner { display: grid; gap: clamp(40px, 5vw, 64px); align-items: center; }

.lp-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 5px 13px 5px 9px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--paper-raised);
  color: var(--text-dim);
  font-size: 0.78rem;
  letter-spacing: -0.004em;
  box-shadow: var(--lift-1);
}

.lp-eyebrow__dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--ok);
  box-shadow: 0 0 0 3px rgba(15, 122, 83, 0.14);
}

.lp-hero__title { margin-top: 26px; }
.lp-hero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }

.lp-hero__note {
  margin-top: 18px;
  color: var(--text-faint);
  font-size: 0.84rem;
  max-width: 46ch;
  line-height: 1.55;
}

/* ── Ürün çerçevesi ───────────────────────────────────────────── */

.lp-frame {
  border-radius: 14px;
  border: 1px solid var(--line);
  background: var(--paper-raised);
  box-shadow: var(--lift-3);
  overflow: hidden;
}

.lp-frame__bar {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 11px 16px;
  border-bottom: 1px solid var(--line-faint);
  background: var(--paper-sunken);
}

.lp-frame__bar i { width: 8px; height: 8px; border-radius: 50%; background: var(--line-strong); }
.lp-frame__path { margin-left: 10px; color: var(--text-faint); font-size: 0.74rem; }
.lp-frame__body { padding: 18px; display: grid; gap: 14px; }

.lp-field {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 9px;
  border: 1px solid var(--signal-line);
  background: var(--signal-soft);
  min-width: 0;
}

.lp-field__tag {
  flex: none;
  color: var(--signal);
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

.lp-field__value {
  color: var(--text);
  font-size: 0.88rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.lp-steps-mini { display: grid; gap: 6px; }

.lp-steps-mini > div {
  display: grid;
  grid-template-columns: 16px 1fr auto;
  gap: 10px;
  align-items: center;
  padding: 9px 12px;
  border-radius: 8px;
  background: var(--paper-sunken);
  border: 1px solid var(--line-faint);
  font-size: 0.84rem;
}

.lp-steps-mini svg { color: var(--ok); }
.lp-steps-mini span:last-child { color: var(--text-faint); font-size: 0.76rem; }

.lp-output {
  display: grid;
  grid-template-columns: 64px 1fr;
  gap: 14px;
  align-items: center;
  padding: 14px;
  border-radius: 10px;
  border: 1px solid var(--line);
  background: var(--paper);
}

.lp-output__poster {
  aspect-ratio: 9 / 16;
  border-radius: 7px;
  background: linear-gradient(160deg, var(--signal), #ff8a52);
  display: grid;
  place-items: center;
  color: #fff;
  box-shadow: var(--lift-2);
}

.lp-output__meta { display: grid; gap: 5px; min-width: 0; }
.lp-output__title { font-weight: 600; font-size: 0.95rem; letter-spacing: -0.012em; }
.lp-output__sub { color: var(--text-faint); font-size: 0.78rem; }

.lp-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 3px; }

.lp-chips span {
  padding: 3px 8px;
  border-radius: 5px;
  border: 1px solid var(--line-faint);
  background: var(--paper-sunken);
  color: var(--text-dim);
  font-size: 0.7rem;
}

/* ── Marquee ──────────────────────────────────────────────────── */

.lp-marquee {
  border-block: 1px solid var(--line-faint);
  background: var(--paper-sunken);
  padding-block: 18px;
  overflow: hidden;
  mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
}

.lp-marquee__track {
  display: flex;
  gap: 48px;
  width: max-content;
  animation: lp-scroll 44s linear infinite;
}

.lp-marquee:hover .lp-marquee__track { animation-play-state: paused; }

.lp-marquee__item {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--text-dim);
  font-size: 0.86rem;
  letter-spacing: -0.005em;
  white-space: nowrap;
}

.lp-marquee__item svg { color: var(--signal); flex: none; }

@keyframes lp-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

/* ── Bölümler ─────────────────────────────────────────────────── */

.lp-section { padding-block: clamp(64px, 8vw, 112px); }
.lp-section--tint { background: var(--paper-sunken); border-block: 1px solid var(--line-faint); }

/* Tek bir koyu bant: sayfanın tamamını koyu yapmak yerine bir yerde
   kontrast kurmak, ritmi görünür kılıyor. */
.lp-section--ink {
  background: var(--ink-950);
  color: var(--text-on-ink);
  border-block: 1px solid var(--ink-800);
}

.lp-section--ink .lp-lead,
.lp-section--ink .lp-tile__text,
.lp-section--ink .lp-body { color: var(--text-on-ink-dim); }

.lp-section--ink .lp-index { color: var(--text-on-ink-dim); }
.lp-section--ink .lp-index::before { background: var(--signal-ink); }
.lp-section--ink .lp-accent { color: var(--signal-ink); }

.lp-section--ink .lp-tile {
  background: var(--ink-900);
  border-color: rgba(255, 255, 255, 0.09);
  box-shadow: none;
}

.lp-section--ink .lp-tile:hover { background: var(--ink-800); border-color: rgba(255, 255, 255, 0.16); }

.lp-head { max-width: 720px; margin-bottom: clamp(36px, 4.5vw, 56px); }

/* ── Bento ────────────────────────────────────────────────────
   Eşit kutulardan oluşan ızgara içeriğin hepsini aynı önemde
   gösteriyor. Bento farklı ağırlıkları farklı boyutlarla söylüyor. */

.lp-bento { display: grid; gap: 12px; grid-template-columns: 1fr; }

.lp-tile {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 24px;
  border-radius: 12px;
  border: 1px solid var(--line-faint);
  background: var(--paper-raised);
  box-shadow: var(--lift-1);
  overflow: hidden;
  transition: border-color 0.22s ease, box-shadow 0.22s ease, transform 0.22s ease;
}

.lp-tile:hover { border-color: var(--line); box-shadow: var(--lift-2); transform: translateY(-2px); }

.lp-tile__icon {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 8px;
  border: 1px solid var(--signal-line);
  background: var(--signal-soft);
  color: var(--signal);
}

.lp-section--ink .lp-tile__icon { color: var(--signal-ink); border-color: rgba(255, 106, 52, 0.3); background: rgba(255, 106, 52, 0.12); }

.lp-tile__text { margin: 0; color: var(--text-dim); font-size: 0.9rem; line-height: 1.62; }
.lp-tile--wide { gap: 16px; }

/* Vurgulu kutu: bir tanesi öne çıkmalı, hepsi değil. */
.lp-tile--feature {
  border-color: var(--signal-line);
  background:
    radial-gradient(130% 110% at 0% 0%, rgba(201, 58, 9, 0.07), transparent 58%),
    var(--paper-raised);
}

.lp-tile__stat { font-size: clamp(2rem, 4vw, 2.9rem); line-height: 1; letter-spacing: -0.045em; font-weight: 680; }

.lp-tile__stat small {
  display: block;
  margin-top: 8px;
  font-size: 0.8rem;
  font-weight: 500;
  letter-spacing: 0;
  color: var(--text-faint);
}

/* ── Süreç ────────────────────────────────────────────────────── */

.lp-process { display: grid; gap: 1px; background: var(--line-faint); border-block: 1px solid var(--line-faint); }

.lp-process__item {
  padding: 28px 24px;
  background: var(--paper);
  display: grid;
  gap: 10px;
  align-content: start;
}

.lp-section--tint .lp-process__item { background: var(--paper-sunken); }
.lp-process__num { color: var(--signal); font-size: 0.78rem; font-weight: 700; letter-spacing: 0.14em; }
.lp-process__text { margin: 0; color: var(--text-dim); font-size: 0.9rem; line-height: 1.62; }

/* ── Carousel ─────────────────────────────────────────────────── */

.lp-carousel { position: relative; }

.lp-carousel__viewport {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(268px, 84%);
  gap: 14px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  padding: 4px 4px 8px;
  margin: -4px -4px -8px;
  scrollbar-width: none;
}

.lp-carousel__viewport::-webkit-scrollbar { display: none; }

.lp-slide {
  scroll-snap-align: start;
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 24px;
  border-radius: 12px;
  border: 1px solid var(--line-faint);
  background: var(--paper-raised);
  box-shadow: var(--lift-2);
}

.lp-slide__label {
  display: inline-flex;
  align-self: flex-start;
  padding: 4px 9px;
  border-radius: 5px;
  border: 1px solid var(--line);
  color: var(--text-faint);
  font-size: 0.7rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.lp-slide__quote { margin: 0; font-size: 1.02rem; line-height: 1.5; letter-spacing: -0.014em; font-weight: 550; }
.lp-slide__meta { margin: 0; color: var(--text-dim); font-size: 0.86rem; line-height: 1.58; }

.lp-slide__bar {
  margin-top: auto;
  height: 3px;
  border-radius: 2px;
  background: linear-gradient(90deg, var(--signal), rgba(201, 58, 9, 0));
}

.lp-carousel__controls { display: flex; gap: 8px; margin-top: 18px; }

.lp-carousel__btn {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: var(--paper-raised);
  color: var(--text);
  cursor: pointer;
  box-shadow: var(--lift-1);
  transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.lp-carousel__btn:hover { border-color: var(--line-strong); box-shadow: var(--lift-2); transform: translateY(-1px); }
.lp-carousel__btn:focus-visible { outline: 2px solid var(--signal); outline-offset: 2px; }

/* ── Bölünmüş yerleşim ────────────────────────────────────────── */

.lp-split { display: grid; gap: clamp(32px, 4vw, 56px); align-items: center; }

/* ── Liste ────────────────────────────────────────────────────── */

.lp-list { margin: 22px 0 0; padding: 0; list-style: none; display: grid; gap: 10px; }

.lp-list li {
  display: grid;
  grid-template-columns: 18px 1fr;
  gap: 10px;
  align-items: start;
  color: var(--text-dim);
  font-size: 0.92rem;
  line-height: 1.55;
}

.lp-list svg { margin-top: 3px; color: var(--signal); }

/* ── Fiyat ────────────────────────────────────────────────────── */

.lp-plans { display: grid; gap: 12px; }

.lp-plan {
  display: flex;
  flex-direction: column;
  padding: 28px 24px;
  border-radius: 12px;
  border: 1px solid var(--line-faint);
  background: var(--paper-raised);
  box-shadow: var(--lift-1);
}

.lp-plan--lead {
  border-color: var(--signal-line);
  background:
    radial-gradient(140% 90% at 50% 0%, rgba(201, 58, 9, 0.07), transparent 60%),
    var(--paper-raised);
  box-shadow: var(--lift-2);
}

.lp-plan__name {
  margin: 0;
  color: var(--text-faint);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.lp-plan__price { margin: 14px 0 0; font-size: 2.3rem; line-height: 1; letter-spacing: -0.045em; font-weight: 680; }

.lp-plan__price span {
  display: block;
  margin-top: 8px;
  font-size: 0.8rem;
  font-weight: 500;
  letter-spacing: 0;
  color: var(--text-faint);
}

.lp-plan__note { margin: 16px 0 0; color: var(--text-dim); font-size: 0.9rem; }
.lp-plan .lp-list { margin-bottom: 26px; }

/* ── Yol haritası ─────────────────────────────────────────────── */

.lp-roadmap { list-style: none; margin: 28px 0 0; padding: 0; display: grid; gap: 1px; background: var(--line-faint); }

.lp-roadmap li {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 16px;
  align-items: start;
  padding: 20px 4px;
  background: var(--paper-sunken);
  color: var(--text-dim);
  font-size: 0.92rem;
  line-height: 1.6;
}

.lp-roadmap strong { color: var(--text); font-weight: 600; }

.lp-roadmap__state {
  padding: 3px 9px;
  border-radius: 5px;
  font-size: 0.7rem;
  font-weight: 640;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  white-space: nowrap;
}

.lp-roadmap__state--now { background: var(--signal-soft); color: var(--signal); border: 1px solid var(--signal-line); }
.lp-roadmap__state--next { background: var(--paper-deep); color: var(--text-faint); border: 1px solid var(--line-faint); }

/* ── SSS ──────────────────────────────────────────────────────── */

.lp-faq { display: grid; gap: 1px; background: var(--line-faint); border-block: 1px solid var(--line-faint); }
.lp-faq__item { background: var(--paper); }

.lp-faq__q {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 20px 4px;
  cursor: pointer;
  list-style: none;
  font-weight: 550;
  font-size: 0.98rem;
  letter-spacing: -0.014em;
  transition: color 0.18s ease;
}

.lp-faq__q::-webkit-details-marker { display: none; }
.lp-faq__q:hover { color: var(--signal); }

.lp-faq__q i { flex: none; position: relative; width: 11px; height: 11px; }

.lp-faq__q i::before,
.lp-faq__q i::after {
  content: "";
  position: absolute;
  inset: 50% 0 auto;
  height: 1.5px;
  background: currentColor;
  transition: transform 0.22s cubic-bezier(0.4, 0, 0.2, 1);
}

.lp-faq__q i::after { transform: rotate(90deg); }
.lp-faq__item[open] .lp-faq__q i::after { transform: rotate(0deg); }

.lp-faq__a {
  margin: 0;
  padding: 0 4px 22px;
  max-width: 68ch;
  color: var(--text-dim);
  font-size: 0.93rem;
  line-height: 1.7;
}

/* ── Kapanış: koyu bant ───────────────────────────────────────── */

.lp-cta {
  position: relative;
  padding-block: clamp(72px, 9vw, 128px);
  text-align: center;
  overflow: hidden;
  background: var(--ink-950);
  color: var(--text-on-ink);
}

.lp-cta__light {
  position: absolute;
  inset: auto 50% -60% auto;
  width: min(900px, 120%);
  aspect-ratio: 1;
  transform: translateX(50%);
  background: radial-gradient(closest-side, rgba(255, 106, 52, 0.2), transparent 70%);
  pointer-events: none;
}

.lp-cta .lp-h2 { margin-inline: auto; }
.lp-cta .lp-lead { margin-inline: auto; color: var(--text-on-ink-dim); }
.lp-cta .lp-hero__actions { justify-content: center; }

.lp-cta .lp-btn--ghost {
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, 0.16);
  color: var(--text-on-ink);
  box-shadow: none;
}

.lp-cta .lp-btn--ghost:hover { background: rgba(255, 255, 255, 0.1); border-color: rgba(255, 255, 255, 0.28); }

/* ── Alt bilgi ────────────────────────────────────────────────── */

.lp-footer { border-top: 1px solid var(--ink-800); background: var(--ink-900); color: var(--text-on-ink); padding-top: 56px; }
.lp-footer__inner { display: grid; gap: 40px; }
.lp-footer .lp-brand { color: var(--text-on-ink); }
.lp-footer__tag { margin: 16px 0 0; max-width: 30ch; color: var(--text-on-ink-dim); font-size: 0.86rem; line-height: 1.6; }
.lp-footer__cols { display: grid; grid-template-columns: repeat(2, 1fr); gap: 32px; }
.lp-footer__col { display: grid; gap: 12px; align-content: start; }

.lp-footer__head {
  color: var(--text-on-ink-dim);
  font-size: 0.71rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.lp-footer__col a { color: var(--text-on-ink-dim); text-decoration: none; font-size: 0.88rem; transition: color 0.18s ease; }
.lp-footer__col a:hover { color: var(--signal-ink); }
.lp-footer__muted { color: var(--text-on-ink-dim); font-size: 0.88rem; }

.lp-footer__bottom {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  justify-content: space-between;
  align-items: center;
  margin-top: 48px;
  padding-block: 22px;
  border-top: 1px solid var(--ink-800);
  color: var(--text-on-ink-dim);
  font-size: 0.8rem;
}

.lp-footer__bottom .lp-footer__muted { max-width: 62ch; font-size: 0.78rem; }
.lp-footer__links { display: flex; gap: 20px; }
.lp-footer__links a { color: var(--text-on-ink-dim); text-decoration: none; }
.lp-footer__links a:hover { color: var(--text-on-ink); }

/* ── Dar ekran menüsü ─────────────────────────────────────────
   Bağlantıları gizleyip yerine hiçbir şey koymamak, dar ekranda
   siteyi tek bir kaydırma şeridine indiriyordu. JavaScript'siz
   açılır menü: <details> zaten klavye ve ekran okuyucuyla çalışıyor. */

.lp-menu { position: relative; }

.lp-menu__toggle {
  display: grid;
  place-items: center;
  gap: 4px;
  width: 36px;
  height: 36px;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: var(--paper-raised);
  cursor: pointer;
  list-style: none;
  box-shadow: var(--lift-1);
  transition: border-color 0.18s ease, box-shadow 0.18s ease;
}

.lp-menu__toggle::-webkit-details-marker { display: none; }
.lp-menu__toggle:hover { border-color: var(--line-strong); box-shadow: var(--lift-2); }
.lp-menu__toggle:focus-visible { outline: 2px solid var(--signal); outline-offset: 2px; }

.lp-menu__toggle i {
  width: 15px;
  height: 1.5px;
  background: var(--text);
  border-radius: 1px;
  transition: transform 0.22s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.18s ease;
}

.lp-menu[open] .lp-menu__toggle i:nth-child(1) { transform: translateY(5.5px) rotate(45deg); }
.lp-menu[open] .lp-menu__toggle i:nth-child(2) { opacity: 0; }
.lp-menu[open] .lp-menu__toggle i:nth-child(3) { transform: translateY(-5.5px) rotate(-45deg); }

.lp-menu__panel {
  position: absolute;
  right: 0;
  top: calc(100% + 12px);
  min-width: 208px;
  display: grid;
  padding: 8px;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: var(--paper-raised);
  box-shadow: var(--lift-3);
  animation: lp-drop 0.18s cubic-bezier(0.4, 0, 0.2, 1);
}

.lp-menu__panel a {
  padding: 10px 12px;
  border-radius: 7px;
  color: var(--text-dim);
  text-decoration: none;
  font-size: 0.92rem;
  transition: background-color 0.15s ease, color 0.15s ease;
}

.lp-menu__panel a:hover { background: var(--paper-sunken); color: var(--text); }

@keyframes lp-drop {
  from { opacity: 0; transform: translateY(-6px); }
  to { opacity: 1; transform: translateY(0); }
}

/* ── Kaydırmayla beliriş ──────────────────────────────────────
   Görüş alanına giren bölüm yumuşakça yerine oturuyor. Destek
   yoksa hiçbir şey olmuyor — içerik zaten yerinde. */

@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .lp-reveal {
      animation: lp-rise linear both;
      animation-timeline: view();
      animation-range: entry 0% entry 42%;
    }
  }
}

@keyframes lp-rise {
  from { opacity: 0; transform: translateY(22px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
  .lp-marquee__track { animation: none; }
  .lp-menu__panel { animation: none; }
  .lp-btn:hover,
  .lp-tile:hover,
  .lp-carousel__btn:hover { transform: none; }
}

/* ── Duyarlılık ───────────────────────────────────────────────── */

@media (min-width: 680px) {
  .lp-bento { grid-template-columns: repeat(2, 1fr); }
  .lp-process { grid-template-columns: repeat(2, 1fr); }
  .lp-plans { grid-template-columns: repeat(3, 1fr); }
  .lp-footer__cols { grid-template-columns: repeat(3, 1fr); }
  .lp-carousel__viewport { grid-auto-columns: minmax(300px, 46%); }
}

@media (min-width: 1000px) {
  .lp-nav__links { display: flex; }
  .lp-menu { display: none; }
  .lp-hero__inner { grid-template-columns: 1.02fr 0.98fr; }
  .lp-bento { grid-template-columns: repeat(6, 1fr); }
  .lp-tile--wide { grid-column: span 4; }
  .lp-tile--half { grid-column: span 2; }
  .lp-tile--third { grid-column: span 3; }
  .lp-process { grid-template-columns: repeat(4, 1fr); }
  .lp-split { grid-template-columns: 1fr 1fr; }
  .lp-split--flip .lp-split__text { order: 2; }
  .lp-split--flip .lp-split__visual { order: 1; }
  .lp-carousel__viewport { grid-auto-columns: minmax(320px, 32%); }
  .lp-footer__inner { grid-template-columns: 1fr 1.6fr; }
}

/* ═══════════════════════════════════════════════════════════════
   Hukuki sayfalar
   ═══════════════════════════════════════════════════════════════ */

.lp-legal__head {
  padding-block: clamp(48px, 6vw, 80px) 32px;
  border-bottom: 1px solid var(--line-faint);
  background: var(--paper-sunken);
}

.lp-legal__title { margin: 0; font-size: clamp(1.8rem, 4vw, 2.6rem); letter-spacing: -0.032em; font-weight: 640; }
.lp-legal__meta { margin: 12px 0 0; color: var(--text-faint); font-size: 0.85rem; }
.lp-legal { padding-block: 48px 72px; }
.lp-legal__intro { margin: 0 0 40px; font-size: 1.04rem; line-height: 1.74; color: var(--text-dim); }
.lp-legal h2 { margin: 40px 0 14px; font-size: 1.2rem; font-weight: 620; letter-spacing: -0.018em; }
.lp-legal h3 { margin: 24px 0 10px; font-size: 1rem; font-weight: 600; }
.lp-legal p { margin: 0 0 14px; color: var(--text-dim); line-height: 1.74; }
.lp-legal ul, .lp-legal ol { margin: 0 0 18px; padding-left: 20px; color: var(--text-dim); line-height: 1.74; display: grid; gap: 8px; }
.lp-legal li::marker { color: var(--signal); }
.lp-legal strong { color: var(--text); font-weight: 600; }
.lp-legal a { color: var(--signal); text-decoration: underline; text-underline-offset: 3px; }

.lp-legal code {
  padding: 2px 6px;
  border-radius: 4px;
  background: var(--paper-sunken);
  border: 1px solid var(--line-faint);
  font-size: 0.88em;
}

.lp-status {
  margin-bottom: 44px;
  padding: 26px;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: var(--paper-raised);
  box-shadow: var(--lift-2);
}

.lp-status__badge { display: inline-block; padding: 4px 10px; border-radius: 5px; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.lp-status__badge--done { background: rgba(15, 122, 83, 0.1); color: var(--ok); border: 1px solid rgba(15, 122, 83, 0.28); }
.lp-status__badge--unknown { background: var(--signal-soft); color: var(--signal); border: 1px solid var(--signal-line); }
.lp-status__title { margin: 16px 0 18px; font-size: 1.26rem; font-weight: 620; letter-spacing: -0.02em; }
.lp-status__facts { display: grid; grid-template-columns: max-content 1fr; gap: 10px 26px; margin: 0 0 18px; }
.lp-status__facts dt { color: var(--text-faint); font-size: 0.78rem; letter-spacing: 0.06em; text-transform: uppercase; }
.lp-status__facts dd { margin: 0; color: var(--text); font-size: 0.92rem; }
.lp-status__note { margin: 0; padding-top: 16px; border-top: 1px solid var(--line-faint); color: var(--text-faint); font-size: 0.86rem; line-height: 1.65; }

@media (max-width: 560px) {
  .lp-status__facts { grid-template-columns: 1fr; gap: 2px 12px; }
}