:root {
  --bg: #0E0E10; --fg: #EAE6DF; --kor: #D9532F; --brass: #B89758;
  --line: rgba(234, 230, 223, .16);
  --display: Syne, sans-serif; --body: "Instrument Sans", sans-serif;
  --accent-text: var(--brass); --focus: var(--brass);
  --strip-bg: #17171A; --strip-fg: #EAE6DF; --head-bg: #0E0E10;
  color-scheme: dark;
}
.brand { font-family: var(--display); font-weight: 600; font-size: 1.3125rem; letter-spacing: -.02em; }
.menu p { text-align: center; color: rgba(234, 230, 223, .78); }

.btn { display: inline-flex; align-items: center; justify-content: center; min-height: 52px; padding: 0 26px; border-radius: 2px; font-weight: 600; text-align: center; transition: background-color .2s, color .2s; }
.btn-sm { min-height: 42px; padding: 0 18px; font-size: .9375rem; }
.btn-kor { background: var(--kor); color: var(--bg); }
.btn-kor:hover { background: var(--fg); }
.fab { background: var(--kor); color: var(--bg); --fab-radius: 2px; }

.h2 { font-family: var(--display); font-weight: 500; font-size: clamp(2rem, 4.8vw, 4rem); line-height: 1.04; letter-spacing: -.03em; text-wrap: balance; }

/* İmleci izleyen, gecikmeli kor ışığı */
.ember {
  display: none; position: fixed; left: 0; top: 0; z-index: 30; width: 640px; height: 640px; margin: -320px 0 0 -320px;
  pointer-events: none; border-radius: 50%; mix-blend-mode: screen; opacity: 0; transition: opacity .6s;
  background: radial-gradient(circle, rgba(217, 83, 47, .17) 0%, rgba(184, 151, 88, .06) 38%, transparent 68%);
  will-change: transform;
}
.ember.is-on { opacity: 1; }
@media (pointer: fine) { .ember { display: block; } }

/* Hero */
.hero { position: relative; min-height: calc(100svh - 110px); display: flex; align-items: flex-end; overflow: hidden; isolation: isolate; }
.korlar { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -1; pointer-events: none; }
.hero-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; }
.hero-dim {
  --x: 68%; --y: 42%;
  position: absolute; inset: 0; z-index: -1;
  background:
    linear-gradient(to top, rgba(14, 14, 16, .94) 0%, rgba(14, 14, 16, .55) 42%, rgba(14, 14, 16, 0) 72%),
    radial-gradient(circle 440px at var(--x) var(--y), rgba(14, 14, 16, .2) 0%, rgba(14, 14, 16, .72) 100%);
}
.hero-in { padding-block: 96px 20px; }
/* Başlık açılışta korun renginden soğuyarak krem renge döner. */
.hero-title { font-family: var(--display); font-weight: 500; font-size: clamp(2.5rem, 11.2vw, 7.5rem); line-height: .98; letter-spacing: -.045em; text-wrap: balance; animation: soguma 1.6s ease-out both; }
@keyframes soguma { from { color: #F08A5D; text-shadow: 0 0 34px rgba(217, 83, 47, .6); } to { color: var(--fg); text-shadow: 0 0 0 rgba(217, 83, 47, 0); } }
.hero-row { display: grid; gap: 20px; margin-top: 20px; justify-items: start; }
.hero-sub { max-width: 34rem; font-size: 1.0625rem; color: rgba(234, 230, 223, .92); }
.tonight { margin-top: 30px; border-top: 1px solid rgba(234, 230, 223, .28); }
.tonight > div { display: grid; grid-template-columns: 1fr; gap: 1px; padding: 11px 0; border-bottom: 1px solid rgba(234, 230, 223, .16); }
.tonight > div:last-child { border-bottom: 0; }
.tonight dt { display: flex; align-items: center; gap: 8px; font-size: .9375rem; color: rgba(234, 230, 223, .78); }
.tonight dd { font-family: var(--display); font-weight: 500; font-size: 1.125rem; line-height: 1.25; font-variant-numeric: tabular-nums; }
.tonight a { text-decoration: underline; text-decoration-color: var(--brass); text-underline-offset: 4px; }
.tonight a:hover { color: var(--brass); }
.tonight-fire i { width: 8px; height: 8px; border-radius: 50%; background: rgba(234, 230, 223, .4); }
.tonight-fire.is-lit i { background: var(--kor); box-shadow: 0 0 10px 2px rgba(217, 83, 47, .7); animation: nabiz 2.4s ease-in-out infinite; }
@keyframes nabiz { 50% { opacity: .55; box-shadow: 0 0 4px 1px rgba(217, 83, 47, .4); } }
@media (min-width: 1024px) {
  .hero-in { padding-block: 120px 28px; }
  .hero-title { font-size: clamp(4.5rem, 7.7vw, 8.25rem); max-width: 10em; }
  .hero-row { grid-template-columns: 1fr auto; align-items: end; margin-top: 26px; }
  .tonight { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 36px; }
  .tonight > div { padding: 14px 24px 4px 0; border-bottom: 0; }
  .tonight > div + div { padding-left: 24px; border-left: 1px solid rgba(234, 230, 223, .16); }
  .tonight dd { font-size: 1.3125rem; }
}

/* Ateş */
.fire { padding-block: 72px; }
.fire-grid { display: grid; gap: 28px; }
.fire-text > p { max-width: 36rem; font-size: 1.125rem; color: rgba(234, 230, 223, .86); }
.fire-facts { margin-top: 28px; border-top: 1px solid var(--line); }
.fire-facts div { display: flex; justify-content: space-between; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.fire-facts dt { color: rgba(234, 230, 223, .75); }
.fire-facts dd { font-family: var(--display); font-weight: 500; color: var(--brass); }
@media (min-width: 1024px) {
  .fire { padding-block: 128px; }
  .fire-grid { grid-template-columns: 7fr 5fr; gap: 80px; align-items: end; }
}

/* Tadım menüsü */
.taste { padding-block: 72px; background: #151518; border-block: 1px solid var(--line); }
.taste-head { display: grid; gap: 12px; }
.taste-head p { color: var(--brass); font-size: 1.0625rem; }
.taste-grid { display: grid; gap: 28px; margin-top: 30px; }
/* Mobilde fotoğraf menünün üstünde sabit kalır: tabağa dokununca değişen resim görünür. */
.taste-fig { position: sticky; top: 69px; z-index: 2; overflow: hidden; border: 1px solid var(--line); aspect-ratio: 5 / 3; background: #151518; }
.taste-fig img { width: 100%; height: 100%; object-fit: cover; transition: opacity .28s; }
.taste-fig img.is-swap { opacity: 0; }
.courses { counter-reset: c; }
.courses li { counter-increment: c; position: relative; padding: 18px 0 18px 42px; border-top: 1px solid var(--line); transition: opacity .3s; }
.courses li:last-child { border-bottom: 1px solid var(--line); }
.courses li::before { content: counter(c); position: absolute; left: 0; top: 19px; font-family: var(--display); color: var(--brass); }
.courses h3 { font-family: var(--display); font-weight: 500; font-size: clamp(1.3125rem, 2.2vw, 1.75rem); line-height: 1.15; letter-spacing: -.02em; }
.courses p { margin-top: 6px; max-width: 34rem; color: rgba(234, 230, 223, .82); }
.courses li { cursor: pointer; }
.course-btn { display: block; width: 100%; min-height: 28px; font: inherit; letter-spacing: inherit; text-align: left; cursor: pointer; transition: color .2s; }
.courses li.is-on .course-btn { color: var(--brass); }
.courses li.is-on::before { color: var(--kor); }
.course-btn:focus-visible { outline-offset: 2px; }
@media (min-width: 1024px) {
  .taste { padding-block: 128px; }
  .taste-head { grid-template-columns: 7fr 5fr; align-items: end; gap: 80px; }
  .taste-grid { grid-template-columns: 5fr 7fr; gap: 80px; margin-top: 56px; align-items: start; }
  .taste-fig { position: sticky; top: 100px; aspect-ratio: 4 / 5; max-height: calc(100vh - 130px); }
  .courses:hover li { opacity: .55; }
  .courses:hover li:hover { opacity: 1; }
}

/* Galeri */
.gallery { padding-block: 72px; overflow: hidden; }
.g-view { margin-top: 28px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding-inline: 20px; }
.g-view::-webkit-scrollbar { display: none; }
.g-view:focus-visible { outline-offset: -3px; }
.g-track { display: flex; gap: 12px; width: max-content; }
.g { width: 78vw; max-width: 420px; scroll-snap-align: center; flex: none; }
.g img { width: 100%; height: 300px; object-fit: cover; }
.g p { margin-top: 10px; font-size: .9375rem; color: rgba(234, 230, 223, .82); line-height: 1.4; }
@media (min-width: 1024px) {
  .gallery { padding-block: 128px 96px; }
  .g-view { overflow: visible; scroll-snap-type: none; margin-top: 44px; padding-inline: max(40px, calc((100vw - 1360px) / 2 + 40px)); }
  .g-track { gap: 24px; will-change: transform; align-items: flex-end; }
  .g { max-width: none; }
  .g-a, .g-c, .g-e { width: 620px; }
  .g-b, .g-d { width: 380px; }
  .g-a img, .g-c img, .g-e img { height: 400px; }
  .g-b img, .g-d img { height: 500px; }
}

/* Rezervasyon */
.book { padding-block: 72px; border-top: 1px solid var(--line); }
.book-grid { display: grid; gap: 36px; }
.book-sub { margin-top: 16px; max-width: 32rem; color: rgba(234, 230, 223, .84); }
.book-info { margin-top: 24px; }
.book-info p { padding: 11px 0; border-top: 1px solid var(--line); font-weight: 500; }
.book-info span { display: block; font-size: .9375rem; font-weight: 400; color: rgba(234, 230, 223, .75); }
.book-info a { text-decoration: underline; text-underline-offset: 4px; display: inline-flex; min-height: 28px; align-items: center; }
.form { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; padding: 20px; background: #151518; border: 1px solid var(--line); }
.field { display: grid; gap: 6px; min-width: 0; }
.field:nth-child(4) { grid-column: 1 / -1; }
.field:first-child { grid-column: 1 / -1; }
.field label { font-size: .9375rem; color: rgba(234, 230, 223, .85); }
.field input, .field select { width: 100%; min-height: 50px; padding: 0 12px; background: var(--bg); border: 1px solid rgba(234, 230, 223, .32); border-radius: 2px; }
.field input:focus-visible, .field select:focus-visible { border-color: var(--brass); }
.form-go { grid-column: 1 / -1; width: 100%; }
@media (min-width: 1024px) {
  .book { padding-block: 128px; }
  .book-grid { grid-template-columns: 7fr 5fr; gap: 80px; align-items: start; }
  .form { padding: 28px; }
}
.df { border-top: 1px solid var(--line); }