/* Panorama — yapışkan büyük fotoğraf, kategoriyle değişir; altında sade liste */
.theme-panorama {
  --bg: #faf6f1; --surface: #ffffff; --surface-2: #f2ebe2; --text: #2d2620; --muted: #72675c; --faint: #b0a497;
  --line: rgba(45, 38, 32, .09); --radius: 20px; --price: var(--text);
  --pano-h: max(300px, 46vh); --pano-min: 168px;
}
.theme-panorama [data-section] { scroll-margin-top: calc(var(--pano-min) + 12px); }

/* Yapışkan panorama: sayfa kaydıkça küçülür, fotoğraf kategoriye göre değişir */
.pano { position: sticky; top: calc(var(--pano-min) - var(--pano-h)); z-index: 30; height: var(--pano-h); color: #fff; overflow: hidden; border-radius: 0 0 28px 28px; background: #2a211b; box-shadow: 0 18px 30px -24px rgba(45,38,32,.7); }
.pano-media { position: absolute; inset: 0; }
.pm { position: absolute; inset: 0; opacity: 0; transition: opacity .7s var(--ease); }
.pm.active, .pm:first-child:not(:has(~ .pm.active)) { opacity: 1; }
.pm img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.06); transition: transform 6s ease-out; }
.pm.active img { transform: scale(1); }
.pano-shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(20, 14, 10, .45) 0%, rgba(20,14,10,.08) 35%, rgba(20,14,10,.2) 60%, rgba(20,14,10,.78) 100%); }
.pano-top { position: absolute; top: calc(12px + var(--safe-t)); inset-inline: 14px; display: flex; align-items: center; justify-content: space-between; gap: 10px; z-index: 2; }
.pano-logo { width: 42px; height: 42px; border-radius: 50%; overflow: hidden; display: grid; place-items: center; background: rgba(255,255,255,.2); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); box-shadow: 0 0 0 2px rgba(255,255,255,.6); font-weight: 800; }
.pano-in { position: absolute; z-index: 2; inset-inline: 20px; bottom: 64px; }
.pano-biz { font-size: 12.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; opacity: .85; }
.pano-title { position: relative; font-size: clamp(30px, 9vw, 46px); font-weight: 800; letter-spacing: -.04em; line-height: 1.02; margin-top: 4px; text-wrap: balance; }
.t-cat:empty { display: none; }
.pano-title:has(.t-cat:not(:empty)) .t-name { display: none; }
/* En üstte kapak ve işletme adı; kaydırınca kategori fotoğrafı ve adı */
body:not(.scrolled) .pm[data-media-for=""] { opacity: 1; z-index: 1; }
body:not(.scrolled) .pano-title .t-cat { display: none; }
body:not(.scrolled) .pano-title .t-name { display: inline !important; }
.scrolled .pano-in .meta { display: none; }
/* İşletme adı başlıkta zaten yazıyor: üstteki küçük ad yalnızca bir kategori seçiliyken (başlık kategori adıyken) görünür */
.pano-biz { display: none; }
.scrolled .pano-in:has(.t-cat:not(:empty)) .pano-biz { display: block; }
.meta { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.meta .status-pill { background: rgba(20, 14, 10, .58); color: #fff; box-shadow: inset 0 0 0 1px rgba(255,255,255,.22); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
.meta .table-pill { background: var(--primary); color: #fff; }
.pano-nav { position: absolute; z-index: 2; inset-inline: 0; bottom: 12px; display: flex; gap: 6px; overflow-x: auto; padding: 0 16px; }
.pano-nav a { flex-shrink: 0; height: 36px; display: grid; place-items: center; padding: 0 14px; border-radius: 999px; font-size: 13.5px; font-weight: 600; color: #fff; background: rgba(255,255,255,.16); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); white-space: nowrap; transition: background .25s, color .25s; }
.pano-nav a.active { background: #fff; color: #2d2620; }
body.dm-on .pano-nav a.active { background: var(--text); color: var(--bg); }
.image-mode .pano { position: relative; top: 0; }

.intro { max-width: 720px; margin: 0 auto; padding: 18px 18px 0; }
.tagline { color: var(--muted); font-size: 16px; }
.intro .acts { margin-top: 12px; }
.intro .act { height: 38px; padding: 0 14px 0 8px; border-radius: 999px; background: var(--surface); box-shadow: 0 0 0 1px var(--line); font-size: 13.5px; font-weight: 600; }
.intro .act-ic { width: 26px; height: 26px; border-radius: 50%; background: var(--surface-2); color: var(--primary); }
.intro .act-ic .icon { width: 14px; height: 14px; }
.intro .banner { margin-top: 12px; border-radius: 16px; background: var(--surface); }

/* Liste */
.main { max-width: 720px; margin: 0 auto; padding: 0 16px 30px; }
.sec { padding-top: 28px; }
.sec-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding: 0 4px 10px; }
.sec-head h2 { font-size: 24px; font-weight: 800; letter-spacing: -.035em; }
.sec-head span { font-size: 12.5px; color: var(--muted); font-weight: 600; }
.sec-desc { color: var(--muted); font-size: 14px; margin: -4px 4px 10px; }
.sec .sec-closed { margin: 0 4px 10px; }
.items { display: flex; flex-direction: column; gap: 10px; }
.row { display: flex; gap: 14px; padding: 12px 12px 12px 16px; border-radius: var(--radius); background: var(--surface); box-shadow: 0 1px 2px rgba(45,38,32,.05); }
.row:active { transform: scale(.99); }
.row h3 { font-family: var(--font-body); font-size: 16px; font-weight: 700; letter-spacing: -.015em; line-height: 1.2; }
.desc { color: var(--muted); font-size: 13.5px; line-height: 1.4; margin-top: 3px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.row-foot { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 8px; margin-top: 8px; }
.row .price { font-weight: 800; font-size: 15px; }
.row-img { width: 96px; height: 96px; border-radius: 16px; flex-shrink: 0; }
.row-img .add { position: absolute; inset-inline-end: 6px; bottom: 6px; width: 30px; height: 30px; background: #fff; color: var(--primary); box-shadow: 0 4px 10px -4px rgba(0,0,0,.4); }
.add.solo { align-self: center; }
.tag { background: var(--surface-2); color: var(--muted); }
.unavailable .items { opacity: .55; }
.camp { box-shadow: 0 0 0 1px var(--line); }

.cart-bar { background: var(--text); }
.foot-social a { box-shadow: 0 0 0 1px var(--line); }
