/*
 * Tanıtım sayfası — panelden ayrı, kasten sade.
 * Renkler: kırık beyaz zemin, koyu mürekkep yazı, tek vurgu koyu yeşil.
 * Panelin kendi stili web/src/styles.css; burayla karışmıyor.
 */

:root {
  --zemin: #FBFAF7;
  --kart: #FFFFFF;
  --murekkep: #1A1915;
  --soluk: #55524A;
  --sisli: #77746A;
  --cizgi: #E8E4D8;
  --yesil: #0E6E62;
  --yesil-koyu: #0A524A;
  --yesil-acik: #DCEAE6;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--zemin);
  color: var(--murekkep);
  font-family: 'Work Sans', -apple-system, 'Segoe UI', sans-serif;
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3 { font-family: 'Lora', Georgia, serif; font-weight: 600; letter-spacing: -0.01em; }
h1 { font-size: 54px; line-height: 1.12; margin: 0; text-wrap: pretty; }
h2 { font-size: 32px; line-height: 1.2; margin: 0; }
h3 { font-size: 20px; line-height: 1.3; margin: 0; }
p { margin: 0; }

a { color: var(--yesil); text-decoration: none; }
a:hover { color: var(--yesil-koyu); text-decoration: underline; }

.wrap { width: 100%; max-width: 1120px; margin: 0 auto; padding: 0 24px; }

/* ── Üst çubuk ───────────────────────────────────────────── */
.site-head { border-bottom: 1px solid var(--cizgi); background: var(--zemin); position: sticky; top: 0; z-index: 10; }
.head-in { display: flex; align-items: center; gap: 32px; padding-top: 16px; padding-bottom: 16px; }

.logo { display: flex; align-items: center; gap: 10px; color: var(--murekkep); }
.logo:hover { text-decoration: none; }
.logo-mark {
  width: 30px; height: 30px; border-radius: 8px; background: var(--yesil); color: #FFFFFF;
  font-family: 'Lora', Georgia, serif; font-weight: 600; font-size: 16px;
  display: flex; align-items: center; justify-content: center;
}
.logo-text { font-family: 'Lora', Georgia, serif; font-weight: 600; font-size: 18px; }

.nav { display: flex; align-items: center; gap: 26px; font-size: 15px; }
.nav a { color: var(--soluk); }
.nav a:hover { color: var(--murekkep); text-decoration: none; }

.head-actions { display: flex; align-items: center; gap: 12px; margin-left: auto; }
.link-btn { color: var(--soluk); font-size: 15px; padding: 10px 8px; }
.link-btn:hover { color: var(--murekkep); text-decoration: none; }

/* ── Düğmeler ────────────────────────────────────────────── */
.btn {
  display: inline-flex; align-items: center; justify-content: center;
  font: inherit; font-weight: 500; border-radius: 999px; border: 1px solid transparent;
  padding: 11px 22px; cursor: pointer; min-height: 44px; text-align: center;
}
.btn:hover { text-decoration: none; }
.btn-lg { padding: 14px 28px; font-size: 16px; }
.btn-primary { background: var(--yesil); color: #FFFFFF; }
.btn-primary:hover { background: var(--yesil-koyu); color: #FFFFFF; }
.btn-ghost { background: transparent; color: var(--murekkep); border-color: var(--cizgi); }
.btn-ghost:hover { border-color: var(--sisli); color: var(--murekkep); }
.btn[disabled] { opacity: 0.6; cursor: default; }

/* ── Kart ────────────────────────────────────────────────── */
.card { background: var(--kart); border: 1px solid var(--cizgi); border-radius: 18px; padding: 26px; }

.eyebrow { font-size: 13.5px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--sisli); }
.note { font-size: 14px; color: var(--sisli); }
.lede { font-size: 18.5px; line-height: 1.7; color: var(--soluk); }

/* ── Bölümler ────────────────────────────────────────────── */
.section { padding-top: 72px; display: flex; flex-direction: column; gap: 28px; }

/* .btn display'i hidden özniteliğini ezmesin (mağaza bağlantısı yayına kadar gizli) */
[hidden] { display: none !important; }

.price-head { display: flex; flex-direction: column; gap: 12px; max-width: 720px; }
.plans { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; align-items: stretch; }
.plan { position: relative; display: flex; flex-direction: column; gap: 16px; }
.plan-on { border: 2px solid var(--yesil); }
.plan-tag {
  position: absolute; top: -13px; left: 24px; padding: 4px 11px; border-radius: 99px;
  background: var(--yesil); color: #FFFFFF; font-size: 12.5px; font-weight: 500;
}
.plan-price { margin: 0; display: flex; align-items: baseline; gap: 4px; }
.plan-price b { font-family: 'Lora', Georgia, serif; font-size: 34px; font-weight: 600; letter-spacing: -0.01em; }
.plan-price span { color: var(--sisli); font-size: 15px; }
.plan-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 9px; flex: 1; }
.plan-list li { padding-left: 24px; position: relative; color: var(--soluk); }
.plan-list li::before { content: "✓"; position: absolute; left: 0; color: var(--yesil); font-weight: 600; }
.plan-list b { color: var(--murekkep); font-weight: 600; }
.plan .btn { align-self: stretch; text-align: center; }
.plan-soon { cursor: default; color: var(--sisli); }
.plan-soon:hover { border-color: var(--cizgi); color: var(--sisli); }

/* ── İletişim ────────────────────────────────────────────── */
.contact { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: 40px; align-items: start; }
.contact-copy { display: flex; flex-direction: column; gap: 14px; }
.contact-copy p { color: var(--soluk); }
.contact-form { display: flex; flex-direction: column; gap: 16px; }
.field { display: flex; flex-direction: column; gap: 7px; }
.field label { font-size: 14.5px; font-weight: 500; color: var(--soluk); }
.field input, .field textarea {
  font: inherit; color: var(--murekkep); background: var(--zemin);
  border: 1px solid var(--cizgi); border-radius: 12px; padding: 12px 14px; min-height: 44px;
}
.field textarea { resize: vertical; min-height: 120px; }
.field input:focus, .field textarea:focus { outline: 2px solid var(--yesil); outline-offset: 1px; border-color: transparent; }
.tuzak { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.form-status { font-size: 14.5px; color: var(--soluk); min-height: 22px; }
.form-status.ok { color: var(--yesil); }
.form-status.bad { color: #A23A2C; }

/* ── Alt bilgi ───────────────────────────────────────────── */
.site-foot { margin-top: 88px; border-top: 1px solid var(--cizgi); }
.foot-in { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 24px; padding-top: 24px; padding-bottom: 24px; font-size: 14px; color: var(--sisli); }
.foot-nav { display: flex; flex-wrap: wrap; gap: 20px; margin-left: auto; }
.foot-nav a { color: var(--sisli); }

/* ── Dar ekran ───────────────────────────────────────────── */
@media (max-width: 900px) {
  h1 { font-size: 38px; }
  h2 { font-size: 27px; }
  .nav { display: none; }
  .head-in { gap: 16px; }
  .contact { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .section { padding-top: 56px; }
  .plans { grid-template-columns: minmax(0, 1fr); gap: 26px; }
  .site-foot { margin-top: 56px; }
  .foot-nav { margin-left: 0; }
}

@media (max-width: 420px) {
  .wrap { padding: 0 16px; }
  /* Üst çubuk dar ekranda kırılmasın: logo ve düğme tek satır */
  .logo-text, .link-btn, .head-actions .btn { white-space: nowrap; }
  .head-in { gap: 10px; }
  .head-actions { gap: 4px; }
  .head-actions .btn { padding: 9px 14px; min-height: 40px; font-size: 14.5px; }
  h1 { font-size: 32px; }
  .lede { font-size: 17px; }
  .link-btn { padding: 10px 4px; }
  .btn-lg { padding: 13px 20px; font-size: 15.5px; }
}

/* ── yasal metin sayfaları ───────────────────────────────── */
.prose { max-width: 760px; padding-top: 56px; padding-bottom: 24px; }
.prose h1 { font-family: 'Lora', Georgia, serif; font-size: 40px; line-height: 1.15; margin: 0 0 8px; }
.prose h2 { font-family: 'Lora', Georgia, serif; font-size: 23px; margin: 40px 0 12px; }
.prose h3 { font-family: 'Lora', Georgia, serif; font-size: 18px; margin: 26px 0 8px; }
.prose p, .prose li { color: var(--soluk); line-height: 1.75; }
.prose p { margin: 0 0 14px; }
.prose ul { margin: 0 0 14px; padding-left: 20px; }
.prose li { margin-bottom: 8px; }
.prose b { color: var(--murekkep); }
.prose code { background: #FFFFFF; border: 1px solid var(--cizgi); border-radius: 6px; padding: 1px 6px; font-size: 13.5px; }
.prose-date { font-size: 14px; color: var(--sisli); margin-bottom: 28px; }
.prose-table { width: 100%; border-collapse: collapse; margin: 0 0 16px; font-size: 15px; }
.prose-table th, .prose-table td { text-align: left; vertical-align: top; padding: 11px 12px; border-bottom: 1px solid var(--cizgi); }
.prose-table th { font-weight: 600; color: var(--murekkep); background: #FFFFFF; }
.prose-table td { color: var(--soluk); }
.form-legal { font-size: 12.5px; line-height: 1.6; color: var(--sisli); margin: 0; }

@media (max-width: 640px) {
  .prose { padding-top: 36px; }
  .prose h1 { font-size: 30px; }
  .prose h2 { font-size: 20px; }
  .prose-table, .prose-table thead, .prose-table tbody, .prose-table tr, .prose-table th, .prose-table td { display: block; }
  .prose-table thead { display: none; }
  .prose-table tr { border-bottom: 1px solid var(--cizgi); padding: 10px 0; }
  .prose-table td { border: 0; padding: 3px 0; }
  .prose-table td:first-child { color: var(--murekkep); font-weight: 500; }
}

/* Kurucu üye programı notu (fiyat bölümü) */
.kurucu-not { margin: 22px 0 0; padding: 14px 18px; border-radius: 12px; background: var(--yesil-acik);
  border-left: 3px solid var(--yesil); color: var(--soluk); font-size: 15px; line-height: 1.6; }
.kurucu-not b { color: var(--yesil-koyu); }

/* ── Kâr hesaplayıcı (/trendyol-kar-hesaplama/) ─────────────── */
.kh { padding-top: 28px; padding-bottom: 72px; display: flex; flex-direction: column; gap: 28px; }
.kh-yol { font-size: 14px; color: var(--sisli); }
.kh-yol a { color: var(--sisli); }
.kh-bas { display: flex; flex-direction: column; gap: 14px; max-width: 760px; }
.kh-bas h1 { font-size: 44px; }
.kh-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 20px; align-items: start; }
.kh-form { display: flex; flex-direction: column; gap: 16px; }
.kh-alan { display: flex; flex-direction: column; gap: 6px; }
.kh-alan label { font-size: 15px; font-weight: 500; }
.kh-alan label span { color: var(--sisli); font-weight: 400; font-size: 13.5px; margin-left: 4px; }
.kh-alan input, .kh-alan select {
  font: inherit; font-size: 17px; color: var(--murekkep); background: var(--zemin);
  border: 1px solid var(--cizgi); border-radius: 12px; padding: 11px 14px; min-height: 46px; width: 100%;
  font-variant-numeric: tabular-nums;
}
.kh-alan input:focus, .kh-alan select:focus { outline: 2px solid var(--yesil); outline-offset: 1px; border-color: transparent; }
.kh-alan input.kh-bozuk { border-color: #B3452F; background: #FBEDEA; }
.kh-alan small { font-size: 13px; color: var(--sisli); }
.kh-ayrinti { border-top: 1px solid #EFEBDF; padding-top: 12px; }
.kh-ayrinti summary { cursor: pointer; font-size: 14.5px; color: var(--yesil); font-weight: 500; }
.kh-ayrinti[open] summary { margin-bottom: 14px; }
.kh-ayrinti .kh-alan + .kh-alan { margin-top: 14px; }
.kh-sonuc { position: sticky; top: 88px; display: flex; flex-direction: column; gap: 10px; }
.kh-etiket { font-size: 13.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--sisli); }
.kh-net { font-family: 'Lora', Georgia, serif; font-size: 46px; font-weight: 600; line-height: 1.1; color: var(--yesil);
  font-variant-numeric: tabular-nums; }
.kh-net.kh-kotu { color: #B3452F; }
.kh-marj { color: var(--soluk); font-size: 15px; min-height: 1.4em; }
.kh-durum { color: var(--soluk); font-size: 15px; padding-bottom: 6px; border-bottom: 1px solid #EFEBDF; }
.kh-satirlar { margin: 0; display: flex; flex-direction: column; }
.kh-satirlar > div { display: flex; justify-content: space-between; gap: 14px; padding: 10px 0; border-bottom: 1px solid #EFEBDF; }
.kh-satirlar > div:last-child { border-bottom: 0; }
.kh-satirlar dt { color: var(--soluk); }
.kh-satirlar dt .kh-alt { color: var(--sisli); font-size: 13px; }
.kh-satirlar dd { margin: 0; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.kh-not { font-size: 13px; color: var(--sisli); }
.kh-cta { display: flex; justify-content: space-between; align-items: center; gap: 28px; background: var(--yesil-acik); border-color: transparent; }
.kh-cta h2 { font-size: 24px; margin-bottom: 8px; }
.kh-cta p { color: var(--soluk); max-width: 640px; }
.kh-cta-dugme { display: flex; gap: 12px; flex-wrap: wrap; flex: none; }
.kh-yazi { max-width: 760px; display: flex; flex-direction: column; gap: 14px; }
.kh-yazi h2 { font-size: 26px; margin-top: 18px; }
.kh-yazi h3 { font-size: 18px; margin-top: 8px; }
.kh-yazi p, .kh-yazi li { color: var(--soluk); }
.kh-yazi ol { margin: 0; padding-left: 22px; display: flex; flex-direction: column; gap: 10px; }
.kh-yazi b { color: var(--murekkep); font-weight: 600; }

/* Başlığın sağında video kutusu (8 Ekim): kapak kendi dosyamız, oynatıcı tıklayınca gelir (site/video.js) */
.kh-ust { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 36px; align-items: end; }
.kh-video { margin: 0; display: flex; flex-direction: column; gap: 10px; }
.kh-video-kutu { position: relative; display: block; aspect-ratio: 16 / 9; border-radius: 14px; overflow: hidden;
  border: 1px solid var(--cizgi); background: var(--murekkep); }
.kh-video-kutu img, .kh-video-kutu iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; object-fit: cover; }
.kh-video-oynat { position: absolute; left: 50%; top: 50%; width: 60px; height: 60px; margin: -30px 0 0 -30px;
  border-radius: 50%; background: var(--yesil); box-shadow: 0 6px 22px rgba(0, 0, 0, .28); transition: transform .15s; }
.kh-video-oynat::after { content: ""; position: absolute; left: 24px; top: 18px; border-style: solid;
  border-width: 12px 0 12px 19px; border-color: transparent transparent transparent #fff; }
.kh-video-kutu:hover .kh-video-oynat { transform: scale(1.08); }
.kh-video-sure { position: absolute; right: 10px; bottom: 10px; padding: 2px 8px; border-radius: 6px;
  background: rgba(0, 0, 0, .72); color: #fff; font-size: 13px; font-weight: 500; }
.kh-video figcaption { font-size: 14px; color: var(--soluk); }
.kh-video figcaption b { color: var(--murekkep); font-weight: 600; }
@media (max-width: 980px) {
  .kh-ust { grid-template-columns: minmax(0, 1fr); gap: 22px; }
  .kh-video { max-width: 520px; }
}
@media (max-width: 860px) {
  .kh-grid { grid-template-columns: minmax(0, 1fr); }
  .kh-sonuc { position: static; }
  .kh-bas h1 { font-size: 34px; }
  .kh-cta { flex-direction: column; align-items: flex-start; }
}

/* ── Giriş / kayıt (24 Eylül) — site ile panel tek oturum ─────── */
button.link-btn { font: inherit; font-size: 15px; background: none; border: 0; cursor: pointer; }
.hesap-wrap { display: flex; justify-content: center; padding-top: 56px; padding-bottom: 72px; }
.hesap-kart {
  width: 100%; max-width: 440px; background: var(--kart); border: 1px solid var(--cizgi);
  border-radius: 20px; padding: 32px 30px;
}
.hesap-baslik { font-family: 'Lora', Georgia, serif; font-weight: 600; font-size: 28px; line-height: 1.2; margin: 0 0 8px; }
.hesap-alt { color: var(--soluk); margin: 0 0 22px; }
.hesap-form { display: flex; flex-direction: column; gap: 16px; }
.hesap-form .field input { width: 100%; }
.hesap-iki { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.hesap-satir { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 14.5px; margin-top: -4px; }
.hesap-gecis { margin: 18px 0 0; text-align: center; font-size: 14.5px; color: var(--soluk); }
.hesap-git { width: 100%; }
.check { display: inline-flex; align-items: center; gap: 8px; color: var(--soluk); cursor: pointer; user-select: none; }
.check input { width: 16px; height: 16px; margin: 0; accent-color: var(--yesil); }
.pw-wrap { position: relative; display: block; }
.pw-wrap input { width: 100%; padding-right: 46px; }
.pw-eye {
  position: absolute; right: 6px; top: 50%; transform: translateY(-50%);
  display: flex; align-items: center; justify-content: center; width: 36px; height: 36px;
  padding: 0; border: 0; border-radius: 10px; background: none; color: var(--sisli); cursor: pointer;
}
.pw-eye:hover { color: var(--murekkep); background: var(--yesil-acik); }
.pw-eye:focus-visible { outline: 2px solid var(--yesil); outline-offset: 1px; }
@media (max-width: 420px) {
  .hesap-wrap { padding-top: 28px; }
  .hesap-kart { padding: 24px 18px; border-radius: 16px; }
  .hesap-iki { grid-template-columns: 1fr; }
}

/* ── Chrome Web Store bağlantıları (24 Eylül, yayın) ─────────── */
.hesap-eklenti { width: 100%; max-width: 440px; margin: 16px auto 0; text-align: center; font-size: 14.5px; color: var(--soluk); }
.hesap-wrap { flex-direction: column; align-items: center; }
@media (max-width: 760px) {
  .head-chrome { display: none; }
}

/* ── Paketler: taslak sayfası ve ileride ana sayfa (24 Eylül) ── */
.taslak-not { margin: 28px 0 0; background: #FFF6EC; border: 1px solid #F0D9BF; border-radius: 12px; padding: 12px 16px; font-size: 14.5px; color: #6B4A22; }
.oneri { border-bottom: 2px dotted #9A8F78; }
.vurgu { color: #D9730D; font-weight: 700; }
.plan-list .alt, .kars .alt { display: block; font-size: 13.5px; color: var(--sisli); font-weight: 400; }
.lansman { margin: 0; background: var(--yesil-acik); border-radius: 12px; padding: 12px 16px; font-size: 15px; }
.takip-ne { padding: 26px 28px; }
.takip-ne h3 { margin: 0 0 14px; font-family: 'Lora', Georgia, serif; font-size: 22px; }
.takip-ne h4 { margin: 0 0 6px; font-size: 15px; }
.takip-ne ul { margin: 0 0 14px; padding-left: 18px; color: var(--soluk); font-size: 15px; }
.takip-ne li { margin-bottom: 4px; }
.tn-iki { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.tn-not { margin: 4px 0 0; font-size: 14.5px; color: var(--soluk); border-top: 1px solid var(--cizgi); padding-top: 12px; }
.kars-kap { overflow-x: auto; }
.kars { width: 100%; min-width: 560px; border-collapse: collapse; font-size: 15px; background: var(--kart); border: 1px solid var(--cizgi); }
.kars th, .kars td { padding: 11px 16px; border-bottom: 1px solid var(--cizgi); text-align: left; vertical-align: top; }
.kars thead th { background: #F4F2EC; font-weight: 600; }
.kars td:not(:first-child), .kars th:not(:first-child) { text-align: center; width: 20%; }
.kars .grup td { background: #FAF8F3; font-weight: 600; color: var(--soluk); font-size: 13.5px; letter-spacing: .04em; text-transform: uppercase; }
.kars .yok { color: #B9B4A6; }
.kars .pro { background: #F3F8F6; }
@media (max-width: 760px) {
  .tn-iki { grid-template-columns: 1fr; gap: 0; }
  .takip-ne { padding: 22px 18px; }
}

/* ── "Ne kadar sattı?" (24 Eylül) ────────────────────────────── */
.nks-form { display: flex; flex-direction: column; gap: 10px; padding: 24px; }
.nks-etiket-l { font-weight: 500; color: var(--soluk); font-size: 14.5px; }
.nks-satir { display: flex; gap: 12px; }
.nks-satir input { flex: 1; min-width: 0; font: inherit; color: var(--murekkep); background: var(--zemin);
  border: 1px solid var(--cizgi); border-radius: 12px; padding: 12px 14px; min-height: 52px; }
.nks-satir input:focus { outline: 2px solid var(--yesil); outline-offset: 1px; border-color: transparent; }
.nks-kucuk { margin: 0; font-size: 13.5px; color: var(--sisli); }
/* Örnek ürünle dene (27 Eyl): telefondan gelen linkini kopyalamadan görsün */
.nks-ornek-s { margin: 10px 0 0; font-size: 14.5px; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; }
.nks-ornek { font: inherit; font-weight: 600; color: var(--yesil); background: none; border: 0; padding: 6px 0;
  cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.nks-ornek:disabled { opacity: .6; cursor: default; }
.nks-kucuk.ok { color: var(--yesil); } .nks-kucuk.bad { color: #A23A2C; }
.nks-yukleniyor { display: flex; align-items: center; gap: 12px; padding: 22px; color: var(--soluk); }
.nks-spin { width: 18px; height: 18px; border: 2px solid var(--cizgi); border-top-color: var(--yesil); border-radius: 50%; animation: nks-don .7s linear infinite; }
@keyframes nks-don { to { transform: rotate(360deg); } }
.nks-hak-bitti { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 20px 24px; }
.nks-sonuc { padding: 26px; display: flex; flex-direction: column; gap: 20px; }
.nks-urun { display: flex; align-items: center; gap: 16px; }
.nks-urun img { width: 72px; height: 72px; object-fit: contain; border-radius: 12px; border: 1px solid var(--cizgi); background: #fff; flex: none; }
.nks-urun-yazi { flex: 1; min-width: 0; }
.nks-urun-yazi h2 { font-size: 21px; margin: 0 0 4px; line-height: 1.3; }
.nks-sil { color: var(--sisli); font-size: 14.5px; margin: 0; }
.nks-ac { flex: none; }
.nks-kartlar { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.nks-kart { border: 1px solid var(--cizgi); border-radius: 14px; padding: 14px 16px; display: flex; flex-direction: column; gap: 4px; }
.nks-kart-on { background: var(--yesil-acik); border-color: transparent; }
.nks-k { font-size: 13.5px; color: var(--sisli); }
.nks-kart b { font-family: 'Lora', Georgia, serif; font-size: 26px; font-weight: 600; line-height: 1.2; }
.nks-alt { font-size: 13px; color: var(--soluk); }
/* Üye kilidi (hesapsız ziyaretçi): bulanık yer tutucu + kayıt bağlantısı */
.nks-kilitli { background: var(--zemin); border-style: dashed; }
.nks-kart b.nks-bulanik { filter: blur(7px); opacity: .55; user-select: none; }
.nks-kilit { display: inline-flex; align-items: center; gap: 5px; font-size: 13.5px; font-weight: 600; white-space: nowrap; }
.nks-kilit svg { flex: none; }
.nks-not { grid-column: 1 / -1; margin: 0; font-size: 14px; color: var(--soluk); }
.nks-bilgi { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; margin: 0; }
.nks-bilgi dt { font-size: 13px; color: var(--sisli); }
.nks-bilgi dd { margin: 2px 0 0; font-weight: 600; }
.nks-bilgi s { color: var(--sisli); font-weight: 400; font-size: 13px; }
.nks-bildir { display: flex; flex-direction: column; gap: 10px; border: 1px dashed var(--cizgi); border-radius: 14px; padding: 16px; }
.nks-bildir label { color: var(--soluk); }
.nks-bildir-satir { display: flex; gap: 10px; }
.nks-bildir-satir input { flex: 1; min-width: 0; font: inherit; background: var(--zemin); border: 1px solid var(--cizgi); border-radius: 12px; padding: 10px 14px; }
.nks-ara { font-size: 17px; margin: 4px 0 -8px; }
.nks-tablo { width: 100%; border-collapse: collapse; font-size: 15px; }
.nks-tablo th, .nks-tablo td { text-align: left; padding: 9px 4px; border-bottom: 1px solid var(--cizgi); }
.nks-tablo th:last-child, .nks-tablo td:last-child { text-align: right; white-space: nowrap; }
.nks-tablo th { font-size: 13px; color: var(--sisli); font-weight: 500; }
.nks-etiket { display: inline-block; font-size: 11.5px; padding: 1px 8px; border-radius: 999px; background: var(--yesil-acik); color: var(--yesil-koyu); margin-left: 6px; }
.nks-diger { list-style: none; margin: 0; padding: 0; display: flex; gap: 10px; flex-wrap: wrap; }
.nks-diger li { border: 1px solid var(--cizgi); border-radius: 12px; padding: 8px 14px; display: flex; gap: 10px; }
.nks-cta { display: flex; justify-content: space-between; align-items: center; gap: 20px; background: var(--zemin); border-radius: 14px; padding: 16px 18px; color: var(--soluk); }
.nks-cta a:not(.btn) { display: block; margin-top: 6px; }
.nks-cta-d { display: flex; gap: 10px; flex: none; flex-wrap: wrap; }
.nks-gor { display: flex; flex-direction: column; gap: 18px; }
.nks-uc { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.nks-uc .card { display: flex; flex-direction: column; gap: 14px; }
.nks-uc h3 { margin: 0; }
@media (max-width: 860px) {
  .nks-kartlar, .nks-uc { grid-template-columns: minmax(0, 1fr); }
  .nks-bilgi { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .nks-cta, .nks-hak-bitti { flex-direction: column; align-items: stretch; }
}
@media (max-width: 520px) {
  .nks-satir, .nks-bildir-satir { flex-direction: column; }
  .nks-urun { flex-wrap: wrap; }
  /* Başlık görselin yanında kalsın, "Pazaryerinde aç" alta insin (uzun başlık kelime kelime kırılıyordu) */
  .nks-urun-yazi { flex-basis: calc(100% - 88px); }
  .nks-ac { flex-basis: 100%; }
  .nks-bilgi { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nks-sonuc { padding: 18px; }
}
.nks-tablo .nks-sag { text-align: right; white-space: nowrap; color: var(--soluk); }

/* ── Çerez izni (Google Analytics, 24 Eylül) ─────────────────── */
.cerez { position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 50; max-width: 760px; margin: 0 auto;
  display: flex; align-items: center; gap: 18px; padding: 16px 18px; background: var(--kart);
  border: 1px solid var(--cizgi); border-radius: 16px; box-shadow: 0 10px 30px rgba(26, 25, 21, .12); }
.cerez p { margin: 0; font-size: 14.5px; color: var(--soluk); line-height: 1.5; }
.cerez-d { display: flex; gap: 8px; flex: none; }
.cerez .btn { min-height: 40px; padding: 8px 16px; font-size: 14.5px; }
@media (max-width: 640px) {
  .cerez { flex-direction: column; align-items: stretch; gap: 12px; }
  .cerez-d .btn { flex: 1; }
}

/* Başlık tek satırda kalsın (24 Eylül: "Ne kadar sattı?" ve "Chrome'a ekle" eklenince
   1280 px'de yazılar iki satıra kırılıyordu). Dar ekranda önce başlıktaki
   "Chrome'a ekle" gizlenir (hero'da ve sayfa sonunda var), sonra menü. */
.logo-text, .nav a, .head-actions a, .head-actions button { white-space: nowrap; }
@media (max-width: 1240px) {
  .head-chrome { display: none; }
  .nav { gap: 20px; }
  .head-in { gap: 24px; }
}

/* ── Kaldırma anketi (site/kaldirdin/, 24 Eylül) ──────────────── */
.anket-kart { max-width: 560px; }
.anket-secenek { border: 0; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.anket-secenek legend { font-size: 14.5px; font-weight: 500; color: var(--soluk); margin-bottom: 8px; padding: 0; }
.anket-secenek label { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border: 1px solid var(--cizgi);
  border-radius: 12px; cursor: pointer; background: var(--zemin); }
.anket-secenek label:has(input:checked) { border-color: var(--yesil); background: var(--yesil-acik); }
.anket-secenek input { accent-color: var(--yesil); margin: 0; flex: none; }
.anket-kart .field textarea { min-height: 90px; }

/* ── Kâr hesaplayıcı: kategori seçimi, dağılım, KDV dökümü (24 Eylül) ── */
.kh-kategori { position: relative; }
.kh-kat-liste { position: absolute; left: 0; right: 0; top: 74px; z-index: 20; margin: 0; padding: 6px; list-style: none;
  background: var(--kart); border: 1px solid var(--cizgi); border-radius: 12px; box-shadow: 0 12px 30px rgba(26, 25, 21, .12);
  max-height: 320px; overflow: auto; }
.kh-kat-liste li { display: flex; justify-content: space-between; gap: 12px; padding: 8px 10px; border-radius: 8px; cursor: pointer; font-size: 14px; }
.kh-kat-liste li b { font-weight: 600; color: var(--yesil); white-space: nowrap; font-size: 13px; }
.kh-kat-liste li:hover, .kh-kat-liste li.on { background: var(--yesil-acik); }
.kh-kat-liste li.bos { cursor: default; color: var(--sisli); }
.kh-kat-liste li.bos:hover { background: none; }
.kh-dagilim { display: flex; align-items: center; gap: 18px; padding: 6px 0 2px; }
.kh-halka { width: 110px; height: 110px; flex: none; }
.kh-halka circle { fill: none; stroke-width: 6; }
.kh-h-zemin { stroke: var(--cizgi); }
.kh-h-maliyet { stroke: #C9B994; }
.kh-h-kesinti { stroke: #D98A5F; }
.kh-h-kar { stroke: var(--yesil); }
.kh-lejant { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; font-size: 14px; color: var(--soluk); }
.kh-lejant i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 8px; vertical-align: 0; }
.kh-lejant b { color: var(--murekkep); margin-left: 6px; }
.kh-l-maliyet { background: #C9B994; } .kh-l-kesinti { background: #D98A5F; } .kh-l-kar { background: var(--yesil); }
.kh-satirlar .kh-toplam { border-top: 1px solid var(--cizgi); padding-top: 8px; font-weight: 600; }

/* ── Telefon ve tablet (27 Eylül) ─────────────────────────────
 * Eklenti yalnız bilgisayardaki Chrome'a kurulur. Reklamla gelenlerin
 * %73'ü telefondaydı ve "Chrome'a ekle" onları mağazada kurulamayan bir
 * sayfaya götürüyordu. Dokunmatik cihazda (fare yok) mağaza düğmeleri
 * gizlenir; yerine "hesabını aç, kurulum linki e-postana gelsin" çıkar.
 * Hoş geldin e-postası (src/api/hosgeldin.ts) kurulum linkini taşıyor.
 * Ekran genişliğine değil cihaza bakılır: dar bilgisayar penceresi masaüstü sayılır. */
.yalniz-mobil { display: none; }
@media (hover: none) and (pointer: coarse) {
  .yalniz-masaustu, .head-chrome { display: none !important; }
  .yalniz-mobil { display: block; }
  .kh-cta-dugme .yalniz-mobil { display: inline-flex; }
}
.mobil-kutu { display: none; flex-direction: column; gap: 12px; padding: 18px; border-radius: 16px;
  background: var(--yesil-acik); color: var(--murekkep); font-size: 15px; line-height: 1.55; }
@media (hover: none) and (pointer: coarse) { .mobil-kutu.yalniz-mobil { display: flex; } }
.mobil-kutu .btn { align-self: stretch; }
.mobil-not { font-size: 14px; color: var(--soluk); background: var(--yesil-acik); border-radius: 12px; padding: 12px 14px; }

/* ── Telefonda "linki e-postana gönderelim" (3 Ekim) ────────────
 * Video tanıtımıyla gelen 75 ziyaretçinin 73'ü telefondaydı, hiçbiri
 * kaydolmadı: eklenti telefonda kurulamıyor, kayıt formu da o an için fazla.
 * Hesaplayıcının sonucunun hemen altında tek alanlı bir kutu: adresini yazar,
 * link (aynı rakamlarla) e-postasına gider, bilgisayarda devam eder.
 * Yalnız dokunmatik cihazda görünür (.yalniz-mobil). Betik: site/hatirlat.js */
.kh-hatirlat h2 { font-size: 22px; }
.kh-hatirlat-form { display: flex; flex-direction: column; gap: 10px; }
.kh-hatirlat-form label { font-size: 15px; font-weight: 500; }
.kh-hatirlat-form input {
  font: inherit; font-size: 17px; color: var(--murekkep); background: var(--kart);
  border: 1px solid var(--cizgi); border-radius: 12px; padding: 11px 14px; min-height: 48px; width: 100%;
}
.kh-hatirlat-form input:focus { outline: 2px solid var(--yesil); outline-offset: 1px; border-color: transparent; }
.kh-hatirlat-form input.kh-bozuk { border-color: #B3452F; background: #FBEDEA; }
.kh-hatirlat-hata { font-size: 14px; color: #B3452F; }
.kh-hatirlat-not { font-size: 13.5px; color: var(--soluk); }
.kh-hatirlat-tamam { font-weight: 500; }
/* Sayfanın en üstünde ince şerit: telefondan gelen sonuca kadar inmeden kutuyu bilsin.
 * Dokununca aşağıdaki kutuya iner (betiksiz de çalışır: bağlantı #hatirlat). */
.kh-serit { align-items: center; justify-content: space-between; gap: 12px; padding: 11px 12px 11px 14px; border-radius: 12px;
  background: var(--yesil-acik); color: var(--murekkep); font-size: 14.5px; line-height: 1.45; margin-bottom: -12px; }
.kh-serit:hover { text-decoration: none; color: var(--murekkep); }
.kh-serit b { font-weight: 600; }
.kh-serit-ok { flex: none; width: 30px; height: 30px; border-radius: 50%; background: var(--yesil); color: #FFFFFF;
  display: inline-flex; align-items: center; justify-content: center; font-size: 16px; line-height: 1; }
@media (hover: none) and (pointer: coarse) { .kh-serit.yalniz-mobil { display: flex; } }
/* Üstteki başlık çubuğu yapışkan: kutu onun altında kalmasın */
.kh-hatirlat { scroll-margin-top: 84px; }
/* Telefonda kayıt sayfasının üstünde de aynı kutu: dört günde kayıt sayfasını açan
 * dört gerçek ziyaretçinin dördü de telefondaydı, hiçbiri formu göndermedi. */
.hesap-kart .kh-hatirlat { margin-bottom: 6px; }
.hesap-kart .kh-hatirlat h2 { font-size: 20px; }
.hesap-ayrac { align-items: center; gap: 12px; margin: 16px 0 18px; font-size: 13.5px; color: var(--sisli); }
.hesap-ayrac::before, .hesap-ayrac::after { content: ""; flex: 1; height: 1px; background: var(--cizgi); }
@media (hover: none) and (pointer: coarse) { .hesap-ayrac.yalniz-mobil { display: flex; } }
.nks-ornek-bas { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  margin: 0 0 10px; font-size: 14px; color: var(--soluk); }
.nks-ornek-bas b { color: var(--yesil); font-weight: 600; letter-spacing: .04em; font-size: 12px; text-transform: uppercase; }
.hesap-kart .mobil-not { margin-bottom: 18px; }

/* ── Trendyol komisyon oranları (29 Eylül) ─────────────────────
 * Tablo site-src/build.mjs'te veriden üretilir; arama site-src/komisyon.ts. */
.ko-uyari { padding: 14px 18px; border-radius: 12px; background: var(--yesil-acik); border-left: 3px solid var(--yesil);
  color: var(--soluk); font-size: 15px; line-height: 1.6; }
.ko-uyari b { color: var(--yesil-koyu); }
.ko-kart { padding: 0; overflow: hidden; }
.ko-ust { display: flex; flex-direction: column; gap: 8px; padding: 22px 26px 18px; border-bottom: 1px solid var(--cizgi); }
.ko-ust label { font-size: 15px; font-weight: 500; }
.ko-ust input {
  font: inherit; font-size: 17px; color: var(--murekkep); background: var(--zemin); max-width: 420px;
  border: 1px solid var(--cizgi); border-radius: 12px; padding: 11px 14px; min-height: 46px; width: 100%;
}
.ko-ust input:focus { outline: 2px solid var(--yesil); outline-offset: 1px; border-color: transparent; }
.ko-aralik { font-size: 13.5px; color: var(--sisli); }
.ko-tablo { width: 100%; border-collapse: collapse; font-size: 15px; }
.ko-tablo th, .ko-tablo td { text-align: left; padding: 11px 26px; border-bottom: 1px solid #EFEBDF; }
.ko-tablo td:not(:first-child), .ko-tablo th:not(:first-child) { padding-left: 8px; }
.ko-tablo thead th { font-size: 13px; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; color: var(--sisli); }
.ko-tablo td { color: var(--soluk); }
.ko-tablo .ko-grup th { font-family: 'Lora', Georgia, serif; font-size: 17px; font-weight: 600; color: var(--murekkep);
  background: var(--zemin); padding-top: 14px; }
.ko-tablo .ko-sayi { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ko-tablo td.ko-sayi:nth-child(2) { color: var(--murekkep); font-weight: 600; }
.ko-tablo .ko-git { text-align: right; white-space: nowrap; font-size: 14px; }
/* Aramada sütunlar kaymasın */
.ko-tablo thead th:nth-child(2) { width: 130px; }
.ko-tablo thead th:nth-child(3) { width: 90px; }
.ko-tablo thead th:nth-child(4) { width: 150px; }
/* Hepsiburada ve n11 tablosu (1 Eki 2026): KDV sütunu yok; aynı alt kategorideki öteki oranlar */
.ko-tablo.ko-uc thead th:nth-child(3) { width: 150px; }
.ko-tablo .ko-diger { display: block; font-size: 12px; font-weight: 400; color: var(--sisli); white-space: normal; }
/* Trendyol'un tablosu (7 Eki 2026): satıra giren ürün tipleri adın altında, seviye oranları oranın altında */
.ko-tablo .ko-urun { display: block; margin-top: 2px; font-size: 12.5px; line-height: 1.45; color: var(--sisli); }
.ko-tablo.ko-seviye thead th:nth-child(2) { width: 230px; }
.ko-tablo tr[data-ara]:hover td { background: #FAF8F2; }
.ko-tablo tbody:last-child tr:last-child td { border-bottom: 0; }
.ko-gizli { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ko-bos { padding: 18px 26px 22px; color: var(--soluk); }
@media (max-width: 640px) {
  .ko-ust { padding: 18px 16px 14px; }
  .ko-tablo { font-size: 14px; }
  .ko-tablo th, .ko-tablo td { padding: 10px 6px; }
  .ko-tablo th:first-child, .ko-tablo td:first-child { padding-left: 16px; }
  .ko-tablo th:last-child, .ko-tablo td:last-child { padding-right: 16px; }
  .ko-tablo .ko-git { font-size: 13px; white-space: normal; }
  .ko-tablo thead th:nth-child(2) { width: 84px; }
  .ko-tablo thead th:nth-child(3) { width: 48px; }
  .ko-tablo thead th:nth-child(4) { width: 78px; }
  .ko-bos { padding: 16px; }
  .ko-tablo.ko-seviye thead th:nth-child(2) { width: 118px; }
}

/* Kategori komisyon sayfaları (7 Eki 2026): site-src/kategori-sayfa.mjs üretir */
.ko-kat { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 14px; color: var(--sisli); }
.ko-kat:empty { display: none; }
.ko-kat a { padding: 6px 14px; border: 1px solid var(--cizgi); border-radius: 999px; background: var(--kart); color: var(--murekkep); }
.ko-kat a:hover { border-color: var(--yesil); text-decoration: none; }
.ko-ust h2 { font-size: 22px; }
.ko-dip { padding: 16px 26px 20px; font-size: 13.5px; color: var(--sisli); border-top: 1px solid #EFEBDF; }
.ko-ornek { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 20px 36px; align-items: start; }
.ko-ornek-bas { grid-column: 1 / -1; display: flex; flex-direction: column; gap: 6px; }
.ko-ornek-bas h2 { font-size: 24px; }
.ko-ornek-bas p { color: var(--soluk); }
.ko-ornek .ko-ara-toplam dt, .ko-ornek .ko-ara-toplam dd { color: var(--murekkep); font-weight: 600; }
.ko-ornek-sonuc { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: 22px; border-radius: 14px; background: var(--zemin); }
.ko-ornek-sonuc .btn { margin-top: 6px; }
.ko-tablo.ko-kars thead th:nth-child(2) { width: 170px; }
.ko-tablo.ko-kars thead th:nth-child(3), .ko-tablo.ko-kars thead th:nth-child(4) { width: 130px; }
.ko-tablo.ko-kars thead th:nth-child(5) { width: 120px; }
.ko-tablo.ko-kars td.ko-sayi:nth-child(4) { color: var(--murekkep); font-weight: 600; }
@media (max-width: 760px) {
  .ko-ornek { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
  .ko-dip { padding: 14px 16px 16px; }
  .ko-ornek-sonuc { padding: 16px; }
  /* Dar ekranda beş sütun sığmaz: pazaryeri adı zaten aynı hesaba gider */
  .ko-tablo.ko-kars .ko-git, .ko-tablo.ko-kars thead th:nth-child(5) { display: none; }
  .ko-tablo.ko-kars thead th:nth-child(2) { width: 96px; }
  .ko-tablo.ko-kars thead th:nth-child(3), .ko-tablo.ko-kars thead th:nth-child(4) { width: 84px; }
  .ko-tablo.ko-kars td:nth-child(4), .ko-tablo.ko-kars th:nth-child(4) { padding-right: 16px; }
}

/* Buybox takibi sayfası (1 Eki 2026) */
.bb-cta { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 4px; }
.bb-ornek { padding-bottom: 14px; }
.bb-ornek .prose-table { margin-bottom: 8px; }
.bb-iyi { color: var(--yesil); font-weight: 600; }
.bb-kotu { color: #B3452F; font-weight: 600; }
.bb-not { font-size: 13.5px; color: var(--sisli); margin: 0; }
.bb-liste { margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: 10px; }
/* "Trendyol'da ne satılır?" sayfasındaki örnek ekran: üç soru + liste (trendyolda-ne-satilir) */
.nst-sorular { list-style: none; margin: 0 0 18px; padding: 0 0 18px; border-bottom: 1px solid var(--cizgi);
  display: flex; flex-direction: column; gap: 16px; }
.nst-sorular li { display: flex; gap: 12px; align-items: flex-start; }
.nst-no { flex: none; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center;
  background: var(--yesil); color: #FFFFFF; font-size: 13px; font-weight: 600; }
.nst-sorular b { display: block; font-weight: 600; }
.nst-sik { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.nst-sik span { padding: 6px 12px; border: 1px solid var(--cizgi); border-radius: 10px; font-size: 14px; color: var(--soluk); background: #FFFFFF; }
.nst-sik span.on { border-color: var(--yesil); background: var(--yesil-acik); color: var(--yesil); font-weight: 600; }
.nst-tablo { overflow-x: auto; }
.nst .prose-table { min-width: 560px; }
.nst .prose-table small { display: block; font-size: 12.5px; color: var(--sisli); font-weight: 400; }
.nst .prose-table td:first-child { color: var(--murekkep); font-weight: 500; }
/* Vitrin sayfaları (src/api/vitrin.ts): "Trendyol'da en çok satan … ürünleri". Tablo .nst ile ortak. */
.vt-urun { display: flex; gap: 12px; align-items: center; }
.vt-no { flex: none; width: 22px; text-align: right; color: var(--sisli); font-weight: 400; font-variant-numeric: tabular-nums; }
.vt-urun img, .vt-bos { flex: none; width: 44px; height: 44px; border-radius: 8px; object-fit: contain; background: #FFFFFF; border: 1px solid var(--cizgi); }
.vt-urun a { color: var(--murekkep); }
.vt-kilit { font-size: 13.5px; white-space: nowrap; }
.vt-liste td[data-ad="Günde satış"], .vt-liste td[data-ad="En ucuz satış fiyatı"], .vt-liste th { white-space: nowrap; }
.vt-altlar { display: flex; flex-wrap: wrap; gap: 8px; }
.vt-altlar a { padding: 6px 12px; border: 1px solid var(--cizgi); border-radius: 10px; font-size: 14px; background: #FFFFFF; color: var(--soluk); }
.vt-altlar a:hover { border-color: var(--yesil); color: var(--yesil); text-decoration: none; }
.vt-dizin { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 16px; }
.vt-dizin h2 { font-size: 20px; }
.vt-dizin h2 a { color: var(--murekkep); }
.vt-say { color: var(--sisli); font-size: 14px; margin: 4px 0 12px; }
/* Dar ekranda tablo alt alta diziliyor ve başlık satırı gizleniyor (.prose-table): sütun adı hücrenin önüne yazılır */
@media (max-width: 640px) {
  .nst .prose-table { min-width: 0; }
  .nst .prose-table td[data-ad]::before { content: attr(data-ad) ": "; color: var(--sisli); }
  .nst .prose-table td small { display: inline; margin-left: 4px; }
  .nst .prose-table td:first-child small { display: block; margin-left: 0; }
}

/* KDV dahil toplam, fiyatın hemen altında (1 Eki 2026) */
.plan-kdv { margin: -12px 0 0; font-size: 14px; color: var(--sisli); }

/* ── Pazaryeri seçimi (1 Ekim 2026) ─────────────────────────────
   Üst menüde "Kâr hesapla" üzerine gelince Trendyol · Hepsiburada · n11;
   hesaplayıcı ve komisyon sayfalarının başında aynı üçlü sekme. Yalnız CSS
   (site CSP'si satır içi betiğe izin vermiyor); klavyede focus-within açar. */
.nav-acilir { position: relative; }
.nav-acilir > a::after { content: " ▾"; font-size: 11px; }
.nav-acilir-menu { display: none; position: absolute; top: 100%; left: -14px; padding-top: 10px; z-index: 30; }
.nav-acilir-menu > div { display: flex; flex-direction: column; min-width: 200px; padding: 6px; background: var(--kart);
  border: 1px solid var(--cizgi); border-radius: 12px; box-shadow: 0 12px 32px rgba(26, 25, 21, .10); }
.nav-acilir-menu a { padding: 9px 12px; border-radius: 8px; color: var(--murekkep); }
.nav-acilir-menu a:hover, .nav-acilir-menu a:focus { background: var(--zemin); text-decoration: none; }
.nav-acilir-menu small { display: block; font-size: 12px; color: var(--sisli); }
.nav-acilir:hover .nav-acilir-menu, .nav-acilir:focus-within .nav-acilir-menu { display: block; }

.kh-pazar { display: inline-flex; flex-wrap: wrap; gap: 4px; padding: 4px; margin: 14px 0 6px; background: var(--kart);
  border: 1px solid var(--cizgi); border-radius: 999px; width: max-content; max-width: 100%; justify-self: start; align-self: start; }
.kh-pazar a { padding: 7px 18px; border-radius: 999px; font-size: 14px; font-weight: 500; color: var(--soluk); }
.kh-pazar a:hover { color: var(--murekkep); text-decoration: none; }
.kh-pazar a[aria-current="page"] { background: var(--yesil); color: #fff; }

/* ── Ana sayfa: iki kapı (10 Ekim 2026) ────────────────────────
 * Ziyaretçi kendini seçer ("Yeni başlıyorum" / "Zaten satıyorum"); altındaki
 * kutu ona göre değişir (site/kapi.js). Seçilmeyen kutu yalnız betik çalışınca
 * gizlenir (.kapi-js): betik yüklenmezse iki kutu da açık durur.
 * Paket ayrıntısı /paketler/, iletişim formu /bize-ulasin/ sayfasına taşındı. */
.ana-hero { padding-top: 72px; display: flex; flex-direction: column; align-items: center; gap: 16px; text-align: center; }
.ana-hero h1 { font-size: 56px; max-width: 880px; }
.kapilar { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 20px; margin-top: 36px; }
.kapi { position: relative; display: flex; flex-direction: column; gap: 8px; text-align: left; font: inherit; color: inherit; cursor: pointer;
  background: var(--kart); border: 1px solid var(--cizgi); border-radius: 20px; padding: 26px 28px; }
.kapi:hover { border-color: var(--sisli); }
.kapi:focus-visible { outline: 2px solid var(--yesil); outline-offset: 2px; }
.kapi-et { font-size: 13px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--sisli); }
.kapi-baslik { font-family: 'Lora', Georgia, serif; font-weight: 600; font-size: 26px; line-height: 1.2; letter-spacing: -0.01em; padding-right: 36px; }
.kapi-acik { color: var(--soluk); font-size: 15.5px; }
.kapi-isaret { position: absolute; top: 24px; right: 24px; width: 24px; height: 24px; border-radius: 50%; border: 2px solid var(--cizgi);
  display: grid; place-items: center; color: transparent; font-size: 13px; font-weight: 700; }
.kapi.on, .kapi.on:hover { border: 2px solid var(--yesil); padding: 25px 27px; box-shadow: 0 18px 44px rgba(14, 110, 98, 0.10); }
.kapi.on .kapi-isaret { top: 23px; right: 23px; background: var(--yesil); border-color: var(--yesil); color: #FFFFFF; }
.kapi.on .kapi-et { color: var(--yesil); }
/* Seçili kapıyı kutusuna bağlayan ok (dar ekranda kapılar alt alta: ok yok) */
.kapi-js .kapi.on::after { content: ''; position: absolute; left: 50%; bottom: -12px; width: 20px; height: 20px; margin-left: -10px;
  background: var(--kart); border-right: 2px solid var(--yesil); border-bottom: 2px solid var(--yesil); border-radius: 0 0 4px 0; transform: rotate(45deg); }
.kapi-ic { margin-top: 26px; display: flex; flex-direction: column; gap: 24px; background: var(--kart); border: 1px solid var(--cizgi); border-radius: 20px; padding: 30px; }
.kapi-js .kapi-ic:not(.on) { display: none; }
.uc-adim { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
.uc-adim > div { display: flex; flex-direction: column; gap: 10px; padding-top: 16px; border-top: 2px solid var(--cizgi); }
.uc-adim > div:first-child { border-top-color: var(--yesil); }
.uc-adim h2 { font-size: 19px; line-height: 1.3; }
.uc-adim p { color: var(--soluk); font-size: 15px; }
.ornek { margin-top: auto; display: flex; flex-direction: column; gap: 6px; padding: 12px 14px; background: var(--zemin); border: 1px solid var(--cizgi);
  border-radius: 12px; font-size: 14px; color: var(--soluk); }
.ornek b { color: var(--murekkep); font-weight: 600; }
.ornek b.iyi { color: var(--yesil); }
.ornek b.kotu { color: #A23A2C; }
.kapi-cta { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; }
.ornek-not { font-size: 13.5px; color: var(--sisli); }
.ornek-not a { font-weight: 600; }

/* Hesapsız araçlar: tek kutuda üç bağlantı */
.arac { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); background: var(--kart); border: 1px solid var(--cizgi); border-radius: 16px; overflow: hidden; }
.arac a { display: flex; flex-direction: column; gap: 4px; padding: 20px 22px; color: var(--murekkep); border-right: 1px solid var(--cizgi); }
.arac a:last-child { border-right: 0; }
.arac a:hover { text-decoration: none; background: var(--zemin); }
.arac a b { font-family: 'Lora', Georgia, serif; font-size: 18px; font-weight: 600; }
.arac a span { color: var(--soluk); font-size: 14.5px; }
.arac a i { margin-top: 4px; font-style: normal; font-weight: 600; font-size: 14.5px; color: var(--yesil); }

/* Paketlerin kısa hali (ayrıntı /paketler/) */
.kp { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.kp-k { display: flex; flex-direction: column; gap: 8px; background: var(--kart); border: 1px solid var(--cizgi); border-radius: 16px; padding: 22px; }
.kp-k.kp-on { border: 2px solid var(--yesil); padding: 21px; }
.kp-k h3 { font-size: 18px; }
.kp-f { color: var(--sisli); font-size: 14.5px; }
.kp-f b { margin-right: 4px; font-family: 'Lora', Georgia, serif; font-size: 28px; font-weight: 600; color: var(--murekkep); }
.kp-a { color: var(--soluk); font-size: 14.5px; line-height: 1.55; }
.kp-alt { margin-top: -12px; font-size: 14.5px; color: var(--sisli); }
.kp-alt a { font-weight: 600; }
/* /paketler/ ve /bize-ulasin/: bölüm başlığı sayfanın başlığı */
.paket-sayfa h1 { font-size: 40px; }

@media (max-width: 900px) {
  .ana-hero { padding-top: 44px; }
  .ana-hero h1 { font-size: 36px; }
  .kapilar { grid-template-columns: minmax(0, 1fr); gap: 12px; margin-top: 26px; }
  .kapi { padding: 20px; }
  .kapi.on, .kapi.on:hover { padding: 19px; }
  .kapi-baslik { font-size: 22px; }
  .kapi-isaret { top: 18px; right: 18px; }
  .kapi.on .kapi-isaret { top: 17px; right: 17px; }
  .kapi-js .kapi.on::after { display: none; }
  .kapi-ic { margin-top: 12px; padding: 22px 18px; }
  .uc-adim, .arac, .kp { grid-template-columns: minmax(0, 1fr); }
  .uc-adim { gap: 22px; }
  .arac a { border-right: 0; border-bottom: 1px solid var(--cizgi); }
  .arac a:last-child { border-bottom: 0; }
  .kapi-cta .btn { flex-grow: 1; }
  .paket-sayfa h1 { font-size: 32px; }
}
/* 420 px'den dar telefonda yukarıdaki ".wrap { padding: 0 16px }" kuralı dikey boşluğu da sıfırlıyor;
   bölümler birbirine yapışıyordu (eski ana sayfada da öyleydi). Bölüm arası boşluk geri gelir. */
@media (max-width: 420px) { .section { padding-top: 48px; } }