/* 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: Banner (hukuki sayfalar), Corridor (/404), Stage (/) in home.css · 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 · waive 84 · app.usefinlens.com opens on a sign-in page and every screen behind it shows account data · the ledger and the step panels stay built samples in a data-slot until the owner sends captures */
/* Hallmark · reworded "© 2026 FinLens · usefinlens.com" to "© 2026 FinLens, usefinlens.com" on the legal pages · 63 names the dotted footer line */
/* Hallmark · reworded the legal pages' next link "<title> →" to the title alone under "Sıradaki metin" · 63 names the arrow glued to link text */
/* Hallmark · waive 77 · the legal pages carry one article of a paragraph and a list each, set at a 68ch prose measure beside their contents nav · a legal text read line by line wants a reading measure, not a ten-column body */
/* Hallmark · dismissed F7 · the pills the check counts are the menu button, the lens ring, the TMS 29 switch, the period control and search chips: controls and tags, not boxes */
/* Hallmark · dismissed F4 · the nav's filled Ücretsiz başla is kept from the page before the redesign, at 44px under the hero's 52px action */
/* Hallmark · dismissed F4 · the second filled control the hero check sees is a ledger row button inside the built sample, not an action */

/* ── Paylaşılan bileşenler: atlama bağlantısı, butonlar, masthead, alt bilgi, hukuki sayfalar, 404 ── */

.skip { position: absolute; left: var(--space-md); top: calc(-1 * var(--space-3xl)); z-index: var(--z-toast); padding: var(--space-xs) var(--space-md); background: var(--color-ink); color: var(--color-paper); font: 500 var(--text-sm)/1.4 var(--font-display); }
.skip:focus-visible { top: var(--space-md); }
.vh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

/* Tek dolu buton biçimi; ikincil buton dış çizgili */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--space-xs);
  min-height: 52px; padding: 0 var(--space-lg); border: 1px solid var(--color-accent); border-radius: var(--radius-pill);
  background: var(--color-accent); color: var(--color-accent-ink); text-decoration: none; cursor: pointer; white-space: nowrap;
  font: 700 var(--text-md)/1 var(--font-display); letter-spacing: -0.01em;
  transition: background-color var(--dur-short) var(--ease-out), border-color var(--dur-short) var(--ease-out), transform var(--dur-micro) var(--ease-out);
}
.btn:active { transform: translateY(1px); }
.btn:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 3px; }
.btn:disabled, .btn[aria-disabled="true"] { opacity: 0.55; cursor: not-allowed; transform: none; }
.btn--quiet { background: transparent; color: var(--color-ink); border-color: var(--color-ink); min-height: 44px; padding: 0 var(--space-md); font-size: var(--text-sm); }
.btn--small { min-height: 44px; padding: 0 var(--space-md); font-size: var(--text-sm); }
.link { text-decoration: underline; text-decoration-color: transparent; text-underline-offset: 0.2em; transition: text-decoration-color var(--dur-short) var(--ease-out); }
.link:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 2px; }
@media (hover: hover) and (pointer: fine) {
  .btn:hover { background: var(--color-accent-strong); border-color: var(--color-accent-strong); }
  .btn--quiet:hover { background: var(--color-ink); color: var(--color-paper); border-color: var(--color-ink); }
  .link:hover { text-decoration-color: currentColor; }
}
@media (prefers-reduced-motion: reduce) { .btn, .link { transition: none; } }

/* ── Masthead: ortada marka, iki yanda bağlantılar, altında ince çizgi ── */
.bar { position: relative; z-index: var(--z-raised); border-bottom: var(--rule-hair) solid var(--color-rule); font-family: var(--font-display); }
.bar-in { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: var(--space-lg); min-height: var(--nav-height); }
.bar-links { grid-column: 1; grid-row: 1; display: flex; align-items: center; gap: var(--space-lg); font-size: var(--text-sm); font-weight: 500; }
.bar-links a { text-decoration: none; padding-block: var(--space-xs); }
.bar-acts { grid-column: 3; grid-row: 1; justify-self: end; display: flex; align-items: center; gap: var(--space-lg); font-size: var(--text-sm); font-weight: 500; }
.bar-acts > a:not(.btn) { text-decoration: none; padding-block: var(--space-xs); }
.mark { grid-column: 2; grid-row: 1; justify-self: center; display: inline-flex; align-items: center; gap: var(--space-xs); text-decoration: none; font: 700 var(--text-xl)/1 var(--font-display); letter-spacing: -0.035em; }
.mark svg { width: 32px; height: 32px; color: var(--color-accent); flex-shrink: 0; }
.mark:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 4px; }
.menu { display: none; justify-self: end; position: relative; }
.menu summary { list-style: none; cursor: pointer; display: flex; align-items: center; min-height: 44px; padding: 0 var(--space-md); border: 1px solid var(--color-ink); border-radius: var(--radius-pill); font: 700 var(--text-md)/1 var(--font-display); }
.menu summary::-webkit-details-marker { display: none; }
.menu summary:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 3px; }
.menu-panel { position: absolute; right: 0; top: calc(100% + var(--space-xs)); z-index: var(--z-dropdown); min-width: 240px; padding: var(--space-xs); background: var(--color-night); color: var(--color-night-ink); border-radius: var(--radius-card); --color-focus: var(--color-mint); }
.menu-panel a { display: flex; align-items: center; min-height: 48px; padding: 0 var(--space-md); text-decoration: none; font: 500 var(--text-md)/1.2 var(--font-display); border-radius: calc(var(--radius-card) - var(--space-xs)); }
.menu-panel a:focus-visible { outline: 2px solid var(--color-focus); outline-offset: -2px; }
@media (hover: hover) and (pointer: fine) { .bar a:not(.btn):not(.mark):hover, .menu-panel a:hover { color: var(--color-accent); } .menu-panel a:hover { color: var(--color-mint); } }

/* ── Alt bilgi: kapanış cümlesi büyük, bağlantılar altında; yeşil alan ── */
.foot { background: var(--color-field); color: var(--color-field-ink); padding-block: var(--section-gap-s) var(--space-xl); --color-focus: var(--color-accent-ink); }
.foot a { color: inherit; }
.foot-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap-columns); row-gap: var(--space-xl); padding-top: var(--space-xl); border-top: var(--rule-hair) solid var(--color-field-muted); font: 400 var(--text-sm)/1.5 var(--font-display); }
.foot-col { grid-column: span 2; }
.foot-col h3 { font: 500 var(--text-sm)/1.4 var(--font-display); letter-spacing: 0; color: var(--color-field-muted); margin-bottom: var(--space-sm); }
.foot-col ul { list-style: none; margin: 0; padding: 0; }
.foot-col li + li { margin-top: var(--space-xs); }
.foot-col a { text-decoration: none; display: inline-block; padding-block: var(--space-3xs); }
.foot-spk { grid-column: 8 / -1; font: 400 var(--text-sm)/1.55 var(--font-body); }
.foot-spk p + p { margin-top: var(--space-sm); }
.foot-last { margin-top: var(--space-2xl); font: 400 var(--text-sm)/1.5 var(--font-display); color: var(--color-field-muted); }
@media (hover: hover) and (pointer: fine) { .foot-col a:hover { text-decoration: underline; text-underline-offset: 0.2em; } }

/* ── Hukuki sayfalar: başlık bandı, yapışkan içindekiler, okunur metin ── */
.title { position: relative; overflow: hidden; background: var(--color-paper-2); padding-block: var(--space-3xl); }
.title h1 { position: relative; z-index: var(--z-raised); font-size: var(--text-display-s); max-width: 16ch; }
.title p { position: relative; z-index: var(--z-raised); margin-top: var(--space-lg); max-width: 48ch; font-size: var(--text-lead); line-height: 1.45; color: var(--color-ink-2); }
.title-mark { position: absolute; right: -6%; top: 50%; width: min(42vw, 560px); color: var(--color-accent); opacity: 0.16; transform: translateY(-50%); pointer-events: none; }
.doc { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap-columns); padding-block: var(--space-xl) var(--section-gap); }
.doc-nav { grid-column: 1 / 4; padding-top: var(--space-md); }
.doc-nav ul { list-style: none; margin: 0; padding: 0; position: sticky; top: var(--space-xl); font: 500 var(--text-md)/1.3 var(--font-display); border-left: var(--rule-hair) solid var(--color-rule); }
.doc-nav a { display: block; padding: var(--space-xs) var(--space-md); margin-left: -1px; border-left: 2px solid transparent; text-decoration: none; color: var(--color-muted); }
.doc-nav a[aria-current="page"] { color: var(--color-ink); font-weight: 700; border-left-color: var(--color-accent); }
.doc-nav a:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 2px; }
.doc article { grid-column: 4 / -1; max-width: 68ch; font-size: var(--text-lg); line-height: 1.7; }
.doc article h2 { font-size: var(--text-section); line-height: 1.05; margin-bottom: var(--space-lg); }
.doc article p { margin-bottom: var(--space-lg); }
.doc article ul { margin: 0; padding-left: 1.2em; }
.doc article li { margin-bottom: var(--space-xs); }
.doc article li::marker { color: var(--color-accent); }
.doc article a:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 2px; }
.updated { margin-top: var(--space-xl); color: var(--color-muted); font-size: var(--text-md); }
.next { display: block; border-top: var(--rule-hair) solid var(--color-rule); padding-block: var(--space-3xl); text-decoration: none; }
.next small { display: block; font: 500 var(--text-sm)/1.4 var(--font-display); color: var(--color-muted); margin-bottom: var(--space-xs); }
.next strong { display: block; font: 700 var(--text-display-s)/1 var(--font-display); letter-spacing: var(--tracking-display); transition: color var(--dur-short) var(--ease-out); }
.next:focus-visible { outline: 2px solid var(--color-focus); outline-offset: -4px; }
@media (hover: hover) and (pointer: fine) { .next:hover strong { color: var(--color-accent); } }
.foot--doc { padding-block: var(--space-2xl) var(--space-xl); }
.foot--doc .foot-grid { border-top: 0; padding-top: 0; }
.foot--doc .foot-spk { grid-column: 1 / 9; font-size: var(--text-md); }
.foot--doc .foot-last { margin-top: var(--space-lg); }

/* ── 404: tek sütun, büyük başlık ── */
.lost { display: grid; place-items: center; min-height: calc(100svh - var(--nav-height)); padding-block: var(--space-3xl); }
.lost-in { max-width: 54rem; }
.lost h1 { font-size: var(--text-display); line-height: 1; max-width: 16ch; overflow-wrap: normal; }
.lost p { margin-top: var(--space-lg); max-width: 46ch; font-size: var(--text-lead); line-height: 1.45; color: var(--color-ink-2); }
.lost .actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-md) var(--space-lg); margin-top: var(--space-xl); font: 500 var(--text-md)/1.2 var(--font-display); }
.lost nav { margin-top: var(--space-3xl); padding-top: var(--space-lg); border-top: var(--rule-hair) solid var(--color-rule); }
.lost nav ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--space-xs) var(--space-lg); font: 500 var(--text-md)/1.2 var(--font-display); }
.lost nav a { display: inline-block; padding-block: var(--space-xs); }

/* ── Tablet ve telefon ── */
@media (max-width: 68rem) {
  .bar-links { display: none; }
  .bar-in { grid-template-columns: auto minmax(0, 1fr) auto; }
  .mark { justify-self: start; grid-column: 1; grid-row: 1; }
  .bar-acts { grid-column: 3; grid-row: 1; }
  .foot-col { grid-column: span 4; }
  .foot-spk { grid-column: 1 / -1; }
  .doc-nav { grid-column: 1 / -1; order: 2; margin-top: var(--space-2xl); }
  .doc-nav ul { position: static; }
  .doc article { grid-column: 1 / -1; }
  .foot--doc .foot-spk { grid-column: 1 / -1; }
}
@media (max-width: 40rem) {
  .bar-acts { display: none; }
  .menu { display: block; grid-column: 3; grid-row: 1; }
  .foot-col { grid-column: span 6; }
  .doc article { font-size: var(--text-md); }
  .title-mark { right: -30%; width: 80vw; }
}