/* =========================================================================
   COMPONENTS (v2 — gerçek fotoğraflar + altın/beyaz/siyah palet)
   Her blok, ileride bir ACF Flexible Content / Gutenberg block'una karşılık
   gelecek şekilde ayrı ayrı yorum satırlarıyla bölümlenmiştir.
   ========================================================================= */

/* -------------------------------------------------------------------------
   COMPONENT: Site Header / Navigation  (WP: template-part "header.php")
   ------------------------------------------------------------------------- */
.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: var(--color-ground-alt);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid transparent;
  transition: border-color var(--dur-med) var(--ease-standard), box-shadow var(--dur-med) var(--ease-standard);
}
.site-header.is-scrolled {
  border-color: var(--color-line);
  box-shadow: var(--shadow-sm);
}
.site-header__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-md);
  padding-block: var(--space-xs);
}

.brand { display: flex; flex-direction: column; align-items: center; width: max-content; max-width: 100%; gap: var(--space-3xs); text-decoration: none; color: var(--color-ink); }
.brand__mark { height: 44px; width: auto; max-width: none; aspect-ratio: 746 / 216; flex-shrink: 0; }
.brand__text { display: flex; flex-direction: column; line-height: 1.15; }
.brand__name { font-family: var(--font-display); font-weight: 400; font-size: 1.3rem; letter-spacing: 0.01em; color: var(--color-ink); }
.brand__tagline {
  display: block;
  width: 100%;
  text-align: center;
  font-family: var(--font-heading); font-weight: 600; font-size: 0.7rem;
  letter-spacing: 0.04em; text-transform: uppercase; color: var(--color-gold-deep);
  white-space: nowrap;
}

.nav-primary { display: none; }
.nav-primary__list { list-style: none; display: flex; gap: clamp(1rem, 1.6vw, 2.25rem); margin: 0; padding: 0; }
.nav-primary__list a {
  display: inline-block; white-space: nowrap;
  text-decoration: none; color: var(--color-ink);
  font-family: var(--font-heading); font-weight: 600; font-size: 1.1rem; letter-spacing: 0.01em;
  padding-block: var(--space-3xs); border-bottom: 2px solid transparent;
  transition: border-color var(--dur-fast) var(--ease-standard), color var(--dur-fast) var(--ease-standard);
}
.nav-primary__list a:hover,
.nav-primary__list a[aria-current="page"] { color: var(--color-gold-deep); border-color: var(--color-gold-bright); }

.header-actions { display: flex; align-items: center; gap: var(--space-sm); }
.header-cta { display: none; }
.call-chip {
  display: none;
  align-items: center; gap: var(--space-2xs);
  font-weight: 600; font-size: 0.9rem; color: var(--color-ink);
  text-decoration: none; white-space: nowrap; flex-shrink: 0;
}
.call-chip svg { width: 18px; height: 18px; color: var(--color-gold-deep); }

.nav-toggle {
  display: inline-flex; flex-direction: column; justify-content: center; align-items: center;
  width: 44px; height: 44px; border-radius: 50%;
  background: transparent; border: 1px solid var(--color-line); cursor: pointer;
  gap: 5px;
}
.nav-toggle span { width: 20px; height: 2px; background: var(--color-ink); transition: transform var(--dur-fast) var(--ease-standard), opacity var(--dur-fast) var(--ease-standard); }
.nav-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.nav-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Mobil menü paneli */
.nav-mobile {
  position: fixed; inset: 0 0 0 auto; width: min(340px, 86vw);
  background: var(--color-surface);
  box-shadow: var(--shadow-lg);
  transform: translateX(100%);
  transition: transform var(--dur-med) var(--ease-standard);
  z-index: 200;
  padding: var(--space-lg) var(--space-lg) var(--space-xl);
  overflow-y: auto;
}
.nav-mobile.is-open { transform: translateX(0); }
.nav-mobile__head {
  display: flex; justify-content: space-between; align-items: center;
  padding-bottom: var(--space-md);
  margin-bottom: var(--space-lg);
  border-bottom: 1px solid var(--color-line);
}
.nav-mobile__head .brand__mark { height: 34px; }
.nav-mobile__head .brand__tagline { font-size: 0.6rem; }
.nav-mobile__close {
  background: var(--color-gold-pale); border: none; border-radius: 50%;
  width: 38px; height: 38px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  color: var(--color-gold-deep); cursor: pointer;
  transition: background var(--dur-fast) var(--ease-standard), color var(--dur-fast) var(--ease-standard);
}
.nav-mobile__close svg { width: 16px; height: 16px; }
.nav-mobile__close:hover { background: var(--color-gold-deep); color: #fff; }
.nav-mobile__list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; }
.nav-mobile__list a {
  display: block; padding: var(--space-sm) 0; text-decoration: none;
  color: var(--color-ink); font-family: var(--font-heading); font-size: 1.3rem;
  border-bottom: 1px solid var(--color-line);
}
.nav-mobile__sub { list-style: none; padding-left: var(--space-sm); margin: 0 0 var(--space-sm); }
.nav-mobile__sub a { font-family: var(--font-body); font-size: 1rem; padding: var(--space-2xs) 0; border-bottom: none; color: var(--color-ink-soft); }
.nav-mobile__foot { margin-top: var(--space-lg); display: flex; flex-direction: column; gap: var(--space-sm); }

.nav-scrim {
  position: fixed; inset: 0; background: var(--color-overlay);
  opacity: 0; pointer-events: none; transition: opacity var(--dur-med) var(--ease-standard);
  z-index: 150;
}
.nav-scrim.is-visible { opacity: 1; pointer-events: auto; }

@media (min-width: 1140px) {
  .nav-primary { display: block; }
  .call-chip { display: inline-flex; }
  .nav-toggle { display: none; }
  .header-cta { display: inline-flex; }
}

.nav-primary__item--dropdown { position: relative; }
.nav-primary__dropdown {
  list-style: none; margin: 0; padding: var(--space-2xs) 0;
  position: absolute; top: 100%; left: 50%;
  transform: translateX(-50%) translateY(4px);
  background: var(--color-surface); border: 1px solid var(--color-line);
  border-radius: var(--radius-card); box-shadow: var(--shadow-md);
  min-width: 180px;
  opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard);
  z-index: 50;
}
.nav-primary__item--dropdown:hover .nav-primary__dropdown,
.nav-primary__item--dropdown:focus-within .nav-primary__dropdown {
  opacity: 1; visibility: visible; pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}
.nav-primary__dropdown a {
  display: block; padding: var(--space-2xs) var(--space-md);
  font-size: 0.9rem; font-weight: 500; white-space: nowrap;
  color: var(--color-ink); border-bottom: none;
}
.nav-primary__dropdown a:hover,
.nav-primary__dropdown a:focus-visible {
  background: var(--color-gold-pale); color: var(--color-gold-deep);
}

/* -------------------------------------------------------------------------
   COMPONENT: Hero  (WP: ACF Flexible Content "hero")
   ------------------------------------------------------------------------- */
.hero {
  position: relative;
  padding-block: var(--space-2xl) var(--space-xl);
  overflow: hidden;
  background: var(--color-ground);
}
@media (max-width: 639px) {
  .hero { padding-block: calc(var(--space-2xl) / 2) var(--space-lg); }
}
.hero__grid {
  position: relative; z-index: 1;
  display: grid; gap: var(--space-2xl);
  align-items: center;
}
.hero__copy { max-width: 40rem; }
.hero__lead { font-size: var(--fs-lead); color: var(--color-ink-soft); margin-bottom: var(--space-lg); }
.hero__actions { display: none; flex-wrap: wrap; gap: var(--space-sm); margin-bottom: var(--space-lg); }
@media (min-width: 1140px) { .hero__actions { display: flex; } }
.hero__meta { display: flex; flex-wrap: wrap; gap: var(--space-lg); list-style: none; padding: 0; margin: 0; }
.hero__meta li { display: flex; align-items: center; gap: var(--space-xs); font-size: var(--fs-small); color: var(--color-ink-soft); }
.hero__meta li > span:last-child { display: flex; flex-direction: column; line-height: 1.35; }
.hero__meta strong { color: var(--color-ink); font-family: var(--font-heading); font-size: 1.05rem; font-weight: 400; line-height: 1.25; }
.hero__meta-icon {
  display: flex; align-items: center; justify-content: center;
  width: 38px; height: 38px;
  flex-shrink: 0;
  border-radius: 50%;
  background: var(--color-gold-pale);
  color: var(--color-gold-deep);
}
.hero__meta-icon svg { width: 18px; height: 18px; }

.hero__visual { position: relative; }
.hero__visual .img-frame { --ar: 1/1; position: relative; z-index: 1; }
.hero__visual-frame {
  position: absolute;
  inset: 14px -14px -14px 14px;
  border: 1px solid var(--color-gold);
  border-radius: var(--radius-frame);
  z-index: 0;
}

@media (min-width: 960px) {
  .hero__grid { grid-template-columns: 1.05fr 0.95fr; }
}

/* -------------------------------------------------------------------------
   COMPONENT: Salon Kartı  (WP: ACF Repeater "salonlar")
   Not: Salonlar birbirinden bağımsızdır (ayrı giriş) — "kat" bilgisi
   yalnızca yön bulma amaçlı küçük bir rozet olarak gösterilir, başlık
   olarak öne çıkarılmaz.
   ------------------------------------------------------------------------- */
.hall {
  display: grid; gap: var(--space-lg);
  align-items: center;
  padding-block: var(--space-xl);
}
.hall:not(:last-child) { border-bottom: 1px solid var(--color-line); }
.hall__visual { position: relative; }
.hall__visual .img-frame { --ar: 4/3; }
.hall__video-btn {
  position: absolute;
  left: var(--space-sm);
  bottom: var(--space-sm);
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: var(--space-2xs);
  padding: 0.6rem 1.1rem 0.6rem 0.7rem;
  border: none;
  border-radius: var(--radius-pill);
  background: rgba(27, 23, 19, 0.62);
  backdrop-filter: blur(2px);
  color: #fff;
  font-family: var(--font-body);
  font-weight: 600;
  font-size: var(--fs-xsmall);
  letter-spacing: 0.02em;
  cursor: pointer;
  transition: background var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard);
}
.hall__video-btn:hover { background: var(--color-gold-deep); transform: translateY(-2px); }
.hall__video-btn-icon {
  display: flex; align-items: center; justify-content: center;
  width: 26px; height: 26px;
  border-radius: 50%;
  background: var(--color-gold-bright);
  color: var(--color-black);
  flex-shrink: 0;
}
.hall__video-btn-icon svg { width: 11px; height: 11px; }
.hall__floor-badge { margin-bottom: var(--space-sm); }
.hall__body .eyebrow { display: flex; margin-bottom: var(--space-xs); }
.hall__name {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(2rem, 1.7rem + 1.6vw, 2.9rem);
  line-height: 1.1;
  color: var(--color-ink);
  position: relative;
  display: inline-block;
  padding-bottom: var(--space-sm);
  margin-bottom: var(--space-md);
}
.hall__name::after {
  content: "";
  position: absolute; left: 0; bottom: 0;
  width: 64px; height: 2px;
  background: linear-gradient(90deg, var(--color-gold-bright), var(--color-gold-deep));
}
.hall__features { list-style: none; padding: 0; margin: var(--space-md) 0; display: grid; gap: var(--space-sm) var(--space-md); grid-template-columns: repeat(auto-fit, minmax(200px,1fr)); }
.hall__features li { display: flex; gap: var(--space-xs); align-items: center; font-size: var(--fs-body); color: var(--color-ink-soft); }
.hall__features-icon {
  display: flex; align-items: center; justify-content: center;
  width: 26px; height: 26px;
  flex-shrink: 0;
  border-radius: 50%;
  background: var(--color-gold-pale);
  color: var(--color-gold-deep);
}
.hall__features-icon svg { width: 13px; height: 13px; }
.hall__cta { display: flex; flex-wrap: wrap; gap: var(--space-sm); margin-top: var(--space-md); }

@media (min-width: 900px) {
  .hall { grid-template-columns: 1fr 1fr; gap: var(--space-2xl); }
  .hall--reverse .hall__visual { order: 2; }
  .hall--reverse .hall__body { order: 1; }
}

/* -------------------------------------------------------------------------
   COMPONENT: Organizasyon Türü Kartı  (WP: CPT "organizasyon_turu")
   ------------------------------------------------------------------------- */
.org-grid { grid-template-columns: 1fr; }
@media (min-width: 640px) { .org-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 900px) { .org-grid { grid-template-columns: repeat(3, 1fr); } }
.menu-grid { grid-template-columns: 1fr; }
@media (min-width: 640px) { .menu-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .menu-grid { grid-template-columns: repeat(4, 1fr); } }
.org-card {
  position: relative;
  background: var(--color-surface);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-card);
  padding: var(--space-lg) var(--space-md) var(--space-md);
  text-align: center;
  text-decoration: none;
  color: var(--color-ink);
  display: flex; flex-direction: column; align-items: center;
  transition: transform var(--dur-fast) var(--ease-standard), box-shadow var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard);
}
.org-card:hover,
.menu-tile:hover { transform: translateY(-6px); box-shadow: var(--shadow-md); border-color: var(--color-gold-bright); }
.menu-tile { position: relative; width: 100%; font: inherit; cursor: pointer; background: var(--color-surface); border: 1px solid var(--color-line); border-radius: var(--radius-card); padding: var(--space-lg) var(--space-md) var(--space-md); text-align: center; text-decoration: none; color: var(--color-ink); display: flex; flex-direction: column; align-items: center; transition: transform var(--dur-fast) var(--ease-standard), box-shadow var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard); }
.menu-tile__icon { width: 60px; height: 60px; border-radius: 50%; background: var(--color-gold-pale); color: var(--color-gold-deep); display: flex; align-items: center; justify-content: center; margin-bottom: var(--space-sm); }
.menu-tile__icon svg { width: 28px; height: 28px; }
.menu-tile h3 { font-size: 1.2rem; margin-bottom: var(--space-2xs); }
.menu-tile p { font-size: var(--fs-small); color: var(--color-ink-soft); margin-bottom: var(--space-sm); }
.menu-tile__link { margin-top: auto; font-size: var(--fs-xsmall); font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-gold-deep); }
.org-card__icon {
  width: 60px; height: 60px; border-radius: 50%;
  background: var(--color-gold-pale); color: var(--color-gold-deep);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: var(--space-sm);
}
.org-card__icon svg { width: 28px; height: 28px; }
.org-card h3 { font-size: 1.2rem; margin-bottom: var(--space-2xs); }
.org-card p { font-size: var(--fs-small); color: var(--color-ink-soft); margin-bottom: var(--space-sm); }
.org-card__link { margin-top: auto; font-size: var(--fs-xsmall); font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-gold-deep); }

/* -------------------------------------------------------------------------
   COMPONENT: Kına Paketi Kartı
   ------------------------------------------------------------------------- */
.package-grid { grid-template-columns: 1fr; }
@media (min-width: 780px) { .package-grid { grid-template-columns: repeat(2, 1fr); align-items: stretch; } }
.package-card {
  position: relative;
  display: flex;
  flex-direction: column;
  background: var(--color-surface);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-frame);
  box-shadow: var(--shadow-sm);
  padding: var(--space-lg);
  transition: box-shadow var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard);
}
.package-card:hover { box-shadow: var(--shadow-md); border-color: var(--color-gold-bright); }
.package-card__head { margin-bottom: var(--space-md); }
.package-card__name {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(1.6rem, 1.4rem + 0.8vw, 2rem);
  margin-bottom: var(--space-3xs);
}
.package-card__note { color: var(--color-ink-soft); font-size: var(--fs-small); }
.package-card__list {
  list-style: none; margin: 0 0 var(--space-lg); padding: 0;
  display: grid; gap: var(--space-2xs);
  flex-grow: 1;
}
.package-card__list li {
  display: flex; gap: var(--space-xs); align-items: flex-start;
  font-size: var(--fs-small); color: var(--color-ink-soft);
  padding-block: var(--space-3xs);
}
.package-card__list li::before {
  content: "";
  flex-shrink: 0;
  width: 16px; height: 16px;
  margin-top: 0.15em;
  border-radius: 50%;
  background: var(--color-gold-pale);
  background-image: linear-gradient(135deg, var(--color-gold-bright), var(--color-gold-deep));
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/></svg>") center / 11px no-repeat;
  mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/></svg>") center / 11px no-repeat;
}
.package-card__actions { display: flex; flex-wrap: wrap; gap: var(--space-sm); margin-top: auto; }

.addon-note {
  grid-column: 1 / -1;
  display: flex;
  gap: var(--space-md);
  align-items: flex-start;
  background: var(--color-surface);
  border: 1px solid var(--color-line);
  border-left: 3px solid var(--color-gold-bright);
  border-radius: var(--radius-frame);
  box-shadow: var(--shadow-sm);
  padding: var(--space-lg);
  transition: box-shadow var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard);
}
.addon-note:hover { box-shadow: var(--shadow-md); border-left-color: var(--color-gold-deep); }
.addon-note__icon {
  flex-shrink: 0;
  width: 52px; height: 52px;
  border-radius: 50%;
  background: var(--color-gold-pale);
  color: var(--color-gold-deep);
  display: flex; align-items: center; justify-content: center;
}
.addon-note__icon svg { width: 24px; height: 24px; }
.addon-note__body { min-width: 0; }
.addon-note__eyebrow {
  display: block;
  font-size: var(--fs-xsmall);
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--color-gold-deep);
  margin-bottom: var(--space-3xs);
}
.addon-note__title { font-family: var(--font-display); font-weight: 400; font-size: clamp(1.25rem, 1.1rem + 0.5vw, 1.5rem); margin: 0 0 var(--space-2xs); }
.addon-note__desc { color: var(--color-ink-soft); font-size: var(--fs-small); margin: 0 0 var(--space-sm); max-width: none; }
.addon-note__tags { list-style: none; display: flex; flex-wrap: wrap; gap: var(--space-2xs); margin: 0; padding: 0; }
.addon-note__tags li {
  font-size: var(--fs-xsmall);
  font-weight: 600;
  color: var(--color-gold-deep);
  background: var(--color-gold-pale);
  border-radius: var(--radius-pill);
  padding: 0.35rem 0.8rem;
}
@media (max-width: 479px) {
  .addon-note { flex-direction: column; align-items: flex-start; }
}

/* -------------------------------------------------------------------------
   COMPONENT: Hizmet Kartı  (WP: ACF Repeater "hizmetler")
   ------------------------------------------------------------------------- */
.service-grid { grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); row-gap: var(--space-lg); }
.service-card { display: flex; gap: var(--space-sm); align-items: flex-start; }
.service-card__icon {
  width: 48px; height: 48px; flex-shrink: 0; border-radius: 50%;
  background: var(--color-gold-pale); color: var(--color-gold-deep);
  display: flex; align-items: center; justify-content: center;
}
.service-card__icon svg { width: 22px; height: 22px; }
.service-card h3 { font-family: var(--font-heading); font-size: 1.1rem; font-weight: 600; margin-bottom: var(--space-3xs); }
.service-card p { font-size: var(--fs-small); color: var(--color-ink-soft); margin: 0; }

/* -------------------------------------------------------------------------
   COMPONENT: İstatistik / Güven Şeridi  (WP: ACF Options)
   Koyu banttan, beyaz zemin üzerinde ince altın çerçeveli kartlara
   dönüştürüldü — site genelinde AYDINLIK kalması için.
   ------------------------------------------------------------------------- */
.stat-band__grid { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); }
.stat {
  display: flex; flex-direction: column; gap: var(--space-3xs);
  text-align: center;
  padding: var(--space-md) var(--space-sm);
  background: var(--color-surface);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-card);
}
.stat strong { font-family: var(--font-display); font-weight: 400; font-size: clamp(1.6rem, 1.4rem + 0.8vw, 2.2rem); color: var(--color-gold-deep); }
.stat span { font-size: var(--fs-small); color: var(--color-ink-soft); }
.stat__icon {
  display: flex; align-items: center; justify-content: center;
  width: 48px; height: 48px;
  margin-inline: auto;
  margin-bottom: var(--space-3xs);
  border-radius: 50%;
  background: var(--color-gold-pale);
  color: var(--color-gold-deep);
}
.stat__icon svg { width: 22px; height: 22px; }

/* -------------------------------------------------------------------------
   COMPONENT: Menü Kategori Kartı  (WP: CPT "menu" — özet/teaser, detaylar ayrı sayfada)
   ------------------------------------------------------------------------- */

/* -------------------------------------------------------------------------
   COMPONENT: Galeri  (WP: ACF Gallery field)
   ------------------------------------------------------------------------- */
.gallery-filters { list-style: none; display: flex; flex-wrap: wrap; gap: var(--space-2xs); padding: 0; margin: 0 0 var(--space-lg); }
.gallery-filters button {
  font-family: var(--font-body); font-size: var(--fs-small); font-weight: 600;
  padding: 0.5rem 1.1rem; border-radius: var(--radius-pill);
  border: 1px solid var(--color-line); background: var(--color-surface); color: var(--color-ink-soft);
  cursor: pointer; transition: all var(--dur-fast) var(--ease-standard);
}
.gallery-filters button:hover { border-color: var(--color-gold-bright); color: var(--color-ink); }
.gallery-filters button[aria-pressed="true"] { background: var(--color-gold-deep); border-color: var(--color-gold-deep); color: #fff; }

.gallery-grid { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: var(--space-sm); }
@media (max-width: 639px) {
  .gallery-grid { grid-template-columns: 1fr 1fr; gap: var(--space-xs); }
}
.gallery-item { position: relative; }
.gallery-item .img-frame { --ar: 1/1; cursor: pointer; }
.gallery-item .img-frame img { transition: transform var(--dur-med) var(--ease-standard); }
.gallery-item .img-frame::after {
  content: "";
  position: absolute; inset: 0;
  background: rgba(27, 23, 19, 0);
  transition: background var(--dur-fast) var(--ease-standard);
}
.gallery-item:focus-visible .img-frame img { transform: scale(1.07); }
.gallery-item:focus-visible .img-frame::after { background: rgba(27, 23, 19, 0.28); }
@media (hover: hover) and (pointer: fine) {
  .gallery-item:hover .img-frame img { transform: scale(1.07); }
  .gallery-item:hover .img-frame::after { background: rgba(27, 23, 19, 0.28); }
}
.gallery-item__zoom {
  position: absolute; top: 50%; left: 50%;
  width: 44px; height: 44px;
  transform: translate(-50%, -50%) scale(0.7);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.95);
  color: var(--color-gold-deep);
  display: flex; align-items: center; justify-content: center;
  opacity: 0;
  transition: opacity var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard);
  pointer-events: none;
}
.gallery-item__zoom svg { width: 20px; height: 20px; }
.gallery-item:focus-visible .gallery-item__zoom { opacity: 1; transform: translate(-50%, -50%) scale(1); }
@media (hover: hover) and (pointer: fine) {
  .gallery-item:hover .gallery-item__zoom { opacity: 1; transform: translate(-50%, -50%) scale(1); }
}
.gallery-item[hidden] { display: none; }
.gallery-item--collapsed { display: none; }

.gallery-more { text-align: center; margin-top: var(--space-md); }
.gallery-more [hidden] { display: none; }
.gallery-more button svg { width: 16px; height: 16px; }

.gallery-cta { text-align: center; margin-top: var(--space-lg); }
@media (max-width: 639px) {
  .gallery-cta { display: none; }
}

/* .section-cta: same look as .gallery-cta but stays visible at every width.
   Used for "see the full page" links (Salonlarımız/Kına Paketleri/Menüler
   section footers on the homepage) that must stay reachable on mobile —
   unlike .gallery-cta's "Tüm Galeriyi Gör", these aren't duplicated by any
   other in-section control on small screens. */
.section-cta { text-align: center; margin-top: var(--space-lg); }

/* -------------------------------------------------------------------------
   COMPONENT: Galeri Lightbox
   ------------------------------------------------------------------------- */
.lightbox {
  position: fixed; inset: 0; z-index: 2000;
  display: flex; align-items: center; justify-content: center;
  background: rgba(15, 12, 9, 0.92);
  opacity: 0; visibility: hidden;
  transition: opacity var(--dur-med) var(--ease-standard), visibility 0s linear var(--dur-med);
  touch-action: pan-y;
}
.lightbox.is-open {
  opacity: 1; visibility: visible;
  transition: opacity var(--dur-med) var(--ease-standard), visibility 0s linear 0s;
}
.lightbox__stage {
  position: relative;
  z-index: 1;
  max-width: min(90vw, 1100px);
  max-height: 82vh;
  display: flex;
  touch-action: pan-y;
}
.lightbox__img {
  max-width: 100%; max-height: 82vh;
  width: auto; height: auto;
  object-fit: contain;
  border-radius: var(--radius-card);
  box-shadow: var(--shadow-lg);
  opacity: 0;
  transform: scale(0.97);
  transition: opacity var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard);
}
.lightbox__img.is-visible { opacity: 1; transform: scale(1); }
.lightbox__counter {
  position: absolute; left: 50%; bottom: var(--space-md);
  transform: translateX(-50%);
  color: #F3E9D8; font-size: var(--fs-xsmall); letter-spacing: 0.08em;
  margin: 0;
}
.lightbox__close,
.lightbox__nav {
  position: absolute;
  z-index: 10;
  display: flex; align-items: center; justify-content: center;
  width: 46px; height: 46px;
  border-radius: 50%;
  border: 1px solid rgba(243, 233, 216, 0.3);
  background: rgba(255, 255, 255, 0.06);
  color: #F3E9D8;
  cursor: pointer;
  transition: background var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard);
}
.lightbox__close:hover, .lightbox__nav:hover { background: rgba(255, 255, 255, 0.16); border-color: var(--color-gold-bright); }
.lightbox__close:focus-visible, .lightbox__nav:focus-visible { outline: 2px solid var(--color-gold-bright); outline-offset: 2px; }
.lightbox__close svg, .lightbox__nav svg { width: 20px; height: 20px; }
.lightbox__close { top: var(--space-md); right: var(--space-md); }
.lightbox__nav--prev { left: var(--space-md); top: 50%; transform: translateY(-50%); }
.lightbox__nav--next { right: var(--space-md); top: 50%; transform: translateY(-50%); }
.lightbox__nav[hidden] { display: none; }

@media (max-width: 640px) {
  .lightbox__close { top: var(--space-sm); right: var(--space-sm); width: 38px; height: 38px; }
  .lightbox__nav { width: 38px; height: 38px; }
  .lightbox__nav--prev { left: var(--space-2xs); }
  .lightbox__nav--next { right: var(--space-2xs); }
  .lightbox__stage { max-width: 94vw; max-height: 76vh; }
  .lightbox__img { max-height: 76vh; }
  .lightbox__counter { bottom: var(--space-sm); }
}

/* -------------------------------------------------------------------------
   COMPONENT: Video Modal (Salon tanıtım videoları — tıkla-izle)
   ------------------------------------------------------------------------- */
.video-modal {
  position: fixed; inset: 0; z-index: 2000;
  display: flex; align-items: center; justify-content: center;
  background: rgba(15, 12, 9, 0.92);
  opacity: 0; visibility: hidden;
  transition: opacity var(--dur-med) var(--ease-standard), visibility 0s linear var(--dur-med);
  touch-action: pan-y;
  padding: var(--space-lg);
}
.video-modal.is-open {
  opacity: 1; visibility: visible;
  transition: opacity var(--dur-med) var(--ease-standard), visibility 0s linear 0s;
}
.video-modal__stage {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 900px;
}
.video-modal__stage video {
  width: 100%;
  max-height: 80vh;
  border-radius: var(--radius-card);
  box-shadow: var(--shadow-lg);
  background: #000;
  display: block;
}
.video-modal__spinner {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--dur-fast) var(--ease-standard);
}
.video-modal__spinner.is-active { opacity: 1; }
.video-modal__spinner span {
  width: 42px; height: 42px;
  border-radius: 50%;
  border: 3px solid rgba(243, 233, 216, 0.25);
  border-top-color: var(--color-gold-bright);
  animation: video-modal-spin 0.8s linear infinite;
}
@keyframes video-modal-spin { to { transform: rotate(360deg); } }
.video-modal__playbtn {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%) scale(1);
  width: 72px; height: 72px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.96);
  color: var(--color-gold-deep);
  border: none;
  cursor: pointer;
  box-shadow: var(--shadow-lg);
  opacity: 1;
  transition: opacity var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard), background var(--dur-fast) var(--ease-standard);
}
.video-modal__playbtn:hover { transform: translate(-50%, -50%) scale(1.07); background: #fff; }
.video-modal__playbtn svg { width: 28px; height: 28px; margin-left: 3px; }
.video-modal__playbtn.is-hidden {
  opacity: 0;
  transform: translate(-50%, -50%) scale(0.82);
  pointer-events: none;
}
@media (max-width: 640px) {
  .video-modal__playbtn { width: 58px; height: 58px; }
  .video-modal__playbtn svg { width: 22px; height: 22px; }
}
.video-modal__close {
  position: absolute;
  top: var(--space-md); right: var(--space-md);
  z-index: 10;
  display: flex; align-items: center; justify-content: center;
  width: 46px; height: 46px;
  border-radius: 50%;
  border: 1px solid rgba(243, 233, 216, 0.3);
  background: rgba(255, 255, 255, 0.06);
  color: #F3E9D8;
  cursor: pointer;
  transition: background var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard);
}
.video-modal__close:hover { background: rgba(255, 255, 255, 0.16); border-color: var(--color-gold-bright); }
.video-modal__close svg { width: 20px; height: 20px; }
.video-modal__tabs {
  display: flex; justify-content: center; gap: var(--space-2xs);
  margin-top: var(--space-md);
}
.video-modal__tabs[hidden] { display: none; }
.video-modal__tab {
  padding: 0.5rem 1.1rem;
  border-radius: var(--radius-pill);
  border: 1px solid rgba(243, 233, 216, 0.3);
  background: transparent;
  color: #F3E9D8;
  font-size: var(--fs-xsmall);
  font-weight: 600;
  cursor: pointer;
  transition: background var(--dur-fast) var(--ease-standard), color var(--dur-fast) var(--ease-standard);
}
.video-modal__tab[aria-pressed="true"] { background: var(--color-gold-bright); color: var(--color-black); border-color: var(--color-gold-bright); }
@media (max-width: 640px) {
  .video-modal { padding: var(--space-sm); }
  .video-modal__close { top: var(--space-sm); right: var(--space-sm); width: 38px; height: 38px; }
}

/* -------------------------------------------------------------------------
   COMPONENT: İçerik Modalı (Menü kartları, Kına Paketleri detayları)
   ------------------------------------------------------------------------- */
.content-modal {
  position: fixed; inset: 0; z-index: 2000;
  display: flex; align-items: center; justify-content: center;
  background: rgba(15, 12, 9, 0.72);
  opacity: 0; visibility: hidden;
  transition: opacity var(--dur-med) var(--ease-standard), visibility 0s linear var(--dur-med);
  padding: var(--space-lg);
}
.content-modal.is-open {
  opacity: 1; visibility: visible;
  transition: opacity var(--dur-med) var(--ease-standard), visibility 0s linear 0s;
}
.content-modal__card {
  position: relative;
  width: 100%;
  max-width: 560px;
  max-height: 86vh;
  overflow-y: auto;
  background: var(--color-surface);
  border-radius: var(--radius-frame);
  box-shadow: var(--shadow-lg);
  padding: var(--space-xl) var(--space-lg) var(--space-lg);
}
.content-modal__close {
  position: absolute;
  top: var(--space-sm); right: var(--space-sm);
  z-index: 10;
  display: flex; align-items: center; justify-content: center;
  width: 38px; height: 38px;
  border-radius: 50%;
  border: none;
  background: var(--color-gold-pale);
  color: var(--color-gold-deep);
  cursor: pointer;
  transition: background var(--dur-fast) var(--ease-standard), color var(--dur-fast) var(--ease-standard);
}
.content-modal__close:hover { background: var(--color-gold-deep); color: #fff; }
.content-modal__close svg { width: 16px; height: 16px; }
.content-modal__eyebrow { color: var(--color-gold-deep); }
.content-modal__title {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(1.6rem, 1.4rem + 1vw, 2.1rem);
  margin-bottom: var(--space-sm);
}
.content-modal__list {
  list-style: none; margin: 0 0 var(--space-md); padding: 0;
  display: grid; gap: var(--space-2xs);
}
.content-modal__list li {
  display: flex; gap: var(--space-xs); align-items: flex-start;
  font-size: var(--fs-small); color: var(--color-ink-soft);
  padding-block: var(--space-3xs);
  border-bottom: 1px dashed var(--color-line);
}
.content-modal__list li:last-child { border-bottom: none; }
.content-modal__list li::before {
  content: "";
  flex-shrink: 0;
  width: 6px; height: 6px;
  margin-top: 0.5em;
  border-radius: 50%;
  background: var(--color-gold-bright);
}
.content-modal__actions { display: flex; flex-wrap: wrap; gap: var(--space-sm); margin-top: var(--space-md); }

/* -------------------------------------------------------------------------
   COMPONENT: CTA Bandı  (WP: ACF Flexible Content "cta")
   ------------------------------------------------------------------------- */
.cta-band { text-align: center; }
.cta-band .section-head { margin-inline: auto; }
.cta-band__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-sm); }

/* -------------------------------------------------------------------------
   COMPONENT: Teklif Al Formu  (WP: Gravity/CF7 + ACF alan etiketleri)
   ------------------------------------------------------------------------- */
.quote {
  display: grid; gap: var(--space-2xl);
  align-items: start;
}
@media (min-width: 980px) {
  .quote { grid-template-columns: 0.85fr 1.4fr; }
  .quote__aside { position: sticky; top: 100px; }
}
.quote__aside ul { list-style: none; padding: 0; margin: var(--space-md) 0; display: grid; gap: var(--space-sm); }
.quote__aside li { display: flex; gap: var(--space-xs); font-size: var(--fs-small); color: var(--color-ink-soft); }
.quote__aside li svg { width: 20px; height: 20px; color: var(--color-gold); flex-shrink: 0; }

/* ---- Aside: "Nasıl Çalışır?" adımları ---------------------------------- */
.quote__steps { margin-top: var(--space-xl); padding-top: var(--space-lg); border-top: 1px solid var(--color-line); }
.quote__steps-title { font-family: var(--font-heading); font-size: 1.15rem; color: var(--color-ink); margin: 0 0 var(--space-md); }
.quote__steps-list { list-style: none; padding: 0; margin: 0; }
.quote__steps-list li { display: flex; gap: var(--space-sm); position: relative; padding-bottom: var(--space-lg); }
.quote__steps-list li:last-child { padding-bottom: 0; }
.quote__steps-list li:not(:last-child)::before {
  content: "";
  position: absolute; left: 15px; top: 34px; bottom: 2px;
  width: 1px; background: var(--color-line);
}
.quote__step-num {
  flex-shrink: 0; width: 32px; height: 32px; border-radius: 50%;
  background: var(--color-gold-pale); color: var(--color-gold-deep);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font-heading); font-weight: 600; font-size: 1rem;
  position: relative; z-index: 1;
}
.quote__steps-list strong { display: block; font-size: var(--fs-small); color: var(--color-ink); margin-bottom: 2px; font-weight: 600; }
.quote__steps-list p { font-size: var(--fs-xsmall); color: var(--color-ink-soft); margin: 0; max-width: none; }

/* ---- Aside: fotoğraf ----------------------------------------------------- */
.quote__photo {
  margin: var(--space-xl) 0 0;
  border-radius: var(--radius-frame);
  overflow: hidden;
  border: 1px solid var(--color-line);
  box-shadow: var(--shadow-sm);
}
.quote__photo img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; }
.quote__photo figcaption {
  padding: var(--space-sm) var(--space-md);
  background: var(--color-surface);
  font-family: var(--font-heading); font-style: italic;
  font-size: var(--fs-small); color: var(--color-ink-soft);
  margin: 0;
}

.quote-form {
  background: var(--color-surface);
  border: 1px solid var(--color-line);
  border-radius: 22px;
  padding: var(--space-lg);
  scroll-margin-top: 90px;
}
@media (min-width: 640px) { .quote-form { padding: var(--space-xl); } }

/* Honeypot: spam botlarına görünür, gerçek kullanıcılara (ve ekran
   okuyuculara) görünmez — bu alan dolu gelirse sunucu tarafında istek
   sessizce reddedilir. display:none yerine ekran dışına taşımak tercih
   edildi çünkü bazı botlar display:none alanları atlayabiliyor. */
.field-honeypot { position: absolute; left: -9999px; top: -9999px; width: 1px; height: 1px; overflow: hidden; }

.form-fieldset { border: 0; padding: 0; margin: 0 0 var(--space-lg); }
.form-fieldset:last-of-type { margin-bottom: 0; }
.form-fieldset legend {
  font-family: var(--font-heading); font-weight: 600; font-size: 1.45rem; color: var(--color-ink);
  letter-spacing: 0.005em;
  padding: 0 0 var(--space-sm); width: 100%; border-bottom: 1px solid var(--color-line); margin-bottom: var(--space-md);
}
.form-row { display: grid; gap: var(--space-md); margin-bottom: var(--space-md); }
@media (min-width: 640px) {
  .form-row--2 { grid-template-columns: 1fr 1fr; }
  .form-row--3 { grid-template-columns: 1fr 1fr 1fr; }
}
.field { display: flex; flex-direction: column; gap: var(--space-3xs); }
.field label { font-size: var(--fs-small); font-weight: 500; color: var(--color-ink-soft); }
.field .hint { font-size: var(--fs-xsmall); color: var(--color-ink-soft); }
.field input[type="text"],
.field input[type="tel"],
.field input[type="email"],
.field input[type="date"],
.field input[type="number"],
.field select,
.field textarea {
  font: inherit;
  padding: 0.8rem 0.9rem;
  border-radius: var(--radius-card);
  border: 1px solid var(--color-line);
  background: var(--color-ground-alt);
  color: var(--color-ink);
  width: 100%;
}
.field textarea { resize: vertical; min-height: 110px; }
.field input:focus, .field select:focus, .field textarea:focus { border-color: var(--color-gold-bright); }
.field.has-error input, .field.has-error select, .field.has-error textarea { border-color: var(--color-error); }
.field__error { font-size: var(--fs-xsmall); color: var(--color-error); min-height: 1.1em; }

/* ---- Teklif formu: Menü Tercihi satırı (select + önizleme butonu) --- */
.field__inline { display: flex; gap: var(--space-2xs); align-items: stretch; }
.field__inline select { flex: 1; min-width: 0; }
.field__inline-btn { flex-shrink: 0; }
@media (max-width: 479px) {
  .field__inline { flex-direction: column; }
  .field__inline-btn { width: 100%; }
}

/* ---- Bütçe kaydırıcısı (range slider) ------------------------------- */
.field--budget { margin-bottom: var(--space-md); }
.budget__head {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: var(--space-sm); flex-wrap: wrap;
}
.budget__value {
  font-family: var(--font-heading); font-size: 1.7rem; font-weight: 700;
  color: var(--color-gold-deep); white-space: nowrap;
  background: var(--color-gold-pale);
  padding: 0.3rem 1rem;
  border-radius: var(--radius-pill);
  line-height: 1.3;
}
.budget__range-wrap { position: relative; height: 34px; display: flex; align-items: center; margin-top: var(--space-2xs); }
.budget__range-fill {
  position: absolute; left: 0; top: 50%; transform: translateY(-50%);
  height: 6px; border-radius: 999px; width: 0%;
  background: linear-gradient(90deg, var(--color-gold-bright), var(--color-gold-deep));
  pointer-events: none;
}
.budget__range {
  -webkit-appearance: none; appearance: none;
  width: 100%; height: 6px; border-radius: 999px;
  background: var(--color-line);
  position: relative; margin: 0;
  cursor: pointer;
}
.budget__range::-webkit-slider-runnable-track { background: transparent; height: 6px; border-radius: 999px; }
.budget__range::-moz-range-track { background: transparent; height: 6px; border-radius: 999px; }
.budget__range::-webkit-slider-thumb {
  -webkit-appearance: none; appearance: none;
  width: 22px; height: 22px; margin-top: -8px;
  border-radius: 50%; background: var(--color-surface);
  border: 3px solid var(--color-gold-deep);
  box-shadow: var(--shadow-sm);
  cursor: pointer;
}
.budget__range::-moz-range-thumb {
  width: 22px; height: 22px; border-radius: 50%; background: var(--color-surface);
  border: 3px solid var(--color-gold-deep);
  box-shadow: var(--shadow-sm);
  cursor: pointer;
}
.budget__range:focus-visible { outline: none; }
.budget__range:focus-visible::-webkit-slider-thumb { outline: 3px solid var(--color-focus-ring); outline-offset: 2px; }
.budget__range:focus-visible::-moz-range-thumb { outline: 3px solid var(--color-focus-ring); outline-offset: 2px; }
.budget__scale { display: flex; justify-content: space-between; font-size: var(--fs-xsmall); color: var(--color-ink-soft); margin-top: var(--space-3xs); }
.field--budget.has-error .budget__value { background: var(--color-error-bg); color: var(--color-error); }
.field--budget.has-error .budget__range-fill { background: var(--color-error); }
.field--budget.has-error .budget__range::-webkit-slider-thumb { border-color: var(--color-error); }
.field--budget.has-error .budget__range::-moz-range-thumb { border-color: var(--color-error); }

.check-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: var(--space-sm); }
.check-option {
  display: flex; align-items: center; gap: var(--space-2xs);
  padding: 0.7rem 0.85rem; border: 1px solid var(--color-line); border-radius: var(--radius-card);
  cursor: pointer; font-size: var(--fs-small); background: var(--color-ground-alt);
  transition: border-color var(--dur-fast) var(--ease-standard), background var(--dur-fast) var(--ease-standard);
}
.check-option:has(input:checked) { border-color: var(--color-gold-bright); background: var(--color-gold-pale); }
.check-option input { accent-color: var(--color-black); width: 17px; height: 17px; }

.form-footer { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-md); margin-top: var(--space-lg); }
.form-footer p { font-size: var(--fs-xsmall); color: var(--color-ink-soft); margin: 0; max-width: 32ch; }

.form-status {
  display: none;
  align-items: flex-start; gap: var(--space-xs);
  padding: var(--space-md); border-radius: var(--radius-card);
  margin-bottom: var(--space-lg);
  font-size: var(--fs-small);
}
.form-status.is-visible { display: flex; }
.form-status--success { background: var(--color-success-bg); color: var(--color-success); }
.form-status--error { background: var(--color-error-bg); color: var(--color-error); }
.form-status svg { width: 22px; height: 22px; flex-shrink: 0; }

/* -------------------------------------------------------------------------
   COMPONENT: İletişim  (WP: ACF Options "iletisim")
   ------------------------------------------------------------------------- */
.contact { grid-template-columns: 1fr; gap: var(--space-2xl); align-items: stretch; }
@media (min-width: 980px) { .contact { grid-template-columns: 1fr 1fr; } }
.contact-list { list-style: none; padding: 0; margin: var(--space-lg) 0; display: grid; gap: var(--space-md); }
.contact-list li {
  display: flex; gap: var(--space-sm); padding: var(--space-xs) 0;
}
.contact-list__item--directions {
  padding-bottom: var(--space-md); margin-bottom: var(--space-3xs);
  border-bottom: 1px dashed var(--color-line);
}
.contact-list__icon {
  width: 42px; height: 42px; flex-shrink: 0; border-radius: 50%;
  background: var(--color-gold-pale); color: var(--color-gold-deep);
  display: flex; align-items: center; justify-content: center;
}
.contact-list__icon svg { width: 20px; height: 20px; }
.contact-list h3 { font-size: 1rem; margin-bottom: 2px; font-family: var(--font-body); font-weight: 600; }
.contact-list p, .contact-list a { margin: 0; font-size: var(--fs-small); color: var(--color-ink-soft); text-decoration: none; }
.contact-list a:hover { color: var(--color-gold-deep); }
.contact-note {
  margin-top: var(--space-lg); padding: var(--space-md); border-radius: var(--radius-card);
  background: var(--color-ground-alt); font-size: var(--fs-small); color: var(--color-ink-soft);
}
.contact-note strong { color: var(--color-ink); }

.map-card {
  border-radius: var(--radius-frame);
  overflow: hidden;
  border: 1px solid var(--color-line);
  box-shadow: var(--shadow-sm);
  background: var(--color-surface);
  display: flex;
  flex-direction: column;
  height: 100%;
}
.map-card__frame { position: relative; width: 100%; aspect-ratio: 4 / 5; background: var(--color-ground-alt); }
@media (min-width: 980px) { .map-card__frame { aspect-ratio: 1 / 1; flex: 1; } }
.map-card__frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; display: block; }
.map-card__footer {
  display: flex; align-items: center; justify-content: space-between; gap: var(--space-md);
  flex-wrap: wrap;
  padding: var(--space-md) var(--space-lg);
  border-top: 1px solid var(--color-line);
}
.map-card__address { display: flex; flex-direction: column; gap: 1px; }
.map-card__address strong { font-family: var(--font-heading); font-size: 1.05rem; color: var(--color-ink); font-weight: 600; }
.map-card__address span { font-size: var(--fs-small); color: var(--color-ink-soft); }
.map-card__cta { flex-shrink: 0; }

/* -------------------------------------------------------------------------
   COMPONENT: Footer — AÇIK zemin, ince altın üst çizgi (koyu blok değil)
   ------------------------------------------------------------------------- */
.site-footer { background: var(--color-ground-alt); color: var(--color-ink); padding-block: var(--space-2xl) var(--space-lg); border-top: 1px solid var(--color-gold-bright); }
.site-footer a { color: var(--color-ink); text-decoration: none; }
.site-footer a:hover { color: var(--color-gold-deep); }
.footer-grid { gap: var(--space-xl); }
@media (min-width: 640px) { .footer-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 980px) { .footer-grid { grid-template-columns: 1.3fr 1fr 1fr; } }
.footer-grid h2 { font-size: 1rem; }
.footer-brand .brand__mark { height: 72px; margin-bottom: var(--space-xs); }
.footer-brand .brand { flex-direction: column; align-items: flex-start; }
.footer-brand .brand__name { color: var(--color-ink); }
.footer-brand .brand__tagline { color: var(--color-gold-deep); }
.footer-brand p { color: var(--color-ink-soft); font-size: var(--fs-small); margin-top: var(--space-sm); }
.footer-col h2 { font-family: var(--font-heading); font-weight: 600; font-size: 1.15rem; letter-spacing: 0.03em; color: var(--color-gold-deep); margin-bottom: var(--space-sm); }
.footer-col ul { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--space-2xs); font-size: var(--fs-small); }
.footer-social { display: flex; gap: var(--space-sm); margin-top: var(--space-sm); }
.footer-social a { width: 38px; height: 38px; border: 1px solid var(--color-line); border-radius: 50%; display: flex; align-items: center; justify-content: center; }
.footer-social a:hover { border-color: var(--color-gold-bright); }
.footer-social svg { width: 18px; height: 18px; }
.footer-bottom {
  margin-top: var(--space-2xl); padding-top: var(--space-md); border-top: 1px solid var(--color-line);
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--space-sm);
  font-size: var(--fs-xsmall); color: var(--color-ink-soft);
}

/* -------------------------------------------------------------------------
   COMPONENT: Mobil Sabit Aksiyon Çubuğu
   ------------------------------------------------------------------------- */
.mobile-bar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 90;
  display: grid; grid-template-columns: 1fr 1fr;
  background: var(--color-surface); border-top: 1px solid var(--color-line);
  box-shadow: 0 -8px 24px rgba(34,29,23,0.10);
  padding: var(--space-2xs);
  gap: var(--space-2xs);
}
.mobile-bar a { border-radius: var(--radius-pill); }
body.lightbox-open .mobile-bar { display: none; }
@media (min-width: 1140px) { .mobile-bar { display: none; } }
.has-mobile-bar { padding-bottom: 76px; }
@media (min-width: 1140px) { .has-mobile-bar { padding-bottom: 0; } }

.back-to-top {
  position: fixed; right: var(--space-sm); bottom: 92px; z-index: 90;
  width: 44px; height: 44px; border-radius: 50%;
  background: var(--color-gold-deep); color: #fff; border: none;
  display: flex; align-items: center; justify-content: center;
  box-shadow: var(--shadow-md); cursor: pointer;
  opacity: 0; visibility: hidden; transform: translateY(8px);
  transition: opacity var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard), background var(--dur-fast) var(--ease-standard);
}
.back-to-top svg { width: 20px; height: 20px; }
.back-to-top.is-visible { opacity: 1; visibility: visible; transform: translateY(0); }
.back-to-top:hover { background: var(--color-gold-bright); }
body.lightbox-open .back-to-top { display: none; }
@media (min-width: 1140px) { .back-to-top { right: var(--space-lg); bottom: var(--space-lg); } }

/* -------------------------------------------------------------------------
   Scroll-reveal (JS ile .is-visible eklenir)
   ------------------------------------------------------------------------- */
.reveal { opacity: 1; transform: none; }
@media (prefers-reduced-motion: no-preference) {
  .reveal {
    opacity: 0; transform: translateY(18px);
    transition: opacity 640ms var(--ease-standard), transform 640ms var(--ease-standard);
  }
  .reveal.is-visible { opacity: 1; transform: none; }
}

/* =========================================================================
   COMPONENT: Breadcrumb (alt sayfalar)
   ========================================================================= */
.breadcrumb {
  border-bottom: 1px solid var(--color-line);
  background: var(--color-surface);
}
.breadcrumb__list {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-3xs);
  margin: 0;
  padding: var(--space-xs) 0;
  font-size: var(--fs-xsmall);
  color: var(--color-ink-soft);
}
.breadcrumb__list li { display: flex; align-items: center; gap: var(--space-3xs); }
.breadcrumb__list li:not(:last-child)::after {
  content: "/";
  color: var(--color-line);
  margin-left: var(--space-3xs);
}
.breadcrumb__list a { color: var(--color-ink-soft); text-decoration: none; }
.breadcrumb__list a:hover { color: var(--color-gold-deep); text-decoration: underline; }
.breadcrumb__list li[aria-current="page"] { color: var(--color-gold-deep); font-weight: 600; }

/* =========================================================================
   COMPONENT: Alt sayfa girişi (page-intro)
   ========================================================================= */
.page-intro {
  /* Bottom padding stays small: the section right after this one already
     adds its own top padding (.section/.section--tight), so a large value
     here would stack with it and leave an oversized empty gap before the
     page's first content (e.g. the gallery filters/grid on /galeri/). */
  padding: var(--space-2xl) 0 var(--space-sm);
}
.page-intro h1 { margin-bottom: var(--space-sm); }
.page-intro .lead { max-width: 62ch; }
/* The section immediately after page-intro also carries its own top
   padding (.section/.section--tight use space-xl/space-2xl, sized for
   spacing BETWEEN unrelated sections). Right after the intro that reads
   as an oversized empty gap before the page's first real content (package
   cards, gallery grid, hall cards, etc.), so tighten it specifically in
   this adjacency without touching .section/.section--tight anywhere else. */
.page-intro + .section { padding-top: var(--space-md); }

/* =========================================================================
   COMPONENT: Bilgi kartı grid'i (info-card) — İletişim, Hakkımızda vb.
   ========================================================================= */
.info-card {
  background: var(--color-surface);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-frame);
  box-shadow: var(--shadow-sm);
  padding: var(--space-lg);
}
.info-card h3 {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(1.1rem, 1rem + 0.4vw, 1.3rem);
  margin: 0 0 var(--space-2xs);
}
.info-card p { color: var(--color-ink-soft); margin: 0; }

/* =========================================================================
   COMPONENT: SSS Akordeon (FAQ) — GEO/SEO için Q&A içerikleri
   ========================================================================= */
.faq-list { display: flex; flex-direction: column; gap: var(--space-sm); max-width: 74ch; }
.faq-item {
  border: 1px solid var(--color-line);
  border-radius: var(--radius-frame);
  background: var(--color-surface);
  overflow: hidden;
}
.faq-item__q {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-sm);
  padding: var(--space-sm) var(--space-md);
  background: none;
  border: none;
  cursor: pointer;
  font-family: var(--font-body);
  font-weight: 600;
  font-size: var(--fs-base, 1rem);
  color: var(--color-ink);
  text-align: left;
}
.faq-item__q svg { flex-shrink: 0; width: 18px; height: 18px; color: var(--color-gold-deep); transition: transform var(--dur-fast) var(--ease-standard); }
.faq-item[open] .faq-item__q svg { transform: rotate(180deg); }
.faq-item__a { padding: 0 var(--space-md) var(--space-md); color: var(--color-ink-soft); margin: 0; }
.faq-item__q::-webkit-details-marker { display: none; }

/* =========================================================================
   COMPONENT: Alt sayfa bağlantı şeridi (related-links) — iç link ağı
   ========================================================================= */
.related-links {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm);
  margin-top: var(--space-lg);
}

/* =========================================================================
   COMPONENT: Salon detay sayfası — kapasite/özellik rozet şeridi
   ========================================================================= */
.spec-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: var(--space-sm);
  /* Top margin only: this sits at the end of .page-intro, which already
     supplies its own (small) bottom padding before the next section's own
     top padding kicks in. A bottom margin here would stack on top of both
     and reopen the oversized gap the .page-intro fix closed. */
  margin: var(--space-lg) 0 0;
}
.spec-strip__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-3xs);
  background: var(--color-gold-pale);
  border: 1px solid transparent;
  border-radius: var(--radius-frame);
  padding: var(--space-md) var(--space-sm);
  text-align: center;
  /* Bu öğeler aynı zamanda .reveal olduğundan (giriş animasyonu için),
     transition tek bir yerden, tüm özellikleri kapsayacak şekilde
     tanımlanır — .reveal'ın kendi transition tanımıyla çakışıp onu
     ezmesin diye opacity/transform da buraya dahil edildi. */
  transition: opacity 640ms var(--ease-standard), transform var(--dur-fast) var(--ease-standard),
              box-shadow var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard),
              background var(--dur-fast) var(--ease-standard);
}
.spec-strip__item:hover,
.spec-strip__item:focus-within {
  box-shadow: var(--shadow-md);
  border-color: var(--color-gold-bright);
  background: var(--color-surface);
}
.spec-strip__icon {
  width: 40px; height: 40px;
  flex-shrink: 0;
  border-radius: 50%;
  background: var(--color-surface);
  color: var(--color-gold-deep);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: var(--space-3xs);
  transition: transform var(--dur-fast) var(--ease-standard), background var(--dur-fast) var(--ease-standard), color var(--dur-fast) var(--ease-standard);
}
.spec-strip__icon svg { width: 20px; height: 20px; }
.spec-strip__item:hover .spec-strip__icon,
.spec-strip__item:focus-within .spec-strip__icon {
  transform: scale(1.15) rotate(-6deg);
  background: var(--color-gold-deep);
  color: #fff;
}
.spec-strip__item strong { display: block; font-family: var(--font-display); font-size: 1.3rem; color: var(--color-gold-deep); }
.spec-strip__item > span:last-child { display: block; font-size: var(--fs-xsmall); color: var(--color-ink-soft); }
/* Kademeli giriş: her rozet .reveal olduğu için görünüme girerken sırayla belirir */
.spec-strip__item:nth-child(1) { transition-delay: 0ms; }
.spec-strip__item:nth-child(2) { transition-delay: 90ms; }
.spec-strip__item:nth-child(3) { transition-delay: 180ms; }
.spec-strip__item:nth-child(4) { transition-delay: 270ms; }
.spec-strip__item:hover,
.spec-strip__item:focus-within { transition-delay: 0ms; }