/* Breadcrumb — orta kolona özel */
.td-breadcrumb { margin: 0 0 0; padding: 16px 0 12px; }
.td-detay__main .td-breadcrumb { padding-top: 20px; }
.td-breadcrumb ol { display:flex; flex-wrap:wrap; gap:.35rem .5rem; list-style:none; margin:0; padding:0; font-size:.8rem; font-weight:600; color:var(--ink-muted); }
.td-breadcrumb li:not(:last-child)::after { content:"›"; margin-left:.5rem; color:var(--ink-muted); opacity:.7; }
.td-breadcrumb a { color:var(--primary-soft); text-decoration:none; }
.td-breadcrumb a:hover { color:var(--primary); text-decoration:underline; }

/* TemaDepo — Tema Detay Sayfası · v20260601-1
   Ana sayfa style.css değişkenlerini kullanır.
   Prefix: td- (mevcut sistemle uyumlu)
*/

/* ── LAYOUT ─────────────────────────── */
.td-detay {
    display: grid;
    grid-template-columns: 52px 1fr 268px;
    gap: 0;
    align-items: start;
    max-width: 1180px;
    margin: 0 auto;
    position: relative;
}

/* ── SOL PANEL ──────────────────────── */
.td-detay__left {
    position: sticky;
    top: 0;
    align-self: flex-start;
    padding: 12px 6px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    border-right: 1px solid var(--line-bright);
    height: 100vh;
    background: var(--surface);
    z-index: 30;
    overflow: hidden;
}
.tdl-btn {
    width: 38px; height: 38px;
    border-radius: 9px;
    border: 1px solid var(--line-bright);
    background: var(--surface-2);
    color: var(--ink-soft);
    display: flex; align-items: center; justify-content: center;
    cursor: pointer; font-size: 16px;
    font-weight: 600;
    transition: border-color .15s, color .15s, background .15s;
    text-decoration: none;
    box-shadow: 0 1px 3px rgba(20,24,38,.06);
}
.tdl-btn:hover { border-color: var(--primary); color: var(--primary); background: #eeeeff; box-shadow: 0 2px 8px rgba(85,88,223,.12); }
.tdl-btn.tdl-btn--active { border-color: var(--primary); color: var(--primary); background: #eeeeff; }
.tdl-div { width: 22px; height: 1px; background: var(--line-bright); margin: 1px 0; }
.tdl-scale-val { font-size: .7rem; font-weight: 800; color: var(--ink-soft); text-align: center; background: var(--surface-2); border: 1px solid var(--line-bright); border-radius: 6px; padding: 2px 0; width: 38px; }
.tdl-progress {
    width: 2px; height: 40px;
    background: var(--line-bright); border-radius: 2px; margin: 2px 0;
    position: relative; overflow: hidden;
}
.tdl-progress__fill {
    position: absolute; top: 0; left: 0; width: 100%;
    background: var(--primary); border-radius: 2px; transition: height .15s;
}

/* ── ORTA ALAN ──────────────────────── */
.td-detay__main {
    min-width: 0;
    padding: 0 28px 80px;
}

/* HERO */
.tdd-hero {
    display: grid;
    grid-template-columns: 1fr 360px;
    gap: 28px;
    padding: 36px 0 0;
    align-items: start;
}
.tdd-badge {
    display: inline-flex; align-items: center; gap: 6px;
    background: #eeeeff; color: #4045c0;
    font-size: .72rem; font-weight: 700;
    padding: 4px 11px; border-radius: 20px; letter-spacing: .05em;
    margin-bottom: 9px;
}
.tdd-badge__dot { width: 6px; height: 6px; background: var(--primary); border-radius: 50%; }
.tdd-name {
    font-family: var(--font-display);
    font-size: 2rem; font-weight: 800; line-height: 1.08;
    color: var(--ink); margin-bottom: 9px;
}
.tdd-name em { font-style: normal; color: var(--primary); }
.tdd-tagline {
    font-size: .91rem; color: var(--ink-soft);
    line-height: 1.6; max-width: 360px; margin-bottom: 11px;
}
.tdd-trust {
    display: flex; gap: 10px; flex-wrap: wrap;
    padding: 8px 11px;
    background: var(--surface-2);
    border-radius: var(--radius-md);
    border: 1px solid var(--line-bright);
    margin-bottom: 13px;
}
.tdd-trust-item {
    display: flex; align-items: center; gap: 4px;
    font-size: .78rem; color: var(--ink-soft); font-weight: 600;
}
.tdd-trust-item i { color: #22c55e; font-size: 13px; }
.tdd-btns { display: flex; gap: 8px; flex-wrap: wrap; }

/* Buttons */
.tdd-btn-buy {
    background: linear-gradient(135deg, var(--primary), var(--primary-soft));
    color: #fff; padding: 10px 20px; border-radius: 10px;
    font-size: .86rem; font-weight: 700; border: none; cursor: pointer;
    text-decoration: none; display: inline-flex; align-items: center; gap: 5px;
    transition: transform .15s, opacity .15s;
}
.tdd-btn-buy:hover { transform: translateY(-2px); opacity: .92; color: #fff; }
.tdd-btn-ghost {
    background: rgba(85,88,223,.08);
    border: 1.5px solid rgba(85,88,223,.35);
    color: var(--primary); padding: 9px 14px; border-radius: 10px;
    font-size: .83rem; font-weight: 700; cursor: pointer;
    text-decoration: none; display: inline-flex; align-items: center; gap: 5px;
    transition: border-color .15s, color .15s, background .15s, box-shadow .15s;
}
.tdd-btn-ghost:hover {
    border-color: var(--primary);
    background: rgba(85,88,223,.14);
    box-shadow: 0 2px 10px rgba(85,88,223,.18);
    color: var(--primary);
}

/* Hero görsel */
.tdd-img-wrap {
    border-radius: 14px; overflow: hidden;
    border: 1px solid var(--line-bright);
    aspect-ratio: 16/10; background: var(--surface-2);
    cursor: zoom-in; position: relative;
    display: flex; align-items: center; justify-content: center;
    flex-direction: column; gap: 7px;
    color: var(--ink-muted); font-size: .82rem;
}
.tdd-img-wrap img {
    width: 100%; height: 100%; object-fit: cover;
    position: absolute; inset: 0;
}
.tdd-img-wrap:hover .tdd-zoom-hint { opacity: 1; }
.tdd-zoom-hint {
    position: absolute; bottom: 8px; right: 8px;
    background: rgba(20,24,38,.6); color: #fff;
    font-size: .69rem; padding: 3px 8px; border-radius: 20px;
    display: flex; align-items: center; gap: 3px;
    opacity: 0; transition: opacity .2s; pointer-events: none; z-index: 2;
}
.tdd-img-placeholder { display: flex; flex-direction: column; align-items: center; gap: 7px; color: var(--ink-muted); font-size: .82rem; }
.tdd-img-placeholder i { font-size: 32px; color: var(--line-bright); }

/* Metrikler */
.tdd-metrics { display: flex; gap: 6px; margin-top: 10px; }
.tdd-mc {
    flex: 1; background: #fff; border: 1px solid var(--line-bright);
    border-radius: 14px; padding: 7px 6px;
    display: flex; flex-direction: column; align-items: center;
}
.tdd-mc__val { font-family: var(--font-display); font-size: 1rem; font-weight: 800; color: var(--primary); }
.tdd-mc__lbl { font-size: .62rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--ink-muted); }

/* Güven şeridi */
.tdd-strip {
    display: flex;
    border-top: 1px solid var(--line-bright);
    border-bottom: 1px solid var(--line-bright);
    margin-top: 24px;
    background: linear-gradient(90deg,
        rgba(85,88,223,.06) 0%,
        rgba(85,88,223,.02) 50%,
        rgba(85,88,223,.06) 100%
    );
}
.tdd-strip-item {
    display: flex; align-items: center; justify-content: center;
    gap: 5px; padding: 11px 0;
    font-size: .77rem; font-weight: 600; color: var(--ink-soft);
    flex: 1; border-right: 1px solid var(--line-bright);
    transition: background .15s;
}
.tdd-strip-item:hover { background: rgba(85,88,223,.06); }
.tdd-strip-item:last-child { border-right: none; }
.tdd-strip-item i { color: var(--primary); font-size: 13px; }

/* Tab navigasyon */
.tdd-tabs-wrap {
    position: sticky; top: 0;
    background: var(--surface); z-index: 40; padding-top: 3px;
}
.tdd-tabs {
    display: flex; gap: 1px;
    border-bottom: 1px solid var(--line-bright);
    overflow-x: auto;
}
.tdd-tab {
    padding: 10px 14px; font-size: .83rem; font-weight: 600;
    color: var(--ink-muted); background: none; border: none; cursor: pointer;
    border-bottom: 2.5px solid transparent; margin-bottom: -1px;
    white-space: nowrap; transition: color .15s, border-color .15s;
}
.tdd-tab.is-on { color: var(--primary); border-bottom-color: var(--primary); }

/* Bölüm */
.tdd-sec { padding-top: 28px; margin-bottom: 36px; }
.tdd-sec__title {
    font-family: var(--font-display);
    font-size: 1.15rem; font-weight: 800; color: var(--ink); margin-bottom: 3px;
}
.tdd-sec__sub { font-size: .84rem; color: var(--ink-muted); margin-bottom: 16px; }

/* Paketler */
.tdd-pkgs { display: grid; grid-template-columns: 1fr 1fr; gap: 11px; margin-bottom: 13px; }
.tdd-pkg {
    border: 1.5px solid var(--line-bright); border-radius: 15px;
    padding: 18px 16px; display: flex; flex-direction: column; gap: 10px;
    transition: border-color .15s, box-shadow .15s; position: relative;
}
.tdd-pkg:hover { border-color: var(--primary-soft); box-shadow: 0 4px 18px rgba(85,88,223,.1); }
.tdd-pkg--pop { border-color: var(--primary); background: #fafaff; }
.tdd-pkg__badge {
    position: absolute; top: -9px; left: 50%; transform: translateX(-50%);
    background: var(--primary); color: #fff;
    font-size: .69rem; font-weight: 700; padding: 2px 10px;
    border-radius: 20px; white-space: nowrap;
}
.tdd-pkg__name { font-size: .9rem; font-weight: 700; color: var(--ink); }
.tdd-pkg__old { font-size: .77rem; color: var(--ink-muted); text-decoration: line-through; }
.tdd-pkg__price { font-family: var(--font-display); font-size: 1.6rem; font-weight: 800; color: var(--ink); line-height: 1; }
.tdd-pkg__price span { font-size: .77rem; font-weight: 500; color: var(--ink-muted); }
.tdd-pkg__save { background: #dcfce7; color: #166534; font-size: .67rem; font-weight: 700; padding: 2px 6px; border-radius: 20px; margin-left: 4px; }
.tdd-pkg__feats { list-style: none; display: flex; flex-direction: column; gap: 5px; flex: 1; }
.tdd-pkg__feats li { display: flex; align-items: flex-start; gap: 5px; font-size: .8rem; color: var(--ink-soft); }
.tdd-pkg__feats li i.yes { color: #22c55e; font-size: 12px; margin-top: 2px; flex-shrink: 0; }
.tdd-pkg__feats li i.no  { color: #f87171; font-size: 12px; margin-top: 2px; flex-shrink: 0; }

/* Karşılaştırma tablosu */
.tdd-compare-wrap { overflow-x: auto; }
.tdd-compare { width: 100%; border-collapse: collapse; font-size: .8rem; }
.tdd-compare th {
    padding: 7px 11px; text-align: left;
    background: var(--surface-2); border-bottom: 1px solid var(--line-bright);
    color: var(--ink-soft); font-weight: 700; font-size: .73rem;
    text-transform: uppercase; letter-spacing: .04em;
}
.tdd-compare th:not(:first-child) { text-align: center; }
.tdd-compare td { padding: 7px 11px; border-bottom: 1px solid var(--line-bright); color: var(--ink-soft); }
.tdd-compare td:not(:first-child) { text-align: center; }
.tdd-compare td.feat { font-weight: 600; color: var(--ink); }
.tdd-compare tr:last-child td { border-bottom: none; }
.tdd-compare i.yes { color: #22c55e; font-size: 14px; }
.tdd-compare i.no  { color: #d1d5db; font-size: 14px; }

/* Özellikler */
.tdd-feats { display: grid; grid-template-columns: repeat(2,1fr); gap: 8px; }
.tdd-feat {
    display: flex; align-items: flex-start; gap: 8px;
    padding: 10px 12px; background: var(--surface-2); border-radius: 10px;
}
.tdd-feat i { color: var(--primary); font-size: 15px; flex-shrink: 0; margin-top: 1px; }
.tdd-feat span { font-size: .81rem; color: var(--ink-soft); font-weight: 500; line-height: 1.4; }

/* Galeri */
.tdd-gallery { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; }
.tdd-shot {
    border-radius: 10px; border: 1px solid var(--line-bright);
    aspect-ratio: 16/10; background: var(--surface-2);
    display: flex; align-items: center; justify-content: center;
    cursor: zoom-in; position: relative;
    flex-direction: column; gap: 4px;
    color: var(--ink-muted); font-size: .73rem;
    transition: border-color .15s, transform .15s;
    overflow: hidden;
}
.tdd-shot img { width: 100%; height: 100%; object-fit: cover; position: absolute; inset: 0; }
.tdd-shot__label { position: relative; z-index: 1; }
.tdd-shot i { font-size: 18px; color: var(--line-bright); }
.tdd-shot:hover { border-color: var(--primary-soft); transform: scale(1.02); }
.tdd-shot__ov {
    position: absolute; inset: 0; border-radius: 10px;
    background: rgba(85,88,223,.08); opacity: 0;
    transition: opacity .15s; display: flex; align-items: center; justify-content: center;
}
.tdd-shot:hover .tdd-shot__ov { opacity: 1; }
.tdd-shot__ov i { font-size: 18px; color: var(--primary); }

/* Adımlar */
.tdd-steps { display: grid; grid-template-columns: repeat(3,1fr); gap: 11px; }
.tdd-step { padding: 16px; background: var(--surface-2); border-radius: 13px; display: flex; flex-direction: column; gap: 8px; }
.tdd-step__num {
    width: 28px; height: 28px; border-radius: 50%;
    background: var(--primary); color: #fff;
    font-size: .77rem; font-weight: 800;
    display: flex; align-items: center; justify-content: center;
    font-family: var(--font-display);
}
.tdd-step__title { font-size: .86rem; font-weight: 700; color: var(--ink); }
.tdd-step__desc { font-size: .79rem; color: var(--ink-muted); line-height: 1.5; }

/* SSS */
.tdd-faq { display: flex; flex-direction: column; gap: 5px; }
.tdd-faq-item { border: 1px solid var(--line-bright); border-radius: 10px; overflow: hidden; }
.tdd-faq-q {
    width: 100%; background: none; border: none; padding: 11px 13px;
    text-align: left; font-size: .86rem; font-weight: 600; color: var(--ink);
    cursor: pointer; display: flex; align-items: center; justify-content: space-between;
    gap: 10px; transition: background .12s;
}
.tdd-faq-q:hover { background: var(--surface-2); }
.tdd-faq-q.is-open i { transform: rotate(180deg); }
.tdd-faq-q i { flex-shrink: 0; font-size: 14px; color: var(--ink-muted); transition: transform .2s; }
.tdd-faq-a {
    font-size: .83rem; color: var(--ink-soft); line-height: 1.6;
    padding: 0 13px; max-height: 0; overflow: hidden;
    transition: max-height .25s var(--ease-out), padding .25s;
}
.tdd-faq-a.is-open { max-height: 200px; padding: 0 13px 11px; }

/* Hakkında */
.tdd-about {
    background: var(--surface-2); border: 1px solid var(--line-bright);
    border-radius: 15px; padding: 22px;
}
.tdd-about__title { font-family: var(--font-display); font-size: 1rem; font-weight: 800; margin-bottom: 8px; color: var(--ink); }
.tdd-about p { font-size: .86rem; color: var(--ink-soft); line-height: 1.75; margin-bottom: 8px; }
.tdd-about p:last-child { margin: 0; }

/* ── SAĞ PANEL ──────────────────────── */
.td-detay__right {
    border-left: 1px solid var(--line-bright);
    padding: 16px 14px;
    position: sticky; top: 0;
    max-height: 140vh; overflow-y: auto;
    display: flex; flex-direction: column; gap: 14px;
}

.tdr-block {
    background: var(--surface); border: 1px solid var(--line-bright);
    border-radius: 14px; overflow: hidden;
}
.tdr-head {
    padding: 10px 13px 8px; border-bottom: 1px solid var(--line-bright);
    display: flex; align-items: center; justify-content: space-between;
}
.tdr-head__title { font-size: .74rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--ink-muted); }
.tdr-nav { display: flex; gap: 3px; }
.tdr-nav-btn {
    width: 24px; height: 24px; border-radius: 6px;
    border: 1px solid var(--line-bright); background: none; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    color: var(--ink-muted); font-size: 11px;
    transition: border-color .12s, color .12s;
}
.tdr-nav-btn:hover { border-color: var(--primary); color: var(--primary); }

/* Slider */
.tdr-slider-wrap { overflow: hidden; }
.tdr-slider-track { display: flex; transition: transform .3s var(--ease-out); }
.tdr-slide { min-width: 100%; padding: 11px 13px; display: flex; flex-direction: column; gap: 7px; }
.tdr-slide__img {
    border-radius: 9px; background: var(--surface-2);
    border: 1px solid var(--line-bright); aspect-ratio: 16/9;
    display: flex; align-items: center; justify-content: center;
    flex-direction: column; gap: 4px; color: var(--ink-muted);
    font-size: .72rem; cursor: pointer; transition: border-color .15s; overflow: hidden;
}
.tdr-slide__img:hover { border-color: var(--primary-soft); }
.tdr-slide__img img { width: 100%; height: 100%; object-fit: cover; }
.tdr-slide__img i { font-size: 20px; color: var(--line-bright); }
.tdr-badges { display: flex; gap: 4px; flex-wrap: wrap; }
.tdr-badge { font-size: .67rem; font-weight: 700; padding: 2px 7px; border-radius: 20px; }
.tdr-badge--wp   { background: #eef2ff; color: #4338ca; }
.tdr-badge--html { background: #fef3c7; color: #92400e; }
.tdr-badge--demo { background: #dcfce7; color: #166534; }
.tdr-slide__name { font-size: .85rem; font-weight: 700; color: var(--ink); }
.tdr-slide__desc { font-size: .76rem; color: var(--ink-muted); line-height: 1.4; }
.tdr-slide__price { font-family: var(--font-display); font-size: .92rem; font-weight: 800; color: var(--ink); }
.tdr-slide__btns { display: flex; gap: 5px; }
.tdr-btn-inc {
    flex: 1; padding: 6px 9px; border-radius: 7px;
    background: var(--primary); color: #fff; border: none;
    font-size: .75rem; font-weight: 700; cursor: pointer;
    text-decoration: none; display: flex; align-items: center; justify-content: center; gap: 3px;
}
.tdr-btn-demo {
    padding: 6px 9px; border-radius: 7px;
    border: 1px solid var(--line-bright); background: none;
    color: var(--ink-soft); font-size: .75rem; font-weight: 600;
    cursor: pointer; text-decoration: none;
    display: flex; align-items: center; gap: 3px;
    transition: border-color .12s, color .12s;
}
.tdr-btn-demo:hover { border-color: var(--primary); color: var(--primary); }
.tdr-dots { display: flex; gap: 4px; justify-content: center; padding: 7px 0 9px; }
.tdr-dot { width: 5px; height: 5px; border-radius: 50%; background: var(--line-bright); cursor: pointer; transition: background .15s; }
.tdr-dot.is-on { background: var(--primary); }

/* Diğer versiyon */
.tdr-version { padding: 11px 13px; display: flex; flex-direction: column; gap: 7px; }
.tdr-version__badge { display: inline-flex; align-items: center; gap: 4px; background: #fef3c7; color: #92400e; font-size: .68rem; font-weight: 700; padding: 3px 8px; border-radius: 20px; width: fit-content; }
.tdr-version__text { font-size: .79rem; color: var(--ink-soft); line-height: 1.5; }
.tdr-version__text strong { color: var(--ink); }
.tdr-version__btns { display: flex; gap: 5px; }

/* Kategoriler */
.tdr-cats { padding: 8px 13px 12px; display: flex; flex-direction: column; gap: 6px; }
.tdr-cat {
    display: flex; align-items: center; gap: 8px;
    padding: 8px 10px; border-radius: 9px;
    border: 1px solid var(--line-bright); text-decoration: none;
    transition: border-color .12s, background .12s;
}
.tdr-cat:hover { border-color: var(--primary-soft); background: #f8f7ff; }
.tdr-cat__icon { width: 28px; height: 28px; border-radius: 7px; display: flex; align-items: center; justify-content: center; font-size: 13px; flex-shrink: 0; }
.tdr-cat__icon--wp   { background: #eef2ff; color: #4338ca; }
.tdr-cat__icon--html { background: #fef3c7; color: #92400e; }
.tdr-cat__icon--hiz  { background: #f0fdf4; color: #166534; }
.tdr-cat__icon--sec  { background: #fdf4ff; color: #7e22ce; }
.tdr-cat__name { font-size: .8rem; font-weight: 700; color: var(--ink); }
.tdr-cat__cnt  { font-size: .72rem; color: var(--ink-muted); }
.tdr-cat__arr  { margin-left: auto; font-size: 12px; color: var(--line-bright); }

/* Hizmetler */
.tdr-svcs { padding: 8px 13px 12px; display: flex; flex-direction: column; gap: 5px; }
.tdr-svc {
    display: flex; align-items: flex-start; gap: 8px;
    padding: 8px 9px; border-radius: 9px;
    border: 1px solid var(--line-bright); text-decoration: none;
    transition: border-color .12s;
}
.tdr-svc:hover { border-color: var(--primary-soft); }
.tdr-svc__ico { width: 26px; height: 26px; border-radius: 6px; background: #eef2ff; color: #4338ca; display: flex; align-items: center; justify-content: center; font-size: 12px; flex-shrink: 0; margin-top: 1px; }
.tdr-svc__name { font-size: .79rem; font-weight: 700; color: var(--ink); }
.tdr-svc__desc { font-size: .73rem; color: var(--ink-muted); line-height: 1.3; }

/* Yapışkan alt bar */
.tdd-sticky {
    position: fixed; bottom: 0; left: 0; right: 0;
    background: rgba(253,253,253,.96); backdrop-filter: blur(14px);
    border-top: 1px solid var(--line-bright);
    padding: 9px 24px;
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    z-index: 200; transform: translateY(100%);
    transition: transform .3s var(--ease-out);
}
.tdd-sticky.is-show { transform: none; }
.tdd-sticky__name { font-weight: 700; font-size: .84rem; color: var(--ink); }
.tdd-sticky__price { font-size: .76rem; color: var(--ink-muted); }
.tdd-sticky__btns { display: flex; gap: 7px; }

/* LightBox */
.tdd-lb {
    position: fixed; inset: 0;
    background: rgba(10,12,25,.88);
    z-index: 9999; display: flex; align-items: center; justify-content: center;
    padding: 16px; opacity: 0; pointer-events: none;
    transition: opacity .22s;
}
.tdd-lb.is-open { opacity: 1; pointer-events: auto; }
.tdd-lb__box {
    background: var(--surface); border-radius: 16px;
    max-width: 860px; width: 100%; max-height: 90vh;
    overflow: hidden; display: flex; flex-direction: column;
    transform: scale(.96); transition: transform .22s var(--ease-out);
}
.tdd-lb.is-open .tdd-lb__box { transform: none; }
.tdd-lb__head {
    display: flex; align-items: center; justify-content: space-between;
    padding: 11px 15px; border-bottom: 1px solid var(--line-bright);
}
.tdd-lb__title { font-weight: 700; font-size: .88rem; color: var(--ink); }
.tdd-lb__close {
    background: none; border: none; cursor: pointer;
    padding: 4px; border-radius: 7px; color: var(--ink-muted); font-size: 1.2rem;
}
.tdd-lb__body {
    flex: 1; background: var(--surface-2);
    min-height: 260px; display: flex; align-items: center; justify-content: center;
    position: relative; overflow: hidden;
}
.tdd-lb__body img { max-width: 100%; max-height: 60vh; object-fit: contain; }
.tdd-lb__placeholder { display: flex; flex-direction: column; align-items: center; gap: 6px; color: var(--ink-muted); font-size: .84rem; padding: 20px; }
.tdd-lb__placeholder i { font-size: 42px; color: var(--line-bright); }
.tdd-lb__nav {
    position: absolute; top: 50%; transform: translateY(-50%);
    background: rgba(253,253,253,.9); border: 1px solid var(--line-bright);
    border-radius: 50%; width: 34px; height: 34px;
    display: flex; align-items: center; justify-content: center;
    cursor: pointer; color: var(--ink-soft);
    transition: background .12s;
}
.tdd-lb__nav:hover { background: #fff; }
.tdd-lb__prev { left: 9px; }
.tdd-lb__next { right: 9px; }
.tdd-lb__footer { display: flex; align-items: center; justify-content: center; gap: 5px; padding: 9px; border-top: 1px solid var(--line-bright); }
.tdd-lb__dot { width: 6px; height: 6px; border-radius: 50%; background: var(--line-bright); cursor: pointer; transition: background .15s; }
.tdd-lb__dot.is-on { background: var(--primary); }

/* Divider */
.tdd-div { border: none; border-top: 1px solid var(--line-bright); margin: 0; }

/* Responsive */
@media (max-width: 960px) {
    .td-detay { grid-template-columns: 1fr; }
    .td-detay__left { flex-direction: row; position: static; min-height: auto; padding: 10px 16px; border-right: none; border-bottom: 1px solid var(--line-bright); justify-content: center; flex-wrap: wrap; }
    .tdl-progress { display: none; }
    .td-detay__right { position: static; max-height: none; border-left: none; border-top: 1px solid var(--line-bright); }
    .tdd-hero { grid-template-columns: 1fr; }
    .tdd-steps { grid-template-columns: 1fr; }
    .tdd-pkgs { grid-template-columns: 1fr; }
    .tdd-feats { grid-template-columns: 1fr; }
    .tdd-gallery { grid-template-columns: repeat(2,1fr); }
}

/* ── Paket özellik listesi (✓/✗) ──────────────────────────────────── */
.tdd-pkg__feats { list-style:none; display:flex; flex-direction:column; gap:5px; flex:1; margin:4px 0; }
.tdd-pkg__feats li { display:flex; align-items:flex-start; gap:5px; font-size:.8rem; color:var(--td-ink-soft,#4a5066); }
.tdd-feat-y { color:#22c55e; font-size:12px; margin-top:2px; flex-shrink:0; }
.tdd-feat-n { color:#f87171; font-size:12px; margin-top:2px; flex-shrink:0; }
.tdd-feat-m { color:#d1d5db; font-size:12px; margin-top:2px; flex-shrink:0; }
.tdd-pkg__old { font-size:.77rem; color:var(--td-ink-muted,#6d7388); text-decoration:line-through; }
.tdd-pkg__save { background:#dcfce7; color:#166534; font-size:.67rem; font-weight:700; padding:2px 6px; border-radius:20px; margin-left:4px; }

/* ── Karşılaştırma tablosu ─────────────────────────────────────────── */
.tdd-compare-wrap { overflow-x:auto; margin-top:16px; }
.tdd-compare { width:100%; border-collapse:collapse; font-size:.8rem; }
.tdd-compare th { padding:7px 11px; text-align:left; background:var(--td-surface-2,#f5f4f9); border-bottom:1px solid var(--td-line,#e8e7f0); color:var(--td-ink-muted,#6d7388); font-weight:700; font-size:.73rem; text-transform:uppercase; letter-spacing:.04em; }
.tdd-compare th:not(:first-child) { text-align:center; }
.tdd-compare td { padding:7px 11px; border-bottom:1px solid var(--td-line,#e8e7f0); color:var(--td-ink-soft,#4a5066); }
.tdd-compare td:not(:first-child) { text-align:center; }
.tdd-compare td.feat { font-weight:600; color:var(--td-ink,#141826); }
.tdd-compare tr:last-child td { border-bottom:none; }