/* ==========================================================================
   sayaisletme.com — "Muhasebe defteri ve damga" tasarım dili
   Krem kâğıt, defter yeşili, kırmızı mürekkep, tükenmez mavisi; makbuz
   koçanı, lastik damga, yazar kasa fişi ve LCD rakamlar.
   Saya Yazılım'ın tasarım temelini (Saya.Core/wwwroot) kullanmaz; yalnızca
   ortak kodu (güvenlik, SEO, talep kaydı) paylaşır.
   ========================================================================== */

/* 1. Değişkenler ---------------------------------------------------------- */
:root {
  --kagit: #F5EFE0;
  --kagit-2: #FBF8EE;
  --beyaz: #FFFDF6;
  --murekkep: #1E2A24;
  --murekkep-2: #4A5650;
  --yesil: #1F6F5C;
  --yesil-koyu: #17594A;
  --yesil-acik: #9FC9B7;
  --kirmizi: #C8382D;
  --kirmizi-koyu: #A52C23;
  --tukenmez: #2541B2;
  --cizgi: #D9CFB5;
  --satir: #BFD8CC;
  --kenar: #E2A39C;
  --lcd: #B9C9A0;
  --lcd-yazi: #1B2614;
  --lcd-sari: #E9CF7A;

  --f-baslik: "Bricolage Grotesque", "Segoe UI", system-ui, sans-serif;
  --f-daktilo: "Courier Prime", "Courier New", monospace;
  --f-el: "Caveat", "Segoe Print", cursive;
  --f-lcd: "Share Tech Mono", ui-monospace, Consolas, monospace;

  --kap: 1200px;
  --bosluk: clamp(64px, 8vw, 104px);
  --golge: 4px 4px 0 var(--murekkep);
}

/* 2. Temel ---------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 84px; }
/* overflow-x: clip → damga "basılma" animasyonu gibi anlık büyümeler sayfayı yana kaydırmaz (hidden'dan farkı: sticky üst bilgiyi bozmaz). */
body { overflow-x: clip; margin: 0; background: var(--kagit); color: var(--murekkep); font-family: var(--f-baslik); font-size: 17px; line-height: 1.6; -webkit-font-smoothing: antialiased; }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
a:hover { color: var(--kirmizi); }
:focus-visible { outline: 2px solid var(--kirmizi); outline-offset: 3px; }
h1, h2, h3, p { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
button, input, select, textarea { font: inherit; }
.atla { position: absolute; left: 16px; top: -60px; z-index: 100; padding: 10px 16px; background: var(--murekkep); color: var(--kagit); }
.atla:focus { top: 12px; }

/* 3. Düzen ---------------------------------------------------------------- */
.kap { max-width: var(--kap); margin: 0 auto; padding-inline: 24px; }
.bolum { padding-block: var(--bosluk); position: relative; }
.bolum--acik { background: var(--kagit-2); }
.bolum--koyu { background: var(--murekkep); color: var(--kagit); }
.bolum__bas { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 16px 40px; margin-bottom: 44px; }
.bolum__aciklama { max-width: 440px; }
.bolum--koyu .bolum__aciklama { margin: 12px 0 36px; }
.iki-kolon { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(420px, 100%), 1fr)); gap: 48px 64px; align-items: center; }
.iki-kolon--ust { align-items: start; }
.sayfa-bas { padding-block: 40px var(--bosluk); }
.mt-16 { margin-top: 16px; } .mt-24 { margin-top: 24px; } .mt-32 { margin-top: 32px; } .mt-48 { margin-top: 48px; }

/* Geçişler: kâğıttan koyu bölüme yırtık kenar; kâğıt bölümleri arasında zımba deliği */
.yirtik::before {
  content: ""; position: absolute; left: 0; right: 0; bottom: calc(100% - 1px); height: 14px; background: inherit;
  -webkit-mask: conic-gradient(from 135deg at top, #0000, #000 1deg 89deg, #0000 90deg) top / 18px 100% repeat-x;
  mask: conic-gradient(from 135deg at top, #0000, #000 1deg 89deg, #0000 90deg) top / 18px 100% repeat-x;
}
.zimba { border-top: 1.5px dashed var(--cizgi); }
.zimba::before {
  content: ""; position: absolute; left: 0; right: 0; top: -7px; height: 12px; pointer-events: none;
  background: radial-gradient(circle, var(--kagit) 4.5px, transparent 5px) center / 44px 12px repeat-x;
}

/* 4. Tipografi ------------------------------------------------------------ */
.b1 { font-weight: 800; font-size: clamp(38px, 5.2vw, 64px); line-height: .98; letter-spacing: -.035em; }
.b1--orta { font-size: clamp(32px, 4vw, 50px); line-height: 1.02; }
.b2 { font-weight: 800; font-size: clamp(28px, 3.2vw, 42px); line-height: 1.04; letter-spacing: -.03em; }
.b3 { font-weight: 800; font-size: 22px; line-height: 1.2; letter-spacing: -.01em; }
.ust-yazi { font-family: var(--f-daktilo); font-weight: 700; font-size: 14px; letter-spacing: .08em; text-transform: uppercase; color: var(--yesil); margin-bottom: 14px; }
.bolum--koyu .ust-yazi { color: var(--yesil-acik); }
.yesil { color: var(--yesil); }
.yesil-acik { color: var(--yesil-acik); }
.soluk { color: var(--murekkep-2); }
.bolum--koyu .soluk { color: #C9D4CE; }
.daktilo { font-family: var(--f-daktilo); }
.giris__lead { margin-top: 22px; font-size: 19px; color: var(--murekkep-2); max-width: 540px; }
.not-satiri { margin-top: 24px; font-family: var(--f-daktilo); font-size: 13px; color: var(--murekkep-2); }

/* 5. Bileşenler ----------------------------------------------------------- */

/* Düğmeler: kalın gölgeli, basılınca yerine oturur */
.dg {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 14px 24px; border: 2px solid var(--murekkep); border-radius: 4px;
  font-weight: 700; font-size: 16px; line-height: 1.2; text-decoration: none; cursor: pointer;
  box-shadow: var(--golge); transition: transform .08s, box-shadow .08s;
}
.dg:hover { transform: translate(-1px, -1px); box-shadow: 5px 5px 0 var(--murekkep); }
.dg:active { transform: translate(3px, 3px); box-shadow: 1px 1px 0 var(--murekkep); }
.dg--kirmizi { background: var(--kirmizi); color: #FFF; }
.dg--kirmizi:hover { background: var(--kirmizi-koyu); color: #FFF; }
.dg--yesil { background: var(--yesil); color: #FFF; }
.dg--yesil:hover { background: var(--yesil-koyu); color: #FFF; }
.dg--cizgi { background: transparent; color: var(--murekkep); box-shadow: none; border-width: 0 0 2px; border-radius: 0; padding-inline: 2px; font-family: var(--f-daktilo); }
.dg--cizgi:hover, .dg--cizgi:active { box-shadow: none; transform: none; color: var(--kirmizi); border-color: var(--kirmizi); }
.dg--acik { background: var(--kagit); color: var(--murekkep); border-color: var(--kagit); box-shadow: 4px 4px 0 var(--yesil); }
.dg--acik:hover { color: var(--murekkep); box-shadow: 5px 5px 0 var(--yesil); }
.dg--cizgi-acik { background: transparent; color: var(--kagit); border-color: var(--kagit); box-shadow: none; }
.dg--cizgi-acik:hover { color: var(--murekkep); background: var(--kagit); box-shadow: none; transform: none; }
.dg--kucuk { padding: 10px 18px; font-size: 15px; }
.dugmeler { display: flex; flex-wrap: wrap; gap: 14px 18px; align-items: center; margin-top: 30px; }

/* Lastik damga */
.damga {
  display: inline-block; padding: 6px 14px; border: 3px solid var(--kirmizi); border-radius: 6px;
  font-family: var(--f-daktilo); font-weight: 700; font-size: 17px; letter-spacing: .12em; text-transform: uppercase; line-height: 1.2;
  color: var(--kirmizi); transform: rotate(-6deg); opacity: .9;
  -webkit-mask-image: radial-gradient(circle at 30% 40%, #000 55%, rgba(0, 0, 0, .7) 78%);
  mask-image: radial-gradient(circle at 30% 40%, #000 55%, rgba(0, 0, 0, .7) 78%);
}
.damga--yesil { color: var(--yesil); border-color: var(--yesil); }
.bolum--koyu .damga--yesil { color: var(--yesil-acik); border-color: var(--yesil-acik); }
.damga--sag { transform: rotate(4deg); }
.damga--buyuk { font-size: 21px; padding: 8px 18px; }
.damga--kucuk { font-size: 11px; padding: 3px 8px; border-width: 2px; }

/* Muhasebe defteri sayfası */
.defter {
  position: relative; padding: 0 0 18px; border: 1px solid var(--cizgi);
  background-color: var(--kagit-2);
  background-image:
    linear-gradient(90deg, transparent 58px, var(--kenar) 58px, var(--kenar) 59.5px, transparent 59.5px, transparent 62px, var(--kenar) 62px, var(--kenar) 63.5px, transparent 63.5px),
    repeating-linear-gradient(to bottom, transparent 0, transparent 39px, var(--satir) 39px, var(--satir) 40px);
  background-position: 0 0, 0 4px;
  box-shadow: 0 24px 40px -28px rgba(30, 42, 36, .5);
}
.defter__bas, .defter__satir { display: grid; grid-template-columns: 62px minmax(0, 1fr) 72px 82px; padding-right: 14px; }
.defter__bas { padding-top: 12px; padding-bottom: 4px; border-bottom: 2px solid var(--yesil); font-family: var(--f-daktilo); font-weight: 700; font-size: 12px; letter-spacing: .06em; color: var(--yesil); }
.defter__satir { font-family: var(--f-el); font-size: 23px; line-height: 40px; color: var(--tukenmez); }
.defter__bas > :first-child, .defter__satir > :first-child { padding-left: 8px; }
.defter__bas > :nth-child(2), .defter__satir > :nth-child(2) { padding-left: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.defter__bas > :nth-child(n+3), .defter__satir > :nth-child(n+3) { text-align: right; }
.defter__satir--kirmizi > :nth-child(2) { color: var(--kirmizi); }

/* 6. Üst ve alt bilgi ----------------------------------------------------- */
.ust { position: sticky; top: 0; z-index: 40; background: rgba(245, 239, 224, .94); backdrop-filter: blur(6px); border-bottom: 2px solid var(--murekkep); }
.ust__ic { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-block: 14px; }
.marka { display: flex; align-items: center; gap: 10px; text-decoration: none; font-weight: 800; font-size: 23px; letter-spacing: -.02em; color: var(--murekkep); white-space: nowrap; }
.marka:hover { color: var(--murekkep); }
.marka img { width: 32px; height: 32px; }
.marka--acik { color: var(--kagit); }
.marka--acik:hover { color: var(--kagit); }
.marka--acik img { width: 28px; height: 28px; }
.menu { display: flex; gap: 28px; font-family: var(--f-daktilo); font-size: 15px; }
.menu a { text-decoration: none; padding-block: 6px; }
.menu a[aria-current="page"] { color: var(--kirmizi); border-bottom: 2px solid var(--kirmizi); }
.ust__sag { display: flex; align-items: center; gap: 10px; }
.menu-dugme { display: none; width: 44px; height: 44px; align-items: center; justify-content: center; border: 2px solid var(--murekkep); border-radius: 4px; background: var(--kagit-2); color: var(--murekkep); cursor: pointer; }
@media (max-width: 860px) {
  .menu-dugme { display: inline-flex; }
  .menu { display: none; position: absolute; left: 0; right: 0; top: 100%; flex-direction: column; gap: 0; padding: 8px 24px 16px; background: var(--kagit); border-bottom: 2px solid var(--murekkep); }
  .menu.acik { display: flex; }
  .menu a { padding: 14px 0; border-bottom: 1px dashed var(--cizgi); font-size: 17px; }
}
@media (max-width: 420px) { .ust__sag .dg { display: none; } .marka { font-size: 20px; } }

.alt { position: relative; background: var(--murekkep); color: #C9D4CE; font-size: 15px; }
.alt__ic { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 32px; padding-block: 60px 32px; }
.alt__kol { display: flex; flex-direction: column; gap: 8px; }
.alt__kol a { color: var(--kagit); text-decoration: none; }
.alt__kol a:hover { color: var(--lcd-sari); }
.alt__bas { font-family: var(--f-daktilo); font-weight: 700; font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: var(--yesil-acik); }
.alt__not { color: #9FB0A8; }
.alt__not a { color: var(--kagit); }
.alt__dip { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; padding-block: 18px 30px; border-top: 1px dashed #3B4A43; font-family: var(--f-daktilo); font-size: 13px; }
.alt__dip a { color: var(--kagit); }

/* 7. Ana sayfa ------------------------------------------------------------ */

/* Giriş */
.giris__ic { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(460px, 100%), 1fr)); gap: 56px; align-items: center; padding-block: 64px 120px; }
.giris__damgalar { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 26px; margin-top: 36px; }
.giris__defter { position: relative; margin: 0; padding-right: clamp(110px, 12vw, 150px); }
.giris__defter .defter { transform: rotate(-1deg); }
.giris__telefon { position: absolute; right: -14px; top: -30px; width: clamp(116px, 12vw, 156px); border: 8px solid var(--murekkep); border-radius: 26px; transform: rotate(5deg); box-shadow: 0 30px 50px -24px rgba(30, 42, 36, .6); }
/* Giriş bölümü yatayda kırpar: "Programa geçti" damgası basılırken (1,9 kat) ekranı taşırmasın; dikeyde serbest. */
section.giris, section.tasdik-bolum { overflow-x: clip; }
.giris__gecti { position: absolute; left: 24px; bottom: -46px; transform: rotate(-10deg); background: rgba(251, 248, 238, .6); }
@media (max-width: 560px) {
  .defter__bas, .defter__satir { grid-template-columns: 52px minmax(0, 1fr) 70px 70px; padding-right: 10px; }
  .defter { background-image: linear-gradient(90deg, transparent 52px, var(--kenar) 52px, var(--kenar) 53.5px, transparent 53.5px), repeating-linear-gradient(to bottom, transparent 0, transparent 39px, var(--satir) 39px, var(--satir) 40px); }
  .defter__satir { font-size: 21px; }
  .defter__bas > :first-child, .defter__satir > :first-child { padding-left: 6px; }
  .defter__bas > :nth-child(2), .defter__satir > :nth-child(2) { padding-left: 10px; }
}

/* Özellik kartları: dosya kartı */
.kartlar { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr)); gap: 24px; }
.kart {
  position: relative; display: flex; flex-direction: column; gap: 10px; padding: 24px 24px 26px 34px;
  background: var(--beyaz); border: 1px solid var(--cizgi); border-radius: 3px;
  background-image: linear-gradient(90deg, transparent 18px, var(--kenar) 18px, var(--kenar) 19.5px, transparent 19.5px);
  box-shadow: 0 16px 30px -24px rgba(30, 42, 36, .45);
  scroll-margin-top: 96px;
}
.kart__eski { font-family: var(--f-el); font-size: 22px; line-height: 1.2; color: var(--tukenmez); }
.kart__eski .daktilo { font-size: 13px; color: var(--murekkep-2); }
.kart__eski s { text-decoration-color: var(--kirmizi); text-decoration-thickness: 2px; }
.kart__liste { margin-top: 6px; display: flex; flex-direction: column; gap: 6px; font-size: 15px; }
.kart__liste li { display: flex; gap: 10px; }
.kart__liste li::before { content: "✓"; font-weight: 800; color: var(--yesil); }

/* LCD ekran */
.lcd {
  display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 4px 16px; padding: 12px 18px;
  border-radius: 6px; background: var(--lcd); color: var(--lcd-yazi);
  background-image: linear-gradient(rgba(27, 38, 20, .06) 1px, transparent 1px); background-size: 100% 4px;
  box-shadow: inset 0 3px 8px rgba(0, 0, 0, .35);
}
.lcd--sari { background-color: var(--lcd-sari); }
.lcd__et { font-family: var(--f-daktilo); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.lcd__sayi { min-width: 0; margin: 0; margin-left: auto; overflow-wrap: anywhere; font-family: var(--f-lcd); font-size: clamp(24px, 3.6vw, 44px); line-height: 1.05; text-align: right; }

/* Seçim düğmeleri (KDV yönü) */
.secimler { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; border: 0; }
.secimler legend { width: 100%; margin-bottom: 8px; padding: 0; font-family: var(--f-daktilo); font-size: 14px; }
.bolum--koyu .secimler legend { color: #C9D4CE; }
.secim { position: relative; }
.secim input { position: absolute; inset: 0; margin: 0; opacity: 0; cursor: pointer; }
.secim span { display: inline-block; padding: 8px 16px; border: 2px solid currentColor; border-radius: 4px; font-family: var(--f-daktilo); font-weight: 700; font-size: 14px; }
.secim input:checked + span { background: var(--lcd-sari); border-color: var(--lcd-sari); color: var(--murekkep); }
.hesap .secim input:checked + span { background: var(--yesil); border-color: var(--yesil); color: #FFF; }
.secim input:focus-visible + span { outline: 2px solid var(--kirmizi); outline-offset: 2px; }

/* Paketler: makbuz koçanı */
.kocanlar { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)); gap: 22px; align-items: stretch; }
.kocan {
  position: relative; display: flex; flex-direction: column; gap: 6px; padding: 18px 22px 24px;
  background: var(--beyaz); border: 1px solid var(--cizgi); border-radius: 4px;
}
.kocan__no { padding-bottom: 14px; margin-bottom: 14px; border-bottom: 2px dashed var(--cizgi); font-family: var(--f-daktilo); font-size: 12px; color: #6B6450; }
.kocan--one { border: 2px solid var(--murekkep); box-shadow: 6px 6px 0 var(--yesil); }
.kocan__damga { position: absolute; right: 14px; top: 44px; }
.kocan__ad { font-weight: 800; font-size: 26px; letter-spacing: -.02em; }
.kocan__kisi { font-family: var(--f-daktilo); font-size: 14px; color: var(--yesil); }
.kocan__icerik { margin-top: 2px; font-family: var(--f-daktilo); font-size: 13px; font-style: italic; color: var(--murekkep-2); }
.kocan__kalemler { flex: 1; display: flex; flex-direction: column; margin: 12px 0 4px; font-family: var(--f-daktilo); font-size: 13px; line-height: 1.35; }
.kocan__kalemler li { display: flex; gap: 8px; padding: 6px 0; border-bottom: 1px dotted var(--cizgi); }
.kocan__kalemler li::after { content: "✓"; margin-left: auto; font-weight: 700; color: var(--yesil); }
.kocan__fiyat { margin: 12px 0 10px; font-family: var(--f-lcd); font-size: 36px; line-height: 1; }
.kocan .dg { align-self: flex-start; }

/* Boş koçan: size özel paket */
.ozel-kocan { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) auto; gap: 10px 40px; align-items: center; margin-top: 22px; padding: 18px 26px 26px; border: 2px dashed var(--murekkep-2); border-radius: 4px; }
.ozel-kocan .kocan__no { grid-column: 1 / -1; margin-bottom: 4px; }
.ozel-kocan__yazi .soluk { margin-top: 6px; max-width: 520px; }
.ozel-kocan__satirlar { display: flex; flex-direction: column; }
.ozel-kocan__satirlar span { min-height: 37px; border-bottom: 1px solid var(--satir); font-family: var(--f-el); font-size: 24px; line-height: 36px; color: var(--tukenmez); }
@media (max-width: 860px) { .ozel-kocan { grid-template-columns: 1fr; } .ozel-kocan .dg { justify-self: start; } }

/* Tasdik şerhi: noter onaylı defter sayfası */
.tasdik-bolum { padding-bottom: var(--bosluk); }
.tasdik {
  display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(250px, 1fr); gap: 36px 52px; padding: 34px 40px 38px;
  background: var(--beyaz); border: 1px solid var(--cizgi);
  box-shadow: inset 0 0 0 9px var(--beyaz), inset 0 0 0 10px var(--cizgi), 0 24px 40px -30px rgba(30, 42, 36, .5);
}
.tasdik__bas, .tutanak__bas, .cep__bas { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 20px; padding-bottom: 10px; border-bottom: 2px solid var(--murekkep); font-family: var(--f-daktilo); font-weight: 700; font-size: 13px; letter-spacing: .08em; }
.tasdik__bas { margin-bottom: 24px; }
.tasdik__metin { margin-top: 18px; max-width: 640px; font-family: var(--f-daktilo); font-size: 16px; line-height: 1.75; color: var(--murekkep-2); }
.tasdik__maddeler { counter-reset: madde; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(250px, 100%), 1fr)); gap: 4px 28px; margin-top: 22px; }
.tasdik__maddeler li { counter-increment: madde; display: flex; gap: 10px; padding: 8px 0; border-bottom: 1px dotted var(--cizgi); font-weight: 600; }
.tasdik__maddeler li::before { content: counter(madde) "."; font-family: var(--f-daktilo); font-weight: 700; color: var(--kirmizi); }
.tasdik__sag { display: flex; flex-direction: column; align-items: center; justify-content: center; padding-left: 44px; border-left: 1.5px dashed var(--cizgi); }
.muhur {
  width: 176px; color: var(--tukenmez); font-family: var(--f-daktilo); transform: rotate(-12deg); opacity: .8;
  -webkit-mask-image: radial-gradient(circle at 35% 35%, #000 50%, rgba(0, 0, 0, .65) 80%);
  mask-image: radial-gradient(circle at 35% 35%, #000 50%, rgba(0, 0, 0, .65) 80%);
}
.tasdik__imza { position: relative; margin-top: -34px; padding: 0 18px; font-family: var(--f-el); font-size: 42px; line-height: 1.1; color: var(--tukenmez); transform: rotate(-4deg); }
.tasdik__kunye { width: 100%; margin: 22px 0 0; border-top: 1.5px solid var(--murekkep); font-family: var(--f-daktilo); font-size: 13px; }
.tasdik__kunye div { display: flex; justify-content: space-between; gap: 12px; padding: 7px 0; border-bottom: 1px dotted var(--cizgi); }
.tasdik__kunye dt { color: var(--murekkep-2); }
.tasdik__kunye dd { margin: 0; font-weight: 700; }
@media (max-width: 760px) {
  .tasdik { grid-template-columns: 1fr; padding: 26px 22px 30px; }
  .tasdik__sag { padding: 30px 0 0; border-left: 0; border-top: 1.5px dashed var(--cizgi); }
}

/* Mobil: yapışkan notlar, senkron kaydı ve telefon */
.notlar { display: flex; flex-wrap: wrap; gap: 14px 16px; margin-top: 30px; }
.notlar li { position: relative; padding: 12px 18px 14px; background: var(--lcd-sari); color: var(--murekkep); font-family: var(--f-el); font-size: 25px; line-height: 1.1; box-shadow: 0 12px 16px -12px rgba(0, 0, 0, .7); transform: rotate(-2deg); }
.notlar li:nth-child(even) { transform: rotate(1.5deg); background: #F3E3A1; }
.notlar li::before { content: ""; position: absolute; left: 50%; top: -8px; width: 46px; height: 16px; margin-left: -23px; background: rgba(245, 239, 224, .45); transform: rotate(-3deg); }
.cep { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; margin: 0; }
.cep__kayit { position: relative; z-index: 1; margin-right: -40px; padding: 18px 60px 22px 22px; background: var(--beyaz); color: var(--murekkep); transform: rotate(-1.5deg); box-shadow: 8px 8px 0 var(--yesil); }
.cep__kayit li { display: grid; grid-template-columns: 46px minmax(0, 1fr) auto 18px; gap: 10px; align-items: baseline; padding: 11px 0; border-bottom: 1px dotted var(--cizgi); font-family: var(--f-lcd); font-size: 15px; }
.cep__saat { color: var(--murekkep-2); }
.cep__aciklama { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: var(--f-baslik); }
.cep__tamam { font-weight: 800; text-align: center; color: var(--yesil); }
.cep__satir--kirmizi .cep__aciklama, .cep__satir--kirmizi .cep__tamam { font-weight: 700; color: var(--kirmizi); }
.cep__telefon { position: relative; z-index: 2; width: clamp(150px, 15vw, 196px); border: 8px solid #0E1512; border-radius: 28px; transform: rotate(4deg); box-shadow: 0 30px 50px -20px rgba(0, 0, 0, .75); }
.cep__not { grid-column: 1 / -1; margin-top: 22px; font-family: var(--f-el); font-size: 27px; color: var(--lcd-sari); transform: rotate(-2deg); }
.cep__not::before { content: "↑ "; }
@media (max-width: 560px) {
  .cep { grid-template-columns: 1fr; }
  .cep__kayit { margin: 0 0 -48px; padding-right: 22px; }
  .cep__telefon { justify-self: end; margin-right: 12px; }
}

/* Teslim tutanağı: 3 adımda başlayın */
.tutanak { position: relative; padding: 22px 28px 30px; background: var(--beyaz); color: var(--murekkep); border-radius: 3px; box-shadow: 8px 8px 0 var(--yesil); }
.tutanak__adimlar { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.tutanak__adim { display: flex; flex-direction: column; gap: 10px; padding: 26px 28px 6px; }
.tutanak__adim:first-child { padding-left: 0; }
.tutanak__adim:last-child { padding-right: 0; }
.tutanak__adim + .tutanak__adim { border-left: 1.5px dashed var(--cizgi); }
.bolum--koyu .tutanak .soluk { color: var(--murekkep-2); }
.tutanak__no { font-family: var(--f-lcd); font-size: 44px; line-height: 1; color: var(--yesil); }
.tutanak__imza { display: flex; flex-direction: column; align-items: flex-start; margin-top: auto; padding-top: 18px; font-family: var(--f-daktilo); font-size: 12px; color: var(--murekkep-2); }
.tutanak__imza > span:last-child { align-self: stretch; padding-top: 4px; border-top: 1.5px solid var(--murekkep); }
.tutanak__el { padding-left: 8px; font-family: var(--f-el); font-size: 30px; line-height: 1.1; color: var(--tukenmez); transform: rotate(-3deg); }
.tutanak__damga { position: absolute; right: 30px; top: 78px; background: rgba(255, 253, 246, .75); }
.bolum--koyu .tutanak .damga--yesil { color: var(--yesil); border-color: var(--yesil); }
@media (max-width: 820px) {
  .tutanak__adimlar { grid-template-columns: 1fr; }
  .tutanak__adim, .tutanak__adim:first-child, .tutanak__adim:last-child { padding: 22px 0 10px; }
  .tutanak__adim + .tutanak__adim { border-left: 0; border-top: 1.5px dashed var(--cizgi); }
  .tutanak__damga { position: static; margin: 18px 0 0 8px; font-size: 16px; }
}

/* Yazar kasa fişi */
.fis {
  width: 100%; max-width: 400px; margin-inline: auto; padding: 26px 26px 38px;
  background: #FFFFFF; font-family: var(--f-lcd); font-size: 14px;
  box-shadow: 0 26px 40px -24px rgba(30, 42, 36, .5); transform: rotate(-1.2deg);
  -webkit-mask: conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) bottom / 16px 51% repeat-x, linear-gradient(#000 0 0) top / 100% calc(100% - 8px) no-repeat;
  mask: conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) bottom / 16px 51% repeat-x, linear-gradient(#000 0 0) top / 100% calc(100% - 8px) no-repeat;
}
.fis__bas { text-align: center; font-size: 15px; line-height: 1.5; }
.fis__meta { margin-top: 6px; padding-bottom: 12px; border-bottom: 1.5px dashed var(--murekkep); text-align: center; font-size: 12px; color: var(--murekkep-2); }
.fis__liste a { display: flex; justify-content: space-between; gap: 12px; padding: 11px 2px; border-bottom: 1px dotted var(--cizgi); text-decoration: none; }
.fis__liste a:hover { background: var(--kagit-2); }
.fis__toplam { display: flex; justify-content: space-between; margin-top: 14px; padding-top: 10px; border-top: 1.5px dashed var(--murekkep); font-size: 17px; }
.fis__dip { margin-top: 16px; text-align: center; font-size: 12px; color: var(--murekkep-2); }

/* Sektörler ve SSS */
.sektorler { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.sektorler li { padding: 6px 14px; border: 1.5px solid var(--murekkep); border-radius: 999px; font-family: var(--f-daktilo); font-size: 14px; background: var(--beyaz); }
.sektorler a { text-decoration: none; }
.sss { margin-top: 18px; border-top: 2px solid var(--murekkep); }
.sss details { border-bottom: 1px solid var(--cizgi); padding: 18px 0; }
.sss summary { display: flex; justify-content: space-between; gap: 16px; font-weight: 700; font-size: 18px; cursor: pointer; list-style: none; }
.sss summary::-webkit-details-marker { display: none; }
.sss summary::after { content: "+"; font-family: var(--f-daktilo); color: var(--kirmizi); }
.sss details[open] summary::after { content: "−"; }
.sss details p { margin-top: 10px; color: var(--murekkep-2); }
.sss--koyu { border-top-color: var(--kagit); }
.sss--koyu details { border-bottom-color: #3B4A43; }
.sss--koyu details p { color: #C9D4CE; }

/* Demo: form kâğıdı */
.adimlar { display: flex; flex-direction: column; gap: 12px; margin-top: 28px; }
.adimlar li { display: flex; align-items: center; gap: 12px; }
.adim { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border: 2px solid var(--lcd-sari); border-radius: 50%; font-family: var(--f-daktilo); font-weight: 700; color: var(--lcd-sari); }
.form-kagit, .hesap {
  display: flex; flex-direction: column; gap: 18px; padding: 24px 26px 28px;
  background: var(--beyaz); color: var(--murekkep); border-radius: 3px;
  box-shadow: 8px 8px 0 var(--yesil);
}
.form-kagit__bas { display: flex; justify-content: space-between; padding-bottom: 10px; border-bottom: 2px solid var(--murekkep); font-family: var(--f-daktilo); font-weight: 700; font-size: 13px; letter-spacing: .08em; }
.alanlar { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr)); gap: 18px 22px; }
.alanlar--cift { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.alan { display: flex; flex-direction: column; gap: 4px; font-family: var(--f-daktilo); font-size: 13px; font-weight: 700; color: var(--murekkep-2); }
.alan--tam { grid-column: 1 / -1; }
.girdi { width: 100%; padding: 8px 2px; border: 0; border-bottom: 2px solid var(--murekkep); border-radius: 0; background: transparent; color: var(--tukenmez); font-family: var(--f-baslik); font-size: 17px; font-weight: 500; }
.girdi:focus { outline: none; border-bottom-color: var(--kirmizi); background: var(--kagit-2); }
.girdi--defter { font-family: var(--f-el); font-size: 23px; line-height: 34px; resize: vertical; background-image: repeating-linear-gradient(to bottom, transparent 0, transparent 33px, var(--satir) 33px, var(--satir) 34px); border-bottom: 0; }
.girdi::placeholder { color: #8E978F; }
.onay { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; color: var(--murekkep-2); }
.onay input { margin-top: 3px; width: 18px; height: 18px; accent-color: var(--yesil); }
.hata-yazi { color: var(--kirmizi); font-family: var(--f-daktilo); font-size: 13px; }
.hata-yazi ul { padding-left: 18px; list-style: disc; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.form-kagit .dg { align-self: flex-start; }
.basari { align-items: flex-start; }

/* 8. Ücretsiz araçlar ----------------------------------------------------- */
.iz { font-family: var(--f-daktilo); font-size: 14px; color: var(--murekkep-2); }
.iz a { text-decoration: none; }
.iz [aria-current] { color: var(--murekkep); }
.arac__kisa { font-size: 12px; font-weight: 700; color: var(--yesil); letter-spacing: .06em; }
.hesap__sonuc { display: grid; gap: 10px; margin: 6px 0 0; }
.formul { margin: 0; padding: 18px 20px; border-radius: 4px; background: var(--lcd); color: var(--lcd-yazi); font-family: var(--f-lcd); font-size: 16px; line-height: 1.8; white-space: pre-wrap; box-shadow: inset 0 3px 8px rgba(0, 0, 0, .35); }

/* Liste: esnafın masası; her araç ürettiği belgenin minyatürüyle */
.esnaf-masasi { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(340px, 100%), 1fr)); gap: 28px; }
.nesne { display: flex; flex-direction: column; gap: 18px; padding: 16px 16px 24px; background: var(--beyaz); border: 1px solid var(--cizgi); border-radius: 3px; text-decoration: none; transition: transform .15s, box-shadow .15s; }
.nesne:hover { color: var(--murekkep); transform: translate(-2px, -2px); box-shadow: 6px 6px 0 var(--yesil); }
.nesne__gorsel {
  position: relative; display: flex; align-items: center; justify-content: center; height: 190px; overflow: hidden; border-radius: 2px;
  background: radial-gradient(circle at 30% 20%, #3C6456, #284539 70%);
}
.nesne__gorsel > * { transition: rotate .25s, translate .25s; box-shadow: 0 16px 22px -12px rgba(0, 0, 0, .65); }
.nesne:hover .nesne__gorsel > * { rotate: 0deg; translate: 0 -4px; }
.nesne__yazi { display: flex; flex-direction: column; gap: 6px; padding-inline: 8px; }
.nesne__cikti { margin-top: 6px; font-family: var(--f-daktilo); font-size: 13px; font-weight: 700; color: var(--kirmizi); }

.mini-fis {
  position: relative; display: flex; flex-direction: column; gap: 3px; width: 140px; padding: 12px 12px 20px; rotate: -4deg;
  background: #FFF; font-family: var(--f-lcd); font-size: 11px; color: var(--murekkep);
  -webkit-mask: conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) bottom / 10px 51% repeat-x, linear-gradient(#000 0 0) top / 100% calc(100% - 5px) no-repeat;
  mask: conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) bottom / 10px 51% repeat-x, linear-gradient(#000 0 0) top / 100% calc(100% - 5px) no-repeat;
}
.mini-fis b { padding-bottom: 4px; border-bottom: 1px dashed; font-weight: 400; text-align: center; }
.mini-fis i, .mini-cek i, .mini-defter i, .mini-makbuz i, .mini-makine i { font-style: normal; }
.mini-fis u { padding-top: 4px; border-top: 1px dashed; text-decoration: none; font-size: 14px; text-align: right; }
.mini-fis .damga { margin-top: 6px; align-self: center; font-size: 9px; }
.mini-cek {
  display: grid; gap: 4px; width: 250px; padding: 10px 14px; rotate: 3deg;
  background-color: #DCEBE1; background-image: repeating-linear-gradient(45deg, rgba(31, 111, 92, .07) 0 2px, transparent 2px 6px);
  border: 1px solid #A9CBB9; font-family: var(--f-daktilo); font-size: 11px; color: var(--murekkep);
}
.mini-cek b { letter-spacing: .3em; color: var(--yesil); }
.mini-cek i { font-family: var(--f-el); font-size: 18px; color: var(--tukenmez); }
.mini-cek u { justify-self: end; padding: 0 8px; border: 1px solid var(--murekkep); text-decoration: none; font-family: var(--f-lcd); font-size: 16px; background: #FFF; }
.mini-cek em { font-family: var(--f-lcd); font-size: 11px; font-style: normal; letter-spacing: .2em; color: var(--murekkep-2); }
.mini-defter {
  display: flex; flex-direction: column; width: 210px; padding: 6px 12px 8px 36px; rotate: -2deg;
  background-color: var(--kagit-2);
  background-image: linear-gradient(90deg, transparent 24px, var(--kenar) 24px, var(--kenar) 25.5px, transparent 25.5px), repeating-linear-gradient(to bottom, transparent 0, transparent 27px, var(--satir) 27px, var(--satir) 28px);
  font-family: var(--f-el); font-size: 20px; line-height: 28px; color: var(--tukenmez);
}
.mini-defter s { text-decoration-color: var(--kirmizi); text-decoration-thickness: 2px; }
.mini-makbuz {
  position: relative; display: flex; flex-direction: column; gap: 4px; width: 220px; padding: 12px 14px 16px 26px; rotate: 2deg;
  background: #FFFEF8; border-left: 2px dashed var(--cizgi); font-family: var(--f-daktilo); font-size: 10px; color: var(--murekkep-2);
}
.mini-makbuz b { padding-bottom: 4px; border-bottom: 1.5px solid var(--murekkep); font-size: 11px; color: var(--yesil); letter-spacing: .06em; }
.mini-makbuz i { font-family: var(--f-el); font-size: 17px; color: var(--tukenmez); }
.mini-makbuz .damga { position: absolute; right: 10px; bottom: 12px; font-size: 9px; }
.mini-mektup { display: flex; flex-direction: column; gap: 8px; width: 150px; padding: 16px 16px 18px; rotate: -3deg; background: #FFF; font-family: var(--f-daktilo); font-size: 10px; color: var(--murekkep); }
.mini-mektup b { text-align: center; letter-spacing: .1em; }
.mini-mektup i { display: block; height: 5px; border-radius: 2px; background: #E3DCC8; }
.mini-mektup i:nth-of-type(2) { width: 80%; }
.mini-mektup i:nth-of-type(3) { width: 60%; }
.mini-mektup__kutu { margin-top: 6px; padding-top: 6px; border-top: 1px dashed var(--murekkep-2); }
.mini-makine { width: 124px; padding: 10px; rotate: 4deg; background: var(--murekkep); border-radius: 10px; }
.mini-makine u { display: block; padding: 4px 8px; border-radius: 3px; background: var(--lcd); color: var(--lcd-yazi); font-family: var(--f-lcd); font-size: 18px; text-align: right; text-decoration: none; }
.mini-makine__tuslar { display: grid; grid-template-columns: repeat(4, 1fr); gap: 5px; margin-top: 8px; }
.mini-makine__tuslar i { padding: 4px 0; border-radius: 3px; background: #3A4A42; color: var(--kagit); font-family: var(--f-lcd); font-size: 11px; text-align: center; }
.mini-makine__tuslar i:nth-child(4) { background: var(--kirmizi); }

/* Araç sayfası başı ve çalışma masası */
.sayfa-bas--arac { padding-bottom: 36px; }
.arac-bas { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 24px 48px; }
.arac-bas > div:first-child { max-width: 780px; }
.arac-bas__damgalar { display: flex; gap: 18px; padding-bottom: 12px; }
.masa-bolum { padding-bottom: var(--bosluk); }
.masa { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.12fr); gap: 40px 48px; align-items: start; }
@media (max-width: 980px) { .masa { grid-template-columns: 1fr; } }
.cikti-alani { position: sticky; top: 96px; display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.cikti-dugmeler { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; }
.cikti-dugmeler__not { font-family: var(--f-daktilo); font-size: 12px; color: var(--murekkep-2); }
.cikti__bos { padding: 40px 24px; border: 2px dashed var(--cizgi); font-family: var(--f-el); font-size: 24px; text-align: center; color: var(--murekkep-2); }

/* Form parçaları: küme, küpür (banknot adedi), tekrar eden satırlar */
.kume { display: flex; flex-direction: column; gap: 12px; min-width: 0; margin: 0; padding: 16px 0 0; border: 0; border-top: 1.5px dashed var(--cizgi); }
.kume legend { padding: 0 8px 0 0; font-family: var(--f-daktilo); font-weight: 700; font-size: 13px; letter-spacing: .06em; text-transform: uppercase; color: var(--yesil); }
.alan small { font-weight: 400; }
.kupurler { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px 20px; }
.kupur { display: grid; grid-template-columns: 70px 14px minmax(0, 1fr); align-items: center; gap: 6px; }
.kupur__deger { padding: 4px 6px; border: 1px solid #B8CDB4; border-radius: 3px; background: #E7EFE3; font-family: var(--f-lcd); font-size: 15px; text-align: center; white-space: nowrap; }
.kupur--bozuk { grid-column: 1 / -1; grid-template-columns: 110px 14px minmax(0, 150px); }
.kupur__x { font-family: var(--f-daktilo); text-align: center; color: var(--murekkep-2); }
.satirlar { display: flex; flex-direction: column; gap: 10px; }
.satir { position: relative; display: grid; gap: 6px 10px; align-items: end; padding: 0 38px 10px 0; border-bottom: 1px dotted var(--cizgi); }
.satir--iki { grid-template-columns: minmax(0, 1fr) 120px; }
.satir--cek { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.satir--borc { grid-template-columns: minmax(0, 1fr) 110px 150px; }
.satir--borc [name="tel"] { grid-column: 1 / -1; }
@media (max-width: 620px) {
  .satir--borc { grid-template-columns: 1fr 1fr; }
  .satir--borc [name="ad"] { grid-column: 1 / -1; }
}
.satir__sil { position: absolute; right: 0; top: 4px; width: 28px; height: 28px; border: 1.5px solid var(--cizgi); border-radius: 50%; background: transparent; color: var(--murekkep-2); font-size: 12px; cursor: pointer; }
.satir__sil:hover { border-color: var(--kirmizi); color: var(--kirmizi); }
.satir-ekle { align-self: flex-start; padding: 6px 2px; border: 0; border-bottom: 2px solid var(--yesil); background: transparent; font-family: var(--f-daktilo); font-weight: 700; color: var(--yesil); cursor: pointer; }
.satir-ekle:hover { color: var(--kirmizi); border-color: var(--kirmizi); }
.girdi--ince { padding: 5px 2px; border-bottom-width: 1px; font-size: 14px; }
.girdi--mesaj { padding: 8px 10px; border: 1.5px solid var(--cizgi); font-size: 15px; line-height: 1.5; resize: vertical; }
.hesap[hidden] { display: none; }

/* Belge kâğıdı (çek portföyü, veresiye) ve özet LCD'ler */
.belge { padding: 22px 24px 28px; background: var(--beyaz); border: 1px solid var(--cizgi); box-shadow: 0 24px 40px -28px rgba(30, 42, 36, .5); }
.belge__bas { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 16px; padding-bottom: 10px; border-bottom: 2px solid var(--murekkep); font-family: var(--f-daktilo); font-weight: 700; font-size: 13px; letter-spacing: .08em; }
.belge__ara { margin: 26px 0 10px; font-family: var(--f-daktilo); font-weight: 700; font-size: 12px; letter-spacing: .1em; color: var(--yesil); }
.ozet { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 10px; margin: 16px 0 0; }
.ozet .lcd { flex-direction: column; align-items: flex-start; gap: 4px; padding: 10px 12px; }
.lcd__sayi--orta { font-size: 20px; text-align: left; }
.lcd--kirmizi { background-color: #F1C7C0; }

/* Kasa fişi */
.fis--belge { max-width: 390px; transform: rotate(-.6deg); }
.fis__satir { display: flex; justify-content: space-between; gap: 12px; padding: 3px 0; }
.fis__satir > :first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fis__satir--toplam { margin-top: 4px; padding-top: 6px; border-top: 1.5px dashed var(--murekkep); font-size: 16px; }
.fis__ara { margin: 16px 0 4px; font-size: 12px; letter-spacing: .1em; color: var(--murekkep-2); }
.fis__fark { display: flex; justify-content: space-between; margin-top: 18px; padding: 10px 0; border-block: 3px double var(--murekkep); font-size: 20px; }
.fis__damga { margin: 20px 0 6px; text-align: center; }
.fis__imzalar { display: flex; gap: 24px; margin-top: 34px; }
.fis__imzalar span { flex: 1; padding-top: 4px; border-top: 1px solid var(--murekkep); font-size: 11px; text-align: center; }

/* Vade takvimi ve bordro */
.takvim { display: flex; flex-direction: column; gap: 14px; }
.takvim__hafta { padding: 10px 12px 8px; border-left: 4px solid var(--yesil); background: var(--kagit-2); }
.takvim__hafta--gecmis { border-left-color: var(--kirmizi); background: #FBEDEA; }
.takvim__bas { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 12px; font-weight: 800; }
.takvim__net { display: flex; gap: 12px; font-family: var(--f-lcd); }
.takvim__net b { font-weight: 400; }
.takvim__net .giris, .takvim__liste .giris .takvim__tutar { color: var(--yesil); }
.takvim__net .cikis, .takvim__liste .cikis .takvim__tutar { color: var(--kirmizi); }
.takvim__cubuk { display: flex; flex-direction: column; gap: 3px; margin: 8px 0 6px; }
.takvim__cubuk span { display: block; height: 6px; border-radius: 3px; }
.takvim__cubuk-giris { background: var(--yesil); }
.takvim__cubuk-cikis { background: var(--kirmizi); }
.takvim__liste li { display: grid; grid-template-columns: 112px minmax(0, 1fr) auto; gap: 10px; padding: 5px 0; border-top: 1px dotted var(--cizgi); font-size: 15px; }
.takvim__gun { font-family: var(--f-daktilo); font-size: 13px; color: var(--murekkep-2); }
.takvim__firma { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.takvim__firma small { margin-left: 8px; font-family: var(--f-daktilo); font-size: 11px; text-transform: uppercase; color: var(--kirmizi); }
.takvim__tutar { font-family: var(--f-lcd); }
.bordro { overflow-x: auto; }
.bordro table { width: 100%; border-collapse: collapse; font-family: var(--f-daktilo); font-size: 13px; }
.bordro th { padding: 6px; border-bottom: 2px solid var(--murekkep); text-align: left; }
.bordro td { padding: 6px; border-bottom: 1px dotted var(--cizgi); }
.bordro th:last-child, .bordro td:last-child { text-align: right; white-space: nowrap; }
.bordro tfoot td { border-bottom: 0; font-weight: 700; }
.bordro tfoot tr:first-child td { border-top: 2px solid var(--murekkep); }

/* Veresiye yaşlandırma */
.yas { display: flex; gap: 2px; height: 28px; margin-top: 18px; overflow: hidden; border-radius: 4px; }
.yas__dilim { flex-basis: 0; min-width: 6px; }
.yas--0 { background: #4E9A7E; }
.yas--1 { background: #D6B648; }
.yas--2 { background: #E07B3C; }
.yas--3 { background: var(--kirmizi); }
.yas__lejant { display: flex; flex-wrap: wrap; gap: 6px 18px; margin-top: 10px; font-family: var(--f-daktilo); font-size: 12px; }
.yas__lejant li { display: flex; align-items: center; gap: 6px; }
.yas__lejant i { display: inline-block; width: 12px; height: 12px; border-radius: 2px; }
.aranacak li { display: grid; grid-template-columns: 30px minmax(0, 1fr) auto auto auto; align-items: center; gap: 8px 12px; padding: 10px 0; border-bottom: 1px dotted var(--cizgi); }
.aranacak__no { font-family: var(--f-lcd); color: var(--murekkep-2); }
.aranacak__ad { display: flex; flex-direction: column; min-width: 0; font-weight: 700; }
.aranacak__ad small { font-family: var(--f-daktilo); font-size: 12px; font-weight: 400; color: var(--murekkep-2); }
.aranacak__kova { padding: 2px 8px; border-radius: 999px; font-family: var(--f-daktilo); font-size: 11px; color: #FFF; white-space: nowrap; }
.aranacak__kova.yas--1 { color: var(--murekkep); }
.aranacak__tutar { font-family: var(--f-lcd); font-size: 16px; text-align: right; }
.aranacak__dugme { display: inline-block; padding: 5px 10px; border: 1.5px solid var(--yesil); border-radius: 4px; background: transparent; color: var(--yesil); font-family: var(--f-daktilo); font-weight: 700; font-size: 12px; text-decoration: none; white-space: nowrap; cursor: pointer; }
.aranacak__dugme:hover { background: var(--yesil); color: #FFF; }
@media (max-width: 560px) {
  .aranacak li { grid-template-columns: 26px minmax(0, 1fr) auto; }
  .aranacak__kova { grid-column: 2; justify-self: start; }
  .aranacak__aksiyon { grid-column: 3; }
}

/* Tahsilat makbuzu: asıl + suret */
.makbuzlar { display: flex; flex-direction: column; }
.makbuzlar__kes, .mektup__kes { display: flex; align-items: center; gap: 10px; margin: 12px 0; font-family: var(--f-daktilo); font-size: 12px; color: var(--murekkep-2); }
.makbuzlar__kes::before, .makbuzlar__kes::after { content: ""; flex: 1; border-top: 1.5px dashed var(--murekkep-2); }
.makbuz { position: relative; padding: 22px 22px 20px; overflow: hidden; background: #FFFEF8; border: 1.5px solid var(--murekkep); box-shadow: 0 20px 30px -24px rgba(30, 42, 36, .5); }
.makbuz__kopya { position: absolute; left: 50%; top: 0; padding: 1px 12px; translate: -50% 0; background: var(--murekkep); color: var(--kagit); font-family: var(--f-daktilo); font-size: 10px; letter-spacing: .3em; }
.makbuz__bas { display: flex; justify-content: space-between; gap: 16px; padding-bottom: 10px; border-bottom: 2px solid var(--murekkep); }
.makbuz__isletme { font-weight: 800; font-size: 18px; }
.makbuz__adres { font-family: var(--f-daktilo); font-size: 12px; color: var(--murekkep-2); }
.makbuz__sag { font-family: var(--f-daktilo); font-size: 12px; text-align: right; white-space: nowrap; }
.makbuz__baslik { font-weight: 700; font-size: 14px; letter-spacing: .08em; color: var(--yesil); }
.makbuz__alanlar { display: flex; flex-direction: column; gap: 6px; margin: 12px 0 0; }
.makbuz__alanlar div { display: grid; grid-template-columns: 104px minmax(0, 1fr); gap: 10px; padding-bottom: 4px; border-bottom: 1px dotted var(--cizgi); }
.makbuz__alanlar dt { font-family: var(--f-daktilo); font-size: 12px; color: var(--murekkep-2); }
.makbuz__alanlar dd { margin: 0; font-family: var(--f-el); font-size: 21px; line-height: 1.1; color: var(--tukenmez); }
.makbuz__tutar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin-top: 12px; }
.makbuz__rakam { padding: 2px 12px; border: 2px solid var(--murekkep); font-family: var(--f-lcd); font-size: 24px; }
.makbuz__yazi { font-family: var(--f-el); font-size: 20px; line-height: 1.15; color: var(--tukenmez); }
.makbuz__metin { margin-top: 8px; font-size: 13px; color: var(--murekkep-2); }
.makbuz__imzalar { display: flex; gap: 30px; margin-top: 28px; }
.makbuz__imzalar span { display: flex; flex: 1; justify-content: space-between; align-items: baseline; gap: 8px; padding-top: 4px; border-top: 1px solid var(--murekkep); font-family: var(--f-daktilo); font-size: 11px; }
.makbuz__imzalar b { font-family: var(--f-el); font-size: 18px; font-weight: 500; color: var(--tukenmez); }
.makbuz__damga { position: absolute; right: 24px; top: 52%; }

/* Mutabakat mektubu */
.mektup { display: flex; flex-direction: column; gap: 12px; padding: 34px 38px 30px; background: #FFF; border: 1px solid var(--cizgi); box-shadow: 0 24px 40px -28px rgba(30, 42, 36, .5); font-size: 15px; line-height: 1.65; }
.mektup__bas { display: flex; justify-content: space-between; gap: 16px; padding-bottom: 12px; border-bottom: 2px solid var(--murekkep); font-size: 13px; color: var(--murekkep-2); }
.mektup__firma { font-weight: 800; font-size: 18px; color: var(--murekkep); }
.mektup__tarih { font-family: var(--f-daktilo); white-space: nowrap; }
.mektup__baslik { margin: 6px 0; font-size: 16px; font-weight: 800; letter-spacing: .08em; text-align: center; }
.mektup__imza { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; font-weight: 700; }
.mektup__kase { display: flex; align-items: center; justify-content: center; width: 160px; height: 72px; border: 1.5px dashed var(--murekkep-2); font-family: var(--f-daktilo); font-size: 11px; font-weight: 400; color: var(--murekkep-2); }
.mektup__kes { margin-top: 14px; padding-top: 8px; border-top: 1.5px dashed var(--murekkep-2); }
.mektup__yanit { display: flex; flex-direction: column; gap: 10px; font-size: 14px; }
.mektup__kutular { display: flex; gap: 30px; font-weight: 700; }
@media (max-width: 560px) { .mektup { padding: 24px 20px; } .mektup__kase { width: 120px; } }

/* Esnaf hesap makinesi: tuşlar sekme, kâğıt şerit form */
.makine { max-width: 780px; margin-inline: auto; padding: 18px 20px 24px; background: var(--murekkep); border-radius: 18px; box-shadow: 0 30px 50px -28px rgba(0, 0, 0, .7), inset 0 2px 0 rgba(255, 255, 255, .08); }
.makine__ust { display: flex; justify-content: space-between; align-items: center; padding: 0 4px 14px; font-family: var(--f-lcd); font-size: 13px; letter-spacing: .2em; color: #9FB0A8; }
.makine__gunes { width: 74px; height: 18px; border-radius: 3px; background: repeating-linear-gradient(90deg, #3B3326 0 12px, #2A241B 12px 14px); }
.tuslar { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 18px; }
.tus { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 10px 6px 12px; border-radius: 8px; background: #33433B; color: var(--kagit); font-family: var(--f-daktilo); font-weight: 700; font-size: 13px; text-align: center; text-decoration: none; box-shadow: 0 4px 0 #111A16; transition: translate .08s, box-shadow .08s, background .12s; }
.tus:hover { background: #3D5047; color: var(--kagit); }
.tus__isaret { font-family: var(--f-lcd); font-size: 22px; line-height: 1; color: var(--lcd-sari); }
.tus[aria-current="true"] { background: var(--kirmizi); translate: 0 3px; box-shadow: 0 1px 0 #111A16; }
.tus[aria-current="true"] .tus__isaret { color: #FFF; }
.makine__paneller { display: flex; flex-direction: column; gap: 16px; }
.makine .hesap { box-shadow: none; }
@media (max-width: 560px) { .tuslar { grid-template-columns: repeat(2, minmax(0, 1fr)); } .makine { padding: 14px 12px 18px; } }

/* Yazdırma: araç sayfasında yalnızca belge basılır */
@media print {
  @page { margin: 12mm; }
  body:has([data-cikti]) { background: #FFF; }
  body:has([data-cikti]) > :not(main), main:has([data-cikti]) > :not(.masa-bolum), .masa > form, .cikti-dugmeler, .yazdirma, noscript { display: none !important; }
  .masa-bolum { padding: 0; }
  .masa-bolum .kap { max-width: none; padding: 0; opacity: 1 !important; translate: none !important; }
  .masa { display: block; }
  .cikti-alani { position: static; }
  .fis, .belge, .makbuz, .mektup { transform: none !important; box-shadow: none !important; }
  .fis--belge { margin-inline: auto; border: 1px solid #DDD; }
  .belge { border: 0; padding: 0; }
  .mektup { border: 0; padding: 0; }
  .makbuz, .takvim__hafta, .aranacak li { break-inside: avoid; }
  * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* 9. Yasal ve hata -------------------------------------------------------- */
.yasal { max-width: 800px; }
.yasal h2 { margin-top: 36px; font-size: 26px; font-weight: 800; }
.yasal p { margin-top: 12px; color: var(--murekkep-2); }
.yasal ul { margin-top: 12px; padding-left: 22px; list-style: disc; }
.yasal li { margin-top: 8px; color: var(--murekkep-2); }
.yasal a { text-decoration: underline; }
.yasal-tablo { margin-top: 16px; overflow-x: auto; }
.yasal-tablo table { width: 100%; min-width: 560px; border-collapse: collapse; font-size: 15px; }
.yasal-tablo th, .yasal-tablo td { text-align: left; vertical-align: top; padding: 10px 12px; border-bottom: 1px solid var(--cizgi); color: var(--murekkep-2); }
.yasal-tablo thead th { font-size: 12px; text-transform: uppercase; letter-spacing: .04em; color: var(--murekkep); }
.yasal-tablo tbody th { color: var(--murekkep); font-weight: 700; }
.hata-sayfa { min-height: 60vh; display: flex; align-items: center; }

/* 10. Hareket ------------------------------------------------------------- */
/* Efektler ayrı translate/scale özellikleriyle yazıldı; öğelerin eğik duruşu (transform: rotate) bozulmaz.
   JS kapalıysa ya da hareket azaltma tercihi açıksa her şey baştan görünür. */
@keyframes kay-yukari { from { opacity: 0; translate: 0 28px; } }
@keyframes kay-soldan { from { opacity: 0; translate: -36px 0; } }
@keyframes kay-sagdan { from { opacity: 0; translate: 48px 0; } }
@keyframes damga-bas { 0% { opacity: 0; scale: 1.9; } 55% { opacity: 1; scale: .92; } 75% { scale: 1.03; } 100% { scale: 1; } }
@keyframes el-yaz { from { clip-path: inset(-20% 100% -20% 0); } to { clip-path: inset(-20% 0 -20% 0); } }

@media (prefers-reduced-motion: no-preference) {
  /* İlk açılış: giriş yazısı soldan, defter sağdan kayar; "Programa geçti" damgası en son basılır */
  .giris__yazi > * { animation: kay-soldan .7s cubic-bezier(.2, .7, .2, 1) both; }
  .giris__yazi > :nth-child(2) { animation-delay: .08s; }
  .giris__yazi > :nth-child(3) { animation-delay: .16s; }
  .giris__yazi > :nth-child(4) { animation-delay: .24s; }
  .giris__yazi > :nth-child(5) { animation-delay: .32s; }
  .giris__defter { animation: kay-sagdan .9s .15s cubic-bezier(.2, .7, .2, 1) both; }
  .giris__telefon { animation: kay-yukari .8s .55s cubic-bezier(.2, .7, .2, 1) both; }
  .giris .damga { animation: damga-bas .5s .6s both; }
  .giris__gecti.damga { animation-delay: 1.1s; }

  /* Ekrana giren bölüm aşağıdan kayar; içindeki kartlar sırayla gelir */
  .belir-on main > section:not(:first-child) > .kap { opacity: 0; translate: 0 34px; transition: opacity .7s ease, translate .8s cubic-bezier(.2, .7, .2, 1); }
  .belir-on main > section:not(:first-child) > .kap.is-in { opacity: 1; translate: none; }
  .belir-on [data-sira] { opacity: 0; translate: 0 22px; transition: opacity .55s ease, translate .65s cubic-bezier(.2, .7, .2, 1); transition-delay: calc(var(--sira, 0) * 90ms + 180ms); }
  .belir-on .is-in [data-sira] { opacity: 1; translate: none; }

  /* Bölüm görününce damgalar ve mühür basılır, el yazıları yazılır */
  .belir-on main > section:not(:first-child) > .kap:not(.is-in) :is(.damga, .muhur, .tasdik__imza, .tutanak__el, .cep__not) { opacity: 0; }
  .belir-on .is-in :is(.damga, .muhur) { animation: damga-bas .5s .75s both; }
  .belir-on .is-in .tutanak__damga { animation-delay: 1.5s; }
  .belir-on .is-in :is(.tasdik__imza, .cep__not) { animation: el-yaz 1.1s 1.1s ease-out both; }
  .belir-on .is-in .tutanak__adim .tutanak__el { animation: el-yaz .8s ease-out both; }
  .belir-on .is-in .tutanak__adim:nth-child(1) .tutanak__el { animation-delay: .7s; }
  .belir-on .is-in .tutanak__adim:nth-child(2) .tutanak__el { animation-delay: .95s; }
  .belir-on .is-in .tutanak__adim:nth-child(3) .tutanak__el { animation-delay: 1.2s; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; }
}