/* Hallmark · shape: Workbench · genre: modern-minimal · theme: brand · redesign: full · job: sign up · draw: 51eaec
 * paper: oklch(96.5% 0.008 150) · accent: oklch(48.1% 0.091 170) · display: Libre Franklin · body: Source Serif 4 · hero: Stage (/) · nav: masthead · footer: statement · signature: the income statement the lens reads, row by row, in plain Turkish
 * axes: light/grotesk-heavy/chromatic-green · posture: committed (the brand green as a field on the hero stage panel, the TMS 29 band and the footer with its close; night as a second field on the research band and the step well) · contrast: pass · fold: pass · imagery: product built in hero and how, one archive photograph (the owner's) · v2.0.0 */
/* Hallmark · pre-emit critique: P4 H5 E4 S5 R4 V4 · weakest: P, the page explains more than it argues; let the ledger and the TMS 29 switch make the case and cut the bento to plain rows */
/* Hallmark · hero-review: fix · 4 findings · 3 resolved 1 partial (the lens ring sits under the action on a phone) */
/* Hallmark · finish-review: subagent · 7 findings · 6 resolved 1 unresolved (the archive photo has no credit line; credits.json marks it public domain, credit not required) · gap: none */
/* Hallmark · reworded "ÖRNEK Sanayi A.Ş. · 2025 bilançosu, gelir tablosu" to "ÖRNEK Sanayi A.Ş." over "2025 bilançosu, gelir tablosu" · 63 names the dotted meta string */
/* Hallmark · reworded "Milyon ₺ · TMS 29’a göre düzeltilmiş · örnek şirket, örnek rakamlar" to "Milyon ₺, TMS 29’a göre düzeltilmiş. Örnek şirket, örnek rakamlar." · 63 names the dotted meta string */
/* Hallmark · reworded "ÖRNEK · Örnek Sanayi A.Ş." to "ÖRNEK" over "Örnek Sanayi A.Ş." and "Sanayi · BIST" to "Sanayi, BIST" · 63 names the dotted meta string */
/* Hallmark · reworded "KAP’tan alınan tablolar · 2025 yıllık" to "KAP’tan alınan tablolar, 2025 yıllık" and "ÖRNEK · adım adım inceleme" to "ÖRNEK, adım adım inceleme" · 63 names the dotted label */
/* Hallmark · reworded "RSI < 30 → AL · RSI > 70 → SAT" to "RSI 30’un altında: al" and "RSI 70’in üstünde: sat" · 63 and 67 name the arrows, dots and capitals */
/* Hallmark · reworded "© 2026 FinLens · Türkiye sunucuları · KVKK uyumlu" to "© 2026 FinLens. Türkiye sunucuları, KVKK uyumlu." · 63 names the dotted footer line */
/* Hallmark · reworded "ayda · yıllık ödemede ayda ₺149" to "ayda, yıllık ödemede ayda ₺149" and "analiz başına · kullandıkça öde" to "analiz başına, kullandıkça öde" · 63 names the dotted price note */
/* Hallmark · waive 39b · the close's input and button are set inside an 84px display sentence, 87px tall at 1440 · the fill-in sentence is FinLens' own close: the ticker blank is the form, so it takes the sentence's size */
/* Hallmark · dismissed F20 · the tool list is one column of full-width rows; the 2 + 1 the check reads is a row's title, line and fragment */
/* Hallmark · dismissed F4 · the nav's Ücretsiz başla is filled as before the redesign, a step smaller (44px) than the hero's 52px action, so the hero still leads */
/* Hallmark · dismissed 59 · the tenth section is Ajan Masası, the product's newest feature (13 agents, four stages), added after the redesign and too distinct to fold into the step switcher */
/* Hallmark · dropped the footer's second Ücretsiz başla button · the close form directly above it starts the same sign-up */

/* ── Hero: Stage, başlık solda, yeşil alanda gelir tablosu sağda ── */
.hero-in {
  display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: var(--space-2xl); align-items: center;
  min-height: min(calc(100svh - var(--nav-height)), 1000px); padding-block: var(--space-xl);
}
.hero h1 { font-size: var(--text-display); line-height: 0.98; max-width: none; }
.hero h1 .line { display: block; white-space: nowrap; }
.intro .lead { margin-top: var(--space-xl); max-width: 36ch; font-size: var(--text-xl); line-height: 1.42; }
.intro .btn { margin-top: var(--space-xl); }
.hero-note { margin-top: var(--space-sm); font: 400 var(--text-sm)/1.45 var(--font-display); color: var(--color-muted); }
.stage {
  display: flex; align-items: center; justify-content: center;
  padding: var(--space-xl) var(--space-lg); border-radius: var(--radius-card); background: var(--color-field);
}

/* Gelir tablosu: örnek arayüz, data-ui kökü */
[data-ui].ledger { position: relative; width: min(600px, 100%); background: var(--color-surface); color: var(--color-ink); border-radius: calc(var(--radius-card) - 4px); font-family: var(--font-display); font-variant-numeric: tabular-nums; --color-focus: var(--color-accent); }
[data-ui] .ledger-head { padding: var(--space-md) var(--space-lg) var(--space-sm); border-bottom: var(--rule-hair) solid var(--color-rule); }
[data-ui] .ledger-co { font-size: 15px; font-weight: 700; }
[data-ui] .ledger-meta { margin-top: var(--space-3xs); font-size: 13px; line-height: 1.4; color: var(--color-muted); }
[data-ui] .readout { padding: var(--space-sm) var(--space-lg); background: var(--color-surface-2); border-bottom: var(--rule-hair) solid var(--color-rule); min-height: 116px; }
[data-ui] .readout-k { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-sm); font-size: 14px; font-weight: 700; }
[data-ui] .readout-k b { font-size: 22px; color: var(--color-accent); letter-spacing: -0.02em; }
[data-ui] .readout-k b.down { color: var(--color-down); }
[data-ui] .readout-t { margin-top: var(--space-2xs); font: 400 18px/1.45 var(--font-body); transition: opacity var(--dur-short) var(--ease-out); }
[data-ui] .cols { display: grid; grid-template-columns: minmax(0, 1fr) 84px 84px; padding: var(--space-xs) var(--space-lg) var(--space-2xs); font-size: 13px; color: var(--color-muted); text-align: right; }
[data-ui] .cols span:first-child { text-align: left; }
[data-ui] .rows { list-style: none; margin: 0; padding: 0 0 var(--space-sm); position: relative; }
[data-ui] .row { appearance: none; border: 0; margin: 0; background: transparent; color: inherit; font: inherit; box-sizing: border-box; display: grid; grid-template-columns: minmax(0, 1fr) 84px 84px; align-items: center; width: 100%; min-height: clamp(36px, 4.8svh, 44px); padding: 0 var(--space-lg); font-size: 15px; cursor: pointer; text-align: right; transition: background-color var(--dur-short) var(--ease-out); }
[data-ui] .row span { white-space: nowrap; }
[data-ui] .row span:first-child { text-align: left; white-space: normal; }
[data-ui] .row.total { font-weight: 700; }
[data-ui] .row[aria-pressed="true"] { background: var(--color-surface-sel); }
[data-ui] .row:focus-visible { outline: 2px solid var(--color-focus); outline-offset: -2px; }
[data-ui] .lens { position: absolute; right: var(--space-xs); top: 0; width: 92px; height: clamp(48px, 6svh, 56px); border-radius: var(--radius-pill); border: 5px solid var(--color-mint); pointer-events: none; transform: translateY(var(--y, 0px)); transition: transform var(--dur-long) var(--ease-out); }
@media (hover: hover) and (pointer: fine) { [data-ui] .row:hover { background: var(--color-surface-2); } }

/* ── Arşiv: başlık ve metin yan yana, belge geniş bir vitrinde ── */
.archive { padding-block: var(--section-gap) var(--section-gap-s); }
.archive-head { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap-columns); align-items: end; }
.archive h2 { grid-column: 1 / 7; max-width: 14ch; }
.archive-head p { grid-column: 8 / -1; max-width: 50ch; }
.disc { margin: var(--space-2xl) 0 0; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap-columns); }
.disc .frame { grid-column: 3 / -1; aspect-ratio: 21 / 9; overflow: hidden; border-radius: var(--radius-card); background: var(--color-paper-3); }
.disc img { width: 100%; height: 100%; object-fit: cover; object-position: 38% 50%; outline: 1px solid color-mix(in oklab, var(--color-ink) 8%, transparent); outline-offset: -1px; }

/* ── TMS 29 anahtarı: tek kontrol, alanın rengi onunla değişir ── */
.tas { background: var(--color-field); color: var(--color-field-ink); padding-block: var(--section-gap-s); transition: background-color var(--dur-long) var(--ease-out); --color-focus: var(--color-accent-ink); }
.tas[data-on="false"] { background: var(--color-night); }
.tas-in { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap-columns); align-items: center; min-height: 520px; }
.tas-copy { grid-column: 1 / 7; }
.tas h2 { font-size: var(--text-display); line-height: 1; max-width: 9ch; }
.tas-copy p { margin-top: var(--space-lg); max-width: 46ch; font-size: var(--text-lg); line-height: 1.5; }
.tas-copy .tas-note { margin-top: var(--space-sm); font: 400 var(--text-sm)/1.45 var(--font-display); color: inherit; }
[data-ui].switch-ui { grid-column: 8 / -1; font-family: var(--font-display); font-size: var(--text-section); color: inherit; }
[data-ui] .sw-label { font-size: 0.42em; font-weight: 500; }
[data-ui] .sw { appearance: none; border: 0; padding: 0; display: block; position: relative; margin-top: var(--space-sm); width: 5.4em; height: 2.7em; border-radius: var(--radius-pill); background: var(--color-mint); cursor: pointer; transition: background-color var(--dur-short) var(--ease-out); }
[data-ui] .sw[aria-checked="false"] { background: var(--color-night-2); }
[data-ui] .sw::after { content: ""; position: absolute; top: 0.3em; left: 0.3em; width: 2.1em; height: 2.1em; border-radius: 50%; background: var(--color-surface); transform: translateX(2.7em); transition: transform var(--dur-long) var(--ease-out); }
[data-ui] .sw[aria-checked="false"]::after { transform: none; }
[data-ui] .sw:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 4px; }
[data-ui] .sw-value { margin-top: var(--space-md); font-size: 2.2em; font-weight: 700; line-height: 1; letter-spacing: -0.045em; font-variant-numeric: tabular-nums; }
[data-ui] .sw-caption { margin-top: var(--space-xs); font-size: 0.4em; font-weight: 500; }

/* ── Nasıl çalışır: dört aşama, onları süren tek kaydırıcı ── */
.how { padding-block: var(--section-gap); }
.how-in { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap-columns); align-items: center; }
.how-left { grid-column: 1 / 6; }
.how h2 { min-height: 2.1em; max-width: 13ch; }
.how-left p { margin-top: var(--space-lg); max-width: 46ch; min-height: 4.65em; font-size: var(--text-lg); line-height: 1.55; }
.fade { transition: opacity var(--dur-short) var(--ease-out); }
.js .fade.out { opacity: 0; }
.track-wrap { margin-top: var(--space-2xl); }
.track { position: relative; height: 8px; background: var(--color-paper-3); border-radius: var(--radius-pill); }
.track-fill { position: absolute; inset: 0; background: var(--color-ink); border-radius: var(--radius-pill); transform-origin: left center; transform: scaleX(0); transition: transform var(--dur-long) var(--ease-out); }
.track input { position: absolute; inset: -18px 0; width: 100%; height: 44px; margin: 0; opacity: 0; cursor: pointer; }
.track-thumb { position: absolute; inset: 0; pointer-events: none; transform: translateX(0); transition: transform var(--dur-long) var(--ease-out); }
.track-thumb::before { content: ""; position: absolute; left: 0; top: 50%; width: 28px; height: 28px; border-radius: 50%; background: var(--color-accent); transform: translate(-50%, -50%); }
.track input:focus-visible ~ .track-thumb::before { outline: 2px solid var(--color-focus); outline-offset: 3px; }
.stops { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: var(--space-sm); }
.stops button { appearance: none; border: 0; background: transparent; padding: 0; display: flex; align-items: center; min-height: 44px; cursor: pointer; font: 500 var(--text-md)/1.2 var(--font-display); color: var(--color-muted); }
.stops button:nth-child(2) { justify-content: center; transform: translateX(-17%); }
.stops button:nth-child(3) { justify-content: center; transform: translateX(17%); }
.stops button:nth-child(4) { justify-content: flex-end; }
.stops button[aria-current="step"] { color: var(--color-ink); font-weight: 700; }
.stops button:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 2px; }
@media (hover: hover) and (pointer: fine) { .stops button:hover { color: var(--color-ink); } }
.how-right { grid-column: 7 / -1; display: flex; align-items: center; justify-content: center; min-height: 480px; padding: var(--space-xl); border-radius: var(--radius-card); background: var(--color-night); }
[data-ui].app { width: min(560px, 100%); background: var(--color-surface); color: var(--color-ink); border-radius: calc(var(--radius-card) - 4px); font: 400 18px/1.45 var(--font-display); --color-focus: var(--color-accent); }
[data-ui] .app-panel { display: none; padding: var(--space-xl); min-height: 360px; }
[data-ui] .app-panel.on { display: block; }
[data-ui] .app-title { font-size: 15px; color: var(--color-muted); margin-bottom: var(--space-sm); }
[data-ui] .field { display: flex; align-items: center; gap: var(--space-xs); padding: var(--space-sm) var(--space-md); border: 2px solid var(--color-accent); border-radius: 10px; font-size: 22px; font-weight: 700; }
[data-ui] .caret { width: 2px; height: 20px; background: var(--color-accent); }
[data-ui] .opt { margin-top: var(--space-xs); padding: var(--space-sm) var(--space-md); border-radius: 10px; background: var(--color-surface-sel); font-weight: 500; }
[data-ui] .opt small { display: block; color: var(--color-muted); font-size: 15px; font-weight: 400; }
[data-ui] .mini-btn { display: inline-block; margin-top: var(--space-md); padding: var(--space-xs) var(--space-md); border-radius: var(--radius-pill); background: var(--color-accent); color: var(--color-accent-ink); font-weight: 700; font-size: 14px; }
[data-ui] .item { display: flex; justify-content: space-between; gap: var(--space-sm); padding: var(--space-sm) 0; border-bottom: var(--rule-hair) solid var(--color-rule); }
[data-ui] .item:last-child { border-bottom: 0; }
[data-ui] .ok { color: var(--color-accent); font-weight: 700; flex-shrink: 0; }
[data-ui] .busy { color: var(--color-busy); font-weight: 700; flex-shrink: 0; }
[data-ui] .verdict { font-size: 64px; font-weight: 700; letter-spacing: -0.04em; color: var(--color-ink); line-height: 1; }
[data-ui] .facts { display: flex; gap: var(--space-md); margin-top: var(--space-sm); font-size: 16px; }
[data-ui] .why { margin: var(--space-md) 0 0; padding-left: var(--space-md); font: 400 18px/1.45 var(--font-body); }
[data-ui] .legal { margin-top: var(--space-md); font-size: 14px; color: var(--color-muted); }

/* ── Ajan Masası: dört aşama, her aşamanın ajanları; altında karne ve olanaklar ── */
.desk { background: var(--color-paper-2); padding-block: var(--section-gap-s); }
.desk-head { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap-columns); align-items: end; }
.desk h2 { grid-column: 1 / 7; max-width: 12ch; }
.desk-head .lead { grid-column: 8 / -1; }
.desk-steps { list-style: none; counter-reset: step; margin: var(--space-2xl) 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: var(--gap-columns); }
.desk-steps > li { counter-increment: step; display: flex; flex-direction: column; gap: var(--space-md); padding-top: var(--space-lg); border-top: 2px solid var(--color-ink); }
.desk-steps > li::before { content: counter(step); font: 700 var(--text-display-s)/1 var(--font-display); letter-spacing: -0.04em; color: var(--color-accent); font-variant-numeric: tabular-nums; }
.desk-steps h3 { max-width: 14ch; }
.desk-steps p { font-size: var(--text-md); color: var(--color-ink-2); }
.crew { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--space-xs); font: 500 var(--text-sm)/1.2 var(--font-display); }
.crew li { padding: var(--space-xs) var(--space-sm); border-radius: var(--radius-pill); background: var(--color-surface); border: var(--rule-hair) solid var(--color-rule); }
[data-ui].verdicts { display: flex; gap: var(--space-3xs); padding: var(--space-2xs); width: max-content; max-width: 100%; border-radius: var(--radius-pill); background: var(--color-surface); border: var(--rule-hair) solid var(--color-rule); font: 500 var(--text-sm)/1.2 var(--font-display); }
[data-ui].verdicts span { padding: var(--space-xs) var(--space-sm); border-radius: var(--radius-pill); color: var(--color-muted); }
[data-ui].verdicts span.on { background: var(--color-accent); color: var(--color-accent-ink); font-weight: 700; }
.desk-foot { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap-columns); row-gap: var(--space-xl); margin-top: var(--space-3xl); padding-top: var(--space-xl); border-top: var(--rule-hair) solid var(--color-paper-3); }
.desk-score { grid-column: 1 / 6; font: 500 var(--text-xl)/1.35 var(--font-display); letter-spacing: -0.015em; }
.desk-facts { grid-column: 7 / -1; margin: 0; display: grid; gap: var(--space-md); }
.desk-facts div { display: grid; grid-template-columns: 11rem minmax(0, 1fr); column-gap: var(--space-lg); }
.desk-facts dt { font: 700 var(--text-md)/1.4 var(--font-display); }
.desk-facts dd { margin: 0; }
.desk-act { grid-column: 7 / -1; display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-sm); }
.desk-act p { font: 400 var(--text-sm)/1.5 var(--font-display); color: var(--color-muted); max-width: 52ch; }

/* ── Araçlar: satırlar, her satırın sağında arayüzden bir parça ── */
.tools { padding-block: var(--section-gap-s) var(--section-gap); }
.tools h2 { max-width: 12ch; }
.tool-rows { list-style: none; margin: var(--space-2xl) 0 0; padding: 0; border-bottom: var(--rule-hair) solid var(--color-rule); }
.tool { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap-columns); align-items: center; min-height: 128px; padding-block: var(--space-lg); border-top: var(--rule-hair) solid var(--color-rule); }
.tool h3 { grid-column: 1 / 5; }
.tool p { grid-column: 5 / 9; max-width: 46ch; font-size: var(--text-md); }
.tool-ui { grid-column: 9 / -1; justify-self: end; font-family: var(--font-display); color: var(--color-ink); }
.tool--lead { min-height: 240px; padding-block: var(--space-xl); }
.tool--lead h3 { font-size: var(--text-2xl); line-height: 1.1; }
.tool--lead p { font-size: var(--text-lg); line-height: 1.5; }
.tool--lead .tool-ui { font-size: 150%; }
.tool--lead [data-ui].z-search { font-size: 34px; }
.tool--lead [data-ui].z-fig { font-size: 96px; }
.tool--lead [data-ui].z-fig small { font-size: 16px; }
.tool--lead [data-ui].z-rule .say { font-size: 26px; }
.tool--lead [data-ui].z-rule .to span { font-size: 18px; padding: var(--space-xs) var(--space-md); }
[data-ui].z-search { font-size: 28px; }
[data-ui].z-search .q { display: inline-flex; align-items: center; padding: 0.35em 0.6em; background: var(--color-surface); border: var(--rule-hair) solid var(--color-rule); border-radius: 0.5em; font-weight: 500; white-space: nowrap; letter-spacing: -0.02em; }
[data-ui].z-search .chips { display: flex; flex-wrap: wrap; gap: 0.3em; margin-top: 0.35em; }
[data-ui].z-search .chips span { padding: 0.3em 0.6em; border-radius: var(--radius-pill); background: var(--color-accent); color: var(--color-accent-ink); font-size: 0.5em; white-space: nowrap; }
[data-ui].z-word { font-size: 44px; font-weight: 700; letter-spacing: -0.04em; line-height: 1; text-align: right; }
[data-ui].z-word small { display: block; font-size: 14px; font-weight: 500; letter-spacing: 0; margin-bottom: var(--space-2xs); color: var(--color-muted); }
[data-ui].z-word .tag { display: inline-block; padding: 0.1em 0.3em; border-radius: 0.2em; background: var(--color-down-pale); color: var(--color-down-ink); }
[data-ui].z-toggle .tg { display: block; width: 88px; height: 48px; border-radius: var(--radius-pill); background: var(--color-mint); position: relative; }
[data-ui].z-toggle .tg::after { content: ""; position: absolute; right: 5px; top: 5px; width: 38px; height: 38px; border-radius: 50%; background: var(--color-surface); }
[data-ui].z-mail { padding: var(--space-sm) var(--space-md); border-radius: 10px; background: var(--color-surface); border: var(--rule-hair) solid var(--color-rule); white-space: nowrap; }
[data-ui].z-mail .from { font-size: 13px; color: var(--color-muted); }
[data-ui].z-mail .subj { font-size: 20px; font-weight: 700; letter-spacing: -0.02em; }
[data-ui].z-rule { text-align: right; }
[data-ui].z-rule .say { font: 400 20px/1.35 var(--font-body); }
[data-ui].z-rule .to { display: inline-flex; flex-wrap: wrap; justify-content: flex-end; gap: var(--space-xs); margin-top: var(--space-xs); }
[data-ui].z-rule .to span { padding: var(--space-2xs) var(--space-sm); border-radius: 8px; background: var(--color-night); color: var(--color-mint); font-weight: 700; font-size: 15px; white-space: nowrap; }
[data-ui].z-fig { font-size: 48px; font-weight: 700; letter-spacing: -0.045em; line-height: 1; font-variant-numeric: tabular-nums; color: var(--color-ink); text-align: right; }
[data-ui].z-fig small { display: block; font-size: 14px; letter-spacing: 0; font-weight: 500; color: var(--color-muted); margin-bottom: var(--space-2xs); }
[data-ui].z-seg { font-size: 18px; display: flex; gap: var(--space-3xs); padding: var(--space-2xs); background: var(--color-surface); border: var(--rule-hair) solid var(--color-rule); border-radius: var(--radius-pill); width: max-content; }
[data-ui].z-seg span { padding: var(--space-2xs) var(--space-md); border-radius: var(--radius-pill); font-weight: 500; }
[data-ui].z-seg span.on { background: var(--color-accent); color: var(--color-accent-ink); }
[data-ui].z-region { font-size: 30px; font-weight: 700; letter-spacing: -0.035em; line-height: 1.05; white-space: nowrap; }
.more { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap-columns); margin-top: var(--space-3xl); }
.more h3 { grid-column: 1 / 5; }
.more ul { grid-column: 5 / -1; list-style: none; margin: 0; padding: 0; columns: 2; column-gap: var(--gap-columns); }
.more li { break-inside: avoid; margin-bottom: var(--space-lg); max-width: 46ch; }
.more li b { display: block; font: 700 var(--text-md)/1.3 var(--font-display); }

/* ── Araştırma: iki rakam, karşılaştırma için büyük ── */
.research { background: var(--color-night); color: var(--color-night-ink); padding-block: var(--section-gap-s); --color-focus: var(--color-mint); }
.research h2 { max-width: 14ch; }
.rates { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: var(--space-2xl); }
.rate { padding-inline: var(--space-xl); border-left: var(--rule-hair) solid var(--color-night-2); }
.rate:first-child { padding-left: 0; border-left: 0; }
.rate .d { font: 700 clamp(7rem, 16vw, 15rem)/0.85 var(--font-display); letter-spacing: -0.06em; font-variant-numeric: tabular-nums; }
.rate.r60 .d { color: var(--color-mint); }
.rate.r53 .d { color: var(--color-night-muted); }
.rate p { margin-top: var(--space-md); font: 500 var(--text-lg)/1.35 var(--font-display); }
.research-copy { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap-columns); margin-top: var(--space-2xl); padding-top: var(--space-xl); border-top: var(--rule-hair) solid var(--color-night-2); }
.research-copy p { grid-column: 1 / 7; max-width: 58ch; }
.research-copy .src { grid-column: 8 / -1; font: 400 var(--text-sm)/1.55 var(--font-display); color: var(--color-night-muted); }

/* ── Fiyatlar: dört plan ve fiyatları bir listede, seçilenin ayrıntısı yanında ── */
.pricing { padding-block: var(--section-gap); }
.pricing-in { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap-columns); align-items: start; }
.plans-col { grid-column: 1 / 7; }
.plans { list-style: none; margin: 0; padding: 0; border-bottom: var(--rule-hair) solid var(--color-rule); }
.plans li { border-top: var(--rule-hair) solid var(--color-rule); }
.plans button { appearance: none; border: 0; background: transparent; margin: 0; cursor: pointer; display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-lg); width: 100%; padding: var(--space-md) var(--space-sm); text-align: left; color: var(--color-muted); font: 700 var(--text-section)/1.1 var(--font-display); letter-spacing: var(--tracking-display); transition: color var(--dur-short) var(--ease-out), background-color var(--dur-short) var(--ease-out); }
.plans button small { font: 500 var(--text-lg)/1 var(--font-display); letter-spacing: 0; font-variant-numeric: tabular-nums; white-space: nowrap; }
.plans button[aria-selected="true"] { color: var(--color-ink); background: var(--color-paper-2); }
.plans button[aria-selected="true"] small { color: var(--color-accent); }
.plans button:focus-visible { outline: 2px solid var(--color-focus); outline-offset: -2px; }
@media (hover: hover) and (pointer: fine) { .plans button:hover { color: var(--color-ink); } }
.plans-note { margin-top: var(--space-lg); max-width: 46ch; color: var(--color-muted); }
.plan-stage { grid-column: 8 / -1; padding-top: var(--space-md); }
.plan-price { display: flex; align-items: baseline; flex-wrap: wrap; gap: 0 var(--space-sm); }
.plan-price b { font: 700 var(--text-display)/1 var(--font-display); letter-spacing: -0.05em; font-variant-numeric: tabular-nums; }
.plan-price span { font: 500 var(--text-md)/1.3 var(--font-display); color: var(--color-muted); }
.plan-for { margin-top: var(--space-md); font: 500 var(--text-md)/1.4 var(--font-display); }
.plan ul { margin: var(--space-sm) 0 var(--space-xl); padding-left: 1.1em; columns: 2; column-gap: var(--gap-columns); }
.plan li { margin-bottom: var(--space-2xs); break-inside: avoid; }
.plan li::marker { color: var(--color-accent); }
.js .plan[hidden] { display: none; }
.js .plan.enter { animation: rise var(--dur-long) var(--ease-out); }

/* ── SSS: başlık solda yapışkan, sorular sağda satır satır ── */
.faq { background: var(--color-paper-2); padding-block: var(--section-gap-s); }
.faq-in { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap-columns); align-items: start; }
.faq-head { grid-column: 1 / 5; position: sticky; top: var(--space-xl); }
.faq h2 { max-width: 10ch; }
.faq-head p { margin-top: var(--space-lg); max-width: 30ch; }
.faq-head a:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 2px; }
.cards { grid-column: 5 / -1; border-bottom: var(--rule-hair) solid var(--color-paper-3); }
.card { border-top: var(--rule-hair) solid var(--color-paper-3); }
.card summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: 7.5rem minmax(0, 1fr) 24px; column-gap: var(--space-lg); align-items: baseline; padding: var(--space-lg) var(--space-xs); font: 500 var(--text-title)/1.25 var(--font-display); letter-spacing: -0.02em; }
.card summary::-webkit-details-marker { display: none; }
.card summary::after { content: "+"; justify-self: end; font-weight: 500; color: var(--color-accent); }
.card[open] summary::after { content: "−"; }
.card .topic { font: 500 var(--text-sm)/1.4 var(--font-display); letter-spacing: 0; color: var(--color-muted); }
.card summary:focus-visible { outline: 2px solid var(--color-focus); outline-offset: -2px; }
.card .ans { padding: 0 var(--space-xs) var(--space-xl) calc(7.5rem + var(--space-lg) + var(--space-xs)); max-width: calc(60ch + 9rem); }
.js .card[open] .ans { animation: rise var(--dur-long) var(--ease-out); }
@media (hover: hover) and (pointer: fine) { .card summary:hover { color: var(--color-accent-strong); } }

/* ── Kapanış: boşluklu cümle, boşluk formun kendisi; alt bilginin başında ── */
.cta form { margin: 0; }
.cta h2 { font-size: var(--text-display); line-height: 1.12; letter-spacing: -0.04em; max-width: none; }
.cta input { font: inherit; letter-spacing: inherit; width: 4.6em; height: 1.16em; padding: 0 0.2em; margin: 0 0.06em; vertical-align: -0.1em; border: 2px solid var(--color-field-muted); border-radius: var(--radius-pill); background: var(--color-field-deep); color: var(--color-field-ink); outline: 3px solid transparent; outline-offset: 0.05em; }
.cta input::placeholder { color: var(--color-field-muted); opacity: 1; }
.cta input:focus-visible { outline-color: var(--color-focus); }
.cta button { font: inherit; letter-spacing: inherit; height: 1.16em; padding: 0 0.36em; vertical-align: -0.14em; border: 2px solid var(--color-night); border-radius: var(--radius-pill); background: var(--color-night); color: var(--color-mint); cursor: pointer; transition: transform var(--dur-micro) var(--ease-out), background-color var(--dur-short) var(--ease-out); }
.cta button:active { transform: translateY(2px); }
.cta button:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 0.05em; }
.cta button:disabled { opacity: 0.55; cursor: not-allowed; }
@media (hover: hover) and (pointer: fine) { .cta button:hover { background: var(--color-night-2); border-color: var(--color-night-2); } }
.cta-note { margin-top: var(--space-lg); max-width: 56ch; font-size: var(--text-lg); line-height: 1.5; }
.cta + .foot-grid { margin-top: var(--section-gap-s); }
.foot-mark { display: flex; align-items: flex-end; gap: var(--space-lg); margin-top: var(--space-3xl); color: var(--color-field-ink); }
.foot-mark svg { width: clamp(96px, 16vw, 220px); height: auto; flex-shrink: 0; }
.foot-mark span { font: 700 var(--text-display)/0.85 var(--font-display); letter-spacing: -0.05em; }

/* ── Hareket: tek giriş (hero) ve arşiv görselinin perdesi ── */
@keyframes rise { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@keyframes line-up { to { transform: none; } }
.lines .line { overflow: hidden; padding-bottom: 0.08em; margin-bottom: -0.08em; }
.lines [data-line] { display: block; }
@media (prefers-reduced-motion: no-preference) {
  .js .lines [data-line] { transform: translateY(105%); animation: line-up 600ms var(--ease-out) forwards; animation-delay: calc(var(--i) * 60ms + 60ms); }
  .js [data-rise] { opacity: 0; animation: rise 500ms var(--ease-out) forwards; animation-delay: calc(var(--i, 0) * 60ms + 120ms); }
  .js .shutter { clip-path: inset(0 0 100% 0); transition: clip-path 900ms var(--ease-in-out); }
  .js .shutter img { transform: scale(1.08); transition: transform 1200ms var(--ease-out); }
  .js .shutter.is-in { clip-path: inset(0); }
  .js .shutter.is-in img { transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .js .lines [data-line], .js [data-rise] { transform: none; opacity: 1; animation: none; }
  .js .shutter, .js .shutter img { clip-path: none; transform: none; transition: none; }
  .tas, .track-fill, .track-thumb, [data-ui] .lens, [data-ui] .sw, [data-ui] .sw::after, .fade { transition: none; }
  .js .plan.enter, .js .card[open] .ans { animation: none; }
}

/* ── Tablet ── */
@media (max-width: 68rem) {
  .hero-in { grid-template-columns: minmax(0, 1fr); row-gap: var(--space-2xl); min-height: 0; padding-block: var(--space-2xl) var(--space-xl); }
  .stage { padding: var(--space-xl) var(--space-lg); }
  .archive h2, .archive-head p { grid-column: 1 / -1; }
  .archive-head p { margin-top: var(--space-lg); }
  .disc .frame { grid-column: 1 / -1; }
  .tas-copy, [data-ui].switch-ui { grid-column: 1 / -1; }
  [data-ui].switch-ui { margin-top: var(--space-2xl); }
  .tas-in { min-height: 0; }
  .how-left, .how-right { grid-column: 1 / -1; }
  .how-right { margin-top: var(--space-2xl); min-height: 0; }
  .how h2 { max-width: none; }
  .desk h2, .desk-head .lead { grid-column: 1 / -1; }
  .desk-head .lead { margin-top: var(--space-lg); }
  .desk-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: var(--space-2xl); }
  .desk-score, .desk-facts, .desk-act { grid-column: 1 / -1; }
  .tool h3 { grid-column: 1 / 7; }
  .tool p { grid-column: 7 / -1; }
  .tool-ui { grid-column: 1 / -1; justify-self: start; margin-top: var(--space-lg); }
  .tool--lead [data-ui].z-fig { font-size: 64px; }
  [data-ui].z-word, [data-ui].z-fig, [data-ui].z-rule { text-align: left; }
  [data-ui].z-rule .to { justify-content: flex-start; }
  .more h3, .more ul { grid-column: 1 / -1; }
  .more ul { margin-top: var(--space-lg); }
  .research-copy p, .research-copy .src { grid-column: 1 / -1; }
  .research-copy .src { margin-top: var(--space-lg); }
  .plans-col, .plan-stage { grid-column: 1 / -1; }
  .plan-stage { margin-top: var(--space-2xl); }
  .faq-head, .cards { grid-column: 1 / -1; }
  .faq-head { position: static; margin-bottom: var(--space-2xl); }
}

/* ── Telefon ── */
@media (max-width: 40rem) {
  .hero h1 { font-size: 10.4vw; }
  .intro .btn { width: 100%; }
  .stage { padding: var(--space-sm); border-radius: calc(var(--radius-card) - 4px); }
  .hero-in { row-gap: var(--space-xl); padding-block: var(--space-xl); }
  .intro .lead { margin-top: var(--space-md); font-size: var(--text-lg); }
  .intro .btn { margin-top: var(--space-lg); }
  [data-ui] .cols, [data-ui] .row { grid-template-columns: minmax(0, 1fr) 64px 64px; padding-left: var(--space-sm); padding-right: var(--space-sm); font-size: 14px; }
  [data-ui] .ledger-head, [data-ui] .readout { padding-left: var(--space-sm); padding-right: var(--space-sm); }
  [data-ui] .readout { min-height: 150px; }
  [data-ui] .readout-t { font-size: 16px; }
  [data-ui] .lens { width: 74px; right: 0; }
  .disc .frame { aspect-ratio: 4 / 3; }
  .tas h2 { font-size: var(--text-display-s); }
  [data-ui].switch-ui { font-size: 2.4rem; }
  .how-right { padding: var(--space-lg) var(--space-sm); }
  .stops button:nth-child(n) { transform: none; }
  .stops button { font-size: var(--text-sm); }
  .desk-steps { grid-template-columns: minmax(0, 1fr); row-gap: var(--space-xl); }
  .desk-facts div { grid-template-columns: minmax(0, 1fr); row-gap: var(--space-2xs); }
  .desk-score { font-size: var(--text-lg); }
  .desk-foot { margin-top: var(--space-2xl); }
  .tool { min-height: 0; }
  .tool h3, .tool p { grid-column: 1 / -1; }
  .tool p { margin-top: var(--space-xs); }
  [data-ui].z-search, .tool--lead [data-ui].z-search { font-size: 20px; }
  .tool--lead [data-ui].z-rule .say { font-size: 20px; }
  [data-ui] .app-panel { padding: var(--space-lg); min-height: 0; }
  .foot-mark span { font-size: var(--text-display-s); }
  [data-ui].z-search .q { white-space: normal; }
  [data-ui].z-mail { white-space: normal; }
  [data-ui].z-region { white-space: normal; font-size: 24px; }
  .more ul { columns: 1; }
  .rate { padding-inline: var(--space-md); }
  .rate .d { font-size: 30vw; }
  .rate p { font-size: var(--text-md); }
  .plans button { padding-inline: var(--space-xs); font-size: var(--text-2xl); }
  .plans button small { font-size: var(--text-md); }
  .plan ul { columns: 1; }
  .card summary { grid-template-columns: minmax(0, 1fr) 24px; row-gap: var(--space-2xs); font-size: var(--text-lg); }
  .card .topic { grid-column: 1 / -1; grid-row: 1; }
  .card summary::after { grid-column: 2; grid-row: 2; }
  .card .ans { padding-left: var(--space-xs); }
  .cta h2 { font-size: 8.6vw; line-height: 1.3; }
  .cta input { width: 4.1em; padding: 0 0.14em; }
  .cta .l1 { white-space: nowrap; }
}
