/* Nişanyan PMS — tanıtım sitesi (2. sürüm: ürün sitesi)
   Sade sans-serif yazı, taş rengi zemin (ne bembeyaz — sahibi: "klinik" — ne sarı krem — sahibi: "piss colored"), beyaz kartlar,
   tek vurgu rengi (PMS'in kiremit kırmızısı), gerçek ürün ekranları pencere çerçevesinde. Her ana bölümün kendi koyu tonu var
   (1 Kas akşamı 3. palet): rezervasyon = kiremit, yapay zekâ = gece, restoran = şarap/erik (sınıf adı: adacayi/yesil),
   muhasebe = petrol (sınıf adı: mavi). Onay işaretleri kiremit. */

:root {
  --zemin: #F4F2EE;
  --kart: #FFFFFF;
  --zemin-2: #EBE8E3;
  --zemin-3: #E1DDD6;
  --krem: #ECE8E2;
  --murekkep: #1B1815;
  --metin: #55504A;
  --soluk: #8A847C;
  --cizgi: #E0DBD3;
  --cizgi-2: #C9C2B8;
  --vurgu: #A8432A;
  --vurgu-koyu: #8B3A2C;
  --vurgu-zemin: #F2E3DC;
  --yesil: #7B2F4F;
  --yesil-zemin: #EEE2E7;
  --mavi: #1D5A63;
  --mavi-zemin: #DDE7E7;
  --altin: #C9A46C;
  --gece: #14110E;
  --gece-2: #201B16;
  --sans: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --baslik: 'Inter Tight', 'Inter', system-ui, sans-serif;
  --serif: 'Fraunces', Georgia, serif;
  --genislik: 1200px;
  --kenar: clamp(20px, 4vw, 40px);
  --ust: 68px;
  --golge-1: 0 1px 2px rgba(23,20,15,.06), 0 1px 1px rgba(23,20,15,.04);
  --golge-2: 0 2px 4px rgba(23,20,15,.04), 0 14px 34px -10px rgba(23,20,15,.16);
  --golge-3: 0 4px 10px rgba(23,20,15,.05), 0 30px 70px -20px rgba(23,20,15,.28);
  --egri: cubic-bezier(.2,.7,.2,1);
  color-scheme: light;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--zemin); color: var(--metin); font: 400 16.5px/1.6 var(--sans); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; overflow-x: clip; }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
button { font: inherit; color: inherit; }
::selection { background: var(--vurgu); color: #fff; }
:focus-visible { outline: 2px solid var(--vurgu); outline-offset: 3px; border-radius: 6px; }
[id] { scroll-margin-top: calc(var(--ust) + 12px); }

.kap { width: min(100% - 2 * var(--kenar), var(--genislik)); margin-inline: auto; }
.bolum { padding-block: clamp(72px, 9vw, 120px); }
.bolum.gri { background: var(--zemin-2); }
.bolum.sinir { border-top: 1px solid var(--cizgi); }

/* ─── yazı ─────────────────────────────────────────────────────────── */
h1, h2, h3, h4 { font-family: var(--baslik); color: var(--murekkep); margin: 0; font-weight: 600; letter-spacing: -0.03em; }
h1 { font-size: clamp(2.5rem, 5.6vw, 4.4rem); line-height: 1.03; letter-spacing: -0.04em; text-wrap: balance; }
h2 { font-size: clamp(1.9rem, 3.7vw, 2.85rem); line-height: 1.08; text-wrap: balance; }
h3 { font-size: 1.3rem; line-height: 1.25; letter-spacing: -0.02em; }
p { margin: 0; }
.giris { font-size: clamp(1.07rem, 1.5vw, 1.22rem); line-height: 1.6; color: var(--metin); max-width: 40em; text-wrap: pretty; }
.etiket { display: inline-flex; align-items: center; gap: 8px; font-size: .86rem; font-weight: 600; color: var(--vurgu); margin-bottom: 16px; }
.etiket svg { width: 18px; height: 18px; }
.bolum-bas { max-width: 760px; margin-bottom: clamp(36px, 5vw, 56px); }
.bolum-bas.orta { margin-inline: auto; text-align: center; }
.bolum-bas.orta .giris { margin-inline: auto; }
.bolum-bas .giris { margin-top: 16px; }
.vurgu-yazi { color: var(--vurgu); }

/* ─── düğmeler ─────────────────────────────────────────────────────── */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 46px; padding: 0 20px; border-radius: 10px; border: 1px solid transparent; font: 600 15px/1 var(--sans); text-decoration: none; white-space: nowrap; cursor: pointer; transition: background-color .2s, border-color .2s, color .2s, transform .2s var(--egri); }
.btn svg { width: 18px; height: 18px; }
.btn .ok { transition: transform .25s var(--egri); }
.btn:hover .ok { transform: translateX(3px); }
.btn:active { transform: translateY(1px); }
.btn-koyu { background: var(--murekkep); color: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.2), inset 0 1px 0 rgba(255,255,255,.08); }
.btn-koyu:hover { background: #2C2620; }
.btn-acik { background: var(--kart); color: var(--murekkep); border-color: var(--cizgi-2); box-shadow: var(--golge-1); }
.btn-acik:hover { border-color: var(--murekkep); }
.btn-kucuk { height: 38px; padding: 0 14px; font-size: 14px; border-radius: 9px; }
.btn-seffaf { background: rgba(255,255,255,.08); color: #fff; border-color: rgba(255,255,255,.18); }
.btn-seffaf:hover { background: rgba(255,255,255,.14); }
.btn-beyaz { background: #fff; color: var(--murekkep); }
.btn-beyaz:hover { background: #F0EEEA; }
.dugmeler { display: flex; flex-wrap: wrap; gap: 10px; }

/* ─── üst şerit ────────────────────────────────────────────────────── */
.ust { position: sticky; top: 0; z-index: 50; height: var(--ust); background: rgba(244,242,238,.84); backdrop-filter: saturate(1.6) blur(14px); -webkit-backdrop-filter: saturate(1.6) blur(14px); border-bottom: 1px solid transparent; transition: border-color .25s, background-color .25s; }
.ust.kaydi { border-bottom-color: var(--cizgi); background: rgba(244,242,238,.94); }
.ust-ic { height: 100%; display: flex; align-items: center; gap: 28px; }
.logo { font-family: var(--serif); font-size: 1.36rem; font-weight: 500; letter-spacing: -0.01em; color: var(--murekkep); text-decoration: none; white-space: nowrap; line-height: 1; }
.logo em { font-style: italic; font-weight: 400; color: var(--vurgu-koyu); }
.menu { display: flex; gap: 4px; margin-left: 8px; }
.menu a { position: relative; padding: 8px 12px; border-radius: 8px; font-size: 14.5px; font-weight: 500; color: var(--metin); text-decoration: none; transition: color .2s, background-color .2s; }
.menu a:hover { color: var(--murekkep); background: var(--zemin-2); }
.menu a.aktif { color: var(--murekkep); font-weight: 600; }
.menu a.aktif::after { content: ''; position: absolute; left: 50%; bottom: 1px; width: 4px; height: 4px; border-radius: 50%; background: var(--vurgu); translate: -50% 0; }
.ust-sag { margin-left: auto; display: flex; gap: 8px; align-items: center; }
.menu-ac { display: none; width: 42px; height: 42px; border: 1px solid var(--cizgi-2); border-radius: 10px; background: var(--kart); cursor: pointer; align-items: center; justify-content: center; }
.menu-ac svg { width: 20px; height: 20px; }
.mobil-panel { display: none; }
@media (max-width: 960px) {
  .menu, .ust-sag .btn-acik { display: none; }
  .menu-ac { display: inline-flex; }
  .mobil-panel { display: block; position: fixed; inset: var(--ust) 0 auto 0; z-index: 49; background: var(--zemin); border-bottom: 1px solid var(--cizgi); box-shadow: 0 20px 40px -20px rgba(0,0,0,.25); padding: 8px var(--kenar) 20px; transform: translateY(-8px); opacity: 0; visibility: hidden; transition: opacity .2s, transform .25s var(--egri), visibility .2s; }
  .mobil-panel.acik { transform: none; opacity: 1; visibility: visible; }
  .mobil-panel a.satir-bag { display: flex; align-items: center; gap: 12px; padding: 14px 4px; border-bottom: 1px solid var(--cizgi); text-decoration: none; color: var(--murekkep); font-weight: 600; font-size: 1.05rem; }
  .mobil-panel a.satir-bag span { font-weight: 400; color: var(--soluk); font-size: .9rem; margin-left: auto; }
  .mobil-panel .dugmeler { margin-top: 16px; }
  .mobil-panel .dugmeler .btn { flex: 1; }
}
@media (max-width: 440px) { .ust-sag .btn-koyu { display: none; } }

/* ─── ikonlu küçük kutu ────────────────────────────────────────────── */
.ikon { display: inline-grid; place-items: center; width: 40px; height: 40px; border-radius: 10px; background: var(--vurgu-zemin); color: var(--vurgu); flex: none; }
.ikon svg { width: 21px; height: 21px; }
.ikon.yesil { background: var(--yesil-zemin); color: var(--yesil); }
.ikon.mavi { background: var(--mavi-zemin); color: var(--mavi); }
.ikon.gece { background: #2B241D; color: var(--altin); }
.ikon.gri { background: var(--zemin-3); color: var(--murekkep); }
.ikon.beyaz { background: var(--kart); }

/* ─── ürün pencereleri ─────────────────────────────────────────────── */
.pencere { position: relative; border-radius: 14px; background: #fff; overflow: hidden; border: 1px solid rgba(23,20,15,.1); box-shadow: var(--golge-3); }
.pencere-bar { height: 34px; display: flex; align-items: center; gap: 8px; padding: 0 14px; background: #F4F1EC; border-bottom: 1px solid #E6E0D7; }
.pencere-bar i { width: 10px; height: 10px; border-radius: 50%; flex: none; }
.pencere-bar i:nth-child(1) { background: #E6A493; } .pencere-bar i:nth-child(2) { background: #EBCB86; } .pencere-bar i:nth-child(3) { background: #A9C49B; }
.pencere-bar > span:first-of-type { margin-inline: auto; transform: translateX(-20px); font-size: 12px; color: #8A7F72; background: #FBF9F6; border: 1px solid #E6E0D7; border-radius: 6px; padding: 2px 12px; white-space: nowrap; }
.pencere img { width: 100%; }
.kart-gorsel { border-radius: 12px; overflow: hidden; border: 1px solid rgba(23,20,15,.1); box-shadow: var(--golge-3); background: #fff; }
.telefon { border: 8px solid #1C1915; border-radius: 34px; overflow: hidden; background: #1C1915; box-shadow: 0 30px 60px -20px rgba(0,0,0,.45); }
.telefon img { border-radius: 26px; }

/* renkli pano: ekran görüntüsü sağ-alttan taşar */
.pano { position: relative; border-radius: 20px; overflow: hidden; padding: clamp(22px, 3.2vw, 40px) 0 0 clamp(22px, 3.2vw, 40px); background: var(--zemin-3); isolation: isolate; }
.pano::before { content: ''; position: absolute; inset: 0; z-index: -1; background: radial-gradient(80% 70% at 0% 0%, rgba(255,255,255,.6), rgba(255,255,255,0) 60%); }
.pano .kart-gorsel { border-radius: 12px 0 0 0; border-right: 0; border-bottom: 0; }
.pano.kiremit { background: #E9DAD2; } .pano.adacayi { background: #E5D6DC; } .pano.mavi { background: #D3DFDF; } .pano.kum { background: #E4DFD8; }
.pano.ortala { padding: clamp(22px, 3.2vw, 40px); display: grid; place-items: center; }
.pano.ortala .kart-gorsel { border-radius: 12px; border: 1px solid rgba(23,20,15,.1); }
.pano.ortala .telefon { width: min(300px, 70%); }
.pano.krem { background: var(--krem); padding: clamp(10px, 2vw, 24px) 0; }
.pano.krem::before { display: none; }
.pano.krem img { width: 112%; max-width: none; margin-left: -6%; }

/* ─── kahraman (ana sayfa) ─────────────────────────────────────────── */
.kahraman { position: relative; padding-top: clamp(52px, 8vw, 100px); background: radial-gradient(70% 55% at 50% 0%, #FBECE4 0%, rgba(251,236,228,0) 70%), var(--zemin); overflow: hidden; }
.kahraman-yazi { text-align: center; }
.kahraman h1 { max-width: 14.5ch; margin-inline: auto; }
.kahraman .giris { margin: 22px auto 0; max-width: 35em; }
.kahraman .dugmeler { justify-content: center; margin-top: 32px; }
.rozet-bag { display: inline-flex; align-items: center; gap: 10px; padding: 5px 14px 5px 6px; border-radius: 999px; background: var(--kart); border: 1px solid var(--cizgi-2); box-shadow: var(--golge-1); font-size: 13.5px; font-weight: 500; color: var(--metin); text-decoration: none; margin-bottom: 26px; transition: border-color .2s; }
.rozet-bag:hover { border-color: var(--murekkep); }
.rozet-bag b { display: inline-flex; align-items: center; height: 24px; padding: 0 9px; border-radius: 999px; background: var(--vurgu-zemin); color: var(--vurgu); font-size: 12px; font-weight: 600; }
.kahraman-gorsel { position: relative; margin-top: clamp(44px, 6vw, 72px); padding-bottom: clamp(32px, 5vw, 64px); }
.kahraman-folyo { position: absolute; right: -2.5%; bottom: clamp(8px, 2vw, 24px); width: 31%; border-radius: 12px; overflow: hidden; border: 1px solid rgba(23,20,15,.12); box-shadow: 0 30px 70px -18px rgba(23,20,15,.45); background: #fff; }
.kahraman-telefon { position: absolute; left: -2.5%; bottom: clamp(8px, 2vw, 24px); width: 16%; }
.kahraman-mobil { display: none; }

/* ─── fotoğraflı kahraman (ana sayfa) ──────────────────────────────── */
.ust.seffaf { position: fixed; left: 0; right: 0; }
.ust.seffaf::before { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: linear-gradient(rgba(15,12,9,.5), rgba(15,12,9,0)); transition: opacity .3s; }
.ust.seffaf.kaydi::before { opacity: 0; }
.ust.seffaf:not(.kaydi) { background: transparent; border-bottom-color: transparent; backdrop-filter: none; -webkit-backdrop-filter: none; }
.ust.seffaf:not(.kaydi) .logo, .ust.seffaf:not(.kaydi) .menu a { color: #fff; }
.ust.seffaf:not(.kaydi) .logo em { color: #F2B59E; }
.ust.seffaf:not(.kaydi) .menu a:hover { background: rgba(255,255,255,.12); }
.ust.seffaf:not(.kaydi) .btn-acik { background: rgba(255,255,255,.1); color: #fff; border-color: rgba(255,255,255,.42); box-shadow: none; }
.ust.seffaf:not(.kaydi) .btn-acik:hover { background: rgba(255,255,255,.18); border-color: #fff; }
.ust.seffaf:not(.kaydi) .btn-koyu { background: #fff; color: var(--murekkep); }
.ust.seffaf:not(.kaydi) .menu-ac { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.42); color: #fff; }
.foto-kahraman { position: relative; min-height: max(660px, 100svh); display: flex; align-items: flex-end; color: #fff; background: #17130F; overflow: hidden; isolation: isolate; }
.foto-kahraman .foto { position: absolute; inset: 0; z-index: -2; }
.foto-kahraman .foto img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 32%; transform: scale(1.06); animation: yakinlas 18s var(--egri) forwards; }
@keyframes yakinlas { to { transform: scale(1); } }
.foto-kahraman::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(16,13,10,.66) 0%, rgba(16,13,10,.3) 48%, rgba(16,13,10,.05) 100%), linear-gradient(180deg, rgba(16,13,10,.3) 0%, rgba(16,13,10,0) 22%, rgba(16,13,10,.18) 48%, rgba(18,15,12,.86) 80%, rgba(18,15,12,.96) 100%); }
.foto-kahraman-ic { padding-top: calc(var(--ust) + 84px); padding-bottom: clamp(40px, 7vh, 72px); }
.foto-kahraman .rozet-bag { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.28); color: rgba(255,255,255,.92); box-shadow: none; backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.foto-kahraman .rozet-bag:hover { border-color: rgba(255,255,255,.7); }
.foto-kahraman .rozet-bag b { background: rgba(242,181,158,.2); color: #F6C9B6; }
.foto-kahraman h1 { color: #fff; font-size: clamp(2.3rem, 4.4vw, 3.9rem); line-height: 1.05; max-width: 20em; }
.foto-kahraman h1 .ince { display: block; color: rgba(255,255,255,.6); }
.foto-kahraman .giris { color: rgba(255,255,255,.86); max-width: 37em; margin-top: 24px; }
.foto-kahraman-alt { display: flex; align-items: flex-end; justify-content: space-between; gap: 28px 48px; flex-wrap: wrap; margin-top: 34px; }
.ai-cam { display: flex; gap: 16px; align-items: center; max-width: 480px; padding: 18px 20px; border-radius: 16px; border: 1px solid rgba(201,164,108,.45); background: linear-gradient(135deg, rgba(42,36,30,.74), rgba(24,20,16,.58)); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); color: rgba(255,255,255,.78); text-decoration: none; transition: transform .3s var(--egri), border-color .3s; }
.ai-cam:hover { transform: translateY(-2px); border-color: rgba(201,164,108,.85); }
.ai-cam .simge { flex: none; width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center; color: #3A2E1E; background: radial-gradient(circle at 34% 28%, #F6DFAE 0%, #D9B57A 45%, #B48B52 100%); box-shadow: 0 8px 22px rgba(201,164,108,.3); }
.ai-cam .simge svg { width: 22px; height: 22px; }
.ai-cam b { display: block; color: #fff; font-family: var(--baslik); font-size: 1.12rem; font-weight: 600; letter-spacing: -0.015em; }
.ai-cam .m { display: block; font-size: .93rem; line-height: 1.45; margin-top: 3px; }
.kaydir-ipucu { position: absolute; left: 50%; bottom: 16px; translate: -50% 0; width: 1px; height: 44px; overflow: hidden; background: linear-gradient(rgba(255,255,255,0), rgba(255,255,255,.6)); }
.kaydir-ipucu::after { content: ''; position: absolute; left: 0; top: -40%; width: 1px; height: 40%; background: var(--altin); animation: damla 2.2s var(--egri) infinite; }
@keyframes damla { to { top: 110%; } }
.urun-bakis { background: radial-gradient(70% 40% at 50% 0%, #FBECE4 0%, rgba(251,236,228,0) 70%), var(--zemin); padding-bottom: 0; }
.urun-bakis .kahraman-gorsel { margin-top: 0; }
@media (max-width: 640px) {
  .foto-kahraman h1 { font-size: clamp(2rem, 8.6vw, 2.8rem); }
  .foto-kahraman-ic { padding-top: calc(var(--ust) + 56px); }
  .foto-kahraman .dugmeler { width: 100%; } .foto-kahraman .dugmeler .btn { flex: 1 1 auto; }
  .ai-cam { max-width: none; padding: 14px 16px; align-items: flex-start; }
  .ai-cam .simge { width: 40px; height: 40px; }
  .kaydir-ipucu { display: none; }
}

/* ─── alan kartları (ana sayfa) ────────────────────────────────────── */
.alanlar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.alan-kart { position: relative; display: flex; flex-direction: column; border-radius: 20px; overflow: hidden; text-decoration: none; color: inherit; min-height: 480px; isolation: isolate; transition: transform .35s var(--egri), box-shadow .35s; }
.alan-kart:hover { transform: translateY(-4px); box-shadow: var(--golge-2); }
.alan-kart .alan-yazi { padding: 30px 32px 0; }
.alan-kart h3 { margin-top: 18px; font-size: 1.45rem; }
.alan-kart p { margin-top: 10px; max-width: 31em; }
.alan-kart .bag { display: inline-flex; gap: 6px; align-items: center; margin-top: 16px; font-weight: 600; font-size: 14.5px; color: var(--murekkep); }
.alan-kart .bag .ok { transition: transform .25s var(--egri); }
.alan-kart:hover .bag .ok { transform: translateX(4px); }
.alan-kart .alan-gorsel { margin-top: auto; padding: 26px 0 0 32px; }
.alan-kart .alan-gorsel .kart-gorsel { border-radius: 10px 0 0 0; border-right: 0; border-bottom: 0; box-shadow: 0 10px 40px -10px rgba(23,20,15,.25); }
.alan-kart.kiremit { background: #6B2A1C; } .alan-kart.adacayi { background: #4A1C30; } .alan-kart.mavi { background: #123A40; }
.alan-kart.kiremit, .alan-kart.adacayi, .alan-kart.mavi { color: rgba(255,248,240,.74); }
.alan-kart.kiremit h3, .alan-kart.kiremit .bag, .alan-kart.adacayi h3, .alan-kart.adacayi .bag, .alan-kart.mavi h3, .alan-kart.mavi .bag { color: #fff; }
.alan-kart.kiremit .alan-gorsel .kart-gorsel, .alan-kart.adacayi .alan-gorsel .kart-gorsel, .alan-kart.mavi .alan-gorsel .kart-gorsel { box-shadow: 0 10px 40px -10px rgba(0,0,0,.45); border-color: rgba(255,255,255,.12); }
.alan-kart.gece { background: var(--gece-2); color: rgba(255,248,240,.72); }
.alan-kart.gece h3, .alan-kart.gece .bag { color: #fff; }
.alan-kart.gece .alan-gorsel { padding: 26px 32px 32px; }

/* sohbet balonları (kart içi ve yapay zekâ sayfası) */
.sohbet { display: flex; flex-direction: column; gap: 10px; font-size: 13.5px; line-height: 1.45; }
.mesaj { max-width: 88%; padding: 10px 14px; border-radius: 14px; }
.mesaj.biz { align-self: flex-end; background: #F0E3CC; color: var(--gece); border-bottom-right-radius: 4px; }
.mesaj.o { align-self: flex-start; background: #2B251F; color: #F1E8DD; border: 1px solid rgba(255,248,240,.08); border-bottom-left-radius: 4px; white-space: pre-line; }
.oneri { background: #2E271C; border: 1px solid #4A3D27; color: #F0E3CC; border-radius: 12px; padding: 10px 12px; font-size: 13px; transition: background-color .4s, border-color .4s, color .4s; }
.oneri .d { display: flex; gap: 6px; margin-top: 8px; }
.oneri .d span { font-size: 11.5px; font-weight: 600; padding: 3px 10px; border-radius: 6px; border: 1px solid #5A4A30; color: #E8D7B5; }
.oneri .d span.evet { background: #F0E3CC; border-color: #F0E3CC; color: var(--gece); }
.oneri.tamam { background: #1F2A1F; border-color: #34503A; color: #B9DDB9; }
.oneri.tamam .d { display: none; }
.oneri .uyari { display: block; margin-top: 6px; font-size: 11.5px; color: #D9A066; }

/* ─── adım akışı ───────────────────────────────────────────────────── */
.akis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.akis-adim { position: relative; background: var(--kart); border: 1px solid var(--cizgi); border-radius: 16px; padding: 22px 22px 24px; box-shadow: var(--golge-1); }
.akis-adim .no { display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; background: var(--zemin-3); font: 600 13px/1 var(--sans); color: var(--murekkep); }
.akis-adim h3 { font-size: 1.1rem; margin-top: 16px; }
.akis-adim p { font-size: .96rem; margin-top: 6px; }
.akis-adim:not(:last-child)::after { content: ''; position: absolute; top: 50%; right: -12px; width: 8px; height: 8px; border-top: 1.5px solid var(--cizgi-2); border-right: 1.5px solid var(--cizgi-2); transform: translateY(-50%) rotate(45deg); }

/* ─── hikâye ───────────────────────────────────────────────────────── */
.hikaye { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: clamp(32px, 6vw, 80px); align-items: center; }
.hikaye-foto { margin: 0; border-radius: 20px; overflow: hidden; aspect-ratio: 4 / 5; position: relative; }
.hikaye-foto img { width: 100%; height: 100%; object-fit: cover; object-position: 55% 50%; }
.hikaye-foto figcaption { position: absolute; left: 14px; bottom: 14px; font-size: 12.5px; color: #fff; background: rgba(20,17,14,.55); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); padding: 5px 10px; border-radius: 8px; }
.hikaye-yazi h2 { margin-bottom: 22px; }
.hikaye-yazi p + p { margin-top: 16px; }

/* ─── küçük kart ızgaraları ────────────────────────────────────────── */
.izgara-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.izgara-4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.kucuk-kart { background: var(--kart); border: 1px solid var(--cizgi); border-radius: 16px; padding: 22px; box-shadow: var(--golge-1); }
.kucuk-kart h3 { font-size: 1.06rem; margin-top: 14px; }
.kucuk-kart p { font-size: .95rem; margin-top: 6px; }
.rol-iki { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 48px); align-items: start; }
.rol-tablo { border: 1px solid var(--cizgi); border-radius: 16px; overflow: hidden; background: var(--kart); box-shadow: var(--golge-1); }
.rol-satir { display: grid; grid-template-columns: 170px minmax(0, 1fr); gap: 16px; padding: 15px 20px; border-top: 1px solid var(--cizgi); align-items: center; }
.rol-satir:first-child { border-top: 0; }
.rol-satir b { font-family: var(--baslik); color: var(--murekkep); font-weight: 600; font-size: 1.02rem; display: flex; gap: 10px; align-items: center; letter-spacing: -0.015em; }
.rol-satir b i { width: 9px; height: 9px; border-radius: 50%; flex: none; }
.rol-satir span { font-size: .96rem; }
.liste-tik { list-style: none; margin: 18px 0 0; padding: 0; display: grid; gap: 10px; }
.liste-tik li { display: flex; gap: 10px; align-items: flex-start; }
.liste-tik li::before { content: ''; flex: none; width: 20px; height: 20px; margin-top: 2px; border-radius: 50%; background: var(--vurgu-zemin) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M6 10.4l2.6 2.6L14 7.6' fill='none' stroke='%23A8432A' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 20px no-repeat; }
.gece-bolum .liste-tik li::before, .sayfa-bas.gece .liste-tik li::before { background-color: rgba(201,164,108,.16); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M6 10.4l2.6 2.6L14 7.6' fill='none' stroke='%23C9A46C' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }

/* ─── canlı demo bandı ─────────────────────────────────────────────── */
.demo-bant { background: var(--gece); color: rgba(255,248,240,.72); padding-block: clamp(72px, 9vw, 112px); position: relative; overflow: hidden; }
.demo-bant::before { content: ''; position: absolute; inset: -20% -10% auto -10%; height: 70%; background: radial-gradient(50% 60% at 25% 30%, rgba(168,67,42,.3), transparent 70%), radial-gradient(40% 50% at 85% 10%, rgba(201,164,108,.16), transparent 70%); pointer-events: none; }
.demo-bant .kap { position: relative; }
.demo-bant h2 { color: #fff; }
.demo-bant .etiket { color: var(--altin); }
.demo-bant .giris { color: rgba(255,248,240,.72); }
.demo-ust { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px 48px; flex-wrap: wrap; margin-bottom: 28px; }
.demo-ust .bolum-bas { margin-bottom: 0; }
.kisayollar { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 14px; }
.kisayollar button { font-size: 13.5px; font-weight: 500; color: rgba(255,248,240,.8); background: rgba(255,248,240,.06); border: 1px solid rgba(255,248,240,.14); padding: 7px 14px; border-radius: 999px; cursor: pointer; transition: background-color .2s, color .2s, border-color .2s; }
.kisayollar button:hover { color: #fff; border-color: rgba(255,248,240,.4); }
.kisayollar button.aktif { background: #fff; color: var(--murekkep); border-color: #fff; }
.demo-pencere { border-radius: 14px; overflow: hidden; background: #FAF7F2; box-shadow: 0 0 0 1px rgba(255,248,240,.1), 0 40px 100px -30px rgba(0,0,0,.8); }
.demo-pencere:fullscreen { border-radius: 0; display: flex; flex-direction: column; }
.demo-pencere:fullscreen .demo-govde { flex: 1; height: auto; }
.demo-pencere .pencere-bar { height: 42px; }
.demo-pencere .pencere-bar > span:first-of-type { transform: none; }
.demo-pencere .demo-eylem { flex: none; }
.demo-eylem { display: flex; gap: 6px; }
.demo-eylem button, .demo-eylem a { height: 28px; display: inline-flex; align-items: center; gap: 4px; border: 1px solid #DDD5C8; background: #FBF9F6; border-radius: 7px; padding: 0 10px; font-size: 12.5px; font-weight: 500; color: #3D2B1F; cursor: pointer; text-decoration: none; }
.demo-eylem button:hover, .demo-eylem a:hover { background: #fff; }
.demo-govde { position: relative; height: min(800px, calc(100vh - 140px)); min-height: 560px; background: #FAF7F2; }
.demo-govde iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; opacity: 0; transition: opacity .5s; }
.demo-govde iframe.hazir { opacity: 1; }
.demo-yukleniyor { position: absolute; inset: 0; display: grid; place-items: center; align-content: center; gap: 10px; color: #8A7355; font-size: 14px; }
.demo-yukleniyor i { width: 26px; height: 26px; border-radius: 50%; border: 2px solid #E3D8C6; border-top-color: var(--vurgu); animation: don 1s linear infinite; justify-self: center; }
@keyframes don { to { transform: rotate(360deg); } }
.demo-poster { display: none; }
.demo-poster-ic { display: block; padding: 28px 0 90px; }
.demo-poster-ic .telefon { display: block; width: 60%; margin: 0 auto; }
.demo-not { display: flex; gap: 10px; align-items: flex-start; margin-top: 18px; font-size: 14px; color: rgba(255,248,240,.6); }
.demo-not svg { width: 18px; height: 18px; color: var(--altin); flex: none; margin-top: 2px; }

/* ─── çağrı kutusu ─────────────────────────────────────────────────── */
.cagri { padding-block: clamp(64px, 8vw, 104px); }
.cagri-kutu { position: relative; overflow: hidden; border-radius: 24px; background: var(--gece); color: rgba(255,248,240,.75); padding: clamp(32px, 5vw, 64px); display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 32px clamp(32px, 5vw, 64px); align-items: center; isolation: isolate; }
.cagri-kutu::before { content: ''; position: absolute; inset: 0; z-index: -1; background: radial-gradient(60% 80% at 100% 0%, rgba(168,67,42,.35), transparent 70%), radial-gradient(50% 70% at 0% 100%, rgba(201,164,108,.14), transparent 70%); }
.cagri-kutu h2 { color: #fff; }
.cagri-kutu p { margin-top: 14px; }
.kisi-kart { background: rgba(255,248,240,.05); border: 1px solid rgba(255,248,240,.12); border-radius: 18px; padding: 24px; }
.kisi-kart .ad { font-family: var(--baslik); color: #fff; font-size: 1.25rem; font-weight: 600; letter-spacing: -0.02em; }
.kisi-kart .gorev { font-size: 13.5px; color: rgba(255,248,240,.55); margin-top: 2px; }
.kisi-kart .satirlar { display: grid; gap: 2px; margin-top: 14px; }
.kisi-kart .satirlar a { display: flex; gap: 10px; align-items: center; color: rgba(255,248,240,.9); text-decoration: none; padding: 6px 0; font-size: 15px; width: fit-content; }
.kisi-kart .satirlar a:hover { color: #fff; }
.kisi-kart .satirlar svg { width: 17px; height: 17px; color: var(--altin); }
.kisi-kart .dugmeler { margin-top: 18px; }

/* ─── alt bilgi ────────────────────────────────────────────────────── */
.alt { border-top: 1px solid var(--cizgi); padding: 56px 0 40px; font-size: 14.5px; }
.alt-izgara { display: grid; grid-template-columns: minmax(0, 1.6fr) repeat(3, minmax(0, 1fr)); gap: 32px; }
.alt h4 { font-family: var(--sans); font-size: 13px; font-weight: 600; color: var(--murekkep); letter-spacing: 0; margin-bottom: 12px; }
.alt ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.alt a { text-decoration: none; color: var(--metin); }
.alt a:hover { color: var(--murekkep); }
.alt .tanim { margin-top: 12px; max-width: 26em; }
.alt-dip { margin-top: 44px; padding-top: 22px; border-top: 1px solid var(--cizgi); display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; color: var(--soluk); font-size: 13.5px; }

/* ─── alt sayfalar ─────────────────────────────────────────────────── */
.sayfa-bas { padding-top: clamp(52px, 7vw, 92px); position: relative; overflow: hidden; }
.sayfa-bas.kiremit, .sayfa-bas.adacayi, .sayfa-bas.mavi { color: rgba(255,248,240,.74); padding-bottom: clamp(56px, 7vw, 88px); isolation: isolate; }
.sayfa-bas.kiremit { background: #6B2A1C; } .sayfa-bas.adacayi { background: #4A1C30; } .sayfa-bas.mavi { background: #123A40; }
.sayfa-bas.kiremit::before, .sayfa-bas.adacayi::before, .sayfa-bas.mavi::before { content: ''; position: absolute; inset: -30% -10% auto -10%; height: 90%; z-index: -1; pointer-events: none; }
.sayfa-bas.kiremit::before { background: radial-gradient(45% 55% at 20% 35%, rgba(232,140,96,.30), transparent 70%), radial-gradient(40% 50% at 85% 20%, rgba(201,164,108,.18), transparent 70%); }
.sayfa-bas.adacayi::before { background: radial-gradient(45% 55% at 20% 35%, rgba(206,110,150,.26), transparent 70%), radial-gradient(40% 50% at 85% 20%, rgba(201,164,108,.16), transparent 70%); }
.sayfa-bas.mavi::before { background: radial-gradient(45% 55% at 20% 35%, rgba(90,180,180,.22), transparent 70%), radial-gradient(40% 50% at 85% 20%, rgba(201,164,108,.14), transparent 70%); }
.sayfa-bas.kiremit h1, .sayfa-bas.adacayi h1, .sayfa-bas.mavi h1 { color: #fff; }
.sayfa-bas.kiremit .giris, .sayfa-bas.adacayi .giris, .sayfa-bas.mavi .giris { color: rgba(255,248,240,.78); }
.sayfa-bas.kiremit .etiket { color: #F2B59E; } .sayfa-bas.adacayi .etiket { color: #E9B6CB; } .sayfa-bas.mavi .etiket { color: #A9D6D6; }
.sayfa-bas.kiremit .btn-koyu, .sayfa-bas.adacayi .btn-koyu, .sayfa-bas.mavi .btn-koyu { background: #fff; color: var(--murekkep); }
.sayfa-bas.kiremit .btn-acik, .sayfa-bas.adacayi .btn-acik, .sayfa-bas.mavi .btn-acik { background: rgba(255,255,255,.08); color: #fff; border-color: rgba(255,255,255,.3); box-shadow: none; }
.sayfa-bas.kiremit .btn-acik:hover, .sayfa-bas.adacayi .btn-acik:hover, .sayfa-bas.mavi .btn-acik:hover { border-color: #fff; }
.sayfa-bas.kiremit .sayfa-ekran .pencere, .sayfa-bas.adacayi .sayfa-ekran .pencere, .sayfa-bas.mavi .sayfa-ekran .pencere { box-shadow: 0 4px 10px rgba(0,0,0,.12), 0 40px 90px -30px rgba(0,0,0,.6); }
.sayfa-bas.gece { background: var(--gece); color: rgba(255,248,240,.72); padding-bottom: clamp(64px, 8vw, 100px); }
.sayfa-bas.gece::before { content: ''; position: absolute; inset: -30% -10% auto -10%; height: 90%; background: radial-gradient(45% 55% at 20% 35%, rgba(168,67,42,.28), transparent 70%), radial-gradient(40% 50% at 85% 20%, rgba(201,164,108,.16), transparent 70%); pointer-events: none; }
.sayfa-bas.gece .kap { position: relative; }
.sayfa-bas.gece h1 { color: #fff; }
.sayfa-bas.gece .etiket { color: var(--altin); }
.sayfa-bas.gece .giris { color: rgba(255,248,240,.75); }
.sayfa-bas-yazi { max-width: 780px; }
.sayfa-bas-yazi .giris { margin-top: 20px; }
.sayfa-bas-yazi .dugmeler { margin-top: 28px; }
.sayfa-ekran { margin-top: clamp(40px, 6vw, 64px); position: relative; }
.sayfa-ekran .pencere { box-shadow: 0 4px 10px rgba(23,20,15,.05), 0 40px 90px -30px rgba(23,20,15,.35); }

.satir { display: grid; grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); gap: clamp(32px, 6vw, 80px); align-items: center; }
.satir + .satir { margin-top: clamp(72px, 9vw, 120px); }
.satir.ters .satir-yazi { order: 2; }
.satir-yazi h2 { font-size: clamp(1.7rem, 3vw, 2.35rem); }
.satir-yazi .giris { margin-top: 14px; font-size: 1.08rem; }
.satir-yazi .not { margin-top: 18px; font-size: .92rem; color: var(--soluk); }
.satir-yazi .dugmeler { margin-top: 24px; }

.vurgu-kutu { border-radius: 20px; padding: clamp(26px, 4vw, 40px); display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 20px; align-items: start; background: var(--vurgu-zemin); border: 1px solid #EFD3C6; }
.vurgu-kutu.mavi { background: var(--mavi-zemin); border-color: #C3D3D3; }
.vurgu-kutu.adacayi { background: var(--yesil-zemin); border-color: #DCC9D1; }
.vurgu-kutu h3 { font-size: 1.35rem; }
.vurgu-kutu p { margin-top: 8px; max-width: 46em; }

.diger { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.diger a { display: flex; gap: 14px; align-items: center; padding: 20px; border-radius: 16px; border: 1px solid var(--cizgi); background: var(--kart); text-decoration: none; color: inherit; transition: border-color .2s, transform .3s var(--egri), box-shadow .3s; }
.diger a:hover { border-color: var(--cizgi-2); transform: translateY(-2px); box-shadow: var(--golge-2); }
.diger b { display: block; color: var(--murekkep); font-family: var(--baslik); font-weight: 600; letter-spacing: -0.015em; }
.diger span.k { font-size: 13.5px; color: var(--soluk); }
.diger .ok { margin-left: auto; color: var(--soluk); }

/* yapay zekâ sayfası */
.gece-bolum { background: var(--gece); color: rgba(255,248,240,.7); }
.gece-bolum h2, .gece-bolum h3 { color: #fff; }
.gece-bolum .etiket { color: var(--altin); }
.gece-bolum .giris { color: rgba(255,248,240,.72); }
.ai-iki { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: clamp(32px, 5vw, 72px); align-items: center; }
.ai-pencere { border-radius: 18px; background: #1B1713; border: 1px solid rgba(255,248,240,.1); box-shadow: 0 40px 100px -30px rgba(0,0,0,.85); overflow: hidden; }
.ai-pencere .pencere-bar { background: #241F19; border-bottom-color: rgba(255,248,240,.08); }
.ai-pencere .pencere-bar > span:first-of-type { background: #1B1713; border-color: rgba(255,248,240,.1); color: rgba(255,248,240,.55); }
.ai-icerik { padding: 20px; height: 560px; display: flex; flex-direction: column; justify-content: flex-end; overflow: hidden; -webkit-mask-image: linear-gradient(transparent 0, #000 40px); mask-image: linear-gradient(transparent 0, #000 40px); }
.ai-icerik .sohbet { flex: none; }
.ai-icerik .sohbet > .gizli { display: none; }
.ai-icerik .sohbet > .yeni { animation: mesajGel .45s var(--egri) both; }
@keyframes mesajGel { from { opacity: 0; transform: translateY(10px); } }
.yaziyor { align-self: flex-start; display: inline-flex; gap: 4px; padding: 12px 14px; border-radius: 14px; background: #2B251F; }
.yaziyor i { width: 6px; height: 6px; border-radius: 50%; background: rgba(255,248,240,.5); animation: zipla 1s infinite ease-in-out; }
.yaziyor i:nth-child(2) { animation-delay: .15s; } .yaziyor i:nth-child(3) { animation-delay: .3s; }
@keyframes zipla { 0%, 80%, 100% { transform: translateY(0); opacity: .5; } 40% { transform: translateY(-4px); opacity: 1; } }
.ai-giris { display: flex; gap: 8px; padding: 14px 20px 18px; border-top: 1px solid rgba(255,248,240,.08); }
.ai-giris div { flex: 1; min-width: 0; height: 40px; border-radius: 10px; background: #241F19; border: 1px solid rgba(255,248,240,.1); color: rgba(255,248,240,.4); font-size: 13.5px; display: flex; align-items: center; padding: 0 14px; white-space: nowrap; overflow: hidden; }
.ai-giris span { height: 40px; display: inline-flex; align-items: center; padding: 0 16px; border-radius: 10px; background: #F0E3CC; color: var(--gece); font-weight: 600; font-size: 13.5px; }
.tekrar { margin-top: 12px; background: none; border: 0; color: rgba(255,248,240,.55); font-size: 13px; cursor: pointer; padding: 0; }
.tekrar:hover { color: #fff; }
.ornekler { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; }
.ornekler span { font-size: 14px; padding: 8px 14px; border-radius: 999px; background: rgba(255,248,240,.06); border: 1px solid rgba(255,248,240,.14); color: #F1E8DD; }
.koyu-kart { background: rgba(255,248,240,.04); border: 1px solid rgba(255,248,240,.1); border-radius: 16px; padding: 22px; }
.koyu-kart h3 { font-size: 1.06rem; margin-top: 14px; }
.koyu-kart p { font-size: .95rem; margin-top: 6px; color: rgba(255,248,240,.62); }
.ai-uyari { display: flex; gap: 12px; align-items: flex-start; padding: 16px 18px; border-radius: 14px; background: rgba(201,164,108,.1); border: 1px solid rgba(201,164,108,.3); color: #F0E3CC; font-size: 14.5px; margin-top: 28px; }
.ai-uyari svg { width: 20px; height: 20px; color: var(--altin); flex: none; margin-top: 1px; }

/* kanal şeması (rezervasyon sayfası) */
.kanal { display: grid; grid-template-columns: minmax(0, 1fr) 110px minmax(0, 1fr); align-items: center; }
.kanal-kart { background: var(--kart); border: 1px solid var(--cizgi); border-radius: 16px; padding: 20px 22px; box-shadow: var(--golge-2); }
.kanal-kart .k-et { font-size: 12.5px; font-weight: 600; color: var(--vurgu); }
.kanal-kart .k-oda { font-family: var(--baslik); font-size: 1.45rem; font-weight: 600; color: var(--murekkep); margin-top: 6px; letter-spacing: -0.02em; }
.kanal-kart .k-tarih { font-size: 14.5px; margin-top: 2px; }
.kanal-kart .k-kaynak { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--cizgi); }
.kanal-kart .k-kaynak small { display: block; font-size: 12.5px; color: var(--soluk); margin-bottom: 8px; }
.kanal-kart .k-kaynak div { display: flex; flex-wrap: wrap; gap: 6px; }
.kanal-kart .k-kaynak span { font-size: 12.5px; padding: 3px 10px; border-radius: 999px; background: var(--zemin-2); border: 1px solid var(--cizgi); transition: background-color .3s, color .3s, border-color .3s; }
.kanal-kart .k-kaynak span.aktif { background: var(--murekkep); color: #fff; border-color: var(--murekkep); }
.kanal-orta { position: relative; align-self: stretch; }
.kanal-orta svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.kanal-orta .yol { fill: none; stroke: var(--cizgi-2); stroke-width: 1.5; vector-effect: non-scaling-stroke; }
.kanal-orta .akan { fill: none; stroke: var(--vurgu); stroke-width: 2; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.kanal-orta .nokta { fill: var(--vurgu); }
.kanal-listesi { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.kanal-listesi li { display: flex; justify-content: space-between; align-items: center; gap: 10px; background: var(--kart); border: 1px solid var(--cizgi); border-radius: 12px; padding: 12px 14px 12px 16px; font-weight: 600; color: var(--murekkep); font-size: 15px; box-shadow: var(--golge-1); }
.kanal-listesi li.diger-k { background: transparent; border-style: dashed; color: var(--soluk); font-weight: 500; box-shadow: none; }
.durum { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 600; padding: 4px 10px; border-radius: 999px; background: var(--vurgu-zemin); color: var(--vurgu); }
.durum i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; display: none; }
.durum svg { width: 13px; height: 13px; }
.durum.acik { background: #E2EEE5; color: #2F6B45; }   /* anlam rengi: açık = yeşil (restoran tonundan ayrı) */
.durum.acik i { display: block; } .durum.acik svg { display: none; }
.durum.kapandi { animation: tik .4s var(--egri); }
@keyframes tik { 50% { transform: scale(1.08); } }

/* ─── görünme animasyonu ───────────────────────────────────────────── */
.js .belir { opacity: 0; transform: translateY(22px); transition: opacity .8s var(--egri), transform .8s var(--egri); transition-delay: var(--gecikme, 0s); }
.js .belir.gorundu { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .js .belir { opacity: 1; transform: none; }
}

/* ─── duyarlı ──────────────────────────────────────────────────────── */
@media (max-width: 1080px) {
  .akis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .akis-adim:nth-child(2)::after { display: none; }
  .izgara-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .alt-izgara { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .alt-izgara > :first-child { grid-column: 1 / -1; }
}
@media (max-width: 900px) {
  .alanlar, .hikaye, .satir, .rol-iki, .cagri-kutu, .ai-iki, .diger, .izgara-3 { grid-template-columns: minmax(0, 1fr); }
  .satir.ters .satir-yazi { order: 0; }
  .alan-kart { min-height: 0; }
  .hikaye-foto { aspect-ratio: 16 / 11; }
  .kahraman-folyo { width: 38%; right: -1%; }
  .kahraman-telefon { display: none; }
  .kanal { grid-template-columns: 1fr; gap: 0; }
  .kanal-orta { height: 44px; }
  .kanal-orta svg { display: none; }
  .kanal-orta::before { content: ''; position: absolute; left: 50%; top: 0; bottom: 0; width: 1.5px; background: var(--cizgi-2); }
  .rol-satir { grid-template-columns: 1fr; gap: 4px; }
}
@media (max-width: 640px) {
  body { font-size: 16px; }
  .akis, .izgara-4 { grid-template-columns: 1fr; }
  .akis-adim::after { display: none; }
  .kahraman .dugmeler .btn, .sayfa-bas .dugmeler .btn { flex: 1 1 auto; }
  .rozet-bag { padding: 6px 14px; font-size: 13px; }
  .rozet-bag b { display: none; }
  .kahraman-gorsel .pencere, .kahraman-folyo { display: none; }
  .kahraman-mobil { display: block; width: min(300px, 78%); margin-inline: auto; }
  .pencere-bar > span:first-of-type { display: none; }
  .demo-pencere .demo-eylem { margin-left: auto; }
  .alan-kart .alan-yazi { padding: 24px 22px 0; }
  .alan-kart .alan-gorsel { padding: 20px 0 0 22px; }
  .alan-kart.gece .alan-gorsel { padding: 20px 22px 24px; }
  .alt-izgara { grid-template-columns: 1fr 1fr; }
  .demo-govde { height: auto; min-height: 0; }
  .demo-govde iframe, .demo-yukleniyor { display: none; }
  .demo-poster { display: block; position: relative; }
  .demo-poster img { width: 100%; }
  .demo-poster .btn { position: absolute; left: 50%; bottom: 18px; translate: -50% 0; box-shadow: 0 14px 30px -10px rgba(0,0,0,.6); }
  .demo-eylem [data-demo-tam], .demo-eylem [data-demo-sifirla], .kisayollar { display: none; }
  .ai-icerik { padding: 16px; height: 560px; }
}

/* ── sayfa başında oynanabilir demo (restoran): görüntü yer tutar, iframe üstüne açılır ── */
.canli-govde { position: relative; }
.canli-govde iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; background: #FAF7F2; opacity: 0; transition: opacity .5s; }
.canli-govde iframe.hazir { opacity: 1; }
@media (max-width: 640px) { .canli-govde iframe { display: none; } }