/* ==========================================================================
   Mudi Dekor — "Atölye" teması
   Bricolage Grotesque (başlık) · Manrope (metin) · JetBrains Mono (teknik etiket)
   Kâğıt zemin · mürekkep siyahı · sinyal turuncusu
   ========================================================================== */

:root {
  --bg: #f5f3ee;
  --bg-2: #ebe7de;
  --surface: #ffffff;
  --ink: #111111;
  --ink-2: #2a2824;
  --muted: #6b675e;
  --line: #e3ded3;
  --line-2: #d4cec1;
  --accent: #ff5a1f;
  --accent-hover: #e84a12;
  --accent-soft: #ffe4d8;
  --brass: #c8a46a;
  --night: #111111;
  --success: #138a4b;
  --radius: 22px;
  --radius-sm: 14px;
  --shadow-sm: 0 1px 2px rgba(17,17,17,.05), 0 2px 10px rgba(17,17,17,.04);
  --shadow: 0 18px 40px -20px rgba(17,17,17,.35);
  --font-display: 'Bricolage Grotesque', 'Manrope', system-ui, sans-serif;
  --font-ui: 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

html { scroll-behavior: smooth; scroll-padding-top: 96px; }
body { overflow-x: clip; font-family: var(--font-ui); background: #fff; /* önceki: var(--bg) var(--noise) — krem dokulu zemin */ color: var(--ink); -webkit-font-smoothing: antialiased; font-size: 1rem; }
a { color: inherit; }
h1, h2, h3, h4, h5, h6 { font-family: var(--font-display); font-weight: 700; letter-spacing: -.03em; }
::selection { background: var(--accent); color: #fff; }
.mono, .mono-label, .section-no, .tag-line { font-family: var(--font-mono); font-size: .74rem; letter-spacing: .04em; text-transform: uppercase; font-weight: 500; }
.text-muted-2 { color: var(--muted); }
.text-gold { color: var(--accent); }
.min-w-0 { min-width: 0; }
.skip-link { position: absolute; left: -999px; top: .5rem; z-index: 2000; background: var(--ink); color: #fff; padding: .5rem 1rem; border-radius: 8px; }
.skip-link:focus { left: .5rem; }

/* Elle çizilmiş vurgu çizgisi */
.mark { position: relative; white-space: nowrap; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 14' preserveAspectRatio='none'%3E%3Cpath d='M3 10 C 50 3, 120 2, 197 8' fill='none' stroke='%23ff5a1f' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat left bottom / 100% .28em; padding-bottom: .06em; }
.mark--dark { color: #fff; }

/* ---------- Butonlar ---------- */
.btn { border-radius: 999px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; gap: .55rem; padding: .62rem 1.15rem; transition: background-color .2s, color .2s, border-color .2s, transform .2s, box-shadow .2s; }
.btn-lg { padding: .9rem 1.5rem; font-size: 1rem; }
.btn-sm { padding: .35rem .8rem; }
.btn-accent, .btn-gold { background: var(--accent); color: #fff; border: 0; }
.btn-accent:hover, .btn-accent:focus-visible, .btn-gold:hover, .btn-gold:focus-visible { background: var(--accent-hover); color: #fff; transform: translateY(-1px); box-shadow: 0 12px 24px -12px rgba(255,90,31,.8); }
.btn-dark, .btn-dark-soft { background: var(--ink); color: #fff; border: 0; }
.btn-dark:hover, .btn-dark:focus-visible, .btn-dark-soft:hover, .btn-dark-soft:focus-visible { background: var(--ink-2); color: #fff; }
.btn-outline, .btn-ghost { border: 1.5px solid var(--ink); color: var(--ink); background: transparent; }
.btn-outline:hover, .btn-ghost:hover { background: var(--ink); color: #fff; }
.btn-outline-light, .btn-ghost-light { border: 1.5px solid rgba(255,255,255,.35); color: #fff; background: transparent; }
.btn-outline-light:hover, .btn-ghost-light:hover { background: #fff; color: var(--ink); border-color: #fff; }
.btn-light-solid { background: #fff; color: var(--ink); border: 0; }
.btn-light-solid:hover { background: var(--ink); color: #fff; }
.btn-light { background: var(--bg-2); border-color: transparent; color: var(--ink); }
.btn-light:hover { background: var(--line-2); }
.btn-arrow { width: 24px; height: 24px; margin-right: -.45rem; border-radius: 50%; display: inline-grid; place-items: center; background: rgba(255,255,255,.22); font-size: .8rem; transition: transform .25s; }
.btn:hover .btn-arrow { transform: rotate(45deg); }
.btn-lg .btn-arrow { width: 28px; height: 28px; }
.btn-icon { width: 44px; height: 44px; padding: 0; border-radius: 50%; background: var(--surface); border: 1px solid var(--line); color: var(--ink); font-size: 1.1rem; }
.btn-icon:hover { border-color: var(--ink); background: var(--surface); }

.eyebrow { display: inline-block; font-family: var(--font-mono); font-size: .74rem; letter-spacing: .04em; text-transform: uppercase; color: var(--accent); margin-bottom: .75rem; }
.section-no { display: inline-flex; align-items: center; gap: .6rem; color: var(--accent); margin-bottom: 1rem; }
.section-no::before { content: ''; width: 22px; height: 1.5px; background: currentColor; }
.tag-line { display: inline-block; color: var(--muted); margin-bottom: 1.25rem; }

/* ---------- Topbar & Header ---------- */
.topbar { background: var(--ink); color: rgba(255,255,255,.72); font-family: var(--font-mono); font-size: .72rem; letter-spacing: .02em; padding: .55rem 0; }
.topbar a { text-decoration: none; color: rgba(255,255,255,.85); }
.topbar a:hover { color: var(--accent); }
.topbar-info { display: flex; gap: 1.75rem; }
.topbar i { color: var(--accent); margin-right: .3rem; }

.site-header { position: sticky; top: 0; z-index: 1030; background: rgba(245,243,238,.82); backdrop-filter: saturate(170%) blur(16px); -webkit-backdrop-filter: saturate(170%) blur(16px); border-bottom: 1px solid transparent; transition: border-color .2s; }
.site-header.scrolled { border-color: var(--line); }
.site-header .navbar { padding: .85rem 0; }

.brand { display: inline-flex; align-items: center; gap: .65rem; text-decoration: none; color: var(--ink); }
.brand-mark { width: 46px; height: 46px; transition: transform .3s; }
.brand:hover .brand-mark { transform: rotate(-6deg); }
.brand-text { font-family: var(--font-display); font-size: 1.45rem; font-weight: 400; letter-spacing: -.04em; line-height: .95; display: inline-block; color: var(--ink); }
.brand-text b { font-weight: 800; }
.brand-text small { display: block; font-family: var(--font-mono); font-size: .58rem; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); margin-top: .35rem; font-weight: 500; }
.brand--light .brand-text { color: #fff; }
.brand--light .brand-text small { color: rgba(255,255,255,.5); }

.navbar-nav { gap: .25rem; }
.navbar-nav .nav-link { position: relative; font-weight: 700; font-size: .92rem; color: var(--ink); padding: .5rem .85rem !important; border-radius: 999px; }
.navbar-nav .nav-link:hover, .navbar-nav .nav-link.show { background: rgba(17,17,17,.06); color: var(--ink); }
.navbar-nav .nav-link.active { color: var(--ink); }

.mega-menu { border: 1px solid var(--line); border-radius: 24px; padding: 1.25rem; box-shadow: 0 40px 80px -30px rgba(17,17,17,.4); margin-top: .7rem !important; background: var(--surface); }
@media (min-width: 992px) {
  .mega { position: static; }
  .mega-menu { left: 50% !important; transform: translateX(-50%); width: min(1100px, 94vw); }
}
.mega-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
.mega-head { display: block; text-decoration: none; padding: 1rem; border-radius: 16px; background: var(--bg); transition: background .2s; }
.mega-head:hover { background: var(--accent-soft); }
.mega-head .mono { color: var(--accent); }
.mega-head strong { display: block; font-family: var(--font-display); font-size: 1.1rem; letter-spacing: -.02em; margin: .25rem 0 .2rem; }
.mega-head small { display: block; font-size: .78rem; color: var(--muted); line-height: 1.35; }
.mega-col ul { list-style: none; padding: 0; margin: .6rem 0 0; display: grid; gap: .1rem; }
.mega-col li a { display: block; padding: .35rem .6rem; border-radius: 8px; font-size: .87rem; font-weight: 600; text-decoration: none; color: #4a473f; }
.mega-col li a:hover { background: var(--bg); color: var(--ink); }
.mega-design { color: var(--accent) !important; }
.mega-foot { display: flex; justify-content: space-between; align-items: center; margin-top: 1rem; padding: .9rem 1rem 0; border-top: 1px solid var(--line); }
.mega-foot .mono { color: var(--muted); }
.mega-foot a { font-weight: 700; text-decoration: none; }
.mega-foot a:hover { color: var(--accent); }
@media (max-width: 991.98px) {
  .mega-menu { border: 0; box-shadow: none; padding: .5rem 0; }
  .mega-grid { grid-template-columns: 1fr; }
  .offcanvas-lg .navbar-nav .nav-link { font-size: 1.1rem; padding: .8rem 1rem !important; }
}

.cart-badge { position: absolute; top: -4px; right: -4px; min-width: 20px; height: 20px; padding: 0 5px; background: var(--accent); color: #fff; font-size: .68rem; font-weight: 800; border-radius: 999px; display: grid; place-items: center; border: 2px solid var(--bg); }
.flash-wrap { padding-top: 1rem; }
.flash-wrap .alert { border-radius: 14px; margin-bottom: .5rem; }

/* ---------- Bölüm iskeleti ---------- */
.section { padding: clamp(4rem, 8vw, 7rem) 0; }
.section-alt { background: var(--bg-2); }
.section-ink { background-color: var(--night); background-image: linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px); background-size: 56px 56px; color: #fff; }
.section-ink .section-head p, .lead-light { color: rgba(255,255,255,.65); }
.section-head { margin-bottom: 3rem; }
.section-head h2, .display-h { font-size: clamp(2.1rem, 4.4vw, 3.6rem); line-height: 1.02; letter-spacing: -.045em; margin: 0; }
.display-h { margin-bottom: 1.25rem; }
.section-head p { color: var(--muted); font-size: 1.05rem; margin: 0; max-width: 460px; }
.section-head.split { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 1.5rem 3rem; }

[data-reveal] { opacity: 0; transform: translateY(26px); transition: opacity .8s ease, transform .8s cubic-bezier(.2,.7,.2,1); }
[data-reveal].revealed { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { [data-reveal] { opacity: 1; transform: none; transition: none; } * { animation: none !important; } }

.breadcrumb { font-family: var(--font-mono); font-size: .72rem; text-transform: uppercase; letter-spacing: .03em; margin: 0; }
.breadcrumb a { text-decoration: none; color: var(--muted); }
.breadcrumb a:hover { color: var(--accent); }

/* ---------- Hero ---------- */
.hero { position: relative; padding: clamp(2.5rem, 6vw, 5rem) 0 clamp(4rem, 8vw, 6.5rem); overflow: hidden; }
.hero::after { content: ''; position: absolute; right: -10%; top: -20%; width: 60vw; height: 60vw; max-width: 900px; max-height: 900px; border-radius: 50%; background: radial-gradient(circle, rgba(255,90,31,.14), transparent 62%); z-index: -1; }
.hero-title { font-size: clamp(2.9rem, 6.6vw, 5.6rem); line-height: .95; letter-spacing: -.055em; font-weight: 800; margin-bottom: 1.4rem; }
.hero-lead { font-size: 1.12rem; line-height: 1.6; color: #4a473f; max-width: 520px; margin-bottom: 2rem; }

.quick-try { background: var(--surface); border: 1px solid var(--line); border-radius: 24px; padding: 1.1rem; max-width: 540px; box-shadow: var(--shadow); }
.mono-label { display: flex; align-items: center; gap: .5rem; color: var(--muted); margin: .1rem .25rem .7rem; }
.dot-live { width: 8px; height: 8px; border-radius: 50%; background: #22c55e; box-shadow: 0 0 0 0 rgba(34,197,94,.5); animation: live 1.8s infinite; }
@keyframes live { 70% { box-shadow: 0 0 0 8px rgba(34,197,94,0); } 100% { box-shadow: 0 0 0 0 rgba(34,197,94,0); } }
.qt-input { display: flex; gap: .5rem; background: var(--bg); border-radius: 16px; padding: .35rem; }
.qt-input input { flex: 1; min-width: 0; border: 0; background: transparent; outline: 0; padding: .55rem .8rem; font-family: var(--font-display); font-size: 1.3rem; font-weight: 600; letter-spacing: -.02em; }
.qt-input input::placeholder { color: #b5afa3; }
.qt-mats { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .75rem; }
.qt-mat { display: inline-flex; align-items: center; gap: .45rem; border: 1.5px solid var(--line); background: var(--surface); border-radius: 999px; padding: .3rem .8rem .3rem .35rem; font-size: .82rem; font-weight: 700; color: #4a473f; transition: all .2s; }
.qt-mat .mat-swatch { width: 22px; height: 22px; border-radius: 50%; }
.qt-mat:hover { border-color: var(--line-2); }
.qt-mat.active { border-color: var(--ink); color: var(--ink); background: var(--bg); }

.hero-visual { position: relative; display: flex; justify-content: center; padding: 1rem 0; }
.door { position: relative; width: min(390px, 84vw); aspect-ratio: 9 / 13; border-radius: 10px 10px 4px 4px; background: repeating-linear-gradient(90deg, rgba(0,0,0,.05) 0 2px, transparent 2px 11px), repeating-linear-gradient(90deg, rgba(255,255,255,.04) 0 1px, transparent 1px 23px), linear-gradient(90deg, #5e3920, #82532f 25%, #6d4426 55%, #8c5c36 80%, #63401f); box-shadow: 0 50px 70px -35px rgba(17,17,17,.7), inset 0 0 0 10px rgba(0,0,0,.12), inset 0 0 0 11px rgba(255,255,255,.06); }
.door-panel { position: absolute; left: 14%; right: 14%; border-radius: 4px; box-shadow: inset 2px 2px 4px rgba(0,0,0,.35), inset -2px -2px 3px rgba(255,255,255,.08); }
.door-panel.p1 { top: 42%; height: 23%; }
.door-panel.p2 { top: 70%; height: 23%; }
.door-peephole { position: absolute; top: 33%; left: 50%; width: 14px; height: 14px; transform: translateX(-50%); border-radius: 50%; background: radial-gradient(circle at 40% 40%, #fff6, #c9a24a 40%, #6e5220); box-shadow: 0 1px 2px rgba(0,0,0,.5); }
.door-plate { position: absolute; top: 11%; left: 11%; right: 11%; }
.door-plate .plate-wrap { max-width: none; }
.spec-tag { position: absolute; left: 50%; top: calc(100% + .7rem); transform: translateX(-50%); white-space: nowrap; background: rgba(17,17,17,.82); color: #fff; padding: .3rem .7rem; border-radius: 999px; font-size: .64rem; }
.door-handle { position: absolute; right: 8%; top: 56%; width: 52px; height: 12px; border-radius: 6px; background: linear-gradient(180deg, #f4dfa1, #b58a35); box-shadow: 0 4px 8px rgba(0,0,0,.4); }
.door-handle::before { content: ''; position: absolute; right: 6px; top: -12px; width: 18px; height: 36px; border-radius: 9px; background: linear-gradient(90deg, #c49a45, #f1da9a, #b0852f); z-index: -1; }
.float-chip { position: absolute; display: inline-flex; align-items: center; gap: .5rem; background: var(--surface); padding: .6rem 1rem; border-radius: 999px; font-size: .84rem; font-weight: 700; box-shadow: var(--shadow); border: 1px solid var(--line); animation: floaty 6s ease-in-out infinite; }
.float-chip i { color: var(--accent); }
.chip-1 { top: 6%; left: 2%; }
.chip-2 { bottom: 10%; right: 0; animation-delay: -3s; }
@keyframes floaty { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
@media (max-width: 575.98px) { .float-chip { display: none; } }

/* ---------- Kayan şerit ---------- */
.ticker { background: var(--accent); color: #fff; overflow: hidden; padding: 1.05rem 0; transform: rotate(-1.2deg); margin: 0 -2%; box-shadow: 0 10px 30px -15px rgba(255,90,31,.7); }
.ticker-track { display: flex; gap: 2rem; width: max-content; animation: marquee 38s linear infinite; white-space: nowrap; font-family: var(--font-display); font-weight: 700; font-size: 1.35rem; letter-spacing: -.02em; }
@keyframes marquee { to { transform: translateX(-50%); } }

/* ---------- Bento kategoriler ---------- */
.bento { display: grid; grid-template-columns: repeat(12, 1fr); grid-auto-rows: minmax(240px, auto); gap: 1rem; }
.bento-card { position: relative; display: flex; flex-direction: column; text-decoration: none; background: var(--surface); border: 1px solid var(--line); border-radius: 28px; overflow: hidden; transition: transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s, border-color .35s; }
.bento-card:hover { transform: translateY(-6px); box-shadow: var(--shadow); border-color: var(--ink); color: inherit; }
.bento-1 { grid-column: 1 / 8; grid-row: span 2; }
.bento-2 { grid-column: 8 / 13; }
.bento-3, .bento-4 { grid-column: span 5; }
.bento-3 { grid-column: 8 / 13; }
.bento-4 { grid-column: 1 / 13; }
.bento-visual { flex: 1; min-height: 200px; display: grid; place-items: center; padding: 2rem; --maxh: 150px; }
.bento-1 .bento-visual { --maxh: 220px; min-height: 380px; }
.bento-4 { flex-direction: row; }
.bento-4 .bento-visual { --maxh: 120px; }
.bento-visual .plate-wrap { transition: transform .5s cubic-bezier(.2,.7,.2,1); }
.bento-card:hover .bento-visual .plate-wrap { transform: scale(1.05) rotate(-1.5deg); }
.bento-body { padding: 1.4rem 1.6rem 1.6rem; }
.bento-4 .bento-body { width: 40%; align-self: center; }
.bento-body .mono { color: var(--accent); }
.bento-body h3 { font-size: clamp(1.4rem, 2.2vw, 1.9rem); letter-spacing: -.04em; margin: .35rem 0 .3rem; }
.bento-body p { margin: 0; color: var(--muted); font-size: .92rem; }
.bento-arrow { position: absolute; top: 1rem; right: 1rem; width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center; background: var(--surface); color: var(--ink); font-size: 1.1rem; box-shadow: var(--shadow-sm); transition: all .3s; }
.bento-card:hover .bento-arrow { background: var(--accent); color: #fff; transform: rotate(45deg); }
@media (max-width: 991.98px) {
  .bento { grid-template-columns: 1fr 1fr; }
  .bento-1, .bento-2, .bento-3, .bento-4 { grid-column: auto; grid-row: auto; }
  .bento-1, .bento-4 { grid-column: 1 / -1; }
  .bento-1 .bento-visual { min-height: 260px; }
}
@media (max-width: 575.98px) {
  .bento { grid-template-columns: 1fr; }
  .bento-4 { flex-direction: column; }
  .bento-4 .bento-body { width: auto; }
}

/* ---------- Malzeme kartelası ---------- */
.swatch-row { display: grid; grid-template-columns: repeat(5, 1fr); gap: 1rem; }
.swatch-card { display: flex; flex-direction: column; gap: 1rem; text-decoration: none; color: #fff; }
.swatch-card .swatch-surface.plate { display: block; aspect-ratio: 4 / 5; border-radius: 20px; box-shadow: 0 30px 40px -25px rgba(0,0,0,.9), inset 0 0 0 1px rgba(255,255,255,.12); transition: transform .4s cubic-bezier(.2,.7,.2,1); }
.swatch-card .swatch-surface.is-pleksi-seffaf { background-color: rgba(255,255,255,.06); }
.swatch-card:hover .swatch-surface { transform: translateY(-8px) rotate(-1.5deg); }
.swatch-info strong { display: block; font-family: var(--font-display); font-size: 1.3rem; letter-spacing: -.03em; }
.swatch-info .mono { display: block; color: var(--accent); margin: .25rem 0; font-size: .66rem; }
.swatch-info small { color: rgba(255,255,255,.6); font-size: .84rem; }
.swatch-card:hover { color: #fff; }
@media (max-width: 991.98px) { .swatch-row { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 575.98px) { .swatch-row { grid-template-columns: 1fr 1fr; } }

/* ---------- Yatay kaydırmalı liste ---------- */
.scroll-row { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(270px, calc((100% - 3rem) / 4)); gap: 1rem; overflow-x: auto; scroll-snap-type: x mandatory; padding: .25rem .25rem 1.25rem; scrollbar-width: none; }
.scroll-row::-webkit-scrollbar { display: none; }
.scroll-item { scroll-snap-align: start; }

/* ---------- Süreç ---------- */
.process { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; counter-reset: adim; }
.process-step { position: relative; background: var(--surface); border: 1px solid var(--line); border-radius: 28px; padding: 2rem; overflow: hidden; }
.process-no { position: absolute; right: 1.25rem; top: .25rem; font-family: var(--font-display); font-size: 6rem; font-weight: 800; line-height: 1; letter-spacing: -.06em; color: transparent; -webkit-text-stroke: 1.5px var(--line-2); }
.process-step > i { width: 54px; height: 54px; border-radius: 16px; display: grid; place-items: center; background: var(--ink); color: #fff; font-size: 1.4rem; margin-bottom: 3rem; }
.process-step:hover > i { background: var(--accent); }
.process-step h4 { font-size: 1.6rem; letter-spacing: -.04em; }
.process-step p { color: var(--muted); margin: 0; }
@media (max-width: 767.98px) { .process { grid-template-columns: 1fr; } }

/* ---------- Apartman & kurumsal ---------- */
.check-list { list-style: none; padding: 0; margin: 1.5rem 0 0; display: grid; gap: .7rem; }
.check-list i { color: var(--accent); margin-right: .5rem; font-weight: 700; }
.apt-board { display: grid; grid-template-columns: 1fr 1.25fr; gap: 1.5rem; align-items: center; background: linear-gradient(160deg, #d8d3ca, #bdb7ac); border-radius: 28px; padding: clamp(1.25rem, 4vw, 2.5rem); box-shadow: 0 40px 60px -30px rgba(0,0,0,.8), inset 0 1px 0 rgba(255,255,255,.5); }
.apt-board-sign { --maxh: 300px; }
.apt-board-grid { display: grid; gap: .75rem; }
.office-wall { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; padding: clamp(1.5rem, 4vw, 2.5rem); border-radius: 28px; background: repeating-linear-gradient(90deg, rgba(0,0,0,.025) 0 1px, transparent 1px 80px), linear-gradient(160deg, #eceae5, #d9d5cc); }
.office-item { display: block; transition: transform .3s; }
.office-item:hover { transform: translateY(-4px); }
@media (max-width: 575.98px) { .apt-board, .office-wall { grid-template-columns: 1fr; } }

/* ---------- Rakamlar ---------- */
.stats { background: var(--accent); color: #fff; padding: clamp(2.5rem, 5vw, 4rem) 0; }
.stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; }
.stats-grid > div { border-left: 1.5px solid rgba(255,255,255,.35); padding-left: 1.25rem; }
.stats-grid strong { display: block; font-family: var(--font-display); font-size: clamp(2.6rem, 5vw, 4.2rem); font-weight: 800; letter-spacing: -.05em; line-height: 1; }
.stats-grid span { font-family: var(--font-mono); font-size: .74rem; text-transform: uppercase; letter-spacing: .04em; opacity: .85; }
@media (max-width: 767.98px) { .stats-grid { grid-template-columns: 1fr 1fr; } }

/* ---------- SSS ---------- */
.faq .accordion-item { border: 0; border-top: 1px solid var(--line-2); border-radius: 0 !important; background: transparent; }
.faq .accordion-item:last-child { border-bottom: 1px solid var(--line-2); }
.faq .accordion-button { font-family: var(--font-display); font-size: 1.2rem; font-weight: 600; letter-spacing: -.02em; padding: 1.4rem 0; background: transparent; color: var(--ink); box-shadow: none; }
.faq .accordion-button .mono { color: var(--accent); }
.faq .accordion-button:not(.collapsed) { color: var(--ink); background: transparent; }
.faq .accordion-button::after { background-image: none; content: '+'; font-family: var(--font-mono); font-size: 1.4rem; width: auto; height: auto; transform: none; transition: transform .3s; }
.faq .accordion-button:not(.collapsed)::after { transform: rotate(45deg); color: var(--accent); }
.faq .accordion-body { color: var(--muted); padding: 0 0 1.5rem 2.4rem; max-width: 680px; }

/* ---------- Kategori sayfası ---------- */
.page-hero { padding: 2rem 0 0; }
.page-hero h1 { font-size: clamp(2.4rem, 5.5vw, 4rem); line-height: 1; letter-spacing: -.05em; margin: .75rem 0 .75rem; font-weight: 800; }
.page-hero p { color: var(--muted); max-width: 620px; margin: 0; }
.search-box { display: flex; align-items: center; gap: .5rem; background: var(--surface); border: 1px solid var(--line); border-radius: 999px; padding: .35rem .35rem .35rem 1.1rem; }
.search-box:focus-within { border-color: var(--ink); }
.search-box i { color: var(--muted); }
.search-box input { flex: 1; border: 0; outline: 0; background: transparent; min-width: 0; padding: .45rem 0; font-weight: 600; }
.cat-tabs { display: flex; gap: .5rem; overflow-x: auto; margin-top: 2rem; padding-bottom: .25rem; scrollbar-width: none; }
.cat-tabs a { flex: none; display: inline-flex; align-items: center; gap: .45rem; padding: .65rem 1.1rem; border-radius: 999px; text-decoration: none; font-weight: 700; font-size: .9rem; background: var(--surface); border: 1px solid var(--line); }
.cat-tabs a:hover { border-color: var(--ink); }
.cat-tabs a.active { background: var(--ink); border-color: var(--ink); color: #fff; }
.cat-tabs a.active i { color: var(--accent); }
.filter-bar { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: 1.75rem; }
.chips { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; }
.chip { padding: .4rem .85rem; border-radius: 999px; font-size: .84rem; font-weight: 700; text-decoration: none; background: var(--bg-2); }
.chip:hover { background: var(--line-2); }
.chip.active { background: var(--accent); color: #fff; }
.result-count { font-family: var(--font-mono); color: var(--muted); font-size: .72rem; text-transform: uppercase; margin-left: .5rem; }
.sort-form .form-select { border-radius: 999px; min-width: 220px; font-weight: 600; }
.empty-state { text-align: center; padding: 4rem 1rem; background: var(--surface); border: 1.5px dashed var(--line-2); border-radius: 28px; }
.empty-state > i { font-size: 3rem; color: var(--accent); display: block; margin-bottom: 1rem; }
.empty-state p { color: var(--muted); }

/* ---------- Ürün kartları ---------- */
.product-card { position: relative; display: flex; flex-direction: column; height: 100%; text-decoration: none; background: var(--surface); border-radius: var(--radius); overflow: hidden; border: 1px solid var(--line); transition: transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s, border-color .35s; }
.product-card:hover { transform: translateY(-6px); box-shadow: var(--shadow); border-color: var(--ink); color: inherit; }
.product-visual { position: relative; padding: 2rem 1.5rem; display: grid; place-items: center; height: 220px; --maxh: 150px; }
.product-visual .plate-wrap { transition: transform .5s cubic-bezier(.2,.7,.2,1); }
.product-card:hover .product-visual .plate-wrap { transform: scale(1.06) rotate(-1.5deg); }
.product-tag { position: absolute; top: .85rem; left: .85rem; z-index: 3; font-family: var(--font-mono); font-size: .62rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; padding: .3rem .6rem; border-radius: 999px; background: var(--accent); color: #fff; }
.product-tag.static { position: static; }
.product-body { padding: 1.1rem 1.25rem 1.25rem; display: flex; flex-direction: column; flex: 1; }
.product-type { display: inline-flex; align-items: center; gap: .35rem; font-family: var(--font-mono); font-size: .66rem; font-weight: 500; letter-spacing: .04em; text-transform: uppercase; color: var(--muted); }
.product-body h3 { font-size: 1.12rem; letter-spacing: -.03em; margin: .35rem 0 .45rem; line-height: 1.2; }
.product-body p { color: var(--muted); font-size: .86rem; margin: 0; }
.product-meta { display: flex; align-items: center; justify-content: space-between; font-size: .78rem; color: var(--muted); font-weight: 600; }
.dots { display: inline-flex; }
.mat-dot { width: 15px; height: 15px; border-radius: 50%; border: 2px solid #fff; margin-right: -5px; box-shadow: 0 0 0 1px rgba(0,0,0,.1); }
.product-foot { margin-top: auto; padding-top: 1rem; display: flex; align-items: flex-end; justify-content: space-between; }
.price { font-family: var(--font-display); font-size: 1.35rem; font-weight: 700; letter-spacing: -.03em; line-height: 1.1; }
.price small { display: block; font-family: var(--font-mono); font-size: .6rem; font-weight: 500; color: var(--muted); letter-spacing: .04em; text-transform: uppercase; }
.go { width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; background: var(--bg); font-size: 0; color: transparent; transition: all .3s; }
.go i { font-size: 1rem; color: var(--ink); }
.product-card:hover .go { background: var(--accent); transform: rotate(-45deg); }
.product-card:hover .go i { color: #fff; }
.product-card--design { border: 1.5px dashed var(--line-2); background: transparent; }
.product-card--design .product-visual { background: radial-gradient(circle at 50% 45%, var(--accent-soft), transparent 65%); }
.design-badge { width: 84px; height: 84px; border-radius: 26px; display: grid; place-items: center; font-size: 2.1rem; background: var(--accent); color: #fff; box-shadow: 0 20px 30px -15px rgba(255,90,31,.8); transform: rotate(-8deg); transition: transform .4s; }
.product-card--design:hover .design-badge { transform: rotate(0) scale(1.06); }

/* Malzeme renk noktaları / swatch'lar */
.mat-dot.silver, .mat-swatch.silver { background: linear-gradient(120deg, #8a9097, #ffffff 40%, #9ca2a8 62%, #eef0f2); }
.mat-dot.gold, .mat-swatch.gold { background: linear-gradient(120deg, #a87318, #fff3c4 40%, #c08b26 62%, #f8dc86); }
.mat-dot.metal-beyaz, .mat-swatch.metal-beyaz { background: repeating-linear-gradient(0deg, rgba(0,0,0,.04) 0 1px, transparent 1px 2px), linear-gradient(120deg, #e4e5e8, #ffffff, #eceef0); }
.mat-dot.pleksi-beyaz, .mat-swatch.pleksi-beyaz { background: linear-gradient(150deg, #fff 40%, #e6e8eb); }
.mat-dot.pleksi-siyah, .mat-swatch.pleksi-siyah { background: linear-gradient(150deg, #3a3f47, #0d0f12 60%); }
.mat-dot.pleksi-seffaf, .mat-swatch.pleksi-seffaf { background: linear-gradient(135deg, rgba(220,235,245,.9), rgba(255,255,255,.4) 50%, rgba(190,210,225,.8)); }

/* ---------- Footer ---------- */
.site-footer { background: var(--night); color: rgba(255,255,255,.65); padding: 0 0 1.75rem; margin-top: 5rem; overflow: hidden; }
.footer-cta { position: relative; top: -4rem; margin-bottom: -1.5rem; display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1.5rem; background: var(--accent) var(--noise); color: #fff; border-radius: 32px; padding: clamp(1.75rem, 4.5vw, 3.25rem); box-shadow: 0 40px 60px -30px rgba(255,90,31,.7); }
.footer-cta .mono { opacity: .8; }
.footer-cta h3 { font-size: clamp(1.8rem, 3.6vw, 2.9rem); line-height: 1; letter-spacing: -.05em; margin: .6rem 0 0; font-weight: 800; }
.footer-cta .btn-arrow { background: var(--accent); color: #fff; }
.page-tasarla .site-footer, .page-urun .site-footer, .page-sepet .site-footer, .page-odeme .site-footer { padding-top: 4rem; }
.footer-cols h6 { font-family: var(--font-mono); font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; color: rgba(255,255,255,.45); margin-bottom: 1.1rem; font-weight: 500; }
.footer-cols ul { list-style: none; padding: 0; margin: 0; display: grid; gap: .6rem; }
.footer-cols a { text-decoration: none; color: rgba(255,255,255,.82); font-weight: 600; }
.footer-cols a:hover { color: var(--accent); }
.footer-text { font-size: .92rem; max-width: 360px; }
.contact-list li { display: flex; gap: .75rem; align-items: center; }
.contact-list i { color: var(--accent); }
.social { display: flex; gap: .5rem; }
.social a { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: rgba(255,255,255,.07); color: #fff; }
.social a:hover { background: var(--accent); color: #fff; }
.pay-icons { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: 1.25rem; }
.pay-icons span { font-family: var(--font-mono); font-size: .64rem; text-transform: uppercase; padding: .35rem .6rem; border-radius: 6px; border: 1px solid rgba(255,255,255,.15); color: rgba(255,255,255,.8); }
.footer-word { font-family: var(--font-display); font-weight: 800; font-size: clamp(4rem, 17.5vw, 16rem); letter-spacing: -.07em; line-height: .78; margin: 3.5rem 0 1rem; color: transparent; -webkit-text-stroke: 1.5px rgba(255,255,255,.14); text-align: center; user-select: none; white-space: nowrap; }
.footer-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem; border-top: 1px solid rgba(255,255,255,.1); padding-top: 1.5rem; font-size: .85rem; }

.wa-float { position: fixed; right: 20px; bottom: 20px; z-index: 1040; width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center; background: #25d366; color: #fff; font-size: 1.6rem; box-shadow: 0 10px 25px -8px rgba(37,211,102,.7); transition: transform .2s; }
.wa-float:hover { transform: scale(1.08); color: #fff; }
.page-tasarla .wa-float, .page-urun .wa-float { left: 20px; right: auto; }

.toast-brand { background: var(--ink); color: #fff; border: 0; border-radius: 18px; box-shadow: var(--shadow); }
.toast-brand .bi-check-circle-fill { color: #4ade80; font-size: 1.5rem; }
.toast-brand small { color: rgba(255,255,255,.65); }

.notfound { text-align: center; max-width: 640px; margin: 0 auto; }
.notfound-plate { max-width: 420px; margin: 0 auto 2.5rem; padding: 3rem 2rem; border-radius: 28px; background: repeating-linear-gradient(90deg, rgba(0,0,0,.05) 0 2px, transparent 2px 11px), linear-gradient(90deg, #5e3920, #82532f 25%, #6d4426 55%, #8c5c36); transform: rotate(-2deg); }
.notfound h1 { font-size: clamp(2rem, 5vw, 3.2rem); letter-spacing: -.05em; font-weight: 800; }
.notfound p { color: var(--muted); margin-bottom: 2rem; }

/* ==========================================================================
   SAHNELER (kapı / duvar arka planları)
   ========================================================================== */
.stage-ahsap { background: repeating-linear-gradient(90deg, rgba(0,0,0,.05) 0 2px, transparent 2px 11px), linear-gradient(90deg, #5e3920, #82532f 25%, #6d4426 55%, #8c5c36 80%, #63401f); color: rgba(255,255,255,.75); }
.stage-beyaz { background: linear-gradient(180deg, #f7f6f3, #e6e3dd); color: #6b7280; }
.stage-antrasit { background: repeating-linear-gradient(90deg, rgba(255,255,255,.015) 0 1px, transparent 1px 6px), linear-gradient(160deg, #3a3f47, #262a30); color: rgba(255,255,255,.65); }
.stage-duvar { background: radial-gradient(circle at 20% 30%, rgba(255,255,255,.35), transparent 40%), radial-gradient(circle at 80% 70%, rgba(0,0,0,.06), transparent 40%), linear-gradient(160deg, #e3ddd2, #cfc7b9); color: #6b6255; }
.stage-beton { background: radial-gradient(circle at 30% 20%, rgba(255,255,255,.25), transparent 35%), radial-gradient(circle at 75% 80%, rgba(0,0,0,.12), transparent 45%), repeating-linear-gradient(35deg, rgba(255,255,255,.04) 0 2px, transparent 2px 9px), linear-gradient(150deg, #8d9196, #6b6f75); color: rgba(255,255,255,.75); }

/* ==========================================================================
   İSİMLİK / LEVHA (PLATE) — ölçüler cqw ile genişliğe orantılıdır
   ========================================================================== */
.plate-wrap { container-type: inline-size; width: 100%; max-width: calc(var(--maxh, 240px) * var(--arn, 2.857)); margin-inline: auto; }
.plate {
  --ink-c: #15171c;
  position: relative; width: 100%; aspect-ratio: var(--ar, 20 / 7);
  border-radius: 1.4cqw; overflow: hidden; color: var(--ink-c);
  box-shadow: 0 .35cqw 0 rgba(0,0,0,.22), 0 2cqw 3.5cqw -1.2cqw rgba(0,0,0,.55), inset 0 0 0 .18cqw rgba(255,255,255,.4), inset 0 -.3cqw .6cqw rgba(0,0,0,.12);
  transition: transform .3s ease;
}

/* Malzemeler */
.plate.is-silver { background: linear-gradient(172deg, rgba(255,255,255,.55) 0%, rgba(255,255,255,0) 42%), linear-gradient(100deg, #7f858c 0%, #f6f7f9 13%, #a9aeb4 27%, #ffffff 43%, #8f959c 58%, #e9ecef 74%, #b4b9be 88%, #f3f5f7 100%); }
.plate.is-gold { background: linear-gradient(172deg, rgba(255,255,255,.45) 0%, rgba(255,255,255,0) 42%), linear-gradient(100deg, #9a6a14 0%, #ffe8a3 13%, #c48f2a 27%, #fff6d2 43%, #b07a1c 58%, #f7d97f 74%, #c9952f 88%, #ffecb0 100%); }
.plate.is-pleksi-beyaz { background: linear-gradient(160deg, #ffffff 0%, #f6f7f8 45%, #e9ebee 100%); box-shadow: 0 .45cqw 0 #d3d7dc, 0 .5cqw 0 rgba(0,0,0,.18), 0 2cqw 3.5cqw -1.2cqw rgba(0,0,0,.45), inset 0 0 0 .15cqw rgba(255,255,255,.9); }
.plate.is-metal-beyaz { background: repeating-linear-gradient(0deg, rgba(0,0,0,.018) 0 1px, transparent 1px 3px), linear-gradient(100deg, #e9eaec 0%, #fbfbfc 22%, #f1f2f4 45%, #ffffff 60%, #e8e9eb 82%, #f4f5f6 100%); box-shadow: 0 .35cqw 0 #c9ccd0, 0 2cqw 3.5cqw -1.2cqw rgba(0,0,0,.4), inset 0 0 0 .18cqw rgba(0,0,0,.06); }
.plate.is-pleksi-siyah { background: linear-gradient(160deg, #343840 0%, #121418 50%, #1d2026 100%); box-shadow: 0 .45cqw 0 #050607, 0 2cqw 3.5cqw -1.2cqw rgba(0,0,0,.6), inset 0 0 0 .15cqw rgba(255,255,255,.12); }
.plate.is-pleksi-seffaf { background: linear-gradient(135deg, rgba(255,255,255,.45), rgba(255,255,255,.14) 50%, rgba(255,255,255,.32)); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); box-shadow: inset 0 0 0 .35cqw rgba(255,255,255,.6), inset 0 0 1.6cqw rgba(255,255,255,.4), 0 1.5cqw 3cqw -1cqw rgba(0,0,0,.35); }

.plate-sheen { position: absolute; inset: 0; pointer-events: none; z-index: 3; background: linear-gradient(115deg, transparent 30%, rgba(255,255,255,.35) 44%, transparent 58%); mix-blend-mode: soft-light; }
.plate[class*="is-pleksi"] .plate-sheen { background: linear-gradient(125deg, rgba(255,255,255,.55) 0%, rgba(255,255,255,0) 38%); mix-blend-mode: normal; opacity: .55; }
.plate.is-pleksi-siyah .plate-sheen { opacity: .18; }

/* Vidalar / distans başlıkları */
.plate-screw { position: absolute; width: 2.1cqw; height: 2.1cqw; border-radius: 50%; display: none; z-index: 4; background: radial-gradient(circle at 35% 30%, #fff, #cfd2d6 40%, #80858b 100%); box-shadow: 0 .1cqw .25cqw rgba(0,0,0,.45); }
.plate.is-gold .plate-screw { background: radial-gradient(circle at 35% 30%, #fff7da, #e2c06b 40%, #8a6420 100%); }
.plate-screw::after { content: ''; position: absolute; left: 20%; right: 20%; top: 45%; height: 10%; background: rgba(0,0,0,.45); transform: rotate(-35deg); }
.plate-screw.tl { top: 1.8cqw; left: 1.8cqw; }
.plate-screw.tr { top: 1.8cqw; right: 1.8cqw; }
.plate-screw.bl { bottom: 1.8cqw; left: 1.8cqw; }
.plate-screw.br { bottom: 1.8cqw; right: 1.8cqw; }
.plate[class*="is-pleksi"] .plate-screw { width: 3.4cqw; height: 3.4cqw; background: radial-gradient(circle at 35% 28%, #fff, #e3e5e8 30%, #9aa0a6 70%, #61666c); box-shadow: 0 .3cqw .7cqw rgba(0,0,0,.45); }
.plate[class*="is-pleksi"] .plate-screw::after { display: none; }
.plate.has-vida .plate-screw { display: block; }

/* Çerçeve */
.plate-frame { position: absolute; inset: 2.3cqw; border-radius: .8cqw; pointer-events: none; display: none; z-index: 2; }
.plate.has-vida .plate-frame { inset: 2.3cqw 4.8cqw; }
.plate.has-vida[class*="is-pleksi"] .plate-frame { inset: 2.3cqw 6.4cqw; }
.plate.frame-ince .plate-frame { display: block; border: .28cqw solid var(--ink-c); }
.plate.frame-cift .plate-frame { display: block; border: .42cqw solid var(--ink-c); }
.plate.frame-cift .plate-frame::after { content: ''; position: absolute; inset: .7cqw; border: .16cqw solid var(--ink-c); border-radius: .4cqw; }
.plate.lay-bant .plate-frame { display: none; }

/* Yerleşim */
.plate-inner { position: absolute; inset: 0; z-index: 1; display: flex; flex-direction: column; }
.plate-band { display: none; }
.plate-body { flex: 1; min-height: 0; display: flex; align-items: center; gap: 3.2cqw; padding: 0 6.5cqw; overflow: hidden; }
.plate.has-vida .plate-body { padding-inline: 8.5cqw; }
.plate.has-vida[class*="is-pleksi"] .plate-body { padding-inline: 9.5cqw; }

.plate-side { order: 0; flex: none; display: flex; align-items: center; justify-content: center; padding-right: 3.2cqw; border-right: .3cqw solid var(--ink-c); font-family: var(--pf); font-weight: 700; line-height: 1; min-height: calc(var(--fs3) * 1.3cqw); }
.plate.side-sag .plate-side { order: 2; padding-right: 0; padding-left: 3.2cqw; border-right: 0; border-left: .3cqw solid var(--ink-c); }
.plate.side-none .plate-side { display: none; }
.plate-no { font-size: calc(var(--fs3) * 1cqw); }
.plate-icon { font-size: calc(var(--fs3) * .9cqw); line-height: 1; }
.plate-arrow { width: calc(var(--fs3) * 1cqw); height: calc(var(--fs3) * 1cqw); transform: rotate(var(--rot, 0deg)); }
.plate.sidetype-numara .plate-icon, .plate.sidetype-numara .plate-arrow,
.plate.sidetype-ikon .plate-no, .plate.sidetype-ikon .plate-arrow,
.plate.sidetype-ok .plate-no, .plate.sidetype-ok .plate-icon { display: none; }
.plate.sidetype-ok .plate-side { border: 0; padding: 0; }

.plate-side2 { order: 2; flex: none; display: none; align-items: center; line-height: 1; font-size: calc(var(--fs3) * .9cqw); }
.plate.side-sag .plate-side2 { order: 0; }
.plate.ek-ikon .plate-side2 { display: flex; }

.plate-text { order: 1; flex: 1; min-width: 0; display: flex; flex-direction: column; justify-content: center; text-align: center; }
.plate.align-sol .plate-text { text-align: left; }
.plate.align-sag .plate-text { text-align: right; }
.plate-l1 { font-family: var(--pf); font-weight: var(--fw, 600); font-size: calc(var(--fs1) * 1cqw); letter-spacing: var(--ls1, 0); line-height: 1.18; white-space: nowrap; }
.plate-l2, .plate-l3 { font-family: var(--pf2); font-weight: var(--fw2, 500); letter-spacing: calc(var(--ls1, 0) * .6); line-height: 1.25; white-space: nowrap; }
.plate-l2 { font-size: calc(var(--fs2) * 1cqw); margin-top: .9cqw; opacity: .92; }
.plate-l3 { font-size: calc(var(--fs2) * .78cqw); margin-top: .5cqw; opacity: .8; }
.plate-l2:empty, .plate-l3:empty { display: none; }
.plate.upper .plate-l1, .plate.upper .plate-l2, .plate.upper .plate-l3, .plate.upper .plate-band { text-transform: uppercase; }

/* Dikey düzen: üst yazı → büyük numara/ikon → alt yazılar */
.plate.lay-dikey .plate-body { flex-direction: column; justify-content: center; align-items: stretch; gap: 0; padding: 7cqw; }
.plate.lay-dikey .plate-text { display: contents; }
.plate.lay-dikey .plate-l1 { order: 1; }
.plate.lay-dikey .plate-l1:empty { display: none; }
.plate.lay-dikey .plate-side { order: 2; align-self: center; border: 0; padding: 0; margin: 2.5cqw 0; min-height: 0; }
.plate.lay-dikey.sidetype-numara .plate-side { border-top: .3cqw solid var(--ink-c); border-bottom: .3cqw solid var(--ink-c); padding: 2cqw 6cqw; }
.plate.lay-dikey .plate-l2 { order: 3; margin-top: 0; }
.plate.lay-dikey .plate-l3 { order: 4; }
.plate.lay-dikey .plate-side2 { display: none; }

/* Bantlı düzen: üstte renkli bant içinde ana yazı */
.plate.lay-bant .plate-band { display: block; flex: none; padding: 2.4cqw 6.5cqw; background: var(--vurgu); color: var(--vurgu-ink); font-family: var(--pf); font-weight: var(--fw); font-size: calc(var(--fs1) * 1cqw); letter-spacing: var(--ls1); line-height: 1.15; white-space: nowrap; overflow: hidden; text-align: center; }
.plate.lay-bant.align-sol .plate-band { text-align: left; }
.plate.lay-bant.align-sag .plate-band { text-align: right; }
.plate.lay-bant.has-vida .plate-band { padding-inline: 8.5cqw; }
.plate.lay-bant .plate-l1 { display: none; }
.plate.lay-bant .plate-l2 { margin-top: 0; }
.plate.lay-bant .plate-body { padding-block: 1.5cqw; }

/* Baskı efekti */
.plate-l1, .plate-l2, .plate-l3, .plate-side, .plate-side2 { text-shadow: 0 .12cqw 0 rgba(255,255,255,.45); }
.plate.ink-light .plate-l1, .plate.ink-light .plate-l2, .plate.ink-light .plate-l3, .plate.ink-light .plate-side, .plate.ink-light .plate-side2 { text-shadow: 0 .12cqw .2cqw rgba(0,0,0,.35); }
.plate[class*="is-pleksi"]:not(.ink-light) .plate-l1, .plate[class*="is-pleksi"]:not(.ink-light) .plate-l2, .plate[class*="is-pleksi"]:not(.ink-light) .plate-l3, .plate[class*="is-pleksi"]:not(.ink-light) .plate-side, .plate[class*="is-pleksi"]:not(.ink-light) .plate-side2 { text-shadow: none; }

/* Animasyonlar */
.plate .plate-body, .plate .plate-band { transition: opacity .35s ease, transform .35s ease; }
.plate.swap .plate-body, .plate.swap .plate-band { opacity: 0; transform: translateY(1.5cqw); }
.plate.pulse { animation: pulse .45s ease; }
@keyframes pulse { 50% { transform: scale(1.025); } }
.plate.is-overflow { outline: .4cqw dashed #ef4444; outline-offset: .8cqw; }

/* ==========================================================================
   TASARIM / ÜRÜN SAYFASI
   ========================================================================== */
.designer { padding: 2rem 0 4rem; }
.designer-head { margin-bottom: 1.5rem; }
.designer-head h1 { font-size: clamp(2.2rem, 4.6vw, 3.4rem); letter-spacing: -.05em; font-weight: 800; margin: .5rem 0 .35rem; }
.designer-head p { color: var(--muted); margin: 0; }

.type-strip { display: flex; gap: .5rem; overflow-x: auto; padding-bottom: .5rem; margin-bottom: 1.5rem; scrollbar-width: thin; }
.type-chip { flex: none; display: flex; align-items: center; gap: .7rem; padding: .55rem 1rem .55rem .55rem; border-radius: 18px; text-decoration: none; background: var(--surface); border: 1.5px solid var(--line); transition: all .2s; }
.type-chip i { width: 38px; height: 38px; border-radius: 12px; display: grid; place-items: center; background: var(--bg); font-size: 1.1rem; color: var(--ink); }
.type-chip strong { display: block; font-size: .88rem; }
.type-chip small { display: block; font-family: var(--font-mono); font-size: .64rem; color: var(--muted); text-transform: uppercase; }
.type-chip:hover { border-color: var(--line-2); }
.type-chip.active { border-color: var(--ink); background: var(--ink); color: #fff; }
.type-chip.active i { background: var(--accent); color: #fff; }
.type-chip.active small { color: rgba(255,255,255,.6); }

.preview-sticky { position: sticky; top: 104px; }
.design-stage { position: relative; border-radius: 30px; padding: 4.5rem clamp(1.25rem, 5vw, 4rem) 3.5rem; min-height: 400px; display: flex; flex-direction: column; justify-content: center; box-shadow: var(--shadow), inset 0 0 0 1px rgba(0,0,0,.04); transition: background .4s; }
.stage-toolbar { position: absolute; top: 1rem; left: 1rem; right: 1rem; display: flex; justify-content: space-between; align-items: center; gap: .5rem; }
.live-pill { display: inline-flex; align-items: center; gap: .45rem; font-family: var(--font-mono); font-size: .66rem; text-transform: uppercase; padding: .45rem .8rem; border-radius: 999px; background: rgba(255,255,255,.92); color: var(--ink); }
.live-pill .dot { width: 8px; height: 8px; border-radius: 50%; background: #22c55e; animation: blink 1.6s infinite; }
@keyframes blink { 50% { opacity: .3; } }
.stage-bgs { display: flex; gap: .35rem; background: rgba(255,255,255,.92); padding: .3rem; border-radius: 999px; }
.stage-bgs button { width: 24px; height: 24px; border-radius: 50%; border: 2px solid transparent; outline: 2px solid transparent; padding: 0; }
.stage-bgs button.active { outline-color: var(--accent); border-color: #fff; }
.stage-bgs [data-stage="ahsap"] { background: linear-gradient(135deg, #8c5c36, #5e3920); }
.stage-bgs [data-stage="beyaz"] { background: #f3f1ec; box-shadow: inset 0 0 0 1px #ddd; }
.stage-bgs [data-stage="antrasit"] { background: #33373e; }
.stage-bgs [data-stage="duvar"] { background: #d8d1c5; }
.stage-bgs [data-stage="beton"] { background: linear-gradient(135deg, #9a9ea3, #6b6f75); }

.measure { --maxh-stage: 380px; display: grid; grid-template-columns: minmax(0, calc(var(--maxh-stage) * var(--arn))) auto; grid-template-rows: auto auto; gap: .9rem; justify-content: center; width: 100%; }
.measure .plate-wrap { max-width: none; }
.measure-plate { grid-column: 1; grid-row: 1; }
.ruler { position: relative; font-family: var(--font-mono); font-size: .68rem; letter-spacing: .03em; color: currentColor; }
.ruler span { position: relative; z-index: 1; padding: 0 .5rem; text-shadow: 0 0 6px rgba(0,0,0,.15); }
.ruler-x { grid-column: 1; grid-row: 2; height: 14px; border-left: 1.5px solid; border-right: 1.5px solid; display: flex; justify-content: center; align-items: center; }
.ruler-x::before { content: ''; position: absolute; left: 0; right: 0; top: 50%; border-top: 1px dashed; opacity: .6; }
.ruler-y { grid-column: 2; grid-row: 1; width: 14px; border-top: 1.5px solid; border-bottom: 1.5px solid; display: flex; align-items: center; justify-content: center; }
.ruler-y::before { content: ''; position: absolute; top: 0; bottom: 0; left: 50%; border-left: 1px dashed; opacity: .6; }
.ruler-y span { writing-mode: vertical-rl; transform: rotate(180deg); padding: .4rem 0; }

.fit-warning { position: absolute; left: 50%; bottom: .9rem; transform: translateX(-50%); display: flex; align-items: center; gap: .6rem; white-space: nowrap; background: #fee2e2; color: #991b1b; font-size: .82rem; font-weight: 700; padding: .35rem .4rem .35rem .9rem; border-radius: 999px; box-shadow: var(--shadow-sm); }
.fit-warning .btn { font-size: .78rem; }

.preview-actions { display: flex; flex-wrap: wrap; gap: .75rem; justify-content: space-between; align-items: center; margin-top: 1rem; }
.summary-chips { display: flex; flex-wrap: wrap; gap: .4rem; }
.summary-chips span { font-family: var(--font-mono); font-size: .7rem; padding: .35rem .7rem; border-radius: 999px; background: var(--surface); border: 1px solid var(--line); }

.variant-strip { display: flex; gap: .6rem; margin-top: 1rem; overflow-x: auto; padding: .25rem; }
.variant { flex: 1 0 96px; max-width: 140px; display: flex; flex-direction: column; align-items: center; gap: .4rem; padding: .7rem .6rem .5rem; border-radius: 16px; border: 1.5px solid var(--line); background: var(--surface); font-size: .72rem; font-weight: 700; color: var(--muted); --maxh: 54px; transition: all .2s; }
.variant:hover { border-color: var(--line-2); }
.variant.active { border-color: var(--ink); color: var(--ink); }
.variant .plate { box-shadow: 0 .6cqw 1.6cqw -.4cqw rgba(0,0,0,.5); }

/* Panel */
.panel { background: var(--surface); border-radius: 28px; padding: clamp(1.25rem, 3vw, 2rem); border: 1px solid var(--line); box-shadow: var(--shadow-sm); }
.panel-block { padding: 1.5rem 0; border-top: 1px solid var(--line); }
.panel-block:first-of-type { border-top: 0; padding-top: 0; }
.panel-title { font-size: 1.15rem; font-weight: 700; letter-spacing: -.03em; display: flex; align-items: center; gap: .65rem; margin-bottom: 1.1rem; }
.panel-title span { width: 28px; height: 28px; border-radius: 9px; display: grid; place-items: center; background: var(--ink); color: #fff; font-family: var(--font-mono); font-size: .72rem; }
.form-label { font-size: .84rem; font-weight: 700; color: #3a372f; margin-bottom: .45rem; }
.form-label small, .counter { color: var(--muted); font-weight: 500; font-family: var(--font-mono); font-size: .68rem; }
.range-label { display: flex; justify-content: space-between; }
.range-label output { font-family: var(--font-mono); font-weight: 700; color: var(--accent); font-size: .8rem; }
.form-control, .form-select { border-radius: var(--radius-sm); border-color: var(--line); padding-top: .65rem; padding-bottom: .65rem; font-weight: 600; }
.form-control:focus, .form-select:focus, .form-check-input:focus { border-color: var(--ink); box-shadow: 0 0 0 .2rem rgba(255,90,31,.18); }
.form-check-input:checked { background-color: var(--accent); border-color: var(--accent); }
.form-range::-webkit-slider-thumb { background: var(--accent); }
.form-range::-moz-range-thumb { background: var(--accent); }
.form-range::-webkit-slider-runnable-track { background: var(--bg-2); }

.seg { display: flex; background: var(--bg); border-radius: 999px; padding: 4px; gap: 2px; }
.seg label { flex: 1; text-align: center; padding: .5rem .55rem; border-radius: 999px; cursor: pointer; font-size: .82rem; font-weight: 700; color: #4a473f; transition: all .2s; white-space: nowrap; }
.seg .btn-check:checked + label { background: var(--ink); color: #fff; }
.seg .btn-check:focus-visible + label { outline: 2px solid var(--accent); }

.material-opt, .size-opt, .mount-opt, .pay-opt { display: flex; align-items: center; gap: .7rem; width: 100%; height: 100%; padding: .75rem .85rem; border: 1.5px solid var(--line); border-radius: 16px; cursor: pointer; transition: all .2s; background: var(--surface); }
.material-opt strong, .size-opt strong, .mount-opt strong, .pay-opt strong { display: block; font-size: .88rem; line-height: 1.25; }
.material-opt small, .size-opt small, .mount-opt small, .pay-opt small { color: var(--muted); font-size: .76rem; }
.material-opt:hover, .size-opt:hover, .mount-opt:hover, .pay-opt:hover { border-color: var(--line-2); }
.btn-check:checked + .material-opt, .btn-check:checked + .size-opt, .btn-check:checked + .mount-opt, .btn-check:checked + .pay-opt { border-color: var(--ink); box-shadow: inset 0 0 0 1px var(--ink); background: var(--bg); }
.btn-check:focus-visible + .material-opt, .btn-check:focus-visible + .size-opt, .btn-check:focus-visible + .pay-opt { outline: 2px solid var(--accent); }
.mat-swatch { width: 34px; height: 34px; border-radius: 10px; flex-shrink: 0; box-shadow: inset 0 0 0 1px rgba(0,0,0,.1); }
.size-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: .5rem; }
.size-opt strong { text-wrap: balance; }
.size-shape-box { width: 40px; height: 32px; flex: none; display: grid; place-items: center; }
.size-shape { display: block; border: 2px solid var(--ink); border-radius: 3px; }
.btn-check:checked + .size-opt .size-shape { border-color: var(--accent); background: var(--accent-soft); }
.mount-opt { flex-direction: column; align-items: flex-start; gap: .15rem; }
.mount-opt i { font-size: 1.3rem; color: var(--accent); margin-bottom: .2rem; }

.preset-row { display: flex; gap: .4rem; overflow-x: auto; padding-bottom: .25rem; scrollbar-width: thin; }
.preset { flex-shrink: 0; border: 1.5px solid var(--line); background: var(--surface); border-radius: 12px; padding: .45rem .9rem; font-size: 1rem; transition: all .2s; }
.preset:hover, .preset.active { border-color: var(--ink); background: var(--ink); color: #fff; }
.font-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: .45rem; max-height: 236px; overflow-y: auto; padding: 2px; }
.font-opt { display: flex; flex-direction: column; align-items: center; padding: .6rem .3rem; border: 1.5px solid var(--line); border-radius: 14px; cursor: pointer; transition: all .2s; }
.font-opt span { font-size: 1.35rem; line-height: 1.3; }
.font-opt small { font-family: var(--font-mono); font-size: .58rem; text-transform: uppercase; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.font-opt:hover { border-color: var(--line-2); }
.btn-check:checked + .font-opt { border-color: var(--ink); background: var(--ink); color: #fff; }
.btn-check:checked + .font-opt small { color: rgba(255,255,255,.6); }

.color-row { display: flex; gap: .55rem; flex-wrap: wrap; }
.color-opt { width: 34px; height: 34px; border-radius: 50%; background: var(--c); cursor: pointer; box-shadow: inset 0 0 0 1px rgba(0,0,0,.15); outline: 2px solid transparent; outline-offset: 3px; transition: outline-color .2s, transform .2s; }
.color-opt:hover { transform: scale(1.08); }
.btn-check:checked + .color-opt { outline-color: var(--accent); }
.btn-check:focus-visible + .color-opt { outline-color: var(--ink); }
.icon-picker { max-height: 260px; overflow-y: auto; padding-right: 4px; }
.icon-group-title { font-family: var(--font-mono); font-size: .64rem; color: var(--muted); text-transform: uppercase; letter-spacing: .05em; margin: .5rem 0 .4rem; }
.icon-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: .4rem; }
.icon-grid label { aspect-ratio: 1; display: grid; place-items: center; border: 1.5px solid var(--line); border-radius: 12px; font-size: 1.2rem; cursor: pointer; transition: all .2s; }
.icon-grid label:hover { border-color: var(--line-2); }
.icon-grid .btn-check:checked + label { background: var(--ink); color: #fff; border-color: var(--ink); }
.frame-ico { display: inline-block; width: 26px; height: 14px; border-radius: 2px; vertical-align: middle; background: #c9ccd1; }
.frame-ico-ince { box-shadow: inset 0 0 0 3px #c9ccd1, inset 0 0 0 4.5px #111; }
.frame-ico-cift { box-shadow: inset 0 0 0 2px #c9ccd1, inset 0 0 0 3.5px #111, inset 0 0 0 5px #c9ccd1, inset 0 0 0 6px #111; }
.frame-ico-susleme { box-shadow: inset 0 0 0 3px #c9ccd1, inset 0 0 0 4px #111; border-radius: 6px; }
.frame-ico-serit { background: linear-gradient(100deg, #111 0 26%, #c9ccd1 26%); }
.frame-ico-egik { background: radial-gradient(ellipse 34% 70% at 0 50%, #111 98%, #c9ccd1 100%); }
.frame-ico-yanbant { background: linear-gradient(90deg, #111 0 16%, #c9ccd1 16% 84%, #111 84%); }

.buy-box { margin-top: .5rem; padding: 1.25rem; border-radius: 22px; background: var(--ink) var(--noise); color: #fff; }
.buy-price { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: 1rem; }
.buy-price small { display: block; font-family: var(--font-mono); color: rgba(255,255,255,.6); font-size: .68rem; text-transform: uppercase; }
.buy-price strong { font-family: var(--font-display); font-size: 2rem; font-weight: 700; letter-spacing: -.04em; }
.discount-note { display: block; font-size: .78rem; color: #86efac; font-weight: 700; }
.qty { display: flex; align-items: center; background: rgba(255,255,255,.08); border-radius: 999px; padding: 4px; }
.qty button { width: 34px; height: 34px; border: 0; border-radius: 50%; background: rgba(255,255,255,.1); color: #fff; }
.qty button:hover { background: var(--accent); color: #fff; }
.qty input { width: 44px; border: 0; background: transparent; color: #fff; text-align: center; font-weight: 800; -moz-appearance: textfield; }
.qty input::-webkit-outer-spin-button, .qty input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.qty input:focus { outline: none; }
.qty--light { background: var(--bg); }
.qty--light button { background: var(--surface); color: var(--ink); box-shadow: var(--shadow-sm); }
.qty--light input { color: var(--ink); }
.buy-note { margin: .8rem 0 0; font-size: .74rem; color: rgba(255,255,255,.55); text-align: center; }

/* Ürün detay */
.product-info h1 { font-size: clamp(2rem, 3.6vw, 2.8rem); letter-spacing: -.05em; font-weight: 800; line-height: 1; margin: .4rem 0 .75rem; }
.lead-sm { color: #4a473f; font-size: 1.02rem; }
.price-row { display: flex; flex-wrap: wrap; align-items: baseline; gap: .75rem; margin: 1rem 0 1.25rem; }
.price-big { font-family: var(--font-display); font-size: 2.4rem; font-weight: 700; letter-spacing: -.05em; }
.price-note { font-family: var(--font-mono); color: var(--muted); font-size: .66rem; text-transform: uppercase; }
.advanced-link { display: flex; gap: .6rem; align-items: center; padding: .8rem .9rem; border-radius: 14px; background: var(--accent-soft); font-size: .84rem; text-decoration: none; color: #8a2e0b; }
.advanced-link:hover { background: #ffd4c2; color: #6e2408; }
.advanced-link i { font-size: 1.1rem; }
.trust-list { list-style: none; padding: 0; margin: 1.25rem 0 0; display: grid; gap: .5rem; font-size: .88rem; color: #4a473f; font-weight: 600; }
.trust-list i { color: var(--accent); margin-right: .45rem; }
.product-tabs { margin-top: 3.5rem; background: var(--surface); border: 1px solid var(--line); border-radius: 28px; padding: clamp(1.25rem, 3vw, 2rem); }
.product-tabs .nav-pills { gap: .4rem; margin-bottom: 1.5rem; }
.product-tabs .nav-link { border-radius: 999px; color: var(--ink); font-weight: 700; background: var(--bg); }
.product-tabs .nav-link.active { background: var(--ink); color: #fff; }
.product-tabs p { color: #4a473f; }
.spec-list { list-style: none; padding: 0; margin: 0; display: grid; gap: .55rem; color: #4a473f; }
.spec-list i { color: var(--accent); margin-right: .4rem; }
.price-table { font-size: .85rem; }
.price-table th { font-family: var(--font-mono); font-size: .66rem; text-transform: uppercase; font-weight: 500; color: var(--muted); }
.price-table th, .price-table td { white-space: nowrap; }
.related { margin-top: 4rem; }
.related h2 { letter-spacing: -.04em; }
.link-more { text-decoration: none; font-weight: 700; color: var(--accent); }

.zoom-content { background: transparent; border: 0; }
.zoom-content .btn-close { position: absolute; top: 1rem; right: 1rem; z-index: 3; }
.zoom-stage { border-radius: 28px; padding: clamp(2rem, 8vw, 6rem) clamp(1rem, 6vw, 5rem); --maxh: 65vh; }

/* ==========================================================================
   SEPET / ÖDEME / SİPARİŞ
   ========================================================================== */
.checkout-steps { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 2rem; }
.checkout-steps > * { display: inline-flex; align-items: center; gap: .4rem; padding: .5rem 1rem; border-radius: 999px; font-family: var(--font-mono); font-size: .7rem; text-transform: uppercase; background: var(--bg-2); color: var(--muted); text-decoration: none; }
.checkout-steps .active { background: var(--ink); color: #fff; }
.checkout-steps .done { background: #dcf5e6; color: var(--success); }

.cart-list { display: grid; gap: 1rem; }
.cart-item { display: grid; grid-template-columns: 220px 1fr; gap: 1.25rem; background: var(--surface); border: 1px solid var(--line); border-radius: 24px; padding: 1rem; }
.cart-visual { border-radius: 16px; display: grid; place-items: center; padding: 1.25rem; min-height: 140px; --maxh: 110px; }
.cart-info { display: flex; flex-direction: column; min-width: 0; }
.cart-info h3 { font-size: 1.15rem; letter-spacing: -.03em; margin: .1rem 0 .3rem; }
.cart-info h3 a { text-decoration: none; }
.cart-info h3 a:hover { color: var(--accent); }
.cart-text { margin: 0 0 .25rem; display: flex; flex-wrap: wrap; gap: .25rem .6rem; font-size: .88rem; font-weight: 600; }
.cart-spec { margin: 0; font-family: var(--font-mono); font-size: .66rem; text-transform: uppercase; color: var(--muted); }
.cart-price strong { display: block; font-family: var(--font-display); font-size: 1.3rem; letter-spacing: -.03em; white-space: nowrap; }
.cart-price small { color: var(--muted); font-size: .76rem; white-space: nowrap; }
.cart-actions { margin-top: auto; padding-top: .9rem; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .6rem; }
.cart-actions .btn { border-radius: 10px; }
@media (max-width: 575.98px) { .cart-item { grid-template-columns: 1fr; } }

.summary-card { background: var(--surface); border: 1px solid var(--line); border-radius: 28px; padding: 1.5rem; box-shadow: var(--shadow-sm); }
.summary-card h2 { letter-spacing: -.03em; }
.summary-lines { display: grid; grid-template-columns: 1fr auto; gap: .55rem 1rem; margin: 1rem 0; }
.summary-lines dt { font-weight: 600; color: #4a473f; }
.summary-lines dd { margin: 0; text-align: right; font-weight: 700; white-space: nowrap; }
.summary-lines .total { font-family: var(--font-display); font-size: 1.45rem; font-weight: 700; letter-spacing: -.03em; color: var(--ink); padding-top: .75rem; border-top: 1px solid var(--line); }
.summary-lines [hidden] { display: none !important; }
.ship-progress { background: var(--accent-soft); border-radius: 14px; padding: .8rem 1rem; margin: 1rem 0; font-size: .85rem; font-weight: 600; }
.ship-progress p { margin: 0 0 .5rem; }
.ship-progress .bar { height: 6px; border-radius: 999px; background: rgba(255,90,31,.2); overflow: hidden; }
.ship-progress .bar span { display: block; height: 100%; background: var(--accent); border-radius: 999px; }
.ship-progress.done { background: #dcf5e6; color: var(--success); }
.ship-progress.done p { margin: 0; }
.hint { font-size: .84rem; font-weight: 600; color: #8a2e0b; background: var(--accent-soft); padding: .6rem .8rem; border-radius: 10px; }

.form-card { background: var(--surface); border: 1px solid var(--line); border-radius: 24px; padding: clamp(1.25rem, 3vw, 1.75rem); margin-bottom: 1rem; }
.form-card > h2 { display: flex; align-items: center; gap: .6rem; margin-bottom: 1.25rem; letter-spacing: -.03em; }
.step-dot { width: 28px; height: 28px; border-radius: 9px; display: inline-grid; place-items: center; background: var(--ink); color: #fff; font-family: var(--font-mono); font-size: .72rem; }
.pay-options { display: grid; gap: .5rem; }
.pay-opt { padding: .9rem 1rem; }
.pay-opt > i { font-size: 1.4rem; color: var(--accent); width: 34px; text-align: center; }
.pay-opt.disabled { opacity: .5; cursor: not-allowed; }
.soon { font-family: var(--font-mono); font-style: normal; font-size: .6rem; text-transform: uppercase; padding: .15rem .45rem; border-radius: 999px; background: var(--bg-2); color: var(--muted); margin-left: .3rem; vertical-align: middle; }

.mini-items { display: grid; gap: .8rem; max-height: 360px; overflow-y: auto; margin-bottom: .5rem; padding: .5rem .5rem 0 0; }
.mini-item { display: flex; align-items: center; gap: .8rem; }
.mini-item strong { display: block; font-size: .88rem; }
.mini-item small { display: block; font-size: .76rem; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mini-visual { position: relative; width: 84px; height: 64px; flex: none; border-radius: 12px; display: grid; place-items: center; padding: .4rem; --maxh: 44px; }
.mini-qty { position: absolute; top: -6px; right: -6px; min-width: 20px; height: 20px; padding: 0 5px; border-radius: 999px; background: var(--accent); color: #fff; font-size: .68rem; font-weight: 800; display: grid; place-items: center; }
.mini-price { font-weight: 800; font-size: .9rem; white-space: nowrap; }

.success-hero { text-align: center; background: var(--surface); border: 1px solid var(--line); border-radius: 32px; padding: clamp(2rem, 6vw, 3.5rem) 1.5rem; }
.success-hero h1 { font-size: clamp(2rem, 4.5vw, 3rem); letter-spacing: -.05em; font-weight: 800; }
.success-hero p { color: var(--muted); }
.success-icon { width: 76px; height: 76px; border-radius: 24px; margin: 0 auto 1.25rem; display: grid; place-items: center; font-size: 2.4rem; color: #fff; background: var(--accent); transform: rotate(-6deg); box-shadow: 0 20px 30px -15px rgba(255,90,31,.8); animation: pop .5s cubic-bezier(.2,1.4,.4,1); }
@keyframes pop { from { transform: scale(.4) rotate(-30deg); opacity: 0; } }
.order-no { display: inline-flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: .75rem; margin-top: .75rem; padding: .6rem .6rem .6rem 1.25rem; border-radius: 999px; background: var(--bg); }
.order-no span { font-family: var(--font-mono); color: var(--muted); font-size: .7rem; text-transform: uppercase; }
.order-no strong { font-family: var(--font-mono); font-size: 1.1rem; letter-spacing: .04em; }
.bank-card { border-color: #ffc9b3; background: #fff8f4; }
.bank-lines { display: grid; grid-template-columns: auto 1fr; gap: .6rem 1.25rem; margin: 0; align-items: center; }
.bank-lines dt { font-family: var(--font-mono); font-size: .68rem; text-transform: uppercase; color: var(--muted); font-weight: 500; }
.bank-lines dd { margin: 0; }
.bank-lines code { font-family: var(--font-mono); color: var(--ink); font-size: .92rem; background: #fff; padding: .15rem .45rem; border-radius: 6px; border: 1px solid var(--line); }

.timeline { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(5, 1fr); position: relative; }
.timeline::before { content: ''; position: absolute; top: 20px; left: 10%; right: 10%; height: 2px; background: var(--bg-2); }
.timeline li { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; gap: .5rem; font-size: .78rem; font-weight: 700; color: var(--muted); }
.tl-dot { position: relative; z-index: 1; width: 42px; height: 42px; border-radius: 14px; display: grid; place-items: center; background: var(--bg-2); font-size: 1.05rem; }
.timeline li.done .tl-dot { background: var(--success); color: #fff; }
.timeline li.done { color: var(--success); }
.timeline li.current .tl-dot { background: var(--accent); color: #fff; box-shadow: 0 0 0 6px var(--accent-soft); }
.timeline li.current { color: var(--ink); }
@media (max-width: 575.98px) { .timeline li { font-size: .64rem; } .tl-dot { width: 34px; height: 34px; } .timeline::before { top: 16px; } }

/* ---------- Mobil ---------- */
@media (max-width: 991.98px) {
  .preview-sticky { position: sticky; top: 76px; z-index: 5; }
  .design-stage { min-height: 0; padding: 3.75rem 1rem 2.75rem; }
  .measure { --maxh-stage: 200px; }
  .preview-actions, .variant-strip { display: none; }
  .ticker { transform: none; margin: 0; }
}
@media (max-width: 575.98px) {
  .font-grid { grid-template-columns: repeat(2, 1fr); }
  .icon-grid { grid-template-columns: repeat(5, 1fr); }
  .fit-warning { font-size: .72rem; }
  .sort-form, .sort-form .form-select { width: 100%; }
  .qt-input { flex-direction: column; }
  .hero-title { font-size: 2.7rem; }
}

/* ==========================================================================
   KÂĞIT, ETİKET, SERAMİK MALZEMELER
   ========================================================================== */
.plate.is-kart-beyaz { background: var(--noise), linear-gradient(160deg, #fffefb, #f6f3ec); }
.plate.is-kart-kraft { background: var(--noise), var(--noise), linear-gradient(160deg, #cfa97f, #b98f63); }
.plate.is-kart-siyah { background: var(--noise), linear-gradient(160deg, #262626, #141414); }
.plate.is-kart-sedef { background: linear-gradient(125deg, #fbf8f3 0%, #efe8f4 30%, #f6f1e4 55%, #e8eef4 80%, #f8f4ee 100%); }
.plate.mat-kagit { border-radius: .6cqw; box-shadow: 0 1.2cqw 2.4cqw -1cqw rgba(0,0,0,.45), 0 .2cqw .4cqw rgba(0,0,0,.08); }
.plate.mat-kagit .plate-sheen { display: none; }

.plate.is-etiket-beyaz { background: linear-gradient(160deg, #ffffff, #f2f3f5); }
.plate.is-etiket-kraft { background: var(--noise), var(--noise), linear-gradient(160deg, #caa279, #b48a5e); }
.plate.is-etiket-seffaf { background: rgba(255,255,255,.1); }
.plate.is-etiket-altin { background: linear-gradient(115deg, #b8892f 0%, #f3d98c 25%, #c99a3e 45%, #fbe9b0 62%, #b58628 82%, #e8c66f 100%); }
.plate.mat-etiket { box-shadow: 0 .8cqw 1.6cqw -.6cqw rgba(0,0,0,.4), inset 0 0 0 .3cqw rgba(255,255,255,.35); }
.plate.is-etiket-seffaf { box-shadow: inset 0 0 0 .5cqw rgba(255,255,255,.45), 0 .4cqw 1cqw -.4cqw rgba(0,0,0,.25); }
.plate.is-etiket-kraft .plate-sheen, .plate.is-etiket-seffaf .plate-sheen { display: none; }

.plate.mat-seramik { background: transparent; box-shadow: none; border-radius: 0; overflow: visible; }
.plate.mat-seramik .plate-sheen { display: none; }

.plate:is(.mat-kagit, .mat-etiket, .mat-seramik) :is(.plate-l1, .plate-l2, .plate-l3, .plate-side, .plate-side2, .plate-band) { text-shadow: none; }

/* ==========================================================================
   KESİM ŞEKİLLERİ
   ========================================================================== */
.plate.shape-yuvarlak { border-radius: 5cqw; }
.plate.shape-yuvarlak .plate-frame { border-radius: 3.5cqw; }
.plate.shape-daire { border-radius: 50%; }
.plate.shape-daire .plate-frame { border-radius: 50%; }
.plate.shape-daire .plate-body { padding-inline: 13cqw; }
.plate.shape-kemer { border-radius: 50% 50% 1.4cqw 1.4cqw / 24% 24% 1.4cqw 1.4cqw; }
.plate.shape-kemer .plate-frame { border-radius: 50% 50% .8cqw .8cqw / 23% 23% .8cqw .8cqw; }
.plate.shape-kemer .plate-body { padding-top: calc(16cqw / var(--arn, 1) + 4cqw); }
.plate.shape-ev { border-radius: 0; clip-path: polygon(50% 0, 100% 24%, 100% 100%, 0 100%, 0 24%); }
.plate.shape-ev .plate-body { padding-top: calc(24cqw / var(--arn, 1) + 3cqw); }
.plate.shape-kesik { border-radius: 0; clip-path: polygon(7cqw 0, calc(100% - 7cqw) 0, 100% 7cqw, 100% calc(100% - 7cqw), calc(100% - 7cqw) 100%, 7cqw 100%, 0 calc(100% - 7cqw), 0 7cqw); }
.plate-wrap:has(> .shape-ev), .plate-wrap:has(> .shape-kesik) { filter: drop-shadow(0 1.6cqw 1.8cqw rgba(0,0,0,.45)); }
.plate.shape-ev .plate-frame, .plate.shape-kesik .plate-frame { display: none !important; }

.plate-shape-frame { display: none; position: absolute; inset: 0; width: 100%; height: 100%; z-index: 2; color: var(--ink-c); pointer-events: none; }
.plate-shape-frame polygon { display: none; fill: none; stroke: currentColor; stroke-width: .35cqw; vector-effect: non-scaling-stroke; }
.plate.shape-ev:not(.frame-yok) .plate-shape-frame, .plate.shape-kesik:not(.frame-yok) .plate-shape-frame { display: block; }
.plate.shape-ev .sf-ev, .plate.shape-kesik .sf-kesik { display: block; }
.plate.frame-cift .plate-shape-frame polygon { stroke-width: .7cqw; }

/* Özel kesimde vida konumları */
.plate.shape-ev .plate-screw.tl, .plate.shape-ev .plate-screw.tr { top: calc(28cqw / var(--arn, 1)); }
.plate.shape-kemer .plate-screw.tl, .plate.shape-kemer .plate-screw.tr { top: calc(20cqw / var(--arn, 1)); }
.plate.shape-daire .plate-screw.tl { top: 50%; left: 3cqw; transform: translateY(-50%); }
.plate.shape-daire .plate-screw.tr { top: 50%; right: 3cqw; transform: translateY(-50%); }
.plate.shape-daire .plate-screw.bl, .plate.shape-daire .plate-screw.br { display: none !important; }
.plate.shape-kesik .plate-screw.tl { top: 4cqw; left: 4cqw; } .plate.shape-kesik .plate-screw.tr { top: 4cqw; right: 4cqw; }
.plate.shape-kesik .plate-screw.bl { bottom: 4cqw; left: 4cqw; } .plate.shape-kesik .plate-screw.br { bottom: 4cqw; right: 4cqw; }

/* ==========================================================================
   FOTOĞRAFLI ÖNİZLEME (kupa / etiket)
   ========================================================================== */
.mockup { position: relative; width: 100%; line-height: 0; }
.mockup > img { width: 100%; height: auto; display: block; border-radius: inherit; }
.mockup .plate-wrap { max-width: none; }
.mockup-print { position: absolute; line-height: normal; display: grid; place-items: center; }
.mockup-kupa .mockup-print { left: 38.4%; width: 25.6%; top: 29%; height: 44%; mix-blend-mode: multiply; }
.mockup-kupa .mockup-print::after { content: ''; position: absolute; inset: -4% -2%; pointer-events: none; background: linear-gradient(90deg, rgba(255,255,255,.35), transparent 18%, transparent 78%, rgba(0,0,0,.06)); mix-blend-mode: screen; }
/* Fotoğraftaki boş beyaz etiketi kraft tonunda örterek kendi etiketimizi yerleştiriyoruz */
.mockup-etiket::before { content: ''; position: absolute; left: 35.6%; width: 26.2%; top: 43%; height: 33.5%; background: url('../img/etiket-kutu.webp') no-repeat 82.66% 64.66% / 381.68% auto; filter: brightness(.9) saturate(.95); -webkit-mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent), linear-gradient(180deg, transparent, #000 8%, #000 92%, transparent); -webkit-mask-composite: source-in; mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent), linear-gradient(180deg, transparent, #000 8%, #000 92%, transparent); mask-composite: intersect; }
.mockup-etiket .mockup-print { left: calc(48.7% - var(--en, 4) * 1.6%); width: calc(var(--en, 4) * 3.2%); top: 59.3%; transform: translateY(-50%); }
.design-stage.stage-mockup { padding: 4rem 1rem 1.25rem; }
.measure--mockup { display: block; max-width: 760px; margin: 0 auto; }
.measure--mockup .mockup { border-radius: 20px; overflow: hidden; }
.stage-foto { background: #e5e7ea; color: #6b675e; }
.product-visual.stage-foto, .cat-visual.stage-foto { padding: 0; overflow: hidden; }
.stage-foto > .mockup { width: min(100%, 340px); }
.cart-visual.stage-foto, .mini-visual.stage-foto { padding: 0; overflow: hidden; }
.mini-visual.stage-foto > .mockup, .cart-visual.stage-foto > .mockup { width: 100%; }
.zoom-stage .mockup { max-width: 900px; margin: 0 auto; border-radius: 20px; overflow: hidden; }

/* Yeni sahneler */
.stage-masa { background: repeating-linear-gradient(90deg, rgba(120,80,40,.05) 0 2px, transparent 2px 13px), linear-gradient(160deg, #e6d3b8, #d4bb98); color: #6b5638; }
.stage-kumas { background: repeating-linear-gradient(45deg, rgba(255,255,255,.035) 0 2px, transparent 2px 5px), repeating-linear-gradient(-45deg, rgba(0,0,0,.08) 0 2px, transparent 2px 5px), linear-gradient(160deg, #2a3650, #1b2438); color: rgba(255,255,255,.7); }
.stage-bgs [data-stage="masa"] { background: linear-gradient(135deg, #e6d3b8, #c9ab83); }
.stage-bgs [data-stage="kumas"] { background: #26324a; }

/* Paket ve şekil seçimi */
.pack-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: .45rem; }
.pack-opt { display: flex; flex-direction: column; padding: .65rem .75rem; border: 1.5px solid var(--line); border-radius: 14px; cursor: pointer; transition: all .2s; background: var(--surface); }
.pack-opt strong { font-size: .9rem; }
.pack-opt small { font-weight: 700; color: var(--ink); font-size: .8rem; }
.pack-opt em { font-style: normal; font-family: var(--font-mono); font-size: .6rem; color: var(--muted); }
.pack-opt:hover { border-color: var(--line-2); }
.btn-check:checked + .pack-opt { border-color: var(--ink); box-shadow: inset 0 0 0 1px var(--ink); background: var(--bg); }
.shape-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: .45rem; }
.shape-opt { display: flex; flex-direction: column; align-items: center; text-align: center; gap: .3rem; padding: .75rem .5rem; border: 1.5px solid var(--line); border-radius: 14px; cursor: pointer; transition: all .2s; background: var(--surface); }
.shape-opt strong { font-size: .8rem; line-height: 1.2; }
.shape-opt small { font-family: var(--font-mono); font-size: .6rem; color: var(--muted); }
.shape-opt:hover { border-color: var(--line-2); }
.btn-check:checked + .shape-opt { border-color: var(--ink); box-shadow: inset 0 0 0 1px var(--ink); background: var(--bg); }
.btn-check:checked + .shape-opt .shape-ico { background: var(--accent); }
.shape-ico { width: 34px; height: 40px; background: var(--ink); }
.shape-ico-duz { border-radius: 3px; }
.shape-ico-yuvarlak { border-radius: 9px; }
.shape-ico-daire { border-radius: 50%; width: 38px; height: 38px; }
.shape-ico-kemer { border-radius: 17px 17px 3px 3px; }
.shape-ico-ev { clip-path: polygon(50% 0, 100% 30%, 100% 100%, 0 100%, 0 30%); }
.shape-ico-kesik { clip-path: polygon(25% 0, 75% 0, 100% 20%, 100% 80%, 75% 100%, 25% 100%, 0 80%, 0 20%); }

/* ==========================================================================
   FOTOĞRAFLI BÖLÜMLER
   ========================================================================== */
.photo-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
.photo-card { position: relative; display: flex; flex-direction: column; text-decoration: none; border-radius: 28px; overflow: hidden; background: var(--surface); border: 1px solid var(--line); transition: transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s, border-color .35s; }
.photo-card:hover { transform: translateY(-6px); box-shadow: var(--shadow); border-color: var(--ink); color: inherit; }
.photo-card-media { position: relative; aspect-ratio: 4 / 3.4; overflow: hidden; display: grid; place-items: center; --maxh: 90px; }
.photo-card-media > img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s cubic-bezier(.2,.7,.2,1); }
.photo-card:hover .photo-card-media > img { transform: scale(1.06); }
.photo-card-media.stage-foto > .mockup { width: 100%; }
.photo-card-media .plate-wrap { width: 78%; }
.photo-card-body { padding: 1.2rem 1.4rem 1.4rem; }
.photo-card-body .mono { color: var(--accent); }
.photo-card-body h3 { font-size: 1.35rem; letter-spacing: -.04em; margin: .3rem 0 .25rem; }
.photo-card-body p { color: var(--muted); font-size: .88rem; margin: 0; }
.photo-tag { position: absolute; left: .8rem; bottom: .8rem; z-index: 2; font-family: var(--font-mono); font-size: .6rem; text-transform: uppercase; padding: .25rem .55rem; border-radius: 999px; background: rgba(17,17,17,.7); color: #fff; }
@media (max-width: 991.98px) { .photo-cards { grid-template-columns: 1fr 1fr; } }
@media (max-width: 575.98px) { .photo-cards { grid-template-columns: 1fr; } }

.page-hero-media { position: relative; border-radius: 28px; overflow: hidden; aspect-ratio: 16 / 10; box-shadow: var(--shadow); }
.page-hero-media img { width: 100%; height: 100%; object-fit: cover; }
.page-hero-media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 55%, rgba(17,17,17,.55)); }
.page-hero-media .photo-tag { left: 1rem; bottom: 1rem; }

/* Yeni malzeme renk örnekleri */
.mat-dot.kart-beyaz, .mat-swatch.kart-beyaz { background: linear-gradient(150deg, #fffefb, #efe9de); }
.mat-dot.kart-kraft, .mat-swatch.kart-kraft, .mat-dot.etiket-kraft, .mat-swatch.etiket-kraft { background: var(--noise), linear-gradient(150deg, #d0aa80, #b48a5e); }
.mat-dot.kart-siyah, .mat-swatch.kart-siyah { background: linear-gradient(150deg, #2b2b2b, #111); }
.mat-dot.kart-sedef, .mat-swatch.kart-sedef { background: linear-gradient(125deg, #fbf8f3, #e9e1f1, #f4eedf, #e3ebf3); }
.mat-dot.etiket-beyaz, .mat-swatch.etiket-beyaz { background: linear-gradient(135deg, #fff 45%, #e8eaee); }
.mat-dot.etiket-seffaf, .mat-swatch.etiket-seffaf { background: repeating-conic-gradient(#e9e6df 0 25%, #fff 0 50%) 0 0 / 10px 10px; }
.mat-dot.etiket-altin, .mat-swatch.etiket-altin { background: linear-gradient(115deg, #b8892f, #f3d98c 40%, #c99a3e 65%, #fbe9b0); }
.mat-dot.kupa-beyaz, .mat-swatch.kupa-beyaz { background: radial-gradient(circle at 35% 30%, #fff, #e3e5e8); }
.mat-dot.kupa-sihirli, .mat-swatch.kupa-sihirli { background: radial-gradient(circle at 35% 30%, #4a4a4a, #111); }
/* Poster: çerçeve renk örnekleri ve önizlemede çerçeve */
.mat-dot.poster-cercevesiz, .mat-swatch.poster-cercevesiz { background: linear-gradient(150deg, #fff 55%, #e9e6df); }
.mat-dot.poster-siyah, .mat-swatch.poster-siyah { background: #fff; box-shadow: inset 0 0 0 4px #1b1b1d; }
.mat-dot.poster-beyaz, .mat-swatch.poster-beyaz { background: #f3f1ec; box-shadow: inset 0 0 0 4px #fff, inset 0 0 0 5px #cfccc4; }
.mat-dot.poster-ahsap, .mat-swatch.poster-ahsap { background: #fff; box-shadow: inset 0 0 0 4px #b98a57; }
/* Çerçeve önizleme boyutuyla orantılı: zemin çerçeve rengi, görsel içeride (A oranında ≈ eşit kalınlık) */
.plate.mat-poster.has-art { box-shadow: 0 10px 26px rgba(0, 0, 0, .22) !important; }
.plate.mat-poster.has-art .plate-art { object-fit: cover; }
.plate.mat-poster.is-poster-siyah.has-art { background: #1b1b1d !important; }
.plate.mat-poster.is-poster-beyaz.has-art { background: #fbfaf7 !important; box-shadow: 0 0 0 1px rgba(0, 0, 0, .12), 0 14px 32px rgba(0, 0, 0, .26) !important; }
.plate.mat-poster.is-poster-ahsap.has-art { background: linear-gradient(135deg, #c99a66, #a8774a 50%, #c18f5c) !important; }
.plate.mat-poster.is-poster-siyah.has-art, .plate.mat-poster.is-poster-ahsap.has-art { box-shadow: 0 14px 32px rgba(0, 0, 0, .3) !important; }
.plate.is-poster-siyah.has-art .plate-art, .plate.is-poster-beyaz.has-art .plate-art, .plate.is-poster-ahsap.has-art .plate-art { inset: 3.3% 4.6%; width: 90.8%; height: 93.4%; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .15); }
/* Kart görsellerinde ürün odaklı yakın kadraj: baskı alanının merkezi (--fx, --fy) kartın ortasına gelir */
.mockup-kupa { --fx: 51%; --fy: 51%; }
.mockup-etiket { --fx: 48.7%; --fy: 59.3%; }
:is(.product-visual, .photo-card-media, .pa-visual).stage-foto { position: relative; display: block; overflow: hidden; }
:is(.product-visual, .photo-card-media, .pa-visual).stage-foto > .mockup {
  position: absolute; left: 50%; top: 50%; width: 100%; max-width: none;
  transform-origin: var(--fx) var(--fy); transform: translate(calc(var(--fx) * -1), calc(var(--fy) * -1)) scale(var(--zoom, 1.35));
  transition: transform .6s cubic-bezier(.2,.7,.2,1);
}
.mockup-etiket { --zoom: 1.7; }
.product-card:hover .product-visual.stage-foto > .mockup, .photo-card:hover .photo-card-media.stage-foto > .mockup { --zoom: 1.45; }
.product-card:hover .product-visual.stage-foto > .mockup-etiket, .photo-card:hover .photo-card-media.stage-foto > .mockup-etiket { --zoom: 1.85; }

/* ==========================================================================
   LOGO (yan öğe)
   ========================================================================== */
.plate-logo { display: none; position: relative; align-items: center; justify-content: center; height: calc(var(--fs3) * 2cqw); max-width: calc(var(--fs3) * 5cqw); }
.plate.sidetype-logo .plate-logo { display: inline-flex; }
.plate.sidetype-logo .plate-no, .plate.sidetype-logo .plate-icon, .plate.sidetype-logo .plate-arrow { display: none; }
.plate-logo img { display: block; height: 100%; width: auto; max-width: 100%; object-fit: contain; }
.plate-logo em { display: none; }
.plate-logo.is-empty { width: calc(var(--fs3) * 3cqw); border: .25cqw dashed currentColor; border-radius: .8cqw; opacity: .5; }
.plate-logo.is-empty img { display: none; }
.plate-logo.is-empty em { display: block; font-style: normal; font-family: var(--font-mono, monospace); font-size: calc(var(--fs3) * .4cqw); letter-spacing: .1em; }
/* Tek renk: logo şekli yazı rengiyle boyanır */
.plate.logo-tek .plate-logo:not(.is-empty) { background: var(--ink-c); -webkit-mask: var(--logo) center / contain no-repeat; mask: var(--logo) center / contain no-repeat; }
.plate.logo-tek .plate-logo:not(.is-empty) img { opacity: 0; }

.logo-box { display: grid; grid-template-columns: 96px 1fr; gap: .9rem; align-items: center; padding: .8rem; border: 1.5px dashed var(--line-2); border-radius: 16px; background: var(--bg); }
.logo-box.has-logo { border-style: solid; }
.logo-box.is-loading { opacity: .6; pointer-events: none; }
.logo-preview { width: 96px; height: 96px; border-radius: 12px; display: grid; place-items: center; background: repeating-conic-gradient(#ece8df 0 25%, #fff 0 50%) 0 0 / 14px 14px; overflow: hidden; }
.logo-preview img { max-width: 86%; max-height: 86%; object-fit: contain; display: none; }
.logo-preview i { font-size: 1.8rem; color: var(--line-2); }
.logo-box.has-logo .logo-preview img { display: block; }
.logo-box.has-logo .logo-preview i { display: none; }
.logo-actions { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; }
.logo-actions .form-check { width: 100%; margin: 0; }
.logo-hint { grid-column: 1 / -1; margin: 0; font-size: .76rem; color: var(--muted); }

/* Ürün sayfası stok kodu */
.sku-line { margin: -.4rem 0 1rem; font-size: .8rem; color: var(--muted, #6b6f76); }
.sku-line code { font-family: 'JetBrains Mono', monospace; color: inherit; background: rgba(0,0,0,.05); padding: .1rem .4rem; border-radius: 6px; }

/* Vitrin sayfalama */
.pager-site { display: flex; gap: .35rem; justify-content: center; flex-wrap: wrap; margin-top: 2.5rem; }
.pager-site a, .pager-site span { min-width: 42px; height: 42px; padding: 0 .75rem; border-radius: 12px; display: grid; place-items: center; text-decoration: none; font-weight: 700; color: inherit; background: #fff; border: 1px solid rgba(0,0,0,.08); }
.pager-site a:hover { border-color: currentColor; }
.pager-site a.active { background: #111; color: #fff; border-color: #111; }
.pager-site span { background: none; border: 0; }

/* Süsleme modelleri (levha_deko_sekilleri ile aynı ölçüler) */
.plate-deco { position: absolute; pointer-events: none; z-index: 2; display: none; color: var(--ink-c); fill: currentColor; }
.plate.frame-susleme .deco-susleme, .plate.frame-serit .deco-serit, .plate.frame-egik .deco-egik, .plate.frame-yanbant .deco-yanbant { display: block; }
.deco-band { top: 0; bottom: 0; left: 0; height: 100%; }
.deco-serit { width: 13cqw; }
.deco-egik { width: 10cqw; }
.deco-yanbant { width: 7.5cqw; }
.deco-yanbant.deco-sag { left: auto; right: 0; transform: scaleX(-1); }
.plate.frame-serit .plate-body { padding-left: 17cqw; }
.plate.frame-egik .plate-body { padding-left: 14cqw; }
.plate.frame-yanbant .plate-body { padding-inline: 11cqw; }
.deco-susleme { inset: 0; --s: min(10cqw, calc(38cqw / var(--arn, 4))); --i: 1.6cqw; --lw: calc(var(--s) * .03); }
.deco-susleme svg { position: absolute; width: var(--s); height: var(--s); overflow: visible; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.deco-susleme svg .ds-ana { stroke-width: 3; }
.deco-susleme svg circle { fill: currentColor; stroke: none; }
.deco-susleme .ds-tl { top: var(--i); left: var(--i); }
.deco-susleme .ds-tr { top: var(--i); right: var(--i); transform: scaleX(-1); }
.deco-susleme .ds-bl { bottom: var(--i); left: var(--i); transform: scaleY(-1); }
.deco-susleme .ds-br { bottom: var(--i); right: var(--i); transform: scale(-1, -1); }
.deco-susleme .ds-h, .deco-susleme .ds-v { position: absolute; border: 0 solid currentColor; }
.deco-susleme .ds-h { left: calc(var(--i) + var(--s) * .62); right: calc(var(--i) + var(--s) * .62); top: calc(var(--i) + var(--s) * .18 - var(--lw) / 2); bottom: calc(var(--i) + var(--s) * .18 - var(--lw) / 2); border-top-width: var(--lw); border-bottom-width: var(--lw); }
.deco-susleme .ds-v { top: calc(var(--i) + var(--s) * .62); bottom: calc(var(--i) + var(--s) * .62); left: calc(var(--i) + var(--s) * .18 - var(--lw) / 2); right: calc(var(--i) + var(--s) * .18 - var(--lw) / 2); border-left-width: var(--lw); border-right-width: var(--lw); }

/* Baskı görselli kupa: görsel baskı alanını kaplar */
.plate-art { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; z-index: 2; }
.plate.has-art .plate-inner, .plate.has-art .plate-frame, .plate.has-art .plate-deco { display: none; }

/* Mobil: ürün kartları 2'li ızgara, sıkı düzen */
@media (max-width: 575.98px) {
  .product-card { border-radius: 18px; }
  .product-card:hover { transform: none; }
  .product-visual { height: 132px; padding: 1rem .6rem; --maxh: 96px; }
  .product-tag { top: .5rem; left: .5rem; font-size: .52rem; padding: .22rem .45rem; }
  .product-body { padding: .7rem .75rem .8rem; }
  .product-type { font-size: .56rem; letter-spacing: .02em; }
  .product-body h3 { font-size: .86rem; margin: .25rem 0 .35rem; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
  .product-body p { display: none; }
  .product-meta { font-size: .66rem; }
  .mat-dot { width: 12px; height: 12px; margin-right: -4px; }
  .product-foot { padding-top: .6rem; }
  .price { font-size: 1.02rem; }
  .price small { font-size: .52rem; }
  .go { width: 30px; height: 30px; }
  .go i { font-size: .85rem; }
  .design-badge { width: 56px; height: 56px; border-radius: 18px; font-size: 1.4rem; }
  .pager-site a, .pager-site span { min-width: 36px; height: 36px; padding: 0 .5rem; }
}
.plate.has-art { background: none !important; box-shadow: none !important; }
.plate.has-art .plate-sheen, .plate.has-art .plate-screw { display: none; }

/* Ürün sayfası arama etiketleri */
.arama-etiketleri { display: flex; flex-wrap: wrap; gap: .35rem; margin: -.4rem 0 1rem; }
.arama-etiketleri a { font-size: .74rem; padding: .22rem .6rem; border-radius: 999px; background: rgba(0,0,0,.05); color: var(--muted); text-decoration: none; }
.arama-etiketleri a:hover { background: var(--ink, #111); color: #fff; }

/* Tasarım desteği bandı (kategori / ürün) */
.btn-wa { background: #1fa855; color: #fff; border: 0; }
.btn-wa:hover, .btn-wa:focus-visible { background: #178a45; color: #fff; transform: translateY(-1px); box-shadow: 0 12px 24px -12px rgba(31,168,85,.8); }
.destek-bant { position: relative; overflow: hidden; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 1.25rem; align-items: center; margin: 0 0 1.5rem; padding: 1.4rem 1.6rem; border-radius: var(--radius); background: var(--ink); color: #fff; box-shadow: var(--shadow); }
.destek-bant::before { content: ""; position: absolute; inset: auto -60px -90px auto; width: 260px; height: 260px; border-radius: 50%; background: radial-gradient(circle, rgba(255,90,31,.45), transparent 65%); pointer-events: none; }
.destek-bant-ikon { width: 58px; height: 58px; border-radius: 18px; display: grid; place-items: center; background: var(--accent); font-size: 1.6rem; box-shadow: 0 10px 24px -10px rgba(255,90,31,.9); animation: destek-nabiz 2.4s ease-in-out infinite; }
@keyframes destek-nabiz { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.07); } }
.destek-bant-ust { display: block; font-family: var(--font-mono); font-size: .7rem; letter-spacing: .06em; text-transform: uppercase; color: var(--accent); margin-bottom: .2rem; }
.destek-bant strong { display: block; font-family: var(--font-display); font-size: clamp(1.1rem, 2.2vw, 1.45rem); line-height: 1.2; letter-spacing: -.01em; }
.destek-bant strong em { font-style: normal; color: #ffd2bf; }
.destek-bant p { margin: .35rem 0 0; color: rgba(255,255,255,.72); font-size: .9rem; max-width: 62ch; }
.destek-bant-butonlar { position: relative; display: flex; flex-direction: column; gap: .5rem; }
.destek-bant-butonlar .btn { white-space: nowrap; font-weight: 700; border-radius: 12px; }
.destek-bant.is-kisa { grid-template-columns: auto minmax(0, 1fr) auto; padding: 1.1rem 1.3rem; margin: .5rem 0; }
.destek-bant.is-kisa .destek-bant-butonlar { flex-direction: row; }
@media (max-width: 767.98px) {
  .destek-bant, .destek-bant.is-kisa { grid-template-columns: auto minmax(0, 1fr); padding: 1.1rem; gap: .9rem; }
  .destek-bant-ikon { width: 46px; height: 46px; border-radius: 14px; font-size: 1.3rem; }
  .destek-bant-butonlar, .destek-bant.is-kisa .destek-bant-butonlar { grid-column: 1 / -1; flex-direction: row; }
  .destek-bant-butonlar .btn { flex: 1; padding-inline: .5rem; font-size: .88rem; }
  .destek-bant p { display: none; }
}
@media (prefers-reduced-motion: reduce) { .destek-bant-ikon { animation: none; } }

/* Kategori SEO metni + SSS */
.kat-seo { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 2.5rem; margin-top: 3.5rem; padding-top: 2.5rem; border-top: 1px solid var(--line); }
.kat-seo-metin { color: var(--ink-2); font-size: .98rem; line-height: 1.7; max-height: 560px; overflow: auto; padding-right: .5rem; }
.kat-seo-metin h2 { font-family: var(--font-display); font-size: 1.25rem; letter-spacing: -.01em; color: var(--ink); margin: 1.4rem 0 .5rem; }
.kat-seo-metin h2:first-child { margin-top: 0; }
.kat-seo-metin ul { padding-left: 1.1rem; }
.kat-sss h2 { font-family: var(--font-display); font-size: 1.5rem; letter-spacing: -.02em; margin-bottom: 1rem; }
.kat-sss .accordion-item { border: 1px solid var(--line); border-radius: var(--radius-sm) !important; margin-bottom: .5rem; overflow: hidden; background: var(--surface); }
.kat-sss .accordion-button { font-weight: 700; font-size: .95rem; background: var(--surface); color: var(--ink); box-shadow: none; }
.kat-sss .accordion-button:not(.collapsed) { color: var(--accent); }
.kat-sss .accordion-body { color: var(--ink-2); font-size: .92rem; padding-top: 0; }
@media (max-width: 991.98px) { .kat-seo { grid-template-columns: 1fr; gap: 1.5rem; } .kat-seo-metin { max-height: none; } }

/* Etiket sayfaları */
.etiket-bagli { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; margin-bottom: 1.25rem; }
.etiket-bagli span { font-family: var(--font-mono); font-size: .72rem; color: var(--muted); text-transform: uppercase; margin-right: .2rem; }
.etiket-bagli a, .etiket-bulut a { display: inline-flex; align-items: center; gap: .35rem; padding: .38rem .8rem; border-radius: 999px; background: var(--surface); border: 1px solid var(--line); color: var(--ink); font-size: .85rem; text-decoration: none; transition: border-color .15s, background .15s; }
.etiket-bagli a:hover, .etiket-bulut a:hover { border-color: var(--ink); background: var(--ink); color: #fff; }
.etiket-bulut a small { color: var(--muted); font-size: .72rem; }
.etiket-bulut a:hover small { color: rgba(255,255,255,.7); }
.etiket-dizin { columns: 3 280px; column-gap: 2rem; }
.etiket-harf { break-inside: avoid; margin-bottom: 1.6rem; }
.etiket-harf h2 { font-family: var(--font-display); font-size: 1.6rem; color: var(--accent); margin-bottom: .5rem; }
.etiket-bulut { display: flex; flex-wrap: wrap; gap: .35rem; }

/* Ürün fotoğrafları (Mockup Stüdyosu) */
.product-visual .product-photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s cubic-bezier(.2,.7,.2,1); }
.product-card:hover .product-visual .product-photo { transform: scale(1.05); }
.urun-sahne { position: relative; }
.galeri-sahne { position: absolute; inset: 0; z-index: 4; border-radius: var(--radius); overflow: hidden; background: var(--bg-2); }
.galeri-sahne img { width: 100%; height: 100%; object-fit: cover; display: block; }
.galeri-kapat { position: absolute; left: 1rem; bottom: 1rem; border: 0; border-radius: 999px; padding: .5rem .9rem; background: rgba(17,17,17,.82); color: #fff; font-size: .84rem; font-weight: 600; backdrop-filter: blur(6px); }
.urun-galeri { display: flex; gap: .5rem; overflow-x: auto; margin-top: .75rem; padding-bottom: .25rem; scrollbar-width: thin; }
.urun-galeri button { flex: 0 0 76px; height: 76px; border-radius: 14px; border: 2px solid transparent; padding: 0; overflow: hidden; background: var(--surface); box-shadow: var(--shadow-sm); }
.urun-galeri button.is-on { border-color: var(--ink); }
.urun-galeri img { width: 100%; height: 100%; object-fit: cover; }
.ug-canli { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; gap: .15rem; font-size: 1.1rem; color: var(--accent); background: var(--accent-soft); }
.ug-canli small { font-size: .6rem; font-weight: 700; color: var(--ink); line-height: 1.1; }
.product-visual:has(.product-photo) { overflow: hidden; }

/* "Kendin tasarla" kartı — koyu zemin, dönen ışıklı kenar, canlı örnek */
@property --tk-aci { syntax: '<angle>'; initial-value: 0deg; inherits: false; }
.tasarla-kart { position: relative; isolation: isolate; background: var(--ink); color: #fff; border: 0; overflow: hidden; }
.tasarla-kart::before { content: ""; position: absolute; inset: 0; z-index: -2; border-radius: inherit; padding: 2px; background: conic-gradient(from var(--tk-aci), transparent 0 55%, var(--accent) 70%, #ffd2bf 78%, transparent 90%); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; animation: tk-don 4.5s linear infinite; }
.tasarla-kart::after { content: ""; position: absolute; inset: -40% -20% auto auto; width: 75%; aspect-ratio: 1; z-index: -1; border-radius: 50%; background: radial-gradient(circle, rgba(255,90,31,.35), transparent 65%); transition: transform .6s; }
.tasarla-kart:hover::after { transform: translate(-12%, 12%) scale(1.15); }
@keyframes tk-don { to { --tk-aci: 360deg; } }
.tasarla-kart-gorsel { background: radial-gradient(120% 90% at 50% 0%, #2a2824 0%, #111 70%) !important; }
.tasarla-kart-ornek { position: relative; width: 82%; max-width: 230px; transform: rotate(-4deg); transition: transform .5s cubic-bezier(.2,.7,.2,1); filter: drop-shadow(0 18px 24px rgba(0,0,0,.55)); }
.tasarla-kart:hover .tasarla-kart-ornek { transform: rotate(0) scale(1.06); }
.tasarla-kart-ornek .plate-l1 { position: relative; }
.tasarla-imlec { position: absolute; right: 14%; top: 34%; width: 2px; height: 22%; background: var(--accent); border-radius: 2px; animation: tk-imlec 1s steps(1) infinite; }
@keyframes tk-imlec { 50% { opacity: 0; } }
.tasarla-kart-rozet { position: absolute; left: 12px; top: 12px; z-index: 2; display: inline-flex; align-items: center; gap: .35rem; padding: .32rem .7rem; border-radius: 999px; background: var(--accent); color: #fff; font-family: var(--font-mono); font-size: .66rem; letter-spacing: .04em; text-transform: uppercase; box-shadow: 0 8px 18px -8px rgba(255,90,31,.9); }
.tasarla-kart-ozellik { position: absolute; right: 12px; bottom: 12px; padding: .25rem .6rem; border-radius: 999px; background: rgba(255,255,255,.1); backdrop-filter: blur(6px); color: rgba(255,255,255,.85); font-size: .7rem; }
.tasarla-kart .product-body { background: transparent; }
.tasarla-kart .product-type { color: #ffb08f; }
.tasarla-kart h3 { color: #fff; }
.tasarla-kart p { color: rgba(255,255,255,.65); font-size: .86rem; margin-bottom: .5rem; }
.tasarla-kart .price, .tasarla-kart .price small { color: #fff; }
.tasarla-kart .price small { opacity: .6; }
.tasarla-kart-maddeler { display: flex; flex-wrap: wrap; gap: .3rem; list-style: none; padding: 0; margin: 0 0 .8rem; }
.tasarla-kart-maddeler li { font-size: .7rem; padding: .15rem .5rem; border-radius: 999px; background: rgba(255,255,255,.08); color: rgba(255,255,255,.8); }
.tasarla-kart-cta { display: inline-flex; align-items: center; gap: .35rem; padding: .5rem .9rem; border-radius: 999px; background: var(--accent); color: #fff; font-weight: 700; font-size: .84rem; transition: gap .2s, background .2s; }
.tasarla-kart:hover .tasarla-kart-cta { gap: .6rem; background: var(--accent-hover); }
@media (max-width: 575.98px) {
  .tasarla-kart-maddeler { display: none; }
  .tasarla-kart-cta { padding: .4rem .7rem; font-size: .76rem; }
  .tasarla-kart-ozellik { display: none; }
  .tasarla-kart-rozet { font-size: .58rem; padding: .22rem .5rem; left: 8px; top: 8px; }
  .tasarla-kart-ornek { margin-top: 1.4rem; }
}
@media (prefers-reduced-motion: reduce) { .tasarla-kart::before, .tasarla-imlec { animation: none; } }

/* Yan sepet (offcanvas) */
.sepet-cekmece { --bs-offcanvas-width: min(420px, 100vw); background: var(--bg) var(--noise); }
.sepet-cekmece .offcanvas-header { border-bottom: 1px solid var(--line); padding: 1rem 1.25rem; }
.sepet-cekmece .offcanvas-title { font-family: var(--font-display); font-size: 1.25rem; font-weight: 800; display: flex; align-items: center; gap: .5rem; }
.sc-sayi { min-width: 24px; height: 24px; padding: 0 6px; border-radius: 999px; background: var(--accent); color: #fff; font-size: .75rem; display: inline-grid; place-items: center; font-family: var(--font-ui); }
.sc-sayi:empty { display: none; }
.sepet-cekmece .offcanvas-body { padding: 0; display: flex; flex-direction: column; }
.sc-kargo { padding: .8rem 1.25rem; font-size: .84rem; background: var(--surface); border-bottom: 1px solid var(--line); }
.sc-kargo.is-tamam { color: var(--success); }
.sc-kargo-bar { display: block; height: 6px; border-radius: 99px; background: var(--bg-2); overflow: hidden; margin-top: .45rem; }
.sc-kargo-bar i { display: block; height: 100%; background: linear-gradient(90deg, var(--accent), #138a4b); border-radius: 99px; transition: width .4s; }
.sc-liste { list-style: none; margin: 0; padding: .5rem 1.25rem; flex: 1; overflow-y: auto; }
.sc-kalem { position: relative; display: grid; grid-template-columns: 88px minmax(0, 1fr); gap: .8rem; padding: .8rem 0; border-bottom: 1px solid var(--line); transition: opacity .2s; }
.sc-kalem.is-bekle { opacity: .5; pointer-events: none; }
.sc-kalem.is-yeni { animation: sc-yeni 1.4s ease; }
@keyframes sc-yeni { 0% { background: var(--accent-soft); } 100% { background: transparent; } }
.sc-kalem-gorsel { --maxh: 40px; height: 64px; border-radius: 12px; display: flex; align-items: center; justify-content: center; padding: 0 6px; overflow: hidden; }
.sc-kalem-gorsel .plate-wrap { max-width: 78px; }
.sc-kalem-gorsel .mockup { width: 78px; }
.sc-kalem-bilgi { min-width: 0; display: flex; flex-direction: column; gap: .15rem; padding-right: 1.5rem; }
.sc-kalem-bilgi > b { font-size: .9rem; line-height: 1.25; }
.sc-kalem-bilgi small { color: var(--muted); font-size: .74rem; line-height: 1.3; }
.sc-kalem-alt { display: flex; align-items: center; justify-content: space-between; margin-top: .35rem; }
.sc-adet { display: inline-flex; align-items: center; border: 1px solid var(--line-2); border-radius: 999px; background: var(--surface); }
.sc-adet button { width: 30px; height: 30px; border: 0; background: transparent; border-radius: 50%; }
.sc-adet button:hover { background: var(--bg-2); }
.sc-adet span { min-width: 22px; text-align: center; font-weight: 700; font-size: .88rem; }
.sc-fiyat { font-size: .95rem; }
.sc-sil { position: absolute; top: .7rem; right: 0; width: 26px; height: 26px; border: 0; border-radius: 50%; background: transparent; color: var(--muted); }
.sc-sil:hover { background: var(--bg-2); color: #b42318; }
.sc-ozet { padding: 1rem 1.25rem 1.25rem; border-top: 1px solid var(--line); background: var(--surface); }
.sc-ozet > div { display: flex; justify-content: space-between; font-size: .9rem; padding: .2rem 0; }
.sc-ozet .is-indirim b { color: var(--success); }
.sc-ozet .sc-ipucu { font-size: .78rem; color: var(--accent); justify-content: flex-start; gap: .35rem; }
.sc-toplam { font-weight: 800; font-size: 1.1rem !important; padding: .6rem 0 .9rem !important; margin-top: .3rem; border-top: 1px dashed var(--line-2); }
.sc-toplam b { font-family: var(--font-display); font-size: 1.4rem; }
.sc-bos { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 2rem; }
.sc-bos-ikon { width: 84px; height: 84px; border-radius: 26px; background: var(--accent-soft); color: var(--accent); display: grid; place-items: center; font-size: 2rem; margin-bottom: 1rem; }
.sc-bos h3 { font-family: var(--font-display); font-size: 1.3rem; }
.sc-bos p { color: var(--muted); font-size: .9rem; }
.cart-badge.is-zipla { animation: sc-zipla .5s cubic-bezier(.3,1.6,.5,1); }
@keyframes sc-zipla { 0% { transform: scale(.4); } 100% { transform: scale(1); } }
.is-eklendi { background: var(--success) !important; }

/* ===== Mega menü stilleri ===== */
.mega-liste { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 1rem; min-height: 340px; }
.mega-liste-sol { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; border-right: 1px solid var(--line); padding-right: .75rem; }
.mega-liste-sol a { display: flex; align-items: center; gap: .65rem; padding: .62rem .75rem; border-radius: 12px; color: var(--ink); text-decoration: none; font-weight: 700; font-size: .9rem; }
.mega-liste-sol a > i:first-child { width: 22px; font-size: 1.05rem; color: var(--muted); }
.mega-liste-sol a > i:last-child { margin-left: auto; font-size: .75rem; opacity: 0; transform: translateX(-4px); transition: .2s; }
.mega-liste-sol a.is-on { background: var(--accent-soft); }
.mega-liste-sol a.is-on > i { color: var(--accent); opacity: 1; transform: none; }
.mega-panel { display: none; grid-template-columns: 240px minmax(0, 1fr); gap: 1rem; animation: mega-gir .2s ease; }
.mega-panel.is-on { display: grid; }
@keyframes mega-gir { from { opacity: 0; transform: translateY(4px); } }
.mega-panel-kapak { position: relative; min-height: 300px; border-radius: 18px; overflow: hidden; background: var(--ink) var(--kapak) center / cover; display: flex; align-items: flex-end; text-decoration: none; color: #fff; }
.mega-panel-kapak::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 30%, rgba(0,0,0,.78)); }
.mega-panel-kapak span { position: relative; padding: 1rem; display: flex; flex-direction: column; gap: .2rem; }
.mega-panel-kapak b { font-family: var(--font-display); font-size: 1.35rem; letter-spacing: -.02em; }
.mega-panel-kapak small { opacity: .8; font-size: .8rem; }
.mega-panel-kapak em { font-style: normal; font-size: .8rem; font-weight: 700; color: #ffd2bf; margin-top: .3rem; }
.mega-panel-urunler { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; align-content: start; }
.mega-urun { display: flex; align-items: center; gap: .6rem; padding: .45rem; border-radius: 12px; text-decoration: none; color: var(--ink); font-size: .84rem; font-weight: 600; line-height: 1.25; }
.mega-urun:hover { background: var(--bg); }
.mega-urun-gorsel { --maxh: 30px; flex: 0 0 72px; height: 50px; border-radius: 10px; overflow: hidden; display: flex; align-items: center; justify-content: center; padding: 0 4px; }
.mega-urun-gorsel img { width: 100%; height: 100%; object-fit: cover; }
.mega-urun-gorsel .plate-wrap { max-width: 64px; }
.mega-urun-gorsel .mockup { width: 64px; }
.mega-panel-tasarla { grid-column: 2; display: flex; flex-wrap: wrap; gap: .4rem; align-self: end; }
.mega-panel-tasarla a { font-size: .8rem; font-weight: 700; color: var(--accent); background: var(--accent-soft); border-radius: 999px; padding: .35rem .75rem; text-decoration: none; }
.mega-vitrin { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; }
.mega-vitrin-kutu { position: relative; aspect-ratio: 4 / 3; border-radius: 18px; overflow: hidden; background: var(--ink) var(--kapak) center / cover; display: flex; align-items: flex-end; text-decoration: none; color: #fff; isolation: isolate; }
.mega-vitrin-kutu::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(0,0,0,.05) 30%, rgba(0,0,0,.75)); transition: background .3s; }
.mega-vitrin-kutu:hover::before { background: linear-gradient(180deg, rgba(255,90,31,.15) 20%, rgba(0,0,0,.8)); }
.mega-vitrin-kutu > i { position: absolute; top: .8rem; left: .8rem; width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; background: rgba(255,255,255,.18); backdrop-filter: blur(6px); }
.mega-vitrin-kutu span { padding: .8rem .9rem; display: flex; flex-direction: column; }
.mega-vitrin-kutu b { font-family: var(--font-display); font-size: 1.05rem; }
.mega-vitrin-kutu small { opacity: .75; font-size: .75rem; }
.mega-vitrin-bant { grid-column: 1 / -1; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 1rem; align-items: center; padding: 1rem 1.25rem; border-radius: 18px; background: var(--ink); color: #fff; text-decoration: none; }
.mega-vitrin-bant span { color: #ffb08f; font-size: .8rem; font-family: var(--font-mono); }
.mega-vitrin-bant em { font-style: normal; background: var(--accent); padding: .45rem .9rem; border-radius: 999px; font-weight: 700; font-size: .85rem; }

/* ===== Mobil menü ===== */
.mobil-menu { --bs-offcanvas-width: min(380px, 92vw); background: var(--bg) var(--noise); }
.mobil-menu .offcanvas-header { border-bottom: 1px solid var(--line); }
.mobil-menu .brand-text { font-size: 1.35rem; }
.mobil-menu .offcanvas-body { display: flex; flex-direction: column; gap: .9rem; padding: 1rem; }
.mm-ara { position: relative; }
.mm-ara i { position: absolute; left: .95rem; top: 50%; transform: translateY(-50%); color: var(--muted); }
.mm-ara input { width: 100%; height: 48px; border-radius: 14px; border: 1px solid var(--line-2); background: var(--surface); padding: 0 1rem 0 2.6rem; font-size: 1rem; }
.mm-ara input:focus { outline: none; border-color: var(--ink); }
.mm-hizli { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; }
.mm-hizli a { display: flex; flex-direction: column; align-items: center; gap: .3rem; padding: .75rem .4rem; border-radius: 14px; background: var(--surface); border: 1px solid var(--line); color: var(--ink); text-decoration: none; font-size: .78rem; font-weight: 700; }
.mm-hizli a i { font-size: 1.25rem; }
.mm-hizli a.is-vurgu { background: var(--accent); border-color: var(--accent); color: #fff; }
.mm-baslik { font-family: var(--font-mono); font-size: .66rem; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); margin-top: .3rem; }
.mm-kategoriler, .mm-baglantilar { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .35rem; }
.mm-kategoriler a { display: flex; align-items: center; gap: .75rem; padding: .5rem .6rem; border-radius: 14px; background: var(--surface); border: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.mm-kategoriler a.is-on { border-color: var(--ink); }
.mm-kategoriler a > i { margin-left: auto; color: var(--muted); font-size: .8rem; }
.mm-kat-gorsel { flex: 0 0 46px; height: 46px; border-radius: 12px; background: var(--accent-soft) center / cover; display: grid; place-items: center; color: var(--accent); font-size: 1.2rem; }
.mm-kat-ad { min-width: 0; display: flex; flex-direction: column; }
.mm-kat-ad b { font-size: .95rem; }
.mm-kat-ad small { color: var(--muted); font-size: .74rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mm-baglantilar a { display: flex; justify-content: space-between; padding: .65rem .8rem; border-radius: 12px; background: var(--surface); color: var(--ink); font-weight: 600; text-decoration: none; }
.mm-iletisim { margin-top: auto; display: flex; flex-direction: column; gap: .35rem; padding-top: .8rem; border-top: 1px solid var(--line); font-size: .85rem; color: var(--muted); }
.mm-iletisim a { color: var(--ink); font-weight: 700; text-decoration: none; }

/* ===== Mobil alt çubuk ===== */
.mobil-alt-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 1035; display: grid; grid-template-columns: repeat(5, 1fr); align-items: end; padding: .35rem .5rem calc(.35rem + env(safe-area-inset-bottom)); background: rgba(255,255,255,.94); backdrop-filter: blur(14px); border-top: 1px solid var(--line); box-shadow: 0 -10px 30px -18px rgba(0,0,0,.35); }
.mobil-alt-bar a, .mobil-alt-bar button { display: flex; flex-direction: column; align-items: center; gap: .1rem; border: 0; background: transparent; color: var(--muted); font-size: .64rem; font-weight: 700; text-decoration: none; padding: .25rem 0; }
.mobil-alt-bar i { font-size: 1.2rem; }
.mobil-alt-bar .is-on { color: var(--ink); }
.mobil-alt-bar .is-on i { color: var(--accent); }
.mobil-alt-bar .mab-tasarla i { width: 46px; height: 46px; margin-top: -1.4rem; border-radius: 16px; display: grid; place-items: center; background: var(--accent); color: #fff; font-size: 1.3rem; box-shadow: 0 10px 20px -8px rgba(255,90,31,.8); }
.mobil-alt-bar .mab-tasarla { color: var(--accent); }
.mobil-alt-bar .cart-badge { top: -2px; right: calc(50% - 22px); }
@media (max-width: 991.98px) {
  body.has-alt-bar { padding-bottom: 68px; }
  body.has-alt-bar .wa-float { bottom: 84px; }
  body.has-alt-bar .toast-container { bottom: 64px !important; }
}

/* Mobil kategori: kısa kapak, yapışkan filtre çubuğu, alttan panel */
.mobil-filtre { position: sticky; top: 64px; z-index: 20; display: flex; align-items: center; justify-content: space-between; gap: .75rem; margin: -.25rem 0 1rem; padding: .55rem .75rem; border-radius: 14px; background: rgba(255,255,255,.92); backdrop-filter: blur(10px); border: 1px solid var(--line); box-shadow: var(--shadow-sm); }
.mobil-filtre span { font-size: .85rem; color: var(--muted); }
.mobil-filtre span b { color: var(--ink); }
.mobil-filtre .btn { border-radius: 999px; font-weight: 700; }
.mobil-filtre em { font-style: normal; color: var(--accent); }
.filtre-panel { height: auto !important; max-height: 80vh; border-radius: 22px 22px 0 0; background: var(--bg); }
.filtre-panel .offcanvas-body { padding-bottom: calc(1.5rem + env(safe-area-inset-bottom)); }
.fp-baslik { display: block; font-family: var(--font-mono); font-size: .66rem; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); margin: .6rem 0 .45rem; }
.fp-secenekler { display: flex; flex-direction: column; gap: .3rem; }
.fp-secenekler a { display: flex; justify-content: space-between; padding: .7rem .9rem; border-radius: 12px; background: var(--surface); border: 1px solid var(--line); color: var(--ink); text-decoration: none; font-weight: 600; }
.fp-secenekler a.is-on { border-color: var(--ink); }
.fp-cipler { display: flex; flex-wrap: wrap; gap: .4rem; }
.fp-cipler a { padding: .45rem .85rem; border-radius: 999px; background: var(--surface); border: 1px solid var(--line); color: var(--ink); text-decoration: none; font-size: .85rem; font-weight: 600; }
.fp-cipler a.is-on { background: var(--ink); border-color: var(--ink); color: #fff; }
@media (max-width: 767.98px) {
  .page-hero-media { aspect-ratio: auto; height: 180px; width: 100%; border-radius: 20px; }
  .page-hero-media img { width: 100%; height: 100%; object-fit: cover; }
  .filter-bar .sort-form { display: none; }
  .filter-bar .result-count { display: none; }
}

/* Footer (yeni ızgara, mobilde açılır kolonlar, popüler aramalar) */
.footer-grid { display: grid; grid-template-columns: minmax(0, 1.4fr) repeat(2, minmax(0, 1fr)) minmax(0, 1.3fr); gap: 2.5rem; }
.footer-grid h2 { font-family: var(--font-mono); font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; color: rgba(255,255,255,.45); margin: 0 0 1.1rem; font-weight: 500; }
.footer-grid ul { list-style: none; padding: 0; margin: 0; display: grid; gap: .6rem; }
.footer-grid a { text-decoration: none; color: rgba(255,255,255,.82); font-weight: 600; }
.footer-grid a:hover { color: var(--accent); }
.footer-kol summary { list-style: none; display: flex; justify-content: space-between; align-items: center; cursor: default; }
.footer-kol summary::-webkit-details-marker { display: none; }
.footer-kol summary > i { display: none; }
.footer-text { max-width: 42ch; }
.footer-etiketler { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; margin-top: 2.5rem; padding-top: 1.5rem; border-top: 1px solid rgba(255,255,255,.1); }
.footer-etiketler span { font-family: var(--font-mono); font-size: .68rem; text-transform: uppercase; letter-spacing: .05em; color: rgba(255,255,255,.4); margin-right: .4rem; }
.footer-etiketler a { padding: .3rem .7rem; border-radius: 999px; border: 1px solid rgba(255,255,255,.14); color: rgba(255,255,255,.78); font-size: .8rem; text-decoration: none; }
.footer-etiketler a:hover { border-color: var(--accent); color: #fff; background: rgba(255,90,31,.15); }
.footer-bottom-linkler { display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; }
.footer-bottom-linkler a { color: rgba(255,255,255,.65); text-decoration: none; }
.footer-bottom-linkler a:hover { color: #fff; }
@media (max-width: 991.98px) {
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 2rem 1.5rem; }
  .footer-marka, .footer-kol--iletisim { grid-column: 1 / -1; }
}
@media (max-width: 575.98px) {
  .footer-cta { top: -2.5rem; border-radius: 22px; }
  .footer-cta h3 { font-size: 1.7rem; }
  .footer-cta .btn-lg { width: 100%; justify-content: center; }
  .footer-grid { grid-template-columns: 1fr; gap: 0; }
  .footer-marka { padding-bottom: 1.25rem; }
  .footer-kol { border-top: 1px solid rgba(255,255,255,.1); padding: .9rem 0; }
  .footer-kol summary { cursor: pointer; }
  .footer-kol summary h2 { margin: 0; }
  .footer-kol summary > i { display: block; color: rgba(255,255,255,.5); transition: transform .2s; }
  .footer-kol[open] summary > i { transform: rotate(180deg); }
  .footer-kol ul { margin-top: .9rem; }
  .footer-kol--iletisim h2 { margin-bottom: .8rem; }
  .footer-word { font-size: 17vw; margin: 2rem 0 .75rem; }
  .footer-bottom { flex-direction: column; gap: .6rem; font-size: .8rem; }
}
.site-footer { overflow: visible; overflow-x: clip; }

/* Hızlı düzenle (yönetici) */
.hd-buton { position: fixed; left: 1rem; bottom: 5.5rem; z-index: 1040; display: inline-flex; align-items: center; gap: .45rem; padding: .65rem 1rem; border: 0; border-radius: 999px; background: var(--ink); color: #fff; font-weight: 700; font-size: .88rem; box-shadow: 0 14px 30px -12px rgba(0,0,0,.6); }
.hd-buton:hover { background: var(--accent); }
body.has-alt-bar .hd-buton { bottom: 152px; }
@media (min-width: 992px) { body.has-alt-bar .hd-buton { bottom: 5.5rem; } }
.hd-modal .modal-content { border-radius: 22px; border: 0; }
.hd-sekmeler { display: flex; gap: .35rem; margin-bottom: 1rem; padding: 0; list-style: none; flex-wrap: wrap; }
.hd-sekmeler button { border: 1px solid var(--line); background: var(--surface); border-radius: 999px; padding: .45rem .9rem; font-weight: 700; font-size: .85rem; }
.hd-sekmeler button.is-on { background: var(--ink); border-color: var(--ink); color: #fff; }
.hd-sekmeler em { font-style: normal; opacity: .6; }
.hd-panel { display: none; }
.hd-panel.is-on { display: block; }
.hd-alt { display: flex; justify-content: space-between; align-items: center; gap: .5rem; margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.hd-alt-baslik { font-size: .9rem; font-weight: 800; margin: 1rem 0 .5rem; }
.hd-alt-baslik small { font-weight: 500; color: var(--muted); }
.hd-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: .6rem; }
.hd-izgara label { display: flex; flex-direction: column; gap: .25rem; margin: 0; padding: .6rem; border: 1px solid var(--line); border-radius: 12px; background: var(--bg); font-size: .84rem; font-weight: 600; }
.hd-izgara label > span:first-child { display: flex; align-items: center; gap: .4rem; }
.hd-izgara .mat-swatch { width: 16px; height: 16px; border-radius: 50%; }
.hd-izgara small { color: var(--muted); font-weight: 500; font-size: .72rem; }
.hd-tablo-kap { overflow-x: auto; }
.hd-tablo { width: 100%; font-size: .82rem; border-collapse: collapse; }
.hd-tablo th, .hd-tablo td { padding: .4rem .5rem; border-bottom: 1px solid var(--line); text-align: right; white-space: nowrap; }
.hd-tablo th:first-child { text-align: left; }
.hd-gorseller { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: .6rem; }
.hd-gorsel { position: relative; aspect-ratio: 1; border-radius: 14px; overflow: hidden; border: 2px solid transparent; }
.hd-gorsel.is-ana { border-color: var(--accent); }
.hd-gorsel img { width: 100%; height: 100%; object-fit: cover; }
.hd-gorsel-arac { position: absolute; left: 0; right: 0; bottom: 0; display: flex; justify-content: space-between; padding: .3rem; background: linear-gradient(180deg, transparent, rgba(0,0,0,.6)); }
.hd-gorsel-arac button { width: 30px; height: 30px; border: 0; border-radius: 50%; background: rgba(255,255,255,.9); }
.hd-gorsel.is-ana [data-hd-g="ana"] { background: var(--accent); color: #fff; }

/* Canlı arama */
body.arama-acik { overflow: hidden; }
.arama-katman { position: fixed; inset: 0; z-index: 1060; background: rgba(17,17,17,.45); backdrop-filter: blur(6px); display: flex; justify-content: center; align-items: flex-start; padding: 6vh 1rem 1rem; }
.arama-katman[hidden] { display: none; }
.arama-katman-ic { width: min(760px, 100%); background: var(--surface); border-radius: 24px; box-shadow: 0 40px 80px -30px rgba(0,0,0,.6); overflow: hidden; animation: ca-gir .18s ease-out; }
@keyframes ca-gir { from { opacity: 0; transform: translateY(-8px) scale(.99); } }
.arama-katman-form { position: relative; display: flex; align-items: center; gap: .6rem; padding: .9rem 1rem; border-bottom: 1px solid var(--line); }
.arama-katman-form > i { font-size: 1.2rem; color: var(--muted); }
.arama-katman-form input { flex: 1; border: 0; font-size: 1.15rem; font-weight: 600; outline: none; background: transparent; min-width: 0; }
.arama-katman-form kbd { background: var(--bg-2); color: var(--muted); font-size: .7rem; }
.arama-kapat { border: 0; background: var(--bg); width: 36px; height: 36px; border-radius: 50%; }
.ca-sonuc { max-height: min(62vh, 560px); overflow-y: auto; padding: .8rem; transition: opacity .15s; }
.ca-sonuc.is-yukleniyor { opacity: .55; }
.ca-baslik { display: block; font-family: var(--font-mono); font-size: .66rem; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); margin: .2rem .2rem .5rem; }
.ca-cipler { display: flex; flex-wrap: wrap; gap: .35rem; margin-bottom: .6rem; }
.ca-cipler a { display: inline-flex; align-items: center; gap: .35rem; padding: .4rem .8rem; border-radius: 999px; background: var(--bg); border: 1px solid var(--line); color: var(--ink); text-decoration: none; font-size: .84rem; font-weight: 600; }
.ca-cipler a small { color: var(--muted); font-weight: 500; }
.ca-cipler a:hover, .ca-cipler a.is-secili { border-color: var(--ink); }
.ca-urunler { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.ca-urunler a { display: flex; align-items: center; gap: .8rem; padding: .45rem .5rem; border-radius: 14px; text-decoration: none; color: var(--ink); }
.ca-urunler a:hover, .ca-urunler a.is-secili { background: var(--bg); }
.ca-gorsel { flex: 0 0 72px; height: 52px; border-radius: 10px; overflow: hidden; display: flex; }
.ca-gorsel img { width: 100%; height: 100%; object-fit: cover; }
.ca-plaka { --maxh: 30px; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; padding: 0 4px; }
.ca-plaka .plate-wrap { max-width: 64px; }
.ca-plaka .mockup { width: 64px; }
.ca-ad { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.ca-ad b { font-size: .92rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ca-ad small { font-family: var(--font-mono); font-size: .68rem; color: var(--muted); }
.ca-fiyat { font-weight: 800; font-size: .9rem; white-space: nowrap; }
.ca-tumu { display: flex; justify-content: center; gap: .35rem; margin-top: .5rem; padding: .7rem; border-radius: 14px; background: var(--ink); color: #fff; font-weight: 700; text-decoration: none; }
.ca-tumu.is-secili, .ca-tumu:hover { background: var(--accent); color: #fff; }
.ca-oneri, .arama-oneri { padding: .65rem .9rem; border-radius: 12px; background: var(--accent-soft); color: #9a3412; font-size: .9rem; margin-bottom: .6rem; }
.ca-oneri a, .arama-oneri a { color: var(--ink); }
.arama-oneri { display: inline-block; }
.ca-yok { text-align: center; padding: 1.5rem 1rem; color: var(--muted); }
.ca-yok i { font-size: 1.8rem; display: block; margin-bottom: .4rem; }
.ca-yok a { color: var(--accent); font-weight: 700; }
.ca-yerel { position: relative; }
.ca-sonuc--acilir { position: absolute; left: 0; right: 0; top: calc(100% + 6px); z-index: 30; background: var(--surface); border: 1px solid var(--line); border-radius: 18px; box-shadow: var(--shadow); }
.ca-sonuc--mobil { padding: .4rem 0 0; max-height: none; }
.ca-sonuc--mobil:empty { display: none; }
@media (max-width: 575.98px) { .arama-katman { padding: 0; } .arama-katman-ic { border-radius: 0 0 22px 22px; } .arama-katman-form kbd { display: none; } }

/* Alt kategori şeridi (ör. Posterler → Doğa, Şehir, Minimal …) */
.alt-kat-serit { position: relative; display: flex; gap: .4rem; overflow-x: auto; padding: 1.1rem .2rem .4rem; scrollbar-width: none; -webkit-overflow-scrolling: touch; scroll-snap-type: x proximity;
  -webkit-mask-image: linear-gradient(90deg, #000 92%, transparent); mask-image: linear-gradient(90deg, #000 92%, transparent); }
.alt-kat-serit::-webkit-scrollbar { display: none; }
.alt-kat-serit a { flex: 0 0 auto; scroll-snap-align: start; display: flex; flex-direction: column; align-items: center; gap: .3rem; width: 96px; text-align: center; color: var(--ink); text-decoration: none; line-height: 1.2; }
.alt-kat-serit .ak-ad { font-size: .78rem; font-weight: 700; margin-top: .15rem; }
.alt-kat-serit small { font-family: var(--font-mono); font-size: .64rem; color: var(--muted); text-transform: uppercase; letter-spacing: .02em; }
/* Renkli, dönen halka (hikâye halkası) */
.ak-halka { position: relative; width: 74px; height: 74px; border-radius: 50%; display: grid; place-items: center; isolation: isolate; }
.ak-halka::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: 50%;
  background: conic-gradient(from 0deg, #ff5a1f, #ffb200, #ff2d87, #8a5cff, #00b7ff, #2fd18b, #ff5a1f); animation: ak-don 9s linear infinite; opacity: .55; transition: opacity .25s; }
.ak-halka::after { content: ""; position: absolute; inset: 6px; z-index: -1; border-radius: 50%; background: rgba(255, 90, 31, .35); filter: blur(10px); opacity: 0; transition: opacity .25s; }
.alt-kat-serit .ak-ikon { width: 66px; height: 66px; border-radius: 50%; display: grid; place-items: center; background: #fff center / cover no-repeat; border: 3px solid #fff; font-size: 1.45rem; color: var(--muted); transition: transform .25s cubic-bezier(.2, .7, .2, 1); }
.alt-kat-serit a:hover .ak-halka::before, .alt-kat-serit a:focus-visible .ak-halka::before { opacity: 1; animation-duration: 2.5s; }
.alt-kat-serit a:hover .ak-ikon { transform: scale(.94); }
.alt-kat-serit a.is-on .ak-halka::before { opacity: 1; animation-duration: 3s; }
.alt-kat-serit a.is-on .ak-halka::after { opacity: 1; }
.alt-kat-serit a.is-on .ak-ad { color: var(--accent); }
.alt-kat-serit a.is-on .ak-ikon { color: var(--accent); }
.alt-kat-serit a.is-bos { opacity: .45; }
.alt-kat-serit a.is-bos .ak-halka::before { background: var(--line); animation: none; }
@keyframes ak-don { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .ak-halka::before { animation: none !important; } }
@media (max-width: 575.98px) { .alt-kat-serit a { width: 78px; } .alt-kat-serit .ak-ad { font-size: .7rem; } .ak-halka { width: 62px; height: 62px; } .alt-kat-serit .ak-ikon { width: 55px; height: 55px; font-size: 1.2rem; border-width: 2.5px; } }

/* Alt kategorili kategori mega menüsü (ör. Posterler) */
.kat-mega { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); gap: 1.4rem; }
.kat-mega-ust { display: flex; align-items: baseline; gap: .7rem; margin-bottom: .8rem; }
.kat-mega-ust b { font-size: 1.15rem; } .kat-mega-ust span { color: var(--muted); font-size: .85rem; }
.kat-mega-izgara { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .4rem; }
.kat-mega-kutu { display: flex; align-items: center; gap: .65rem; padding: .5rem .55rem; border-radius: 14px; text-decoration: none; color: var(--ink); transition: background .15s; }
.kat-mega-kutu:hover { background: var(--bg); }
.kmk-ikon { flex: 0 0 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; background: var(--bg) center / cover no-repeat; color: var(--accent); font-size: 1.15rem; border: 1px solid var(--line); }
.kat-mega-kutu:hover .kmk-ikon { border-color: var(--accent); }
.kmk-ad { display: flex; flex-direction: column; line-height: 1.2; min-width: 0; }
.kmk-ad b { font-size: .86rem; font-weight: 600; } .kmk-ad small { color: var(--muted); font-size: .72rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kat-mega-sag { background: var(--bg); border-radius: 18px; padding: 1rem; display: flex; flex-direction: column; gap: .7rem; }
.kat-mega-etiket { font-size: .72rem; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); font-weight: 600; }
.kat-mega-urunler { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; }
.kat-mega-urun { aspect-ratio: .707; border-radius: 6px; overflow: hidden; display: flex; align-items: center; justify-content: center; background: #fff; box-shadow: 0 4px 12px rgba(0, 0, 0, .12); transition: transform .2s; }
.kat-mega-urun:hover { transform: translateY(-3px); }
.kat-mega-urun img { width: 100%; height: 100%; object-fit: cover; }
.kat-mega-hepsi { margin-top: auto; display: flex; align-items: center; gap: .4rem; justify-content: center; padding: .6rem; border-radius: 12px; background: var(--ink); color: #fff; text-decoration: none; font-weight: 600; font-size: .88rem; }
.kat-mega-hepsi em { font-style: normal; background: var(--accent); border-radius: 999px; padding: 0 .45rem; font-size: .75rem; }
@media (max-width: 1199.98px) { .kat-mega-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* ======================================================================
   Kişiye özel poster tasarla (poster-tasarla.php)
   ====================================================================== */
.pt-sayfa { padding: 1.5rem 0 4rem; }
.pt-bas h1 { font-size: clamp(1.8rem, 3.6vw, 2.8rem); letter-spacing: -.03em; margin: .2rem 0 .4rem; }
.pt-bas p { color: var(--muted); max-width: 760px; }
.pt-sablonlar { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .7rem; margin: 1.2rem 0 1.6rem; }
.pt-sablon { position: relative; display: flex; gap: .7rem; align-items: center; padding: .85rem 1rem; border: 1.5px solid var(--line); border-radius: 18px; background: var(--surface); color: var(--ink); text-decoration: none; transition: border-color .2s, transform .2s; }
.pt-sablon:hover { transform: translateY(-2px); border-color: var(--ink); }
.pt-sablon > i { font-size: 1.5rem; width: 46px; height: 46px; flex: 0 0 46px; display: grid; place-items: center; border-radius: 14px; background: var(--bg); color: var(--accent); }
.pt-sablon b { display: block; font-size: .98rem; } .pt-sablon small { display: block; color: var(--muted); font-size: .76rem; line-height: 1.3; }
.pt-sablon em { position: absolute; top: -9px; right: 12px; font-style: normal; font-size: .66rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; background: var(--accent); color: #fff; border-radius: 999px; padding: .1rem .5rem; }
.pt-sablon.is-on { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(255, 90, 31, .14); }
.pt-sablon.is-on > i { background: var(--accent); color: #fff; }
.pt-duzen { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 2rem; align-items: start; }
.pt-onizleme { position: sticky; top: 90px; }
.pt-duvar { border-radius: 28px; padding: 2.4rem 1.5rem; background: radial-gradient(circle at 50% 30%, #f6f3ee, #e4ded3); display: grid; place-items: center; min-height: 560px; box-shadow: inset 0 -40px 60px -40px rgba(0, 0, 0, .15); }
.pt-cerceve { position: relative; width: min(100%, 440px); aspect-ratio: 1240 / 1754; box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .45); transition: padding .25s, background .25s, width .25s; }
.pt-cerceve[data-o="21x30"] { width: min(100%, 360px); }
.pt-cerceve[data-m="poster-siyah"] { padding: 3.3% 4.6%; background: #1b1b1d; }
.pt-cerceve[data-m="poster-beyaz"] { padding: 3.3% 4.6%; background: #fbfaf7; box-shadow: 0 0 0 1px rgba(0, 0, 0, .1), 0 30px 60px -20px rgba(0, 0, 0, .4); }
.pt-cerceve[data-m="poster-ahsap"] { padding: 3.3% 4.6%; background: linear-gradient(135deg, #c99a66, #a8774a 50%, #c18f5c); }
.pt-cerceve[data-m="poster-siyah"], .pt-cerceve[data-m="poster-beyaz"], .pt-cerceve[data-m="poster-ahsap"] { aspect-ratio: auto; }
.pt-cerceve canvas { display: block; width: 100%; height: auto; }
.pt-not { color: var(--muted); font-size: .8rem; margin-top: .7rem; text-align: center; }
.pt-panel { background: var(--surface); border: 1px solid var(--line); border-radius: 24px; padding: 1.3rem; display: flex; flex-direction: column; gap: 1.1rem; }
.pt-grup h2 { font-size: 1rem; display: flex; align-items: center; gap: .5rem; margin-bottom: .7rem; }
.pt-grup h2 span { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; background: var(--ink); color: #fff; font-size: .78rem; }
.pt-grup + .pt-grup { border-top: 1px dashed var(--line); padding-top: 1.1rem; }
.pt-yukle { display: flex; align-items: center; gap: .8rem; padding: .9rem 1rem; border: 2px dashed var(--line); border-radius: 16px; cursor: pointer; transition: border-color .2s, background .2s; }
.pt-yukle:hover { border-color: var(--accent); background: rgba(255, 90, 31, .04); }
.pt-yukle input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.pt-yukle i { font-size: 1.6rem; color: var(--accent); } .pt-yukle b { display: block; } .pt-yukle small { color: var(--muted); font-size: .78rem; }
.pt-yukle.is-dolu { border-style: solid; border-color: #3aa35b; } .pt-yukle.is-dolu i::before { content: "\F26A"; color: #3aa35b; }
.pt-renkler { display: flex; flex-wrap: wrap; gap: .6rem; }
.pt-renkler label { display: flex; flex-direction: column; align-items: center; gap: .25rem; cursor: pointer; width: 62px; text-align: center; }
.pt-renkler input, .pt-secenek input, .pt-cerceveler input, .pt-stiller input { position: absolute; opacity: 0; pointer-events: none; }
.pt-renkler span { width: 42px; height: 42px; border-radius: 50%; background: var(--c); border: 2px solid var(--line); box-shadow: inset 0 0 0 3px #fff; }
.pt-renkler input:checked + span { border-color: var(--accent); box-shadow: inset 0 0 0 3px #fff, 0 0 0 3px rgba(255, 90, 31, .2); }
.pt-renkler small { font-size: .68rem; color: var(--muted); line-height: 1.15; }
.pt-secenek { display: flex; flex-wrap: wrap; gap: .4rem; }
.pt-secenek label { cursor: pointer; } .pt-secenek span { display: inline-block; padding: .45rem .85rem; border: 1.5px solid var(--line); border-radius: 999px; font-size: .86rem; font-weight: 600; }
.pt-secenek input:checked + span { border-color: var(--ink); background: var(--ink); color: #fff; }
.pt-cerceveler { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .5rem; }
.pt-cerceveler label { display: flex; flex-direction: column; align-items: center; gap: .35rem; padding: .6rem .3rem; border: 1.5px solid var(--line); border-radius: 14px; cursor: pointer; font-size: .76rem; text-align: center; line-height: 1.2; }
.pt-cerceveler .mat-swatch { width: 30px; height: 40px; border-radius: 3px; display: block; }
.pt-cerceveler label:has(input:checked) { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(255, 90, 31, .14); }
.pt-h2-not { margin-left: auto; font-size: .78rem; font-weight: 600; color: var(--accent); }
.pt-yukle { position: relative; min-width: 0; }
.pt-yukle > span { min-width: 0; }
.pt-yukle img { width: 54px; height: 54px; border-radius: 12px; object-fit: cover; flex: 0 0 54px; }
.pt-yukle:has(img:not([hidden])) > i { display: none; }
.pt-yukle-ai { position: relative; }
.pt-yukle-ai img { width: 54px; height: 54px; border-radius: 12px; object-fit: cover; flex: 0 0 54px; }
.pt-yukle-ai:has(img:not([hidden])) > i { display: none; }
.pt-yukle.is-uyari { border-color: #d9534f; animation: pt-salla .4s; }
@keyframes pt-salla { 25% { transform: translateX(-5px); } 75% { transform: translateX(5px); } }
.pt-ipuclari { list-style: none; display: flex; flex-wrap: wrap; gap: .35rem .9rem; padding: 0; margin: .55rem 0 0; font-size: .74rem; color: var(--muted); }
.pt-ipuclari .bi-check2 { color: #3aa35b; } .pt-ipuclari .bi-x { color: #d9534f; }
.pt-stil-filtre { display: flex; gap: .35rem; overflow-x: auto; scrollbar-width: none; margin-bottom: .6rem; }
.pt-stil-filtre::-webkit-scrollbar { display: none; }
.pt-stil-filtre button { flex: 0 0 auto; border: 1.5px solid var(--line); background: var(--surface); border-radius: 999px; padding: .32rem .8rem; font-size: .78rem; font-weight: 600; color: var(--ink); transition: all .2s; }
.pt-stil-filtre button small { opacity: .6; } .pt-stil-filtre button.is-on { background: var(--ink); border-color: var(--ink); color: #fff; }
.pt-stiller { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .55rem; max-height: 452px; overflow: auto; padding: .15rem .3rem .15rem .15rem; scrollbar-width: thin; }
.pt-stiller label { cursor: pointer; } .pt-stiller label[hidden] { display: none; }
.pt-stil-kart { position: relative; display: block; border-radius: 14px; overflow: hidden; background: var(--bg); box-shadow: 0 0 0 1.5px var(--line); transition: box-shadow .2s, transform .2s; }
.pt-stil-kart img, .pt-stil-bos { display: block; width: 100%; height: auto; aspect-ratio: 1 / 1.15; object-fit: cover; object-position: 50% 30%; transition: transform .4s; }
.pt-stil-bos { display: grid; place-items: center; font-size: 1.6rem; color: var(--muted); background: linear-gradient(135deg, #efe9df, #ddd4c4); }
.pt-stil-kart b { display: block; font-size: .8rem; padding: .45rem .55rem 0; line-height: 1.2; }
.pt-stil-kart small { display: block; color: var(--muted); font-size: .66rem; padding: .1rem .55rem .5rem; line-height: 1.25; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pt-stil-kart > i { position: absolute; top: .4rem; right: .4rem; width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; background: var(--accent); color: #fff; font-size: .9rem; transform: scale(0); transition: transform .2s; }
.pt-stiller label:hover .pt-stil-kart { transform: translateY(-2px); } .pt-stiller label:hover .pt-stil-kart img { transform: scale(1.05); }
.pt-stiller input:checked + .pt-stil-kart { box-shadow: 0 0 0 2.5px var(--accent), 0 10px 24px -12px rgba(255, 90, 31, .55); }
.pt-stiller input:checked + .pt-stil-kart > i { transform: scale(1); }
.pt-stiller input:focus-visible + .pt-stil-kart { outline: 2px solid var(--ink); outline-offset: 2px; }
.pt-ai-btn { position: relative; overflow: hidden; width: 100%; margin-top: .6rem; border: 0; border-radius: 14px; padding: .85rem 1rem; font-weight: 700; font-size: 1rem; color: #fff; background: linear-gradient(110deg, #ff5a1f, #e0367a 55%, #7b4dff); background-size: 200% 100%; box-shadow: 0 12px 26px -12px rgba(224, 54, 122, .7); transition: background-position .5s, transform .2s, box-shadow .2s; }
.pt-ai-btn:hover:not(:disabled) { background-position: 100% 0; transform: translateY(-1px); }
.pt-ai-btn::after { content: ""; position: absolute; inset: 0; background: linear-gradient(100deg, transparent 30%, rgba(255, 255, 255, .35) 50%, transparent 70%); transform: translateX(-100%); animation: pt-parilti 3s infinite; }
.pt-ai-btn:disabled { filter: grayscale(.8); opacity: .6; box-shadow: none; } .pt-ai-btn:disabled::after { display: none; }
@keyframes pt-parilti { 60%, 100% { transform: translateX(100%); } }
.pt-ai-bilgi { font-size: .78rem; color: var(--muted); text-align: center; margin: .45rem 0 0; } .pt-ai-bilgi i { color: #f0a500; }
.pt-ai-isler-kutu { margin-top: .7rem; } .pt-ai-isler-kutu > small { font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); }
.pt-ai-isler { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .35rem; }
.pt-ai-isler button { width: 54px; height: 76px; border: 2px solid var(--line); border-radius: 10px; padding: 0; overflow: hidden; background: var(--bg); display: grid; place-items: center; transition: border-color .2s, transform .2s; }
.pt-ai-isler button:hover { transform: translateY(-2px); }
.pt-ai-isler button img { width: 100%; height: 100%; object-fit: cover; } .pt-ai-isler button.is-on { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(255, 90, 31, .18); }
/* Düzenleme */
.pt-sifirla { margin-left: auto; border: 0; background: none; color: var(--muted); font-size: .76rem; font-weight: 600; }
.pt-sifirla:hover { color: var(--accent); }
.pt-filtreler { display: flex; gap: .35rem; overflow-x: auto; scrollbar-width: none; margin-bottom: .8rem; }
.pt-filtreler::-webkit-scrollbar { display: none; }
.pt-filtreler button { flex: 0 0 auto; border: 1.5px solid var(--line); background: var(--surface); border-radius: 10px; padding: .38rem .7rem; font-size: .78rem; font-weight: 600; color: var(--ink); }
.pt-filtreler button.is-on { border-color: var(--accent); color: var(--accent); background: rgba(255, 90, 31, .06); }
.pt-kaydiricilar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .4rem 1.1rem; }
.pt-kaydiricilar label, .pt-boyut { display: block; }
.pt-kaydiricilar label > span, .pt-boyut > span { display: flex; align-items: center; gap: .35rem; font-size: .78rem; font-weight: 600; }
.pt-kaydiricilar label > span i { color: var(--muted); }
.pt-kaydiricilar output, .pt-boyut output { margin-left: auto; font-variant-numeric: tabular-nums; color: var(--muted); font-weight: 600; font-size: .74rem; }
.pt-kaydiricilar label.is-degisti output, .pt-boyut.is-degisti output { color: var(--accent); }
.pt-grup .form-range { height: 1.2rem; accent-color: var(--accent); }
.pt-anahtar { display: flex; align-items: center; gap: .55rem; margin-top: .7rem; font-size: .86rem; font-weight: 600; cursor: pointer; }
.pt-anahtar small { font-weight: 400; color: var(--muted); font-size: .74rem; }
.pt-anahtar input { position: absolute; opacity: 0; }
.pt-anahtar span { position: relative; width: 38px; height: 22px; flex: 0 0 38px; border-radius: 999px; background: var(--line); transition: background .2s; }
.pt-anahtar span::after { content: ""; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, .3); transition: transform .2s; }
.pt-anahtar input:checked + span { background: var(--accent); } .pt-anahtar input:checked + span::after { transform: translateX(16px); }
.pt-anahtar input:focus-visible + span { outline: 2px solid var(--ink); outline-offset: 2px; }
.pt-ipucu-kucuk { font-size: .74rem; color: var(--muted); margin: .55rem 0 0; }
.pt-yazi-ayar { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 1rem; align-items: end; margin-top: .8rem; }
.pt-renkler-kucuk label { width: 52px; } .pt-renkler-kucuk span { width: 32px; height: 32px; }
/* Önizleme: örnek rozeti, sürükleme, açılış */
.pt-ornek-rozet { position: absolute; left: 50%; top: 5.5%; transform: translateX(-50%); z-index: 2; white-space: nowrap; max-width: 92%; overflow: hidden; text-overflow: ellipsis; background: rgba(20, 20, 22, .78); color: #fff; backdrop-filter: blur(6px); font-size: .72rem; font-weight: 600; border-radius: 999px; padding: .32rem .8rem; pointer-events: none; }
.pt-sayfa[data-sablon="ai"] .pt-cerceve canvas { cursor: grab; } .pt-cerceve.is-surukle canvas { cursor: grabbing; }
.pt-cerceve.is-acilis canvas { animation: pt-acilis .9s cubic-bezier(.2, .7, .2, 1); }
@keyframes pt-acilis { from { clip-path: inset(0 100% 0 0); filter: blur(8px) saturate(1.6); } to { clip-path: inset(0 0 0 0); filter: none; } }
.pt-onizleme-arac { display: flex; justify-content: center; margin-top: .5rem; }
.pt-onizleme-arac button { border: 1.5px solid var(--line); background: var(--surface); border-radius: 999px; padding: .4rem .9rem; font-size: .8rem; font-weight: 600; color: var(--ink); user-select: none; -webkit-user-select: none; touch-action: none; }
.pt-onizleme-arac button.is-on { background: var(--ink); color: #fff; border-color: var(--ink); }
/* Yükleniyor */
.pt-bekle { position: absolute; inset: 0; z-index: 3; overflow: hidden; display: grid; place-items: center; background: #15131a; color: #fff; text-align: center; transition: opacity .4s; }
.pt-bekle.is-bitti { opacity: 0; }
.pt-bekle-zemin { position: absolute; inset: -20px; background: center / cover no-repeat; filter: blur(18px) saturate(1.4); opacity: .55; transform: scale(1.1); animation: pt-nefes 6s ease-in-out infinite alternate; }
.pt-bekle::before { content: ""; position: absolute; inset: 0; z-index: 1; background: conic-gradient(from 0deg at 50% 50%, rgba(255, 90, 31, .35), rgba(224, 54, 122, .3), rgba(123, 77, 255, .35), rgba(255, 90, 31, .35)); mix-blend-mode: soft-light; animation: pt-don 8s linear infinite; }
.pt-bekle::after { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(10, 10, 14, .25), rgba(10, 10, 14, .75)); }
@keyframes pt-nefes { to { transform: scale(1.2); opacity: .75; } }
@keyframes pt-don { to { transform: rotate(360deg) scale(1.5); } }
.pt-bekle-ic { position: relative; z-index: 2; width: min(88%, 300px); display: flex; flex-direction: column; align-items: center; gap: .45rem; }
.pt-bekle-ic b { font-size: 1.15rem; letter-spacing: -.01em; }
.pt-bekle-ic small { color: rgba(255, 255, 255, .75); font-size: .8rem; min-height: 1em; }
.pt-bekle-palet { position: relative; width: 74px; height: 74px; margin-bottom: .3rem; }
.pt-bekle-palet span { position: absolute; width: 22px; height: 22px; border-radius: 50%; top: 50%; left: 50%; margin: -11px; animation: pt-yorunge 2.4s cubic-bezier(.5, 0, .5, 1) infinite; }
.pt-bekle-palet span:nth-child(1) { background: #ff5a1f; } .pt-bekle-palet span:nth-child(2) { background: #f0c330; animation-delay: -.6s; }
.pt-bekle-palet span:nth-child(3) { background: #e0367a; animation-delay: -1.2s; } .pt-bekle-palet span:nth-child(4) { background: #4d9bff; animation-delay: -1.8s; }
.pt-bekle-palet i { position: absolute; inset: 0; display: grid; place-items: center; font-size: 1.6rem; animation: pt-firca 1.2s ease-in-out infinite alternate; }
@keyframes pt-yorunge { 0% { transform: rotate(0) translateX(30px) scale(.7); } 50% { transform: rotate(180deg) translateX(30px) scale(1); } 100% { transform: rotate(360deg) translateX(30px) scale(.7); } }
@keyframes pt-firca { from { transform: rotate(-18deg) translateY(2px); } to { transform: rotate(14deg) translateY(-2px); } }
.pt-bekle-cubuk { width: 100%; height: 6px; border-radius: 999px; background: rgba(255, 255, 255, .15); overflow: hidden; margin: .3rem 0 .2rem; }
.pt-bekle-cubuk i { display: block; height: 100%; width: 0; border-radius: inherit; background: linear-gradient(90deg, #ff5a1f, #e0367a, #7b4dff); transition: width .4s linear; }
.pt-bekle-adim { list-style: none; padding: 0; margin: .2rem 0 0; display: grid; gap: .22rem; width: 100%; text-align: left; font-size: .78rem; }
.pt-bekle-adim li { display: flex; align-items: center; gap: .5rem; color: rgba(255, 255, 255, .4); transition: color .3s; }
.pt-bekle-adim li::before { content: ""; width: 14px; height: 14px; flex: 0 0 14px; border-radius: 50%; border: 1.5px solid currentColor; }
.pt-bekle-adim li.is-aktif { color: #fff; } .pt-bekle-adim li.is-aktif::before { border-color: #fff; border-right-color: transparent; animation: pt-don-k .8s linear infinite; }
.pt-bekle-adim li.is-tamam { color: rgba(255, 255, 255, .8); } .pt-bekle-adim li.is-tamam::before { border: 0; background: #3aa35b url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='white'%3E%3Cpath d='M6.5 11.2 3.3 8l1-1 2.2 2.2 5.2-5.2 1 1z'/%3E%3C/svg%3E") center / 12px no-repeat; }
@keyframes pt-don-k { to { transform: rotate(360deg); } }
.pt-bekle-ipucu { font-size: .76rem; color: rgba(255, 255, 255, .7); margin: .4rem 0 0; min-height: 2.3em; }
.pt-bekle-ic em { font-style: normal; font-size: .7rem; color: rgba(255, 255, 255, .5); font-variant-numeric: tabular-nums; }
@media (prefers-reduced-motion: reduce) { .pt-bekle *, .pt-bekle::before, .pt-ai-btn::after, .pt-cerceve.is-acilis canvas { animation: none !important; } }
.pt-sepet { display: flex; align-items: center; gap: .7rem; flex-wrap: wrap; border-top: 1px solid var(--line); padding-top: 1.1rem; }
.pt-fiyat small { display: block; color: var(--muted); font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; } .pt-fiyat b { font-size: 1.5rem; letter-spacing: -.02em; }
.pt-adet { display: flex; align-items: center; border: 1.5px solid var(--line); border-radius: 999px; overflow: hidden; }
.pt-adet button { border: 0; background: none; width: 36px; height: 42px; font-size: 1.1rem; } .pt-adet input { width: 36px; border: 0; text-align: center; font-weight: 700; background: none; }
.pt-guven { list-style: none; padding: 0; margin: 0; display: grid; gap: .3rem; font-size: .8rem; color: var(--muted); } .pt-guven i { color: #3aa35b; margin-right: .3rem; }
.pt-sepet { position: sticky; bottom: 0; z-index: 4; background: var(--surface); margin: 0 -1.3rem -1.3rem; padding: 1rem 1.3rem 1.3rem; border-radius: 0 0 24px 24px; }
/* AI alt bölüm: önce/sonra, adımlar, stil galerisi */
.pt-ai-alt { padding: 1rem 0 4.5rem; }
.pt-ai-tanitim { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(1.5rem, 4vw, 3.5rem); align-items: center; background: var(--surface); border: 1px solid var(--line); border-radius: 32px; padding: clamp(1rem, 3vw, 2.2rem); }
.pt-karsilastir { position: relative; aspect-ratio: 848 / 1197; border-radius: 22px; overflow: hidden; user-select: none; box-shadow: 0 30px 60px -30px rgba(0, 0, 0, .5); }
.pt-karsilastir img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.pt-karsilastir .pt-k-sonra { clip-path: inset(0 0 0 var(--k)); }
.pt-karsilastir input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: ew-resize; margin: 0; }
.pt-k-tutamak { position: absolute; top: 0; bottom: 0; left: var(--k); width: 3px; margin-left: -1.5px; background: #fff; pointer-events: none; box-shadow: 0 0 12px rgba(0, 0, 0, .35); }
.pt-k-tutamak i { position: absolute; top: 50%; left: 50%; width: 42px; height: 42px; margin: -21px; border-radius: 50%; background: #fff; color: var(--ink); display: grid; place-items: center; box-shadow: 0 6px 18px rgba(0, 0, 0, .3); }
.pt-k-etiket { position: absolute; top: 1rem; left: 1rem; z-index: 1; background: rgba(20, 20, 22, .7); color: #fff; font-size: .72rem; font-weight: 700; border-radius: 999px; padding: .2rem .65rem; pointer-events: none; }
.pt-k-etiket.pt-k-sag { left: auto; right: 1rem; background: var(--accent); }
.pt-etiket { display: inline-flex; align-items: center; gap: .35rem; font-size: .76rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--accent); }
.pt-ai-adimlar h2 { font-size: clamp(1.5rem, 3vw, 2.3rem); letter-spacing: -.03em; margin: .5rem 0 1.4rem; }
.pt-ai-adimlar ol { list-style: none; padding: 0; margin: 0; display: grid; gap: 1rem; counter-reset: a; }
.pt-ai-adimlar li { display: flex; gap: .9rem; align-items: flex-start; }
.pt-ai-adimlar li > i { flex: 0 0 46px; height: 46px; border-radius: 14px; display: grid; place-items: center; font-size: 1.25rem; color: var(--accent); background: rgba(255, 90, 31, .08); }
.pt-ai-adimlar b { display: block; } .pt-ai-adimlar small { color: var(--muted); font-size: .86rem; }
.pt-galeri-bas { text-align: center; margin: 3.5rem auto 1.5rem; max-width: 640px; }
.pt-galeri-bas h2 { font-size: clamp(1.5rem, 3vw, 2.2rem); letter-spacing: -.03em; } .pt-galeri-bas p { color: var(--muted); }
.pt-galeri { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 1rem; }
.pt-galeri-oge { position: relative; border: 0; padding: 0; border-radius: 18px; overflow: hidden; background: var(--bg); text-align: left; box-shadow: 0 16px 34px -22px rgba(0, 0, 0, .55); transition: transform .3s, box-shadow .3s; }
.pt-galeri-oge img { display: block; width: 100%; height: auto; aspect-ratio: 640 / 905; object-fit: cover; transition: transform .5s; }
.pt-galeri-oge span { position: absolute; left: 0; right: 0; bottom: 0; padding: 2.2rem .8rem .7rem; color: #fff; background: linear-gradient(180deg, transparent, rgba(0, 0, 0, .8)); }
.pt-galeri-oge b { display: block; font-size: .9rem; } .pt-galeri-oge small { display: block; font-size: .7rem; opacity: .8; }
.pt-galeri-oge em { position: absolute; top: .6rem; left: 50%; transform: translate(-50%, -8px); opacity: 0; white-space: nowrap; font-style: normal; font-size: .72rem; font-weight: 700; background: #fff; color: var(--ink); border-radius: 999px; padding: .3rem .7rem; transition: all .25s; }
.pt-galeri-oge:hover { transform: translateY(-4px); box-shadow: 0 24px 40px -22px rgba(0, 0, 0, .6); }
.pt-galeri-oge:hover img { transform: scale(1.06); } .pt-galeri-oge:hover em, .pt-galeri-oge:focus-visible em { opacity: 1; transform: translate(-50%, 0); }
@media (max-width: 1199.98px) { .pt-galeri { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 991.98px) {
  .pt-ai-tanitim { grid-template-columns: 1fr; } .pt-karsilastir { max-width: 420px; width: 100%; margin: 0 auto; }
  .pt-galeri { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .7rem; }
  .pt-sepet { box-shadow: 0 -12px 24px -16px rgba(0, 0, 0, .35); }
}
@media (max-width: 575.98px) {
  .pt-galeri { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pt-stiller { grid-template-columns: repeat(2, minmax(0, 1fr)); max-height: 420px; }
  .pt-kaydiricilar { grid-template-columns: 1fr; }
  .pt-yazi-ayar { grid-template-columns: 1fr; }
}
@media (max-width: 991.98px) {
  .pt-duzen { grid-template-columns: minmax(0, 1fr); } /* 1fr = minmax(auto,1fr): 1440 px tuval sütunu şişiriyordu */
  .pt-onizleme { position: static; }
  .pt-duvar { min-height: 0; padding: 1.4rem 1rem; }
  .pt-sablonlar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 575.98px) {
  .pt-sablon { padding: .65rem .7rem; } .pt-sablon > i { width: 38px; height: 38px; flex-basis: 38px; font-size: 1.2rem; } .pt-sablon small { display: none; }
  .pt-cerceveler { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pt-cerceve { width: min(100%, 300px); }
}

/* ======================================================================
   Ana sayfa (modern): hızlı geçişler, kolaj, kategori şeridi, kişiye özel posterler
   ====================================================================== */
.hero-hizli { display: flex; flex-wrap: wrap; gap: .45rem; margin: 1.1rem 0 1.4rem; }
.hero-hizli a { display: inline-flex; align-items: center; gap: .4rem; padding: .5rem .9rem; border-radius: 999px; background: var(--surface); border: 1px solid var(--line); color: var(--ink); font-weight: 600; font-size: .86rem; text-decoration: none; transition: transform .2s, border-color .2s, box-shadow .2s; }
.hero-hizli a:hover { transform: translateY(-2px); border-color: var(--ink); box-shadow: 0 8px 20px -10px rgba(0, 0, 0, .3); }
.hero-hizli a i { color: var(--accent); }
.hero-hizli a.is-yeni { background: var(--ink); color: #fff; border-color: var(--ink); }
.hero-hizli a em { font-style: normal; font-size: .64rem; text-transform: uppercase; letter-spacing: .06em; background: var(--accent); color: #fff; border-radius: 999px; padding: .05rem .45rem; }
.hero-visual { position: relative; }
.hero-kolaj { position: absolute; z-index: 3; display: block; border-radius: 4px; box-shadow: 0 0 0 6px #1b1b1d, 0 24px 50px -12px rgba(0, 0, 0, .55); transition: transform .35s; }
.hero-kolaj img { display: block; width: 150px; height: auto; border-radius: 2px; }
.hero-kolaj.hk-1 { left: -4%; bottom: 8%; transform: rotate(-6deg); }
.hero-kolaj.hk-2 { right: -2%; top: 30%; transform: rotate(5deg); box-shadow: 0 0 0 6px #c99a66, 0 24px 50px -12px rgba(0, 0, 0, .5); }
.hero-kolaj.hk-2 img { width: 124px; }
.hero-kolaj span { position: absolute; left: 50%; bottom: -16px; transform: translateX(-50%); white-space: nowrap; background: var(--accent); color: #fff; font-size: .7rem; font-weight: 700; border-radius: 999px; padding: .15rem .6rem; }
.hero-kolaj:hover { transform: rotate(0) scale(1.04); }
@media (max-width: 991.98px) { .hero-kolaj img { width: 104px; } .hero-kolaj.hk-2 img { width: 92px; } .hero-kolaj.hk-1 { left: 2%; } }
@media (max-width: 575.98px) { .hero-kolaj.hk-2 { display: none; } .hero-kolaj img { width: 84px; } .hero-hizli a { font-size: .8rem; padding: .42rem .75rem; } }

.kat-serit-ana { padding: 2.6rem 0 .6rem; }
.kat-serit-ic { display: flex; gap: 1rem; overflow-x: auto; scrollbar-width: none; padding: .3rem 0 .6rem; justify-content: space-between; }
.kat-serit-ic::-webkit-scrollbar { display: none; }
.ksa-oge { flex: 0 0 auto; width: 104px; display: flex; flex-direction: column; align-items: center; gap: .5rem; text-align: center; text-decoration: none; color: var(--ink); font-size: .8rem; font-weight: 600; line-height: 1.2; }
.ksa-gorsel { width: 84px; height: 84px; border-radius: 50%; display: grid; place-items: center; background: var(--surface) center / cover no-repeat; border: 3px solid var(--surface); box-shadow: 0 0 0 1.5px var(--line), 0 10px 22px -14px rgba(0, 0, 0, .45); font-size: 1.7rem; color: var(--accent); transition: transform .25s, box-shadow .25s; }
.ksa-oge:hover .ksa-gorsel { transform: translateY(-4px); box-shadow: 0 0 0 2px var(--accent), 0 16px 26px -14px rgba(0, 0, 0, .5); }
@media (max-width: 575.98px) { .ksa-oge { width: 78px; font-size: .72rem; } .ksa-gorsel { width: 64px; height: 64px; font-size: 1.3rem; } .kat-serit-ic { justify-content: flex-start; gap: .7rem; } }

.ozel-poster-ana { background: radial-gradient(1200px 500px at 85% -10%, rgba(255, 90, 31, .22), transparent 60%), radial-gradient(900px 500px at 0% 110%, rgba(90, 110, 255, .18), transparent 60%), #0f1014; color: #f4f1ea; }
.ozel-poster-ana .section-head p, .ozel-poster-ana .section-no { color: rgba(244, 241, 234, .7); }
.op-ana-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.2rem; }
.op-ana-kart { position: relative; display: flex; flex-direction: column; border-radius: 22px; overflow: hidden; background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 255, 255, .1); text-decoration: none; color: inherit; transition: transform .3s, border-color .3s, background .3s; }
.op-ana-kart:hover { transform: translateY(-6px); border-color: rgba(255, 90, 31, .6); background: rgba(255, 255, 255, .08); }
.op-ana-gorsel { display: grid; place-items: center; padding: 1.6rem 1.6rem 1.2rem; background: linear-gradient(180deg, rgba(255, 255, 255, .06), transparent); }
.op-ana-gorsel img { width: 78%; aspect-ratio: .707; object-fit: cover; border-radius: 3px; box-shadow: 0 0 0 7px #1b1b1d, 0 0 0 8px rgba(255, 255, 255, .12), 0 26px 40px -16px rgba(0, 0, 0, .8); transition: transform .35s; }
.op-ana-kart:hover .op-ana-gorsel img { transform: scale(1.04) rotate(-1deg); }
.op-ana-rozet { position: absolute; top: 14px; left: 14px; font-style: normal; font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; background: var(--accent); color: #fff; padding: .2rem .6rem; border-radius: 999px; }
.op-ana-govde { padding: 0 1.2rem 1.2rem; display: flex; flex-direction: column; gap: .2rem; }
.op-ana-govde i { color: var(--accent); font-size: 1.2rem; }
.op-ana-govde b { font-size: 1.15rem; } .op-ana-govde small { color: rgba(244, 241, 234, .65); font-size: .82rem; }
.op-ana-git { margin-top: .6rem; font-weight: 700; font-size: .88rem; color: #fff; }
.op-ana-kart:hover .op-ana-git i { transform: translateX(4px); } .op-ana-git i { display: inline-block; transition: transform .2s; color: #fff !important; font-size: .9rem !important; }
.op-ana-stiller { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: 1.6rem; align-items: center; }
.op-ana-stiller span { border: 1px solid rgba(255, 255, 255, .16); border-radius: 999px; padding: .3rem .75rem; font-size: .8rem; color: rgba(244, 241, 234, .85); }
.op-ana-stiller .op-ana-stil-bas { border: 0; color: #fff; font-weight: 700; padding-left: 0; } .op-ana-stil-bas i { color: var(--accent); }
@media (max-width: 991.98px) { .op-ana-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575.98px) { .op-ana-grid { gap: .7rem; } .op-ana-gorsel { padding: 1rem .8rem .8rem; } .op-ana-govde { padding: 0 .8rem .9rem; } .op-ana-govde b { font-size: .98rem; } .op-ana-govde small { display: none; } }

/* Ürün kartında poster (SEO görseli + çerçeve) */
.product-poster { display: block; width: 46%; max-width: 170px; margin: auto; box-shadow: 0 14px 28px -10px rgba(0, 0, 0, .45); transition: transform .3s; }
.product-poster img { display: block; width: 100%; height: auto; aspect-ratio: .707; object-fit: cover; }
.product-poster.is-poster-siyah { padding: 3.5%; background: #1b1b1d; }
.product-poster.is-poster-beyaz { padding: 3.5%; background: #fbfaf7; box-shadow: 0 0 0 1px rgba(0, 0, 0, .08), 0 14px 28px -10px rgba(0, 0, 0, .35); }
.product-poster.is-poster-ahsap { padding: 3.5%; background: linear-gradient(135deg, #c99a66, #a8774a 50%, #c18f5c); }
.product-card:hover .product-poster { transform: translateY(-4px) rotate(-1deg); }

/* ======================================================================
   Blog ve yerel sayfalar
   ====================================================================== */
.blog-filtre { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: 1.2rem; }
.blog-filtre a { padding: .45rem .9rem; border-radius: 999px; background: var(--surface); border: 1px solid var(--line); color: var(--ink); text-decoration: none; font-weight: 600; font-size: .85rem; }
.blog-filtre a small { color: var(--muted); } .blog-filtre a.is-on { background: var(--ink); color: #fff; border-color: var(--ink); } .blog-filtre a.is-on small { color: rgba(255,255,255,.7); }
.blog-izgara { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.3rem; }
.blog-kart { display: flex; flex-direction: column; border-radius: 20px; overflow: hidden; background: var(--surface); border: 1px solid var(--line); text-decoration: none; color: var(--ink); transition: transform .25s, box-shadow .25s; }
.blog-kart:hover { transform: translateY(-4px); box-shadow: 0 24px 40px -26px rgba(0, 0, 0, .45); }
.blog-kart-gorsel { aspect-ratio: 16 / 9; background: linear-gradient(135deg, #f1ece3, #e2dacc); display: grid; place-items: center; overflow: hidden; }
.blog-kart-gorsel img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; } .blog-kart:hover .blog-kart-gorsel img { transform: scale(1.04); }
.blog-kart-gorsel i { font-size: 2.4rem; color: var(--accent); }
.blog-kart-govde { padding: 1rem 1.1rem 1.2rem; display: flex; flex-direction: column; gap: .35rem; flex: 1; }
.blog-kart-kat { color: var(--accent); font-weight: 700; text-transform: uppercase; letter-spacing: .06em; font-size: .7rem; }
.blog-kart b { font-size: 1.05rem; line-height: 1.3; } .blog-kart-ozet { color: var(--muted); font-size: .88rem; line-height: 1.5; }
.blog-kart-alt { margin-top: auto; color: var(--muted); font-size: .76rem; padding-top: .3rem; }
.blog-izgara.has-one-cikan .blog-kart:first-child { grid-column: span 2; flex-direction: row; }
.blog-izgara.has-one-cikan .blog-kart:first-child .blog-kart-gorsel { aspect-ratio: auto; flex: 0 0 58%; }
.blog-izgara.has-one-cikan .blog-kart:first-child b { font-size: 1.45rem; }
@media (max-width: 991.98px) { .blog-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575.98px) { .blog-izgara { grid-template-columns: 1fr; } .blog-izgara.has-one-cikan .blog-kart:first-child { grid-column: auto; flex-direction: column; } .blog-izgara.has-one-cikan .blog-kart:first-child .blog-kart-gorsel { aspect-ratio: 16/9; } }

.icerik-onizleme { background: #fff4e5; border-bottom: 1px solid #f3d29b; padding: .6rem 1rem; text-align: center; font-size: .9rem; }
.icerik-bas { padding: 1.6rem 0 2rem; }
.icerik-bas-ic { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 2.2rem; align-items: center; }
.icerik-bas-ic:not(:has(.icerik-kapak)) { grid-template-columns: minmax(0, 820px); }
.icerik-kat { display: inline-flex; gap: .35rem; align-items: center; color: var(--accent); font-weight: 700; text-decoration: none; font-size: .8rem; text-transform: uppercase; letter-spacing: .06em; }
.icerik-bas h1 { font-size: clamp(1.9rem, 3.8vw, 3rem); letter-spacing: -.03em; line-height: 1.08; margin: .5rem 0 .8rem; }
.icerik-ozet { font-size: 1.1rem; color: var(--muted); line-height: 1.6; }
.icerik-meta { display: flex; flex-wrap: wrap; gap: 1rem; color: var(--muted); font-size: .85rem; } .icerik-meta i { color: var(--accent); }
.icerik-kapak { margin: 0; border-radius: 24px; overflow: hidden; box-shadow: 0 30px 60px -30px rgba(0, 0, 0, .5); } .icerik-kapak img { width: 100%; height: auto; display: block; aspect-ratio: 16 / 9; object-fit: cover; }
.icerik-duzen { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 3rem; align-items: start; }
.icerik-metin { font-size: 1.06rem; line-height: 1.8; color: #2a2b30; max-width: 760px; }
.icerik-metin h2 { font-size: 1.6rem; letter-spacing: -.02em; margin: 2.4rem 0 .9rem; line-height: 1.25; color: var(--ink); }
.icerik-metin h3 { font-size: 1.2rem; margin: 1.6rem 0 .6rem; color: var(--ink); }
.icerik-metin p { margin-bottom: 1.1rem; } .icerik-metin ul, .icerik-metin ol { margin: 0 0 1.2rem; padding-left: 1.3rem; } .icerik-metin li { margin-bottom: .4rem; }
.icerik-metin a { color: var(--accent); font-weight: 600; text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 3px; }
.icerik-metin blockquote { border-left: 4px solid var(--accent); background: var(--surface); padding: 1rem 1.3rem; border-radius: 0 14px 14px 0; font-size: 1.12rem; font-weight: 600; margin: 1.6rem 0; }
.icerik-metin table { width: 100%; border-collapse: collapse; margin: 1.2rem 0; font-size: .95rem; background: var(--surface); border-radius: 12px; overflow: hidden; }
.icerik-metin th, .icerik-metin td { border: 1px solid var(--line); padding: .6rem .8rem; text-align: left; } .icerik-metin th { background: var(--bg); }
.icerik-sss { margin-top: 2.4rem; } .icerik-sss details { border: 1px solid var(--line); border-radius: 14px; background: var(--surface); margin-bottom: .6rem; padding: .2rem 1rem; }
.icerik-sss summary { cursor: pointer; font-weight: 700; padding: .75rem 0; } .icerik-sss details p { margin: 0 0 .9rem; color: var(--muted); }
.icerik-etiketler { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; margin-top: 1.8rem; color: var(--muted); }
.icerik-etiketler a { padding: .3rem .75rem; border-radius: 999px; background: var(--surface); border: 1px solid var(--line); font-size: .82rem; color: var(--ink); text-decoration: none; font-weight: 600; }
.icerik-yan { position: sticky; top: 90px; display: flex; flex-direction: column; gap: 1rem; }
.icerik-yan-kutu { background: var(--surface); border: 1px solid var(--line); border-radius: 20px; padding: 1.1rem; }
.icerik-yan-kutu.is-koyu { background: var(--ink); color: #fff; border-color: var(--ink); } .icerik-yan-kutu.is-koyu p { color: rgba(255, 255, 255, .7); font-size: .88rem; margin: .4rem 0 .8rem; }
.icerik-yan-bas { display: block; font-size: .74rem; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); font-weight: 700; margin-bottom: .6rem; }
.icerik-mini-urun { display: flex; gap: .7rem; align-items: center; padding: .45rem; border-radius: 12px; text-decoration: none; color: var(--ink); } .icerik-mini-urun:hover { background: var(--bg); }
.imu-gorsel { flex: 0 0 56px; height: 56px; border-radius: 10px; overflow: hidden; background: var(--bg); } .imu-gorsel img { width: 100%; height: 100%; object-fit: cover; }
.icerik-mini-urun b { display: block; font-size: .84rem; line-height: 1.3; } .icerik-mini-urun small { color: var(--accent); font-weight: 700; }
.icerik-blok { margin-top: 3.4rem; } .icerik-blok > h2 { font-size: 1.6rem; letter-spacing: -.02em; margin-bottom: 1.2rem; }
.sehir-bulut { display: flex; flex-wrap: wrap; gap: .45rem; }
.sehir-bulut a { padding: .4rem .8rem; border-radius: 999px; border: 1px solid var(--line); background: var(--surface); text-decoration: none; color: var(--ink); font-size: .85rem; font-weight: 600; } .sehir-bulut a i { color: var(--accent); }
.sehir-bulut a:hover { border-color: var(--ink); }
@media (max-width: 991.98px) { .icerik-bas-ic, .icerik-duzen { grid-template-columns: 1fr; } .icerik-yan { position: static; } .icerik-kapak { order: -1; } }

/* Marka logosu (Mudi Dekor) */
.brand-logo { display: block; height: 40px; width: auto; transition: transform .3s; }
.brand:hover .brand-logo { transform: translateY(-1px); }
.brand-logo--sm { height: 32px; }
@media (max-width: 575.98px) { .site-header .brand-logo { height: 32px; } }

/* Fotoğraflı hazır ürün (dekorasyon) */
.foto-urun { width: 100%; height: 100%; display: grid; place-items: center; }
.foto-urun img { width: 100%; height: 100%; object-fit: cover; display: block; }
.price-eski { color: var(--muted); font-size: .8em; margin-right: .35rem; font-weight: 500; }

/* Fotoğraflı ürün sayfası */
.uf-galeri { display: grid; gap: .8rem; }
.uf-ana { position: relative; border-radius: 26px; overflow: hidden; background: #fff; aspect-ratio: 1; border: 1px solid var(--line); }
.uf-ana img { width: 100%; height: 100%; object-fit: cover; display: block; }
.uf-indirim { position: absolute; top: 16px; left: 16px; background: var(--accent); color: #fff; font-weight: 800; border-radius: 999px; padding: .3rem .8rem; font-size: .85rem; }
.uf-kucukler { display: flex; gap: .5rem; overflow-x: auto; }
.uf-kucukler button { flex: 0 0 84px; height: 84px; border-radius: 14px; overflow: hidden; border: 2px solid var(--line); padding: 0; background: #fff; }
.uf-kucukler button.is-on { border-color: var(--accent); } .uf-kucukler img { width: 100%; height: 100%; object-fit: cover; }
.uf-sepet { display: flex; gap: .7rem; align-items: center; flex-wrap: wrap; margin-top: 1rem; }
.uf-aciklama { background: var(--surface); border: 1px solid var(--line); border-radius: 24px; padding: 1.6rem; line-height: 1.75; max-width: 980px; }

/* ---------- Poster galeri ızgarası (yalnız posterlerden oluşan kategori / arama) ---------- */
.poster-izgara { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
@media (min-width: 576px) { .poster-izgara { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 768px) { .poster-izgara { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.5rem; } }
@media (min-width: 1200px) { .poster-izgara { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
@media (min-width: 1600px) { .poster-izgara { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 2rem; } }
.poster-izgara-tam { grid-column: 1 / -1; }
.poster-kart { position: relative; display: block; aspect-ratio: 1 / 1.414; border-radius: 3px; overflow: hidden; color: #fff; text-decoration: none; background: #eceae5;
  box-shadow: 0 4px 4px rgba(0, 0, 0, .25); transition: transform .2s ease, box-shadow .2s ease; }
.poster-kart::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; box-shadow: inset -1px -1px 1px rgba(0, 0, 0, .5), inset 1px 1.8px 1px rgba(255, 255, 255, .75); }
.poster-kart:hover, .poster-kart:focus-visible { transform: scale(1.02); box-shadow: 9px 18px 25px rgba(110, 110, 110, .75); color: #fff; }
.poster-kart-gorsel, .poster-kart-gorsel img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.poster-kart-rozet { position: absolute; top: .5rem; left: .5rem; z-index: 2; background: #1d3a8a; color: #fff; font-size: .66rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; padding: .15rem .5rem; border-radius: 3px; }
.poster-kart-bilgi { position: absolute; inset: auto 0 0; z-index: 2; display: grid; gap: .1rem; padding: 2.2rem .7rem .6rem; background: linear-gradient(transparent, rgba(0, 0, 0, .78)); font-size: .8rem; line-height: 1.3;
  opacity: 0; transform: translateY(8px); transition: opacity .2s, transform .2s; }
.poster-kart-bilgi b { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .poster-kart-bilgi span { font-weight: 800; } .poster-kart-bilgi s { opacity: .7; font-weight: 400; }
.poster-kart:hover .poster-kart-bilgi, .poster-kart:focus-visible .poster-kart-bilgi { opacity: 1; transform: none; }
@media (hover: none) { .poster-kart-bilgi { opacity: 1; transform: none; padding-top: 1.6rem; font-size: .72rem; } }
.poster-kart-ozel { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .5rem; padding: 1rem; text-align: center; color: var(--ink); background: #fff; border: 1px solid var(--line); box-shadow: none; }
.poster-kart-ozel::after { display: none; }
.poster-kart-ozel:hover { color: var(--ink); }
.poster-kart-ozel i { font-size: 2.2rem; color: var(--accent, #ff5a1f); } .poster-kart-ozel b { font-size: 1rem; } .poster-kart-ozel span { font-size: .8rem; color: var(--muted); }
.poster-kart-ozel em { font-style: normal; font-weight: 800; font-size: .78rem; letter-spacing: .04em; text-transform: uppercase; background: var(--ink); color: #fff; padding: .45rem 1.2rem; border-radius: 4px; margin-top: .3rem; }


/* ---------- Kategori üst bölümü: poster vitrini ---------- */
.page-hero--poster { padding-top: 1.5rem; background: radial-gradient(900px 380px at 85% 0%, rgba(255, 90, 31, .08), transparent 70%), radial-gradient(700px 320px at 0% 10%, rgba(138, 92, 255, .07), transparent 70%); }
.page-hero--poster h1 { background: linear-gradient(90deg, var(--ink) 55%, #5a3bd6 85%, var(--accent)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hero-istatistik { display: flex; flex-wrap: wrap; gap: .45rem; list-style: none; padding: 0; margin: 1rem 0 0; }
.hero-istatistik li { display: inline-flex; align-items: baseline; gap: .3rem; padding: .35rem .8rem; border-radius: 999px; background: #fff; border: 1px solid var(--line); font-size: .82rem; color: var(--muted); }
.hero-istatistik b { color: var(--ink); font-weight: 800; }
.hero-istatistik li:first-child { background: var(--ink); border-color: var(--ink); color: rgba(255, 255, 255, .75); } .hero-istatistik li:first-child b { color: #fff; }
.kat-kolaj { position: relative; height: 330px; }
.kat-kolaj a { position: absolute; top: 50%; left: 50%; width: 170px; aspect-ratio: 1 / 1.414; border-radius: 4px; overflow: hidden; box-shadow: 0 18px 40px -12px rgba(0, 0, 0, .45); transition: transform .35s cubic-bezier(.2, .7, .2, 1); }
.kat-kolaj img { width: 100%; height: 100%; object-fit: cover; display: block; }
.kat-kolaj-0 { transform: translate(-125%, -46%) rotate(-9deg); }
.kat-kolaj-1 { transform: translate(-50%, -56%); z-index: 2; width: 190px !important; }
.kat-kolaj-2 { transform: translate(25%, -46%) rotate(9deg); }
.kat-kolaj:hover .kat-kolaj-0 { transform: translate(-138%, -48%) rotate(-12deg); }
.kat-kolaj:hover .kat-kolaj-2 { transform: translate(38%, -48%) rotate(12deg); }
.kat-kolaj:hover .kat-kolaj-1 { transform: translate(-50%, -60%) scale(1.03); }
.tema-serit { display: flex; align-items: center; gap: .75rem; margin-top: .9rem; padding: .7rem 0 .2rem; border-top: 1px dashed var(--line); }
.tema-baslik { flex: none; font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); }
.tema-baslik i { color: var(--accent); }
.tema-cipler { display: flex; gap: .4rem; overflow-x: auto; scrollbar-width: none; padding: .15rem 0; -webkit-mask-image: linear-gradient(90deg, #000 92%, transparent); mask-image: linear-gradient(90deg, #000 92%, transparent); }
.tema-cipler::-webkit-scrollbar { display: none; }
.tema-cipler a { flex: none; display: inline-flex; align-items: center; gap: .35rem; padding: .38rem .8rem; border-radius: 999px; background: #fff; border: 1px solid var(--line); color: var(--ink); text-decoration: none; font-size: .82rem; font-weight: 600; transition: border-color .2s, transform .2s; }
.tema-cipler a small { font-family: var(--font-mono); font-size: .66rem; color: var(--muted); }
.tema-cipler a:hover { border-color: var(--ink); transform: translateY(-1px); }
.tema-cipler a.is-on { background: linear-gradient(90deg, #ff5a1f, #ff2d87); border-color: transparent; color: #fff; } .tema-cipler a.is-on small { color: rgba(255, 255, 255, .8); }
.tema-cipler a.tema-temizle { background: var(--ink); border-color: var(--ink); color: #fff; }
@media (max-width: 767.98px) { .tema-serit { flex-direction: column; align-items: stretch; gap: .4rem; } .page-hero--poster h1 { font-size: clamp(1.9rem, 8vw, 2.6rem); } }
.cat-tabs a { transition: border-color .2s, transform .2s, box-shadow .2s; }
.cat-tabs a:hover { transform: translateY(-1px); box-shadow: 0 6px 14px -8px rgba(0, 0, 0, .35); }

/* ---------- Anasayfa: mağaza vitrini ---------- */
.ana-hero { position: relative; padding: clamp(1.8rem, 4vw, 3.5rem) 0 clamp(2rem, 4vw, 3rem); overflow: hidden;
  background: radial-gradient(800px 420px at 90% 10%, rgba(255, 90, 31, .10), transparent 70%), radial-gradient(700px 380px at 5% 0%, rgba(138, 92, 255, .08), transparent 70%); }
.ana-hero-baslik { font-size: clamp(2.3rem, 5.2vw, 4.4rem); line-height: .98; letter-spacing: -.05em; font-weight: 800; margin: .6rem 0 1.1rem; }
.ana-hero-vurgu { background: linear-gradient(90deg, #ff5a1f, #ff2d87 55%, #8a5cff); -webkit-background-clip: text; background-clip: text; color: transparent; }
.ana-hero .hero-lead { margin-bottom: 1.3rem; }
.ana-hero-ara { max-width: 560px; }
.ana-hero-ara .search-box { padding: .45rem .45rem .45rem 1.2rem; box-shadow: 0 14px 34px -18px rgba(0, 0, 0, .35); }
.ana-hero-ara .search-box input { font-size: 1rem; }
.ana-guven { display: flex; flex-wrap: wrap; gap: .4rem 1.2rem; list-style: none; padding: 0; margin: .4rem 0 0; font-size: .82rem; color: var(--muted); }
.ana-guven i { color: var(--accent); margin-right: .25rem; }
.ana-mozaik { display: grid; grid-template-columns: 1.15fr 1fr; grid-template-rows: 1fr 1fr auto; gap: .9rem; min-height: 470px; }
.am-kutu { position: relative; display: block; border-radius: 22px; overflow: hidden; text-decoration: none; color: var(--ink); background: #f6f4ef; border: 1px solid var(--line); transition: transform .3s cubic-bezier(.2, .7, .2, 1), box-shadow .3s; isolation: isolate; }
.am-kutu:hover { transform: translateY(-4px); box-shadow: 0 22px 40px -22px rgba(0, 0, 0, .45); color: var(--ink); }
.am-poster { grid-row: 1 / 3; background: linear-gradient(160deg, #1b1830, #2b1b3d 55%, #3d1d2a); border: 0; }
.am-kupa { background: linear-gradient(160deg, #fff4ec, #ffe4d6); }
.am-isimlik { background: linear-gradient(160deg, #6b4a2f, #4a321f); border: 0; }
.am-kart { grid-column: 1 / 3; height: 130px; }
.am-kart img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -1; }
.am-gorsel { position: absolute; inset: 0 0 2.6rem; display: grid; place-items: center; padding: .8rem; --maxh: 120px; }
.am-isimlik .am-gorsel { --maxh: 70px; padding: 1.2rem; }
.am-etiket { position: absolute; left: .7rem; bottom: .7rem; z-index: 3; display: grid; padding: .4rem .75rem; border-radius: 12px; background: rgba(255, 255, 255, .92); backdrop-filter: blur(6px); line-height: 1.2; }
.am-etiket b { font-size: .9rem; } .am-etiket small { font-size: .7rem; color: var(--muted); }
.am-yelpaze { position: absolute; inset: 0 0 3rem; }
.am-yelpaze img { position: absolute; top: 50%; left: 50%; width: 46%; aspect-ratio: 1 / 1.414; object-fit: cover; border-radius: 3px; box-shadow: 0 18px 34px -10px rgba(0, 0, 0, .6); transition: transform .4s cubic-bezier(.2, .7, .2, 1); }
.am-yelpaze .am-y0 { z-index: 2; transform: translate(-50%, -50%); width: 52%; }
.am-yelpaze .am-y1 { transform: translate(-95%, -46%) rotate(-10deg); }
.am-yelpaze .am-y2 { transform: translate(-5%, -46%) rotate(10deg); }
.am-poster:hover .am-y1 { transform: translate(-105%, -48%) rotate(-14deg); }
.am-poster:hover .am-y2 { transform: translate(5%, -48%) rotate(14deg); }
.am-poster:hover .am-y0 { transform: translate(-50%, -53%) scale(1.03); }
.ana-kategoriler { padding: 1.4rem 0 .4rem; }
.ana-halkalar { justify-content: safe center; }
.ana-halkalar a { width: 108px; }
.ana-tema { margin: -.5rem 0 1.2rem; border-top: 0; padding-top: 0; }
@media (min-width: 768px) { .poster-izgara--ana { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 1200px) { .poster-izgara--ana { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 1.25rem; } }
.ana-isimlik .quick-try { margin-top: 1.5rem; }
@media (max-width: 991.98px) { .ana-mozaik { min-height: 0; grid-template-rows: 300px 180px auto; } .am-poster { grid-row: 1; grid-column: 1 / 3; } .am-kart { height: 110px; } }
@media (max-width: 575.98px) { .ana-mozaik { grid-template-rows: 260px 150px auto; gap: .6rem; } .am-kutu { border-radius: 16px; } .am-gorsel { --maxh: 80px; } .am-isimlik .am-gorsel { --maxh: 44px; } .ana-halkalar a { width: 82px; } }

/* ---------- Kupa galerisi (yalnız kupalardan oluşan kategori / arama): zeminsiz kupa ---------- */
.kupa-izgara { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem 1rem; }
@media (min-width: 576px) { .kupa-izgara { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 768px) { .kupa-izgara { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2rem 1.5rem; } }
@media (min-width: 1200px) { .kupa-izgara { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
@media (min-width: 1600px) { .kupa-izgara { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
.kupa-kart { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; text-decoration: none; color: var(--ink); }
.kupa-kart:hover { color: var(--ink); }
.kupa-kart-gorsel { position: relative; display: block; width: 100%; aspect-ratio: 1; overflow: hidden; }
/* Kupa fotoğrafı 3:2; kare alanda kupayı büyütüp ortalarız, altına yumuşak gölge */
.kupa-kart-gorsel .mockup { position: absolute; left: 50%; top: 50%; width: 140%; transform: translate(-51%, -47%); transition: transform .35s cubic-bezier(.2, .7, .2, 1); }
.kupa-kart-gorsel::after { content: ""; position: absolute; left: 22%; right: 22%; bottom: 11%; height: 7%; border-radius: 50%; background: radial-gradient(closest-side, rgba(0, 0, 0, .22), transparent); z-index: -1; transition: transform .35s, opacity .35s; }
.kupa-kart:hover .kupa-kart-gorsel .mockup { transform: translate(-51%, -50%) scale(1.04) rotate(-2deg); }
.kupa-kart:hover .kupa-kart-gorsel::after { transform: scaleX(.85); opacity: .7; }
.kupa-kart-rozet { position: absolute; top: .3rem; left: .3rem; background: #1d3a8a; color: #fff; font-size: .62rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; padding: .15rem .45rem; border-radius: 3px; }
.kupa-kart-ad { font-size: .86rem; font-weight: 600; line-height: 1.3; margin-top: -.4rem; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.kupa-kart-fiyat { font-size: .9rem; font-weight: 800; margin-top: .2rem; } .kupa-kart-fiyat s { color: var(--muted); font-weight: 400; } .kupa-kart-fiyat small { color: var(--muted); font-weight: 500; }
.kupa-kart-ozel .kupa-kart-gorsel { display: grid; place-items: center; border-radius: 50%; background: radial-gradient(circle, #fff4ec, #ffe4d6 60%, transparent 61%); }
.kupa-kart-ozel .kupa-kart-gorsel::after { display: none; }
.kupa-kart-ozel i { font-size: 2.4rem; color: var(--accent); transition: transform .3s; } .kupa-kart-ozel:hover i { transform: rotate(-12deg) scale(1.1); }
.kupa-kart-ozel .kupa-kart-ad { margin-top: .2rem; } .kupa-kart-ozel .kupa-kart-fiyat { font-size: .74rem; font-weight: 500; color: var(--muted); }
.scroll-item--kupa { flex-basis: 200px; }
.kupa-kart-gorsel.is-foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .35s cubic-bezier(.2, .7, .2, 1); }
.kupa-kart-gorsel.is-foto ~ .kupa-kart-ad { margin-top: .1rem; }
.kupa-kart-gorsel.is-foto::after { display: none; } /* gölge fotoğrafın içinde */
.kupa-kart:hover .kupa-kart-gorsel.is-foto img { transform: scale(1.05) translateY(-2%); }
.kupa-kart-gorsel.is-foto img { mix-blend-mode: multiply; } /* JPEG beyazı (254) sayfa beyazına karışır, kutu kenarı görünmez */

/* ---------- Kategori mega menüsü: renkli halkalı alt kategoriler + temalar ---------- */
.kmk-halka { position: relative; flex: 0 0 48px; width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center; isolation: isolate; }
.kmk-halka::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: 50%; background: conic-gradient(from 0deg, #ff5a1f, #ffb200, #ff2d87, #8a5cff, #00b7ff, #2fd18b, #ff5a1f); opacity: .5; transition: opacity .2s; }
.kat-mega-kutu .kmk-ikon { flex: none; width: 42px; height: 42px; border-radius: 50%; border: 2.5px solid #fff; background-color: #fff; }
.kat-mega-kutu:hover .kmk-halka::before { opacity: 1; animation: ak-don 2.5s linear infinite; }
.kat-mega-kutu:hover .kmk-ikon { border-color: #fff; }
.kat-mega-kutu.is-bos { opacity: .45; } .kat-mega-kutu.is-bos .kmk-halka::before { background: var(--line); }
.kat-mega-temalar { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem; margin-top: .9rem; padding-top: .8rem; border-top: 1px dashed var(--line); }
.kat-mega-temalar > span { font-size: .7rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); margin-right: .3rem; } .kat-mega-temalar > span i { color: var(--accent); }
.kat-mega-temalar a { padding: .25rem .65rem; border-radius: 999px; border: 1px solid var(--line); background: #fff; color: var(--ink); text-decoration: none; font-size: .78rem; font-weight: 600; }
.kat-mega-temalar a:hover { border-color: var(--ink); }
.kat-mega-urunler.is-kupa .kat-mega-urun { aspect-ratio: 1; box-shadow: none; } .kat-mega-urunler.is-kupa .kat-mega-urun img { mix-blend-mode: multiply; }
@media (prefers-reduced-motion: reduce) { .kat-mega-kutu:hover .kmk-halka::before { animation: none; } }

/* ---------- Kupa Tasarla (kupa-tasarla.php) ---------- */
.plate.art-sarma .plate-art { object-fit: cover; object-position: 7% 50%; } /* kupayı saran baskıda birinci yüz (merkez %25) */
.kt-sahne { position: relative; border-radius: 28px; padding: 3.2rem 1rem 1rem; background: #fff; border: 1px solid var(--line); overflow: hidden; } /* mockup fotoğrafı saf beyaz zeminli */
.kt-ornek { position: absolute; left: 50%; bottom: 3.4rem; transform: translateX(-50%); font-size: .72rem; padding: .3rem .8rem; border-radius: 999px; background: rgba(17, 17, 17, .78); color: #fff; white-space: nowrap; }
.kt-sahne canvas { display: block; width: 100%; height: auto; }
.kt-gorunum { position: absolute; top: .9rem; left: 50%; transform: translateX(-50%); display: flex; gap: .25rem; padding: .25rem; border-radius: 999px; background: rgba(255, 255, 255, .85); box-shadow: 0 4px 14px -6px rgba(0, 0, 0, .25); z-index: 2; }
.kt-gorunum button { border: 0; background: none; padding: .35rem .9rem; border-radius: 999px; font-size: .8rem; font-weight: 600; color: var(--muted); }
.kt-gorunum button.is-on { background: var(--ink); color: #fff; }
.kt-canli { position: absolute; top: 1.1rem; left: 1.1rem; font-size: .68rem; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); display: flex; align-items: center; gap: .4rem; }
.kt-canli i { width: 7px; height: 7px; border-radius: 50%; background: #2fbf71; box-shadow: 0 0 0 4px rgba(47, 191, 113, .18); }
.kt-yuzler { display: grid; grid-template-columns: 1fr 1fr; text-align: center; font-size: .8rem; font-weight: 600; margin-top: -.4rem; }
.kt-yuzler small { display: block; font-weight: 400; color: var(--muted); font-size: .72rem; }
.kt-sihirli { margin: .8rem auto 0; max-width: 520px; text-align: center; font-size: .78rem; padding: .5rem .9rem; border-radius: 999px; background: #1b1b1d; color: #f3e9d8; cursor: help; }
.kt-sihirli::after { content: ' · üzerine gelin: soğuk hali'; color: #b9ad98; }
.kt-foto-ayar { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .6rem; margin-top: .7rem; }
.kt-foto-ayar label span { display: block; font-size: .72rem; font-weight: 600; color: var(--muted); }
.kt-ikinci { margin-top: .6rem; }
.kt-kolaj-liste { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .6rem; }
.kt-kolaj-liste img { width: 54px; height: 54px; object-fit: cover; border-radius: 10px; }
.kt-bilgi { padding: 3rem 0 4rem; }
.kt-ozellikler { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
.kt-ozellikler div { background: var(--surface); border: 1px solid var(--line); border-radius: 20px; padding: 1.2rem; display: grid; gap: .25rem; }
.kt-ozellikler i { font-size: 1.5rem; color: var(--accent); }
.kt-ozellikler small { color: var(--muted); }
.kt-diger { margin-top: 2.5rem; }
.kt-diger h2 { font-size: clamp(1.3rem, 2.4vw, 1.8rem); letter-spacing: -.03em; margin-bottom: 1rem; }
.kt-diger-liste { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: .8rem; }
.kt-diger-liste a { display: grid; grid-template-columns: auto 1fr; column-gap: .7rem; align-items: center; padding: .9rem 1rem; border-radius: 16px; border: 1px solid var(--line); background: var(--surface); text-decoration: none; color: inherit; transition: border-color .2s, transform .2s; }
.kt-diger-liste a:hover { border-color: var(--ink); transform: translateY(-2px); }
.kt-diger-liste i { grid-row: span 2; font-size: 1.4rem; color: var(--accent); }
.kt-diger-liste small { color: var(--muted); font-size: .76rem; }
.kt-kardes, .kt-kategoriler { margin-top: 2.5rem; }
.kt-kardes h2, .kt-kategoriler h2 { font-size: clamp(1.3rem, 2.4vw, 1.8rem); letter-spacing: -.03em; }
.kt-kategoriler h2 { margin-bottom: 1rem; }
.kt-kat-liste { display: flex; flex-wrap: wrap; gap: .5rem; }
.kt-kat-liste a { display: inline-flex; align-items: center; gap: .45rem; padding: .55rem .95rem; border-radius: 999px; border: 1px solid var(--line); background: var(--surface); color: inherit; text-decoration: none; font-size: .9rem; font-weight: 600; transition: border-color .2s, background .2s; }
.kt-kat-liste a i { color: var(--accent); }
.kt-kat-liste a:hover, .kt-kat-liste a.is-on { border-color: var(--ink); }
.kt-kat-liste a.is-on { background: var(--ink); color: var(--surface); }
.kt-kat-liste a.is-on i { color: inherit; }
@media (max-width: 991px) {
  .kt-ozellikler { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 575px) {
  .kt-sahne { padding: 3rem .4rem .6rem; border-radius: 20px; }
  .kt-foto-ayar { grid-template-columns: 1fr; }
  .kt-ozellikler { grid-template-columns: 1fr; }
}

/* ---------- Tasarla: gruplu tür seçici ve önizleme altı ---------- */
.ts-secici { background: var(--surface); border: 1px solid var(--line); border-radius: 24px; padding: 1rem; margin-bottom: 1.5rem; }
.ts-gruplar { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; margin-bottom: .9rem; }
.ts-soru { font-weight: 700; margin-right: .5rem; font-size: .95rem; }
.ts-gruplar button { border: 1.5px solid var(--line); background: var(--bg); border-radius: 999px; padding: .45rem .95rem; font-size: .84rem; font-weight: 600; color: var(--ink-2); display: inline-flex; align-items: center; gap: .4rem; transition: all .2s; }
.ts-gruplar button:hover { border-color: var(--line-2); }
.ts-gruplar button.is-on { background: var(--ink); border-color: var(--ink); color: #fff; }
.ts-gruplar em { font-style: normal; font-size: .62rem; text-transform: uppercase; letter-spacing: .06em; background: var(--accent); color: #fff; border-radius: 999px; padding: .1rem .45rem; }
.ts-turler { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: .5rem; }
.ts-turler .type-chip { position: relative; }
.ts-ok { margin-left: auto; color: var(--accent); }
.type-chip.active .ts-ok { color: #fff; }
.ts-guven { list-style: none; padding: 0; margin: 1.4rem 0 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .6rem; }
.ts-guven li { display: flex; gap: .6rem; align-items: flex-start; background: var(--surface); border: 1px solid var(--line); border-radius: 16px; padding: .8rem; }
.ts-guven i { font-size: 1.15rem; color: var(--accent); }
.ts-guven b { display: block; font-size: .82rem; }
.ts-guven small { display: block; color: var(--muted); font-size: .72rem; line-height: 1.35; }
.ts-baslangic { margin-top: 1.4rem; }
.ts-baslangic-bas { display: flex; align-items: baseline; gap: .6rem; margin-bottom: .6rem; }
.ts-baslangic-bas small { color: var(--muted); font-size: .78rem; }
.ts-baslangic-liste { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .6rem; }
.ts-baslangic-liste a { display: block; text-decoration: none; color: inherit; border: 1.5px solid var(--line); border-radius: 16px; overflow: hidden; background: var(--surface); transition: border-color .2s, transform .2s; }
.ts-baslangic-liste a:hover { transform: translateY(-2px); border-color: var(--line-2); }
.ts-baslangic-liste a.is-on { border-color: var(--accent); }
.ts-baslangic-liste img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
.ts-baslangic-liste span { display: block; padding: .45rem .6rem; font-size: .74rem; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ts-hediye { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; margin-top: 1.4rem; }
.ts-hediye a { display: flex; gap: .7rem; align-items: center; padding: .9rem 1rem; border-radius: 18px; text-decoration: none; color: #fff; background: linear-gradient(135deg, #1b1b1d, #3a2a22); position: relative; overflow: hidden; }
.ts-hediye a:hover { color: #fff; filter: brightness(1.1); }
.ts-hediye i { font-size: 1.5rem; color: var(--accent); }
.ts-hediye b { display: block; font-size: .88rem; }
.ts-hediye small { display: block; color: rgba(255, 255, 255, .65); font-size: .72rem; }
.ts-hediye em { position: absolute; top: .55rem; right: .7rem; font-style: normal; font-size: .6rem; text-transform: uppercase; letter-spacing: .06em; background: var(--accent); border-radius: 999px; padding: .1rem .45rem; }
@media (max-width: 767px) {
  .ts-guven, .ts-hediye { grid-template-columns: 1fr; }
  .ts-baslangic-liste { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ts-soru { width: 100%; }
}

/* ---------- Ana sayfa: fotoğraftan esere vitrini (koyu kişiye özel poster bölümü içinde) ---------- */
.ana-eser { margin-top: 3rem; padding: clamp(1.2rem, 3vw, 2.2rem); border-radius: 28px; background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 255, 255, .1); display: grid; grid-template-columns: minmax(0, 340px) minmax(0, 1fr); gap: 1.2rem 2rem; }
.ana-eser-bas { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 1rem; }
.ana-eser-bas h3 { font-size: clamp(1.4rem, 2.6vw, 2rem); letter-spacing: -.03em; margin: .3rem 0 0; color: #fff; max-width: 560px; }
.ana-eser-sekme { display: flex; gap: .3rem; padding: .3rem; border-radius: 999px; background: rgba(255, 255, 255, .08); }
.ana-eser-sekme button { border: 0; background: none; color: rgba(255, 255, 255, .7); padding: .45rem 1rem; border-radius: 999px; font-weight: 600; font-size: .86rem; display: inline-flex; gap: .4rem; align-items: center; }
.ana-eser-sekme button.is-on { background: var(--accent); color: #fff; }
.ana-eser-panel { display: contents; }
.ana-eser-panel[hidden] { display: none; }
.ana-eser .pt-karsilastir { max-width: 340px; width: 100%; }
.ana-eser-govde { display: flex; flex-direction: column; gap: 1rem; min-width: 0; }
.ana-eser-govde p { color: rgba(255, 255, 255, .72); margin: 0; max-width: 560px; }
.ana-eser-stiller { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .6rem; }
.ana-eser-stiller a { position: relative; display: block; border-radius: 14px; overflow: hidden; aspect-ratio: 320 / 452; text-decoration: none; }
.ana-eser-stiller img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.ana-eser-stiller a:hover img { transform: scale(1.06); }
.ana-eser-stiller span { position: absolute; left: 0; right: 0; bottom: 0; padding: 1.4rem .55rem .5rem; font-size: .72rem; font-weight: 700; color: #fff; background: linear-gradient(transparent, rgba(0, 0, 0, .75)); }
.ana-eser-alt { display: flex; flex-wrap: wrap; align-items: center; gap: .8rem 1.2rem; margin-top: auto; }
.ana-eser-alt small { color: rgba(255, 255, 255, .55); }
@media (max-width: 767px) {
  .ana-eser { grid-template-columns: 1fr; }
  .ana-eser .pt-karsilastir { max-width: none; }
  .ana-eser-stiller { gap: .4rem; }
}

/* ===== Başlık: tek satır, öncelikli menü ("Daha"), sıkılaşan yapışkan başlık ===== */
.site-header .navbar { transition: padding .25s; }
.site-header.scrolled .navbar { padding: .5rem 0; }
.site-header .navbar > .container { flex-wrap: nowrap; gap: 1rem; }
.site-header .brand { flex: none; }
#anaMenu { flex: 1 1 auto; min-width: 0; justify-content: center; }
.navbar-nav { flex-wrap: nowrap; align-items: center; }
.navbar-nav .nav-link { white-space: nowrap; transition: background .15s; }
.navbar-nav .nav-link.active { background: rgba(17,17,17,.06); }
.navbar-nav .dropdown-toggle::after { margin-left: .3em; vertical-align: .12em; border-top-width: .28em; border-right-width: .28em; border-left-width: .28em; opacity: .55; transition: transform .2s; }
.navbar-nav .dropdown-toggle.show::after { transform: rotate(180deg); }
.nav-daha-menu { min-width: 240px; padding: .45rem; border: 1px solid var(--line); border-radius: 18px; box-shadow: 0 30px 60px -25px rgba(17,17,17,.35); margin-top: .7rem !important; }
.nav-daha-menu .dropdown-item { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .6rem .8rem; border-radius: 12px; font-weight: 700; font-size: .9rem; }
.nav-daha-menu .dropdown-item:hover { background: var(--bg); color: var(--ink); }
.nav-daha-menu small { color: var(--muted); font-weight: 500; font-size: .72rem; }
.mega-panel-tasarla a.is-tumu { background: var(--ink); color: #fff; }
@media (min-width: 992px) and (max-width: 1199.98px) {
  .navbar-nav { gap: 0; }
  .navbar-nav .nav-link { font-size: .88rem; padding: .45rem .7rem !important; }
  .site-header .brand-logo { height: 34px; }
  .btn-tasarla .btn-arrow { display: none; }
}
@media (max-width: 575.98px) {
  .site-header .navbar { padding: .55rem 0; }
  .site-header .btn-icon { width: 40px; height: 40px; font-size: 1rem; }
  .site-header .navbar > .container { gap: .5rem; }
}

/* Mobil menü: alt kategoriler açılır */
.mm-kategoriler li.has-alt { border-radius: 14px; background: var(--surface); border: 1px solid var(--line); overflow: hidden; }
.mm-kat-satir { display: flex; align-items: stretch; }
.mm-kat-satir > a { flex: 1; min-width: 0; }
.mm-kategoriler li.has-alt .mm-kat-satir > a { border: 0; border-radius: 0; background: transparent; }
.mm-ac { flex: 0 0 52px; border: 0; border-left: 1px solid var(--line); background: transparent; color: var(--ink); font-size: .95rem; }
.mm-ac i { display: inline-block; transition: transform .2s; }
.mm-ac:not(.collapsed) i { transform: rotate(180deg); }
.mm-ac:not(.collapsed) { color: var(--accent); }
.mm-alt-ic { display: flex; flex-wrap: wrap; gap: .4rem; padding: .25rem .6rem .8rem; }
.mm-alt-ic a { display: inline-flex; align-items: center; gap: .35rem; font-size: .8rem; font-weight: 600; padding: .42rem .75rem; border-radius: 999px; background: var(--bg); border: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.mm-alt-ic a i { color: var(--accent); font-size: .85rem; }
.mm-alt-ic a.is-on, .mm-alt-ic a.is-tumu { background: var(--ink); border-color: var(--ink); color: #fff; }
.mm-alt-ic a.is-on i { color: inherit; }

/* Eğik şerit (ticker) gibi taşan süslemeler yatay kaydırma çubuğu açmasın; clip yapışkan öğeleri bozmaz */
main#icerik { overflow-x: clip; }

/* ===== Mega menü v2: ekran yüksekliğine sığan kabuk, kart ızgarası, karartılmış arka plan, responsive ===== */
@media (min-width: 992px) {
  .mega-menu { width: min(1200px, calc(100vw - 32px)); padding: 0; overflow: hidden; border-radius: 26px; margin-top: .55rem !important;
    max-height: calc(100vh - var(--hdr-alt, 120px) - 16px); display: none; flex-direction: column; box-shadow: 0 50px 100px -40px rgba(17,17,17,.45), 0 0 0 1px rgba(17,17,17,.04); }
  .mega-menu.show { display: flex; animation: mega-ac .22s cubic-bezier(.2,.8,.2,1); }
  .mega-menu > .mega-liste, .mega-menu > .kat-mega, .mega-menu > .mega-vitrin, .mega-menu > .mega-grid { flex: 1 1 auto; min-height: 0; overflow: auto; overscroll-behavior: contain; padding: 1.25rem; scrollbar-width: thin; }
  .mega-menu > .mega-foot { flex: none; }
}
@keyframes mega-ac { from { opacity: 0; transform: translate(-50%, 8px); } to { opacity: 1; transform: translate(-50%, 0); } }
body.mega-acik::after { content: ""; position: fixed; inset: 0; z-index: 1025; background: rgba(17,17,17,.28); backdrop-filter: blur(2px); -webkit-backdrop-filter: blur(2px); animation: perde .2s ease; pointer-events: none; }
@keyframes perde { from { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .mega-menu.show, body.mega-acik::after { animation: none; } }

/* Ortak başlık satırı */
.mp-ust, .kat-mega-ust { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.mp-baslik { display: flex; flex-direction: column; min-width: 0; }
.mp-baslik b { font-family: var(--font-display); font-size: 1.35rem; letter-spacing: -.03em; line-height: 1.1; }
.mp-baslik span { color: var(--muted); font-size: .84rem; margin-top: .15rem; }
.mp-hepsi { flex: none; display: inline-flex; align-items: center; gap: .45rem; padding: .5rem .9rem; border-radius: 999px; background: var(--ink); color: #fff; text-decoration: none; font-weight: 700; font-size: .84rem; transition: background .15s, transform .15s; }
.mp-hepsi:hover { background: var(--accent); color: #fff; transform: translateX(2px); }
.mp-hepsi em { font-style: normal; font-size: .72rem; background: rgba(255,255,255,.18); border-radius: 999px; padding: .05rem .45rem; }

/* Ürünler (liste) */
.mega-liste { grid-template-columns: 250px minmax(0, 1fr); gap: 1.25rem; min-height: 0; }
.mega-liste-sol { gap: 3px; padding-right: 1rem; }
.mega-liste-sol a { padding: .45rem .55rem; gap: .7rem; border-radius: 14px; transition: background .15s; }
.mega-liste-sol a:hover { background: var(--bg); }
.mls-ikon { flex: 0 0 36px; height: 36px; border-radius: 11px; display: grid; place-items: center; background: var(--bg); border: 1px solid var(--line); color: var(--muted); font-size: 1rem; transition: background .15s, color .15s, border-color .15s; }
.mls-ad { display: flex; flex-direction: column; min-width: 0; line-height: 1.15; }
.mls-ad b { font-size: .88rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mls-ad small { font-size: .7rem; color: var(--muted); font-weight: 500; }
.mega-liste-sol a > .bi-chevron-right { margin-left: auto; font-size: .72rem; opacity: 0; transform: translateX(-4px); transition: .2s; }
.mega-liste-sol a.is-on { background: var(--accent-soft); }
.mega-liste-sol a.is-on .mls-ikon { background: var(--accent); border-color: var(--accent); color: #fff; }
.mega-liste-sol a.is-on > .bi-chevron-right { opacity: 1; transform: none; color: var(--accent); }
.mega-panel { grid-template-columns: none; display: none; flex-direction: column; gap: 0; min-width: 0; }
.mega-panel.is-on { display: flex; }
.mp-govde { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 1rem; }
.mega-panel-kapak { min-height: 0; height: 100%; border-radius: 20px; }
.mega-panel-kapak span { padding: 1rem 1.1rem; }
.mega-panel-kapak small { font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; opacity: .85; }
.mega-panel-kapak b { font-size: 1.3rem; line-height: 1.1; }
.mega-panel-kapak em { display: inline-flex; align-items: center; gap: .3rem; margin-top: .5rem; align-self: flex-start; padding: .35rem .75rem; border-radius: 999px; background: rgba(255,255,255,.16); backdrop-filter: blur(6px); color: #fff; transition: background .2s; }
.mega-panel-kapak:hover em { background: var(--accent); }
.mega-panel-kapak { transition: transform .3s; } .mega-panel-kapak:hover { transform: scale(1.01); }
.mega-panel-urunler { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; }
.mega-urun { flex-direction: column; align-items: stretch; gap: .45rem; padding: 0; background: none; font-size: .8rem; }
.mega-urun:hover { background: none; }
.mega-urun-gorsel { position: relative; flex: none; width: 100%; height: auto; aspect-ratio: 4 / 3; border-radius: 14px; padding: 8%; border: 1px solid var(--line); transition: transform .2s, box-shadow .2s, border-color .2s; }
.mega-urun-gorsel img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.mega-urun-gorsel .plate-wrap { max-width: 100%; width: 100%; }
.mega-urun-gorsel .mockup { width: 100%; }
.mega-urun-gorsel > em { position: absolute; top: 6px; left: 6px; z-index: 1; font-style: normal; font-size: .6rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; background: var(--ink); color: #fff; border-radius: 999px; padding: .15rem .45rem; }
.mega-urun:hover .mega-urun-gorsel { transform: translateY(-3px); box-shadow: 0 14px 28px -16px rgba(17,17,17,.45); border-color: transparent; }
.mu-ad { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.25; font-weight: 600; padding: 0 .1rem; }
.mega-urun:hover .mu-ad { color: var(--accent); }
.mega-panel-tasarla { grid-column: auto; align-self: auto; margin-top: 1rem; padding-top: .9rem; border-top: 1px dashed var(--line); gap: .4rem; }
.mega-panel-tasarla a { display: inline-flex; align-items: center; gap: .35rem; background: var(--surface); border: 1px solid var(--line); color: var(--ink); padding: .38rem .8rem; transition: border-color .15s, background .15s; }
.mega-panel-tasarla a i { color: var(--accent); }
.mega-panel-tasarla a:hover { border-color: var(--ink); }
.mega-panel-tasarla a.is-tasarla { background: var(--accent-soft); border-color: transparent; color: var(--accent); }
.mega-panel-tasarla a.is-tumu { background: var(--ink); border-color: var(--ink); color: #fff; } .mega-panel-tasarla a.is-tumu i { color: inherit; }

/* Alt bilgi şeridi */
.mega-foot { margin: 0; padding: .75rem 1.25rem; border-top: 1px solid var(--line); background: var(--bg); gap: 1rem; }
.mega-foot-guven { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem 1.25rem; font-size: .78rem; color: var(--muted); font-weight: 600; }
.mega-foot-guven li { display: flex; align-items: center; gap: .35rem; } .mega-foot-guven i { color: var(--accent); }
.mega-foot-cta { display: flex; align-items: center; gap: .5rem; }
.mega-foot-cta a { display: inline-flex; align-items: center; gap: .35rem; padding: .45rem .85rem; border-radius: 999px; font-size: .84rem; }
.mega-foot-cta a.is-tasarla { background: var(--accent); color: #fff; }
.mega-foot-cta a.is-tasarla:hover { background: var(--ink); color: #fff; }

/* Alt kategorili kategori megası (Poster, Kupa, Dekorasyon) */
.kat-mega { grid-template-columns: minmax(0, 1fr) 340px; gap: 1.25rem; }
.kat-mega-sol { min-width: 0; display: flex; flex-direction: column; }
.kat-mega-izgara { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: .3rem; align-content: start; }
.kat-mega-izgara.is-cok { max-height: min(400px, calc(100vh - var(--hdr-alt, 120px) - 230px)); overflow: auto; padding-right: .35rem; scrollbar-width: thin;
  -webkit-mask-image: linear-gradient(180deg, #000 calc(100% - 28px), transparent); mask-image: linear-gradient(180deg, #000 calc(100% - 28px), transparent); padding-bottom: 1.25rem; }
.kat-mega-kutu { padding: .4rem .5rem; gap: .6rem; }
.kat-mega-kutu .kmk-halka { flex: 0 0 42px; width: 42px; height: 42px; }
.kat-mega-kutu .kmk-ikon { width: 36px; height: 36px; border-width: 2px; }
.kmk-ad b { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.2; }
.kat-mega-sag { border-radius: 20px; padding: 1rem; }
.kat-mega-etiket { display: flex; align-items: center; gap: .4rem; }
.kat-mega-etiket::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 4px rgba(255,90,31,.15); }
.kat-mega-urunler { gap: .6rem; }
.kat-mega-urun { border-radius: 12px; }
.kat-mega-hepsi { border-radius: 999px; transition: background .15s; }
.kat-mega-hepsi:hover { background: var(--accent); color: #fff; }

/* Dar masaüstü (992–1199): kapak gizli, ızgaralar sıkılaşır */
@media (min-width: 992px) and (max-width: 1199.98px) {
  .mega-liste { grid-template-columns: 220px minmax(0, 1fr); gap: 1rem; }
  .mls-ad b { white-space: normal; line-height: 1.15; }
  .mls-ad small { display: none; }
  .mls-ikon { flex-basis: 32px; height: 32px; }
  .mp-govde { grid-template-columns: minmax(0, 1fr); }
  .mega-panel-kapak { display: none; }
  .mega-panel-urunler { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .6rem; }
  .kat-mega { grid-template-columns: minmax(0, 1fr) 270px; gap: 1rem; }
  .kat-mega-izgara { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); }
  .kat-mega-urunler { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kat-mega-urunler .kat-mega-urun:nth-child(n+5) { display: none; }
  .mp-baslik span { display: none; }
}
/* Kısa ekranlar (laptop): ürün ızgarası tek satır */
@media (min-width: 992px) and (max-height: 700px) {
  .mega-panel-urunler .mega-urun:nth-child(n+5) { display: none; }
}
/* Kupa tasarla (telefon): görünüm düğmeleri sağa, "canlı önizleme" solda; düğmeler tek satır */
@media (max-width: 575.98px) {
  .kt-gorunum { left: auto; right: .6rem; top: .6rem; transform: none; }
  .kt-gorunum button { padding: .3rem .65rem; font-size: .74rem; white-space: nowrap; display: inline-flex; align-items: center; gap: .25rem; }
  .kt-canli { top: 1rem; left: .8rem; font-size: .6rem; }
}
/* Telefonda yapışkan "Sepete ekle" şeridi alttaki mobil menü çubuğunun üstünde dursun (arkasında kalıyordu) */
@media (max-width: 991.98px) {
  body.has-alt-bar .pt-sepet { bottom: calc(64px + env(safe-area-inset-bottom)); }
  body.has-alt-bar:has(.pt-sepet) .wa-float { bottom: 232px; width: 48px; height: 48px; }
}

/* Telefonda g-5 satır boşluğu konteyner kenar boşluğunu aşıyordu (12 px yatay taşma) */
@media (max-width: 575.98px) { .row.g-5, .row.gx-5 { --bs-gutter-x: 1.5rem; } }
/* Ana sayfa mozaik: kupa ve isimlik kutularında ortam fotoğrafı (mockup) */
.am-kutu > .am-foto { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -1; transition: transform .6s cubic-bezier(.2, .7, .2, 1); }
.am-kutu:hover > .am-foto { transform: scale(1.05); }
.am-kupa > .am-foto { object-position: 50% 78%; }
.am-kupa .am-etiket { top: .7rem; bottom: auto; } /* kupa fotoğrafın alt yarısında; etiket üstte */
.am-isimlik > .am-foto { object-position: 45% 50%; }
.am-kupa, .am-isimlik { background: #e9e4dc; }
@media (max-width: 991.98px) { .am-isimlik > .am-foto { object-position: 45% 72%; } }
.am-kart > .am-foto { object-position: 50% 58%; }
.am-poster { background: #e9e4dc; }
.am-poster > .am-foto { object-position: 50% 30%; }

/* ======================================================================
   Poster ürün sayfası (urun-poster.php)
   ====================================================================== */
.pd-poster .galeri-sahne { background: linear-gradient(160deg, #ece7de, #d9d2c5); }
.pd-poster .galeri-sahne img { object-fit: contain; padding: clamp(1rem, 4vw, 2.5rem); filter: drop-shadow(0 18px 24px rgba(0,0,0,.22)); }
.pd-galeri button { flex-basis: 64px; height: 88px; }
.pd-galeri .ug-canli small { font-size: .62rem; font-weight: 700; }
.pd-info h1 { font-size: clamp(1.7rem, 2.8vw, 2.4rem); line-height: 1.08; letter-spacing: -.035em; }
.pd-rozetler { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; margin-bottom: .6rem; }
.pd-rozet { display: inline-flex; align-items: center; gap: .35rem; font-size: .78rem; font-weight: 700; padding: .3rem .7rem; border-radius: 999px; background: var(--ink); color: #fff; text-decoration: none; }
.pd-rozet:hover { background: var(--accent); color: #fff; }
.pd-rozet.is-acik { background: var(--bg); color: var(--ink); border: 1px solid var(--line); }
.pd-info .panel-block .material-opt { min-height: 64px; }
.pd-teslim { display: flex; gap: .85rem; align-items: center; margin-top: 1rem; padding: .85rem 1rem; border-radius: var(--radius-sm); background: #eef7f1; color: #0f5132; }
.pd-teslim > i { font-size: 1.5rem; color: var(--success); }
.pd-teslim strong { display: block; font-size: .92rem; }
.pd-teslim small { color: #3d6b52; font-size: .8rem; }
.pd-guven { list-style: none; padding: 0; margin: 1rem 0 .75rem; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
.pd-guven li { display: flex; gap: .6rem; align-items: flex-start; padding: .7rem .75rem; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface); }
.pd-guven i { font-size: 1.15rem; color: var(--accent); line-height: 1.2; }
.pd-guven span { font-size: .76rem; color: var(--muted); line-height: 1.3; }
.pd-guven b { display: block; font-size: .84rem; color: var(--ink); }

/* Gerçek ölçek sahnesi: oda genişliği 220 cm, yüksekliği 165 cm; konsol 140 × 75 cm, poster konsolun 25 cm üstünde */
.pd-olcek { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr); gap: clamp(1.5rem, 4vw, 3.5rem); align-items: center; margin-top: 4rem; padding: clamp(1.25rem, 3vw, 2.5rem); border-radius: 30px; background: var(--bg); }
.pd-olcek h2 { font-size: clamp(1.5rem, 2.4vw, 2rem); letter-spacing: -.03em; font-weight: 800; }
.pd-olcek p { color: var(--muted); }
.pd-olcek-secim { display: inline-flex; gap: .3rem; padding: .3rem; border-radius: 999px; background: var(--surface); border: 1px solid var(--line); }
.pd-olcek-secim button { border: 0; background: transparent; border-radius: 999px; padding: .45rem 1rem; font-size: .82rem; font-weight: 700; color: var(--muted); }
.pd-olcek-secim button.is-on { background: var(--ink); color: #fff; }
.pd-oda { position: relative; aspect-ratio: 4 / 3; border-radius: 22px; overflow: hidden; background: radial-gradient(ellipse at 30% 20%, rgba(255,255,255,.55), transparent 55%), linear-gradient(180deg, #e9e3d8, #d8cfc0); box-shadow: inset 0 -2px 0 rgba(0,0,0,.05); }
.pd-oda::before { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3%; background: #b9a68b; }
.pd-oda-poster { position: absolute; left: 50%; bottom: 60.6%; width: calc(var(--pe) * 100% / 220); aspect-ratio: var(--pe) / var(--pb); transform: translateX(-50%); background: #fff; box-shadow: 0 6px 14px rgba(0,0,0,.25); transition: width .35s ease, aspect-ratio .35s ease; }
.pd-oda-poster img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pd-oda-poster.cer-poster-siyah { border: max(3px, calc(1.6 * 100cqw / 220)) solid #1b1b1b; padding: 0; }
.pd-oda-poster.cer-poster-beyaz { border: max(3px, calc(1.6 * 100cqw / 220)) solid #fbfaf7; }
.pd-oda { container-type: inline-size; }
.pd-oda-konsol { position: absolute; left: 50%; bottom: 3%; width: 63.6%; height: 42.5%; transform: translateX(-50%); }
.pd-oda-konsol::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 9%; border-radius: 3px; background: linear-gradient(180deg, #a7825c, #8a6744); box-shadow: 0 6px 10px rgba(0,0,0,.18); }
.pd-oda-konsol::after { content: ""; position: absolute; left: 3%; right: 3%; top: 9%; height: 52%; background: linear-gradient(180deg, #9b7752, #84633f); border-radius: 0 0 3px 3px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.06); background-image: linear-gradient(90deg, transparent 49.6%, rgba(0,0,0,.18) 49.6%, rgba(0,0,0,.18) 50.4%, transparent 50.4%), linear-gradient(180deg, #9b7752, #84633f); }
.pd-oda-konsol span::before, .pd-oda-konsol span::after { content: ""; position: absolute; bottom: 0; width: 2.2%; height: 40%; background: #6e5235; }
.pd-oda-konsol span::before { left: 6%; }
.pd-oda-konsol span::after { right: 6%; }
.pd-oda-vazo { position: absolute; bottom: 45.5%; left: 68%; width: 5%; height: 16%; border-radius: 40% 40% 30% 30% / 25% 25% 20% 20%; background: linear-gradient(90deg, #cfc6b6, #f2eee6 45%, #bdb3a1); }
.pd-oda-vazo::before { content: ""; position: absolute; left: 30%; bottom: 90%; width: 160%; height: 90%; transform: translateX(-30%); background: radial-gradient(ellipse at 30% 70%, #7f8c62 0 18%, transparent 19%), radial-gradient(ellipse at 60% 40%, #8e9a6e 0 16%, transparent 17%), radial-gradient(ellipse at 45% 15%, #6f7c55 0 14%, transparent 15%); }
.pd-oda-not { position: absolute; top: .75rem; left: .75rem; font-family: var(--font-mono); font-size: .7rem; padding: .25rem .6rem; border-radius: 999px; background: rgba(255,255,255,.8); }

/* Açıklama + teknik */
.pd-detay { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 3.5rem); margin-top: 4rem; }
.pd-aciklama h2 { font-size: clamp(1.5rem, 2.4vw, 2rem); letter-spacing: -.03em; font-weight: 800; margin-bottom: 1rem; }
.pd-aciklama h3 { font-size: 1.05rem; font-weight: 800; margin: 1.5rem 0 .5rem; }
.pd-aciklama p { color: #3f3c35; line-height: 1.7; }
.pd-aciklama a { color: var(--accent); }
.pd-aciklama .arama-etiketleri { margin: 1.5rem 0 0; }
.pd-teknik { align-self: start; padding: 1.5rem; border-radius: 24px; border: 1px solid var(--line); background: var(--surface); box-shadow: var(--shadow-sm); position: sticky; top: 110px; }
.pd-teknik dl { display: grid; grid-template-columns: auto 1fr; gap: .55rem 1rem; margin: 1rem 0 1.25rem; font-size: .88rem; }
.pd-teknik dt { color: var(--muted); font-weight: 600; }
.pd-teknik dd { margin: 0; font-weight: 700; text-align: right; }
.pd-teknik dd a { color: var(--ink); }
.pd-teknik caption { caption-side: top; font-size: .78rem; color: var(--muted); padding-top: 0; }
.pd-teknik .price-table th, .pd-teknik .price-table td { font-size: .82rem; }

/* Raflar (benzer ürünler) */
.pd-raf { margin-top: 4rem; }
.pd-raf-ust { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; margin-bottom: 1.25rem; }
.pd-raf-ust h2 { font-size: clamp(1.4rem, 2.2vw, 1.9rem); letter-spacing: -.03em; font-weight: 800; margin: 0; }
.pd-raf-ust .eyebrow { margin-bottom: .35rem; }
.pd-raf-ok { display: flex; align-items: center; gap: .4rem; flex-shrink: 0; }
.pd-raf-ok button { width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--line-2); background: var(--surface); color: var(--ink); }
.pd-raf-ok button:hover { background: var(--ink); color: #fff; border-color: var(--ink); }
.pd-raf-ok .link-more { margin-left: .5rem; }
.pd-raf-liste { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 4 * 1.25rem) / 5); gap: 1.25rem; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding: .25rem .25rem 1.25rem; margin: 0 -.25rem; }
.pd-raf-liste::-webkit-scrollbar { display: none; }
.pd-kart { scroll-snap-align: start; display: flex; flex-direction: column; gap: .35rem; text-decoration: none; color: var(--ink); }
.pd-kart-gorsel { position: relative; display: block; aspect-ratio: 1 / 1.414; border-radius: 4px; overflow: hidden; background: #eceae5; box-shadow: 0 1px 2px rgba(0,0,0,.08), 0 10px 22px -14px rgba(0,0,0,.45); transition: transform .25s ease, box-shadow .25s ease; }
.pd-kart-gorsel img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pd-kart-gorsel em { position: absolute; top: .5rem; left: .5rem; font-style: normal; background: #1d3a8a; color: #fff; font-size: .62rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; padding: .15rem .5rem; border-radius: 3px; }
.pd-kart:hover .pd-kart-gorsel, .pd-kart:focus-visible .pd-kart-gorsel { transform: translateY(-4px); box-shadow: 0 2px 4px rgba(0,0,0,.08), 0 22px 32px -16px rgba(0,0,0,.5); }
.pd-kart-ad { margin-top: .4rem; font-size: .86rem; font-weight: 700; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.pd-kart-fiyat { font-size: .86rem; font-weight: 800; }
.pd-kart-fiyat small { font-weight: 500; color: var(--muted); }

/* SSS */
.pd-sss { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr); gap: clamp(1.5rem, 4vw, 3.5rem); margin-top: 4rem; padding-top: 3rem; border-top: 1px solid var(--line); }
.pd-sss h2 { font-size: clamp(1.5rem, 2.4vw, 2rem); letter-spacing: -.03em; font-weight: 800; }
.pd-sss p { color: var(--muted); }
.pd-sss a { color: var(--accent); }
.pd-sss-liste details { border-bottom: 1px solid var(--line); }
.pd-sss-liste summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: 1rem; padding: 1rem 0; font-weight: 700; }
.pd-sss-liste summary::-webkit-details-marker { display: none; }
.pd-sss-liste summary::after { content: "+"; font-size: 1.3rem; line-height: 1; color: var(--accent); transition: transform .2s; }
.pd-sss-liste details[open] summary::after { transform: rotate(45deg); }
.pd-sss-liste details p { margin: 0 0 1rem; color: #3f3c35; line-height: 1.65; }

/* Diğer koleksiyonlar */
.pd-koleksiyonlar { margin-top: 3.5rem; }
.pd-koleksiyonlar > div { display: flex; flex-wrap: wrap; gap: .45rem; }
.pd-koleksiyonlar a { display: inline-flex; align-items: center; gap: .35rem; padding: .45rem .85rem; border-radius: 999px; border: 1px solid var(--line); background: var(--surface); color: var(--ink); text-decoration: none; font-size: .84rem; font-weight: 600; }
.pd-koleksiyonlar a:hover { border-color: var(--ink); }
.pd-koleksiyonlar a.is-ozel { background: var(--accent); border-color: var(--accent); color: #fff; }

@media (max-width: 1199.98px) { .pd-raf-liste { grid-auto-columns: calc((100% - 3 * 1.25rem) / 4); } }
@media (max-width: 991.98px) {
  .pd-olcek, .pd-detay, .pd-sss { grid-template-columns: minmax(0, 1fr); }
  .pd-teknik { position: static; }
  .pd-raf-liste { grid-auto-columns: calc((100% - 2 * 1rem) / 3); gap: 1rem; }
}
@media (max-width: 575.98px) {
  .pd-olcek, .pd-detay, .pd-raf, .pd-sss { margin-top: 2.75rem; }
  .pd-olcek { padding: 1rem; border-radius: 22px; }
  .pd-raf-liste { grid-auto-columns: 42%; gap: .85rem; }
  .pd-raf-ok button { display: none; }
  .pd-guven { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .pd-guven li { padding: .6rem; }
}
@media (max-width: 991.98px) { .pd-poster .preview-sticky { position: static; } }
@media (max-width: 575.98px) {
  .pd-poster .breadcrumb-item.active { display: none; }
  .pd-poster .breadcrumb-item:nth-last-child(2)::after { content: none; }
  .pd-poster .stage-toolbar .live-pill { display: none; }
}
@media (max-width: 575.98px) { .pd-koleksiyonlar > div { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; padding-bottom: .25rem; } .pd-koleksiyonlar a { flex-shrink: 0; } }

/* ======================================================================
   Yasal sayfalar (yasal-sayfa.php)
   ====================================================================== */
.yasal-duzen { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 3.5rem); align-items: start; margin-top: 1rem; }
.yasal-menu { position: sticky; top: 110px; display: flex; flex-direction: column; gap: .2rem; padding: .75rem; border-radius: 20px; background: var(--bg); }
.yasal-menu a { display: flex; align-items: center; gap: .55rem; padding: .55rem .75rem; border-radius: 12px; color: var(--ink); text-decoration: none; font-size: .88rem; font-weight: 600; }
.yasal-menu a i { color: var(--muted); }
.yasal-menu a:hover { background: var(--surface); }
.yasal-menu a.is-on { background: var(--ink); color: #fff; }
.yasal-menu a.is-on i { color: var(--accent); }
.yasal-metin { max-width: 780px; }
.yasal-metin h1 { font-size: clamp(1.8rem, 3vw, 2.4rem); font-weight: 800; letter-spacing: -.035em; margin-bottom: .35rem; }
.yasal-guncel { font-family: var(--font-mono); font-size: .74rem; color: var(--muted); margin-bottom: 2rem; }
.yasal-metin h2 { font-size: 1.15rem; font-weight: 800; margin: 2rem 0 .6rem; }
.yasal-metin p, .yasal-metin li { color: #3f3c35; line-height: 1.7; }
.yasal-metin ul, .yasal-metin ol { padding-left: 1.2rem; }
.yasal-metin li { margin-bottom: .35rem; }
.yasal-metin a { color: var(--accent); }
.yasal-tablo { width: 100%; border-collapse: collapse; margin: .5rem 0 1rem; font-size: .9rem; }
.yasal-tablo th, .yasal-tablo td { padding: .55rem .75rem; border-bottom: 1px solid var(--line); vertical-align: top; text-align: left; }
.yasal-tablo th { width: 34%; color: var(--muted); font-weight: 600; }
.yasal-iletisim { margin-top: 2.5rem; padding: 1rem 1.25rem; border-radius: 16px; background: var(--bg); font-size: .92rem; }
.yasal-iletisim i { color: var(--accent); margin-right: .35rem; }
.modal-body.yasal-metin h2 { font-size: 1rem; margin-top: 1.25rem; }
@media (max-width: 991.98px) {
  .yasal-duzen { grid-template-columns: minmax(0, 1fr); }
  .yasal-menu { position: static; flex-direction: row; overflow-x: auto; scrollbar-width: none; padding: .4rem; }
  .yasal-menu a { flex-shrink: 0; }
}

/* ======================================================================
   Özel günler: ana sayfa bandı + kampanya sayfası (inc/ozel-gunler.php, ozel-gun.php)
   ====================================================================== */
.og-bant { padding: 1.5rem 0 .5rem; }
.og-bant-izgara { display: grid; gap: 1rem; }
.og-bant.is-iki .og-bant-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.og-kart { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 170px; padding: 1.4rem 1.5rem; border-radius: 24px; overflow: hidden; text-decoration: none; color: #fff;
  background: radial-gradient(circle at 85% 50%, rgba(255,255,255,.14), transparent 55%), var(--og); box-shadow: 0 18px 36px -22px var(--og); transition: transform .25s ease; }
.og-kart:hover { transform: translateY(-3px); color: #fff; }
.og-metin { position: relative; z-index: 2; display: flex; flex-direction: column; gap: .3rem; max-width: 62%; }
.og-ust { font-family: var(--font-mono); font-size: .72rem; letter-spacing: .03em; text-transform: uppercase; opacity: .85; }
.og-metin b { font-size: clamp(1.25rem, 2vw, 1.6rem); font-weight: 800; letter-spacing: -.03em; line-height: 1.1; }
.og-alt { font-size: .86rem; opacity: .9; }
.og-cta { margin-top: .4rem; font-weight: 700; font-size: .88rem; }
.og-cta i { transition: transform .2s; }
.og-kart:hover .og-cta i { transform: translateX(4px); }
.og-gorseller { position: relative; flex-shrink: 0; width: 34%; height: 140px; }
.og-gorseller img { position: absolute; bottom: -8px; width: 56%; height: auto; aspect-ratio: 1 / 1.414; object-fit: cover; border-radius: 3px; box-shadow: 0 10px 22px rgba(0,0,0,.35); }
.og-gorseller img:nth-child(1) { right: 0; transform: rotate(6deg); }
.og-gorseller img:nth-child(2) { right: 26%; transform: rotate(-4deg); z-index: 2; }
.og-gorseller img:nth-child(3) { right: 50%; transform: rotate(-12deg); }

.og-sayfa { padding: 1.25rem 0 4rem; }
.og-bas { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 3rem); align-items: center; margin: 1rem 0 2.5rem; padding: clamp(1.5rem, 4vw, 3rem);
  border-radius: 30px; background: linear-gradient(135deg, color-mix(in srgb, var(--og) 10%, #fff), var(--bg)); }
.og-rozet { display: inline-flex; align-items: center; gap: .4rem; padding: .35rem .8rem; border-radius: 999px; background: var(--og); color: #fff; font-size: .8rem; font-weight: 700; }
.og-bas h1 { font-size: clamp(2rem, 4vw, 3rem); font-weight: 800; letter-spacing: -.045em; line-height: 1.05; margin: .9rem 0 .7rem; }
.og-son { display: flex; gap: .7rem; align-items: flex-start; margin-top: 1.25rem; padding: .9rem 1rem; border-radius: 16px; background: #eef7f1; color: #0f5132; font-size: .92rem; }
.og-son i { font-size: 1.3rem; color: var(--success); }
.og-son.is-gecti { background: #fff4e5; color: #6b4300; }
.og-son.is-gecti i { color: #25d366; }
.og-son a { color: inherit; font-weight: 700; }
.og-kolaj { display: flex; justify-content: center; align-items: center; padding: .5rem 0; }
.og-kolaj img { width: min(32%, 190px); height: auto; aspect-ratio: 1 / 1.414; object-fit: cover; border-radius: 4px; margin: 0 -3%; box-shadow: 0 18px 30px -12px rgba(0,0,0,.45); }
.og-kolaj img:nth-child(1) { transform: rotate(-7deg) translateY(6%); }
.og-kolaj img:nth-child(2) { position: relative; z-index: 2; transform: scale(1.08); }
.og-kolaj img:nth-child(3) { transform: rotate(7deg) translateY(6%); }
.og-izgara { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem 1rem; }
@media (min-width: 768px) { .og-izgara { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.75rem 1.25rem; } }
@media (min-width: 1200px) { .og-izgara { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.og-detay { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 3.5rem); margin-top: 4rem; padding-top: 3rem; border-top: 1px solid var(--line); }
.og-metin-alani h2, .og-sss h2 { font-size: clamp(1.3rem, 2.2vw, 1.7rem); font-weight: 800; letter-spacing: -.03em; margin-bottom: 1rem; }
.og-metin-alani p { color: #3f3c35; line-height: 1.7; }
.og-diger a { color: var(--accent); }
@media (max-width: 991.98px) {
  .og-bant.is-iki .og-bant-izgara, .og-bas, .og-detay { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 575.98px) {
  .og-kart { min-height: 150px; padding: 1.15rem; }
  .og-metin { max-width: 66%; }
  .og-gorseller { width: 32%; height: 110px; }
}