:root {
  --bg: #fbf7ef;
  --bg-soft: #fffdf8;
  --wine: #7b1216;
  --wine-dark: #4b0c0f;
  --gold: #b9892f;
  --gold-soft: #9c6f22;
  --cream: #241714;
  --muted: #75675b;
  --line: rgba(123, 18, 22, .16);
  --shadow: 0 28px 90px rgba(69, 38, 18, .14);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: linear-gradient(180deg, #fffdf8 0%, #fbf7ef 42%, #f4eadb 100%);
  color: var(--cream);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.55;
}
a { color: inherit; text-decoration: none; }
.serif { font-family: Georgia, "Times New Roman", serif; letter-spacing: -.035em; }

.nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px clamp(20px, 5vw, 72px);
  background: rgba(255, 253, 248, .9);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid rgba(123, 18, 22, .12);
}
.brand { display: flex; align-items: center; }
.brand img { width: clamp(150px, 18vw, 245px); height: auto; filter: drop-shadow(0 10px 24px rgba(0, 0, 0, .34)); }
.nav-links { display: flex; align-items: center; gap: 24px; color: rgba(36, 23, 20, .76); font-size: 14px; }
.nav-links a[aria-current="page"] { color: var(--wine); }
.nav-cta { border: 1px solid var(--gold); border-radius: 999px; padding: 11px 18px; color: var(--wine); background: rgba(185, 137, 47, .08); }

.hero {
  min-height: 100vh;
  position: relative;
  display: grid;
  align-items: end;
  overflow: hidden;
  isolation: isolate;
}
.slider { position: absolute; inset: 0; z-index: -2; }
.video-slide { position: absolute; inset: 0; opacity: 0; animation: fade 24s infinite; transform: scale(1.03); }
.video-slide:nth-child(1) { opacity: 1; }
.video-slide:nth-child(2) { animation-delay: 8s; }
.video-slide:nth-child(3) { animation-delay: 16s; }
.video-slide video { width: 100%; height: 100%; object-fit: cover; filter: saturate(1.04) contrast(1.02) brightness(.96); }
.hero::after, .page-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: radial-gradient(circle at 72% 22%, rgba(185, 137, 47, .18), transparent 34%), linear-gradient(90deg, rgba(255, 253, 248, .96) 0%, rgba(255, 253, 248, .84) 38%, rgba(91, 17, 20, .34) 68%, rgba(15, 11, 8, .54) 100%), linear-gradient(to top, rgba(251, 247, 239, .94) 0%, rgba(251, 247, 239, .32) 42%, rgba(15, 11, 8, .18) 100%);
}
.video-badge {
  position: absolute;
  right: clamp(20px, 6vw, 86px);
  top: 33%;
  width: 174px;
  height: 174px;
  border: 1px solid rgba(123, 18, 22, .16);
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: var(--wine);
  background: rgba(255, 253, 248, .7);
  backdrop-filter: blur(12px);
  text-align: center;
  font-size: 12px;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.video-badge::before {
  content: "▶";
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  margin: 0 auto 10px;
  border-radius: 50%;
  background: var(--gold);
  color: #201007;
  letter-spacing: 0;
  font-size: 18px;
}
.hero-content {
  width: min(1180px, calc(100% - 40px));
  margin: 0 auto;
  padding: 180px 0 76px;
  display: grid;
  grid-template-columns: 1.1fr .72fr;
  gap: 48px;
  align-items: end;
}
.hero-copy {
  padding: clamp(22px, 4vw, 38px);
  margin-left: clamp(-18px, -2vw, 0px);
  border-radius: 34px;
  background: linear-gradient(110deg, rgba(255,253,248,.88), rgba(255,253,248,.58), rgba(255,253,248,0));
  backdrop-filter: blur(2px);
}
.eyebrow { color: var(--wine); letter-spacing: .25em; text-transform: uppercase; font-size: 12px; margin-bottom: 18px; font-weight: 800; }
h1 { margin: 0; max-width: 850px; font-size: clamp(58px, 9vw, 132px); line-height: .86; font-weight: 400; color: #2b1712; text-shadow: 0 2px 0 rgba(255,255,255,.45); }
.hero-lead { max-width: 690px; color: rgba(36, 23, 20, .86); font-size: clamp(18px, 2vw, 24px); margin: 30px 0 34px; text-shadow: 0 1px 0 rgba(255,255,255,.42); }
.cta-row { display: flex; gap: 14px; flex-wrap: wrap; }
.btn { border-radius: 999px; padding: 15px 22px; font-weight: 700; border: 1px solid transparent; transition: transform .2s, background .2s; display: inline-flex; align-items: center; justify-content: center; }
.btn:hover { transform: translateY(-2px); }
.btn-primary { background: var(--wine); color: #fffdf8; }
.btn-ghost { border-color: var(--line); color: var(--wine); background: rgba(255,255,255,.64); }

.reservation-card, .panel-card {
  background: rgba(255, 253, 248, .86);
  border: 1px solid var(--line);
  border-radius: 28px;
  padding: 28px;
  box-shadow: var(--shadow);
}
.reservation-card h2, .panel-card h2 { margin: 0 0 8px; font-size: 28px; font-weight: 400; }
.reservation-card p, .panel-card p { margin: 0 0 20px; color: var(--muted); }
.form-grid { display: grid; gap: 12px; }
.input, textarea.input { width: 100%; border: 1px solid rgba(123, 18, 22, .16); background: rgba(255, 255, 255, .76); color: var(--cream); border-radius: 14px; padding: 14px 14px; outline: none; font: inherit; }
.input::placeholder { color: rgba(36, 23, 20, .45); }
textarea.input { min-height: 132px; resize: vertical; }

section { padding: 96px clamp(20px, 5vw, 72px); }
.section-head { width: min(760px, 100%); margin-bottom: 42px; }
.section-head h2 { margin: 0; font-size: clamp(38px, 5vw, 72px); line-height: .96; font-weight: 400; }
.section-head p { color: var(--muted); font-size: 18px; }
.cards, .menu-grid, .group-box { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.card {
  min-height: 310px;
  padding: 28px;
  border-radius: 28px;
  border: 1px solid var(--line);
  position: relative;
  overflow: hidden;
  background: linear-gradient(160deg, rgba(255, 255, 255, .06), rgba(255, 255, 255, .02));
}
.card::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 45%; background: linear-gradient(to top, rgba(91, 17, 20, .65), transparent); }
.card h3, .card p { position: relative; z-index: 1; }
.card h3 { margin: 0 0 10px; font-size: 28px; font-weight: 400; }
.card p { color: var(--muted); margin: 0; }
.card.iskender { background-image: linear-gradient(160deg, rgba(15,11,8,.38), rgba(91,17,20,.38)), url('https://images.unsplash.com/photo-1625943553852-781c6dd46faa?auto=format&fit=crop&w=900&q=80'); background-size: cover; background-position: center; }
.card.meat { background-image: linear-gradient(160deg, rgba(15,11,8,.44), rgba(91,17,20,.38)), url('https://images.unsplash.com/photo-1544025162-d76694265947?auto=format&fit=crop&w=900&q=80'); background-size: cover; background-position: center; }
.card.table { background-image: linear-gradient(160deg, rgba(15,11,8,.44), rgba(91,17,20,.38)), url('https://images.unsplash.com/photo-1414235077428-338989a2e8c0?auto=format&fit=crop&w=900&q=80'); background-size: cover; background-position: center; }

.page-hero {
  min-height: 58vh;
  position: relative;
  display: grid;
  align-items: end;
  padding: 160px clamp(20px, 5vw, 72px) 70px;
  isolation: isolate;
  overflow: hidden;
  background-size: cover;
  background-position: center;
}
.page-hero.menu { background-image: linear-gradient(rgba(15,11,8,.55), rgba(15,11,8,.8)), url('https://images.unsplash.com/photo-1544025162-d76694265947?auto=format&fit=crop&w=1800&q=80'); }
.page-hero.reservation { background-image: linear-gradient(rgba(15,11,8,.55), rgba(15,11,8,.8)), url('https://images.unsplash.com/photo-1552566626-52f8b828add9?auto=format&fit=crop&w=1800&q=80'); }
.page-hero.groups { background-image: linear-gradient(rgba(15,11,8,.55), rgba(15,11,8,.8)), url('https://images.unsplash.com/photo-1517248135467-4c7edcad34c4?auto=format&fit=crop&w=1800&q=80'); }
.page-hero.contact { background-image: linear-gradient(rgba(15,11,8,.55), rgba(15,11,8,.8)), url('https://images.unsplash.com/photo-1514933651103-005eec06c04b?auto=format&fit=crop&w=1800&q=80'); }
.page-hero h1 { font-size: clamp(54px, 8vw, 112px); }
.page-hero p { max-width: 740px; color: rgba(255,245,228,.9); font-size: 20px; }

.reason-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.reason-card { min-height: 280px; padding: 28px; border: 1px solid var(--line); border-radius: 28px; background: rgba(255,255,255,.72); box-shadow: 0 18px 60px rgba(69,38,18,.07); }
.reason-card span { color: var(--gold-soft); letter-spacing: .2em; font-size: 13px; }
.reason-card h3 { margin: 28px 0 10px; font-size: 30px; font-weight: 400; }
.reason-card p { margin: 0; color: var(--muted); }
.tophane-band { display: grid; grid-template-columns: 1.08fr .92fr; gap: 32px; align-items: center; background: linear-gradient(135deg, rgba(123,18,22,.94), rgba(75,12,15,.96)), url('https://images.unsplash.com/photo-1598970434795-0c54fe7c0642?auto=format&fit=crop&w=1600&q=80'); background-size: cover; background-position: center; color: #fff5e4; }
.tophane-band .eyebrow { color: var(--gold-soft); }
.tophane-band h2 { margin: 0; font-size: clamp(42px, 6vw, 84px); line-height: .94; font-weight: 400; max-width: 850px; }
.tophane-band p { color: rgba(255,245,228,.78); font-size: 18px; max-width: 720px; }
.tophane-points { display: grid; gap: 14px; }
.tophane-points div { padding: 22px; border: 1px solid rgba(240,211,154,.28); border-radius: 24px; background: rgba(255,255,255,.06); backdrop-filter: blur(8px); }
.tophane-points b, .tophane-points span { display: block; }
.tophane-points b { color: var(--gold-soft); margin-bottom: 6px; }
.tophane-points span { color: rgba(255,245,228,.78); }
.split { display: grid; grid-template-columns: .9fr 1.1fr; gap: 36px; align-items: center; background: linear-gradient(135deg, #fffaf0, #f3e5d1); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.photo-panel { min-height: 520px; border-radius: 32px; background: linear-gradient(rgba(15,11,8,.2), rgba(15,11,8,.4)), url('https://images.unsplash.com/photo-1514933651103-005eec06c04b?auto=format&fit=crop&w=1100&q=80'); background-size: cover; background-position: center; box-shadow: var(--shadow); }
.feature-list { display: grid; gap: 16px; margin-top: 26px; }
.feature { display: grid; grid-template-columns: 48px 1fr; gap: 16px; align-items: start; padding: 18px; border: 1px solid var(--line); border-radius: 20px; background: rgba(255,255,255,.58); }
.feature b { width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center; background: rgba(201, 154, 69, .16); color: var(--gold-soft); font-family: Georgia, serif; font-size: 20px; font-weight: 400; }
.feature h3 { margin: 0 0 4px; font-size: 19px; }
.feature p { margin: 0; color: var(--muted); }

.experience-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.experience-card { padding: 32px; border-radius: 30px; border: 1px solid var(--line); background: linear-gradient(180deg, rgba(255,255,255,.88), rgba(255,250,240,.72)); box-shadow: 0 20px 70px rgba(69,38,18,.08); }
.experience-card h3 { margin: 0 0 12px; font-size: 31px; font-weight: 400; }
.experience-card p { color: var(--muted); margin: 0 0 22px; }
.experience-card a { color: var(--wine); font-weight: 800; }
.group-section, .menu-section { background: radial-gradient(circle at 20% 10%, rgba(185,137,47,.12), transparent 28%), #fffdf8; }
.group-item, .menu-item, .info-card { padding: 30px; border-radius: 26px; border: 1px solid var(--line); background: rgba(255,255,255,.78); box-shadow: 0 18px 60px rgba(69,38,18,.08); }
.group-item span, .menu-item span, .info-card span { color: var(--gold-soft); font-size: 13px; letter-spacing: .2em; text-transform: uppercase; }
.group-item h3, .menu-item h3, .info-card h3 { margin: 12px 0 8px; font-size: 25px; font-weight: 400; }
.group-item p, .menu-item p, .info-card p { margin: 0; color: var(--muted); }
.menu-item strong { display: block; margin-top: 18px; color: var(--gold-soft); font-size: 22px; }
.two-col { display: grid; grid-template-columns: .95fr 1.05fr; gap: 24px; align-items: start; }

.final-cta {
  min-height: 460px;
  display: grid;
  place-items: center;
  text-align: center;
  background: linear-gradient(rgba(15, 11, 8, .62), rgba(15, 11, 8, .86)), url('https://images.unsplash.com/photo-1552566626-52f8b828add9?auto=format&fit=crop&w=1800&q=80');
  background-size: cover;
  background-position: center;
}
.final-cta h2 { margin: 0 auto 20px; max-width: 920px; font-size: clamp(42px, 6vw, 86px); line-height: .94; font-weight: 400; }
footer { display: flex; justify-content: space-between; gap: 20px; padding: 28px clamp(20px, 5vw, 72px); color: rgba(36,23,20,.62); border-top: 1px solid var(--line); flex-wrap: wrap; background: #fffdf8; }

@keyframes fade {
  0%, 30% { opacity: 1; transform: scale(1.03); }
  36%, 94% { opacity: 0; transform: scale(1.08); }
  100% { opacity: 1; transform: scale(1.03); }
}

@media (max-width: 900px) {
  .nav { position: absolute; align-items: flex-start; }
  .nav-links { display: none; }
  .hero-content, .split, .cards, .menu-grid, .group-box, .two-col, .reason-grid, .tophane-band, .experience-row { grid-template-columns: 1fr; }
  .video-badge { display: none; }
  section { padding: 70px 20px; }
  .photo-panel { min-height: 360px; }
}
