/* ==============================================================
   BÖLÜMLER — her tip panelde bir "tip" değerine karşılık gelir
   ============================================================== */

.section {
  padding-block: var(--bolum);
  background: var(--zemin);
  color: var(--metin);
  overflow-x: clip;
}

/* --- Zemin ritmi ----------------------------------------------
   Panelden sıra değiştiğinde aynı zeminli iki bölüm arasında
   çift boşluk oluşmasın. PHP tarafında hiçbir kontrol gerekmiyor. */
.section[data-zemin="beyaz"] + .section[data-zemin="beyaz"],
.section[data-zemin="kum"]   + .section[data-zemin="kum"],
.section[data-zemin="koyu"]  + .section[data-zemin="koyu"] { padding-top: 0; }

.section[data-zemin="kum"]  { background: var(--notr-kum); }
.section[data-zemin="koyu"] { background: var(--marka-koyu); }

/* Son bölüm koyuysa footer'la birleşir: iki yandan eşit daralt, ince çizgiyle ayır. */
main > .section[data-zemin="koyu"]:last-child {
  padding-block: var(--bosluk-9);
  border-bottom: 1px solid var(--cizgi);
}

/* ==============================================================
   hero
   ============================================================== */
.hero {
  position: relative;
  display: flex;
  align-items: flex-end;
  min-height: 78svh;
  padding: 0;
  color: var(--notr-kum);
  isolation: isolate;
}
.hero__image { position: absolute; inset: 0; z-index: -2; }
/* <picture> blok ve yükseklik almazsa içindeki height:100% çözülmez */
.hero__image picture { display: block; width: 100%; height: 100%; }
.hero__image .image { width: 100%; height: 100%; }
.hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--overlay-hero); }
.hero__inner { padding-block: var(--bosluk-8); display: grid; gap: var(--bosluk-5); }
.hero__title { max-width: 18ch; }
.hero__sub { max-width: 46ch; color: rgb(244 239 231 / .82); font-size: var(--yazi-lg); }
.hero .eyebrow { color: var(--marka-vurgu); }
.hero .btn--secondary { border-color: rgb(244 239 231 / .4); color: var(--notr-kum); }
.hero__note { color: rgb(244 239 231 / .72); font-size: var(--yazi-sm); letter-spacing: .08em; }

@media (min-width: 640px) { .hero { min-height: 72svh; } }
@media (min-width: 900px) { .hero { min-height: 640px; } .hero__inner { padding-block: var(--bosluk-9); } }

/* ==============================================================
   sayfa-basligi
   ============================================================== */
.page-header {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 180px;
  padding-block: var(--bosluk-7);
  color: var(--notr-kum);
  isolation: isolate;
}
.page-header .hero__image { position: absolute; inset: 0; z-index: -2; }
.page-header::after { content: ""; position: absolute; inset: 0; z-index: -1; background: rgb(14 31 38 / .62); }
.page-header .section-heading { margin-bottom: 0; }
@media (min-width: 640px) { .page-header { min-height: 240px; } }
@media (min-width: 900px) { .page-header { min-height: 320px; } }

/* ==============================================================
   metin-gorsel  (7/5 asimetrik, görsel container kenarını taşar)
   ============================================================== */
.text-image__grid { display: grid; gap: var(--bosluk-6); }
.text-image__image { --oran: 4 / 3; order: -1; }     /* mobilde görsel her zaman üstte */
.text-image__text { display: grid; gap: var(--bosluk-5); align-content: center; }
.text-image__text .section-heading { margin-bottom: 0; }

@media (min-width: 900px) {
  .text-image__grid { grid-template-columns: 7fr 5fr; gap: var(--bosluk-9); align-items: center; }
  .text-image__image { --oran: 4 / 5; order: 0; }
  .text-image--right .text-image__image { order: 1; }
  /* container kenarını taşırma */
  .text-image--right .text-image__image { margin-right: calc(var(--kenar) * -1); }
  .text-image--left .text-image__image { margin-left: calc(var(--kenar) * -1); }
  .text-image--left .text-image__grid { grid-template-columns: 5fr 7fr; }
  .text-image--left .text-image__image { order: -1; }
  .text-image--full.text-image--right .text-image__grid { grid-template-columns: 5fr 7fr; }
  .text-image--full.text-image--left .text-image__grid { grid-template-columns: 7fr 5fr; }
}

.text-image__quote {
  margin: 0;
  padding-left: var(--bosluk-5);
  border-left: 2px solid var(--vurgu);
  font-family: var(--f-display);
  font-style: italic;
  font-size: var(--yazi-xl);
  color: var(--vurgu-metin);
}

/* ==============================================================
   kart-izgara  (1 -> 2 -> 3; 4 öğede 2x2)
   ============================================================== */
.card-grid__list { display: grid; gap: var(--bosluk-7) var(--oluk); }
@media (min-width: 640px) { .card-grid__list { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 900px) {
  .card-grid__list { grid-template-columns: repeat(3, 1fr); }
  .card-grid__list[data-adet="4"] { grid-template-columns: repeat(2, 1fr); }
  .card-grid__list[data-adet="2"] { grid-template-columns: repeat(2, 1fr); }
}

/* ==============================================================
   zaman-cizelgesi — hikâye zaman çizelgesi (1993 ─ 2010 ─ 2017 ─ Bugün)
   Mobilde dikey ray + kart; masaüstünde yatay ray + kart.
   ============================================================== */
.timeline__list {
  position: relative;
  display: grid;
  gap: var(--bosluk-7);
  padding: 0;
  margin: 0;
  list-style: none;
}
/* Sürekli ray — her öğenin kendi kenarlığı yerine tek parça çizgi */
.timeline__list::before {
  content: "";
  position: absolute;
  background: var(--cizgi-guclu);
  left: 6px;
  top: 7px;
  bottom: 7px;
  width: 2px;
}
.timeline__item {
  position: relative;
  padding-left: var(--bosluk-7);
  display: flex;
  flex-direction: column;
}
.timeline__dot {
  position: absolute;
  left: 0;
  top: 0;
  width: 14px;
  height: 14px;
  border-radius: var(--r-tam);
  background: var(--zemin);
  border: 2px solid var(--vurgu);
  z-index: 1;
}
.timeline__item--highlight .timeline__dot {
  background: var(--vurgu);
  box-shadow: 0 0 0 4px rgb(168 137 76 / .18);
}
.timeline__card {
  flex: 1;
  display: grid;
  align-content: start;
  gap: var(--bosluk-2);
}
.timeline__year {
  font-family: var(--f-display);
  font-size: var(--yazi-4xl);
  font-weight: 500;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  color: var(--vurgu-metin);
}
.timeline__title { font-size: var(--yazi-xl); margin: 0; text-wrap: balance; }
.timeline__text { color: var(--metin-ikincil); margin: 0; max-width: 30ch; }

@media (min-width: 900px) {
  .timeline__list {
    grid-auto-flow: column;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--oluk);
  }
  .timeline__list::before {
    left: 0;
    right: 0;
    top: 6px;
    bottom: auto;
    width: auto;
    height: 2px;
    background: linear-gradient(to right, var(--cizgi-guclu) 80%, transparent);
  }
  .timeline__item { padding-left: 0; padding-top: var(--bosluk-7); }
  .timeline__dot { left: 0; top: 0; transform: none; }
}

/* ==============================================================
   rakamlar — görsel destekli sayaç
   ============================================================== */
.stats__inner { display: grid; gap: var(--bosluk-7); }
.stats__image { --oran: 4 / 3; }
.stats__text { display: grid; gap: var(--bosluk-6); align-content: center; }
.stats__text .section-heading { margin-bottom: 0; }

.stats__list { display: grid; grid-template-columns: 1fr 1fr; gap: var(--bosluk-6) var(--bosluk-5); }
.stats__item { padding-top: var(--bosluk-4); border-top: 1px solid var(--cizgi-guclu); }
.stats__number {
  display: block;
  font-family: var(--f-display);
  font-size: var(--yazi-4xl);
  line-height: .95;
  letter-spacing: -.03em;
}
.stats__label { font-size: var(--yazi-sm); color: var(--metin-ikincil); margin-top: var(--bosluk-2); display: block; }

@media (min-width: 900px) {
  .stats__inner { grid-template-columns: 6fr 6fr; gap: var(--bosluk-9); align-items: center; }
  .stats__image { --oran: 4 / 5; }
}

/* ==============================================================
   menu-vitrin  (mobil: scroll-snap + peek / masaüstü: 4 kolon)
   ============================================================== */
.menu-showcase__list {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 78%;
  gap: var(--bosluk-6);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-padding-inline: var(--kenar);
  padding-inline: var(--kenar);
  margin-inline: calc(var(--kenar) * -1);
  padding-bottom: var(--bosluk-4);
  scrollbar-width: thin;
  overscroll-behavior-x: contain;
}
.menu-showcase__list > * { scroll-snap-align: start; }
@media (min-width: 640px) {
  .menu-showcase__list { grid-auto-flow: row; grid-template-columns: repeat(2, 1fr); overflow: visible; padding-inline: 0; margin-inline: 0; }
}
@media (min-width: 900px) { .menu-showcase__list { grid-template-columns: repeat(4, 1fr); } }

.menu-item__top { display: flex; align-items: baseline; gap: var(--bosluk-3); margin-bottom: var(--bosluk-1); }
.menu-item__price { margin-left: auto; font-family: var(--f-display); font-size: var(--yazi-xl); white-space: nowrap; }
.menu-item__dot { flex: 1; border-bottom: 1px dotted var(--cizgi-guclu); transform: translateY(-4px); }

/* ==============================================================
   sube-listesi  (1 kolon -> 3 kolon)
   ============================================================== */
.branch-list__list { display: grid; gap: var(--bosluk-7) var(--oluk); }
@media (min-width: 900px) { .branch-list__list { grid-template-columns: repeat(3, 1fr); } }
.branch__info { display: grid; gap: var(--bosluk-2); font-size: var(--yazi-sm); color: var(--metin-ikincil); }
.branch__actions { display: grid; gap: var(--bosluk-3); justify-items: start; }
.branch__actions .btn--primary { width: 100%; }
.card__actions.branch__actions .btn--secondary { width: 100%; }
/* Kart linki ::after ile tüm kartı kaplar; butonlar ve telefon üstte kalıp tıklanabilsin */
.card--link .branch__actions, .card--link .branch__phone { position: relative; z-index: 1; }
.branch__secondary { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: var(--bosluk-3); width: 100%; }
.branch__secondary .btn { padding-inline: var(--bosluk-3); }
.branch__phone { display: inline-flex; align-items: center; gap: var(--bosluk-2); min-height: 44px; color: var(--metin); text-decoration: none; justify-self: start; }
@media (hover: hover) { .branch__phone:hover { color: var(--vurgu-metin); } }
.branch__note { display: inline-flex; align-items: center; gap: var(--bosluk-2); color: var(--metin); font-size: var(--yazi-sm); }

/* ==============================================================
   galeri-onizleme
   ============================================================== */
/* Bölüm aksiyonu ortada değil, içerikle aynı hizada — göz zaten sol kenarda. */
.gallery-preview .gallery { margin-top: var(--bosluk-7); }
.gallery-preview__sub { margin-top: var(--bosluk-7); display: flex; justify-content: flex-start; }

/* ==============================================================
   cta-bant
   ============================================================== */
.cta-band__inner { display: grid; gap: var(--bosluk-5); text-align: center; justify-items: center; }
.cta-band__text { max-width: 52ch; color: var(--metin-ikincil); }
.cta-band__inner > div:first-child { display: grid; gap: var(--bosluk-3); }
@media (min-width: 900px) {
  .cta-band__inner { grid-template-columns: 1fr auto; text-align: left; justify-items: start; align-items: center; gap: var(--bosluk-8); }
}

/* ==============================================================
   sss — başlık solda sabit, sorular sağda
   ============================================================== */
.faq__inner { display: grid; gap: var(--bosluk-6); }
.faq__title .section-heading { margin-bottom: 0; }
.faq__list { display: grid; }

.faq__item { border-bottom: 1px solid var(--cizgi); }
.faq__item:first-child { border-top: 1px solid var(--cizgi); }
.faq__question {
  display: flex; align-items: center; justify-content: space-between; gap: var(--bosluk-4);
  padding-block: var(--bosluk-4);
  font-family: var(--f-display); font-size: var(--yazi-lg);
  cursor: pointer; list-style: none;
}
.faq__question::-webkit-details-marker { display: none; }
.faq__question::after { content: "+"; font-family: var(--f-govde); font-size: var(--yazi-xl); color: var(--vurgu-metin); }
.faq__item[open] .faq__question::after { content: "\2013"; }
.faq__answer { padding-bottom: var(--bosluk-4); color: var(--metin-ikincil); max-width: 62ch; font-size: var(--yazi-sm); }

@media (min-width: 900px) {
  .faq__inner { grid-template-columns: 4fr 8fr; gap: var(--bosluk-9); align-items: start; }
  .faq__title { position: sticky; top: calc(var(--header-y) + var(--bosluk-6)); }
  .faq__question { font-size: var(--yazi-xl); }
  .faq__answer { font-size: var(--yazi-base); }
}

/* ==============================================================
   harita — Leaflet + CartoDB Positron (editöryal, marka uyumlu)
   ============================================================== */
.map__frame {
  position: relative;
  border-radius: var(--r-md);
  overflow: hidden;
  isolation: isolate;
  box-shadow:
    inset 0 0 0 1px rgba(14, 31, 38, .08),
    0 30px 60px -40px rgba(14, 31, 38, .28);
}
.map__canvas {
  width: 100%;
  height: 280px;
  background: var(--zemin-alt);
  z-index: 0;                      /* Leaflet katmanları header'ın üstüne çıkmasın */
}
/* Karolara çok hafif ton denklemi — renkleri koru, sadece nefes ver */
.map__canvas .leaflet-tile-pane { filter: saturate(1) contrast(1); }

/* Üstte ve altta yumuşak vignette; harita kartla yumuşak bağlansın */
.map__frame::after {
  content: "";
  position: absolute; inset: 0;
  pointer-events: none;
  background:
    linear-gradient(to bottom, rgba(14, 31, 38, .08), transparent 12%, transparent 82%, rgba(14, 31, 38, .12));
  z-index: 1;
}

.map__canvas .leaflet-control-attribution {
  font-size: 10px;
  padding: 2px 8px;
  background: rgb(251 249 246 / .92);
  color: var(--metin-ikincil);
  border-top-left-radius: var(--r-sm);
}
.map__canvas .leaflet-control-attribution a { color: var(--vurgu-metin); }
.map__canvas .leaflet-bar a {
  width: 34px; height: 34px; line-height: 34px;
  color: var(--marka-koyu); border-radius: 0;
}

/* --- Pin: nabız halkalı zarif nokta -------------------------- */
.map__marker-box { pointer-events: auto; }
.map__marker {
  position: relative;
  display: block;
  width: 22px;
  height: 22px;
}
.map__marker-dot {
  position: absolute; inset: 0;
  border-radius: 50%;
  background: var(--marka-koyu);
  border: 3px solid var(--marka-vurgu);
  box-shadow:
    0 0 0 3px rgb(255 255 255 / .95),
    0 6px 14px rgb(14 31 38 / .35);
  z-index: 2;
}
.map__marker-ring {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 2px solid var(--marka-vurgu);
  transform-origin: center;
  animation: harita-nabiz 2.4s cubic-bezier(.22, .61, .36, 1) infinite;
  opacity: 0;
  z-index: 1;
}
.map__marker-ring--delayed { animation-delay: 1.2s; }
@keyframes harita-nabiz {
  0%   { transform: scale(1);   opacity: .55; }
  70%  { opacity: 0; }
  100% { transform: scale(2.8); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .map__marker-ring { animation: none; opacity: 0; }
}

/* Popup — beyaz kart, marka tipografisi */
.map__canvas .leaflet-popup-content-wrapper {
  border-radius: var(--r-sm);
  padding: 4px 6px;
  background: var(--zemin-yukseltilmis);
  box-shadow: 0 12px 30px -10px rgb(14 31 38 / .35);
}
.map__canvas .leaflet-popup-content { font-size: var(--yazi-sm); color: var(--metin); margin: 10px 14px; }
.map__canvas .leaflet-popup-content strong { font-family: var(--f-display); font-weight: 500; }
.map__canvas .leaflet-popup-tip { background: var(--zemin-yukseltilmis); }

.map__card {
  margin-top: var(--bosluk-5);
  display: grid; gap: var(--bosluk-4);
  padding: var(--bosluk-5);
  background: var(--zemin-yukseltilmis);
  border: 1px solid var(--cizgi);
  border-radius: var(--r-md);
}

@media (min-width: 640px) { .map__canvas { height: 360px; } }
@media (min-width: 900px) {
  .map__canvas { height: 520px; }
  .map__card {
    position: absolute; top: var(--bosluk-6); left: var(--bosluk-6);
    width: 340px; margin-top: 0; z-index: 1;
    box-shadow: var(--golge-katman);
  }
}

/* ==============================================================
   rezervasyon-blok
   ============================================================== */
.reservation-band__inner { display: grid; gap: var(--bosluk-6); }
@media (min-width: 900px) {
  .reservation-band__inner { grid-template-columns: 5fr 7fr; gap: var(--bosluk-9); align-items: center; }
}
.reservation-band .btn-group .btn { flex: 1 1 0; padding-inline: var(--bosluk-5); white-space: nowrap; }
.reservation-summary { display: grid; gap: var(--bosluk-4); }
.reservation-summary__row { display: flex; justify-content: space-between; gap: var(--bosluk-4); padding-block: var(--bosluk-3); border-bottom: 1px solid var(--cizgi); font-size: var(--yazi-sm); }

/* ==============================================================
   rezervasyon — v-2 §7.1 spec, v-1 editöryal dille
   ============================================================== */

/* [hidden] güvencesi: aşağıdaki bileşen kuralları display: grid/flex
   ile UA'nın hidden {display:none} varsayılanını ezmesin. */
.reservation [hidden] { display: none !important; }

.reservation .container { display: flex; flex-direction: column; align-items: center; }
.reservation .container > * { width: 100%; }
.reservation .section-heading { text-align: center; justify-items: center; margin-bottom: var(--bosluk-6); }
.reservation .section-heading__sub { max-width: 58ch; }

/* --- Şube tab bar — editöryal underline (v-1 header nav dili) --- */
.reservation__branches {
  display: flex;
  justify-content: center;
  gap: var(--bosluk-6);
  margin-bottom: var(--bosluk-8);
  border-bottom: 1px solid var(--cizgi);
}
.reservation__tab {
  position: relative;
  min-height: 48px;
  padding: var(--bosluk-3) var(--bosluk-2);
  font-family: var(--f-govde);
  font-size: var(--yazi-sm);
  font-weight: 500;
  letter-spacing: var(--harf-ustluk);
  text-transform: uppercase;
  color: var(--metin-ikincil);
  transition: color var(--gecis);
}
.reservation__tab::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -1px;
  height: 2px;
  background: var(--vurgu);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform var(--gecis);
}
.reservation__tab[aria-selected="true"] {
  color: var(--metin);
}
.reservation__tab[aria-selected="true"]::after { transform: scaleX(1); }
@media (hover: hover) {
  .reservation__tab:not([aria-selected="true"]):hover { color: var(--metin); }
  .reservation__tab:not([aria-selected="true"]):hover::after { transform: scaleX(.4); }
}

/* --- Ana iki kolon --- */
.reservation__inner { display: grid; gap: var(--bosluk-6); }
@media (min-width: 900px) {
  .reservation__inner { grid-template-columns: 7fr 5fr; gap: var(--bosluk-7); align-items: start; }
  .reservation__form { position: sticky; top: calc(var(--header-y) + var(--bosluk-6)); }
}

/* --- Sol kolon (çerçevesiz, editorial) --- */
.reservation__plan-col { display: block; }
.reservation__panel { display: grid; gap: var(--bosluk-5); }

/* --- Kroki/Liste toggle — küçük iki metin buton + underline --- */
.reservation__view {
  display: inline-flex;
  gap: var(--bosluk-5);
  padding-bottom: var(--bosluk-2);
  border-bottom: 1px solid var(--cizgi);
  align-self: start;
}
.reservation__view-btn {
  position: relative;
  min-height: 32px;
  padding: 0 2px;
  font-size: var(--yazi-xs);
  font-weight: 500;
  letter-spacing: var(--harf-ustluk);
  text-transform: uppercase;
  color: var(--metin-ikincil);
  transition: color var(--gecis);
}
.reservation__view-btn::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: calc(var(--bosluk-2) * -1 - 1px);
  height: 1px;
  background: var(--vurgu);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform var(--gecis);
}
.reservation__view-btn[aria-selected="true"] { color: var(--metin); }
.reservation__view-btn[aria-selected="true"]::after { transform: scaleX(1); }

/* --- SVG kroki --- */
.reservation__plan {
  width: 100%;
  aspect-ratio: 4 / 3;
  background: var(--notr-kum);
  border-radius: var(--r-sm);
  overflow: hidden;
}
.floor-plan { display: block; width: 100%; height: 100%; }
.floor-plan__frame {
  fill: none;
  stroke: var(--cizgi-guclu);
  stroke-dasharray: 6 6;
  stroke-width: 1;
}
.floor-plan__zone { cursor: pointer; transition: transform var(--gecis); }
.floor-plan__zone:focus { outline: none; }
.floor-plan__base {
  fill: var(--zemin-yukseltilmis);
  stroke: var(--cizgi-guclu);
  stroke-dasharray: 4 4;
  stroke-width: 1;
  transition: fill var(--gecis), stroke var(--gecis), stroke-width var(--gecis), stroke-dasharray var(--gecis);
}
@media (hover: hover) {
  .floor-plan__zone:not(.floor-plan__zone--full):hover .floor-plan__base {
    fill: #FFFFFF;
    stroke: var(--marka);
  }
}
.floor-plan__zone:focus-visible .floor-plan__base {
  stroke: var(--odak);
  stroke-width: 2;
  stroke-dasharray: none;
}
.floor-plan__zone[aria-pressed="true"] .floor-plan__base {
  fill: var(--marka-vurgu);
  stroke: var(--marka-koyu);
  stroke-width: 2;
  stroke-dasharray: none;
}
.floor-plan__zone--full { cursor: not-allowed; }
.floor-plan__zone--full .floor-plan__base {
  fill: var(--notr-kum);
  stroke: var(--cizgi);
}

/* Foreign object içi HTML etiket */
.floor-plan__label {
  width: 100%; height: 100%;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: var(--bosluk-2);
  padding: var(--bosluk-3);
  text-align: center;
  color: var(--metin);
  font-family: var(--f-govde);
  pointer-events: none;
}
.floor-plan__icon { color: var(--metin-ikincil); font-size: 24px; }
.floor-plan__zone[aria-pressed="true"] .floor-plan__icon,
.floor-plan__zone[aria-pressed="true"] .floor-plan__name,
.floor-plan__zone[aria-pressed="true"] .floor-plan__status { color: var(--marka-koyu); }
.floor-plan__name { font-family: var(--f-display); font-size: var(--yazi-lg); line-height: 1.1; }
.floor-plan__status {
  font-size: 10px;
  letter-spacing: var(--harf-ustluk);
  text-transform: uppercase;
  color: var(--metin-ikincil);
}
.floor-plan__zone--full .floor-plan__name,
.floor-plan__zone--full .floor-plan__icon { opacity: .5; }
.floor-plan__zone--full .floor-plan__status { color: var(--metin); font-weight: 500; opacity: .7; }

/* Motion — breathing hint (§5.3 v-2 MASTER) */
@media (prefers-reduced-motion: no-preference) {
  .reservation__panel[data-nefes="1"] .floor-plan__zone:not(.floor-plan__zone--full) .floor-plan__base {
    animation: rez-nefes 1.6s ease-in-out 2;
  }
}
@keyframes rez-nefes {
  0%, 100% { opacity: 1; }
  50%      { opacity: .55; }
}

/* --- Liste görünüm — editorial satır (v-1 menu-liste diline yakın) --- */
.reservation__list {
  display: grid;
  list-style: none;
  padding: 0;
  margin: 0;
  border-top: 1px solid var(--cizgi);
}
.reservation__list li { border-bottom: 1px solid var(--cizgi); }
.reservation__list-btn {
  width: 100%;
  display: grid;
  grid-template-columns: 24px 1fr auto;
  align-items: center;
  gap: var(--bosluk-4);
  padding: var(--bosluk-4) var(--bosluk-3);
  background: transparent;
  border: 0;
  text-align: left;
  transition: background-color var(--gecis);
}
.reservation__list-btn .icon { color: var(--metin-ikincil); font-size: 20px; }
.reservation__list-name { font-family: var(--f-display); font-size: var(--yazi-lg); }
.reservation__list-status {
  font-size: var(--yazi-xs);
  letter-spacing: var(--harf-ustluk);
  text-transform: uppercase;
  color: var(--metin-ikincil);
  white-space: nowrap;
}
.reservation__list-btn[aria-pressed="true"] {
  background: rgb(168 137 76 / .16);
  box-shadow: inset 3px 0 0 var(--vurgu);
}
.reservation__list-btn[aria-pressed="true"] .reservation__list-name { color: var(--marka-koyu); }
.reservation__list-btn[aria-pressed="true"] .reservation__list-status { color: var(--vurgu-metin); }
.reservation__list-btn[disabled] { opacity: .5; cursor: not-allowed; }
@media (hover: hover) {
  .reservation__list-btn:not([disabled]):not([aria-pressed="true"]):hover { background: rgb(14 31 38 / .04); }
}

/* --- Lejant + ipucu --- */
.reservation__legend {
  display: flex; flex-wrap: wrap; gap: var(--bosluk-5);
  font-size: var(--yazi-xs);
  color: var(--metin-ikincil);
}
.floor-legend { display: inline-flex; align-items: center; gap: var(--bosluk-2); }
.floor-legend__dot {
  width: 10px; height: 10px; border-radius: var(--r-sm);
  border: 1px solid var(--cizgi-guclu);
}
.floor-legend__dot--available { background: var(--zemin-yukseltilmis); }
.floor-legend__dot--selected { background: var(--marka-vurgu); border-color: var(--marka-koyu); }
.floor-legend__dot--full   { background: var(--notr-kum); }
.reservation__hint {
  font-size: var(--yazi-xs);
  color: var(--metin-ikincil);
  text-align: center;
  font-style: italic;
}

/* --- Sağ kolon (form) — editorial, üstte brass şerit --- */
.reservation__form {
  display: grid;
  gap: var(--bosluk-6);
  padding: var(--bosluk-7) 0 0;
  border-top: 2px solid var(--vurgu);
}

/* Seçili bölge duyuru paneli — v-1 ustluk çizgisi diliyle */
.reservation__selection {
  display: grid;
  gap: var(--bosluk-2);
  padding: var(--bosluk-5) 0;
  border-bottom: 1px solid var(--cizgi);
}
.reservation__selection .eyebrow { display: flex; align-items: center; gap: var(--bosluk-3); }
.reservation__selection .eyebrow::after {
  content: "";
  flex: 0 0 32px;
  height: 1px;
  background: var(--vurgu);
}
.reservation__selection-name {
  font-family: var(--f-display);
  font-size: var(--yazi-xl);
  font-style: italic;
  color: var(--metin);
}
.reservation__form[data-hazir="true"] .reservation__selection-name { font-style: normal; }
.reservation__selection-hint { font-size: var(--yazi-sm); color: var(--metin-ikincil); }

/* Bölge seçilmeden gerisi kilit */
.reservation__rest { display: grid; gap: var(--bosluk-5); }
.reservation__form[data-hazir="false"] .reservation__rest {
  opacity: .55;
  pointer-events: none;
  filter: saturate(.6);
}

/* Kişi sayacı */
.stepper {
  display: grid;
  grid-template-columns: 44px 1fr 44px;
  align-items: center;
  min-height: 48px;
  background: var(--zemin-yukseltilmis);
  border: 1px solid var(--cizgi-guclu);
  border-radius: var(--r-sm);
  overflow: hidden;
}
.stepper__btn {
  min-height: 46px;
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--metin);
  transition: background-color var(--gecis);
}
.stepper__btn:hover { background: var(--notr-kum); }
.stepper__input {
  border: 0;
  background: transparent;
  text-align: center;
  font-family: var(--f-govde);
  font-size: var(--yazi-base);
  font-weight: 500;
  -moz-appearance: textfield;
}
.stepper__input::-webkit-outer-spin-button,
.stepper__input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

/* Saat çipleri */
.reservation__times { border: 0; padding: 0; margin: 0; display: grid; gap: var(--bosluk-3); }
.reservation__times .field__label { display: block; margin-bottom: var(--bosluk-2); }
.reservation__service { color: var(--vurgu-metin); margin-top: var(--bosluk-2); }
.time-chip__group { display: flex; flex-wrap: wrap; gap: var(--bosluk-2); }
.time-chip {
  position: relative;
  cursor: pointer;
}
.time-chip input[type="radio"] {
  position: absolute; opacity: 0; inset: 0;
}
.time-chip span {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 68px; min-height: 36px;
  padding: 0 var(--bosluk-4);
  border: 1px solid var(--cizgi-guclu);
  border-radius: var(--r-tam);          /* v-1 karakteri: rozetle aynı pill */
  font-size: var(--yazi-sm);
  color: var(--metin);
  transition: background-color var(--gecis), border-color var(--gecis), color var(--gecis);
}
@media (hover: hover) {
  .time-chip:hover span { border-color: var(--marka); }
}
.time-chip input:checked + span {
  background: var(--marka-koyu);
  border-color: var(--marka-koyu);
  color: var(--metin-ters);
}
.time-chip input:focus-visible + span { outline: 2px solid var(--odak); outline-offset: 2px; }

/* --- Mobil (≤ 899) --- */
@media (max-width: 899px) {
  .reservation__branches {
    width: 100%;
    overflow-x: auto;
    justify-content: flex-start;         /* center → sol hizala, ilk sekme kesilmesin */
    gap: var(--bosluk-4);
    margin-inline: calc(var(--kenar) * -1);
    padding-inline: var(--kenar);
    margin-bottom: var(--bosluk-5);      /* 64 → 24, tab ile form arası nefes */
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .reservation__branches::-webkit-scrollbar { display: none; }
  .reservation__tab {
    flex: 0 0 auto;                       /* büyümesin — içerik kadar yer alsın */
    scroll-snap-align: start;
    white-space: nowrap;
  }
  .reservation__plan-col { padding: var(--bosluk-4); }
  .reservation__form { padding: var(--bosluk-5); }
  .reservation__inner--single { margin-top: 0; } /* subeler'in margin-bottom'ı yeter */
}

/* --- Çok dar ekran (≤ 420) — tab & form sıkışıklığı --- */
@media (max-width: 420px) {
  .reservation__branches {
    gap: var(--bosluk-3);
    /* sağda daha fazla sekme olduğuna dair yumuşak fade */
    -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 28px), transparent);
            mask-image: linear-gradient(to right, #000 calc(100% - 28px), transparent);
  }
  .reservation__tab {
    padding: var(--bosluk-3) 0;
    letter-spacing: .04em;
    font-size: var(--yazi-xs);
  }
}

/* --------------------------------------------------------------
   Rezervasyon — tekli form varyantı (kroki/liste kaldırıldı)
   Formu tek kolon, ortalanmış, kart hissiyle sunar.
   -------------------------------------------------------------- */
.reservation__inner--single { grid-template-columns: 1fr !important; }
@media (min-width: 900px) {
  .reservation__inner--single { grid-template-columns: 1fr !important; }
}

.reservation__form--single {
  position: static !important;
  width: 100%;
  max-width: 780px;
  margin: 0 auto;
  padding: var(--bosluk-7) var(--bosluk-6);
  background: var(--zemin-yukseltilmis, #FFFFFF);
  border: 1px solid var(--cizgi);
  border-top: 3px solid var(--vurgu);
  border-radius: var(--r-sm);
  box-shadow: 0 24px 60px -40px rgba(14, 31, 38, .18);
  gap: var(--bosluk-6);
}

@media (max-width: 899px) {
  .reservation__form--single {
    padding: var(--bosluk-6) var(--bosluk-5);
    box-shadow: none;
    width: 100%;
    max-width: none;
    margin-inline: auto;
    justify-self: stretch;
  }
}

/* Çok dar ekranda (≤ 420) form nefes alsın: yatay padding daralt */
@media (max-width: 420px) {
  .reservation__form--single {
    padding: var(--bosluk-5) var(--bosluk-4);
    gap: var(--bosluk-5);
  }
  .reservation__form-header {
    padding-bottom: var(--bosluk-4);
  }
  .reservation__form-title {
    font-size: 1.5rem;
  }
  .reservation__form--single .reservation__rest {
    gap: var(--bosluk-5);
  }
  /* KVKK metni kırılıp uzun link viewport dışına taşmasın */
  .reservation__form--single .consent { column-gap: var(--bosluk-2); }
  .reservation__form--single .consent__text { word-break: break-word; }
  /* Saat çipleri dar ekranda daha kompakt sığsın */
  .time-chip span {
    min-width: 60px;
    padding-inline: var(--bosluk-3);
  }
  .time-chip__group { gap: var(--bosluk-2); }
}

/* Form başlık bloğu */
.reservation__form-header {
  display: grid;
  gap: var(--bosluk-2);
  padding-bottom: var(--bosluk-5);
  border-bottom: 1px solid var(--cizgi);
  text-align: left;
}
.reservation__form-header .eyebrow {
  display: inline-flex;
  align-items: center;
  gap: var(--bosluk-3);
  color: var(--vurgu-metin);
}
.reservation__form-header .eyebrow::after {
  content: "";
  flex: 0 0 40px;
  height: 1px;
  background: var(--vurgu);
}
.reservation__form-title {
  font-family: var(--f-display);
  font-weight: 500;
  font-size: clamp(1.6rem, 2.4vw, 2.1rem);
  line-height: 1.15;
  color: var(--marka-koyu);
  margin: 0;
}
.reservation__form-help {
  color: var(--metin-ikincil);
  font-size: var(--yazi-sm);
  max-width: 56ch;
  margin: 0;
}

/* Tekli formda kilit kaldırılır */
.reservation__form--single[data-hazir="true"] .reservation__rest {
  opacity: 1;
  pointer-events: auto;
  filter: none;
}
.reservation__form--single .reservation__rest {
  gap: var(--bosluk-6);
  grid-auto-rows: min-content;   /* row'lar içerik boyu — textarea/onay stretch olmasın */
}
.reservation__form--single .field { align-self: start; }

/* Not textarea: rows="3" değerine sadık kal, stretch olmasın */
.reservation__form--single .textarea {
  min-height: 96px;
  height: 96px;
  max-height: 240px;
  resize: vertical;
  display: block;
}

/* Tekli form içinde 2 kolonlu alan */
.reservation__form--single .form-grid--two {
  display: grid;
  gap: var(--bosluk-5);
}
@media (min-width: 640px) {
  .reservation__form--single .form-grid--two {
    grid-template-columns: 1fr 1fr;
  }
}

/* Onay ve gönder butonuna hafif üst çizgi */
.reservation__form--single .consent {
  padding-top: var(--bosluk-4);
  border-top: 1px dashed var(--cizgi);
}
.reservation__form--single .btn[type="submit"] {
  margin-top: var(--bosluk-2);
}

/* Sekmeler ile form arası nefes (masaüstü) */
.reservation__inner--single { margin-top: var(--bosluk-6); }
@media (max-width: 899px) {
  .reservation__inner--single { margin-top: 0; }
}

/* ==============================================================
   menu-liste — kategoriler solda sabit, ürünler sağda
   ============================================================== */
.menu-list__note { color: var(--metin-ikincil); max-width: 60ch; margin-bottom: var(--bosluk-7); }
.menu-list__inner { display: grid; gap: var(--bosluk-7); }

.menu-list__nav {
  display: flex; gap: var(--bosluk-4);
  overflow-x: auto; padding-bottom: var(--bosluk-3);
  border-bottom: 1px solid var(--cizgi);
  scrollbar-width: thin;
}
.menu-list__nav a {
  white-space: nowrap; text-decoration: none;
  min-height: 44px; display: inline-flex; align-items: center;
  font-size: var(--yazi-sm); color: var(--metin-ikincil);
}
.menu-list__nav a:hover { color: var(--metin); }

.menu-list__groups { display: grid; gap: var(--bosluk-9); }
.menu-group__title { font-size: var(--yazi-2xl); margin-bottom: var(--bosluk-5); }
.menu-group__list { display: grid; gap: var(--bosluk-6); align-items: start; }

.menu-item { display: grid; grid-template-columns: 88px 1fr; gap: var(--bosluk-4); align-items: start; align-content: start; }
.menu-item__body { display: grid; gap: var(--bosluk-1); align-content: start; }
.menu-item__image {
  width: 88px; aspect-ratio: 1; padding: 0;
  border: 1px solid var(--cizgi); border-radius: var(--r-md);
  overflow: hidden; background: var(--zemin-alt);
  display: grid; place-items: center;
}
.menu-item__image .image { transition: transform var(--gecis-yavas); }
button.menu-item__image { cursor: zoom-in; }
button.menu-item__image:focus-visible { outline: 2px solid var(--odak); outline-offset: 2px; }
@media (hover: hover) { button.menu-item__image:hover .image { transform: scale(1.06); } }
.menu-item__image--empty .icon { color: var(--metin-ikincil); opacity: .45; }
.menu-item__name { font-family: var(--f-display); font-size: var(--yazi-lg); font-weight: 500; }
.menu-item__desc { color: var(--metin-ikincil); font-size: var(--yazi-sm); }
.menu-item__tags { display: flex; flex-wrap: wrap; gap: var(--bosluk-2); margin-top: var(--bosluk-2); list-style: none; padding: 0; }
.menu-item__tags .badge { padding: 3px var(--bosluk-2); font-size: 0.6875rem; line-height: 1.5; }

@media (min-width: 900px) {
  .menu-list__inner { grid-template-columns: 3fr 9fr; gap: var(--bosluk-9); align-items: start; }
  .menu-list__nav {
    position: sticky; top: calc(var(--header-y) + var(--bosluk-6));
    flex-direction: column; gap: var(--bosluk-1);
    overflow: visible; border-bottom: 0; border-left: 1px solid var(--cizgi);
    padding-bottom: 0; padding-left: var(--bosluk-4);
  }
  .menu-group__list { grid-template-columns: 1fr 1fr; gap: var(--bosluk-7) var(--bosluk-8); }
}

/* ==============================================================
   iletisim
   ============================================================== */
.contact__inner { display: grid; gap: var(--bosluk-8); }
.contact__aside { display: grid; gap: var(--bosluk-5); align-content: start; }
.contact__aside .section-heading { margin-bottom: 0; }
.contact__form { align-content: start; }
.contact__form-reservation-note {
  margin-top: var(--bosluk-2);
  padding-top: var(--bosluk-5);
  border-top: 1px solid var(--cizgi);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--bosluk-4);
  color: var(--metin-ikincil);
  font-size: var(--yazi-sm);
}

@media (min-width: 900px) {
  .contact__inner { grid-template-columns: 5fr 7fr; gap: var(--bosluk-9); align-items: start; }
}

/* ==============================================================
   sube-iletisim — İletişim sayfasındaki 3 sade şube kartı
   ============================================================== */
.branch-contact__list {
  display: grid;
  gap: var(--oluk);
  padding: 0;
  margin: 0;
  list-style: none;
}
.branch-contact__card {
  display: flex;
  flex-direction: column;
  background: var(--zemin-yukseltilmis);
  border: 1px solid var(--cizgi);
  border-radius: var(--r-md);
  overflow: hidden;
}
.branch-contact__image { aspect-ratio: 16 / 9; overflow: hidden; background: var(--zemin-alt); }
.branch-contact__body { display: flex; flex-direction: column; flex: 1; padding: var(--bosluk-5); }
.branch-contact__name { font-size: var(--yazi-2xl); margin: 0 0 var(--bosluk-3); }
.branch-contact__address { color: var(--metin-ikincil); margin: 0 0 var(--bosluk-5); }
.branch-contact__info {
  display: grid;
  gap: var(--bosluk-3);
  margin-bottom: var(--bosluk-6);
  padding-top: var(--bosluk-5);
  border-top: 1px solid var(--cizgi);
}
.branch-contact__info a {
  display: flex;
  align-items: center;
  gap: var(--bosluk-3);
  color: var(--metin);
  text-decoration: none;
  font-size: var(--yazi-sm);
  min-width: 0;
}
.branch-contact__info a .icon { color: var(--vurgu-metin); flex-shrink: 0; }
@media (hover: hover) {
  .branch-contact__info a:hover { color: var(--vurgu-metin); }
}
.branch-contact__actions {
  margin-top: auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--bosluk-4);
}
.branch-contact__actions .btn { flex: 1 1 0; padding-inline: var(--bosluk-3); white-space: nowrap; }

@media (min-width: 640px) { .branch-contact__list { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 900px) { .branch-contact__list { grid-template-columns: repeat(3, 1fr); } }

/* ==============================================================
   harita-sekmeli — İletişim sayfasında 3 sekmeli tek harita
   ============================================================== */
.map-tabs__tabs {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--bosluk-3);
  margin-bottom: var(--bosluk-6);
}
.map-tabs__tab {
  font: inherit;
  cursor: pointer;
  min-height: 44px;
  padding: var(--bosluk-3) var(--bosluk-5);
  border: 1px solid var(--cizgi-guclu);
  border-radius: var(--r-tam);
  background: var(--zemin-yukseltilmis);
  color: var(--metin-ikincil);
  transition: border-color var(--gecis), color var(--gecis), background var(--gecis);
}
.map-tabs__tab--active {
  border-color: var(--marka-koyu);
  background: var(--marka-koyu);
  color: var(--notr-kum);
}
@media (hover: hover) {
  .map-tabs__tab:not(.map-tabs__tab--active):hover { border-color: var(--cizgi-guclu); color: var(--metin); }
}
.map-tabs__tab:focus-visible { outline: 2px solid var(--odak); outline-offset: 2px; }

/* ==============================================================
   genel-iletisim — şube kartlarından ayrı, sade telefon/e-posta şeridi
   ============================================================== */
.contact-info__inner { display: grid; justify-items: center; gap: var(--bosluk-6); text-align: center; }
.contact-info__info { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--bosluk-6); }
.contact-info__value {
  font-family: var(--f-display);
  font-size: var(--yazi-2xl);
  color: var(--metin);
}
@media (hover: hover) {
  .contact-info__value:hover { color: var(--vurgu-metin); }
}

/* ==============================================================
   belge — KVKK / Gizlilik / Çerez / İK gibi düz metin sayfaları
   ============================================================== */
.doc__updated { color: var(--metin-ikincil); font-size: var(--yazi-sm); margin-bottom: var(--bosluk-7); }
.doc__section + .doc__section { margin-top: var(--bosluk-7); }
.doc__title { font-size: var(--yazi-xl); margin-bottom: var(--bosluk-3); }

/* ==============================================================
   Mobil düzeltmeler (< 640)
   ============================================================== */
@media (max-width: 639px) {
  /* Galeri kenardan kenara: iki kolon, dar oluk */

  /* Rakamlarda görsel çok yer kaplamasın */
  .stats__image { --oran: 3 / 2; }

  /* Şube kartında aksiyonlar tam genişlik */
  .branch__actions { justify-items: stretch; }
  .branch__actions .btn--text { justify-content: center; }

  /* Menü kategorileri yatay şerit, kenara yapışmasın */
  .menu-list__nav {
    margin-inline: calc(var(--kenar) * -1);
    padding-inline: var(--kenar);
  }

  /* Uzun başlıklar taşmasın */
  h1, h2 { overflow-wrap: break-word; }

  /* Alt çubuk sabit; sayfa sonundaki buton altında kalmasın */
  .section:last-of-type { padding-bottom: calc(var(--bolum) + var(--bosluk-4)); }
}

/* ==============================================================
   sube-listesi — yatay kart (bilgi solda, harita sağda)
   ============================================================== */
.branch-row__list { display: grid; gap: var(--bosluk-5); list-style: none; padding: 0; }

.branch-row {
  display: grid;
  overflow: hidden;
  border-radius: var(--r-md);
}

.branch-row__body {
  display: grid;
  gap: var(--bosluk-6);
  align-content: space-between;
  padding: var(--bosluk-6);
}
.branch-row__top { display: grid; gap: var(--bosluk-2); }
.branch-row__name { font-size: var(--yazi-2xl); }
.branch-row__name a { text-decoration: none; }
@media (hover: hover) { .branch-row__name a:hover { text-decoration: underline; text-underline-offset: 4px; } }
.branch-row__address { color: var(--metin); }
.branch-row__hours { color: var(--metin-ikincil); font-size: var(--yazi-sm); }
.branch-row__zones {
  display: flex; flex-wrap: wrap; gap: var(--bosluk-2);
  margin-top: var(--bosluk-3); list-style: none; padding: 0;
}
.branch-row__actions { display: flex; flex-wrap: wrap; gap: var(--bosluk-3); }
.branch-row__actions .btn { white-space: nowrap; }
/* Mobilde üç buton alt alta, tam genişlik (display:flex kuralından sonra gelmeli) */
@media (max-width: 639px) { .branch-row__actions { display: grid; } }

/* Harita doğrulama öğesi: bilgiden sonra gelir, mobilde de altta. */
.branch-row__map { position: relative; aspect-ratio: 16 / 10; order: 1; }
.branch-row__canvas {
  position: absolute;
  inset: 0;
  height: 100%;
  border-radius: 0;
}

@media (min-width: 700px) {
  .branch-row { grid-template-columns: 7fr 5fr; min-height: 300px; }
  .branch-row__map { aspect-ratio: auto; height: 100%; }
  .branch-row__body { padding: var(--bosluk-7); }
}

@media (min-width: 1100px) {
  .branch-row { grid-template-columns: 8fr 4fr; min-height: 320px; }
}