/* Kalemin Kanatları — iç sayfalar: kategori · kitap detay · sepet · ödeme · sipariş sonucu · hesabım · giriş · takip · 404 */

/* ---------- ortak ---------- */
body:not(.home):not(.is-flow):not(.auth-body) main { padding-top: 132px; }
.crumbs ol { list-style: none; margin-top: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 0; font-size: 13px; color: var(--muted); margin-bottom: 18px; }
.crumbs li + li::before { content: "›"; margin: 0 8px; color: var(--line-2); }
.crumbs a:hover { color: var(--gold); }
.crumbs [aria-current] { color: var(--ink-2); font-weight: 500; }
.page-title { font-family: var(--display); font-weight: 700; font-size: clamp(32px, 3.6vw, 54px); line-height: 1.1; letter-spacing: -.01em; text-wrap: balance; }
.page-title em { font-style: italic; color: var(--gold); }
.ph-lead { color: var(--ink-2); font-size: clamp(15.5px, 1.15vw, 17.5px); margin-top: 14px; max-width: 62ch; }
.ph-lead a { color: var(--gold); text-decoration: underline; text-underline-offset: 3px; }
.sec-head { margin-bottom: 26px; }
.sec-head h2 { font-family: var(--display); font-size: clamp(26px, 2.4vw, 36px); line-height: 1.15; }
.sec-head p:not(.eyebrow) { color: var(--ink-2); margin-top: 10px; }
.sec-head .eyebrow { margin-bottom: 8px; }
.sec-head.row { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 14px; }
.link-btn { display: inline-flex; align-items: center; gap: 6px; font-size: 13.5px; font-weight: 600; color: var(--gold); }
.link-btn svg { width: 15px; height: 15px; }
.link-btn:hover { text-decoration: underline; text-underline-offset: 3px; }
.back-link { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 500; color: var(--ink-2); }
.back-link svg { width: 17px; height: 17px; }
.back-link:hover { color: var(--gold); }
.mono { font-variant-numeric: tabular-nums; letter-spacing: .02em; font-feature-settings: "tnum"; }
.muted { color: var(--muted); }
.free { color: #2f9e62; font-weight: 600; }
.warn-t { color: #c7771a; }
.cta-row.center { justify-content: center; }
.chip svg { width: 14px; height: 14px; }
.chip.ghost { color: var(--ink-2); background: var(--surface); border-color: var(--line-2); }
a.chip:hover { border-color: var(--gold); }
.icon-btn.sm { width: 32px; height: 32px; }
.icon-btn.sm svg { width: 15px; height: 15px; }

/* ---------- form öğeleri ---------- */
.fld { display: flex; flex-direction: column; gap: 6px; font-size: 14px; min-width: 0; }
.fld > span:first-child { display: flex; align-items: baseline; flex-wrap: wrap; gap: 0 6px; font-weight: 600; color: var(--ink); font-size: 13.5px; }
.fld > span:first-child i { font-style: normal; color: #d64533; margin-left: 2px; }
.fld small { font-weight: 400; color: var(--muted); }
.fld input, .fld select, .fld textarea { width: 100%; padding: 12px 14px; border-radius: 12px; border: 1px solid var(--line-2); background: var(--surface-2); color: var(--ink); font-size: 15px; transition: border-color .2s, box-shadow .2s; }
.fld textarea { resize: vertical; min-height: 48px; line-height: 1.5; }
.fld select { appearance: none; -webkit-appearance: none; padding-right: 38px; background: var(--surface-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23999' stroke-width='2.5'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 14px center; cursor: pointer; }
.fld input:focus, .fld select:focus, .fld textarea:focus { outline: none; border-color: var(--gold); box-shadow: 0 0 0 3px var(--gold-soft); }
.fld input::placeholder, .fld textarea::placeholder { color: var(--muted); opacity: .75; }
.fld.err input, .fld.err select, .fld.err textarea, .fld.err .tel-in, .fld.err .pw-in { border-color: #d64533; }
.fld-err { font-style: normal; font-size: 12.5px; color: #d64533; min-height: 0; }
.fld-err:empty { display: none; }
.fld-hint { font-size: 12.5px; color: var(--muted); line-height: 1.55; }
.fld-hint a { color: var(--gold); text-decoration: underline; }
.fld-hint svg { width: 14px; height: 14px; vertical-align: -2px; color: var(--gold); }
.fld-link { margin-left: auto; font-weight: 500; font-size: 12.5px; color: var(--gold); }
.fld-empty { visibility: hidden; }
.f-row { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; }
.f-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 6px; }
.tel-in, .pw-in { display: flex; align-items: stretch; border-radius: 12px; border: 1px solid var(--line-2); background: var(--surface-2); transition: border-color .2s, box-shadow .2s; overflow: hidden; }
.tel-in:focus-within, .pw-in:focus-within { border-color: var(--gold); box-shadow: 0 0 0 3px var(--gold-soft); }
.tel-in b { display: inline-flex; align-items: center; padding: 0 12px; font-weight: 600; color: var(--ink-2); background: var(--bg-2); border-right: 1px solid var(--line); font-size: 14px; }
.fld .tel-in input, .fld .pw-in input { border: 0; border-radius: 0; box-shadow: none; background: transparent; }
.pw-eye { width: 46px; flex: none; display: inline-flex; align-items: center; justify-content: center; color: var(--muted); }
.pw-eye:hover { color: var(--gold); }
.pw-eye svg { width: 19px; height: 19px; }
.pw-meter { height: 5px; border-radius: 999px; background: var(--bg-2); overflow: hidden; }
.pw-meter i { display: block; height: 100%; width: 0; border-radius: inherit; background: #d64533; transition: width .3s, background .3s; }
.pw-meter i[data-s="2"] { background: #e0a23b; } .pw-meter i[data-s="3"] { background: #8bbf4a; } .pw-meter i[data-s="4"] { background: #2f9e62; }
.pw-hint { font-size: 12px; }
.check { display: flex; align-items: flex-start; gap: 10px; font-size: 14px; line-height: 1.5; cursor: pointer; color: var(--ink-2); }
.check input { width: 19px; height: 19px; margin: 1px 0 0; flex: none; accent-color: var(--gold); cursor: pointer; }
.check a { color: var(--gold); text-decoration: underline; text-underline-offset: 2px; }
.check i { font-style: normal; color: #d64533; }
.check small { color: var(--muted); }
.check.err span { color: #d64533; }
.seg { display: inline-flex; padding: 4px; border-radius: 14px; background: var(--bg-2); border: 1px solid var(--line); gap: 4px; }
.seg label { cursor: pointer; }
.seg input { position: absolute; opacity: 0; pointer-events: none; }
.seg span { display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px; border-radius: 10px; font-size: 14px; font-weight: 600; color: var(--muted); transition: background .2s, color .2s, box-shadow .2s; }
.seg span svg { width: 16px; height: 16px; }
.seg input:checked + span { background: var(--surface-2); color: var(--ink); box-shadow: 0 4px 12px -6px rgba(0, 0, 0, .35); }
.seg input:focus-visible + span { outline: 2px solid var(--gold); }
.seg.sm span { padding: 7px 12px; font-size: 13px; }
.sub-block { padding: 16px; border-radius: 14px; background: var(--bg-2); border: 1px dashed var(--line-2); display: flex; flex-direction: column; gap: 14px; }
.pill { display: inline-flex; align-items: center; gap: 6px; padding: 5px 11px; border-radius: 999px; font-size: 12.5px; font-weight: 700; white-space: nowrap; }
.pill::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.pill.ok { background: rgba(47, 158, 98, .13); color: #2f9e62; }
.pill.info { background: rgba(58, 125, 214, .13); color: #3a7dd6; }
.pill.gold { background: var(--gold-soft); color: var(--gold); }
.pill.warn { background: rgba(224, 146, 40, .15); color: #c7771a; }
.pill.err { background: rgba(214, 69, 51, .13); color: #d64533; }
.pill.mute { background: var(--bg-2); color: var(--muted); }
:root[data-theme="dark"] .pill.info { color: #7fb0f0; }

/* ---------- kategori / tüm kitaplar ---------- */
.page-hero { position: relative; padding-block: 8px 30px; }
/* ışıltı üst barın arkasından başlar, aşağıdaki bölüme yumuşakça taşar (kesik kenar yok) */
.page-hero::before { content: ""; position: absolute; left: 0; right: 0; top: -180px; bottom: -260px; z-index: -1; pointer-events: none;
  background: radial-gradient(46% 55% at 86% 34%, var(--gold-soft), transparent 72%), radial-gradient(38% 46% at 0% 72%, var(--gold-soft), transparent 72%);
  -webkit-mask-image: linear-gradient(180deg, #000 0, #000 62%, transparent 100%); mask-image: linear-gradient(180deg, #000 0, #000 62%, transparent 100%); }
main { position: relative; isolation: isolate; }
.ph-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; align-items: center; }
.ph-meta { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; }
.ph-books { display: flex; justify-content: center; align-items: flex-end; min-height: 200px; padding: 10px 0 18px; }
.ph-cover { margin-left: -46px; transition: transform .5s var(--ease); z-index: calc(10 - var(--i)); }
.ph-cover:first-child { margin-left: 0; }
.ph-cover:hover { transform: translateY(-12px); z-index: 20; }
.ph-cover .book3d { cursor: pointer; }
.page-hero.slim { padding-bottom: 10px; }
.shop.is-archive { padding-top: 10px; }
.cat-note { padding-top: 0; }
.note-card { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; align-items: center; padding: clamp(22px, 3vw, 36px); border-radius: 24px; background: radial-gradient(120% 140% at 0% 0%, var(--gold-soft), transparent 55%), var(--surface); border: 1px solid rgba(196, 146, 44, .3); }
.note-card > svg { width: 46px; height: 46px; padding: 10px; border-radius: 14px; color: var(--gold); background: var(--gold-soft); }
.note-card h2 { font-family: var(--display); font-size: clamp(22px, 2vw, 28px); line-height: 1.2; }
.note-card p { color: var(--ink-2); margin-top: 6px; }

/* ---------- kitap detay ---------- */
.pd-page .crumbs { margin-bottom: 20px; }
.pd-top { display: grid; grid-template-columns: minmax(0, 1fr); gap: 28px; align-items: start; padding-bottom: 50px; }
.pd-media { position: relative; }
.pd-stage-wrap { border-radius: 26px; overflow: hidden; border: 1px solid var(--line); }
.pd-stage { min-height: 460px; }
.pd-fallback { width: 230px; height: auto; box-shadow: 0 30px 50px -24px rgba(0, 0, 0, .6); border-radius: 2px 6px 6px 2px; }
.pd-info { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.pd-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.pd-info h1 { font-family: var(--display); font-weight: 700; font-size: clamp(32px, 3.4vw, 50px); line-height: 1.08; letter-spacing: -.01em; text-wrap: balance; }
.pd-author { color: var(--ink-2); font-size: 15px; }
.pd-author a { color: var(--ink); font-weight: 600; border-bottom: 1px dashed var(--line-2); }
.pd-author a:hover { color: var(--gold); border-color: var(--gold); }
.pd-rate { align-self: flex-start; display: inline-flex; align-items: center; gap: 8px; font-size: 14px; color: var(--muted); }
.pd-rate .stars svg { width: 17px; height: 17px; }
.pd-rate b { color: var(--ink); }
.pd-rate span:last-child { text-decoration: underline; text-underline-offset: 3px; }
.pd-rate:hover span:last-child { color: var(--gold); }
.pd-lead { color: var(--ink-2); font-size: 16px; }
.pd-facts { display: flex; flex-wrap: wrap; gap: 8px; }
.pd-facts li { display: inline-flex; align-items: center; gap: 7px; padding: 7px 12px; border-radius: 999px; background: var(--surface); border: 1px solid var(--line); font-size: 13.5px; color: var(--ink-2); }
.pd-facts svg { width: 16px; height: 16px; color: var(--gold); }
.pd-buy { display: flex; flex-direction: column; gap: 12px; padding: 20px; border-radius: 22px; background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow); margin-top: 4px; }
.pd-price { display: flex; align-items: baseline; flex-wrap: wrap; gap: 10px; }
.pd-price .price .now { font-size: 34px; font-weight: 800; letter-spacing: -.02em; }
.pd-price .price del { font-size: 17px; }
.pd-price .save { padding: 4px 10px; border-radius: 999px; background: rgba(214, 69, 51, .12); color: color-mix(in srgb, #d64533 48%, var(--ink)); font-size: 12.5px; font-weight: 700; }
.pd-price small { color: var(--muted); font-size: 12.5px; }
.pd-stock { display: flex; align-items: center; gap: 8px; font-size: 14px; color: color-mix(in srgb, #2f9e62 72%, var(--ink)); font-weight: 600; }
.pd-stock i { width: 9px; height: 9px; border-radius: 50%; background: #2f9e62; box-shadow: 0 0 0 4px rgba(47, 158, 98, .18); }
.pd-form { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.pd-form .qty { margin: 0; height: 50px; }
.pd-form .qty button { width: 40px; height: 48px; font-size: 18px; }
.pd-form .qty input { width: 40px; border: 0; background: none; text-align: center; font-weight: 700; font-size: 16px; -moz-appearance: textfield; }
.pd-form .qty input::-webkit-inner-spin-button, .pd-form .qty input::-webkit-outer-spin-button { -webkit-appearance: none; }
.pd-form .btn { height: 50px; }
.pd-form .btn-gold { flex: 1 1 180px; }
.pd-now { flex: 0 1 auto; }
.pd-fav { width: 50px; height: 50px; }
.pd-ship { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 12px; background: var(--bg-2); font-size: 13.5px; color: var(--ink-2); }
.pd-ship svg { width: 20px; height: 20px; color: var(--gold); flex: none; }
.pd-ship b { color: var(--ink); }
.pd-perks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.pd-perks li { display: flex; align-items: center; gap: 10px; font-size: 12.5px; color: var(--muted); }
.pd-perks svg { width: 26px; height: 26px; color: var(--gold); flex: none; }
.pd-perks b { display: block; font-size: 13.5px; color: var(--ink); }
.pd-sub { font-size: 12.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); margin-bottom: 10px; }
.pd-stores { padding-top: 14px; border-top: 1px solid var(--line); }
.st-list { display: flex; flex-wrap: wrap; gap: 8px; }
.st-link { display: inline-flex; align-items: center; gap: 9px; padding: 7px 12px 7px 8px; border-radius: 12px; border: 1px solid var(--line-2); background: var(--surface); font-size: 14px; font-weight: 600; transition: border-color .2s, transform .2s, box-shadow .2s; }
.st-link svg { width: 26px; height: 26px; }
.st-link .ext { width: 14px; height: 14px; color: var(--muted); }
.st-link:hover { border-color: var(--gold); transform: translateY(-2px); box-shadow: var(--shadow); }
/* diğer satış noktaları: logo + fiyat / stok durumu */
.st-link .st-logo { width: 26px; height: 26px; border-radius: 7px; object-fit: contain; background: #fff; flex: none; box-shadow: 0 0 0 1px rgba(0, 0, 0, .06); }
.st-link .st-txt { display: flex; flex-direction: column; line-height: 1.15; }
.st-link .st-txt small { font-size: 12px; font-weight: 600; color: var(--gold); }
.st-link.is-out .st-txt small { color: var(--muted); font-weight: 500; }
.st-link.is-out { opacity: .78; }
.pd-stores .st-note { margin-top: 8px; font-size: 11.5px; color: var(--muted); }
.pd-share { margin-top: 0; }
/* bölüm sekmeleri */
.pd-tabs { position: sticky; top: 64px; z-index: 60; background: var(--header-bg); -webkit-backdrop-filter: blur(14px) saturate(140%); backdrop-filter: blur(14px) saturate(140%); border-block: 1px solid var(--line); }
.pd-tabs ul { display: flex; justify-content: center; gap: 4px; overflow-x: auto; scrollbar-width: none; padding-block: 8px; }
.pd-tabs ul::-webkit-scrollbar { display: none; }
.pd-tabs a { display: inline-flex; align-items: center; gap: 6px; padding: 9px 16px; border-radius: 999px; font-size: 14.5px; font-weight: 500; color: var(--ink-2); white-space: nowrap; transition: background .2s, color .2s; }
.pd-tabs a span { font-size: 11.5px; padding: 1px 7px; border-radius: 999px; background: var(--bg-2); color: var(--muted); }
.pd-tabs a:hover { color: var(--gold); }
.pd-tabs a.on { background: var(--gold-soft); color: var(--gold); }
.pd-sec { padding-block: clamp(48px, 6vw, 80px); scroll-margin-top: 120px; }
.pd-sec.alt { background: var(--bg-2); }
.pd-about { display: grid; grid-template-columns: minmax(0, 1fr); gap: 30px; }
.pd-desc h2 { font-family: var(--display); font-style: italic; font-size: clamp(26px, 2.6vw, 38px); line-height: 1.2; margin-bottom: 18px; color: var(--ink); }
.pd-desc > p:not(.eyebrow) { font-size: 17px; line-height: 1.8; color: var(--ink-2); max-width: 68ch; }
.pd-desc > p:not(.eyebrow) + p { margin-top: 14px; }
.pd-pages { margin-top: 30px; }
.pd-pages h3 { font-size: 13px; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); margin-bottom: 12px; }
.pd-pages-row { display: flex; gap: 12px; overflow-x: auto; padding-bottom: 6px; }
.pd-pg { flex: none; height: 150px; padding: 4px; border-radius: 12px; background: var(--surface); border: 1px solid var(--line); transition: transform .25s, border-color .25s; }
.pd-pg img { height: 100%; width: auto; border-radius: 8px; }
.pd-pg:hover { transform: translateY(-3px); border-color: var(--gold); }
.pd-whom { display: flex; flex-direction: column; gap: 14px; }
.whom-card { padding: 20px; border-radius: 20px; background: var(--surface); border: 1px solid var(--line); }
.whom-card svg { width: 34px; height: 34px; padding: 7px; border-radius: 11px; background: var(--gold-soft); color: var(--gold); margin-bottom: 10px; }
.whom-card h3 { font-size: 16px; margin-bottom: 4px; }
.whom-card p { font-size: 14px; color: var(--ink-2); }
.pd-spec { grid-template-columns: repeat(1, minmax(0, 1fr)); margin: 0; }
.pd-spec div { display: flex; justify-content: space-between; gap: 16px; align-items: baseline; padding: 13px 18px; }
.pd-spec dd { margin: 0; text-align: right; }
/* birlikte alın */
.fbt { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; align-items: center; padding: clamp(18px, 2.4vw, 28px); border-radius: 24px; background: var(--surface); border: 1px solid var(--line); }
.fbt-items { display: flex; align-items: stretch; gap: 10px; overflow-x: auto; padding: 4px 2px 8px; }
.fbt-plus { align-self: center; font-size: 26px; font-weight: 300; color: var(--muted); flex: none; }
.fbt-item { flex: 1 0 170px; max-width: 230px; display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 16px 12px 14px; border-radius: 18px; border: 1px solid var(--line); background: var(--bg); cursor: pointer; transition: opacity .25s, border-color .25s; }
.fbt-item.is-main { border-color: rgba(196, 146, 44, .45); cursor: default; }
.fbt-item.off { opacity: .45; }
.fbt-book { min-height: 150px; display: flex; align-items: flex-end; }
.fbt-t { display: flex; gap: 8px; align-items: flex-start; font-size: 13.5px; line-height: 1.35; }
.fbt-t input { width: 18px; height: 18px; accent-color: var(--gold); flex: none; margin-top: 1px; }
.fbt-t b { display: block; font-weight: 600; margin-bottom: 4px; }
.fbt-t .price .now { font-size: 15px; }
.fbt-t .price del { font-size: 12.5px; }
.fbt-sum { display: flex; flex-direction: column; gap: 8px; padding: 18px; border-radius: 18px; background: var(--bg-2); }
.fbt-sum span { font-size: 14px; color: var(--ink-2); }
.fbt-sum strong { font-size: 30px; font-weight: 800; letter-spacing: -.02em; }
.fbt-sum small { font-size: 12.5px; color: var(--muted); }
.in-sets { margin-top: 30px; }
.qa-h { display: flex; align-items: center; gap: 10px; font-size: 16px; margin: 0 0 14px; }
.qa-h svg { width: 22px; height: 22px; color: var(--gold); }
.set-cards { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; }
.set-card { --t1: #d9ecf7; --t2: #b8d8ef; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 18px; align-items: center; padding: 18px 20px; border-radius: 20px; background: linear-gradient(135deg, var(--t1), var(--t2)); color: #1d2027; }
.set-card[data-tone="sun"] { --t1: #fff1cf; --t2: #f6cf74; }
.set-card[data-tone="autumn"] { --t1: #f6dfc9; --t2: #e3a877; }
.set-card[data-tone="stone"] { --t1: #eceae6; --t2: #cfcbc3; }
.set-card[data-tone="rose"] { --t1: #fbe1e6; --t2: #eeb3c1; }
:root[data-theme="dark"] .set-card { filter: saturate(.9) brightness(.92); }
.set-card h4 { font-family: var(--display); font-size: 20px; line-height: 1.2; margin: 6px 0 4px; }
.set-card p { font-size: 13px; color: #3a3f48; }
.set-card .c-label { font-size: 11px; padding: 4px 10px; }
.set-card .c-price { margin-top: 8px; gap: 8px; }
.set-card .c-price .now { font-size: 24px; }
.set-card .c-price del { font-size: 14px; }
.set-card .btn { grid-column: 1 / -1; justify-self: start; }
/* yorumlar */
.rv-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 26px; align-items: start; }
.rv-sum { display: flex; flex-direction: column; gap: 16px; padding: 22px; border-radius: 22px; background: var(--surface); border: 1px solid var(--line); }
.rv-score { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.rv-score b { font-size: 52px; line-height: 1; font-weight: 800; letter-spacing: -.03em; }
.rv-score .stars svg { width: 20px; height: 20px; }
.rv-score small { color: var(--muted); font-size: 13.5px; }
.rv-srcs { display: flex; flex-direction: column; gap: 6px; padding: 12px 0; border-block: 1px solid var(--line); }
.rv-srcs li { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.rv-srcs .r-src { padding: 4px 10px 4px 8px; }
.rv-srcs b { font-size: 13px; color: var(--muted); }
.rv-bars { display: flex; flex-direction: column; gap: 4px; }
.rv-bars button { width: 100%; display: grid; grid-template-columns: 14px 14px minmax(0, 1fr) 26px; align-items: center; gap: 6px; padding: 5px 8px; border-radius: 8px; font-size: 13px; color: var(--ink-2); transition: background .2s; }
.rv-bars button:hover, .rv-bars button.on { background: var(--gold-soft); }
.rv-bars svg { width: 13px; height: 13px; color: #f5b301; }
.rv-bars i { position: relative; height: 7px; border-radius: 999px; background: var(--bg-2); overflow: hidden; }
.rv-bars i::after { content: ""; position: absolute; inset: 0 auto 0 0; width: var(--w); border-radius: inherit; background: #f5b301; }
.rv-bars em { font-style: normal; text-align: right; color: var(--muted); }
.rv-note { font-size: 12.5px; color: var(--muted); }
.rv-tools { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 14px; font-size: 14px; color: var(--ink-2); }
.rv-tools select { padding: 8px 34px 8px 12px; border-radius: 999px; border: 1px solid var(--line-2); background: var(--surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23999' stroke-width='2.5'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center; appearance: none; -webkit-appearance: none; font-size: 13.5px; }
.rv-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.rv { padding: 18px 20px; border-radius: 18px; background: var(--surface); border: 1px solid var(--line); }
.rv[hidden] { display: none; }
.rv-head { display: flex; align-items: center; gap: 12px; }
.rv-head > div { flex: 1; min-width: 0; }
.rv-head strong { display: block; font-size: 14.5px; }
.rv-head small { display: block; color: var(--muted); font-size: 12.5px; }
.rv-head .stars svg { width: 15px; height: 15px; }
.rv > p { margin-top: 12px; color: var(--ink); font-size: 15px; line-height: 1.65; }
.rv-foot { display: flex; align-items: center; gap: 14px; margin-top: 10px; font-size: 12.5px; color: var(--muted); }
.verified { display: inline-flex; align-items: center; gap: 5px; color: color-mix(in srgb, #2f9e62 72%, var(--ink)); font-weight: 600; }
.verified svg { width: 14px; height: 14px; }
.rv-list .empty { padding: 30px; }
.rv-form { display: flex; flex-direction: column; gap: 14px; padding: 20px; margin-bottom: 16px; border-radius: 18px; background: var(--surface); border: 1px solid rgba(196, 146, 44, .45); }
.rv-form h3 { font-size: 17px; }
.rv-stars { display: flex; gap: 4px; padding: 4px; border-radius: 12px; align-self: flex-start; }
.rv-stars.err { box-shadow: 0 0 0 2px #d64533; }
.rv-stars button { width: 38px; height: 38px; display: inline-flex; align-items: center; justify-content: center; color: var(--line-2); transition: color .15s, transform .15s; }
.rv-stars button svg { width: 30px; height: 30px; }
.rv-stars button.on, .rv-stars button:hover, .rv-stars button:hover ~ button { color: #f5b301; }
.rv-stars:hover button { color: #f5b301; }
.rv-stars button:hover ~ button { color: var(--line-2); }
.rv-stars button:hover { transform: scale(1.12); }
/* soru-cevap */
.qa-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 30px 56px; }
.ask-form { display: flex; flex-direction: column; gap: 12px; margin-top: 22px; padding: 20px; border-radius: 20px; background: var(--surface); border: 1px solid var(--line); }
.ask-form .btn { align-self: flex-start; }
.qa-lists .faq-list + .qa-h { margin-top: 30px; }
/* ilgili kitaplar */
.rel-track { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(230px, 1fr); gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 4px 2px 14px; scrollbar-width: thin; }
.rel-track > * { scroll-snap-align: start; }
.rel-track .p-stage { min-height: 270px; padding: 26px 16px 30px; }
.rel-track .p-title { font-size: 18px; }
.rel-track .p-foot { flex-wrap: wrap; }
.rel-track .add-btn { padding: 9px 13px; font-size: 13px; }
.rel-static { display: flex; flex-wrap: wrap; gap: 12px; }
.rel-static a { display: flex; align-items: center; gap: 10px; padding: 8px 14px 8px 8px; border-radius: 14px; background: var(--surface); border: 1px solid var(--line); font-weight: 600; font-size: 14px; }
.rel-static img { width: 40px; height: auto; border-radius: 2px 4px 4px 2px; }
/* yapışkan satın alma çubuğu */
.pd-sticky { position: fixed; inset: auto 0 0 0; z-index: 95; background: var(--header-bg); -webkit-backdrop-filter: blur(14px) saturate(140%); backdrop-filter: blur(14px) saturate(140%); border-top: 1px solid var(--line); box-shadow: 0 -12px 30px -20px rgba(0, 0, 0, .5); transform: translateY(110%); transition: transform .4s var(--ease); }
.pd-sticky.on { transform: none; }
.ps-row { display: flex; align-items: center; gap: 12px; padding-block: 10px; }
.ps-row img { width: 36px; height: auto; border-radius: 2px 4px 4px 2px; box-shadow: 2px 3px 8px -3px rgba(0, 0, 0, .5); }
.ps-t { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.ps-t strong { font-size: 14.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ps-t .price .now { font-size: 16px; }
.ps-t .price del { font-size: 12.5px; }
.pd-page ~ .to-top { bottom: 84px; }

/* ---------- ödeme akışı: sade üst bar ---------- */
.flow-header { position: sticky; top: 0; z-index: 100; background: var(--header-bg); -webkit-backdrop-filter: blur(14px) saturate(140%); backdrop-filter: blur(14px) saturate(140%); border-bottom: 1px solid var(--line); }
.fh-bar { max-width: var(--wrap); margin: 0 auto; padding: 10px 20px; display: flex; align-items: center; gap: 16px; }
.fh-logo { flex: none; display: inline-flex; padding: 6px 12px; border-radius: 14px; background: rgba(36, 39, 44, .94); border: 1px solid rgba(255, 255, 255, .09); }
.fh-logo img { height: 46px; width: auto; }
.steps { flex: 1; display: flex; justify-content: center; align-items: center; gap: 6px; list-style: none; margin: 0; padding: 0; counter-reset: s; }
.steps li { display: flex; align-items: center; gap: 6px; font-size: 13.5px; font-weight: 600; color: var(--muted); }
.steps li + li::before { content: ""; width: clamp(14px, 4vw, 54px); height: 2px; border-radius: 2px; background: var(--line-2); margin-right: 6px; }
.steps li.done + li::before, .steps li.done::before { background: var(--gold); }
.steps li > a, .steps li > span { display: inline-flex; align-items: center; gap: 8px; }
.st-n { width: 28px; height: 28px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 13px; border: 2px solid var(--line-2); background: var(--surface); }
.steps li.on { color: var(--ink); }
.steps li.on .st-n { border-color: var(--gold); background: var(--gold); color: var(--on-gold); }
.steps li.done { color: var(--ink-2); }
.steps li.done .st-n { border-color: var(--gold); color: var(--gold); }
.steps li.done a:hover { color: var(--gold); }
.fh-tools { display: flex; align-items: center; gap: 10px; flex: none; }
.secure-pill { display: none; align-items: center; gap: 7px; padding: 7px 12px; border-radius: 999px; background: rgba(47, 158, 98, .12); color: #2f9e62; font-size: 13px; font-weight: 600; }
.secure-pill svg { width: 15px; height: 15px; }
.slim-footer { margin-top: 60px; padding: 24px 0 30px; border-top: 1px solid var(--line); background: var(--bg-2); font-size: 13px; color: var(--muted); }
.sf-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }
.sf-secure { display: inline-flex; align-items: center; gap: 8px; }
.sf-secure svg { width: 18px; height: 18px; color: #2f9e62; }
.sf-copy { margin-top: 12px; }
.slim-footer .fb-links a:hover { color: var(--gold); }

/* ---------- sepet / ödeme ortak düzen ---------- */
.flow-page { padding-top: 28px; }
.flow-title { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 10px; margin-bottom: 22px; }
.flow-title h1 { font-family: var(--display); font-size: clamp(30px, 3vw, 44px); line-height: 1.1; }
.flow-title h1 small { font-family: var(--body); font-size: 15px; font-weight: 500; color: var(--muted); margin-left: 8px; }
.flow-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; align-items: start; }
.flow-grid[hidden] { display: none; }
.flow-main { display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.flow-side { display: flex; flex-direction: column; gap: 16px; }
.sum-card { padding: 22px; border-radius: 22px; background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow); display: flex; flex-direction: column; gap: 14px; }
.sum-card h2 { font-family: var(--display); font-size: 22px; }
.sum-card h2 small { font-family: var(--body); font-size: 13.5px; font-weight: 500; color: var(--muted); }
.sum-rows { margin: 0; display: flex; flex-direction: column; gap: 10px; }
.sum-rows div { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; font-size: 14.5px; }
.sum-rows dt { color: var(--ink-2); }
.sum-rows dt small { color: var(--muted); }
.sum-rows dd { margin: 0; font-weight: 600; text-align: right; }
.sum-rows .disc dd { color: #2f9e62; }
.sum-rows .total { padding-top: 12px; margin-top: 2px; border-top: 1px dashed var(--line-2); font-size: 18px; }
.sum-rows .total dt { color: var(--ink); font-weight: 700; }
.sum-rows .total dd { font-size: 22px; font-weight: 800; }
.sum-rows .pay-row { font-size: 13px; }
.sum-note { font-size: 12.5px; color: var(--muted); text-align: center; }
.coupon-row { display: flex; align-items: center; gap: 6px; padding: 5px 5px 5px 12px; border-radius: 14px; border: 1px dashed var(--line-2); background: var(--bg); }
.coupon-row svg { width: 18px; height: 18px; color: var(--gold); flex: none; }
.coupon-row input { flex: 1; min-width: 0; border: 0; background: none; padding: 8px 4px; text-transform: uppercase; letter-spacing: .06em; font-size: 14px; outline: none; }
.coupon-row input::placeholder { text-transform: none; letter-spacing: 0; }
.coupon-msg { font-size: 12.5px; margin-top: 6px; }
.coupon-msg:empty { display: none; }
.coupon-msg.ok { color: #2f9e62; } .coupon-msg.err { color: #d64533; }
.trust-list { display: flex; flex-direction: column; gap: 12px; padding: 18px; border-radius: 18px; border: 1px solid var(--line); }
.trust-list li { display: flex; align-items: center; gap: 12px; font-size: 12.5px; color: var(--muted); }
.trust-list svg { width: 26px; height: 26px; color: var(--gold); flex: none; }
.trust-list b { display: block; font-size: 13.5px; color: var(--ink); }
.pay.mini { justify-content: center; }
.pay.mini span { height: 28px; min-width: 0; padding: 0 9px; font-size: 11.5px; font-weight: 800; color: #1d2027; letter-spacing: .02em; }
.pay.mini svg { height: 15px; }
/* fatura bilgileri: etiket–alan ve alanlar arası nefes payı */
#co3 ~ .seg { margin-bottom: 18px; }
#invBireysel, #invKurumsal { display: grid; gap: 16px; }
#invBireysel[hidden], #invKurumsal[hidden] { display: none; }
#invBireysel .fld, #invKurumsal .fld { gap: 9px; }
#invBireysel .fld-hint { margin-top: -6px; }
.fld select:disabled { opacity: .6; cursor: not-allowed; }
.ship-meter { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 8px 12px; padding: 14px 16px; border-radius: 16px; background: var(--surface); border: 1px solid var(--line); font-size: 14px; color: var(--ink-2); }
.ship-meter svg { width: 22px; height: 22px; color: var(--gold); }
.ship-meter b { color: var(--ink); }
.ship-meter .mc-bar { grid-column: 1 / -1; margin: 0; }
.cart-list { display: flex; flex-direction: column; border-radius: 22px; background: var(--surface); border: 1px solid var(--line); overflow: hidden; }
.cart-row { display: grid; grid-template-columns: 64px minmax(0, 1fr) auto; grid-template-areas: "t i i" "t q p"; gap: 10px 14px; align-items: center; padding: 16px 18px; border-bottom: 1px solid var(--line); transition: opacity .2s, transform .2s; }
.cart-row:last-child { border-bottom: 0; }
.cart-row.out { opacity: 0; transform: translateX(20px); }
.cr-thumb { grid-area: t; align-self: start; }
.cr-thumb > img { width: 58px; height: 82px; object-fit: cover; border-radius: 2px 5px 5px 2px; box-shadow: 3px 5px 12px -5px rgba(0, 0, 0, .55); }
.cr-info { grid-area: i; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.cr-name { font-weight: 600; font-size: 15.5px; line-height: 1.3; }
.cr-name:hover { color: var(--gold); }
.cr-info small { color: var(--muted); font-size: 12.5px; }
.o-setlist { font-size: 12px !important; color: var(--ink-2) !important; }
.cr-unit { font-size: 13.5px; color: var(--ink-2); margin-top: 4px; }
.cr-unit del { color: var(--muted); font-size: 12.5px; }
.cart-row .qty { grid-area: q; justify-self: start; margin: 0; }
.cr-total { grid-area: p; font-size: 16px; text-align: right; }
.cr-del { position: absolute; }
.cart-row { position: relative; }
.cr-del { top: 12px; right: 12px; width: 32px; height: 32px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: var(--muted); transition: color .2s, background .2s; }
.cr-del svg { width: 17px; height: 17px; }
.cr-del:hover { color: #d64533; background: rgba(214, 69, 51, .1); }
.cr-info { padding-right: 34px; }
.cart-tools { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin-top: 12px; font-size: 13px; color: var(--muted); }
.cart-tools .link-btn { color: var(--muted); }
.cart-tools .link-btn:hover { color: #d64533; }
.cart-note { display: inline-flex; align-items: center; gap: 7px; }
.cart-note svg { width: 16px; height: 16px; color: var(--gold); }
.cross-sells { margin-top: 20px; }
.cross-sells .sec-head h2 { font-size: 24px; }
.cart-empty-page { text-align: center; padding: 30px 20px 60px; max-width: 620px; margin: 0 auto; }
.cart-empty-page h2 { font-family: var(--display); font-size: clamp(28px, 3vw, 40px); margin-top: 10px; }
.cart-empty-page p { color: var(--ink-2); margin: 10px auto 24px; }
.ce-books { display: flex; justify-content: center; align-items: flex-end; gap: 0; min-height: 180px; }
.ce-books .book3d { margin-left: -24px; cursor: pointer; }
.ce-books .book3d:first-child { margin-left: 0; }

/* ---------- ödeme ---------- */
.co-login { display: flex; align-items: center; gap: 14px; padding: 14px 18px; border-radius: 16px; background: var(--gold-soft); border: 1px solid rgba(196, 146, 44, .3); font-size: 14px; color: var(--ink-2); }
.co-login svg { width: 26px; height: 26px; color: var(--gold); flex: none; }
.co-login a { color: var(--gold); font-weight: 700; text-decoration: underline; }
.co-login b { color: var(--ink); }
.co-login[hidden] { display: none; }
.co-card { display: flex; flex-direction: column; gap: 16px; padding: clamp(18px, 2.4vw, 26px); border-radius: 22px; background: var(--surface); border: 1px solid var(--line); }
.co-card h2 { display: flex; align-items: center; gap: 12px; font-size: 18px; }
.co-n { width: 30px; height: 30px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--gold); color: var(--on-gold); font-size: 14px; font-weight: 800; flex: none; }
.opt-list { display: flex; flex-direction: column; gap: 10px; }
.opt { display: flex; align-items: center; gap: 14px; padding: 14px 16px; border-radius: 16px; border: 1.5px solid var(--line-2); background: var(--bg); cursor: pointer; transition: border-color .2s, background .2s; }
.opt.on { border-color: var(--gold); background: var(--gold-soft); }
.opt input { width: 19px; height: 19px; accent-color: var(--gold); flex: none; margin: 0; }
.opt-ic svg { width: 26px; height: 26px; color: var(--gold); }
.opt-t { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.opt-t b { font-size: 15px; }
.opt-t small { font-size: 12.5px; color: var(--muted); }
.opt-p { font-size: 15px; }
.opt-logos { display: none; gap: 4px; }
.opt-logos i { display: inline-flex; align-items: center; height: 22px; padding: 0 6px; border-radius: 5px; background: #fff; border: 1px solid rgba(0, 0, 0, .08); }
.opt-logos svg { height: 12px; width: auto; display: block; }
.opt-body { margin: 8px 4px 2px; }
.opt-body p { display: flex; gap: 10px; font-size: 13.5px; color: var(--ink-2); line-height: 1.55; }
.opt-body svg { width: 18px; height: 18px; color: var(--gold); flex: none; margin-top: 2px; }
.co-account { padding-top: 6px; }
.co-account[hidden] { display: none; }
.co-account .sub-block { margin-top: 12px; }
.co-terms { display: flex; flex-direction: column; gap: 10px; padding: 16px; border-radius: 16px; background: var(--bg); border: 1px solid var(--line); }
.co-submit { height: 58px; font-size: 16.5px; justify-content: space-between; padding-inline: 22px; }
.co-submit span { flex: 1; text-align: left; }
.co-submit b { font-size: 18px; }
.co-secure { display: flex; align-items: center; gap: 8px; justify-content: center; font-size: 12.5px; color: var(--muted); text-align: center; }
.co-secure svg { width: 16px; height: 16px; color: #2f9e62; flex: none; }
.co-sum-toggle { display: flex; align-items: center; gap: 10px; width: 100%; padding: 14px 16px; border-radius: 16px; background: var(--surface); border: 1px solid var(--line); font-size: 14.5px; font-weight: 600; color: var(--gold); }
.co-sum-toggle svg { width: 19px; height: 19px; }
.co-sum-toggle span { flex: 1; text-align: left; }
.co-sum-toggle b { color: var(--ink); font-size: 16px; }
.co-sum-toggle .chev { color: var(--muted); transition: transform .3s; }
.co-sum-toggle[aria-expanded="true"] .chev { transform: rotate(180deg); }
.rv-items { display: flex; flex-direction: column; gap: 12px; max-height: 330px; overflow-y: auto; padding-right: 4px; }
.rv-items li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 12px; align-items: center; font-size: 14px; }
.ri-th { position: relative; }
.ri-th > img { width: 44px; height: 62px; object-fit: cover; border-radius: 2px 4px 4px 2px; box-shadow: 2px 4px 10px -4px rgba(0, 0, 0, .5); }
.ri-th .cr-set { width: 58px; height: 70px; }
.ri-th .cr-set img { width: 36px !important; height: 52px !important; }
.ri-th > b { position: absolute; top: -7px; right: -7px; min-width: 21px; height: 21px; padding: 0 5px; border-radius: 999px; background: var(--ink); color: var(--bg); font-size: 11.5px; display: inline-flex; align-items: center; justify-content: center; z-index: 6; }
.ri-t strong { display: block; font-size: 13.5px; line-height: 1.3; }
.ri-t small { display: block; color: var(--muted); font-size: 12px; }
/* sözleşme penceresi + onay kutusu */
.doc-box { position: relative; z-index: 1; width: min(760px, 100%); max-height: calc(100vh - 40px); display: flex; flex-direction: column; border-radius: 22px; background: var(--bg); box-shadow: var(--shadow-lg); overflow: hidden; }
.doc-box.sm { width: min(440px, 100%); }
.doc-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 16px 20px; border-bottom: 1px solid var(--line); }
.doc-head h2 { font-family: var(--display); font-size: 22px; }
.doc-body { padding: 20px 22px; overflow-y: auto; font-size: 14px; line-height: 1.7; color: var(--ink-2); }
.doc-body h3 { font-size: 17px; color: var(--ink); margin: 6px 0 10px; }
.doc-body h4 { font-size: 14.5px; color: var(--ink); margin: 16px 0 8px; }
.doc-body p + p { margin-top: 10px; }
.doc-draft { display: flex; gap: 8px; padding: 10px 12px; border-radius: 12px; background: rgba(224, 146, 40, .12); color: #a8661a; font-size: 12.5px; margin-bottom: 14px; }
:root[data-theme="dark"] .doc-draft { color: #f0b765; }
.doc-draft svg { width: 16px; height: 16px; flex: none; margin-top: 3px; }
.doc-tbl { width: 100%; border-collapse: collapse; font-size: 13px; margin: 8px 0 12px; }
.doc-tbl th, .doc-tbl td { padding: 8px 10px; border-bottom: 1px solid var(--line); text-align: left; }
.doc-tbl th:not(:first-child), .doc-tbl td:not(:first-child) { text-align: right; }
.doc-tbl tfoot td { border-bottom: 0; }
.doc-foot { display: flex; justify-content: flex-end; gap: 10px; padding: 14px 20px; border-top: 1px solid var(--line); background: var(--bg-2); }
.confirm-modal .overlay { opacity: 1; visibility: visible; }
.confirm-modal .doc-body { font-size: 15.5px; color: var(--ink); }
.pay-wait { position: fixed; inset: 0; z-index: 300; display: flex; align-items: center; justify-content: center; background: rgba(10, 12, 16, .6); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.pay-wait[hidden] { display: none; }
.pw-box { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 30px 34px; border-radius: 22px; background: var(--bg); text-align: center; box-shadow: var(--shadow-lg); }
.pw-box .spin { width: 38px; height: 38px; border-radius: 50%; border: 3px solid var(--gold); border-right-color: transparent; animation: spin .8s linear infinite; }
.pw-box small { color: var(--muted); }

/* ---------- sipariş sonucu ---------- */
.result-page { padding-top: 36px; }
.res-hero { text-align: center; max-width: 720px; margin: 0 auto 34px; display: flex; flex-direction: column; align-items: center; gap: 14px; }
.res-ic { width: 84px; height: 84px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; animation: pop .7s var(--ease) both; }
.res-ic svg { width: 42px; height: 42px; }
.res-hero.ok .res-ic { background: rgba(47, 158, 98, .14); color: #2f9e62; box-shadow: 0 0 0 10px rgba(47, 158, 98, .07); }
.res-hero.warn .res-ic { background: rgba(224, 146, 40, .15); color: #c7771a; box-shadow: 0 0 0 10px rgba(224, 146, 40, .07); }
.res-hero.err .res-ic { background: rgba(214, 69, 51, .13); color: #d64533; box-shadow: 0 0 0 10px rgba(214, 69, 51, .06); }
@keyframes pop { from { transform: scale(.4); opacity: 0; } to { transform: none; opacity: 1; } }
.res-hero h1 { font-family: var(--display); font-size: clamp(28px, 3.2vw, 44px); line-height: 1.12; text-wrap: balance; }
.res-hero p { color: var(--ink-2); font-size: 16px; }
.res-no { display: inline-flex; align-items: center; gap: 12px; padding: 8px 8px 8px 18px; border-radius: 999px; background: var(--surface); border: 1px solid var(--line-2); }
.res-no span { font-size: 13px; color: var(--muted); }
.res-no b { font-size: 18px; }
.res-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; align-items: start; }
.res-col { display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.res-card { padding: 22px; border-radius: 22px; background: var(--surface); border: 1px solid var(--line); display: flex; flex-direction: column; gap: 14px; }
.res-card h2 { display: flex; align-items: center; gap: 10px; font-size: 17px; }
.res-card h2 svg { width: 21px; height: 21px; color: var(--gold); }
.res-card p { color: var(--ink-2); font-size: 14.5px; }
.res-card.bank { border-color: rgba(224, 146, 40, .45); background: linear-gradient(180deg, rgba(224, 146, 40, .07), transparent 60%), var(--surface); }
.res-card > .btn, .res-card.cta .btn { align-self: flex-start; }
.res-card.follow h2 svg { color: #E1306C; }
.bank-dl, .kv { margin: 0; display: flex; flex-direction: column; gap: 8px; }
.bank-dl div, .kv div { display: flex; justify-content: space-between; gap: 14px; font-size: 14px; flex-wrap: wrap; }
.bank-dl dt, .kv dt { color: var(--muted); }
.bank-dl dd, .kv dd { margin: 0; font-weight: 600; text-align: right; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.next-steps { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; counter-reset: n; }
.next-steps li { position: relative; padding-left: 38px; font-size: 13.5px; color: var(--muted); counter-increment: n; }
.next-steps li::before { content: counter(n); position: absolute; left: 0; top: 0; width: 26px; height: 26px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 12.5px; font-weight: 700; background: var(--bg-2); color: var(--ink-2); }
.next-steps li.done::before { content: "✓"; background: #2f9e62; color: #fff; }
.next-steps b { display: block; font-size: 14.5px; color: var(--ink); }
.gift-note { display: flex; gap: 8px; align-items: flex-start; }
.gift-note svg { width: 17px; height: 17px; color: var(--gold); flex: none; margin-top: 3px; }
address { font-style: normal; font-size: 14.5px; line-height: 1.65; color: var(--ink-2); }
.dot-list { display: flex; flex-direction: column; gap: 8px; }
.dot-list li { position: relative; padding-left: 18px; font-size: 14.5px; color: var(--ink-2); }
.dot-list li::before { content: ""; position: absolute; left: 3px; top: 10px; width: 6px; height: 6px; border-radius: 50%; background: var(--gold); }
.demo-switch { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 6px; margin-top: 30px; padding: 10px; border-radius: 999px; border: 1px dashed var(--line-2); font-size: 12.5px; color: var(--muted); width: fit-content; margin-inline: auto; }
.demo-switch a { padding: 5px 11px; border-radius: 999px; }
.demo-switch a.on, .demo-switch a:hover { background: var(--gold-soft); color: var(--gold); }

/* ---------- sipariş satırları / durum (hesabım · sonuç · takip) ---------- */
.o-lines { display: flex; flex-direction: column; }
.o-lines li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 14px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--line); }
.o-lines li:last-child { border-bottom: 0; }
.o-lines li > img { width: 48px; height: 68px; object-fit: cover; border-radius: 2px 4px 4px 2px; box-shadow: 2px 4px 10px -4px rgba(0, 0, 0, .5); }
.o-lines strong { display: block; font-size: 14.5px; line-height: 1.3; }
.o-lines a:hover strong { color: var(--gold); }
.o-lines small { display: block; color: var(--muted); font-size: 12.5px; }
.o-acts { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 6px; }
.o-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 4px; }
.o-steps li { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 6px; font-size: 12px; color: var(--muted); }
.o-steps li::before { content: ""; position: absolute; top: 13px; left: calc(-50% + 16px); right: calc(50% + 16px); height: 3px; border-radius: 3px; background: var(--line-2); }
.o-steps li:first-child::before { display: none; }
.o-steps li.done::before, .o-steps li.on::before { background: var(--gold); }
.o-steps .dot { width: 28px; height: 28px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; border: 2px solid var(--line-2); background: var(--surface); position: relative; z-index: 1; }
.o-steps .dot svg { width: 14px; height: 14px; }
.o-steps li.done .dot { background: var(--gold); border-color: var(--gold); color: var(--on-gold); }
.o-steps li.on .dot { border-color: var(--gold); box-shadow: 0 0 0 5px var(--gold-soft); }
.o-steps li.on .dot::after { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--gold); }
.o-steps li.on.wait .dot { border-color: #e0a23b; box-shadow: 0 0 0 5px rgba(224, 146, 40, .15); }
.o-steps li.on.wait .dot::after { background: #e0a23b; }
.o-steps b { font-size: 12.5px; color: var(--ink-2); font-weight: 600; line-height: 1.3; }
.o-steps li.on b, .o-steps li.done b { color: var(--ink); }
.o-steps small { font-size: 11.5px; }
.o-cargo { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; margin-top: 18px; padding: 14px 16px; border-radius: 16px; background: var(--bg-2); }
.o-cargo > svg { width: 28px; height: 28px; color: var(--gold); flex: none; }
.o-cargo p { flex: 1; min-width: 200px; font-size: 13.5px; color: var(--ink-2); }
.o-cargo p b { display: block; color: var(--ink); font-size: 14.5px; }
.o-cargo.muted p { color: var(--muted); }
.o-cancel { display: flex; align-items: center; gap: 10px; padding: 12px 16px; border-radius: 14px; background: var(--bg-2); color: var(--muted); font-size: 14px; }
.o-cancel svg { width: 18px; height: 18px; }

/* ---------- hesabım ---------- */
.acc-page { padding-bottom: 70px; }
.acc-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 22px; align-items: start; }
.acc-side { display: flex; flex-direction: column; gap: 14px; }
.acc-user { display: flex; align-items: center; gap: 14px; padding: 18px; border-radius: 20px; background: radial-gradient(120% 140% at 0% 0%, var(--gold-soft), transparent 60%), var(--surface); border: 1px solid var(--line); }
.acc-ava { width: 52px; height: 52px; border-radius: 50%; flex: none; display: inline-flex; align-items: center; justify-content: center; font-family: var(--display); font-size: 24px; font-weight: 700; color: var(--on-gold); background: var(--gold-grad); background-size: 250% 100%; }
.acc-user strong { display: block; font-size: 16px; }
.acc-user small { display: block; color: var(--muted); font-size: 13px; overflow: hidden; text-overflow: ellipsis; }
.acc-user > div { min-width: 0; }
.acc-nav ul { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; padding: 6px; border-radius: 18px; background: var(--surface); border: 1px solid var(--line); }
.acc-nav ul::-webkit-scrollbar { display: none; }
.acc-nav a { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-radius: 12px; font-size: 14.5px; font-weight: 500; color: var(--ink-2); white-space: nowrap; transition: background .2s, color .2s; }
.acc-nav a svg { width: 18px; height: 18px; flex: none; }
.acc-nav a .n { margin-left: auto; min-width: 22px; padding: 1px 7px; border-radius: 999px; font-size: 11.5px; text-align: center; background: var(--bg-2); color: var(--muted); }
.acc-nav a .n:empty { display: none; }
.acc-nav a:hover { background: var(--gold-soft); color: var(--gold); }
.acc-nav a.on { background: var(--gold-soft); color: var(--gold); font-weight: 600; }
.acc-nav .sep a:hover { background: rgba(214, 69, 51, .1); color: #d64533; }
.acc-help { display: none; gap: 12px; padding: 16px; border-radius: 18px; border: 1px dashed var(--line-2); font-size: 13px; color: var(--muted); }
.acc-help svg { width: 24px; height: 24px; color: var(--gold); flex: none; }
.acc-help b { display: block; color: var(--ink); font-size: 14px; }
.acc-help a { color: var(--gold); font-weight: 600; }
.acc-main { min-width: 0; display: flex; flex-direction: column; gap: 18px; }
.acc-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }
.acc-head h1, .acc-head h2 { font-family: var(--display); font-size: clamp(26px, 2.6vw, 36px); line-height: 1.15; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.track-card .acc-head h2 { font-size: 24px; }
.acc-head p { color: var(--ink-2); margin-top: 6px; font-size: 14.5px; }
.acc-sec { padding: 20px; border-radius: 20px; background: var(--surface); border: 1px solid var(--line); }
.acc-sec > h2, .sec-row h2 { font-size: 16px; margin-bottom: 14px; display: flex; align-items: center; gap: 8px; }
.acc-sec h2.mt { margin-top: 18px; }
.acc-sec h2 svg, .addr-card h2 svg { width: 19px; height: 19px; color: var(--gold); }
.sec-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 14px; }
.sec-row h2 { margin: 0; }
.acc-2 { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; }
.stat-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.stat { display: flex; flex-direction: column; gap: 2px; padding: 16px; border-radius: 18px; background: var(--surface); border: 1px solid var(--line); transition: border-color .2s, transform .2s; }
.stat:hover { border-color: rgba(196, 146, 44, .5); transform: translateY(-2px); }
.stat svg { width: 22px; height: 22px; color: var(--gold); margin-bottom: 6px; }
.stat b { font-size: 26px; font-weight: 800; line-height: 1.1; }
.stat span { font-size: 13px; color: var(--muted); }
.o-last { display: flex; flex-direction: column; gap: 20px; }
.o-list { display: flex; flex-direction: column; gap: 10px; }
.o-card { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "t m s" "t m p"; gap: 6px 14px; align-items: center; padding: 14px 16px; border-radius: 18px; background: var(--surface); border: 1px solid var(--line); transition: border-color .2s, transform .2s; }
.o-last .o-card { padding: 0; border: 0; background: none; }
.o-card:hover { border-color: rgba(196, 146, 44, .5); }
.o-thumbs { grid-area: t; display: flex; align-items: center; }
.o-thumbs img { width: 38px; height: 54px; object-fit: cover; border-radius: 2px 4px 4px 2px; box-shadow: 2px 3px 8px -3px rgba(0, 0, 0, .5); border: 2px solid var(--surface); }
.o-thumbs img + img { margin-left: -14px; }
.o-thumbs b { margin-left: 4px; font-size: 12px; color: var(--muted); }
.o-meta { grid-area: m; display: flex; flex-direction: column; min-width: 0; }
.o-meta b { font-size: 15px; }
.o-meta small { color: var(--muted); font-size: 12.5px; }
.o-card .pill { grid-area: s; justify-self: end; }
.o-total { grid-area: p; justify-self: end; font-size: 15px; }
.o-arr { display: none; }
.o-foot { display: flex; flex-wrap: wrap; gap: 8px; }
.btn.danger { color: #d64533; border-color: rgba(214, 69, 51, .4); }
.btn.danger:hover { background: rgba(214, 69, 51, .08); color: #d64533; }
.chips { display: flex; gap: 8px; flex-wrap: wrap; }
.chip-f { padding: 8px 14px; border-radius: 999px; border: 1px solid var(--line-2); background: var(--surface); font-size: 13.5px; font-weight: 500; color: var(--ink-2); }
.chip-f.on { background: var(--ink); border-color: var(--ink); color: var(--bg); }
.chip-f:not(.on):hover { border-color: var(--gold); color: var(--gold); }
.quick { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.quick a { display: flex; align-items: center; gap: 10px; padding: 14px; border-radius: 14px; background: var(--bg); border: 1px solid var(--line); font-size: 14px; font-weight: 500; transition: border-color .2s, color .2s; }
.quick svg { width: 20px; height: 20px; color: var(--gold); flex: none; }
.quick a:hover { border-color: var(--gold); color: var(--gold); }
.acc-empty { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 50px 20px; text-align: center; border-radius: 20px; border: 1px dashed var(--line-2); color: var(--muted); }
.acc-empty > svg { width: 46px; height: 46px; color: var(--line-2); }
.acc-empty.sm { padding: 26px 16px; }
.fav-grid { --cols: 2; }
.addr-card { padding: 20px; border-radius: 20px; background: var(--surface); border: 1px solid var(--line); }
.addr-card h2 { font-size: 16px; display: flex; align-items: center; gap: 8px; }
.acc-form { display: flex; flex-direction: column; gap: 14px; padding: 22px; border-radius: 20px; background: var(--surface); border: 1px solid var(--line); }
.acc-form h2 { font-size: 17px; }
.acc-form h2:not(:first-child) { margin-top: 10px; }
.danger-zone { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px; padding: 20px; border-radius: 20px; border: 1px solid rgba(214, 69, 51, .3); }
.danger-zone h2 { font-size: 16px; }
.danger-zone p { font-size: 13.5px; color: var(--muted); margin-top: 4px; max-width: 58ch; }
.sw-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--line); cursor: pointer; }
.sw-row b { display: block; font-size: 14.5px; }
.sw-row small { display: block; font-size: 12.5px; color: var(--muted); }
.sw { appearance: none; -webkit-appearance: none; width: 46px; height: 26px; border-radius: 999px; background: var(--line-2); position: relative; flex: none; cursor: pointer; transition: background .25s; margin: 0; }
.sw::after { content: ""; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; box-shadow: 0 2px 6px rgba(0, 0, 0, .3); transition: transform .25s var(--ease); }
.sw:checked { background: var(--gold); }
.sw:checked::after { transform: translateX(20px); }

/* ---------- giriş / üye ol (üst bar ve alt bilgi yok) ---------- */
.auth-body { background: var(--bg); }
.auth { display: grid; grid-template-columns: minmax(0, 1fr); min-height: 100vh; min-height: 100svh; }
.auth-brand { display: none; position: relative; overflow: hidden; padding: 40px; background: radial-gradient(70% 60% at 80% 20%, rgba(221, 172, 56, .22), transparent 70%), radial-gradient(60% 60% at 0% 100%, rgba(221, 172, 56, .14), transparent 70%), #24272c; color: #f2efe8; flex-direction: column; justify-content: space-between; gap: 30px; }
.auth-brand::before { content: ""; position: absolute; inset: 0; opacity: .35; background-image: radial-gradient(rgba(255, 255, 255, .12) 1px, transparent 1.2px); background-size: 26px 26px; -webkit-mask-image: linear-gradient(180deg, #000, transparent 85%); mask-image: linear-gradient(180deg, #000, transparent 85%); }
.auth-brand > * { position: relative; }
.ab-logo img { height: 150px; width: auto; filter: drop-shadow(0 6px 14px rgba(0, 0, 0, .35)); }
.ab-books { display: flex; justify-content: center; align-items: flex-end; min-height: 230px; --book-floor: rgba(0, 0, 0, .6); }
.ab-books .book3d { margin-left: -30px; }
.ab-books .book3d:first-child { margin-left: 0; }
.ab-books .book3d:nth-child(2) { transform: translateY(-18px); z-index: 2; }
.ab-slogan { font-family: var(--display); font-style: italic; font-size: clamp(24px, 2.2vw, 34px); line-height: 1.25; color: #ecc56c; max-width: 16ch; }
.ab-list { display: flex; flex-direction: column; gap: 10px; margin-top: 20px; }
.ab-list li { display: flex; align-items: center; gap: 12px; font-size: 14.5px; color: #c5c8ce; }
.ab-list svg { width: 20px; height: 20px; color: #ddac38; flex: none; }
.auth-main { display: flex; flex-direction: column; align-items: center; padding: 18px 16px 24px; gap: 18px; }
.auth-top { width: 100%; max-width: 480px; display: flex; align-items: center; gap: 12px; }
.auth-top .back-link { margin-left: auto; }
.auth-logo-m { display: inline-flex; padding: 6px 10px; border-radius: 12px; background: rgba(36, 39, 44, .94); }
.auth-logo-m img { height: 40px; width: auto; }
.auth-card { width: 100%; max-width: 480px; padding: clamp(22px, 4vw, 34px); border-radius: 26px; background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow-lg); display: flex; flex-direction: column; gap: 18px; margin-block: auto; }
.auth-tabs { position: relative; display: grid; grid-template-columns: 1fr 1fr; padding: 5px; border-radius: 16px; background: var(--bg-2); --ti: 0; }
.auth-tabs[hidden] { display: none; }
.auth-tabs button { position: relative; z-index: 1; padding: 11px; border-radius: 12px; font-weight: 600; font-size: 15px; color: var(--muted); transition: color .3s; }
.auth-tabs button[aria-selected="true"] { color: var(--ink); }
.tab-ink { position: absolute; top: 5px; bottom: 5px; left: 5px; width: calc(50% - 5px); border-radius: 12px; background: var(--surface-2); box-shadow: 0 6px 16px -8px rgba(0, 0, 0, .35); transform: translateX(calc(var(--ti) * 100%)); transition: transform .4s var(--ease); }
.auth-panel { display: flex; flex-direction: column; gap: 14px; }
.auth-panel[hidden] { display: none; }
.auth-h { font-family: var(--display); font-size: clamp(26px, 3vw, 32px); line-height: 1.15; }
.auth-sub { color: var(--ink-2); font-size: 14.5px; margin-top: -6px; }
.auth-alt { text-align: center; font-size: 14px; color: var(--muted); }
.auth-alt a { color: var(--gold); font-weight: 600; display: inline-flex; align-items: center; gap: 6px; }
.auth-alt a svg { width: 15px; height: 15px; }
.auth-panel .btn-block { height: 52px; }
.auth-ic { width: 60px; height: 60px; border-radius: 18px; display: inline-flex; align-items: center; justify-content: center; background: var(--gold-soft); color: var(--gold); }
.auth-ic svg { width: 28px; height: 28px; }
.auth-ic.ok { background: rgba(47, 158, 98, .13); color: #2f9e62; }
.auth-note { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border-radius: 14px; background: var(--gold-soft); font-size: 13.5px; color: var(--ink-2); }
.auth-note[hidden] { display: none; }
.auth-note svg { width: 18px; height: 18px; color: var(--gold); flex: none; margin-top: 2px; }
.auth-note a { color: var(--gold); font-weight: 600; }
.demo-tip { display: flex; gap: 8px; font-size: 12px; color: var(--muted); padding-top: 14px; border-top: 1px dashed var(--line-2); }
.demo-tip svg { width: 15px; height: 15px; flex: none; margin-top: 2px; }
.auth-foot { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--muted); text-align: center; }
.auth-foot svg { width: 16px; height: 16px; color: #2f9e62; flex: none; }
.guest-btn[hidden] { display: none; }

/* ---------- sipariş takibi / 404 ---------- */
.track-sec { padding-top: 20px; }
.track-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 22px; align-items: start; }
.track-form { display: flex; flex-direction: column; gap: 14px; padding: 24px; border-radius: 22px; background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow); }
.track-out { min-width: 0; }
.track-ph { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; min-height: 240px; padding: 30px; border-radius: 22px; border: 1px dashed var(--line-2); text-align: center; color: var(--muted); }
.track-ph svg { width: 46px; height: 46px; color: var(--line-2); }
.track-ph.err svg { color: #d64533; }
.track-card { display: flex; flex-direction: column; gap: 20px; padding: 24px; border-radius: 22px; background: var(--surface); border: 1px solid var(--line); }
.nf { padding-top: 20px; }
.nf-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 30px; align-items: center; }
.nf-copy .cta-row { margin-top: 26px; }
.nf-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 30px; }
.nf-links a { display: flex; align-items: center; gap: 10px; padding: 14px; border-radius: 14px; background: var(--surface); border: 1px solid var(--line); font-weight: 500; font-size: 14.5px; }
.nf-links svg { width: 20px; height: 20px; color: var(--gold); }
.nf-links a:hover { border-color: var(--gold); color: var(--gold); }
.nf-art { display: flex; justify-content: center; }
.nf-num { display: inline-flex; align-items: center; gap: 10px; font-family: var(--display); font-size: clamp(120px, 16vw, 230px); font-weight: 700; line-height: 1; background: var(--gold-grad); background-size: 250% 100%; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; animation: gold-shift 6s linear infinite; }
.nf-book { display: inline-flex; margin-inline: 8px; }
.nf-book .book3d { cursor: pointer; }

/* ---------- duyarlı ---------- */
@media (min-width: 640px) {
  .f-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pd-spec { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .set-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cart-row { grid-template-columns: 70px minmax(0, 1fr) auto auto; grid-template-areas: "t i q p"; padding: 18px 60px 18px 20px; }
  .cr-info { padding-right: 0; }
  .cr-del { top: 50%; transform: translateY(-50%); right: 16px; }
  .cr-total { min-width: 90px; }
  .fh-bar { padding-inline: 28px; }
  .secure-pill { display: inline-flex; }
  .opt-logos { display: flex; }
  .res-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .note-card { grid-template-columns: auto minmax(0, 1fr) auto; }
  .fav-grid { --cols: 3; }
  .quick { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .o-card { grid-template-columns: auto minmax(0, 1fr) auto auto 20px; grid-template-areas: "t m s p a"; }
  .o-arr { display: block; grid-area: a; width: 18px; height: 18px; color: var(--muted); transform: rotate(-90deg); }
  .acc-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 900px) {
  .pd-top { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 44px; }
  .pd-media { position: sticky; top: 96px; }
  .pd-stage { min-height: 580px; }
  .pd-about { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 50px; }
  .fbt { grid-template-columns: minmax(0, 1fr) 280px; }
  .rv-grid { grid-template-columns: 300px minmax(0, 1fr); gap: 36px; }
  .rv-sum { position: sticky; top: 140px; }
  .qa-grid { grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); }
  .qa-grid .sec-head { position: sticky; top: 140px; align-self: start; }
  .rel-track { grid-auto-flow: row; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: visible; }
  .flow-grid { grid-template-columns: minmax(0, 1fr) 380px; gap: 30px; }
  .flow-side { position: sticky; top: 90px; }
  .co-sum-toggle { display: none; }
  .ph-grid { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); }
  .ph-books { min-height: 260px; }
  .track-grid { grid-template-columns: 400px minmax(0, 1fr); gap: 30px; }
  .nf-grid { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); }
}
@media (max-width: 899px) {
  .co-side { display: none; order: -1; }
  .co-side.open { display: flex; }
  .checkout-page .flow-grid { display: flex; flex-direction: column; align-items: stretch; }
  .checkout-page .flow-grid[hidden] { display: none; }
  .checkout-page .flow-main { display: contents; }
  .co-login { order: -3; }
  .co-sum-toggle { order: -2; }
}
@media (min-width: 1024px) {
  body:not(.home):not(.is-flow):not(.auth-body) main { padding-top: 158px; }
  .pd-tabs { top: 66px; }
  .acc-grid { grid-template-columns: 280px minmax(0, 1fr); gap: 30px; }
  .acc-side { position: sticky; top: 110px; }
  .acc-nav ul { flex-direction: column; overflow: visible; padding: 8px; }
  .acc-nav a { white-space: normal; }
  .acc-help { display: flex; }
  .auth { grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); }
  .auth-brand { display: flex; position: sticky; top: 0; height: 100vh; height: 100svh; }
  .auth-logo-m { display: none; }
  .auth-top .back-link { margin-left: 0; }
  .auth-top { justify-content: space-between; }
  .auth-main { padding: 28px 40px; justify-content: space-between; }
  .rel-track .p-stage { min-height: 290px; }
  .res-grid { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 22px; }
}
@media (max-width: 639px) {
  body:not(.home):not(.is-flow):not(.auth-body) main { padding-top: 116px; }
  .pd-tabs { top: 56px; }
  .pd-tabs ul { justify-content: flex-start; padding-top: 15px; }   /* yapışkan logo plakası sekmelerin üstüne sarkmasın */
  .pd-stage { min-height: 400px; }
  .pd-form .btn-gold { flex-basis: 100%; order: 3; }
  .pd-now { flex: 1; }
  .pd-perks { grid-template-columns: minmax(0, 1fr); }
  .fbt-item { flex-basis: 150px; }
  .steps .st-t { display: none; }
  .steps li.on .st-t { display: inline; }
  .fh-logo img { height: 38px; }
  .fh-bar { gap: 10px; padding-inline: 14px; }
  .flow-page { padding-top: 18px; }
  .res-no { flex-wrap: wrap; justify-content: center; border-radius: 18px; padding: 10px 14px; }
  .o-steps b { font-size: 11px; }
  .o-steps small { display: none; }
  .stat { padding: 12px; }
  .stat b { font-size: 22px; }
  .ph-books .book3d { --bw: 104px !important; }
  .co-submit { font-size: 15px; padding-inline: 16px; }
  .ab-books { min-height: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .res-ic { animation: none; }
  .nf-num { animation: none; }
}

/* =====================================================================
   İçerik sayfaları: blog · yazarlar · hakkımızda · iletişim · yayın başvurusu · okur yorumları · sözleşmeler
   ===================================================================== */
.alt-bg { background: var(--bg-2); }
.sec-title { font-family: var(--display); font-size: clamp(28px, 2.8vw, 40px); line-height: 1.15; margin-bottom: 16px; }
.hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.side-card { padding: 20px; border-radius: 20px; background: var(--surface); border: 1px solid var(--line); display: flex; flex-direction: column; gap: 10px; }
.side-card h3 { display: flex; align-items: center; gap: 8px; font-size: 16px; }
.side-card h3 svg { width: 19px; height: 19px; color: var(--gold); }
.side-card p { font-size: 14px; color: var(--ink-2); }
.side-card .btn { align-self: flex-start; }
.form-ok { display: flex; gap: 12px; align-items: flex-start; padding: 14px 16px; border-radius: 14px; background: rgba(47, 158, 98, .12); color: var(--ink-2); font-size: 14px; }
.form-ok svg { width: 22px; height: 22px; color: #2f9e62; flex: none; }
.form-ok b { display: block; color: var(--ink); }
/* okunabilir metin */
.prose { font-size: 17px; line-height: 1.8; color: var(--ink-2); }
.prose > * + * { margin-top: 16px; }
.prose h2 { font-family: var(--display); font-size: clamp(22px, 2vw, 28px); line-height: 1.25; color: var(--ink); margin-top: 34px; }
.prose h3 { font-size: 18px; color: var(--ink); margin-top: 24px; }
.prose strong, .prose b { color: var(--ink); }
.prose a { color: var(--gold); text-decoration: underline; text-underline-offset: 3px; }
.prose ul, .prose ol { padding-left: 22px; }
.prose ul { list-style: disc; }
.prose li + li { margin-top: 6px; }
.prose li::marker { color: var(--gold); }
.prose blockquote { margin: 28px 0; padding: 18px 24px; border-left: 3px solid var(--gold); border-radius: 0 16px 16px 0; background: var(--gold-soft); font-family: var(--display); font-style: italic; font-size: 20px; line-height: 1.5; color: var(--ink); }
.doc-ph { padding: 12px 14px; border-radius: 12px; border: 1px dashed var(--line-2); font-size: 14px; color: var(--muted); }
/* blog */
.blog-cats { margin-bottom: 24px; }
.post-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; }
.post-card { display: flex; flex-direction: column; border-radius: 22px; overflow: hidden; background: var(--surface); border: 1px solid var(--line); transition: border-color .3s, transform .3s var(--ease), box-shadow .3s; }
.post-card:hover { border-color: rgba(196, 146, 44, .45); transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.pc-art, .post-art { --t1: #d9ecf7; --t2: #b8d8ef; position: relative; display: flex; align-items: center; justify-content: center; min-height: 220px; padding: 26px; background: linear-gradient(135deg, var(--t1), var(--t2)); overflow: hidden; }
.pc-art::after, .post-art::after { content: ""; position: absolute; right: -80px; top: -80px; width: 260px; height: 260px; border-radius: 50%; background: rgba(255, 255, 255, .35); }
.pc-art[data-tone="sun"], .post-art[data-tone="sun"] { --t1: #fff1cf; --t2: #f6cf74; }
.pc-art[data-tone="autumn"], .post-art[data-tone="autumn"] { --t1: #f6dfc9; --t2: #e3a877; }
.pc-art[data-tone="stone"], .post-art[data-tone="stone"] { --t1: #eceae6; --t2: #cfcbc3; }
.pc-art[data-tone="rose"], .post-art[data-tone="rose"] { --t1: #fbe1e6; --t2: #eeb3c1; }
:root[data-theme="dark"] .pc-art, :root[data-theme="dark"] .post-art { filter: saturate(.9) brightness(.9); }
.pc-art .chip { position: absolute; left: 16px; top: 16px; z-index: 2; background: rgba(29, 32, 39, .85); color: #fff; border: 0; }
.pc-book, .pa-book { position: relative; z-index: 1; display: inline-flex; --book-floor: rgba(20, 24, 32, .35); }
.pc-book > img, .pa-book > img, .bb-book > img { box-shadow: 0 18px 30px -16px rgba(0, 0, 0, .5); border-radius: 2px 5px 5px 2px; }
.pc-body { display: flex; flex-direction: column; gap: 10px; padding: 20px 22px 22px; flex: 1; }
.pc-meta { font-size: 12.5px; color: var(--muted); }
.pc-body h2, .pc-body h3 { font-family: var(--display); font-size: 22px; line-height: 1.25; }
.pc-body h2 a:hover, .pc-body h3 a:hover { color: var(--gold); }
.pc-body > p:not(.pc-meta) { font-size: 14.5px; color: var(--ink-2); }
.pc-body .link-btn { margin-top: auto; }
.post-card.is-feat { margin-bottom: 20px; }
.post-card.is-feat h2 { font-size: clamp(26px, 2.6vw, 36px); }
/* yazı detay */
.post-wrap { padding-bottom: 40px; }
.post-head { max-width: 820px; display: flex; flex-direction: column; align-items: flex-start; gap: 14px; }
.post-meta { display: flex; align-items: center; gap: 12px; font-size: 14px; }
.pm-ava { width: 46px; height: 46px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: rgba(36, 39, 44, .94); flex: none; }
.pm-ava img { width: 34px; height: auto; }
.post-meta b { display: block; }
.post-meta small { display: block; color: var(--muted); font-size: 13px; }
.post-art { min-height: 300px; border-radius: 26px; margin: 28px 0 34px; }
.post-grid2 { display: grid; grid-template-columns: minmax(0, 1fr); gap: 34px; }
.post-content { max-width: 720px; }
.post-content .qv-share { margin-top: 34px; }
.post-side { display: flex; flex-direction: column; gap: 16px; }
.book-box { align-items: flex-start; }
.bb-book { align-self: center; display: inline-flex; margin: 6px 0 10px; }
.book-box h3 { font-family: var(--display); font-size: 20px; }
.book-box h3 a:hover { color: var(--gold); }
.book-box .price .now { font-size: 22px; }
.bb-acts { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 4px; }
.bb-acts .add-btn { background: var(--gold-grad); background-size: 200% 100%; color: var(--on-gold); }
/* yazarlar */
.au-h { display: flex; align-items: center; gap: 10px; font-family: var(--display); font-size: 26px; margin: 10px 0 18px; }
.au-h svg { width: 24px; height: 24px; color: var(--gold); }
.au-h:not(:first-child) { margin-top: 44px; }
.au-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; }
.au-card { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 16px; align-items: center; padding: 22px; border-radius: 24px; background: radial-gradient(120% 140% at 100% 0%, var(--gold-soft), transparent 55%), var(--surface); border: 1px solid var(--line); transition: border-color .3s, transform .3s var(--ease), box-shadow .3s; overflow: hidden; }
.au-card:hover { border-color: rgba(196, 146, 44, .5); transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.au-ava { width: 72px; height: 72px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-family: var(--display); font-weight: 700; font-size: 32px; color: var(--on-gold); background: var(--gold-grad); background-size: 250% 100%; box-shadow: 0 10px 24px -12px rgba(179, 129, 31, .8); flex: none; overflow: hidden; }
.au-ava img { width: 100%; height: 100%; object-fit: cover; }
.au-ava.xl { width: 120px; height: 120px; font-size: 54px; }
.au-t b { display: block; font-family: var(--display); font-size: 24px; line-height: 1.2; }
.au-t small { display: block; color: var(--gold); font-size: 13px; font-weight: 600; margin-top: 2px; }
.au-t em { display: block; font-style: normal; color: var(--muted); font-size: 14px; margin-top: 4px; }
.au-books { grid-column: 1 / -1; display: flex; align-items: flex-end; min-height: 110px; padding-left: 4px; }
.au-books .book3d + .book3d { margin-left: -18px; }
.au-n { position: absolute; right: 20px; bottom: 20px; display: inline-flex; align-items: center; gap: 6px; font-size: 13.5px; font-weight: 600; color: var(--gold); }
.au-n svg { width: 16px; height: 16px; }
.au-head { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; align-items: center; }
.au-sub { color: var(--ink-2); font-size: 16px; margin-top: 8px; }
.au-stats { display: flex; flex-wrap: wrap; gap: 10px; margin: 18px 0 20px; }
.au-stats li { display: flex; align-items: baseline; gap: 6px; padding: 8px 14px; border-radius: 999px; background: var(--surface); border: 1px solid var(--line); font-size: 13.5px; color: var(--muted); }
.au-stats b { font-size: 18px; color: var(--ink); }
/* hakkımızda */
.about-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.about-stats li { display: flex; flex-direction: column; gap: 2px; padding: 22px; border-radius: 22px; background: var(--surface); border: 1px solid var(--line); }
.about-stats b { font-family: var(--display); font-size: clamp(34px, 3.4vw, 48px); line-height: 1; color: var(--gold); }
.about-stats span { color: var(--muted); font-size: 14px; }
.about-stats-sec { padding-top: 10px; padding-bottom: 20px; }
.about-2 { display: grid; grid-template-columns: minmax(0, 1fr); gap: 34px; align-items: center; }
.about-quote { position: relative; padding: 34px; border-radius: 26px; background: #24272c; color: #f2efe8; overflow: hidden; }
.about-quote svg { position: absolute; right: -30px; bottom: -40px; width: 200px; height: 200px; opacity: .07; color: #ddac38; }
.about-quote blockquote p { font-family: var(--display); font-style: italic; font-size: clamp(22px, 2.2vw, 30px); line-height: 1.35; color: #ecc56c; }
.about-quote figcaption { margin-top: 16px; font-size: 14px; color: #c5c8ce; }
.value-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
.value { padding: 24px; border-radius: 22px; background: var(--surface); border: 1px solid var(--line); }
.value svg { width: 40px; height: 40px; padding: 9px; border-radius: 12px; color: var(--gold); background: var(--gold-soft); margin-bottom: 14px; }
.value h3 { font-size: 18px; margin-bottom: 6px; }
.value p { color: var(--ink-2); font-size: 14.5px; }
.about-values { background: var(--bg-2); }
.process { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; }
.process li { position: relative; padding: 22px 22px 22px 76px; border-radius: 20px; background: var(--surface); border: 1px solid var(--line); }
.process li > span { position: absolute; left: 20px; top: 20px; width: 40px; height: 40px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-weight: 800; background: var(--gold); color: var(--on-gold); }
.process b { display: block; font-size: 16px; margin-bottom: 4px; }
.process p { color: var(--ink-2); font-size: 14px; }
/* iletişim */
.contact-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; align-items: start; }
.contact-form, .apply-form { position: relative; display: flex; flex-direction: column; gap: 14px; padding: clamp(20px, 3vw, 32px); border-radius: 24px; background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow); }
.contact-form h2, .apply-form h2 { font-family: var(--display); font-size: 26px; }
.contact-form > .btn, .apply-form .btn { align-self: flex-start; }
.contact-side { display: flex; flex-direction: column; gap: 16px; }
.c-cards { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; }
.c-cards li { display: flex; gap: 14px; align-items: flex-start; padding: 16px 18px; border-radius: 18px; background: var(--surface); border: 1px solid var(--line); font-size: 14.5px; color: var(--ink-2); }
.c-cards svg { width: 24px; height: 24px; color: var(--gold); flex: none; margin-top: 2px; }
.c-cards b { display: block; color: var(--ink); margin-bottom: 2px; }
.c-social { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; font-size: 13.5px; color: var(--muted); }
.c-social a { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 999px; border: 1px solid var(--line-2); color: var(--ink-2); font-weight: 500; }
.c-social a:hover { border-color: var(--gold); color: var(--gold); }
.c-social svg { width: 16px; height: 16px; }
.map-box { border-radius: 20px; overflow: hidden; border: 1px solid var(--line); min-height: 260px; background: var(--bg-2); }
.map-box iframe { display: block; width: 100%; height: 320px; border: 0; }
.map-ph { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; min-height: 260px; padding: 24px; text-align: center; color: var(--muted); font-size: 13.5px; background: radial-gradient(var(--line-2) 1px, transparent 1.2px) 0 0 / 18px 18px; }
.map-ph svg { width: 36px; height: 36px; color: var(--gold); }
/* yayın başvurusu */
.apply-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; align-items: start; }
.apply-main { display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.apply-closed { display: flex; gap: 18px; align-items: flex-start; padding: clamp(20px, 3vw, 30px); border-radius: 24px; border: 1px solid rgba(196, 146, 44, .45); background: radial-gradient(120% 140% at 0% 0%, var(--gold-soft), transparent 60%), var(--surface); }
.ac-ic { width: 54px; height: 54px; border-radius: 16px; display: inline-flex; align-items: center; justify-content: center; background: var(--gold); color: var(--on-gold); flex: none; }
.ac-ic svg { width: 28px; height: 28px; }
.apply-closed h2 { font-family: var(--display); font-size: clamp(24px, 2.4vw, 32px); line-height: 1.2; }
.apply-closed p { color: var(--ink-2); margin: 8px 0 16px; }
.apply-form fieldset { border: 0; padding: 0; margin: 0; min-width: 0; display: flex; flex-direction: column; gap: 14px; }
.apply-form.is-closed fieldset { opacity: .45; filter: grayscale(.6); pointer-events: none; user-select: none; }
.apply-form.is-closed::before { content: "Başvurular şu an kapalı"; position: absolute; top: 24px; right: 24px; z-index: 2; padding: 6px 12px; border-radius: 999px; background: var(--ink); color: var(--bg); font-size: 12.5px; font-weight: 700; }
.file-in { position: relative; display: flex; align-items: center; gap: 12px; padding: 16px; border-radius: 14px; border: 1.5px dashed var(--line-2); background: var(--bg); color: var(--muted); font-size: 14px; }
.file-in svg { width: 24px; height: 24px; color: var(--gold); flex: none; }
.file-in em { font-style: normal; }
.fld .file-in input { position: absolute; inset: 0; opacity: 0; cursor: pointer; padding: 0; }
.file-in:hover { border-color: var(--gold); }
.apply-side { display: flex; flex-direction: column; gap: 16px; }
/* okur yorumları */
.rp-hero { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; align-items: end; }
.rp-score { display: flex; flex-direction: column; gap: 4px; padding: 22px; border-radius: 24px; background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow); }
.rp-score > b { font-size: 56px; font-weight: 800; line-height: 1; letter-spacing: -.03em; }
.rp-score .stars svg { width: 20px; height: 20px; }
.rp-score small { color: var(--muted); }
.rp-src { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 14px; margin-top: 12px; padding-top: 12px; border-top: 1px dashed var(--line-2); }
.rp-src li { display: flex; align-items: center; gap: 7px; font-size: 13px; color: var(--ink-2); }
.rp-src svg { width: 16px; height: 16px; flex: none; }
.rp-src span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rp-src b { font-size: 13px; }
.rp-sec { padding-top: 20px; }
.rp-tools { display: flex; flex-direction: column; gap: 14px; margin-bottom: 22px; }
.rp-selects { display: flex; flex-wrap: wrap; gap: 10px; }
.chip-f { display: inline-flex; align-items: center; gap: 7px; }
.chip-f b { font-size: 11.5px; padding: 1px 7px; border-radius: 999px; background: var(--bg-2); color: var(--muted); }
.chip-f.on b { background: rgba(255, 255, 255, .18); color: inherit; }
.src-chip svg { width: 15px; height: 15px; }
.rw-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; align-items: start; transition: opacity .3s; }
.rw-grid.loading { opacity: .35; pointer-events: none; }
.rw-card.is-new { animation: card-in .5s var(--ease) both; }
.rw-book { display: inline-flex; align-items: center; gap: 8px; max-width: 48%; font-size: 12px; font-weight: 600; color: var(--ink-2); text-align: right; line-height: 1.3; }
.rw-book img { width: 28px; height: auto; border-radius: 2px 3px 3px 2px; box-shadow: 2px 3px 6px -2px rgba(0, 0, 0, .5); flex: none; }
.rw-book:hover { color: var(--gold); }
.rw-date { font-size: 12px; color: var(--muted); }
.rp-cta { margin-top: 34px; }
.r-all { display: flex; justify-content: center; margin-top: 30px; }
/* sözleşmeler */
.doc-cards { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; }
.doc-card { display: flex; flex-direction: column; gap: 6px; padding: 22px; border-radius: 20px; background: var(--surface); border: 1px solid var(--line); transition: border-color .25s, transform .25s; }
.doc-card svg { width: 28px; height: 28px; color: var(--gold); margin-bottom: 6px; }
.doc-card b { font-size: 17px; }
.doc-card span { font-size: 14px; color: var(--muted); }
.doc-card:hover { border-color: var(--gold); transform: translateY(-3px); }
.doc-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 26px; align-items: start; padding-bottom: 50px; }
.doc-nav ul { display: flex; gap: 6px; overflow-x: auto; padding: 6px; border-radius: 18px; background: var(--surface); border: 1px solid var(--line); scrollbar-width: none; }
.doc-nav a { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-radius: 12px; font-size: 14px; color: var(--ink-2); white-space: nowrap; }
.doc-nav svg { width: 17px; height: 17px; flex: none; }
.doc-nav a:hover, .doc-nav a.on { background: var(--gold-soft); color: var(--gold); }
.doc-article { min-width: 0; padding: clamp(20px, 3vw, 36px); border-radius: 24px; background: var(--surface); border: 1px solid var(--line); }
.doc-article header { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 10px 20px; margin-bottom: 18px; }
.doc-article header .page-title { font-size: clamp(28px, 3vw, 40px); flex: 1 1 100%; }
.doc-article .prose { font-size: 15.5px; }
.doc-article .prose h2 { font-family: var(--body); font-size: 18px; font-weight: 700; margin-top: 26px; }
/* TMC Web imzası */
.tmc-sign { display: inline-flex; align-items: center; gap: 10px; padding: 6px 12px 6px 8px; border-radius: 999px; background: rgba(36, 39, 44, .94); border: 1px solid rgba(255, 255, 255, .08); color: #c5c8ce; font-size: 12px; transition: border-color .25s, transform .25s; }
.tmc-sign img { height: 22px; width: auto; }
.tmc-sign:hover { border-color: #ddac38; color: #ecc56c; transform: translateY(-1px); }
.sf-bottom { margin-top: 10px; }
.sf-bottom .sf-copy { margin: 0; }
@media (min-width: 640px) {
  .post-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .au-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .about-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .value-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .c-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rw-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .doc-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .au-head { grid-template-columns: auto minmax(0, 1fr); gap: 34px; }
  .rp-tools { flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: space-between; }
}
@media (min-width: 900px) {
  .post-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .post-card.is-feat { flex-direction: row; }
  .post-card.is-feat .pc-art { flex: 0 0 48%; min-height: 360px; }
  .post-card.is-feat .pc-body { padding: 36px; justify-content: center; }
  .post-grid2 { grid-template-columns: minmax(0, 1fr) 320px; gap: 50px; }
  .post-side { position: sticky; top: 110px; align-self: start; }
  .about-2 { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 50px; }
  .value-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .process { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .process li { padding: 70px 20px 22px; }
  .contact-grid { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 34px; }
  .contact-side { position: sticky; top: 110px; }
  .apply-grid { grid-template-columns: minmax(0, 1fr) 320px; gap: 34px; }
  .apply-side { position: sticky; top: 110px; }
  .rp-hero { grid-template-columns: minmax(0, 1fr) 380px; gap: 40px; }
  .rw-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .doc-grid { grid-template-columns: 280px minmax(0, 1fr); gap: 30px; }
  .doc-side { position: sticky; top: 110px; }
  .doc-nav ul { flex-direction: column; overflow: visible; }
  .doc-nav a { white-space: normal; }
  .doc-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .au-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 639px) {
  .footer-bottom .tmc-sign { margin-inline: auto; }
  .apply-form.is-closed::before { position: static; align-self: flex-start; }
}
@media print {
  .site-header, .site-footer, .doc-side, .doc-print, .cookie-bar, .to-top, .crumbs { display: none !important; }
  body:not(.home) main { padding-top: 0 !important; }
  .doc-article { border: 0; padding: 0; }
}
.page-hero.slim + .section { padding-top: 18px; }

/* kitap adları (Poppins) */
.pd-info h1, .set-page .page-title, .fbt-t b, .set-card h4, .book-box h3, .ps-t strong, .cr-name, .o-lines strong, .rel-static a, .ri-t strong {
  font-family: var(--body); letter-spacing: -.015em;
}
.pd-info h1 { font-weight: 700; font-size: clamp(30px, 3vw, 44px); line-height: 1.12; letter-spacing: -.02em; }
.set-page .page-title { font-weight: 700; letter-spacing: -.02em; }
.set-card h4, .book-box h3 { font-weight: 700; font-size: 18px; }
.fbt-t b, .cr-name, .o-lines strong { font-weight: 700; }
/* okur yorumları sayfası: anasayfa kartlarıyla aynı düzen */
.rw-grid .r-card { height: auto; }
.rw-grid .r-foot { min-height: 96px; }
/* TMC imzası: "bir [logo] markasıdır" */
.tmc-sign { gap: 7px; padding: 6px 12px; }
.tmc-sign img { height: 20px; }

/* ön sipariş: ürün sayfası */
.pd-stock.pre { color: #3f6fcf; }
.pd-stock.pre i { background: #3f6fcf; box-shadow: 0 0 0 4px rgba(63, 111, 207, .18); }
[data-theme="dark"] .pd-stock.pre { color: #9dbaf5; }
.pd-pre { display: flex; gap: 12px; align-items: flex-start; padding: 14px 16px; border-radius: 16px; background: rgba(63, 111, 207, .08); border: 1px solid rgba(63, 111, 207, .28); font-size: 14px; line-height: 1.55; color: var(--ink-2); }
.pd-pre svg { width: 20px; height: 20px; color: #3f6fcf; flex: none; margin-top: 1px; }
.pd-pre b { color: var(--ink); }
.pd-rate.is-wait svg { width: 17px; height: 17px; color: #3f6fcf; }
.rv-score.is-wait svg { width: 30px; height: 30px; color: #3f6fcf; }
.co-pre { display: flex; gap: 12px; align-items: flex-start; padding: 14px 16px; margin-bottom: 14px; border-radius: 16px; background: rgba(63, 111, 207, .08); border: 1px solid rgba(63, 111, 207, .28); font-size: 14px; line-height: 1.55; color: var(--ink-2); }
.co-pre svg { width: 20px; height: 20px; color: #3f6fcf; flex: none; margin-top: 1px; }
.co-pre b { color: var(--ink); }

/* giriş / üye ol: üyelik avantajları paneli */
.ab-logo img { height: 110px; }
.ab-perks { display: flex; flex-direction: column; gap: 14px; max-width: 580px; }
.ab-eyebrow { display: inline-flex; align-items: center; gap: 8px; font-size: 12.5px; letter-spacing: .14em; text-transform: uppercase; font-weight: 700; color: #ddac38; }
.ab-eyebrow svg { width: 16px; height: 16px; }
.ab-title { font-family: var(--display); font-size: clamp(28px, 2.6vw, 40px); line-height: 1.15; color: #f5efe2; }
.ab-lead { color: #c5c8ce; font-size: 15px; line-height: 1.6; max-width: 50ch; }
.ab-coupon { display: flex; align-items: center; gap: 14px; padding: 14px 16px; border-radius: 18px; background: linear-gradient(135deg, rgba(221, 172, 56, .2), rgba(221, 172, 56, .05)); border: 1px dashed rgba(236, 197, 108, .6); }
.abc-ic { width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; background: var(--gold-grad); color: #2a2006; flex: none; }
.abc-ic svg { width: 22px; height: 22px; }
.abc-t { display: flex; flex-direction: column; gap: 2px; font-size: 14px; color: #e4e0d6; flex: 1; min-width: 0; }
.abc-t b { color: #fff; font-size: 15px; }
.ab-coupon code { font-weight: 800; letter-spacing: .08em; padding: 8px 12px; border-radius: 10px; background: rgba(0, 0, 0, .35); color: #ecc56c; border: 1px solid rgba(236, 197, 108, .35); }
.ab-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.ab-grid li { display: flex; gap: 12px; align-items: flex-start; padding: 14px; border-radius: 16px; background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .08); transition: border-color .2s, background .2s; }
.ab-grid li:hover { border-color: rgba(236, 197, 108, .4); background: rgba(255, 255, 255, .06); }
.abg-ic { width: 36px; height: 36px; border-radius: 11px; display: grid; place-items: center; background: rgba(221, 172, 56, .14); color: #ecc56c; flex: none; }
.abg-ic svg { width: 19px; height: 19px; }
.ab-grid b { display: block; color: #f2efe8; font-size: 14.5px; font-weight: 600; margin-bottom: 3px; }
.ab-grid small { display: block; color: #a9adb5; font-size: 13px; line-height: 1.45; }
.ab-cta { align-self: flex-start; margin-top: 4px; }
.auth[data-tab="uye-ol"] .ab-cta { display: none; }
.auth-brand .ab-slogan { font-size: clamp(20px, 1.8vw, 26px); max-width: none; }
.ab-mini { display: flex; flex-direction: column; gap: 8px; margin: 2px 0 16px; padding: 12px 14px; border-radius: 14px; background: var(--gold-soft); }
.ab-mini li { display: flex; align-items: center; gap: 10px; font-size: 13.5px; color: var(--ink-2); }
.ab-mini svg { width: 17px; height: 17px; color: var(--gold); flex: none; }
.ab-mini .is-gift b { color: var(--ink); letter-spacing: .04em; }
@media (min-width: 1024px) {
  .auth-brand { overflow-y: auto; scrollbar-width: none; }
  .ab-mini { display: none; }
}
@media (min-width: 1024px) and (max-height: 960px) {
  .auth-brand .ab-slogan { display: none; }
  .ab-logo img { height: 90px; }
}
@media (min-width: 1024px) and (max-height: 820px) {
  .ab-logo img { height: 80px; }
  .ab-grid small { display: none; }
  .ab-lead { font-size: 14px; }
}

/* üyelik: SMS doğrulama kodu */
.sms-otp > label { font-size: 13.5px; font-weight: 600; color: var(--ink-2); }
.otp-in { display: flex; gap: 8px; }
.otp-in input { flex: 1; min-width: 0; letter-spacing: .3em; font-weight: 700; }
.otp-in .btn { flex: none; white-space: nowrap; }
.otp-in .btn svg { width: 16px; height: 16px; }
.sms-otp .fld-hint.warn-t { color: #d64533; }

/* ---------- sepet / ödeme: yükleniyor iskeleti ---------- */
.flow-skel .flow-main, .flow-skel .flow-side { display: flex; flex-direction: column; gap: 14px; }
.flow-skel .sk { display: block; border-radius: 18px; border: 1px solid var(--line); background: linear-gradient(100deg, var(--surface) 30%, var(--bg-2) 50%, var(--surface) 70%); background-size: 300% 100%; animation: shimmer 1.2s linear infinite; }
.flow-skel .sk-bar { height: 64px; }
.flow-skel .sk-row { height: 112px; }
.flow-skel .sk-row.short { height: 70px; width: 60%; }
.flow-skel .sk-card { height: 360px; border-radius: 22px; }
@media (prefers-reduced-motion: reduce) { .flow-skel .sk { animation: none; } }

/* ---------- sipariş özeti güncellenirken ---------- */
.sum-card { position: relative; }
.sum-card .sum-rows dd { transition: opacity .25s, color .4s; }
.sum-card.is-updating .sum-rows dd { color: transparent; border-radius: 6px; background: linear-gradient(100deg, var(--line) 30%, var(--bg-2) 50%, var(--line) 70%); background-size: 300% 100%; animation: shimmer 1s linear infinite; }
.sum-card.is-updating .sum-rows dd * { visibility: hidden; }
.sum-card.is-updated .sum-rows dd { animation: sumIn .5s var(--ease) both; }
.sum-card.is-updated .sum-rows .total dd { color: var(--gold); }
@keyframes sumIn { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
.sum-upd { position: absolute; top: 18px; right: 18px; display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; background: rgba(47, 158, 98, .14); color: #2f9e62; opacity: 0; transform: translateY(-4px); transition: opacity .3s, transform .3s; pointer-events: none; }
.sum-upd svg { width: 13px; height: 13px; }
.sum-card.is-updated .sum-upd { opacity: 1; transform: none; }
.cart-row.busy { opacity: .55; pointer-events: none; }
.sum-rows .fee dd { color: var(--ink); }

/* ---------- kargoyu ödeyen kitaplar: kompakt şerit ---------- */
.fs-picks { position: relative; margin-top: 18px; padding: 14px 16px 16px; border-radius: 18px; border: 1px solid color-mix(in srgb, var(--gold) 45%, transparent); background: linear-gradient(120deg, var(--gold-soft), transparent 65%), var(--surface); overflow: hidden; }
.fs-picks::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 4px; background: var(--gold-grad, var(--gold)); }
.fs-head { display: flex; gap: 12px; align-items: center; }
.fs-ic { flex: none; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 10px; background: var(--gold); color: var(--on-gold); animation: fs-nudge 3.2s ease-in-out infinite; }
.fs-ic svg { width: 19px; height: 19px; }
@keyframes fs-nudge { 0%, 80%, 100% { transform: none; } 86% { transform: translateX(3px); } 92% { transform: translateX(-1px); } }
.fs-txt { min-width: 0; }
.fs-head h2 { font-family: var(--display); font-size: 17px; line-height: 1.2; margin: 0; }
.fs-head p { margin: 2px 0 0; color: var(--ink-2); font-size: 13.5px; }
.fs-head p b { color: var(--gold); }
.fs-bar { height: 5px; margin: 11px 0 12px; border-radius: 99px; background: var(--line); overflow: hidden; }
.fs-bar i { display: block; height: 100%; width: 4%; border-radius: inherit; background: linear-gradient(90deg, var(--gold), #f1cf6a, var(--gold)); background-size: 200% 100%; animation: fs-shine 2.4s linear infinite; transition: width .6s var(--ease); }
@keyframes fs-shine { to { background-position: -200% 0; } }
.fs-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.fs-item { display: flex; align-items: center; gap: 10px; min-width: 0; padding: 8px 8px 8px 8px; border-radius: 14px; background: var(--bg); border: 1px solid var(--line); transition: border-color .2s, transform .2s, box-shadow .2s; }
.fs-item:hover { border-color: color-mix(in srgb, var(--gold) 60%, transparent); transform: translateY(-2px); box-shadow: 0 10px 22px -16px rgba(0, 0, 0, .5); }
.fs-item.is-cover { border-color: color-mix(in srgb, var(--gold) 55%, transparent); }
.fs-cover { flex: none; padding: 0; border-radius: 4px; overflow: hidden; box-shadow: 2px 3px 8px -2px rgba(0, 0, 0, .45); line-height: 0; cursor: zoom-in; }
.fs-cover img { width: 46px; height: 64px; object-fit: cover; }
.fs-info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.fs-name { font-weight: 600; font-size: 13.5px; line-height: 1.25; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.fs-price { font-weight: 700; font-size: 14px; }
.fs-price del { font-weight: 400; font-size: 12px; color: var(--muted); }
.fs-tag { display: inline-flex; align-items: center; gap: 4px; font-style: normal; font-size: 11.5px; color: var(--muted); }
.fs-tag svg { width: 12px; height: 12px; }
.fs-item.is-cover .fs-tag { color: #2f9e62; font-weight: 600; }
.fs-add { flex: none; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--gold); color: var(--on-gold); transition: transform .2s, filter .2s; }
.fs-add:hover { transform: scale(1.08); filter: brightness(1.06); }
.fs-add svg { width: 17px; height: 17px; }
@media (max-width: 899px) {
  .fs-list { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: minmax(230px, 78%); overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 4px; scrollbar-width: thin; }
  .fs-item { scroll-snap-align: start; }
}

/* sepette 3'lü kitap sıraları kutuyu tam doldurur */
@media (min-width: 900px) {
  .cross-sells .rel-track { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* ---------- sepette okur yorumları ---------- */
.cart-reviews { margin-top: 30px; }
.cart-reviews .sec-head { margin-bottom: 8px; }
.cart-reviews .link-more { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; font-size: 14px; color: var(--gold); }
.cart-reviews .link-more svg { width: 15px; height: 15px; }
.cart-reviews .marquee li { width: min(78vw, 360px); }

/* ---------- sözleşme penceresi: ayrı sayfada aç ---------- */
.doc-head { gap: 12px; }
.doc-page-link { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--gold); white-space: nowrap; }
.doc-page-link svg { width: 14px; height: 14px; }
.doc-foot { gap: 10px; }
.o-meta b .o-no-l { display: inline; font-weight: 500; margin-right: 2px; }