/* ofispanom.com — DESIGN-GUIDE.md ile uyumlu site stilleri */
@font-face {
  font-family: "Inter";
  src: url("fonts/InterVariable-tr.woff2") format("woff2");
  font-weight: 100 900;
  font-display: swap;
}

:root {
  --brand-ink: #173C70;
  --brand-pin: #F5AE39;
  --accent: #1E4B8D;
  --bg: #F9F6F3;
  --surface: #FFFEFD;
  --surface-2: #F3EFEB;
  --line: #E6E0D9;
  --line-strong: #D6CEC5;
  --fg: #1C1812;
  --fg-muted: #524C45;
  --fg-subtle: #6D6861;
  --st-active: #05773B;
  --st-warning: #A76100;
  --st-danger: #C2272D;
  --wrap: 1160px;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-font-smoothing: antialiased; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { font-family: "Inter", system-ui, sans-serif; font-feature-settings: "cv05"; background: var(--bg); color: var(--fg); font-size: 16px; line-height: 1.55; }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 16px; }
@media (min-width: 768px) { .wrap { padding: 0 32px; } }
.tnum { font-variant-numeric: tabular-nums; }

/* Düğmeler */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 48px; padding: 0 20px; border-radius: 10px;
  font: inherit; font-size: 15px; font-weight: 600; text-decoration: none; border: 1px solid transparent; cursor: pointer; white-space: nowrap; }
.btn-pri { background: var(--accent); color: #fff; }
.btn-pri:hover { background: var(--brand-ink); }
.btn-sec { background: var(--surface); border-color: var(--line-strong); color: var(--fg); }
.btn-sec:hover { border-color: var(--fg-subtle); }
.btn:focus-visible { outline: 3px solid #9FB5D6; outline-offset: 2px; }

/* Üst menü */
.nav { position: sticky; top: 0; z-index: 10; background: rgba(249, 246, 243, .94); border-bottom: 1px solid var(--line); }
.nav .wrap { display: flex; align-items: center; height: 64px; gap: 28px; }
.nav .logo img { height: 30px; width: auto; }
.nav ul.menu { display: none; list-style: none; gap: 24px; font-size: 15px; font-weight: 500; color: var(--fg-muted); }
.nav ul a { text-decoration: none; }
.nav ul a:hover { color: var(--fg); }
.nav .btn { margin-left: auto; height: 40px; padding: 0 14px; font-size: 14px; }
@media (min-width: 1000px) { .nav ul.menu { display: flex; } }

/* Hero */
.hero { padding: 48px 0 0; overflow: hidden; }
.hero .wrap { display: grid; gap: 40px; }
.eyebrow { display: inline-flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 600; color: var(--fg-muted); }
.eyebrow::before { content: ""; width: 9px; height: 9px; border-radius: 50%; background: var(--brand-pin); }
.hero h1 { font-size: 40px; line-height: 1.06; font-weight: 700; letter-spacing: -0.03em; color: var(--brand-ink); margin-top: 18px; }
.hero p.lead { font-size: 18px; color: var(--fg-muted); margin-top: 18px; max-width: 520px; }
.hero .ctas { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px; }
.hero .facts { display: flex; flex-wrap: wrap; gap: 8px 20px; margin-top: 28px; font-size: 14px; color: var(--fg-subtle); }
.hero .facts span { display: inline-flex; align-items: center; gap: 7px; }
.hero .facts svg { color: var(--st-active); }
.stage { position: relative; height: 520px; }
.board { position: absolute; inset: 40px 0 0 0; background: var(--brand-ink); border-radius: 22px 22px 0 0; }
.phone { position: absolute; width: 270px; border-radius: 40px; border: 9px solid #1C1812; background: #1C1812; overflow: hidden; }
.phone img { border-radius: 31px; }
.stage .phone.a { left: 50%; margin-left: -150px; top: 0; transform: rotate(-3deg); z-index: 2; }
.stage .phone.b { display: none; }
.stage .tag { position: absolute; z-index: 3; background: var(--surface); border: 1px solid var(--line); border-radius: 10px; padding: 10px 14px; font-size: 14px; font-weight: 600; }
.stage .tag small { display: block; font-weight: 500; color: var(--fg-subtle); font-size: 12.5px; }
.stage .tag.t1 { left: 4px; top: 180px; transform: rotate(-2deg); }
.stage .tag.t2 { right: 4px; top: 330px; transform: rotate(2deg); }
.stage .tag i { position: absolute; top: -7px; left: 50%; margin-left: -7px; width: 14px; height: 14px; border-radius: 50%; background: var(--brand-pin); }
@media (min-width: 960px) {
  .hero { padding-top: 72px; }
  .hero .wrap { grid-template-columns: 1fr 1fr; align-items: end; gap: 24px; }
  .hero .copy { padding-bottom: 96px; }
  .hero h1 { font-size: 56px; line-height: 1.04; }
  .stage { height: 620px; }
  .board { inset: 60px -200px 0 30px; }
  .stage .phone.a { left: 90px; margin: 0; width: 290px; }
  .stage .phone.b { display: block; left: 330px; top: 90px; width: 260px; transform: rotate(4deg); z-index: 1; }
  .stage .tag.t1 { left: -10px; top: 230px; }
  .stage .tag.t2 { left: 300px; right: auto; top: 470px; }
}

/* Bölümler */
section.blk { padding: 72px 0; border-top: 1px solid var(--line); }
.blk h2 { font-size: 30px; line-height: 1.12; font-weight: 700; letter-spacing: -0.025em; max-width: 640px; }
.blk .sub { font-size: 17px; color: var(--fg-muted); margin-top: 14px; max-width: 600px; }
.num { font-size: 13px; font-weight: 650; color: var(--fg-subtle); margin-bottom: 14px; font-variant-numeric: tabular-nums; }
@media (min-width: 960px) { section.blk { padding: 104px 0; } .blk h2 { font-size: 40px; } }

/* 1 · Dağınık iş */
.scatter { margin-top: 44px; display: grid; gap: 28px; }
.scraps { position: relative; height: 330px; }
.scrap { position: absolute; background: var(--surface); border: 1px solid var(--line-strong); border-radius: 4px; padding: 12px 14px; font-size: 13.5px; color: var(--fg-muted); width: 170px; line-height: 1.4; }
.scrap b { display: block; color: var(--fg); font-size: 14px; margin-bottom: 4px; }
.scrap.s1 { left: 0; top: 10px; transform: rotate(-6deg); }
.scrap.s2 { left: 44%; top: 0; transform: rotate(4deg); }
.scrap.s3 { left: 8%; top: 140px; transform: rotate(3deg); background: #FFFBEF; }
.scrap.s4 { left: 52%; top: 128px; transform: rotate(-3deg); }
.scrap.s5 { left: 26%; top: 236px; transform: rotate(-1deg); }
.arrow { display: none; }
.onepano { background: var(--brand-ink); color: #fff; border-radius: 18px; padding: 28px; position: relative; }
.onepano::before { content: ""; position: absolute; top: -8px; left: 40px; width: 18px; height: 18px; border-radius: 50%; background: var(--brand-pin); }
.onepano h3 { font-size: 22px; font-weight: 700; letter-spacing: -0.02em; }
.onepano ul { list-style: none; margin-top: 14px; display: grid; gap: 8px; color: #D6E0EE; font-size: 15px; }
.onepano li { display: flex; gap: 10px; align-items: center; }
.onepano li::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #9FB5D6; flex: none; }
.cite { font-size: 13px; color: var(--fg-subtle); margin-top: 24px; max-width: 560px; }
.cite b { color: var(--fg); font-weight: 650; }
@media (min-width: 960px) {
  .scatter { grid-template-columns: 1.2fr 80px 1fr; align-items: center; }
  .arrow { display: block; color: var(--fg-subtle); }
}

/* Özellik bölümleri */
.feat .wrap { display: grid; gap: 40px; align-items: center; }
.feat .phone { position: relative; width: 280px; margin: 0 auto; transform: rotate(-2deg); }
.feat.flip .phone { transform: rotate(2deg); }
.feat ul.points { list-style: none; margin-top: 26px; display: grid; gap: 14px; }
.feat ul.points li { display: grid; grid-template-columns: 26px 1fr; gap: 10px; font-size: 16px; color: var(--fg-muted); }
.feat ul.points b { color: var(--fg); font-weight: 600; }
.feat ul.points svg { color: var(--brand-ink); margin-top: 2px; }
.pair { display: flex; gap: 20px; justify-content: center; align-items: flex-start; }
.pair .phone { width: 240px; margin: 0; }
.pair .phone + .phone { display: none; }
@media (min-width: 960px) {
  .feat .wrap { grid-template-columns: 1fr 1fr; gap: 64px; }
  .feat.flip .media { order: -1; }
  .pair .phone + .phone { display: block; margin-top: 60px; }
}

/* Türkiye'ye göre */
.tr-grid { display: grid; gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: 16px; overflow: hidden; margin-top: 40px; }
.tr-grid div { background: var(--surface); padding: 22px; }
.tr-grid h3 { font-size: 16px; font-weight: 650; letter-spacing: -0.01em; }
.tr-grid p { font-size: 15px; color: var(--fg-muted); margin-top: 6px; }
@media (min-width: 720px) { .tr-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1040px) { .tr-grid { grid-template-columns: repeat(4, 1fr); } }

/* Yönetici */
.desk-shot { margin-top: 40px; border: 1px solid var(--line-strong); border-radius: 14px; overflow: hidden; background: var(--surface); }
.desk-shot .bar { height: 30px; border-bottom: 1px solid var(--line); display: flex; gap: 6px; align-items: center; padding: 0 12px; }
.desk-shot .bar i { width: 9px; height: 9px; border-radius: 50%; background: var(--line-strong); }
.nots { display: grid; gap: 10px; margin-top: 24px; }
.nots div { display: flex; gap: 10px; font-size: 15px; color: var(--fg-muted); }
.nots svg { flex: none; color: var(--fg-subtle); margin-top: 3px; }
@media (min-width: 900px) { .nots { grid-template-columns: repeat(3, 1fr); gap: 24px; } }

/* SSS */
.faq { margin-top: 36px; border-top: 1px solid var(--line-strong); }
.faq details { border-bottom: 1px solid var(--line-strong); }
.faq summary { list-style: none; cursor: pointer; padding: 20px 36px 20px 0; font-size: 17px; font-weight: 600; letter-spacing: -0.01em; position: relative; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: ""; position: absolute; right: 6px; top: 50%; width: 10px; height: 10px; margin-top: -7px; border-right: 2px solid var(--fg-subtle); border-bottom: 2px solid var(--fg-subtle); transform: rotate(45deg); }
.faq details[open] summary::after { transform: rotate(-135deg); margin-top: -2px; }
.faq p { padding: 0 0 22px; color: var(--fg-muted); max-width: 720px; }
@media (min-width: 960px) { .faq-wrap { display: grid; grid-template-columns: 1fr 1.6fr; gap: 64px; } .faq { margin-top: 0; } }

/* Tanıtım */
.demo { background: var(--brand-ink); color: #fff; border-top: 0; }
.demo .wrap { display: grid; gap: 36px; }
.demo h2 { color: #fff; }
.demo .sub { color: #C9D6EA; }
.demo ol { list-style: none; counter-reset: s; margin-top: 28px; display: grid; gap: 14px; }
.demo ol li { counter-increment: s; display: grid; grid-template-columns: 34px 1fr; gap: 12px; color: #D6E0EE; }
.demo ol li::before { content: counter(s); width: 28px; height: 28px; border-radius: 50%; border: 1.5px solid #6F8DB8; display: grid; place-items: center; font-size: 13px; font-weight: 650; color: #fff; }
.demo ol b { color: #fff; font-weight: 600; }
form.card { background: var(--surface); color: var(--fg); border-radius: 18px; padding: 24px; display: grid; gap: 14px; position: relative; }
form.card::before { content: ""; position: absolute; top: -9px; left: 50%; margin-left: -9px; width: 18px; height: 18px; border-radius: 50%; background: var(--brand-pin); }
form label { font-size: 14px; font-weight: 600; display: grid; gap: 6px; }
form input, form select, form textarea { font: inherit; font-size: 16px; height: 46px; border: 1px solid var(--line-strong); border-radius: 9px; padding: 0 12px; background: var(--surface); color: var(--fg); width: 100%; }
form input:focus, form select:focus, form textarea:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px #D5E0F0; }
form .row2 { display: grid; gap: 14px; }
form .fine { font-size: 13px; color: var(--fg-subtle); }
@media (min-width: 600px) { form .row2 { grid-template-columns: 1fr 1fr; } }
@media (min-width: 960px) { .demo .wrap { grid-template-columns: 1fr 1fr; gap: 72px; align-items: start; } form.card { padding: 32px; } }

/* Alt bilgi */
footer { padding: 48px 0 40px; font-size: 14px; color: var(--fg-subtle); }
footer .wrap { display: grid; gap: 28px; }
footer img { height: 28px; width: auto; }
footer .cols { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
footer h2 { font-size: 13px; color: var(--fg); font-weight: 650; margin-bottom: 8px; }
footer ul { list-style: none; display: grid; gap: 6px; }
footer a { text-decoration: none; }
footer a:hover { color: var(--fg); }
footer .legal { border-top: 1px solid var(--line); padding-top: 20px; display: flex; flex-wrap: wrap; gap: 8px 24px; justify-content: space-between; }
@media (min-width: 900px) { footer .wrap { grid-template-columns: 1.4fr 2fr; } footer .cols { grid-template-columns: repeat(3, 1fr); } footer .legal { grid-column: 1 / -1; } }

/* ───────── Çok sayfalı site eklemeleri ───────── */
.sprite { position: absolute; }
.atla { position: absolute; left: 16px; top: -60px; z-index: 50; background: var(--accent); color: #fff; padding: 10px 14px; border-radius: 9px; font-weight: 600; text-decoration: none; }
.atla:focus { top: 12px; }
a:focus-visible, summary:focus-visible { outline: 3px solid #9FB5D6; outline-offset: 2px; border-radius: 4px; }
.nav nav { display: contents; }
.nav ul.menu a[aria-current="page"] { color: var(--brand-ink); font-weight: 600; }
.nav .nav-cta { display: none; }
@media (min-width: 1000px) { .nav .nav-cta { display: inline-flex; } .mobil-menu { display: none; } }

/* Mobil menü (betiksiz, details ile) */
.mobil-menu { margin-left: auto; }
.mobil-menu summary { list-style: none; cursor: pointer; width: 44px; height: 44px; display: grid; place-content: center; gap: 5px; border: 1px solid var(--line-strong); border-radius: 10px; background: var(--surface); }
.mobil-menu summary::-webkit-details-marker { display: none; }
.mobil-menu summary span { display: block; width: 18px; height: 2px; background: var(--fg); border-radius: 2px; transition: transform .2s, opacity .2s; }
.mobil-menu[open] summary span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.mobil-menu[open] summary span:nth-child(2) { opacity: 0; }
.mobil-menu[open] summary span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
.mobil-panel { position: absolute; left: 0; right: 0; top: 64px; background: var(--bg); border-bottom: 1px solid var(--line); padding: 8px 16px 20px; box-shadow: 0 16px 32px rgba(28, 24, 18, .08); }
.mobil-panel ul { list-style: none; display: grid; }
.mobil-panel li a { display: block; padding: 14px 0; border-bottom: 1px solid var(--line); text-decoration: none; font-size: 17px; font-weight: 550; }
.mobil-panel li a[aria-current="page"] { color: var(--brand-ink); }
.mobil-panel .btn { width: 100%; margin-top: 18px; }
@media (prefers-reduced-motion: reduce) { .mobil-menu summary span { transition: none; } }

/* Sayfa başı (iç sayfalar) */
.sayfa-bas { padding: 56px 0 48px; }
.sayfa-bas h1 { font-size: 36px; line-height: 1.08; font-weight: 700; letter-spacing: -0.03em; color: var(--brand-ink); margin-top: 16px; max-width: 760px; }
.sayfa-bas .lead { font-size: 18px; color: var(--fg-muted); margin-top: 16px; max-width: 640px; }
.sayfa-bas .ctas { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
@media (min-width: 960px) { .sayfa-bas { padding: 88px 0 64px; } .sayfa-bas h1 { font-size: 52px; } }

/* İçindekiler çipleri */
.cipler { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 28px; list-style: none; }
.cipler a { display: inline-flex; height: 36px; align-items: center; padding: 0 14px; border-radius: 999px; border: 1px solid var(--line-strong); background: var(--surface); font-size: 14px; font-weight: 550; text-decoration: none; color: var(--fg-muted); }
.cipler a:hover { color: var(--fg); border-color: var(--fg-subtle); }
[id] { scroll-margin-top: 84px; }

/* Kart ızgarası */
.kartlar { display: grid; gap: 16px; margin-top: 40px; }
.kart { background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: 24px; }
.kart .ik { width: 40px; height: 40px; border-radius: 10px; background: #E8EEF7; color: var(--brand-ink); display: grid; place-items: center; margin-bottom: 16px; }
.kart h3 { font-size: 17px; font-weight: 650; letter-spacing: -0.01em; }
.kart p { font-size: 15px; color: var(--fg-muted); margin-top: 6px; }
.kart ul { margin-top: 10px; padding-left: 18px; color: var(--fg-muted); font-size: 15px; display: grid; gap: 4px; }
.kart a.devam { display: inline-flex; gap: 6px; align-items: center; margin-top: 14px; font-size: 15px; font-weight: 600; color: var(--accent); text-decoration: none; }
.kart a.devam:hover { text-decoration: underline; }
@media (min-width: 720px) { .kartlar { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1040px) { .kartlar.uc { grid-template-columns: repeat(3, 1fr); } }

/* Talep türleri çipleri */
.turler { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin-top: 24px; }
.turler li { padding: 7px 12px; border-radius: 999px; background: var(--surface-2); font-size: 14px; font-weight: 550; color: var(--fg-muted); }

/* Akış (zaman çizelgesi örneği) */
.akis { list-style: none; margin-top: 28px; border-left: 2px solid var(--line-strong); padding-left: 22px; display: grid; gap: 18px; }
.akis li { position: relative; font-size: 15px; color: var(--fg-muted); }
.akis li::before { content: ""; position: absolute; left: -29px; top: 5px; width: 12px; height: 12px; border-radius: 50%; background: var(--surface); border: 2px solid var(--accent); }
.akis li.bitti::before { background: var(--accent); }
.akis b { color: var(--fg); font-weight: 600; display: block; }

/* Karşılaştırma tablosu */
.tablo-sar { margin-top: 36px; overflow-x: auto; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); }
table.kars { width: 100%; border-collapse: collapse; font-size: 15px; min-width: 560px; }
table.kars th, table.kars td { text-align: left; padding: 14px 18px; border-bottom: 1px solid var(--line); vertical-align: top; }
table.kars thead th { font-size: 13px; font-weight: 650; color: var(--fg-subtle); background: var(--surface-2); }
table.kars tbody th { font-weight: 600; width: 34%; }
table.kars td { color: var(--fg-muted); }
table.kars tr:last-child th, table.kars tr:last-child td { border-bottom: 0; }
table.kars td.biz { color: var(--fg); font-weight: 550; background: #F4F7FB; }

/* Yapmadıklarımız listesi */
.yok-liste { list-style: none; display: grid; gap: 12px; margin-top: 28px; }
.yok-liste li { display: grid; grid-template-columns: 26px 1fr; gap: 10px; color: var(--fg-muted); font-size: 16px; }
.yok-liste svg { color: var(--st-danger, #C2272D); margin-top: 3px; }
.yok-liste b { color: var(--fg); font-weight: 600; }

/* Adımlar */
.adimlar { list-style: none; counter-reset: a; display: grid; gap: 16px; margin-top: 40px; }
.adimlar li { counter-increment: a; background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: 24px; position: relative; }
.adimlar li::before { content: counter(a); display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--brand-ink); color: #fff; font-size: 14px; font-weight: 650; margin-bottom: 14px; }
.adimlar h3 { font-size: 17px; font-weight: 650; }
.adimlar p { color: var(--fg-muted); font-size: 15px; margin-top: 6px; }
@media (min-width: 900px) { .adimlar { grid-template-columns: repeat(3, 1fr); } }

/* Alıntı / hikâye */
.hikaye { max-width: 720px; }
.hikaye p { font-size: 18px; color: var(--fg-muted); margin-top: 18px; }
.hikaye p.vurgu { color: var(--brand-ink); font-weight: 650; font-size: 21px; letter-spacing: -0.01em; }

/* Değerler */
.degerler { display: grid; gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: 16px; overflow: hidden; margin-top: 40px; }
.degerler div { background: var(--surface); padding: 24px; }
.degerler h3 { font-size: 18px; font-weight: 700; letter-spacing: -0.015em; color: var(--brand-ink); }
.degerler h3 span { color: var(--fg-subtle); font-weight: 500; }
.degerler p { color: var(--fg-muted); font-size: 15px; margin-top: 6px; }
@media (min-width: 720px) { .degerler { grid-template-columns: 1fr 1fr; } }

/* Çağrı bandı */
.cagri { background: var(--brand-ink); color: #fff; border-radius: 20px; padding: 36px 28px; position: relative; display: grid; gap: 20px; }
.cagri::before { content: ""; position: absolute; top: -9px; left: 40px; width: 18px; height: 18px; border-radius: 50%; background: var(--brand-pin); }
.cagri h2 { color: #fff; font-size: 26px; line-height: 1.15; letter-spacing: -0.02em; max-width: 560px; }
.cagri p { color: #C9D6EA; max-width: 520px; }
.cagri .btn-pri { background: #fff; color: var(--brand-ink); }
.cagri .btn-pri:hover { background: #E8EEF7; }
.cagri .btn-sec { background: transparent; color: #fff; border-color: #6F8DB8; }
.cagri .ctas { display: flex; flex-wrap: wrap; gap: 10px; }
section.cagri-blok { padding: 24px 0 96px; }
@media (min-width: 960px) { .cagri { grid-template-columns: 1.4fr 1fr; align-items: center; padding: 48px; } .cagri .ctas { justify-content: flex-end; } .cagri h2 { font-size: 32px; } }

/* Uzun metin (hukuki sayfalar) */
.metin { max-width: 760px; padding-bottom: 96px; }
.metin h2 { font-size: 22px; font-weight: 700; letter-spacing: -0.015em; margin-top: 40px; }
.metin h3 { font-size: 17px; font-weight: 650; margin-top: 24px; }
.metin p, .metin li { color: var(--fg-muted); font-size: 16px; }
.metin p { margin-top: 12px; }
.metin ul, .metin ol { margin-top: 12px; padding-left: 22px; display: grid; gap: 6px; }
.metin a { color: var(--accent); }
.metin .tarih { font-size: 14px; color: var(--fg-subtle); }
.metin b { color: var(--fg); font-weight: 600; }
.metin .kutu { background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: 20px 22px; margin-top: 20px; }
.metin .kutu ul { list-style: none; padding: 0; }

/* Form eklemeleri */
form textarea { height: auto; padding: 10px 12px; resize: vertical; min-height: 84px; line-height: 1.45; }
form .ist { font-weight: 500; color: var(--fg-subtle); }
form .tuzak { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
form label.onay { display: grid; grid-template-columns: 22px 1fr; gap: 10px; font-weight: 500; font-size: 14px; color: var(--fg-muted); align-items: start; }
form label.onay input { width: 18px; height: 18px; margin-top: 2px; accent-color: var(--accent); }
form label.onay a { color: var(--accent); }
form .form-durum:empty { display: none; }
form .form-durum { font-size: 15px; border-radius: 10px; padding: 12px 14px; background: #FDF1E6; color: #7A4700; }
form .form-durum.tamam { background: #E7F4EC; color: #05592C; }
form button[disabled] { opacity: .7; cursor: progress; }
form [aria-invalid="true"] { border-color: #C2272D; }
.tanitim-sayfa { padding: 0 0 96px; }
.tanitim-sayfa .wrap { display: grid; gap: 40px; }
.tanitim-sayfa form.card { border: 1px solid var(--line); }
@media (min-width: 960px) { .tanitim-sayfa .wrap { grid-template-columns: 1fr 1.1fr; gap: 72px; align-items: start; } }

/* Tek ekran görüntüsü kutusu */
.media.tek { display: flex; justify-content: center; }
.demo .num { color: #9FB5D6; }
.alt-marka p { margin-top: 12px; max-width: 300px; }
.platformlar { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; list-style: none; }
.platformlar li { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; background: var(--surface); border: 1px solid var(--line); border-radius: 10px; font-size: 14px; font-weight: 550; }
.platformlar svg { color: var(--brand-ink); }
.hata-sayfa { padding: 96px 0 120px; }
.hata-sayfa .kod { font-size: 15px; font-weight: 650; color: var(--fg-subtle); }
.devam-sat { margin-top: 24px; }
.devam-sat .devam, a.devam { display: inline-flex; gap: 6px; align-items: center; font-size: 15px; font-weight: 600; color: var(--accent); text-decoration: none; }
.devam-sat .devam:hover { text-decoration: underline; }
.sayfa-bas.sifir { padding: 0; }
.adimlar.tek-sutun { grid-template-columns: 1fr; margin-top: 0; }
.tanitim-sayfa .cite a { color: var(--accent); }