/* ============================================================
   rakescan.com v2 — açık editoryal sistem
   Söz, görsel ve kod tamamen özgün. v1 (koyu) arşivde.
   Not: v1 değişken/sınıf adları KORUNUR (yasal + /pro/ + /vs/
   sayfaları HTML değişmeden bu tema ile açık moda geçer).
   ============================================================ */

:root {
  /* zemin */
  --bg: #ffffff;
  --bg2: #fafafa;
  --surface: #ffffff;
  --surface2: #ffffff;
  --line: #e3e9f2;
  --line-soft: #edf1f7;
  /* metin (≥4.5:1 beyazda) */
  --ink: #0b1524;
  --body: #3d4c60;
  --mut: #64748b;
  /* vurgu */
  --buy: #10B981;          /* buton zemini (koyu metinle) */
  --buy-bright: #0B7A55;   /* açık zeminde LİNK/metin yeşili */
  --buy-deep: #0B7A55;
  --buy-dim: rgba(16, 185, 129, .10);
  --amber: #B45309;
  --amber-dim: rgba(245, 158, 11, .14);
  --rej: #D92D20;
  --rej-dim: rgba(217, 45, 32, .08);
  --badge-y: #F7BE00;
  /* koyu manifesto bölümü (v1 mirası) */
  --navy: #0A1628;
  --navy2: #0D1B33;
  --navy-line: #1E3252;
  --navy-body: #C4D2E4;
  --navy-mut: #8CA2BD;
  /* tipografi: sistem yığını + tek serif dokunuş */
  --font-body: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-serif: "EB Garamond", Georgia, serif;
  --font-hand: "Patrick Hand", "Segoe Print", cursive;
  --font-mono: "Fragment Mono", "Consolas", monospace;
  --z-nav: 40;
  --ease: cubic-bezier(.16, 1, .3, 1);
  /* kart gölgesi (katmanlı, yumuşak) */
  --shadow-card: 0 1px 2px rgba(11, 21, 36, .06), 0 12px 32px -12px rgba(11, 21, 36, .18);
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; scroll-padding-top: 84px; }

body {
  margin: 0;
  background: var(--bg);
  color: var(--body);
  font-family: var(--font-body);
  font-size: 1.0625rem;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

img { max-width: 100%; height: auto; }

a { color: var(--buy-bright); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--ink); }

:focus-visible { outline: 2px solid var(--buy-bright); outline-offset: 3px; border-radius: 3px; }

::selection { background: var(--buy); color: #04241a; }

/* Headings previously inherited the body's 1.65, so a 34px h3 got 56px of leading.
   Only .doc h1 ever declared its own; that explicit 1.1 still wins. */
h1, h2, h3 { color: var(--ink); text-wrap: balance; margin: 0; line-height: 1.15; }
p { text-wrap: pretty; }

.wrap { max-width: 1160px; margin: 0 auto; padding: 0 clamp(20px, 4vw, 48px); }

/* ---------- header ---------- */

.site-head {
  position: sticky; top: 0; z-index: var(--z-nav);
  background: rgba(255, 255, 255, .86);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--line-soft);
}
.site-head .wrap { display: flex; align-items: center; gap: 26px; height: 66px; }

.wordmark {
  font-family: var(--font-body);
  font-weight: 800;
  font-size: 1.32rem;
  letter-spacing: -.02em;
  color: var(--ink);
  text-decoration: none;
  line-height: 1;
  /* marka kilidi ASLA sarmaz (4. tur blocker: 390'da ikon üstte, "RakeScan" altta kalıyordu) */
  white-space: nowrap;
  flex-shrink: 0;
}
.wordmark em { font-style: normal; color: var(--buy-bright); }
/* uygulama markası: "bu bir app" işareti. DİKKAT: .wordmark flex OLAMAZ —
   markasız sayfalarda "Rake" ve <em>Scan</em> ayrı flex öğesi olup ayrılır. */
.wm-mark { width: 26px; height: 26px; border-radius: 7px; vertical-align: -6px; margin-right: 9px; }

.site-nav { display: flex; gap: 24px; margin-left: auto; align-items: center; }
.site-nav a {
  font-size: .92rem;
  font-weight: 500;
  color: var(--body);
  text-decoration: none;
  white-space: nowrap;
}
.site-nav a:hover { color: var(--ink); }

.btn {
  display: inline-block;
  font-family: var(--font-body);
  font-weight: 600;
  font-size: .98rem;
  color: #04241a;
  background: var(--buy);
  border: 0;
  border-radius: 999px;
  padding: 12px 22px;
  text-decoration: none;
  cursor: pointer;
  transition: transform .18s var(--ease), background .18s var(--ease), box-shadow .18s var(--ease);
  box-shadow: 0 1px 2px rgba(11, 21, 36, .12);
}
.btn:hover { background: #0ea371; color: #04241a; transform: translateY(-1px); box-shadow: 0 6px 16px -6px rgba(16, 185, 129, .55); }
.btn:active { transform: translateY(0); }
.site-nav a.btn, .site-nav a.btn:hover { color: #04241a; }

.nav-toggle { display: none; }
.head-cta { display: none; }

/* scroll'da yüzen pill'e dönüşen üst bar (masaüstü) */
@media (min-width: 721px) {
  .site-head { transition: background .3s var(--ease), border-color .3s var(--ease); }
  .site-head .wrap {
    transition: max-width .35s var(--ease), height .35s var(--ease),
                margin-top .35s var(--ease), border-radius .35s var(--ease),
                box-shadow .35s var(--ease), background .35s var(--ease);
    border: 1px solid transparent;
  }
  .site-head.scrolled { background: transparent; border-bottom-color: transparent; backdrop-filter: none; }
  .site-head.scrolled .wrap {
    max-width: 900px; height: 54px; margin-top: 10px;
    background: rgba(255, 255, 255, .93);
    backdrop-filter: blur(14px);
    border-color: var(--line);
    border-radius: 999px;
    box-shadow: 0 12px 32px -14px rgba(11, 21, 36, .25);
    padding-left: 24px; padding-right: 10px;
  }
}

/* ---------- hero (ortalanmış tez + foto + yüzen kartlar) ---------- */

.hero { position: relative; overflow: hidden; text-align: center; padding-bottom: 0; }
/* fold ekonomisi: ürün fotoğrafı ilk ekrana girsin (3. tur bulgusu) */
.hero .wrap { padding-top: clamp(24px, 3.4vh, 46px); padding-bottom: 0; }

.hero h1 {
  font-size: clamp(2.5rem, 5.6vw, 4.05rem);
  font-weight: 700;
  letter-spacing: -.022em;
  line-height: 1.04;
  max-width: 21ch;
  margin: 0 auto 20px;
}
.hero-sub {
  max-width: 62ch;
  margin: 0 auto 26px;
  font-size: 1.13rem;
  color: var(--body);
}
.hero-sub strong { color: var(--ink); font-weight: 600; }

.hero-badges {
  display: flex; justify-content: center; align-items: flex-start; gap: clamp(28px, 4vw, 54px); flex-wrap: wrap;
  margin: 2px 0 8px;
}
/* laurel-stil gerçek-stat kilidi: kutu yok, kanıt önde */
.hbadge { display: block; text-align: center; }
.hbadge .hb-ic { display: block; margin: 0 auto 5px; color: var(--buy-deep); opacity: .9; }
.hbadge .t {
  display: block;
  font-size: 1.04rem; font-weight: 800; color: var(--ink);
  letter-spacing: -.01em; line-height: 1.3;
}
.hbadge .s {
  display: block;
  font-family: var(--font-mono);
  font-size: .72rem; color: var(--mut); line-height: 1.5;
  letter-spacing: .02em;
}
.hbadge .s::before { content: "❮  "; color: #b7c3d3; }
.hbadge .s::after { content: "  ❯"; color: #b7c3d3; }

/* foto sahnesi + yüzen verdikt bildirimleri */
.hero-stage {
  position: relative;
  max-width: 920px;
  margin: 14px auto 0;
}
.hero-stage img.hero-phone {
  display: block;
  position: relative; z-index: 1;
  width: min(560px, 88vw);
  margin: 0 auto;
}

.hnote {
  --note-o: 1;
  --note-s: 1;
  position: absolute;
  z-index: 2;
  width: 300px;
  max-width: 42vw;
  text-align: left;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 14px;
  box-shadow: var(--shadow-card);
  padding: 12px 14px;
  line-height: 1.35;
  display: flex; gap: 10px; align-items: flex-start;
}
/* fail open (see reveal block): hidden only while JS is actually running */
html.js .hnote {
  opacity: 0;
  transform: translateY(10px) scale(.97);
}
html.js .hnote.show {
  opacity: var(--note-o); transform: scale(var(--note-s));
  transition: opacity .5s var(--ease), transform .5s var(--ease);
}
/* alan derinliği: 3 kart net, 3 kart soluk ve hafif küçük — odak telefonda.
   DİKKAT: soluk kartlar fotoğrafın ÜSTÜNDE kalır (z 2) — opak foto dikdörtgeni
   arkada kalan kartı kelime ortasından keser (2. tur denetim bulgusu). */
/* Recession is carried by scale + a lighter border, NOT by alpha: at .42 the text
   measured 2.74:1 and 1.74:1 on white, well under AA. No alpha value passes here. */
.hnote.dim { --note-o: 1; --note-s: .95; box-shadow: 0 1px 2px rgba(11, 21, 36, .05); border-color: var(--line-soft, #eef2f7); }
.hnote.dim .tt { color: var(--body); }
.hnote .dot {
  flex: none; width: 34px; height: 34px; border-radius: 9px;
  display: grid; place-items: center;
  font-size: 1.05rem;
}
.hnote .dot.buy { background: var(--buy-dim); }
.hnote .dot.rej { background: var(--rej-dim); }
.hnote .dot.amb { background: var(--amber-dim); }
.hnote .dot.inf { background: #eef2f8; }
/* iki-satır sözleşmesi: kalın başlık + tek gri satır, sarma yok */
.hnote .txt { min-width: 0; flex: 1; }
.hnote .tt {
  display: block; font-size: .84rem; font-weight: 700; color: var(--ink);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.hnote .ts {
  display: block; font-size: .78rem; color: var(--mut);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.hnote .ago { margin-left: auto; flex: none; font-size: .68rem; color: var(--mut); }

/* eşit merdiven: sol-sağ-sol-sağ, fotoğrafın ten bölgesine binmeden */
.hnote.p1 { left: 0; top: 6%; }
.hnote.p2 { right: 0; top: 18%; }
.hnote.p3 { left: 0; top: 34%; }
.hnote.p4 { right: 0; top: 46%; }
.hnote.p5 { left: 0; top: 62%; }
.hnote.p6 { right: 0; top: 74%; }

/* el yazısı kenar notu */
.hand-note {
  font-family: var(--font-hand);
  font-size: 1.18rem;
  color: var(--buy-bright);
  transform: rotate(-3deg);
  display: inline-block;
}

/* ---------- journey nav şeridi (yolculuk zaman çizelgesi) ---------- */

.journey {
  border-top: 1px solid var(--line-soft);
  border-bottom: 1px solid var(--line-soft);
  background: var(--bg);
  margin-top: -6px;
}
.journey .wrap {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  padding-top: 16px; padding-bottom: 16px;
}
.jitem {
  display: flex; align-items: center; gap: 12px;
  text-decoration: none;
  border-radius: 14px;
  padding: 10px 12px;
  transition: background .18s var(--ease);
}
.jitem:hover { background: var(--bg2); }
/* scroll-spy aktif durumu: yolculukta neredesin */
.jitem.active { background: rgba(16, 185, 129, .07); box-shadow: inset 0 0 0 1px rgba(16, 185, 129, .35); }
.jitem.active .jt { color: var(--buy-deep); }
.jthumb {
  flex: none; width: 56px; height: 56px; border-radius: 12px;
  border: 1px solid var(--line);
  background: var(--navy);
  position: relative; overflow: hidden;
}
.jitem .jt { font-size: .95rem; font-weight: 700; color: var(--ink); line-height: 1.2; }
.jitem .js { font-size: .78rem; color: var(--mut); line-height: 1.3; }

/* mini animasyonlu thumb'lar */
.jthumb .jic {
  position: absolute; inset: 0; margin: auto; width: 26px; height: 26px;
  fill: none; stroke: var(--buy); stroke-width: 1.6;
  stroke-linecap: round; stroke-linejoin: round;
}
.jthumb .pin {
  position: absolute; left: 50%; top: 43%; width: 6px; height: 6px;
  margin: -3px 0 0 -3px; border-radius: 50%; background: var(--buy);
}
.jthumb .pin::after {
  content: ""; position: absolute; inset: -8px; border-radius: 50%;
  border: 2px solid rgba(16, 185, 129, .5);
  animation: ping 1.8s var(--ease) infinite;
}
@keyframes ping { 0% { transform: scale(.4); opacity: 1; } 100% { transform: scale(1.5); opacity: 0; } }
.jthumb .scanline {
  position: absolute; left: 8px; right: 8px; height: 2px; top: 10px;
  background: linear-gradient(90deg, transparent, #2DD4A7, transparent);
  animation: jscan 2.2s var(--ease) infinite; /* transform-only (compositor) */
}
@keyframes jscan { 0% { transform: translateY(0); } 50% { transform: translateY(34px); } 100% { transform: translateY(0); } }
.jthumb .bars { position: absolute; left: 10px; right: 10px; bottom: 8px; display: flex; gap: 3px; align-items: flex-end; height: 26px; }
.jthumb .bars i { flex: 1; background: #2DD4A7; border-radius: 2px 2px 0 0; animation: jbar 2.6s var(--ease) infinite; }
.jthumb .bars i:nth-child(2) { animation-delay: .3s; height: 60%; }
.jthumb .bars i:nth-child(3) { animation-delay: .6s; height: 85%; }
.jthumb .bars i:nth-child(1) { height: 40%; }
@keyframes jbar { 0%, 100% { transform: scaleY(.6); } 50% { transform: scaleY(1); } }
.jthumb .cash {
  position: absolute; inset: 0; display: grid; place-items: center;
  color: #2DD4A7; font: 700 15px/1 var(--font-mono);
}
.jthumb .cash::after { content: "$"; animation: jcash 2s var(--ease) infinite; font-size: 22px; }
@keyframes jcash { 0%, 100% { transform: translateY(0); opacity: 1; } 50% { transform: translateY(-5px); opacity: .75; } }

/* ---------- bölüm iskeleti ---------- */

section { padding: clamp(60px, 9vh, 110px) 0; }
section.alt { background: var(--bg2); }

.sec-h {
  font-size: clamp(1.9rem, 4vw, 3.3rem);
  font-weight: 700;
  letter-spacing: -.02em;
  line-height: 1.08;
  margin: 0 0 16px;
}
.sec-p { max-width: 64ch; font-size: 1.06rem; margin: 0 0 14px; }
.sec-p strong, .sec-p b { color: var(--ink); font-weight: 600; }
.center { text-align: center; }
.center .sec-p { margin-left: auto; margin-right: auto; }

/* ---------- serif alıntı karuseli ---------- */

.quotes { text-align: center; padding: clamp(44px, 7vh, 72px) 0; }
.quotes .q {
  font-family: var(--font-serif);
  font-size: clamp(1.4rem, 2.6vw, 1.9rem);
  font-weight: 600;
  line-height: 1.25;
  color: var(--ink);
  max-width: 34ch;
  margin: 0 auto;
  min-height: 3.2em; /* CSS tabanı; JS fonts.ready sonrası en uzun alıntıya kilitler */
  display: flex; align-items: center; justify-content: center;
}
@media (max-width: 720px) { .quotes .q { min-height: 4.6em; } }
.quotes .q-src { font-size: .8rem; color: var(--mut); margin-top: 12px; font-family: var(--font-mono); }
.quotes .dots { display: flex; gap: 8px; justify-content: center; margin-top: 16px; }
.quotes .dots i { width: 7px; height: 7px; border-radius: 50%; background: var(--line); }
.quotes .dots i.on { background: var(--buy-bright); }

/* ---------- koyu manifesto ---------- */

.manifesto { background: var(--navy); color: var(--navy-body); }
.manifesto .sec-h { color: #fff; max-width: 24ch; }
.manifesto .sec-p { color: var(--navy-body); }
.manifesto .sec-p b { color: #fff; }

.mblock {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
  gap: clamp(28px, 5vw, 64px);
  align-items: center;
  padding: clamp(30px, 5vh, 52px) 0;
}
.mblock.flip { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); }
.mblock.flip .mcopy { order: 2; }
.mblock h3 { color: #fff; font-size: clamp(1.35rem, 2.4vw, 1.8rem); font-weight: 700; letter-spacing: -.01em; margin: 0 0 10px; }
.mblock p { margin: 0 0 10px; font-size: 1rem; }
.mstat { font-family: var(--font-mono); color: #2DD4A7; font-size: .85rem; }
/* mono=ölçülmüş-veri sözleşmesi (4. tur bulgusu): retorik satırlar .mstat kostümü
   giyemez — onlar bu italik gövde register'ını kullanır */
.mquip { font-style: italic; color: var(--navy-body); font-size: .98rem; }
.mwide .mquip, .mblock .mquip { margin-top: 14px; }

/* manifesto görsel kartları (koyu app-kartı yeniden inşaları) */
.mcard {
  background: var(--navy2);
  border: 1px solid var(--navy-line);
  border-radius: 16px;
  padding: 18px;
  font-family: var(--font-mono);
  box-shadow: 0 30px 80px -40px rgba(0, 0, 0, .8);
}
.mcard .row { display: flex; justify-content: space-between; gap: 10px; padding: 7px 0; border-bottom: 1px solid var(--navy-line); font-size: .82rem; color: var(--navy-body); }
.mcard .row:last-child { border-bottom: 0; }
.mcard .row b { color: #fff; font-weight: 600; }
.mcard .ok { color: #2DD4A7; }
.mcard .bad { color: #F4506B; }
.mcard .warn { color: #F59E0B; }
.mcard .head { font-size: .74rem; letter-spacing: .08em; color: var(--navy-mut); text-transform: uppercase; margin-bottom: 8px; }

/* ---------- bildirim üçlüsü (Scanned→Offered→Paid) ---------- */

.trio { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 30px; }
.tcard {
  background: #fff; border: 1px solid var(--line); border-radius: 14px;
  box-shadow: var(--shadow-card);
  padding: 14px 16px;
  text-align: left;
}
.tcard .k { font-family: var(--font-mono); font-size: .7rem; letter-spacing: .1em; color: var(--mut); text-transform: uppercase; }
.tcard .t { font-size: .95rem; font-weight: 700; color: var(--ink); margin-top: 5px; }
.tcard .s { font-size: .84rem; color: var(--body); margin-top: 3px; }
.tcard.paid { border-color: rgba(16, 185, 129, .45); background: linear-gradient(180deg, #fff, #f2fbf7); }

/* ---------- ledger istatistik kartları ---------- */

.ledger { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-top: 30px; }
.lcard {
  background: #fff; border: 1px solid var(--line); border-radius: 16px;
  padding: 18px;
  box-shadow: var(--shadow-card);
}
.lcard .n { font-family: var(--font-mono); font-size: 1.5rem; color: var(--ink); font-weight: 600; letter-spacing: -.01em; }
.lcard .l { font-size: .82rem; color: var(--mut); margin-top: 4px; }
.lcard .h { font-family: var(--font-hand); color: var(--buy-bright); font-size: 1.05rem; margin-top: 8px; transform: rotate(-2deg); }

/* ---------- sale finder ---------- */

.finder-grid {
  display: grid;
  grid-template-columns: minmax(0, 6fr) minmax(0, 5fr);
  gap: clamp(28px, 5vw, 64px);
  align-items: center;
  text-align: left;
}
.chip-row { display: flex; flex-wrap: wrap; gap: 10px; margin: 20px 0 6px; }
.chip {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--font-mono);
  font-size: .8rem;
  color: var(--ink);
  border: 1px solid var(--line);
  background: #fff;
  border-radius: 999px;
  padding: 8px 15px;
}
/* tek ikon ailesi (emoji yok): 1.6px çizgi, zümrüt */
.chip svg {
  flex: none; width: 17px; height: 17px;
  fill: none; stroke: var(--buy-deep); stroke-width: 1.6;
  stroke-linecap: round; stroke-linejoin: round;
}
.chip b { color: var(--buy-bright); font-weight: 500; }
.venue-strip { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.venue-strip span {
  font-family: var(--font-mono); font-size: .72rem; letter-spacing: .04em;
  color: var(--mut); border: 1px solid var(--line-soft); background: var(--bg2);
  border-radius: 7px; padding: 5px 9px;
}
.finder-src { font-size: .92rem; color: var(--mut); margin-top: 16px; max-width: 58ch; line-height: 1.65; }

.phone {
  border: 1px solid var(--line);
  border-radius: 26px;
  padding: 10px;
  background: #fff;
  box-shadow: var(--shadow-card);
  max-width: 340px;
}
.phone img, .phone video { border-radius: 18px; display: block; width: 100%; height: auto; }
.phone-caption { font-family: var(--font-mono); font-size: .7rem; color: var(--mut); text-align: center; margin-top: 12px; }
/* v2.5 — Sale Finder artık iki kare taşıyor: harita BİRİNCİL (manşetin vaat
   ettiği görünüm), liste görünümü İKİNCİL. Hiyerarşi boyutla kuruluyor;
   ikisi de gerçek capture, ikisi de kendi altyazısını taşıyor. */
.phone.secondary { max-width: 244px; margin-top: 26px; }
.phone.secondary + .phone-caption { max-width: 244px; }
/* Medya sütunu artık metnin ~2,5 katı yükseklikte; `center` hizalama metni
   dikeyde ortalayıp sol üstte kocaman bir boşluk bırakıyordu. Yalnız ana
   sayfadaki bölüm (#before) üstten hizalanır — /sale-finder/ tek telefonla
   dengeli olduğu için oradaki ortalama korunur. */
#before .finder-grid { align-items: start; }

/* ---------- mini-grid (seat + privacy) ---------- */

.mini2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; max-width: 860px; margin: 26px auto 0; }
.mini2 .mg {
  background: #fff; border: 1px solid var(--line); border-radius: 16px;
  padding: 22px; text-align: left; box-shadow: var(--shadow-card);
}
.mini2 h3 { font-size: 1.1rem; margin: 0 0 6px; }
.mini2 p { margin: 0; font-size: .95rem; }

/* ---------- gerçek tarama duvarı (masonry) ---------- */

.wall { columns: 3 300px; column-gap: 16px; margin-top: 30px; }
.wcard {
  break-inside: avoid;
  background: #fff; border: 1px solid var(--line); border-radius: 14px;
  box-shadow: var(--shadow-card);
  padding: 16px;
  margin: 0 0 16px;
  text-align: left;
  position: relative;
}
.wcard .wtag {
  font-family: var(--font-mono); font-size: .68rem; letter-spacing: .08em;
  padding: 4px 9px; border-radius: 6px; display: inline-block;
}
.wcard .wtag.buy { color: var(--buy-bright); background: var(--buy-dim); }
.wcard .wtag.rej { color: #B42318; background: var(--rej-dim); } /* 4.28→AA üstü */
.wcard .wtag.amb { color: var(--amber); background: var(--amber-dim); }
.wcard .wt { font-size: .95rem; font-weight: 700; color: var(--ink); margin-top: 8px; }
.wcard .ws { font-family: var(--font-mono); font-size: .78rem; color: var(--mut); margin-top: 4px; line-height: 1.6; }
.wcard .wh { font-family: var(--font-hand); font-size: 1.15rem; color: var(--buy-bright); margin-top: 8px; transform: rotate(-2deg); }
.wcard .wh.r { color: var(--rej); transform: rotate(1.5deg); }
/* foto sırtlı duvar kartı (basement) — metin okunurluğu overlay ile */
.wcard.photo { border-color: var(--navy-line); overflow: hidden; }
.wcard.photo::before { content: ""; position: absolute; inset: 0; background: var(--photo) center / cover no-repeat; }
.wcard.photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10, 22, 40, .5), rgba(10, 22, 40, .88) 75%); }
.wcard.photo > * { position: relative; z-index: 1; }
.wcard.photo .wt { color: #fff; }
.wcard.photo .ws { color: var(--navy-body); }
.wcard.photo .wh { color: #7CE3B8; }
/* gerçek ekran görüntüsü kartı (duvarda ürünün kendisi) */
.wcard.shotcard { padding: 0; overflow: hidden; background: var(--navy2); border-color: var(--navy-line); }
.wcard.shotcard img { display: block; width: 100%; height: auto; }
.wcard.shotcard .cap { font-family: var(--font-mono); font-size: .68rem; color: var(--navy-mut); padding: 10px 14px; }

/* ---------- CTA bandı ---------- */

.cta-band { text-align: center; background: var(--bg2); }
.cta-band .sec-h { max-width: 18ch; margin-left: auto; margin-right: auto; }

/* ---------- waitlist (v1'den; renkler tema değişkeniyle döndü) ---------- */

/* Capture panel for entry pages. The /vs/, /guides/ and feature pages are where search
   and shared links land; before this they could only bounce the reader to an 11,000px
   homepage to find the one email field on the site. */
.sub-cta {
  max-width: 720px; margin: 56px auto 4px;
  padding: 34px clamp(20px, 4vw, 38px);
  text-align: center; background: var(--bg2);
  border: 1px solid var(--line); border-radius: 20px;
}
.sub-cta h2 { font-size: clamp(1.45rem, 3.2vw, 2rem); letter-spacing: -.015em; margin: 0 0 8px; }
.sub-cta > p { color: var(--body); max-width: 46ch; margin: 0 auto 20px; }

.waitlist { max-width: 520px; margin: 0 auto; }
.waitlist-row { display: flex; gap: 10px; }
.waitlist input[type="email"] {
  flex: 1; min-width: 0;
  font-family: var(--font-body);
  font-size: 1rem;
  color: var(--ink);
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 13px 20px;
  box-shadow: inset 0 1px 2px rgba(11, 21, 36, .04);
}
.waitlist input[type="email"]::placeholder { color: var(--mut); opacity: 1; }
.waitlist input[type="email"]:focus { outline: 2px solid var(--buy-bright); outline-offset: 0; border-color: transparent; }
.waitlist .hp { position: absolute; left: -5000px; width: 1px; height: 1px; overflow: hidden; }
.waitlist-note { font-size: .82rem; color: var(--mut); margin-top: 12px; }
.waitlist-done {
  display: none;
  border: 1px solid rgba(16, 185, 129, .5); background: var(--buy-dim);
  border-radius: 12px; padding: 14px 18px; color: var(--ink); text-align: left;
}
.waitlist-fallback {
  display: none;
  border: 1px solid #f0c46a; background: #fdf6e7;
  border-radius: 12px; padding: 14px 18px; color: var(--ink); margin-top: 12px; text-align: left;
}
.waitlist.is-done .waitlist-row, .waitlist.is-done .waitlist-note { display: none; }
.waitlist.is-done .waitlist-done { display: block; }
.waitlist.is-fallback .waitlist-fallback { display: block; }

/* ---------- footer (4 sütun) ---------- */

.site-foot {
  border-top: 1px solid var(--line-soft);
  background: var(--bg);
  padding: 52px 0 44px;
  font-size: .92rem;
}
.foot-cols {
  display: grid;
  grid-template-columns: 2fr repeat(4, minmax(0, 1fr));
  gap: 28px;
}
.foot-brand p { color: var(--mut); margin: 10px 0 0; max-width: 30ch; font-size: .86rem; }
.foot-cols h3 {
  font-size: .78rem; letter-spacing: .06em; text-transform: uppercase;
  color: var(--mut); margin: 0 0 8px; font-weight: 700;
}
.foot-cols ul { list-style: none; margin: 0; padding: 0; }
.foot-cols li { margin: 0; }
.foot-cols a {
  color: var(--body); text-decoration: none; font-size: .9rem;
  display: inline-block; padding: 10px 0; line-height: 1.4; /* hedef ≥36px (review High) */
}
.foot-cols a:hover { color: var(--ink); text-decoration: underline; }
.foot-legal {
  display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap;
  border-top: 1px solid var(--line-soft);
  margin-top: 36px; padding-top: 20px;
  font-size: .8rem; color: var(--mut);
}
/* v1 uyumluluğu (eski sayfalar .foot-grid/.foot-nav kullanıyor) */
.foot-grid { display: flex; flex-wrap: wrap; gap: 24px; align-items: flex-start; justify-content: space-between; }
.foot-nav { display: flex; gap: 6px 24px; flex-wrap: wrap; }
.foot-nav a { font-size: .88rem; color: var(--body); text-decoration: none; padding: 9px 0; display: inline-block; }
.foot-nav a:hover { color: var(--ink); text-decoration: underline; }
.foot-grid .foot-legal { width: 100%; }

/* ---------- doc sayfaları (yasal/support/pro/vs — v1 sınıf adları) ---------- */

.doc { max-width: 720px; margin: 0 auto; padding: clamp(40px, 7vh, 72px) clamp(20px, 4vw, 48px) 96px; }
.doc h1 { font-size: clamp(2rem, 4.4vw, 2.9rem); font-weight: 700; letter-spacing: -.02em; line-height: 1.1; margin: 0 0 6px; }
.doc .date { font-family: var(--font-mono); font-size: .78rem; color: var(--mut); margin-bottom: 34px; }
.doc h2 { font-size: 1.35rem; font-weight: 700; letter-spacing: -.01em; margin: 38px 0 10px; }
.doc ul, .doc ol { padding-left: 24px; }
.doc li { margin: 7px 0; }

/* Real captures inside long-form pages. Every guide and /vs/ page shipped with no image
   at all except the 32px favicon — the site owned four real screen captures and spent
   all of them on the homepage. Each page below gets the capture that shows ITS subject. */
.gfig { margin: 30px 0; }
.gfig img {
  display: block; width: 100%; height: auto;
  border: 1px solid var(--line); border-radius: 14px;
  background: var(--bg2);
}
.gfig img.tall { max-width: 300px; margin-inline: auto; }
.gfig figcaption {
  margin-top: 10px; text-align: center;
  font-family: var(--font-mono); font-size: .68rem; line-height: 1.5;
  letter-spacing: .03em; color: var(--mut);
}
.doc .card {
  background: #fff; border: 1px solid var(--line); border-radius: 14px;
  padding: 20px 24px; margin: 20px 0; box-shadow: var(--shadow-card);
}
.doc .btn { margin-top: 8px; }
.site-nav.doc-nav { display: flex; position: static; flex-direction: row; align-items: center; gap: 18px; padding: 0; border: 0; background: none; margin-left: auto; flex-wrap: wrap; justify-content: flex-end; row-gap: 6px; }
/* :not(.btn) — design-review blocker: bu kural .btn'in padding'ini eziyordu */
.site-nav.doc-nav a:not(.btn) { padding: 0; font-size: .88rem; }

/* ---------- FAQ (v1 sınıfları) ---------- */

.faq { max-width: 780px; margin: 0 auto; text-align: left; }
.faq details { border-top: 1px solid var(--line-soft); }
.faq details:last-child { border-bottom: 1px solid var(--line-soft); }
.faq summary {
  cursor: pointer; list-style: none;
  display: flex; justify-content: space-between; align-items: baseline; gap: 18px;
  padding: 19px 2px;
  font-weight: 600; font-size: 1.05rem; color: var(--ink);
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; font-family: var(--font-mono); color: var(--buy-bright); flex: none; }
.faq details[open] summary::after { content: "–"; }
.faq .a { padding: 0 2px 22px; max-width: 66ch; }
.faq .a p { margin: 0 0 10px; }

/* ---------- karşılaştırma tablosu (/vs/*, v1 sınıfları) ---------- */

.cmp { width: 100%; border-collapse: collapse; font-size: .95rem; margin: 26px 0; }
.cmp th, .cmp td { text-align: left; padding: 13px 14px; border-top: 1px solid var(--line-soft); vertical-align: top; }
.cmp tr:last-child th, .cmp tr:last-child td { border-bottom: 1px solid var(--line-soft); }
.cmp thead th { font-family: var(--font-mono); font-weight: 500; font-size: .72rem; letter-spacing: .06em; text-transform: uppercase; color: var(--mut); border-top: 0; }
.cmp thead th.us { color: var(--buy-bright); }
.cmp tbody th { font-family: var(--font-mono); font-weight: 500; font-size: .74rem; letter-spacing: .04em; text-transform: uppercase; color: var(--mut); width: 170px; }
.cmp td { color: var(--body); }
.cmp td b { color: var(--ink); font-weight: 600; }
.cmp td.us { background: rgba(16, 185, 129, .05); }
.cmp-note { font-family: var(--font-mono); font-size: .74rem; color: var(--mut); line-height: 1.7; max-width: 70ch; }

/* ---------- pricing sayfası ---------- */

.plan-card {
  max-width: 480px; margin: 30px auto;
  background: #fff; border: 1px solid var(--line); border-radius: 20px;
  box-shadow: var(--shadow-card);
  padding: 30px; text-align: center;
  position: relative;
}
.plan-card .pop {
  position: absolute; top: -13px; left: 50%; transform: translateX(-50%);
  background: var(--badge-y); color: #3d2f00;
  font-size: .72rem; font-weight: 700; letter-spacing: .04em;
  padding: 5px 14px; border-radius: 999px; white-space: nowrap;
}
.plan-card .pn { font-size: 1.3rem; font-weight: 800; color: var(--ink); }
.plan-card .pp { font-size: 2.3rem; font-weight: 800; color: var(--ink); letter-spacing: -.02em; margin: 8px 0 2px; }
.plan-card .pp small { font-size: 1rem; font-weight: 500; color: var(--mut); }
.plan-card .pf { font-size: .92rem; color: var(--buy-bright); font-weight: 600; margin-bottom: 16px; }
.plan-card ul { list-style: none; margin: 18px 0 22px; padding: 0; text-align: left; }
.plan-card li { padding: 8px 0; border-top: 1px solid var(--line-soft); font-size: .95rem; color: var(--body); }
.plan-card li::before { content: "✓  "; color: var(--buy-bright); font-weight: 700; }

.ptable { width: 100%; border-collapse: collapse; font-size: .95rem; max-width: 860px; margin: 20px auto; }
.ptable th, .ptable td { padding: 12px 14px; border-top: 1px solid var(--line-soft); text-align: left; }
.ptable thead th { border-top: 0; font-size: .78rem; letter-spacing: .06em; text-transform: uppercase; color: var(--mut); font-family: var(--font-mono); }
.ptable thead th.pro { color: var(--buy-bright); }
.ptable td.c { text-align: center; width: 120px; }
.ptable .grp td { font-weight: 700; color: var(--ink); background: var(--bg2); font-size: .85rem; }
.ptable .ok { color: var(--buy-bright); font-weight: 700; }
.ptable .no { color: var(--mut); }

/* ---------- shelf ticker (/shelf-scan/) ---------- */

.ticker {
  display: flex; gap: 4px; align-items: flex-end;
  height: 130px; padding: 0 8px; margin: 26px auto 0; max-width: 560px;
  border-bottom: 4px solid #d9c9a8;
}
.ticker i {
  flex: 1; border-radius: 3px 3px 0 0;
  background: var(--sp, #1d3557);
  height: var(--hh, 70%);
  position: relative;
  animation: tick 3.4s var(--ease) infinite;
  animation-delay: var(--dd, 0s);
}
@keyframes tick { 0%, 100% { filter: brightness(1); } 50% { filter: brightness(1.35); } }
.ticker i.pull { outline: 2px solid var(--buy); outline-offset: 2px; }

/* ---------- koyu bant şekil varyasyonu: tam-genişlik merdiven + 3'lü kutu ---------- */

.mwide { margin: clamp(56px, 8vh, 92px) 0; }
.mwide h3 { font-size: clamp(1.5rem, 2.9vw, 2.15rem); color: #fff; max-width: 34ch; letter-spacing: -.015em; }
.mwide p { color: var(--navy-body); max-width: 62ch; margin: 12px 0 0; }
.mwide p b { color: #fff; }
.mwide .mstat { margin-top: 16px; }

.ladder-wide {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 26px;
  border: 1px solid var(--navy-line); border-radius: 16px;
  background: var(--navy2);
  overflow: hidden;
}
.lw-col { border-right: 1px solid var(--navy-line); padding: 0 0 12px; }
.lw-col:last-child { border-right: 0; }
.lw-h {
  font-family: var(--font-mono); font-size: .74rem; letter-spacing: .06em;
  color: var(--navy-mut); text-align: center;
  padding: 11px 8px; border-bottom: 1px solid var(--navy-line);
  background: rgba(255, 255, 255, .03);
}
.lw-h i { font-style: normal; opacity: .75; }
.lw-r {
  font-family: var(--font-mono); font-size: clamp(.92rem, 1.5vw, 1.12rem);
  color: #fff; text-align: center; padding: 9px 8px;
}
.lw-r i { font-style: normal; font-size: .72em; color: var(--navy-mut); margin-left: 2px; }
.lw-r.dash, .lw-col .lw-r.dash { color: var(--navy-mut); }
.lw-r.anchor { color: var(--buy); }

.ladder-foot {
  display: flex; flex-wrap: wrap; gap: 10px clamp(20px, 4vw, 44px);
  align-items: baseline; margin-top: 14px;
  font-family: var(--font-mono); font-size: .76rem; color: var(--navy-mut);
}
.ladder-foot b { color: #fff; font-size: 1.02rem; margin-right: 5px; }
.ladder-foot .anch { color: var(--buy-bright); filter: brightness(1.5); margin-left: auto; }

.mtiles {
  position: relative; overflow: hidden;
  margin: clamp(56px, 8vh, 92px) 0 0;
  border: 1px solid var(--navy-line); border-radius: 20px;
  padding: clamp(26px, 4vw, 40px);
}
.mtiles::before {
  content: ""; position: absolute; inset: 0;
  background: var(--photo) center / cover no-repeat; opacity: .30;
}
.mtiles::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(100deg, rgba(10, 22, 40, .95) 35%, rgba(10, 22, 40, .70));
}
.mtiles > * { position: relative; z-index: 1; }
.mt-copy h3 { font-size: clamp(1.4rem, 2.6vw, 1.95rem); color: #fff; }
.mt-copy p { color: var(--navy-body); max-width: 56ch; margin: 10px 0 0; }
.mt-copy p b { color: #fff; }
.mt-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 26px; }
.mt {
  background: rgba(10, 22, 40, .72); border: 1px solid var(--navy-line);
  border-radius: 14px; padding: 16px 18px;
  backdrop-filter: blur(3px);
}
.mt .k { display: block; font-family: var(--font-mono); font-size: .68rem; letter-spacing: .1em; color: var(--navy-mut); }
.mt b { display: block; color: #fff; font-size: 1.02rem; margin-top: 6px; }
.mt .v { display: block; font-family: var(--font-mono); font-size: .76rem; color: var(--navy-mut); margin-top: 4px; }
.mt .v.ok { color: var(--buy); }

/* ---------- arka yarı: zümrüt CTA şeridi (renk olayı + kayıp buton) ---------- */

.cta-strip {
  background: linear-gradient(100deg, #062E23 0%, #0B7A55 62%, #10B981 130%);
  color: #EAFBF3;
  text-align: center;
}
.cta-strip .wrap { padding-top: clamp(38px, 6vh, 60px); padding-bottom: clamp(38px, 6vh, 60px); }
.cta-strip h2 {
  color: #fff; font-size: clamp(1.5rem, 3vw, 2.2rem);
  letter-spacing: -.015em; max-width: 24ch; margin: 0 auto;
}
.cta-strip p { margin: 10px auto 20px; max-width: 52ch; color: #C6F0E0; }
.cta-strip .btn { background: #fff; color: #06301f; }
.cta-strip .btn:hover { background: #EAFBF3; color: #06301f; }
/* margin AUTO şart: .cta-strip p'nin max-width'i burada da geçerli,
   margin ezilirse blok sola yapışır (ölçümle yakalandı) */
.cta-strip .cs-note { font-family: var(--font-mono); font-size: .72rem; color: #9FDDC6; margin: 12px auto 0; }

/* ---------- manifesto sonu CTA + skin-in-the-game + sample etiketi ---------- */

.man-cta { text-align: center; margin-top: 60px; }
.man-cta .btn { font-size: 1.04rem; padding: 14px 30px; }
.man-cta .mc-note {
  margin: 13px 0 0;
  font-family: var(--font-mono); font-size: .74rem; color: var(--navy-mut);
}

.skin-line {
  max-width: 26ch;
  margin: 58px auto 0;
  font-size: clamp(1.45rem, 2.7vw, 2.15rem);
  font-weight: 700; letter-spacing: -.015em; line-height: 1.28;
  color: var(--ink); text-align: center; text-wrap: balance;
}
.skin-line em { font-style: normal; color: var(--buy-deep); }
/* mono yalnız VERİ yüzeylerinde; düzyazı gövde yüzünde (3. tur bulgusu) */
.skin-sub {
  margin: 14px auto 0; text-align: center; max-width: 56ch;
  font-size: 1.02rem; color: var(--body); line-height: 1.6;
}
.skin-link { text-align: center; margin: 14px 0 0; }
.skin-link a { font-size: .98rem; font-weight: 600; white-space: nowrap; }

/* gerçek-rakam şeridi: sayfanın tek TAM sesli kanıtı burada da çalar */
.proof-strip {
  display: flex; justify-content: center; flex-wrap: wrap;
  gap: clamp(26px, 5vw, 70px);
  margin-top: 38px;
}
.proof-strip .pi { text-align: center; }
.proof-strip .pi .n {
  font-size: clamp(1.9rem, 3.4vw, 2.7rem);
  font-weight: 800; color: var(--ink); letter-spacing: -.02em; line-height: 1.1;
}
.proof-strip .pi .l { font-family: var(--font-mono); font-size: .72rem; color: var(--mut); margin-top: 4px; }

.sample-tag {
  display: inline-block;
  font-family: var(--font-mono); font-size: .7rem; letter-spacing: .05em;
  color: var(--mut);
  border: 1px dashed #c9d4e2; border-radius: 999px;
  padding: 4px 13px; margin: 0 0 16px;
}

/* ---------- koyu bantta foto-sırtlı kart + gerçek ekran videosu ---------- */

.mcard.photo { position: relative; overflow: hidden; }
.mcard.photo::before {
  content: ""; position: absolute; inset: 0;
  background: var(--photo) center / cover no-repeat;
  opacity: .42;
}
.mcard.photo::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(178deg, rgba(10, 22, 40, .30) 8%, rgba(10, 22, 40, .93) 62%);
}
.mcard.photo > * { position: relative; z-index: 1; }

.vid-wrap {
  position: relative;
  border-radius: 18px; overflow: hidden;
  padding: 10px;
  background: #10233C;
  border: 1px solid var(--navy-line);
  /* koyu zeminde görünür çerçeve: iç yüzey açık, dış halka + derin gölge */
  box-shadow: 0 0 0 1px rgba(58, 86, 128, .35), 0 30px 70px -30px rgba(0, 0, 0, .9);
}
.vid-wrap video { display: block; width: 100%; height: auto; border-radius: 10px; }
/* açık zemindeki kayıt (reject bölümü): beyaz kart çerçevesi */
.vid-wrap.light {
  background: #fff; border-color: var(--line);
  box-shadow: var(--shadow-card);
}
.vid-wrap.light .vid-cap { background: rgba(255, 255, 255, .82); color: var(--mut); }

.sell-proof {
  display: grid; grid-template-columns: minmax(0, 420px) minmax(0, 1fr);
  gap: clamp(24px, 4vw, 56px); align-items: center;
  max-width: 900px; margin: 46px auto 0; text-align: left;
}
.sell-proof-note { margin: 0; font-size: 1.02rem; color: var(--body); max-width: 34ch; }
@media (max-width: 720px) {
  .sell-proof { grid-template-columns: 1fr; gap: 20px; }
  .sell-proof-note { max-width: none; }
}

/* altyazı çerçeve İÇİNDE ama videonun ALTINDA — veriyi kapatmaz */
.vid-cap {
  display: block; margin-top: 9px; text-align: center;
  font-family: var(--font-mono); font-size: .68rem; letter-spacing: .04em;
  color: var(--navy-mut);
}
.vid-wrap.light .vid-cap { color: var(--mut); }

/* Provenance line under the hero composite. The hero is the largest, first image on
   the site and it shipped with no caption at all — the phone screen is a real release
   -build capture, the plate around it is generated, and nothing said so. Same mono
   register as .vid-cap / .phone-caption so the whole site labels evidence one way. */
.hero-cap {
  position: relative; z-index: 2;   /* .hero-stage is position:relative, notes are absolute */
  max-width: 54ch; margin: 14px auto 0;
  font-family: var(--font-mono); font-size: .68rem; line-height: 1.5;
  letter-spacing: .03em; color: var(--mut); text-align: center;
}
@media (max-width: 720px) { .hero-cap { font-size: .64rem; margin-top: 10px; } }

/* ---------- reveal on scroll ---------- */

/* FAIL OPEN: the starting (hidden) state is scoped to html.js — the class is set by an
   inline head script. No JS (or a failed site.js) means these rules never apply and the
   content simply paints. Never hide anything from a visitor whose JS did not run. */
html.js .reveal-y { opacity: 0; transform: translateY(14px); }
html.js .reveal-y.in { opacity: 1; transform: none; transition: opacity .6s var(--ease), transform .6s var(--ease); }

html.js .hload { opacity: 0; transform: translateY(12px); }
body.loaded .hload { opacity: 1; transform: none; transition: opacity .7s var(--ease), transform .7s var(--ease); }
body.loaded .hload.d1 { transition-delay: .08s; }
body.loaded .hload.d2 { transition-delay: .16s; }
body.loaded .hload.d3 { transition-delay: .26s; }
body.loaded .hload.d4 { transition-delay: .38s; }

/* ---------- responsive ---------- */

@media (max-width: 1020px) {
  .journey .wrap { grid-template-columns: 1fr 1fr; }
  .mblock, .mblock.flip { grid-template-columns: 1fr; }
  .mblock.flip .mcopy { order: 0; }
  .finder-grid { grid-template-columns: 1fr; }
  .phone { margin: 0 auto; }
  .ledger { grid-template-columns: 1fr 1fr; }
  .foot-cols { grid-template-columns: 1fr 1fr; }
  .foot-cols .foot-brand { grid-column: 1 / -1; }
}

@media (max-width: 720px) {
  .site-nav {
    position: fixed; inset: 66px 0 auto 0;
    background: #fff;
    border-bottom: 1px solid var(--line);
    box-shadow: 0 20px 40px -20px rgba(11, 21, 36, .25);
    flex-direction: column; align-items: flex-start;
    gap: 0; padding: 8px 24px 18px;
    display: none;
  }
  .site-nav.open { display: flex; }
  .site-nav a:not(.btn) { padding: 12px 0; font-size: 1rem; }
  .site-nav a.btn { padding: 12px 22px; margin-top: 10px; }
  .site-nav.doc-nav a.btn { margin-top: 0; }
  /* icon-only: frees ~30px so the CTA pill next to it fits on ONE line.
     The name comes from .sr-only text, never from generated content. */
  .nav-toggle {
    display: inline-grid; place-items: center;
    flex: none; width: 40px; height: 40px; padding: 0;
    background: none; border: 1px solid var(--line); border-radius: 999px;
    color: var(--ink); cursor: pointer;
  }
  .nav-toggle .nav-ico { display: block; }
  /* mobilde CTA menünün içine saklanmaz — barda kalır.
     flex:0 1 auto + min-width:0 keeps it from swelling to 65px in a 67px bar when
     the label wraps. NOT white-space:nowrap alone — at 320px that turns a cosmetic
     wrap into horizontal page overflow. */
  .head-cta {
    display: inline-flex; align-items: center; margin-left: auto;
    flex: 0 0 auto; white-space: nowrap;
    font-size: .85rem; padding: 10px 14px; min-height: 40px;
    line-height: 1.2;
  }
  .site-head .wrap { gap: 10px; height: auto; min-height: 66px; }
  /* 4. tur blocker: 390'da doc-nav (linkler+hap ~330px) iki sıraya sarıp 66px barda
     kırpılıyor, hap gövde metninin üstüne taşıyordu. Metin linkleri mobilde gizli
     (footer'da varlar), hap ana sayfadaki .head-cta ile aynı kompakt ölçüye iner. */
  .site-nav.doc-nav { position: static; display: flex; box-shadow: none; flex-wrap: nowrap; }
  .site-nav.doc-nav a:not(.btn) { display: none; }
  .site-nav.doc-nav a.btn { padding: 10px 15px; font-size: .85rem; min-height: 40px; white-space: nowrap; }

  /* 4. dalganın tam-genişlik öğeleri — 4. tur bulgusu: mobil kuralı HİÇ yoktu.
     Merdiven 2×2'ye iner (MU/FU üstte, MN/FN altta), satırlar sarmaz; lejant tek
     sütuna diner (başıboş "—" satırı biter); INPUT kutuları alt alta. */
  .ladder-wide { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lw-col { border-right: 0; }
  .lw-col:nth-child(odd) { border-right: 1px solid var(--navy-line); }
  .lw-col:nth-child(-n+2) { border-bottom: 1px solid var(--navy-line); }
  .lw-r { font-size: .84rem; white-space: nowrap; }
  .ladder-foot { flex-direction: column; align-items: flex-start; gap: 6px; }
  /* nowrap keeps the short stat pairs ("25 used", "1 new") intact — but .anch is a
     full sentence, and nowrap on it overflowed the viewport by 25px at 320px. */
  .ladder-foot span:not(.anch) { white-space: nowrap; }
  .ladder-foot .anch { margin-left: 0; min-width: 0; white-space: normal; }
  .mt-row { grid-template-columns: 1fr; }

  /* hero kartları: mobilde foto üstünde değil, altta tek kolon akış */
  .hero-stage { display: flex; flex-direction: column; }
  .hero-stage img.hero-phone { order: 0; }
  .hnote { position: static; width: auto; max-width: 480px; margin: 10px auto 0; order: 1; --note-o: 1; --note-s: 1; box-shadow: var(--shadow-card); }
  .hnote.dim { display: none; }

  .trio { grid-template-columns: 1fr; }
  .mini2 { grid-template-columns: 1fr; }
  .waitlist-row { flex-direction: column; }
  .waitlist .btn { width: 100%; text-align: center; }
  .journey .wrap { grid-template-columns: 1fr; }
  .ledger { grid-template-columns: 1fr 1fr; gap: 10px; }
  .lcard .n { font-size: 1.7rem; }
  /* mobilde ayrı sanat yönetimi: hero-phone-m.webp (sıkı kırpım, okunur ekran) */
  .hero-stage img.hero-phone { width: min(430px, 96vw); }
  /* proof-strip 2+1 kırılmasın: tek sütun, eşit ritim */
  .proof-strip { flex-direction: column; gap: 22px; }
  .proof-strip .pi .l { color: var(--body); }
  /* mono düzyazıyı gövde yüzüne çevir (okunurluk) */
  .skin-sub { font-family: var(--font-body); font-size: 1rem; line-height: 1.6; color: var(--body); }
  .finder-src { font-family: var(--font-body); font-size: .95rem; line-height: 1.6; }
  .foot-cols { grid-template-columns: 1fr; }
  .cmp thead { display: none; }
  .cmp tr { display: block; padding: 14px 0; border-top: 1px solid var(--line-soft); }
  .cmp tbody th, .cmp td { display: block; padding: 3px 0; border: 0; width: auto; }
  .cmp td.us::before { content: "RakeScan · "; font-family: var(--font-mono); font-size: .68rem; color: var(--buy-bright); }
  .cmp td:not(.us)::before { content: var(--them, "Them · "); font-family: var(--font-mono); font-size: .68rem; color: var(--mut); }
  .cmp td.us { background: none; }
  .ptable td.c { width: auto; }
}

/* ---------- reduced motion ---------- */

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  /* must out-rank the html.js hiding rules above (0,2,1) — hence html.js here too */
  html.js .hload, html.js .reveal-y { opacity: 1; transform: none; transition: none; }
  html.js .hnote, html.js .hnote.show { opacity: var(--note-o); transform: scale(var(--note-s)); transition: none; }
  .jthumb .pin::after, .jthumb .scanline, .jthumb .bars i, .jthumb .cash::after, .ticker i { animation: none; }
  .btn { transition: none; }
}

/* ---------- site demo modulleri (v2.3): tek-ISBN verdikt + sales onizleme ---------- */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.demo-wrap { max-width: 620px; margin: 30px auto 0; text-align: left; }
.demo-row { display: flex; gap: 10px; }
.demo-in { flex: 1; min-width: 0; font-family: var(--font-mono); font-size: 1rem; color: var(--ink); background: #fff; border: 1.5px solid var(--line); border-radius: 12px; padding: 14px 16px; }
.demo-in:focus-visible { outline: 3px solid var(--buy-bright); outline-offset: 2px; }
.demo-row .btn { white-space: nowrap; }
.demo-note { margin: 12px 2px 0; font-family: var(--font-mono); font-size: .72rem; letter-spacing: .04em; color: var(--mut); text-align: center; }
/* A miss is frequent (the demo answers from a fixed sample), so always keep one
   working ISBN within reach — both here and inside the miss message. */
.demo-try-these { margin: 14px 2px 0; font-size: .84rem; color: var(--mut); text-align: center; }
.isbn-chip {
  font-family: var(--font-mono); font-size: .8rem; letter-spacing: .02em;
  color: var(--buy-bright); background: #eefaf4; border: 1px solid #cdebdd;
  border-radius: 7px; padding: 3px 8px; margin: 0 2px; cursor: pointer;
}
.isbn-chip:hover { background: #e2f5ec; }
.isbn-chip:focus-visible { outline: 2px solid var(--buy-bright); outline-offset: 2px; }
.demo-err .isbn-chip { margin: 0 3px; }
.demo-err { margin: 14px 2px 0; font-size: .96rem; color: var(--body); }
.demo-err a { color: var(--buy-bright); font-weight: 600; }
.demo-card { margin-top: 16px; background: var(--navy); border: 1px solid var(--navy-line); border-radius: 14px; padding: 18px 20px; color: #fff; box-shadow: var(--shadow-card); }
.demo-card .vtag { display: inline-block; font-family: var(--font-mono); font-weight: 700; font-size: .78rem; letter-spacing: .08em; padding: 4px 10px; border-radius: 7px; }
.demo-card .vtag.buy { background: var(--buy); color: #06281c; }
.demo-card .vtag.rej { background: #D92D20; color: #fff; }
.demo-card .vtag.amb { background: #B45309; color: #fff; }
.demo-card .dt { font-weight: 700; font-size: 1.04rem; margin: 10px 0 2px; }
.demo-card .dp { font-family: var(--font-mono); font-size: .9rem; color: #2DD4A7; margin: 2px 0 10px; }
.demo-card .why { border-top: 1px solid var(--navy-line); padding: 10px 0 0; margin: 0; list-style: none; }
.demo-card .why li { display: flex; gap: 8px; align-items: baseline; font-family: var(--font-mono); font-size: .78rem; color: var(--navy-body); padding: 3px 0; }
.demo-card .why .ok { color: var(--buy); }
.demo-card .why .no { color: #F97066; }
.sales-list { margin: 16px 0 0; padding: 0; list-style: none; border-top: 1px solid var(--line-soft); }
.sales-list li { padding: 12px 2px; border-bottom: 1px solid var(--line-soft); }
.sales-list b { display: block; font-size: .98rem; color: var(--ink); }
.sales-list .sm { display: block; margin-top: 3px; font-family: var(--font-mono); font-size: .76rem; color: var(--mut); }
.sales-list .sm a { color: var(--buy-bright); }
@media (max-width: 720px) {
  .demo-row { flex-direction: column; }
  .demo-row .btn { width: 100%; text-align: center; }
}

/* ---------- /guides/ dizini ---------- */
.guide-list { list-style: none; padding: 0; margin: 26px 0 0; }
.guide-list li { padding: 16px 2px; border-top: 1px solid var(--line-soft); margin: 0; }
.guide-list li:last-child { border-bottom: 1px solid var(--line-soft); }
.guide-list b { font-size: 1.05rem; }
.guide-list .gd { display: inline-block; margin-top: 4px; font-size: .92rem; color: var(--body); }