/* ============================================================
   Ramada Resort by Wyndham Datça — Ana Stil Dosyası (public)
   Tasarım dili: referans temadan uyarlanmış sakin lüks — beyaz ve sıcak kırık beyaz bölümler,
   Gilda Display başlıklar, Barlow gövde, Barlow Condensed üst etiketler; vurgu logonun kırmızısı.
   Bootstrap 5 (yalnızca grid + yardımcılar) üzerine otel katmanı.
   Mobile-first: temel kurallar telefon içindir, genişletmeler min-width ile.
   Fontlar views/partials/fonts.php içindeki tek <link> ile yüklenir (@import yok).
   Renkler yalnızca aşağıdaki token'lardan okunur; kurallarda hex yazılmaz.
   ============================================================ */

/* ── Tasarım Tokenları ───────────────────────────────────── */
:root {
  /* Palet — marka renkleri logodan: kırmızı #D01243, gri #6E6E71 */
  --white:             #FFFFFF;
  --sand-50:           #F7F4F0;  /* alternatif bölüm zemini (sıcak kırık beyaz) */
  --sand-100:          #EFEAE3;  /* yer tutucu yüzey */
  --sand-200:          #E3DDD4;  /* ince çizgiler, ayraçlar */
  --sand-300:          #CFC7BC;  /* kenarlıklar, pasif çizgi */
  --ink:               #1E1E20;  /* başlıklar, ana metin (beyazda 16.6:1) */
  --ink-muted:         #5A5A5E;  /* gövde paragrafları (beyazda 6.9:1, sand-50'de 6.3:1) */
  --ramada-gray:       #6E6E71;  /* ikincil metin, üst etiket (beyazda 5.1:1, sand-50'de 4.6:1; sand-100'de metin olmaz) */
  --ramada-red:        #D01243;  /* buton, süs, aktif/hover, açık zeminde odak halkası (beyazda 5.5:1) */
  --ramada-red-deep:   #A60E35;  /* hover / basılı, hata metni (beyazda 7.7:1) */
  --ramada-red-tint:   #FBEAEF;  /* hafif vurgu zemini: seçim, hata kutusu */
  --ramada-red-light:  #F37595;  /* koyu zeminde kırmızı metin/ikon/odak (night'ta 6.7:1) */
  --night:             #161618;  /* footer, koyu yüzeyler */
  --night-soft:        #242427;  /* koyu yüzeyde katman, görselsiz kart */
  --success:           #4F6B4A;
  --success-bg:        #EEF1EA;
  --whatsapp:          #25D366;
  --whatsapp-ink:      #1E7A45;  /* açık zeminde WhatsApp metni/ikonu (marka yeşili beyazda okunmuyor) */

  /* Saydamlık için RGB kanalları: rgb(var(--x-rgb) / .5) */
  --white-rgb:         255 255 255;
  --night-rgb:         22 22 24;

  /* Dekoratif SVG'ler: çizgi rengi yalnızca burada; süs mask ile token rengini alır */
  --ornament-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 14' fill='none' stroke='black' stroke-linecap='round'%3E%3Cpath d='M3.5 11.2C8 5.4 13.6 4 20 5.7c6.4 1.8 10.4 5.3 16.6 4.6 3.9-.4 6.6-2.4 8.6-5.6' stroke-width='1.5'/%3E%3Cpath d='M7.6 12.3c4-3.3 8.6-4.2 13.7-2.8 5.6 1.6 9.9 3.9 15.2 2.8' stroke-width='1.05'/%3E%3Cpath d='M3.5 11.2c-1 1.2-.5 2.3.7 2' stroke-width='1.2'/%3E%3C/svg%3E");
  --pattern-ogee: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='56' viewBox='0 0 56 56' fill='none' stroke='white' stroke-opacity='.055'%3E%3Cpath d='M0 28C14 28 14 0 28 0s14 28 28 28M0 28c14 0 14 28 28 28s14-28 28-28'/%3E%3C/svg%3E");
  /* Açılır liste oku (select-hotel): mask ile token rengini alır */
  --chevron-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E");

  /* Anlamsal roller */
  --bg-page:           var(--white);
  --bg-alt:            var(--sand-50);
  --surface:           var(--white);
  --text:              var(--ink);
  --text-body:         var(--ink-muted);
  --text-subtle:       var(--ramada-gray);
  --line:              var(--sand-200);
  --line-strong:       var(--sand-300);
  --accent:            var(--ramada-red);
  --accent-hover:      var(--ramada-red-deep);
  --accent-tint:       var(--ramada-red-tint);   /* seçili durum zemini; üzerinde --accent-hover 6.6:1 */
  --danger:            var(--ramada-red-deep);
  --danger-bg:         var(--ramada-red-tint);
  --on-dark:           var(--white);
  --on-dark-muted:     rgb(var(--white-rgb) / .72);
  --on-dark-subtle:    rgb(var(--white-rgb) / .6);
  --on-photo-muted:    rgb(var(--white-rgb) / .9);
  --line-on-dark:      rgb(var(--white-rgb) / .12);
  --line-on-photo:     rgb(var(--white-rgb) / .4);
  /* Görsel üstü metinler için gece tonlu perdeler */
  --scrim-hero:        linear-gradient(to bottom, rgb(var(--night-rgb) / .62) 0%, rgb(var(--night-rgb) / .4) 30%, rgb(var(--night-rgb) / .44) 62%, rgb(var(--night-rgb) / .66) 100%);
  /* İç sayfa başlığında metin solda: o tarafı ayrıca koyulaştırır (parlak fotoğrafta okunurluk) */
  --scrim-hero-side:   linear-gradient(to right, rgb(var(--night-rgb) / .5) 0%, rgb(var(--night-rgb) / .28) 45%, transparent 78%);
  /* Fotoğraf üstü metin gölgesi: sıkı katman harf kenarını belirginleştirir, yumuşak katman zemini koyulaştırır */
  --text-shadow-photo: 0 1px 2px rgb(var(--night-rgb) / .55), 0 2px 22px rgb(var(--night-rgb) / .5);
  --scrim-bottom:      linear-gradient(to top, rgb(var(--night-rgb) / .75) 0%, rgb(var(--night-rgb) / .3) 50%, transparent 85%);
  --scrim-card:        linear-gradient(to top, rgb(var(--night-rgb) / .85) 0%, rgb(var(--night-rgb) / .55) 35%, rgb(var(--night-rgb) / .12) 68%, transparent 85%);

  /* Yüzeye göre değişen roller (koyu yüzeyler aşağıda yeniden tanımlar) */
  --focus-ring:        var(--ramada-red);
  --link-hover:        var(--ramada-red);
  --eyebrow:           var(--ramada-gray);
  --ornament:          var(--ramada-red);
  --disabled-fg:       var(--ramada-gray);
  --disabled-line:     var(--sand-300);
  --tip-bg:            var(--ink);
  --tip-fg:            var(--white);

  /* Tipografi */
  --font-display:      'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --font-sans:         'Barlow', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-condensed:    'Barlow Condensed', 'Barlow', 'Arial Narrow', sans-serif;
  /* Cormorant Garamond büyük nokta boyutlarında çok daha güçlü; +%15-20 büyütüldü */
  --fs-hero:           clamp(3rem, 6.5vw, 6.5rem);
  --fs-display:        clamp(3rem, 5.5vw, 5.25rem);
  --fs-h2:             clamp(2.25rem, 4.2vw, 3.75rem);
  --fs-h3:             clamp(1.65rem, 2.6vw, 2.25rem);
  --fs-h4:             1.625rem;
  --fs-lead:           1.125rem;
  --fs-body:           1rem;
  --fs-sm:             .9375rem;
  --fs-xs:             .8125rem;
  --fs-eyebrow:        .75rem;
  --fs-nav:            .875rem;
  --fs-btn:            .8125rem;
  --lh-tight:          1.05;
  --lh-heading:        1.12;
  --lh-body:           1.85;
  --ls-heading:        -0.02em;  /* serif başlıklar dar aralıkla zarif görünür */
  --ls-eyebrow:        .22em;
  --ls-nav:            .08em;
  --ls-btn:            .12em;
  --measure:           65ch;

  /* Boşluk (8px tabanlı) */
  --space-1:           .5rem;
  --space-2:           1rem;
  --space-3:           1.5rem;
  --space-4:           2rem;
  --space-5:           3rem;
  --space-6:           4.5rem;
  --space-7:           6rem;
  --space-8:           8rem;
  --section-y:         var(--space-6);

  /* Yüzey ve hareket: köşeler keskin (referans tema), gölgeler yumuşak ve gece tonlu */
  --radius:            0;
  --shadow:            0 24px 60px -24px rgb(var(--night-rgb) / .24);
  --shadow-sm:         0 10px 28px -14px rgb(var(--night-rgb) / .22);
  --shadow-header:     0 10px 30px -16px rgb(var(--night-rgb) / .22);
  --ease-out:          cubic-bezier(.22, 1, .36, 1);
  --dur-fast:          200ms;
  --dur:               450ms;
  --dur-slow:          900ms;

  /* Yerleşim: başlık yüksekliği iki durumda da aynı; üst şerit ve rezervasyon kartı taşması yalnızca masaüstünde */
  --header-h:          72px;
  --header-offset:     var(--header-h); /* sabit başlığın kapladığı yükseklik (masaüstünde + üst şerit) */
  --header-pad-x:      1rem;
  --topbar-h:          0px;
  --booking-overlap:   0px;
  --logo-h:            44px;
}
@media (min-width: 576px) {
  :root { --header-pad-x: 1.25rem; }
}
@media (min-width: 768px) {
  :root { --section-y: var(--space-7); }
}
@media (min-width: 992px) {
  :root {
    --header-h: 88px;
    --header-pad-x: 1.5rem;
    --topbar-h: 44px;
    --booking-overlap: 4.5rem;
    --logo-h: 52px;
  }
}
@media (min-width: 1200px) {
  :root { --section-y: var(--space-8); --header-pad-x: 2.5rem; }
}

/* Koyu yüzeyler: odak/hover/etiket/süs/pasif-buton/ipucu renkleri tek yerden döner */
.site-footer,
.section--dark,
.hero-slider,
.room-detail-hero:not(.room-detail-hero--empty),
.page-hero--media,
.room-card__panel {
  --focus-ring:    var(--ramada-red-light);
  --link-hover:    var(--ramada-red-light);
  --eyebrow:       var(--on-dark-muted);
  --ornament:      var(--ramada-red-light);
  --disabled-fg:   var(--on-dark-subtle);
  --disabled-line: rgb(var(--white-rgb) / .3);
  --tip-bg:        var(--white);
  --tip-fg:        var(--ink);
}

/* ── Reset & Temel ───────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html {
  scroll-behavior: smooth;
  /* Sabit başlık çapa hedeflerini örtmesin */
  scroll-padding-top: var(--header-h);
  -webkit-text-size-adjust: 100%;
  /* Son çare güvenlik ağı: gerçek taşma nedenleri bileşenlerde giderildi.
     Yalnızca html'de (görünüm alanına aktarılır); body'de olsaydı sticky kutular bozulurdu. */
  overflow-x: hidden;
}
/* Mobil menü açıkken sayfa kaydırması kilitlenir (html'de; body'deki overflow görünüm alanına aktarılmaz) */
html.is-nav-open { overflow: hidden; }

body {
  font-family: var(--font-sans);
  font-size: var(--fs-body);
  font-weight: 400;
  line-height: var(--lh-body);
  color: var(--text);
  background: var(--bg-page);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  /* Uzun kelime / URL satırı taşırmasın */
  overflow-wrap: break-word;
}

img { max-width: 100%; height: auto; }
video, iframe, embed, object { max-width: 100%; }
a { color: inherit; text-decoration: none; transition: color var(--dur-fast) var(--ease-out); }
/* Özgüllük yalnızca :hover'dan gelir; renk tanımlayan bileşenler kendi hover'ını yazar */
:where(a):hover { color: var(--link-hover); }
:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 3px; }
::selection { background: var(--ramada-red-tint); color: var(--ink); }

/* ── Tipografi ───────────────────────────────────────────── */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-display);
  font-weight: 300;
  line-height: var(--lh-heading);
  letter-spacing: var(--ls-heading);
  color: var(--text);
  /* Cormorant Garamond kendi kalınlıklarını taşır; sahte stil yok */
  font-synthesis: none;
}
b, strong { font-weight: 600; }

/* Üst etiket (eyebrow): dar, geniş aralıklı, gri; önünde kırmızı kıvrım süsü */
.section-label {
  display: block;
  margin-bottom: var(--space-2);
  font-family: var(--font-condensed);
  font-size: var(--fs-eyebrow);
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: var(--ls-eyebrow);
  text-transform: uppercase;
  color: var(--eyebrow);
}
/* Süs yalnızca dekoratif (boş içerik okunmaz); rengi bağlama göre --ornament'ten */
.section-label::before,
.hero-pretitle::before,
.booking-bar-label::before,
.cookie-consent__eyebrow::before {
  content: '';
  display: inline-block;
  width: 2.5rem;
  height: .8125rem;
  margin-right: .75rem;
  vertical-align: -.1em;
  background: var(--ornament);
  -webkit-mask: var(--ornament-img) no-repeat center / contain;
  mask: var(--ornament-img) no-repeat center / contain;
}
.section-title {
  margin-bottom: 0;
  font-family: var(--font-display);
  font-size: var(--fs-h2);
  font-weight: 300;
  line-height: var(--lh-heading);
  letter-spacing: var(--ls-heading);
  color: var(--text);
  text-wrap: balance;
}
.section-title--sm { font-size: var(--fs-h3); }
.section-title--display { font-size: var(--fs-display); font-weight: 300; line-height: 1.08; letter-spacing: -0.025em; }
.section-subtitle {
  max-width: 40rem;
  margin: var(--space-3) auto 0;
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--text-body);
}
/* Ortalı bölüm başlığı ve alt eylem satırı */
.section-head { max-width: 46rem; margin: 0 auto var(--space-5); text-align: center; }
.section-foot { margin-top: var(--space-5); text-align: center; }
/* Başlık altı ince ayraç (referansta başlık ile metin arasındaki uzun ince çizgi) */
.title-divider {
  width: 100%;
  max-width: 22rem;
  height: 1px;
  margin: var(--space-3) auto;
  background: var(--line);
}
.title-divider--left { margin-left: 0; }
.title-divider--spaced { margin-bottom: var(--space-4); }

/* Metin bağlantısı + ok (ikincil eylem) */
.link-arrow {
  display: inline-flex;
  align-items: center;
  gap: .625rem;
  min-height: 44px;
  font-family: var(--font-condensed);
  font-size: var(--fs-sm);
  font-weight: 500;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--accent);
}
.link-arrow i { font-size: .75em; transition: transform var(--dur-fast) var(--ease-out); }
.link-arrow:hover { color: var(--accent-hover); }
.link-arrow:hover i { transform: translate3d(4px, 0, 0); }

/* ── Bölümler ─────────────────────────────────────────────── */
.section-pad { padding-block: var(--section-y); }
.section-pad-sm { padding-block: calc(var(--section-y) * .75); }
.section--white { background: var(--surface); }
.section--alt { background: var(--bg-alt); }
.section--dark { background: var(--night); color: var(--on-dark-muted); }
.section--dark .section-title { color: var(--on-dark); }

/* ── Butonlar ────────────────────────────────────────────── */
/* Ortak taban: aynı sınıflar hem <a> hem <button> olarak basılır (rezervasyon kapalıyken <button>) */
.btn-hotel,
.btn-hotel-dark,
.btn-hotel-outline,
.btn-room-detail,
.btn-room-book,
.room-booking-btn {
  -webkit-appearance: none;
  appearance: none;
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .625rem;
  max-width: 100%;
  min-height: 52px;
  margin: 0;
  padding: .875rem 2.25rem;
  border: 1px solid transparent;
  border-radius: var(--radius);
  background: transparent;
  color: inherit;
  font-family: var(--font-sans);
  font-size: var(--fs-btn);
  font-weight: 500;
  line-height: 1.3;
  letter-spacing: var(--ls-btn);
  text-align: center;
  text-decoration: none;
  text-transform: uppercase;
  cursor: pointer;
  transition:
    background-color var(--dur-fast) var(--ease-out),
    border-color var(--dur-fast) var(--ease-out),
    color var(--dur-fast) var(--ease-out);
}

/* Birincil + rezervasyon CTA: marka kırmızısı dolgu, beyaz metin (5.5:1) */
.btn-hotel,
.btn-room-book,
.room-booking-btn {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--white);
}
.btn-hotel:hover,
.btn-room-book:hover,
.room-booking-btn:hover {
  background: var(--accent-hover);
  border-color: var(--accent-hover);
  color: var(--white);
}
.btn-hotel--sm { min-height: 44px; padding: .625rem 1.375rem; }
.btn-hotel--block { width: 100%; }
.btn-hotel__arrow { font-size: .625rem; }
/* Form gönderilirken (contact.js disabled verir) */
.btn-hotel:disabled:not(.is-disabled) {
  background: var(--accent-hover);
  border-color: var(--accent-hover);
  color: var(--white);
  cursor: progress;
}

.btn-hotel-dark {
  background: var(--ink);
  border-color: var(--ink);
  color: var(--white);
}
.btn-hotel-dark:hover {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--white);
}

/* Fotoğraf / koyu zemin üstü ikincil buton */
.btn-hotel-outline {
  border-color: rgb(var(--white-rgb) / .75);
  color: var(--white);
}
.btn-hotel-outline:hover {
  background: var(--white);
  border-color: var(--white);
  color: var(--ink);
}

/* Oda kartı butonları (kompakt). Esas genişlik içerikten gelir: ikisi sığmazsa
   metin buton içinde kırılmak yerine butonlar tam genişlikte alt alta dizilir. */
.btn-room-detail,
.btn-room-book {
  flex: 1 1 auto;
  min-height: 46px;
  padding: .625rem 1.125rem;
  gap: .375rem;
}
.btn-room-detail {
  border-color: var(--ink);
  color: var(--ink);
}
.btn-room-detail:hover {
  background: var(--ink);
  border-color: var(--ink);
  color: var(--white);
}

/* Oda detay rezervasyon kutusu butonu (blok) */
.room-booking-btn { display: flex; width: 100%; }

/* Pasif rezervasyon butonu: görünür ve tanınır, ama açıkça işlevsiz */
:is(.btn-hotel, .btn-hotel-dark, .btn-hotel-outline, .btn-room-book, .room-booking-btn).is-disabled,
:is(.btn-hotel, .btn-hotel-dark, .btn-hotel-outline, .btn-room-book, .room-booking-btn).is-disabled:hover {
  background: transparent;
  border-color: var(--disabled-line);
  color: var(--disabled-fg);
  cursor: not-allowed;
}

/* "Yakında" ipucu: varsayılan olarak butonun ÜSTÜNDE, ortalı.
   Gizliyken de kutusu yerleşimde durur; bu yüzden hizalama taşma yaratmayacak şekilde seçildi. */
.is-disabled[data-tooltip]::after {
  --tip-x: -50%;
  --tip-y: .25rem;
  content: attr(data-tooltip);
  position: absolute;
  bottom: calc(100% + .625rem);
  left: 50%;
  z-index: 30;
  width: max-content;
  max-width: 14rem;
  padding: .5rem .75rem;
  border-radius: var(--radius);
  background: var(--tip-bg);
  box-shadow: var(--shadow-sm);
  color: var(--tip-fg);
  font-family: var(--font-sans);
  font-size: var(--fs-xs);
  font-weight: 400;
  line-height: 1.45;
  letter-spacing: .01em;
  text-align: center;
  text-transform: none;
  white-space: normal;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  transform: translate3d(var(--tip-x), var(--tip-y), 0);
  transition:
    opacity var(--dur-fast) var(--ease-out),
    transform var(--dur-fast) var(--ease-out),
    visibility 0s linear var(--dur-fast);
}
/* :focus da dahil: telefonda dokunma odak verir ve ipucu görünür */
.is-disabled[data-tooltip]:is(:hover, :focus, :focus-visible)::after {
  --tip-y: 0;
  opacity: 1;
  visibility: visible;
  transition-delay: 0s;
}
/* Sağ kenara yakın butonlarda ipucu sağa yaslanır (kart/şerit dışına taşmasın) */
.room-card .is-disabled[data-tooltip]::after {
  --tip-x: 0;
  left: auto;
  right: 0;
}

/* ── İçeriğe geç bağlantısı (klavye ile ilk odak; yalnızca odakta görünür) ── */
.skip-link {
  position: fixed;
  top: .5rem;
  left: .5rem;
  z-index: 2000;
  padding: .75rem 1.25rem;
  background: var(--ink);
  color: var(--white);
  font-size: var(--fs-sm);
  font-weight: 500;
  transform: translate3d(0, -200%, 0);
}
.skip-link:focus { transform: none; color: var(--white); }
#main:focus { outline: none; }

/* ── Header ──────────────────────────────────────────────── */
/* Telefon/tablet: her zaman beyaz şerit. Masaüstü ana sayfa: şeffaf başlar (.transparent),
   kaydırınca beyaza döner (.scrolled, header.js) ve üst şerit yukarı kayar.
   Yükseklik iki durumda da aynı; yalnızca zeminin opaklığı ve başlığın transform'u canlanır. */
.site-header {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 1000;
  color: var(--text);
  transition: transform var(--dur) var(--ease-out);
}
.site-header::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--surface);
  box-shadow: var(--shadow-header);
  pointer-events: none;
  transition: opacity var(--dur) var(--ease-out);
}
/* Mobil menü açıkken başlık ile beyaz panel arasında ince çizgi */
.site-header.is-menu-open::before { box-shadow: 0 1px 0 var(--line); }

/* Üst şerit (masaüstü): solda sosyal medya + e-posta, sağda yalnızca telefonlar. Sayfanın en üstünde görünür
   (beyaz başlıkta koyu, şeffaf başlıkta beyaz metin); kaydırınca başlıkla birlikte yukarı kayar. Telefonda mobil menüde. */
.header-topbar { display: none; }
.header-topbar__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  height: 100%;
  padding: 0 var(--header-pad-x);
}
.header-topbar__start,
.header-topbar__contact {
  display: flex;
  align-items: center;
  gap: var(--space-4);
  min-width: 0;
}
.header-topbar__contact { margin-left: auto; }
.header-topbar__link {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  font-size: var(--fs-sm);
  line-height: 1.4;
  letter-spacing: .02em;
  white-space: nowrap;
  color: var(--topbar-fg, var(--text));
}
.header-topbar__link i { font-size: .8125rem; color: var(--topbar-icon, var(--accent)); }
/* Telefon sırası (standart 100.03.06): resmi rezervasyon hattı önce ve belirgin, otel numarası sonra ve küçük */
.header-topbar__label {
  font-family: var(--font-condensed);
  font-size: .75rem;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--topbar-muted, var(--text-subtle));
}
.header-topbar__link--primary { font-weight: 500; }
.header-topbar__link--secondary { font-size: var(--fs-xs); color: var(--topbar-muted, var(--text-subtle)); }
.header-topbar__link--secondary .header-topbar__label { font-size: .6875rem; }
.header-topbar__link:hover,
.header-topbar__link:hover i { color: var(--topbar-hover, var(--accent)); }
.header-topbar .social-links__link { color: var(--topbar-fg, var(--text)); }
.header-topbar .social-links__link:hover { color: var(--topbar-hover, var(--accent)); }

/* Sosyal medya ikonları (üst şerit, mobil menü, footer) */
.social-links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .375rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
.social-links__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  font-size: .9375rem;
  color: inherit;
  transition: color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out), background-color var(--dur-fast) var(--ease-out);
}
.social-links--boxed { gap: .5rem; }
.social-links--boxed .social-links__link {
  width: 44px;
  height: 44px;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius);
  color: var(--text);
}
.social-links--boxed .social-links__link:hover {
  border-color: var(--accent);
  background: var(--accent);
  color: var(--white);
}

.header-inner {
  display: flex;
  align-items: center;
  gap: .75rem;
  height: var(--header-h);
  padding: 0 var(--header-pad-x);
}

/* Logo: dar ekranda metin kısalır, hamburger her zaman görünür kalır.
   Otel logosu ve Wyndham Rewards logosu solda yan yana; aradaki boşluğu menü/eylemler alır. */
.site-logo {
  display: flex;
  align-items: center;
  gap: .75rem;
  min-width: 0;
  flex-shrink: 1;
  color: inherit;
  text-decoration: none;
}
.site-logo:hover { color: inherit; }
/* İki logo aynı ızgara hücresinde üst üste: durum değişince yalnızca opaklık değişir */
.site-logo__media { display: grid; min-width: 0; }
.site-logo__media > .site-logo-img { grid-area: 1 / 1; }
.site-logo-img {
  display: block;
  width: auto;
  height: var(--logo-h);
  max-width: min(58vw, 15rem);
  object-fit: contain;
  object-position: left center;
  transition: opacity var(--dur) var(--ease-out);
}
.site-logo-img--light { opacity: 0; }
/* Marka kuralı (100.03.02): logoya renk filtresi uygulanmaz, monogram çizilmez. Resmi açık logo yoksa başlık
   şeffaf başlamaz (header.php); logo hiç yoksa otelin adı düz metin olarak yazılır. */
.site-logo-name {
  display: block;
  font-family: var(--font-display);
  font-size: 1.25rem;
  font-weight: 300;
  line-height: 1.1;
  letter-spacing: -0.01em;
}
.site-logo-sub {
  display: block;
  margin-top: .25rem;
  font-family: var(--font-condensed);
  font-size: .6875rem;
  font-weight: 500;
  line-height: 1.3;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--text-subtle);
  transition: color var(--dur) var(--ease-out);
}
.site-logo-name,
.site-logo-sub { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.site-logo > .site-logo-name { max-width: min(62vw, 18rem); }

/* Wyndham Rewards (otel logosunun sağında; wyndhamhotels.com'a gider). Resmi PNG yoksa menü yazısıyla aynı
   biçimde tek satır "Wyndham Rewards®" metni (logo taklidi çizilmez). İnce dikey çizgiyle otel logosundan ayrılır. */
.header-rewards {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  min-height: 44px;
  margin-left: .75rem;
  padding-left: .75rem;
  border-left: 1px solid var(--rewards-line, var(--line-strong));
  color: inherit;
  text-decoration: none;
}
.header-rewards:hover { color: var(--link-hover); }
.header-rewards__media { display: grid; align-items: center; }
.header-rewards__media > * { grid-area: 1 / 1; transition: opacity var(--dur) var(--ease-out); }
.header-rewards__img {
  display: block;
  width: auto;
  height: calc(var(--logo-h) * .62);
  max-width: 7.5rem;
  object-fit: contain;
}
.header-rewards__img--light { opacity: 0; }
.header-rewards__text {
  display: block;
  font-family: var(--font-sans);
  font-size: .6875rem;
  font-weight: 500;
  line-height: 1.3;
  letter-spacing: var(--ls-nav);
  white-space: nowrap;
}
@media (min-width: 576px) {
  .header-rewards { margin-left: 1rem; padding-left: 1rem; }
  .header-rewards__text { font-size: var(--fs-nav); }
}

/* Navigasyon (masaüstü, 1200+; daha dar ekranda menü hamburger panelinde) */
.site-nav { display: none; align-items: center; align-self: stretch; margin-left: auto; }
.nav-link-hotel {
  --nav-pad-x: .75rem;
  position: relative;
  display: block;
  padding: .5rem var(--nav-pad-x);
  font-family: var(--font-sans);
  font-size: var(--fs-nav);
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: var(--ls-nav);
  text-transform: uppercase;
  white-space: nowrap;
  color: inherit;
}
.nav-link-hotel::after {
  content: '';
  position: absolute;
  bottom: .125rem; left: var(--nav-pad-x); right: var(--nav-pad-x);
  height: 1px;
  background: var(--nav-line, var(--accent));
  transform: scaleX(0);
  transform-origin: left;
  transition: transform var(--dur) var(--ease-out);
}
.nav-link-hotel:hover,
.nav-link-hotel.active { color: var(--nav-active, var(--accent)); }
.nav-link-hotel:hover::after,
.nav-link-hotel.active::after { transform: scaleX(1); }
/* Açılır menü başlığı ve mobil grup başlığı <button>: bağlantıyla aynı görünür */
button.nav-link-hotel {
  margin: 0;
  background: none;
  border: 0;
  border-radius: 0;
  text-align: left;
  cursor: pointer;
}

/* Rezervasyon & Dil header butonları */
.header-actions {
  display: none;
  align-items: center;
  gap: 1rem;
  margin-left: auto;
}
.header-book-btn { display: none; }
/* Başlıkta ipucu butonun ALTINDA, sağa yaslı (üstte görünüm alanı yok) */
.header-actions .is-disabled[data-tooltip]::after {
  --tip-x: 0;
  --tip-y: -.25rem;
  top: calc(100% + .625rem);
  bottom: auto;
  left: auto;
  right: 0;
}
/* Dil seçici: düz metin (TR | EN), etkin dil koyu */
.lang-switch { display: inline-flex; align-items: center; }
.lang-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.25rem;
  padding: .25rem .5rem;
  font-family: var(--font-sans);
  font-size: var(--fs-nav);
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: var(--ls-nav);
  text-transform: uppercase;
  text-decoration: none;
  color: var(--text-subtle);
  transition: color var(--dur-fast) var(--ease-out);
}
.lang-btn + .lang-btn { border-left: 1px solid var(--line-strong); }
.lang-btn:hover { color: var(--accent); }
.lang-btn.is-current { color: var(--text); cursor: default; }

/* Header alt menü (fare, klavye odağı ve dokunmayla açılır: header.js); panel her durumda beyaz.
   Açılır öğe başlığın tüm yüksekliğini kaplar: panel başlığın alt kenarından başlar ve fare
   başlıktan panele inerken menü kapanmaz. */
.nav-dropdown { position: relative; display: flex; align-items: center; align-self: stretch; }
.nav-dropdown > .nav-link-hotel { display: flex; align-items: center; gap: .375rem; }
.nav-dropdown-caret { font-size: .625rem; transition: transform var(--dur-fast) var(--ease-out); }
.nav-dropdown.is-open .nav-dropdown-caret { transform: rotate(180deg); }
.nav-dropdown-menu {
  /* Şeffaf başlıkta bile panel açık zemin: bağlam renkleri geri alınır */
  --focus-ring: var(--ramada-red);
  --link-hover: var(--ramada-red);
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 14rem;
  padding: .5rem 0;
  background: var(--surface);
  border-top: 2px solid var(--accent);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  color: var(--text);
  opacity: 0;
  visibility: hidden;
  transform: translate3d(0, .375rem, 0);
  transition:
    opacity var(--dur-fast) var(--ease-out),
    transform var(--dur-fast) var(--ease-out),
    visibility 0s linear var(--dur-fast);
}
/* Sağ kenardaki alt menü ekran dışına taşmasın */
.nav-dropdown:last-child .nav-dropdown-menu { left: auto; right: 0; }
.nav-dropdown:hover .nav-dropdown-menu,
.nav-dropdown:focus-within .nav-dropdown-menu,
.nav-dropdown.is-open .nav-dropdown-menu { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
/* Esc ile kapatılan menü, fare/odak ayrılana kadar kapalı kalır */
.nav-dropdown.is-closed .nav-dropdown-menu { opacity: 0; visibility: hidden; transform: translate3d(0, .375rem, 0); }
.nav-dropdown-item {
  display: block;
  padding: .5625rem 1.25rem;
  font-size: var(--fs-sm);
  color: var(--text-body);
}
.nav-dropdown-item:hover,
.nav-dropdown-item.active { color: var(--accent); }

/* Geniş (sütunlu) menü: alt öğeleri sütun başlığı olan menü (Olanaklar, Etkinlikler). Başlığın iki kenarı
   arasında açılır; sütunlar ince çizgiyle ayrılır (örnek site). */
.nav-dropdown--mega { position: static; }
.nav-dropdown--mega .nav-dropdown-menu {
  left: var(--header-pad-x);
  right: var(--header-pad-x);
  padding: 0;
}
.nav-mega { display: grid; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); }
.nav-mega__col { min-width: 0; padding: var(--space-4) var(--space-4) var(--space-3); }
.nav-mega__col + .nav-mega__col { border-left: 1px solid var(--line); }
.nav-mega__title {
  display: block;
  margin-bottom: .75rem;
  font-family: var(--font-display);
  font-size: 1.125rem;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--text);
}
a.nav-mega__title:hover,
a.nav-mega__title.active { color: var(--accent); }
.nav-mega__list { margin: 0; padding: 0; list-style: none; }
.nav-mega__list .nav-dropdown-item { padding: .4375rem 0; }
/* Başlığın kendi sayfası (Olanaklar › Tüm Olanaklar) sütunların altında */
.nav-mega__foot { padding: 0 var(--space-4); border-top: 1px solid var(--line); }

/* Mobil menü butonu (44px dokunma alanı) */
.mobile-toggle {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: center;
  gap: 6px;
  flex-shrink: 0;
  width: 44px; height: 44px;
  margin-right: -8px;
  padding: 0 8px;
  background: none;
  border: none;
  color: inherit;
  cursor: pointer;
}
.mobile-toggle span {
  display: block;
  width: 26px; height: 2px;
  background: currentColor;
  transition: transform var(--dur-fast) var(--ease-out), opacity var(--dur-fast) var(--ease-out);
}
.mobile-toggle span:nth-child(2) { width: 18px; }
.mobile-toggle.is-open span:nth-child(1) { transform: translate3d(0, 8px, 0) rotate(45deg); }
.mobile-toggle.is-open span:nth-child(2) { opacity: 0; }
.mobile-toggle.is-open span:nth-child(3) { transform: translate3d(0, -8px, 0) rotate(-45deg); }

/* Mobil menü: başlığın altında beyaz tam ekran panel; kapalıyken görünmez ve odaklanamaz (visibility) */
.mobile-nav {
  position: fixed;
  inset: 0;
  z-index: 999;
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  padding: calc(var(--header-h) + var(--space-2)) var(--space-3) var(--space-4);
  background: var(--surface);
  color: var(--text);
  overflow-y: auto;
  overscroll-behavior: contain;
  opacity: 0;
  visibility: hidden;
  transform: translate3d(0, -.5rem, 0);
  transition:
    opacity var(--dur-fast) var(--ease-out),
    transform var(--dur-fast) var(--ease-out),
    visibility 0s linear var(--dur-fast);
}
.mobile-nav.is-open {
  opacity: 1;
  visibility: visible;
  transform: none;
  transition-delay: 0s;
}
.mobile-nav__links { display: flex; flex-direction: column; }
.mobile-nav .nav-link-hotel {
  display: block;
  padding: .875rem 0;
  border-bottom: 1px solid var(--line);
  font-family: var(--font-display);
  font-size: 1.75rem;
  font-weight: 300;
  line-height: 1.2;
  letter-spacing: -0.02em;
  text-transform: none;
  white-space: normal;
  color: var(--text);
}
.mobile-nav .nav-link-hotel:hover,
.mobile-nav .nav-link-hotel.active { color: var(--accent); }
.mobile-nav .nav-link-hotel::after { display: none; }
.mobile-nav .nav-link-sub { padding-left: 1.25rem; font-size: 1.25rem; color: var(--text-body); }
/* Alt menü grupları: başlık düğmesi aç/kapa (JS yokken hepsi açık) */
.mobile-nav .mobile-nav__toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2);
  width: 100%;
}
.mobile-nav__caret { flex-shrink: 0; font-size: 1rem; color: var(--text-subtle); transition: transform var(--dur-fast) var(--ease-out); }
.mobile-nav__toggle[aria-expanded="true"] .mobile-nav__caret { transform: rotate(180deg); }
.mobile-nav__sub { padding-bottom: .5rem; border-bottom: 1px solid var(--line); }
.mobile-nav__sub .nav-link-sub { padding-block: .625rem; border-bottom: 0; }
.mobile-nav__heading {
  display: block;
  padding: .875rem 0 .25rem 1.25rem;
  font-family: var(--font-condensed);
  font-size: .8125rem;
  font-weight: 500;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--text-subtle);
}
a.mobile-nav__heading:hover,
a.mobile-nav__heading.active { color: var(--accent); }
.mobile-nav-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1.25rem; }
.mobile-nav .lang-btn { min-width: 44px; min-height: 44px; }
/* CTA kalan genişliği doldurur: ortalı ipucu dar ekranda da menü dışına taşmaz */
.mobile-nav-actions .btn-hotel { flex: 1 1 auto; }
.mobile-nav-contact {
  display: flex;
  flex-direction: column;
  gap: .25rem;
  margin-top: auto;
  padding-top: var(--space-3);
  border-top: 1px solid var(--line);
}
.mobile-nav-contact__link {
  display: inline-flex;
  align-items: center;
  gap: .75rem;
  min-height: 44px;
  font-size: var(--fs-body);
  color: var(--text-body);
  overflow-wrap: anywhere;
}
.mobile-nav-contact__link i { flex-shrink: 0; width: 1rem; color: var(--accent); }
.mobile-nav-contact__label {
  display: block;
  font-family: var(--font-condensed);
  font-size: .75rem;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--text-subtle);
}
.mobile-nav-contact__link--primary { font-weight: 500; color: var(--text); }
.mobile-nav-contact__link--secondary { font-size: var(--fs-sm); }
.mobile-nav-contact__link--secondary i { color: var(--text-subtle); }
.mobile-nav-contact .social-links { margin-top: var(--space-2); }

/* Hamburger: eylemler gizliyken (telefon) sağa yaslanır */
.mobile-toggle { margin-left: auto; }
@media (min-width: 576px) {
  .header-actions { display: flex; }
  .mobile-toggle { margin-left: .5rem; }
}
@media (min-width: 992px) {
  .site-logo-name { font-size: 1.3125rem; }
  .header-book-btn { display: inline-flex; }

  /* Üst şerit: sayfanın en üstünde görünür; kaydırınca (header.js › .is-scrolled) başlık şerit yüksekliği
     kadar yukarı kayar (transform) ve şerit odaklanamaz hale gelir. Beyaz başlıkta içerik şerit kadar
     aşağıdan başlar (--header-offset). */
  .header-topbar {
    display: block;
    height: var(--topbar-h);
    border-bottom: 1px solid var(--line);
    visibility: hidden;
    transition: visibility 0s linear var(--dur);
  }
  .site-header--topbar { transform: translate3d(0, calc(-1 * var(--topbar-h)), 0); }
  .site-header--topbar:not(.is-scrolled) { transform: none; }
  .site-header--topbar:not(.is-scrolled) .header-topbar { visibility: visible; transition-delay: 0s; }
  .has-topbar { --header-offset: calc(var(--header-h) + var(--topbar-h)); }
  .site-header.transparent .header-topbar {
    --topbar-fg: var(--on-dark);
    --topbar-muted: var(--on-dark-muted);
    --topbar-icon: var(--on-dark-muted);
    --topbar-hover: var(--on-dark-muted);
    border-bottom-color: rgb(var(--white-rgb) / .16);
  }

  /* Şeffaf durum: hero üstünde beyaz metin, açık logo; koyu yüzey renkleri */
  .site-header.transparent {
    --focus-ring:    var(--ramada-red-light);
    --link-hover:    var(--on-dark);
    --disabled-fg:   var(--on-dark-subtle);
    --disabled-line: rgb(var(--white-rgb) / .35);
    --tip-bg:        var(--white);
    --tip-fg:        var(--ink);
    --nav-line:      var(--white);
    --nav-active:    var(--on-dark);
    color: var(--on-dark);
  }
  .site-header.transparent::before { opacity: 0; }
  .site-header.transparent .site-logo-img--color { opacity: 0; }
  .site-header.transparent .site-logo-img--light { opacity: 1; }
  .site-header.transparent { --rewards-line: rgb(var(--white-rgb) / .35); }
  .site-header.transparent .header-rewards__img--color { opacity: 0; }
  .site-header.transparent .header-rewards__img--light { opacity: 1; }
  .site-header.transparent .header-rewards:hover { color: var(--on-dark-muted); }
  .site-header.transparent .site-logo-sub { color: var(--on-dark-muted); }
  .site-header.transparent .nav-link-hotel { text-shadow: 0 1px 12px rgb(var(--night-rgb) / .35); }
  .site-header.transparent .lang-btn { color: var(--on-dark-muted); }
  .site-header.transparent .lang-btn + .lang-btn { border-left-color: rgb(var(--white-rgb) / .35); }
  .site-header.transparent .lang-btn.is-current,
  .site-header.transparent .lang-btn:hover { color: var(--on-dark); }
}
/* Tam menü 1200+: 1200-1399 arası sıkı (yedi üst öğe + iki logo + dil + rezervasyon sığsın) */
@media (min-width: 1200px) {
  :root { --header-pad-x: 1.5rem; }
  .site-nav { display: flex; }
  .mobile-toggle,
  .mobile-nav { display: none; }
  .nav-link-hotel { --nav-pad-x: .5rem; font-size: .75rem; letter-spacing: .04em; }
  .header-actions { margin-left: .75rem; gap: .75rem; }
}
@media (min-width: 1400px) {
  :root { --header-pad-x: 2.5rem; }
  .nav-link-hotel { --nav-pad-x: .8125rem; font-size: var(--fs-nav); letter-spacing: var(--ls-nav); }
  .header-actions { margin-left: 1.25rem; gap: 1.25rem; }
}

/* ── Hero Slider ──────────────────────────────────────────── */
/* Telefon/tablet: beyaz başlığın altında başlar. Masaüstü: tam ekran, şeffaf başlık üstünde;
   alt kenarına rezervasyon kartı biner (metin ve kontroller o payı bırakır). */
.hero-slider {
  position: relative;
  margin-top: var(--header-h);
  height: calc(88vh - var(--header-h));
  height: calc(88svh - var(--header-h));
  min-height: 30rem;
  max-height: 52rem;
  overflow: hidden;
  background: var(--night);
  color: var(--on-dark);
}
.hero-swiper {
  height: 100%;
  --swiper-theme-color: var(--white);
}
.hero-slide {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  padding: var(--space-5) 0 var(--space-6);
  overflow: hidden;
  background: var(--night-soft);
}
.hero-slide--static { background: var(--night); }
/* Görsel ve arka plan videosu aynı kutuyu doldurur */
.hero-slide__img,
.hero-slide__video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/* Yavaş yakınlaşma yalnızca görselde; video ölçeklenmez */
.hero-slide__img {
  transform: scale(1.06);
  transition: transform 8s ease;
}
.swiper-slide-active .hero-slide__img { transform: scale(1); }
/* Üstte başlık, ortada metin, altta kontroller için gece tonlu perde */
.hero-slide-overlay {
  position: absolute;
  inset: 0;
  background: var(--scrim-hero);
}
.hero-content {
  position: relative;
  z-index: 10;
  width: 100%;
  max-width: 62rem;
  padding: 0 1.25rem;
  text-align: center;
  /* Aktif olmayan slaydın metni hem görünmez hem tıklanamaz/odaklanamaz */
  visibility: hidden;
  transition: visibility 0s linear var(--dur-fast);
}
.hero-pretitle {
  display: block;
  margin-bottom: var(--space-2);
  font-family: var(--font-condensed);
  font-size: var(--fs-eyebrow);
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: var(--ls-eyebrow);
  text-transform: uppercase;
  color: var(--on-dark);
}
.hero-title {
  margin-bottom: var(--space-3);
  font-family: var(--font-display);
  font-size: var(--fs-hero);
  font-weight: 300;
  line-height: 1.0;
  letter-spacing: -0.03em;
  color: var(--on-dark);
  overflow-wrap: anywhere;
  text-wrap: balance;
}
.hero-subtitle {
  max-width: 38rem;
  margin: 0 auto var(--space-4);
  font-size: var(--fs-lead);
  font-weight: 500;
  line-height: 1.7;
  color: var(--on-dark);
}
/* İnce yazılar parlak fotoğrafta kaybolmasın: sıkı + yumuşak gece tonlu gölge */
.hero-pretitle,
.hero-title,
.hero-subtitle { text-shadow: var(--text-shadow-photo); }
.hero-actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .75rem;
}
/* Fotoğraf üstündeki çerçeveli buton parlak zeminde kaybolmasın: hafif koyu perde */
.hero-actions .btn-hotel-outline { background: rgb(var(--night-rgb) / .28); border-color: var(--on-dark); }
.hero-actions .btn-hotel-outline:hover { background: var(--white); }
/* Fotoğraf üstünde pasif CTA'nın soluk metni okunabilsin (dolgu değil, hafif koyu perde) */
.hero-actions .is-disabled,
.hero-actions .is-disabled:hover { background: rgb(var(--night-rgb) / .4); }
/* Metin geçişi: çıkan slaydın metni hızla (gecikmesiz) söner,
   gelen slaydın metni görsel geçişi başladıktan sonra sırayla belirir → üst üste binme olmaz. */
.hero-content > * {
  opacity: 0;
  transform: translate3d(0, 1.25rem, 0);
  transition: opacity var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-out);
}
.swiper-slide-active .hero-content,
.hero-slide--static .hero-content,
.hero-swiper:not(.swiper-initialized) .swiper-slide:first-child .hero-content {
  visibility: visible;
  transition-delay: 0s;
}
.swiper-slide-active .hero-content > *,
.hero-slide--static .hero-content > *,
.hero-swiper:not(.swiper-initialized) .swiper-slide:first-child .hero-content > * {
  opacity: 1;
  transform: none;
  transition: opacity var(--dur-slow) var(--ease-out), transform var(--dur-slow) var(--ease-out);
}
.swiper-slide-active .hero-pretitle { transition-delay: .35s; }
.swiper-slide-active .hero-title    { transition-delay: .5s; }
.swiper-slide-active .hero-subtitle { transition-delay: .65s; }
.swiper-slide-active .hero-actions  { transition-delay: .8s; }

/* Slider okları (dokunmatik ekranda kaydırma yeterli; oklar masaüstünde) */
.hero-nav {
  position: absolute;
  top: 50%;
  z-index: 20;
  display: none;
  align-items: center;
  justify-content: center;
  width: 52px; height: 52px;
  border: 1px solid var(--line-on-photo);
  border-radius: var(--radius);
  background: rgb(var(--night-rgb) / .25);
  color: var(--on-dark);
  font-size: .875rem;
  cursor: pointer;
  transform: translateY(-50%);
  transition: background-color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
}
.hero-nav:hover { background: var(--accent); border-color: var(--accent); }
.hero-prev { left: 1.5rem; }
.hero-next { right: 1.5rem; }
/* Sayfalama: ince çizgiler; görünen çizgi 2px, tıklama alanı şeffaf kenarlıkla büyütülür */
/* Kutu yüksekliği = çizgi kutusu (22px): video düğmesiyle (44px) aynı merkez çizgisine oturur */
.hero-swiper .hero-pagination {
  position: absolute;
  bottom: calc(1rem + 11px);
  z-index: 20;
  display: flex;
  justify-content: center;
  line-height: 0;
}
.hero-pagination .swiper-pagination-bullet {
  box-sizing: content-box;
  width: 1.75rem;
  height: 2px;
  border: 10px solid transparent;
  border-left-width: 4px;
  border-right-width: 4px;
  border-radius: 0;
  background: var(--white);
  background-clip: content-box;
  opacity: .5;
  transition: opacity var(--dur-fast) var(--ease-out);
}
.hero-pagination .swiper-pagination-bullet:hover,
.hero-pagination .swiper-pagination-bullet-active { opacity: 1; }

/* Video duraklat/oynat (WCAG 2.2.2): sağ altta, rezervasyon kartının ve sayfalamanın dışında */
.hero-video-toggle {
  position: absolute;
  right: 1rem;
  bottom: 1rem;
  z-index: 20;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 1px solid var(--line-on-photo);
  border-radius: var(--radius);
  background: rgb(var(--night-rgb) / .45);
  color: var(--on-dark);
  font-size: .8125rem;
  cursor: pointer;
  transition: background-color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
}
.hero-video-toggle:hover { background: var(--accent); border-color: var(--accent); }
.hero-video-toggle[hidden] { display: none; }

/* Kaydırma göstergesi: referans temada yok; alt kenar sayfalama ve rezervasyon kartına ayrıldı */
.scroll-indicator { display: none; }

@media (min-width: 481px) {
  .hero-actions { flex-direction: row; flex-wrap: wrap; gap: var(--space-2); }
}
@media (min-width: 992px) {
  .hero-slider {
    margin-top: 0;
    height: 100vh;
    height: 100svh;
    min-height: 42rem;
    max-height: none;
  }
  /* Üstte şeffaf başlık (üst şerit + ana şerit), altta kartın bindiği pay */
  .hero-slide { padding: calc(var(--topbar-h) + var(--header-h)) 0 calc(var(--booking-overlap) + var(--space-5)); }
  .hero-nav { display: flex; }
  .hero-prev { left: var(--header-pad-x); }
  .hero-next { right: var(--header-pad-x); }
  .hero-swiper .hero-pagination { bottom: calc(var(--booking-overlap) + 1.25rem + 11px); }
  .hero-video-toggle { right: var(--header-pad-x); bottom: calc(var(--booking-overlap) + 1.25rem); }
}

/* ── Rezervasyon Kartı ────────────────────────────────────── */
/* Beyaz kart: masaüstünde hero'nun alt kenarına biner, telefonda hero'nun altına dizilir */
.booking-bar {
  position: relative;
  z-index: 30;
  padding-top: var(--space-4);
}
.hero-slider + .booking-bar { padding-top: var(--space-3); }
.booking-bar-inner {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--space-3);
  padding: var(--space-4) var(--space-3);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}
.booking-bar-head { min-width: 0; }
.booking-bar-label {
  display: block;
  margin-bottom: .375rem;
  font-family: var(--font-condensed);
  font-size: var(--fs-eyebrow);
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: var(--ls-eyebrow);
  text-transform: uppercase;
  color: var(--eyebrow);
}
.booking-bar-title {
  margin: 0;
  font-family: var(--font-display);
  font-size: 1.75rem;
  line-height: 1.2;
  color: var(--text);
}
.booking-bar-fallback {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  flex: 1;
  min-width: 0;
}
.booking-bar-fallback-text {
  margin: 0;
  font-size: var(--fs-sm);
  line-height: 1.75;
  color: var(--text-body);
}
.booking-bar .btn-hotel { width: 100%; }
.booking-bar-body { display: flex; flex-direction: column; gap: var(--space-2); flex: 1; min-width: 0; }
.booking-bar-note {
  margin: 0;
  font-size: var(--fs-xs);
  line-height: 1.6;
  color: var(--text-subtle);
}
.booking-bar-note > i { margin-right: .375rem; font-size: .6875rem; color: var(--accent); }
.booking-bar-note__phone { display: inline-block; margin-left: .5rem; font-weight: 500; color: var(--text-body); }
.booking-bar-note__phone a { color: var(--text); }
.booking-bar-note__phone a:hover { color: var(--accent); }

/* Müşterinin verdiği rezervasyon kodu (widget): kendi düzenini getirir; kap yalnızca alan ayırır.
   Kod yüklenirken kart çökmesin diye en az bir form satırı yüksekliği bırakılır. */
.booking-widget { min-width: 0; min-height: 48px; }
/* Çerez onayı beklenirken: kısa açıklama + "göster" + Wyndham rezervasyon butonu */
.booking-widget__placeholder { padding: var(--space-3); }
.booking-widget__placeholder .consent-embed__actions { align-items: center; }
.booking-widget iframe { display: block; width: 100%; border: 0; }

/* Tarih/kişi formu (booking_form.php): Wyndham Rooms & Rates'e yalnızca tarih ve kişi aktarır */
.booking-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-2);
  align-items: end;
}
.booking-form__field { min-width: 0; }
.booking-form__field--date { grid-column: span 1; }
.booking-form__label {
  display: block;
  margin-bottom: .375rem;
  font-family: var(--font-condensed);
  font-size: var(--fs-eyebrow);
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: var(--ls-eyebrow);
  text-transform: uppercase;
  color: var(--text-subtle);
}
.booking-form__input {
  display: block;
  width: 100%;
  min-height: 48px;
  padding: .625rem .75rem;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius);
  background: var(--surface);
  font-family: var(--font-sans);
  font-size: var(--fs-body);
  color: var(--text);
}
.booking-form__input:focus { border-color: var(--accent); }
.booking-form .select-hotel .booking-form__input { padding-right: 2.25rem; cursor: pointer; }
.booking-form .select-hotel::after { right: .75rem; }
.booking-form__submit { grid-column: 1 / -1; }
.booking-form__submit .btn-hotel { width: 100%; }
.booking-form__error { grid-column: 1 / -1; margin: 0; font-size: var(--fs-sm); color: var(--danger); }
.booking-form--compact { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.booking-form--compact .booking-form__field--date { grid-column: span 3; }
.btn-hotel__ext { font-size: .6875rem; }

@media (min-width: 768px) {
  .booking-bar-inner {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    padding: var(--space-4);
    gap: var(--space-3) var(--space-4);
  }
  .booking-bar-head { flex: 1 1 100%; }
  .booking-bar .btn-hotel { width: auto; white-space: nowrap; flex-shrink: 0; }
  .booking-form { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .booking-form__field--date { grid-column: span 1; }
  .booking-form__submit { grid-column: span 3; }
  .booking-bar .booking-form__submit .btn-hotel { width: 100%; }
  /* Buton satırın sağ ucunda: ipucu sağa yaslanır */
  .booking-bar .is-disabled[data-tooltip]::after { --tip-x: 0; left: auto; right: 0; }
}
@media (min-width: 992px) {
  .hero-slider + .booking-bar { margin-top: calc(-1 * var(--booking-overlap)); padding-top: 0; }
  .booking-bar-inner { flex-wrap: nowrap; padding: var(--space-4) var(--space-5); gap: var(--space-4); }
  /* Başlık dar sütunda iki satıra kırılır: açıklama metnine 992'de de rahat genişlik kalır */
  .booking-bar-head {
    flex: 0 0 15rem;
    padding-right: var(--space-4);
    border-right: 1px solid var(--line);
  }
  /* Formlu kart: başlık solda dar sütun, form sağda tek satır (giriş, çıkış, oda, yetişkin, çocuk, buton) */
  .booking-bar-inner--form { align-items: stretch; }
  .booking-bar-inner--form .booking-bar-head,
  .booking-bar-inner--widget .booking-bar-head { display: flex; flex-direction: column; justify-content: center; flex-basis: 13.5rem; }
  .booking-bar-inner--widget { align-items: stretch; }
  .booking-bar-inner--widget .booking-bar-title { font-size: 1.375rem; }
  .booking-bar-inner--form .booking-bar-title { font-size: 1.375rem; }
  .booking-bar-inner--form .booking-form { grid-template-columns: 1.3fr 1.3fr .8fr .8fr .8fr auto; }
  .booking-bar-inner--form .booking-form__submit { grid-column: auto; }
  .booking-bar-inner--form .booking-form__submit .btn-hotel { width: auto; padding-left: 1.5rem; padding-right: 1.5rem; }
}

/* ── Giriş Bloğu (ana sayfa tanıtım) ──────────────────────── */
.about-strip { background: var(--surface); }
.about-feature {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  padding: var(--space-3) 0;
  border-bottom: 1px solid var(--line);
}
.about-feature:first-child { padding-top: 0; }
.about-feature:last-child { padding-bottom: 0; border-bottom: 0; }
.about-feature > div:last-child { min-width: 0; }
.about-feature-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 60px; height: 60px;
  background: var(--bg-alt);
  border-radius: var(--radius);
  font-size: 1.375rem;
  color: var(--accent);
}
.about-feature-title {
  margin-bottom: .5rem;
  font-family: var(--font-display);
  font-size: var(--fs-h4);
  line-height: 1.25;
  color: var(--text);
}
.about-feature-text { max-width: 34rem; margin-bottom: 0; line-height: var(--lh-body); color: var(--text-body); }
@media (min-width: 992px) {
  .about-strip .row > .col-lg-5 { padding-right: var(--space-5); }
}

/* ── Olanaklar ───────────────────────────────────────────── */
/* Ana sayfa: solda başlık bloğu, sağda ince çizgili olanak listesi (992+ giriş bloğuyla aynı 5/7 ızgara).
   Liste satır satır dolar; iki sütunda çizgiler aynı hizada kalır. Listenin üst ve alt kenarı koyu çizgi
   (tablo kenarı), satır araları ince çizgidir; tek sayıda öğede son satırın boş hücresi sütun sonu gibi okunur. */
.amenities__lead {
  max-width: 30rem;
  margin: 0 0 var(--space-2);
  color: var(--text-body);
}
.amenity-list {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--line-strong);
  border-bottom: 1px solid var(--line-strong);
}
.amenity-list__item {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  min-width: 0;
  padding: .75rem 0;
  border-bottom: 1px solid var(--line);
}
/* Son satır: listenin koyu alt kenarı yeterli (çift çizgi olmasın) */
.amenity-list__item:last-child { border-bottom: 0; }
/* Beyaz kare içinde kırmızı ikon + Gilda etiket (bileşen dili) */
.amenity-list__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 2.5rem;
  height: 2.5rem;
  background: var(--surface);
  border-radius: var(--radius);
  font-size: 1rem;
  color: var(--accent);
}
.amenity-list__label {
  min-width: 0;
  font-family: var(--font-display);
  font-size: 1.125rem;
  line-height: 1.3;
  color: var(--text);
  overflow-wrap: anywhere;
}
@media (min-width: 576px) {
  .amenity-list { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--space-4); }
  /* İki sütunda son satırın ilk hücresi de (çift sayıda öğede) alt kenara oturur */
  .amenity-list__item:nth-last-child(2):nth-child(odd) { border-bottom: 0; }
}
@media (min-width: 992px) {
  .row > .amenities__intro { padding-right: var(--space-5); }
}
@media (min-width: 1200px) {
  .amenity-list { column-gap: var(--space-5); }
  .amenity-list__item { gap: 1.25rem; padding: 1rem 0; }
  .amenity-list__icon { width: 3rem; height: 3rem; font-size: 1.125rem; }
  .amenity-list__label { font-size: 1.25rem; }
}

/* ── Oda Kartları ─────────────────────────────────────────── */
/* Örnek sitenin oda kartı: tam görsel, altta gece tonlu perde üzerinde Gilda oda adı. Fareyle üzerine
   gelince (ya da klavye odağında) ad yukarı kayar, altında özellikler belirir. Özellik alanının
   yüksekliği satır sayısına göre sabittir (--room-details-h): kayma yalnızca transform ile yapılır.
   Dokunmatik ekranda (hover yok) özellikler her zaman görünür. Kartın tamamı oda sayfasına bağlıdır. */
.room-grid { --bs-gutter-y: var(--space-4); }
.room-card {
  --room-spec-row: 1.5rem;
  --room-spec-gap: .5rem;
  --room-rows: 0;
  /* sabit pay: üst boşluk .25 + liste payı .75 + "İncele" payı .875 + satırı 1.5 + alt boşluk 1.25 */
  --room-details-h: calc(var(--room-rows) * var(--room-spec-row) + max(var(--room-rows) - 1, 0) * var(--room-spec-gap) + 4.625rem);
  position: relative;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  border-radius: var(--radius);
  background: var(--night-soft);
  isolation: isolate;
}
.room-card--rows-1 { --room-rows: 1; }
.room-card--rows-2 { --room-rows: 2; }
.room-card--rows-3 { --room-rows: 3; }
.room-card--price  { --room-details-h: calc(var(--room-rows) * var(--room-spec-row) + max(var(--room-rows) - 1, 0) * var(--room-spec-gap) + 7.125rem); }
.room-card__media { position: absolute; inset: 0; z-index: -2; }
.room-card__media img {
  display: block;
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform var(--dur-slow) var(--ease-out);
}
.room-card:hover .room-card__media img { transform: scale(1.05); }
/* Görselsiz oda: koyu zemin üzerinde soluk ikon (başlık perdesi yine okunur) */
.room-card__empty {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%; height: 100%;
  padding-bottom: var(--space-6);
  font-size: 2.75rem;
  color: rgb(var(--white-rgb) / .16);
}
/* Alttan perde; hover'da koyulaşır (opaklık) */
.room-card::before,
.room-card::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
}
.room-card::before { background: var(--scrim-card); }
.room-card::after {
  background: rgb(var(--night-rgb) / .42);
  opacity: 0;
  transition: opacity var(--dur) var(--ease-out);
}
.room-card-badge {
  position: absolute;
  top: var(--space-2); left: var(--space-2);
  z-index: 2;
  padding: .3125rem .75rem;
  background: var(--accent);
  border-radius: var(--radius);
  color: var(--white);
  font-family: var(--font-condensed);
  font-size: .75rem;
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.room-card__panel {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  padding: var(--space-3) 1.25rem 0;
  color: var(--on-dark);
  transform: translate3d(0, var(--room-details-h), 0);
  transition: transform var(--dur) var(--ease-out);
}
.room-card__title {
  margin: 0 0 1.25rem;
  font-family: var(--font-display);
  font-size: 1.625rem;
  line-height: 1.2;
  color: var(--on-dark);
  text-shadow: 0 1px 14px rgb(var(--night-rgb) / .4);
  overflow-wrap: anywhere;
}
/* Başlık bağlantısı kartın tamamını kaplar (görsel ve özellikler de tıklanır) */
.room-card__link { color: inherit; }
.room-card__link::after { content: ''; position: absolute; inset: -100vh 0 0; z-index: 1; }
.room-card__link:hover { color: var(--on-dark); }
.room-card__link:focus-visible { outline: none; }
.room-card:has(.room-card__link:focus-visible) { outline: 2px solid var(--focus-ring); outline-offset: 3px; overflow: hidden; }
.room-card__details {
  height: var(--room-details-h);
  padding: .25rem 0 1.25rem;
  border-top: 1px solid var(--line-on-photo);
  opacity: 0;
  transition: opacity var(--dur) var(--ease-out);
}
.room-card__specs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--room-spec-gap) 1rem;
  margin: .75rem 0 0;
  padding: 0;
  list-style: none;
}
.room-card__spec {
  display: flex;
  align-items: center;
  gap: .625rem;
  min-width: 0;
  height: var(--room-spec-row);
  font-size: var(--fs-sm);
  color: var(--on-dark-muted);
}
.room-card__spec i { flex-shrink: 0; width: 1.125rem; font-size: 1rem; text-align: center; color: var(--on-dark); }
.room-card__spec span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.room-card__price {
  display: flex;
  flex-wrap: nowrap;
  align-items: baseline;
  gap: .5rem;
  margin: .75rem 0 0;
  line-height: 1.4;
  white-space: nowrap;
  font-family: var(--font-condensed);
  font-size: .8125rem;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--on-dark-muted);
}
.room-card__price-num { font-family: var(--font-display); font-size: 1.25rem; letter-spacing: 0; text-transform: none; color: var(--on-dark); }
.room-card__more {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  height: 1.5rem;
  margin-top: .875rem;
  font-family: var(--font-condensed);
  font-size: var(--fs-sm);
  font-weight: 500;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--on-dark);
}
.room-card__more i { font-size: .75em; color: var(--ornament); }
/* Fare ile üzerine gelince / klavye odağında: ad yukarı kayar, özellikler belirir */
.room-card:hover .room-card__panel,
.room-card:focus-within .room-card__panel { transform: none; }
.room-card:hover .room-card__details,
.room-card:focus-within .room-card__details { opacity: 1; }
.room-card:hover::after,
.room-card:focus-within::after { opacity: 1; }
/* Dokunmatik ekran: hover yok, özellikler hep görünür */
@media (hover: none), (pointer: coarse) {
  .room-card__panel { transform: none; }
  .room-card__details { opacity: 1; }
}
@media (min-width: 576px) {
  .room-card__panel { padding: var(--space-4) var(--space-3) 0; }
  .room-card__title { font-size: 1.75rem; }
}

/* ── Oda Listesi: Arama ve Filtre (views/rooms.php, assets/js/rooms.js) ── */
/* Sıcak kırık beyaz panel (iletişim formuyla aynı yüzey). Telefon: alanlar alt alta;
   576+: arama tam satır, misafir + sıralama yan yana; 992+: üçü tek satırda */
.room-filter {
  margin-bottom: var(--space-5);
  padding: var(--space-3) 1.125rem;
  background: var(--bg-alt);
  border-radius: var(--radius);
}
.room-filter__fields { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-2); }
.room-filter__field { min-width: 0; }
.room-filter__search { position: relative; }
.room-filter__search > i {
  position: absolute;
  top: 50%; left: 1rem;
  transform: translateY(-50%);
  font-size: .875rem;
  color: var(--text-subtle);
  pointer-events: none;
}
.room-filter__search .form-control-hotel { -webkit-appearance: none; appearance: none; padding-left: 2.75rem; }

/* Telefon: arama her zaman açık; misafir, sıralama ve olanaklar "Filtreler ve sıralama" düğmesiyle açılır.
   Düğmeyi ve kapalı durumu JS ekler (JS yoksa tüm alanlar açık); 768+ düğme yok, hepsi görünür */
.room-filter__toggle {
  display: flex;
  grid-column: 1 / -1;
  align-items: center;
  gap: .75rem;
  width: 100%;
  min-height: 48px;
  padding: .75rem 1rem;
  background: var(--surface);
  border: 1px solid var(--line-strong);
  border-radius: var(--radius);
  font-family: var(--font-condensed);
  font-size: .875rem;
  font-weight: 500;
  line-height: 1.3;
  letter-spacing: .14em;
  text-align: left;
  text-transform: uppercase;
  color: var(--text);
  cursor: pointer;
}
.room-filter__toggle > .fa-sliders { color: var(--accent); }
.room-filter__toggle-count { color: var(--accent-hover); }
.room-filter__toggle-count:empty { display: none; }
.room-filter__toggle-chevron {
  margin-left: auto;
  font-size: .75rem;
  color: var(--text-subtle);
  transition: transform var(--dur-fast) var(--ease-out);
}
.room-filter__toggle[aria-expanded="true"] .room-filter__toggle-chevron { transform: rotate(180deg); }
.room-filter.is-collapsed .room-filter__field:not(.room-filter__field--search),
.room-filter.is-collapsed .room-filter__amenities { display: none; }

/* Olanak seçimleri: kare köşeli seçim kutuları; seçili durum renk + onay işaretiyle (yalnızca renge dayanmaz) */
.room-filter__amenities { min-width: 0; margin: var(--space-3) 0 0; padding: 0; border: 0; }
.room-filter__chips { display: flex; flex-wrap: wrap; gap: .5rem; }
.filter-chip { position: relative; display: inline-flex; margin: 0; }
/* Görünmez ama odaklanabilir ve ekran okuyucuda okunur gerçek onay kutusu */
.filter-chip__input {
  position: absolute;
  width: 1px; height: 1px;
  margin: 0;
  opacity: 0;
  pointer-events: none;
}
.filter-chip__box {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  min-height: 44px;
  padding: .5rem 1rem;
  background: var(--surface);
  border: 1px solid var(--line-strong);
  border-radius: var(--radius);
  font-family: var(--font-condensed);
  font-size: .875rem;
  font-weight: 500;
  line-height: 1.3;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--text-body);
  cursor: pointer;
  user-select: none;
}
.filter-chip__icon { font-size: .8125rem; color: var(--accent); }
.filter-chip__check { display: none; font-size: .75rem; }
.filter-chip:hover .filter-chip__box { border-color: var(--text-subtle); color: var(--text); }
.filter-chip__input:checked + .filter-chip__box {
  background: var(--accent-tint);
  border-color: var(--accent);
  color: var(--accent-hover);
}
.filter-chip__input:checked + .filter-chip__box .filter-chip__check { display: inline-block; }
.filter-chip__input:focus-visible + .filter-chip__box { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
.filter-chip[hidden] { display: none; }
/* "Olanak ara": seçimlerin yanında, onlarla aynı yükseklikte (rooms.js). Telefonda kendi satırını doldurur,
   576+ sabit genişlikte kalır */
.room-filter__chip-search { position: relative; flex: 1 1 12rem; }
.room-filter__chip-search[hidden] { display: none; }
.room-filter__chip-search > i {
  position: absolute;
  top: 50%; left: 1rem;
  transform: translateY(-50%);
  font-size: .8125rem;
  color: var(--text-subtle);
  pointer-events: none;
}
.room-filter__chip-search .form-control-hotel {
  -webkit-appearance: none;
  appearance: none;
  min-height: 44px;
  padding-top: .5rem;
  padding-bottom: .5rem;
  padding-left: 2.5rem;
}
.room-filter__chip-status { margin: .5rem 0 0; font-size: var(--fs-xs); color: var(--text-body); }
.room-filter__chip-status:empty { display: none; }

/* Sonuç satırı: solda sayı (canlı bölge), sağda temizle + (JS'siz) filtrele */
.room-filter__bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .5rem var(--space-3);
  margin-top: var(--space-3);
  padding-top: var(--space-2);
  border-top: 1px solid var(--line);
}
.room-filter__count {
  margin: 0;
  font-family: var(--font-condensed);
  font-size: .875rem;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--text);
}
.room-filter__actions { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem var(--space-3); }
.room-filter__clear {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  min-height: 44px;
  font-family: var(--font-condensed);
  font-size: .875rem;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--accent);
}
.room-filter__clear:hover { color: var(--accent-hover); }

/* Eşleşme yoksa */
.room-filter-empty__title {
  margin-bottom: .5rem;
  font-family: var(--font-display);
  font-size: var(--fs-h4);
  line-height: var(--lh-heading);
  color: var(--text);
}
.room-filter-empty__hint { margin-bottom: var(--space-3); color: var(--text-body); }

@media (min-width: 576px) {
  .room-filter { padding: var(--space-4) var(--space-3); }
  .room-filter__fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .room-filter__field--search { grid-column: 1 / -1; }
  .room-filter__chip-search { max-width: 18rem; }
}
@media (min-width: 768px) {
  .room-filter__toggle { display: none; }
  /* Seçici, gizleyen kuralla birebir aynı (aynı özgüllük, sonra geldiği için kazanır) */
  .room-filter.is-collapsed .room-filter__field:not(.room-filter__field--search),
  .room-filter.is-collapsed .room-filter__amenities { display: block; }
}
@media (min-width: 992px) {
  .room-filter { padding: var(--space-4); }
  .room-filter__fields { grid-template-columns: minmax(0, 2fr) repeat(2, minmax(0, 1fr)); }
  .room-filter__field--search { grid-column: auto; }
}

/* ── Oda Detay ────────────────────────────────────────────── */
.room-detail-hero {
  position: relative;
  /* Beyaz başlığın (ve sayfanın en üstünde görünen üst şeridin) altından başlar */
  margin-top: var(--header-offset);
  height: 56vh;
  min-height: 340px;
  overflow: hidden;
  /* Kendi yığın bağlamı: perde/başlık slider'ın üstünde, oklar en üstte */
  isolation: isolate;
  background: var(--night);
  color: var(--on-dark);
}
/* Görsel yoksa koyu boş alan yerine iç sayfa başlığı gibi açık bant (iki sınıf: 768+ yüksekliğini de ezer) */
.room-detail-hero.room-detail-hero--empty {
  height: auto;
  min-height: 0;
  padding: var(--space-6) 0 var(--space-5);
  background: var(--bg-alt);
  color: var(--text);
}
.room-detail-hero--empty .room-detail-hero-overlay { display: none; }
.room-detail-hero--empty .room-detail-hero-content { position: static; }
.room-detail-hero img,
.room-detail-hero__img {
  display: block;
  width: 100%; height: 100%;
  object-fit: cover;
}
.room-hero-swiper {
  height: 100%;
  z-index: auto; /* Swiper'ın z-index:1 değeri perdeyi altta bırakıyordu */
  --swiper-theme-color: var(--white);
  --swiper-navigation-color: var(--white);
  --swiper-navigation-size: 1.875rem;
  --swiper-pagination-bullet-inactive-color: var(--white);
  --swiper-pagination-bullet-inactive-opacity: .5;
}
.room-hero-swiper .swiper-slide { height: 100%; background: var(--night); }
.room-hero-swiper .swiper-button-prev,
.room-hero-swiper .swiper-button-next,
.room-hero-swiper .swiper-pagination { z-index: 10; }
.room-hero-swiper .swiper-pagination { bottom: .75rem; }
.room-detail-hero-overlay {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background: var(--scrim-bottom);
}
.room-detail-hero-content {
  position: absolute;
  bottom: 2.5rem; left: 0; right: 0;
  z-index: 3;
  pointer-events: none; /* slider sürükleme alanını kapatmasın */
}
.room-detail-hero-content a { pointer-events: auto; }
.room-hero-breadcrumb {
  margin-bottom: .75rem;
  font-family: var(--font-condensed);
  font-size: .8125rem;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--on-dark-muted);
}
.room-hero-breadcrumb a { color: var(--on-photo-muted); }
.room-hero-breadcrumb a:hover { color: var(--on-dark); }
.room-hero-breadcrumb .separator { margin: 0 .625rem; color: var(--ornament); }
.room-hero-breadcrumb [aria-current] { color: var(--on-dark); }
.room-hero-title {
  margin: 0;
  font-family: var(--font-display);
  font-size: var(--fs-display);
  font-weight: 400;
  line-height: 1.1;
  color: var(--on-dark);
  overflow-wrap: anywhere;
  text-wrap: balance;
}
.room-detail-hero:not(.room-detail-hero--empty) .room-hero-title,
.room-detail-hero:not(.room-detail-hero--empty) .room-hero-breadcrumb { text-shadow: var(--text-shadow-photo); }
.room-detail-hero:not(.room-detail-hero--empty) .room-hero-breadcrumb { color: var(--on-photo-muted); }
.room-detail-hero--empty .room-hero-title,
.room-detail-hero--empty .room-hero-breadcrumb [aria-current] { color: var(--text); }
.room-detail-hero--empty .room-hero-breadcrumb,
.room-detail-hero--empty .room-hero-breadcrumb a { color: var(--text-subtle); }
.room-detail-hero--empty .room-hero-breadcrumb a:hover { color: var(--accent); }

/* Teknik şerit: açık zemin, kırmızı ikon, dar etiket + Gilda değer */
.room-specs-bar { background: var(--surface); border-bottom: 1px solid var(--line); }
.room-specs-bar__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2) var(--space-4);
  padding-block: 1.25rem;
}
.room-spec-item { display: flex; align-items: center; gap: .875rem; min-width: 0; }
.room-spec-item i { font-size: 1.125rem; color: var(--accent); }
.room-spec-item--price { margin-left: auto; }
.room-spec-label {
  font-family: var(--font-condensed);
  font-size: .8125rem;
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--text-subtle);
}
.room-spec-value { font-family: var(--font-display); font-size: 1.3125rem; font-weight: 400; line-height: 1.3; color: var(--text); }
.room-spec-value--price { color: var(--accent); }
.room-spec-per { font-family: var(--font-sans); font-size: .8125rem; color: var(--text-subtle); }
.room-description { margin-top: 0; }
.room-lead { max-width: var(--measure); font-size: var(--fs-lead); line-height: var(--lh-body); color: var(--text-body); }
@media (min-width: 768px) {
  .room-detail-hero { height: 70vh; min-height: 480px; }
  .room-hero-swiper { --swiper-navigation-size: 2.5rem; }
  .room-detail-hero.room-detail-hero--empty { padding: var(--space-7) 0 var(--space-6); }
}
@media (min-width: 992px) {
  .room-specs-bar__inner { padding-block: 1.5rem; gap: var(--space-2) var(--space-5); }
}

/* Galeri thumbnail sıralama */
.gallery-thumbs { display: flex; gap: .5rem; margin-top: .625rem; padding-bottom: .25rem; overflow-x: auto; }
.gallery-thumbs .swiper-slide {
  width: 90px !important; /* Swiper'ın satır içi genişliğini ezmek için */
  height: 60px !important; /* Swiper'ın satır içi yüksekliğini ezmek için */
  flex-shrink: 0;
  overflow: hidden;
  border: 2px solid transparent;
  border-radius: var(--radius);
  cursor: pointer;
}
.gallery-thumbs .swiper-slide img { width: 100%; height: 100%; object-fit: cover; }
.gallery-thumbs .swiper-slide-thumb-active { border-color: var(--accent); }

/* Oda galerisi (lightbox küçük görselleri) */
.room-gallery-item { display: block; border-radius: var(--radius); }
.room-gallery-item img { display: block; aspect-ratio: 4/3; border-radius: var(--radius); }
.room-gallery-item .gallery-grid-item-overlay { border-radius: var(--radius); }

/* Rezervasyon kutusu: beyaz kart, üstte kırmızı çizgi (masaüstünde yapışkan) */
.room-booking-card {
  padding: var(--space-4) 1.25rem;
  background: var(--surface);
  border: 1px solid var(--line);
  border-top: 3px solid var(--accent);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  color: var(--text-body);
}
.room-booking-card-title {
  margin-bottom: .75rem;
  font-family: var(--font-display);
  font-size: 1.75rem;
  font-weight: 400;
  line-height: var(--lh-heading);
  color: var(--text);
}
.room-booking-price {
  margin-bottom: .25rem;
  font-family: var(--font-display);
  font-size: 2.25rem;
  font-weight: 400;
  line-height: 1;
  color: var(--accent);
}
.room-booking-price-note { font-size: var(--fs-xs); color: var(--text-subtle); }
.room-booking-divider {
  margin: var(--space-3) 0;
  border: 0;
  border-top: 1px solid var(--line);
  opacity: 1;
}
.room-booking-specs { margin-bottom: 0; }
.room-booking-spec {
  display: flex;
  align-items: center;
  gap: .75rem;
  margin-bottom: .625rem;
  font-size: var(--fs-sm);
  color: var(--text-body);
}
.room-booking-spec:last-child { margin-bottom: 0; }
.room-booking-spec i { width: 16px; color: var(--accent); }
/* Not bir cümle (2-3 satır): ikon solda, metin yanında akar */
.room-booking-note {
  display: flex;
  align-items: flex-start;
  gap: .5rem;
  margin-top: var(--space-2);
  font-size: var(--fs-xs);
  line-height: 1.6;
  color: var(--text-subtle);
}
.room-booking-note i { flex-shrink: 0; margin-top: .25rem; color: var(--accent); }
.room-booking-contact { text-align: center; }
.room-booking-contact-label {
  margin-bottom: .625rem;
  font-family: var(--font-condensed);
  font-size: .8125rem;
  font-weight: 500;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--text-subtle);
}
.room-booking-contact-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  min-height: 48px;
  margin-bottom: .5rem;
  padding: .625rem;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius);
  font-size: var(--fs-sm);
  color: var(--text);
  transition: border-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}
.room-booking-contact-btn:hover { border-color: var(--accent); color: var(--accent); }
.room-booking-contact-btn > span { display: flex; flex-direction: column; align-items: flex-start; line-height: 1.3; }
.room-booking-contact-sub {
  font-family: var(--font-condensed);
  font-size: .6875rem;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--text-subtle);
}
.room-booking-contact-btn--secondary { min-height: 44px; font-size: var(--fs-xs); color: var(--text-body); }
.room-booking-card .booking-form { margin-bottom: var(--space-2); }
.facility-hours { display: flex; gap: .5rem; margin: 0; font-size: var(--fs-sm); color: var(--text-body); }
.facility-hours i { margin-top: .3rem; color: var(--accent); }
.room-booking-contact-btn--whatsapp { color: var(--whatsapp-ink); }
.room-booking-contact-btn--whatsapp i { font-size: 1rem; }
.room-booking-contact-btn--whatsapp:hover { border-color: var(--whatsapp-ink); color: var(--whatsapp-ink); }
.room-amenity-list { display: grid; grid-template-columns: 1fr; gap: .75rem; }
.room-amenity-item { display: flex; align-items: center; gap: .75rem; min-width: 0; font-size: var(--fs-body); color: var(--text-body); }
.room-amenity-item i { flex-shrink: 0; width: 18px; font-size: .875rem; color: var(--accent); }
@media (min-width: 576px) {
  .room-booking-card { padding: var(--space-4) 1.75rem; }
}
@media (min-width: 768px) {
  .room-amenity-list { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 992px) {
  .room-booking-card { position: sticky; top: calc(var(--header-h) + var(--space-3)); }
}

/* ── Galeri Grid ──────────────────────────────────────────── */
/* Telefonda 2, tablet+ 3 sütun. İlk görsel yalnızca boşluk bırakmayacaksa büyütülür:
   2 sütunda toplam tek sayıysa tam satır, 3 sütunda toplam 3'ün katıysa 2x2. */
.gallery-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .5rem;
}
.gallery-grid-item {
  position: relative;
  display: block;
  aspect-ratio: 4/3;
  overflow: hidden;
  background: var(--sand-100);
  cursor: pointer;
}
.gallery-grid .gallery-grid-item:first-child:nth-last-child(2n+1) { grid-column: span 2; }
.gallery-grid-item img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform var(--dur-slow) var(--ease-out);
}
.gallery-grid-item:hover img { transform: scale(1.05); }
/* Perde opaklıkla belirir (renk geçişi yerine) */
.gallery-grid-item-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgb(var(--night-rgb) / .38);
  opacity: 0;
  transition: opacity var(--dur) var(--ease-out);
}
.gallery-grid-item:hover .gallery-grid-item-overlay,
.gallery-grid-item:focus-visible .gallery-grid-item-overlay { opacity: 1; }
.gallery-grid-item-overlay i {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 52px; height: 52px;
  border: 1px solid rgb(var(--white-rgb) / .7);
  font-size: 1.125rem;
  color: var(--white);
}
@media (min-width: 768px) {
  /* 3 görünür sütun, 6 ızgara sütunuyla kurulur (her görsel 2 sütun) → yarım kalan son satır ortalanır */
  .gallery-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: .75rem; }
  .gallery-grid .gallery-grid-item { grid-column: span 2; }
  .gallery-grid .gallery-grid-item:first-child:nth-last-child(3n) { grid-column: span 4; grid-row: span 2; }
  .gallery-grid .gallery-grid-item:nth-child(3n+1):nth-last-child(2) { grid-column: 2 / span 2; }
  .gallery-grid .gallery-grid-item:nth-child(3n+1):last-child { grid-column: 3 / span 2; }
}

/* ── Konum / Harita bölümü ───────────────────────────────── */
.location-section__cta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-4); margin-top: var(--space-4); }

.map-wrap { overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); }
.map-wrap--sm { height: 200px; }
.map-wrap--md { height: 300px; }
.map-wrap--lg { height: 320px; }
/* Google embed kodu sabit width/height taşır (üçüncü taraf); kenarlık normalizeMapEmbed yerine burada kaldırılır */
.map-wrap iframe {
  display: block;
  border: 0;
  width: 100% !important;
  max-width: 100%;
  height: 100% !important;
}
@media (min-width: 768px) {
  .map-wrap--md { height: 340px; }
  .map-wrap--lg { height: 420px; }
}

/* İzne bağlı harita (views/partials/map_embed.php): izin yokken yer tutucu.
   Yüklenmeden önce yükseklik içerikten gelir (dar ekranda metin kırpılmasın), yüklenince sabitlenir.
   Statik haritalı kutu (.map-static) aşağıda ayrıca kurulur. */
.consent-embed:not(.is-loaded, .map-static) { display: flex; height: auto; }
.consent-embed:not(.is-loaded).map-wrap--sm { min-height: 200px; }
.consent-embed:not(.is-loaded).map-wrap--md { min-height: 300px; }
.consent-embed:not(.is-loaded).map-wrap--lg { min-height: 320px; }
.consent-embed__placeholder {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .875rem;
  padding: var(--space-4) var(--space-3);
  background: var(--bg-alt);
  text-align: center;
}
.consent-embed__placeholder[hidden] { display: none; }
.consent-embed__icon { font-size: 2rem; color: var(--accent); }
.consent-embed__text { max-width: 30rem; margin: 0; font-size: var(--fs-sm); line-height: 1.7; color: var(--text-body); }
.consent-embed__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: .5rem 1.25rem;
}
.consent-embed__btn {
  -webkit-appearance: none;
  appearance: none;
  min-height: 46px;
  padding: .625rem 1.5rem;
  border: 1px solid var(--ink);
  border-radius: var(--radius);
  background: transparent;
  color: var(--ink);
  font-family: var(--font-sans);
  font-size: var(--fs-btn);
  font-weight: 500;
  letter-spacing: var(--ls-btn);
  text-transform: uppercase;
  cursor: pointer;
  transition: background-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
}
.consent-embed__btn:hover { background: var(--ink); color: var(--white); }
.consent-embed__link {
  font-size: var(--fs-xs);
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.consent-embed__link:hover { color: var(--accent-hover); }
.consent-embed__link i { margin-left: .25rem; font-size: .625rem; }
.map-wrap--sm .consent-embed__placeholder:not(.map-static__frame) { gap: .5rem; padding: var(--space-2); }
@media (min-width: 768px) {
  .consent-embed:not(.is-loaded).map-wrap--md { min-height: 340px; }
  .consent-embed:not(.is-loaded).map-wrap--lg { min-height: 420px; }
}

/* Çerezsiz statik harita (app/StaticMap.php): izin olsun olmasın görünür. Görsel kutuyu kaplar ve ortalanır
   (otel tam merkezde, object-fit: cover). Dar kutuda (telefon, footer) düğmeler haritanın altında; 768+ md/lg
   kutuda haritanın sol üstünde açık kart içinde (pin merkezde kaldığı için kart onu örtmez). İzin verilince
   consent.js yer tutucuyu gizler; kutu Google haritasının sabit yüksekliğine döner. */
.map-static:not(.is-loaded) { height: auto; }
.map-static__frame {
  position: relative;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  gap: 0;
  padding: 0;
  background: none;
  text-align: left;
}
.map-static__media { position: relative; height: 260px; background: var(--sand-100); }
.map-wrap--sm .map-static__media { height: 200px; }
.map-wrap--lg .map-static__media { height: 280px; }
.map-static__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
}
/* Geniş lg kutu (iletişim 992+, görselden yatık) görseli üstten ve alttan kırpar: kesit biraz aşağı kayar ki
   pinin güneybatısındaki Datça merkezi de görünsün. Pin üst yarıda kalır; sol üstteki kart onu örtmez.
   16:9'dan dar kutuda yalnızca yanlar kırpıldığı için etkisi yoktur */
.map-wrap--lg .map-static__img { object-position: 50% 82%; }
/* Atıf görseldeki atfın bulunduğu sağ alt köşede durur ve kırpılan kutuda onu örter (zemin opak; footer'da da açık) */
.map-static__credit {
  --focus-ring: var(--ramada-red);
  position: absolute;
  right: 0;
  bottom: 0;
  padding: .25rem .5rem;
  background: var(--white);
  font-size: .75rem;
  line-height: 1.4;
  color: var(--text);
  text-decoration: none;
}
.map-static__credit:hover { color: var(--accent-hover); text-decoration: underline; }
.map-static__panel {
  display: flex;
  flex-direction: column;
  gap: .5rem;
  padding: var(--space-2);
  border-top: 1px solid var(--line);
  background: var(--surface);
}
.map-static__actions { justify-content: flex-start; gap: .5rem 1.25rem; }
.map-static__btn { min-height: 44px; padding: .5rem 1.125rem; }
.map-static__btn i { margin-right: .375rem; }
.map-static__note { max-width: 34rem; font-size: var(--fs-xs); line-height: 1.6; color: var(--text-subtle); }
.map-wrap--sm .map-static__panel { gap: .375rem; padding: .75rem; }
.map-wrap--sm .map-static__btn { min-height: 40px; padding: .375rem .875rem; letter-spacing: .1em; }
@media (min-width: 768px) {
  .map-wrap--md .map-static__media { height: 340px; }
  .map-wrap--lg .map-static__media { height: 420px; }
  .map-wrap--md .map-static__panel,
  .map-wrap--lg .map-static__panel {
    position: absolute;
    top: var(--space-2);
    left: var(--space-2);
    max-width: min(28rem, calc(100% - 2 * var(--space-2)));
    padding: .875rem 1rem;
    border-top: 0;
    background: rgb(var(--white-rgb) / .95);
    box-shadow: var(--shadow-sm);
  }
}

/* ── İletişim ─────────────────────────────────────────────── */
.contact-intro { margin: 0 0 var(--space-4); color: var(--text-body); }
/* Bilgi satırı: kırmızı kare ikon + Gilda etiket + gri değer (referansın iletişim bloğu) */
.contact-info-item {
  display: flex;
  align-items: center;
  gap: 1.25rem;
  margin-bottom: var(--space-3);
}
.contact-info-item > div:last-child { min-width: 0; }
.contact-info-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 60px; height: 60px;
  background: var(--accent);
  border-radius: var(--radius);
  font-size: 1.25rem;
  color: var(--white);
}
.contact-info-icon--whatsapp { background: var(--whatsapp-ink); }
.contact-info-label {
  margin-bottom: .125rem;
  font-family: var(--font-display);
  font-size: 1.375rem;
  line-height: 1.3;
  color: var(--text);
}
.contact-info-value { font-size: var(--fs-body); line-height: 1.65; color: var(--text-body); overflow-wrap: anywhere; }
.contact-info-value a { color: inherit; }
.contact-info-value a:hover { color: var(--accent); }
.contact-info-value--lead { font-family: var(--font-display); font-size: 1.375rem; line-height: 1.35; color: var(--text); }
/* Otel numarası ikincil (standart 100.03.06): küçük ikon kutusu, küçük metin */
.contact-info-item--secondary .contact-info-icon { width: 44px; height: 44px; font-size: 1rem; background: var(--ink-muted); }
.contact-info-item--secondary .contact-info-label { font-size: 1.0625rem; }
.contact-info-item--secondary .contact-info-value { font-size: var(--fs-sm); }
.contact-directions { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-4); margin: var(--space-2) 0 0; }
/* KVKK / gizlilik onay kutusu (zorunlu): kare kutu + metin; bağlantılar yeni sekmede */
.form-consent { display: flex; align-items: flex-start; gap: .75rem; }
.form-consent__input {
  flex-shrink: 0;
  width: 1.25rem;
  height: 1.25rem;
  margin: .2rem 0 0;
  accent-color: var(--accent);
  cursor: pointer;
}
.form-consent__input.is-invalid { outline: 2px solid var(--danger); outline-offset: 2px; }
.form-consent__label { font-size: var(--fs-sm); line-height: 1.6; color: var(--text-body); cursor: pointer; }
.form-consent__label a { color: var(--text); text-decoration: underline; text-underline-offset: .2em; }
.form-consent__label a:hover { color: var(--accent); }
.form-consent__req { margin-left: .125rem; color: var(--danger); }
.form-consent + .form-error { margin-left: 2rem; }
.contact-info-value--whatsapp a { color: var(--whatsapp-ink); }
.contact-info-value--whatsapp a:hover { color: var(--whatsapp-ink); text-decoration: underline; text-underline-offset: .2em; }

/* Form: sıcak kırık beyaz panel, beyaz alanlar */
.contact-form-wrap {
  padding: var(--space-4) 1.125rem;
  background: var(--bg-alt);
  border-radius: var(--radius);
}
.form-group { margin-bottom: 0; }
.form-label-hotel {
  display: block;
  margin-bottom: .5rem;
  font-family: var(--font-condensed);
  font-size: .875rem;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--text);
}
.form-control-hotel {
  display: block;
  width: 100%;
  max-width: 100%;
  padding: .8125rem 1rem;
  background: var(--surface);
  border: 1px solid var(--line-strong);
  border-bottom-color: var(--text-subtle);
  border-radius: var(--radius);
  font-family: var(--font-sans);
  font-size: 1rem; /* her genişlikte 16px: iOS'ta odaklanınca yakınlaştırmayı önler */
  line-height: 1.5;
  color: var(--text);
  transition: border-color var(--dur-fast) var(--ease-out);
}
.form-control-hotel::placeholder { color: var(--text-subtle); opacity: 1; }
.form-control-hotel:focus { border-color: var(--accent); }
.form-control-hotel.is-invalid { border-color: var(--danger); }
.form-error { margin-top: .375rem; font-size: var(--fs-xs); color: var(--danger); }
/* Bal küpü alanı (spam tuzağı): ekranda ve ekran okuyucuda yok, botlar doldurur */
.form-trap { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.form-error:empty { display: none; }
textarea.form-control-hotel { min-height: 8rem; resize: vertical; }
/* Açılır liste: tarayıcı oku yerine sitenin ince oku (select öğesi ::after alamaz, sarmalayıcı taşır) */
.select-hotel { position: relative; display: block; }
.select-hotel .form-control-hotel,
.select-hotel .booking-form__input {
  -webkit-appearance: none;
  appearance: none;
  padding-right: 2.75rem;
  text-overflow: ellipsis;
  cursor: pointer;
}
.select-hotel::after {
  content: '';
  position: absolute;
  top: 50%; right: 1rem;
  width: .75rem; height: .5rem;
  margin-top: -.25rem;
  background: var(--text-subtle);
  -webkit-mask: var(--chevron-img) no-repeat center / contain;
  mask: var(--chevron-img) no-repeat center / contain;
  pointer-events: none;
}
/* Yüksek kontrast (forced-colors): maskeli ok zemin rengine boyanıp kaybolur; tarayıcının kendi oku geri gelir */
@media (forced-colors: active) {
  .select-hotel .form-control-hotel,
  .select-hotel .booking-form__input { -webkit-appearance: auto; appearance: auto; }
  .select-hotel::after { display: none; }
}
@media (min-width: 576px) {
  .contact-form-wrap { padding: var(--space-4) var(--space-3); }
}
@media (min-width: 992px) {
  .contact-form-wrap { padding: var(--space-5); }
}

/* ── Uyarı / Form Geri Bildirimi ─────────────────────────── */
.alert-hotel {
  display: flex;
  align-items: flex-start;
  gap: .75rem;
  margin-bottom: var(--space-3);
  padding: var(--space-2) 1.25rem;
  border-left: 2px solid;
  border-radius: var(--radius);
  font-size: var(--fs-sm);
  line-height: 1.6;
}
.alert-hotel i { margin-top: .2rem; }
.alert-hotel.success { background: var(--success-bg); border-color: var(--success); color: var(--success); }
.alert-hotel.error   { background: var(--danger-bg);  border-color: var(--danger);  color: var(--danger); }
.alert-hotel.info    { background: var(--bg-alt);     border-color: var(--accent);  color: var(--text); }

/* Yükleniyor göstergesi (butonun metin rengini alır; kırmızı butonda beyaz iz) */
.hotel-spinner {
  display: inline-block;
  width: 1.125rem; height: 1.125rem;
  border: 2px solid rgb(var(--white-rgb) / .35);
  border-top-color: currentColor;
  border-radius: 50%;
  animation: spin .7s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* ── Çerez onayı (views/partials/cookie_consent.php, assets/js/consent.js) ──
   Telefonda alttan tam genişlik kart, 768+ sol altta dar kart. Beyaz yüzey, üstte kırmızı çizgi.
   "Tümünü kabul et" ve "Tümünü reddet" bilerek aynı görünümde: KVKK reddetmeyi kabul kadar kolay ister. */
.cookie-consent {
  position: fixed;
  left: var(--space-1);
  right: var(--space-1);
  bottom: var(--space-1);
  z-index: 1100;
  max-height: calc(100vh - var(--space-2));
  max-height: calc(100dvh - var(--space-2));
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: var(--space-3);
  padding-bottom: max(var(--space-3), env(safe-area-inset-bottom));
  border: 1px solid var(--line);
  border-top: 3px solid var(--accent);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: 0 24px 60px -18px rgb(var(--night-rgb) / .38);
  color: var(--text-body);
  opacity: 0;
  transform: translate3d(0, 1.5rem, 0);
  transition: opacity var(--dur) var(--ease-out), transform var(--dur) var(--ease-out);
}
.cookie-consent.is-open { opacity: 1; transform: none; }
.cookie-consent__eyebrow {
  display: block;
  margin-bottom: .5rem;
  font-family: var(--font-condensed);
  font-size: var(--fs-eyebrow);
  font-weight: 500;
  letter-spacing: var(--ls-eyebrow);
  text-transform: uppercase;
  color: var(--eyebrow);
}
.cookie-consent__title {
  margin: 0 0 .75rem;
  font-family: var(--font-display);
  font-size: 1.625rem;
  font-weight: 400;
  line-height: 1.2;
  color: var(--text);
}
.cookie-consent__text { margin: 0 0 var(--space-3); font-size: var(--fs-sm); line-height: 1.7; }
.cookie-consent__text a { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }
.cookie-consent__text a:hover { color: var(--accent-hover); }
.cookie-consent__actions {
  display: grid;
  /* İki düğme sığmazsa alt alta dizilir; metin düğme içinde kırılmaz */
  grid-template-columns: repeat(auto-fit, minmax(7rem, 1fr));
  gap: .625rem;
}
.consent-btn {
  -webkit-appearance: none;
  appearance: none;
  min-height: 46px;
  padding: .625rem .5rem;
  border: 1px solid var(--ink);
  border-radius: var(--radius);
  background: transparent;
  color: var(--ink);
  font-family: var(--font-sans);
  font-size: var(--fs-btn);
  font-weight: 500;
  letter-spacing: .12em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background-color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}
.consent-btn:hover { background: var(--ink); color: var(--white); }
.consent-btn--save { grid-column: 1 / -1; border-color: var(--accent); background: var(--accent); color: var(--white); }
.consent-btn--save:hover { border-color: var(--accent-hover); background: var(--accent-hover); }
.consent-btn[hidden] { display: none; }
.cookie-consent__manage {
  -webkit-appearance: none;
  appearance: none;
  margin-top: .875rem;
  padding: .25rem 0;
  border: 0;
  background: none;
  font-family: var(--font-sans);
  font-size: var(--fs-xs);
  letter-spacing: .04em;
  color: var(--text-body);
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}
.cookie-consent__manage:hover { color: var(--accent); }
.cookie-consent__manage[hidden] { display: none; }
.cookie-consent__prefs { margin: 0 0 var(--space-3); border-top: 1px solid var(--line); }
.consent-option {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-2);
  padding: var(--space-2) 0;
  border-bottom: 1px solid var(--line);
}
label.consent-option { cursor: pointer; }
.consent-option__text { display: flex; flex-direction: column; gap: .25rem; min-width: 0; }
.consent-option__title { font-size: var(--fs-sm); font-weight: 600; color: var(--text); }
.consent-option__desc { font-size: var(--fs-xs); line-height: 1.55; color: var(--text-subtle); }
.consent-option__fixed {
  flex-shrink: 0;
  padding-top: .125rem;
  font-family: var(--font-condensed);
  font-size: .75rem;
  font-weight: 500;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--accent);
}
/* Anahtar: sitenin köşeli diline uygun (yuvarlak hap değil) */
.consent-switch {
  -webkit-appearance: none;
  appearance: none;
  position: relative;
  flex-shrink: 0;
  width: 2.75rem;
  height: 1.5rem;
  margin: .125rem 0 0;
  border: 1px solid var(--text-subtle);
  border-radius: var(--radius);
  background: var(--surface);
  cursor: pointer;
  transition: background-color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
}
.consent-switch::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 1rem;
  height: 1rem;
  border-radius: var(--radius);
  background: var(--text-subtle);
  transition: transform var(--dur-fast) var(--ease-out), background-color var(--dur-fast) var(--ease-out);
}
.consent-switch:checked { border-color: var(--accent); background: var(--accent); }
.consent-switch:checked::after { background: var(--white); transform: translateX(1.25rem); }
.consent-switch:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 3px; }
@media (min-width: 768px) {
  .cookie-consent {
    left: var(--space-4);
    right: auto;
    bottom: var(--space-4);
    width: 25.5rem;
    padding: var(--space-4);
  }
}

/* ── WhatsApp sabit butonu ───────────────────────────────── */
.whatsapp-float {
  position: fixed;
  right: 1rem;
  bottom: 1rem;
  z-index: 900;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 52px; height: 52px;
  border-radius: 50%;
  background: var(--whatsapp);
  box-shadow: var(--shadow);
  color: var(--white);
  font-size: 1.5rem;
  transition: transform var(--dur-fast) var(--ease-out);
}
.whatsapp-float:hover { color: var(--white); transform: scale(1.06); }
@media (min-width: 768px) {
  .whatsapp-float { right: 1.75rem; bottom: 1.75rem; }
}

/* ── Footer ───────────────────────────────────────────────── */
/* Gece zemini üzerinde çok hafif ogee deseni; Gilda sütun başlıkları, açık gri bağlantılar */
.site-footer {
  padding-top: var(--space-6);
  background-color: var(--night);
  background-image: var(--pattern-ogee);
  color: var(--on-dark-muted);
}
.footer-brand { margin-bottom: var(--space-4); }
.footer-logo-img {
  display: block;
  width: auto;
  height: 60px;
  max-width: 100%;
  margin-bottom: var(--space-3);
  object-fit: contain;
  object-position: left center;
}
/* Resmi açık logo yoksa renkli logo beyaz plaka üzerinde (renk değiştirilmez, standart 100.03.02) */
.footer-logo { display: inline-block; max-width: 100%; }
.footer-logo--plate { padding: .75rem 1rem; background: var(--white); border-radius: var(--radius); }
.footer-logo--plate .footer-logo-img { margin-bottom: 0; }
.footer-brand .footer-logo--plate { margin-bottom: var(--space-3); }
.footer-brand-name {
  margin-bottom: var(--space-2);
  font-family: var(--font-display);
  font-size: 2rem;
  font-weight: 400;
  line-height: 1.15;
  color: var(--on-dark);
}
.footer-tagline { max-width: 36ch; margin: 0; font-size: var(--fs-sm); line-height: 1.8; color: var(--on-dark-muted); }
/* Başlık iki satıra kırılsa da yan sütunlardaki bağlantı listeleri aynı hizadan başlar */
.footer-section-title {
  display: flex;
  align-items: flex-end;
  min-height: 2.5em;
  margin-bottom: 1.25rem;
  font-family: var(--font-display);
  font-size: 1.375rem;
  font-weight: 400;
  line-height: 1.25;
  color: var(--on-dark);
}
.footer-section-title--compact { display: block; min-height: 0; margin-bottom: var(--space-2); font-size: 1.25rem; }
.footer-link {
  display: block;
  padding: .375rem 0;
  font-size: var(--fs-body);
  line-height: 1.6;
  color: var(--on-dark-muted);
}
.footer-link:hover { color: var(--on-dark); }
.footer-contact-item {
  display: flex;
  align-items: flex-start;
  gap: .75rem;
  margin-bottom: .875rem;
  font-size: var(--fs-sm);
  line-height: 1.7;
  color: var(--on-dark-muted);
}
.footer-contact-item > span,
.footer-contact-item > a { min-width: 0; overflow-wrap: anywhere; }
.footer-contact-item a { color: inherit; }
.footer-contact-item a:hover { color: var(--on-dark); }
.footer-contact-item i { flex-shrink: 0; width: 1rem; margin-top: .35rem; font-size: .875rem; color: var(--ramada-red-light); }
.footer-contact-label {
  display: block;
  font-family: var(--font-condensed);
  font-size: .75rem;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--on-dark-subtle);
}
.footer-contact-item--primary a { font-size: var(--fs-body); font-weight: 500; color: var(--on-dark); }
.footer-contact-item--secondary { font-size: var(--fs-xs); }
.footer-contact-item--secondary i { color: var(--on-dark-subtle); }

/* Wyndham marka şeridi: Wyndham Hotels & Resorts, Ramada by Wyndham, Wyndham Rewards (yeni sekmede) */
.footer-brands {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: var(--space-2) var(--space-4);
  margin-top: var(--space-5);
  padding-top: var(--space-4);
  border-top: 1px solid var(--line-on-dark);
}
.footer-brands__link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font-family: var(--font-condensed);
  font-size: .875rem;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--on-dark-muted);
}
.footer-brands__link:hover { color: var(--on-dark); }
.footer-brands__img { display: block; width: auto; height: 40px; max-width: 12rem; object-fit: contain; }
.footer-brands__link--plate { padding: .5rem .75rem; background: var(--white); border-radius: var(--radius); }
.footer-bottom__text { display: flex; flex-direction: column; gap: .375rem; max-width: 60rem; }
.footer-owner { color: var(--on-dark-muted); }
.footer-trademark { font-size: .6875rem; line-height: 1.6; color: var(--on-dark-subtle); }
.footer-brands + .footer-bottom { margin-top: var(--space-3); }
.site-footer .social-links--boxed .social-links__link { border-color: rgb(var(--white-rgb) / .2); color: var(--on-dark-muted); }
.site-footer .social-links--boxed .social-links__link:hover { border-color: var(--accent); background: var(--accent); color: var(--white); }
.footer-map { margin-top: var(--space-3); }
.footer-map-placeholder {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .625rem;
  height: 180px;
  padding: var(--space-2);
  background: rgb(var(--white-rgb) / .03);
  border: 1px solid var(--line-on-dark);
  border-radius: var(--radius);
  text-align: center;
  color: var(--on-dark-subtle);
}
.footer-map-placeholder i { font-size: 1.75rem; color: var(--ramada-red-light); }
.footer-map-placeholder span { font-size: var(--fs-xs); letter-spacing: .08em; }
.footer-map-placeholder span i { margin-left: .25rem; font-size: .625rem; color: inherit; }
.site-footer .consent-embed { border-color: var(--line-on-dark); }
.site-footer .consent-embed__placeholder { background: rgb(var(--white-rgb) / .03); }
.site-footer .consent-embed__icon { color: var(--ramada-red-light); }
.site-footer .consent-embed__text { font-size: var(--fs-xs); color: var(--on-dark-subtle); }
.site-footer .consent-embed__btn { border-color: rgb(var(--white-rgb) / .6); color: var(--on-dark); }
.site-footer .consent-embed__btn:hover { background: var(--white); border-color: var(--white); color: var(--ink); }
.site-footer .consent-embed__link { color: var(--ramada-red-light); }
.site-footer .consent-embed__link:hover { color: var(--on-dark); }
.site-footer .map-static__panel { border-top-color: var(--line-on-dark); background: none; }
.footer-bottom {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: .625rem var(--space-3);
  margin-top: var(--space-5);
  padding: var(--space-3) 0;
  border-top: 1px solid var(--line-on-dark);
  font-size: var(--fs-xs);
  text-align: center;
  color: var(--on-dark-subtle);
}
/* Footer yasal bağlantılar */
.footer-legal { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .5rem var(--space-3); }
.footer-legal .footer-link { padding: 0; font-size: var(--fs-xs); color: var(--on-dark-subtle); }
.footer-legal .footer-link:hover { color: var(--on-dark); }
/* "Çerez tercihleri" bir bağlantı gibi görünür ama sayfa değiştirmez: düğme */
.footer-link--button {
  -webkit-appearance: none;
  appearance: none;
  border: 0;
  background: none;
  font-family: inherit;
  letter-spacing: inherit;
  line-height: inherit;
  cursor: pointer;
}
@media (min-width: 768px) {
  .site-footer { padding-top: var(--space-7); }
  .footer-section-title { font-size: 1.5rem; }
  .footer-bottom { justify-content: space-between; margin-top: var(--space-5); text-align: left; }
  .footer-brands { justify-content: flex-start; }
}

/* ── Tesis birimi kartı (olanaklar) ───────────────────────── */
.facility-card { display: flex; flex-direction: column; height: 100%; }
.facility-card__media {
  position: relative;
  display: block;
  overflow: hidden;
  aspect-ratio: 3 / 2;
  background: var(--sand-100);
  border-radius: var(--radius);
}
.facility-card__media img {
  display: block;
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform var(--dur-slow) var(--ease-out);
}
.facility-card:hover .facility-card__media img { transform: scale(1.04); }
.facility-card__placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%; height: 100%;
  font-size: 2.5rem;
  color: var(--accent);
}
.facility-card__body { display: flex; flex-direction: column; flex: 1; gap: .5rem; padding-top: 1.25rem; }
.facility-card__category {
  font-family: var(--font-condensed);
  font-size: var(--fs-eyebrow);
  font-weight: 500;
  letter-spacing: var(--ls-eyebrow);
  text-transform: uppercase;
  color: var(--eyebrow);
}
.facility-card__title { margin: 0; font-family: var(--font-display); font-size: var(--fs-h4); font-weight: 400; line-height: 1.25; }
.facility-card__title a { color: var(--text); }
.facility-card__title a:hover { color: var(--accent); }
.facility-card__desc { flex: 1; margin: 0; font-size: var(--fs-sm); line-height: 1.75; color: var(--text-body); }
.facility-card__hours { display: flex; align-items: baseline; gap: .5rem; margin: 0; font-size: var(--fs-xs); color: var(--text-subtle); }
.facility-card__hours i { color: var(--accent); }
.facility-card__link { margin-top: .25rem; align-self: flex-start; }
/* Olanaklar sayfasındaki gruplar (Restoran ve Bar, Havuz ve Plaj...): gruplar arası boşluk */
.facility-group + .facility-group { margin-top: var(--space-6); }

/* ── Wyndham Rewards kutusu (ana sayfa + Rewards sayfası) ───── */
.rewards-cta {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  padding: var(--space-4) var(--space-3);
  border: 1px solid var(--line);
  border-top: 3px solid var(--accent);
  border-radius: var(--radius);
  background: var(--surface);
}
.rewards-cta__logo { flex-shrink: 0; }
.rewards-cta__logo img { display: block; width: auto; max-width: 15rem; height: auto; max-height: 4.5rem; }
.rewards-cta__body { min-width: 0; }
.rewards-cta__body .section-title { margin-bottom: var(--space-2); }
.rewards-cta__text { max-width: var(--measure); margin: 0 0 var(--space-2); color: var(--text-body); }
.rewards-cta__note { max-width: var(--measure); margin: 0 0 var(--space-3); font-size: var(--fs-sm); color: var(--text-subtle); }
.rewards-cta__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-4); }
@media (min-width: 768px) {
  .rewards-cta { flex-direction: row; align-items: center; padding: var(--space-5); }
  .rewards-cta__logo { flex-basis: 16rem; padding-right: var(--space-4); border-right: 1px solid var(--line); }
}

/* ── Konum kutusu ('location' şablonlu sayfalar) ─────────── */
.page-extra { margin-top: var(--space-6); }
.location-box { padding-top: var(--space-5); border-top: 1px solid var(--line); }
.location-box__links { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-4); margin-top: var(--space-3); }

/* ── Başvuru / teklif kutusu (Kariyer, Etkinlikler) ──────── */
.inquiry-box {
  display: grid;
  gap: var(--space-4);
  padding: var(--space-4) var(--space-3);
  border: 1px solid var(--line);
  border-top: 3px solid var(--accent);
  border-radius: var(--radius);
  background: var(--surface);
}
.inquiry-box__text { max-width: var(--measure); margin: var(--space-2) 0 var(--space-3); color: var(--text-body); }
.inquiry-box__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-4); }
.inquiry-box__note { margin: var(--space-3) 0 0; font-size: var(--fs-sm); color: var(--text-subtle); }
.inquiry-box__note i { margin-right: .375rem; color: var(--accent); }
.inquiry-box__note a { color: var(--accent); text-decoration: underline; text-underline-offset: .2em; }
.inquiry-box__contact { min-width: 0; }
@media (min-width: 992px) {
  .inquiry-box { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); padding: var(--space-5); gap: var(--space-5); }
  .inquiry-box:not(:has(.inquiry-box__contact)) { grid-template-columns: minmax(0, 1fr); }
  .inquiry-box__contact { padding-left: var(--space-5); border-left: 1px solid var(--line); }
}

/* ── Datça rehberi kartları ──────────────────────────────── */
.guide-card {
  display: flex;
  flex-direction: column;
  gap: .75rem;
  height: 100%;
  padding: var(--space-4) var(--space-3);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  color: var(--text);
  transition: border-color var(--dur-fast) var(--ease-out), box-shadow var(--dur) var(--ease-out);
}
.guide-card:hover { color: var(--text); border-color: var(--line-strong); box-shadow: var(--shadow-sm); }
.guide-card__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
  background: var(--accent);
  color: var(--white);
  font-size: 1.125rem;
}
.guide-card__title { font-family: var(--font-display); font-size: var(--fs-h4); line-height: 1.25; }
.guide-card__text { flex: 1; font-size: var(--fs-sm); line-height: 1.75; color: var(--text-body); }
.guide-card__more {
  display: inline-flex;
  align-items: center;
  gap: .625rem;
  font-family: var(--font-condensed);
  font-size: var(--fs-sm);
  font-weight: 500;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--accent);
}
.guide-card__more i { font-size: .75em; transition: transform var(--dur-fast) var(--ease-out); }
.guide-card:hover .guide-card__more i { transform: translate3d(4px, 0, 0); }

/* ── Galeri sayfası: filtre + eşit ızgara ────────────────── */
.gallery-filter { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; margin-bottom: var(--space-4); }
.gallery-filter[hidden] { display: none; }
.gallery-filter__btn {
  min-height: 44px;
  padding: .5rem 1.125rem;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius);
  background: var(--surface);
  font-family: var(--font-sans);
  font-size: var(--fs-btn);
  font-weight: 500;
  letter-spacing: var(--ls-nav);
  text-transform: uppercase;
  color: var(--text-body);
  cursor: pointer;
  transition: color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out), background-color var(--dur-fast) var(--ease-out);
}
.gallery-filter__btn:hover { border-color: var(--accent); color: var(--accent); }
.gallery-filter__btn[aria-pressed="true"] { border-color: var(--ink); background: var(--ink); color: var(--white); }
.photo-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
.photo-grid__item[hidden] { display: none; }
@media (min-width: 768px) {
  .photo-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; }
}
@media (min-width: 1200px) {
  .photo-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* ── Haberler ────────────────────────────────────────────── */
.news-card { display: flex; flex-direction: column; height: 100%; }
.news-card__media {
  display: block;
  overflow: hidden;
  aspect-ratio: 3 / 2;
  background: var(--sand-100);
  border-radius: var(--radius);
}
.news-card__media img {
  display: block;
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform var(--dur-slow) var(--ease-out);
}
.news-card:hover .news-card__media img { transform: scale(1.04); }
.news-card__placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%; height: 100%;
  font-size: 2.25rem;
  color: var(--accent);
}
.news-card__body { display: flex; flex-direction: column; flex: 1; gap: .5rem; padding-top: 1.25rem; }
.news-card__date {
  font-family: var(--font-condensed);
  font-size: var(--fs-eyebrow);
  font-weight: 500;
  letter-spacing: var(--ls-eyebrow);
  text-transform: uppercase;
  color: var(--eyebrow);
}
.news-card__title { margin: 0; font-family: var(--font-display); font-size: var(--fs-h4); font-weight: 400; line-height: 1.25; }
.news-card__title a { color: var(--text); }
.news-card__title a:hover { color: var(--accent); }
.news-card__summary { flex: 1; margin: 0; font-size: var(--fs-sm); line-height: 1.75; color: var(--text-body); }
.news-card__more { align-self: flex-start; }
.news-meta {
  display: flex;
  align-items: center;
  gap: .5rem;
  margin: 0 0 var(--space-2);
  font-family: var(--font-condensed);
  font-size: var(--fs-eyebrow);
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--text-subtle);
}
.news-meta i { color: var(--accent); }
.news-lead { max-width: var(--measure); margin: 0; font-size: var(--fs-lead); line-height: 1.75; color: var(--text); }
.news-back { margin-top: var(--space-4); }

/* Sayfalama */
.pager {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: var(--space-2) var(--space-3);
  margin-top: var(--space-5);
}
.pager__pages { display: flex; flex-wrap: wrap; gap: .375rem; margin: 0; padding: 0; list-style: none; }
.pager__num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  height: 44px;
  border: 1px solid var(--line-strong);
  font-family: var(--font-sans);
  font-size: var(--fs-sm);
  color: var(--text-body);
}
.pager__num:hover { border-color: var(--accent); color: var(--accent); }
.pager__num.is-current { border-color: var(--ink); background: var(--ink); color: var(--white); }
.pager__link {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  min-height: 44px;
  font-family: var(--font-condensed);
  font-size: var(--fs-sm);
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--accent);
}

/* ── Sayfa Hero (iç sayfalar: views/partials/page_hero.php) ─── */
/* Fotoğraf varsa arka planda yavaşça değişen slaytlar + gece tonlu perde, beyaz metin
   (sliders.js › hero-fade); yoksa açık kırık beyaz bant. Konum yolu (breadcrumb) başlığın üstünde. */
.page-hero {
  position: relative;
  overflow: hidden;
  margin-top: var(--header-offset);
  padding: var(--space-6) 0 var(--space-5);
  background: var(--bg-alt);
}
.page-hero-title {
  margin-bottom: 0;
  font-family: var(--font-display);
  font-size: var(--fs-display);
  font-weight: 400;
  line-height: 1.1;
  color: var(--text);
  overflow-wrap: anywhere;
  text-wrap: balance;
}
.page-hero-subtitle { max-width: var(--measure); margin: var(--space-3) 0 0; font-size: var(--fs-lead); line-height: 1.75; color: var(--text-body); }
.page-hero__content { position: relative; }
.page-hero__crumbs ol {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin: 0 0 var(--space-3);
  padding: 0;
  list-style: none;
  font-family: var(--font-condensed);
  font-size: .8125rem;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--text-subtle);
}
.page-hero__crumbs li { display: inline-flex; align-items: center; min-width: 0; }
.page-hero__crumbs li + li::before { content: '›'; margin: 0 .625rem; color: var(--ornament); }
.page-hero__crumbs a { color: var(--text-subtle); }
.page-hero__crumbs a:hover { color: var(--accent); }
.page-hero__crumbs [aria-current] { color: var(--text); }

/* Fotoğraflı başlık */
.page-hero--media {
  display: flex;
  align-items: flex-end;
  min-height: 24rem;
  isolation: isolate;
  background: var(--night);
  color: var(--on-dark);
}
.page-hero__slides { position: absolute; inset: 0; z-index: -2; }
.page-hero__slide {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transform: scale(1.06);
  transition: opacity var(--dur-slow) var(--ease-out), transform 8s ease;
}
.page-hero__slide.is-active { opacity: 1; transform: scale(1); }
.page-hero__scrim { position: absolute; inset: 0; z-index: -1; background: var(--scrim-hero-side), var(--scrim-hero); }
/* Slayt duraklat/başlat düğmesi (ana sayfadaki video düğmesiyle aynı görünüm), sağ alt köşe. Telefonda alt
   boşluk düğmeyi metnin altına alır (uzun başlık/giriş metni düğmenin altında kalmasın); 768+ boşluk zaten yeterli */
.page-hero__pause { right: var(--header-pad-x); bottom: var(--space-3); }
.page-hero--slides { padding-bottom: calc(var(--space-3) + 44px + var(--space-2)); }
.page-hero--media .page-hero-title { color: var(--on-dark); }
.page-hero--media .page-hero-subtitle { color: var(--on-dark); font-weight: 500; }
.page-hero--media .section-label { color: var(--on-dark); }
.page-hero--media .page-hero-title,
.page-hero--media .page-hero-subtitle,
.page-hero--media .section-label,
.page-hero--media .page-hero__crumbs { text-shadow: var(--text-shadow-photo); }
.page-hero--media .page-hero__crumbs ol,
.page-hero--media .page-hero__crumbs a { color: var(--on-photo-muted); }
.page-hero--media .page-hero__crumbs a:hover,
.page-hero--media .page-hero__crumbs [aria-current] { color: var(--on-dark); }
@media (min-width: 768px) {
  .page-hero { padding: var(--space-7) 0 var(--space-6); }
  .page-hero--media { min-height: 30rem; }
}
/* Bölüm gezinmesi (Kurumsal / Datça / Etkinlikler sayfaları): başlığın altında kardeş sayfalar; telefonda
   yatay kaydırılır (sayfa yana kaymaz) */
.section-nav { background: var(--surface); border-bottom: 1px solid var(--line); }
.section-nav__list {
  display: flex;
  gap: var(--space-3);
  margin: 0;
  padding: 0;
  overflow-x: auto;
  list-style: none;
  scrollbar-width: thin;
  -webkit-overflow-scrolling: touch;
}
.section-nav__list li { flex-shrink: 0; }
.section-nav__link {
  position: relative;
  display: inline-flex;
  align-items: center;
  min-height: 52px;
  font-family: var(--font-condensed);
  font-size: var(--fs-sm);
  font-weight: 500;
  letter-spacing: .12em;
  text-transform: uppercase;
  white-space: nowrap;
  color: var(--text-subtle);
}
.section-nav__link::after {
  content: '';
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 2px;
  background: var(--accent);
  transform: scaleX(0);
  transition: transform var(--dur) var(--ease-out);
}
.section-nav__link:hover { color: var(--text); }
.section-nav__link.is-current { color: var(--text); }
.section-nav__link.is-current::after,
.section-nav__link:hover::after { transform: scaleX(1); }

/* Başlığın hemen altındaki ilk bölüm: tam bölüm boşluğu başlık bandının altında fazla boş kalıyordu */
.page-hero + .section-pad,
.page-hero + .content-fallback-notice + .section-pad,
.page-hero + .section-nav + .section-pad,
.page-hero + .section-nav + .content-fallback-notice + .section-pad { padding-top: calc(var(--section-y) * .6); }
/* Masaüstü + şeffaf başlık: fotoğraflı başlık sayfanın en üstünden başlar (ana sayfadaki gibi) */
@media (min-width: 992px) {
  .has-transparent-header .page-hero--media {
    margin-top: 0;
    min-height: max(36rem, 66vh);
    padding-top: calc(var(--topbar-h) + var(--header-h) + var(--space-6));
  }
  .has-transparent-header .room-detail-hero:not(.room-detail-hero--empty) {
    margin-top: 0;
    height: 80vh;
    min-height: 560px;
  }
}

/* ── Breadcrumb ───────────────────────────────────────────── */
.hotel-breadcrumb {
  padding: .875rem 0;
  background: var(--surface);
  border-bottom: 1px solid var(--line);
  font-family: var(--font-condensed);
  font-size: .875rem;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--text);
}
.hotel-breadcrumb a { color: var(--text-subtle); }
.hotel-breadcrumb a:hover { color: var(--accent); }
.hotel-breadcrumb .separator { margin: 0 .625rem; color: var(--accent); }

/* ── Dil fallback notu (içerik varsayılan dilden geliyor) ── */
.content-fallback-notice {
  padding: .75rem 0;
  background: var(--bg-alt);
  border-bottom: 1px solid var(--line);
  font-size: var(--fs-sm);
  color: var(--text-body);
}

/* ── Boş durum (liste/sayfa içeriği yok) ─────────────────── */
.empty-state { padding: var(--space-6) 0; text-align: center; color: var(--text-subtle); }
.empty-state i { display: block; margin-bottom: var(--space-2); font-size: 2.75rem; color: var(--line-strong); }

/* ── Dinamik sayfa içeriği (admin editöründen gelen HTML) ── */
.page-content { font-size: var(--fs-body); line-height: var(--lh-body); color: var(--text-body); overflow-wrap: anywhere; }
.page-content :where(p, li) { max-width: var(--measure); }
.page-content h2 { margin: var(--space-5) 0 .75rem; font-family: var(--font-display); font-size: var(--fs-h3); font-weight: 400; color: var(--text); }
.page-content h3 { margin: var(--space-4) 0 .5rem; font-family: var(--font-display); font-size: var(--fs-h4); font-weight: 400; color: var(--text); }
.page-content > :first-child { margin-top: 0; }
.page-content p  { margin-bottom: var(--space-2); }
.page-content ul,
.page-content ol { margin-bottom: var(--space-2); padding-left: var(--space-3); }
.page-content li { margin-bottom: .375rem; }
.page-content li::marker { color: var(--accent); }
.page-content a  { color: var(--accent); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .2em; }
.page-content a:hover { color: var(--accent-hover); }
.page-content img { height: auto; }
.page-content iframe,
.page-content video { display: block; max-width: 100%; }
.page-content pre { max-width: 100%; overflow-x: auto; white-space: pre-wrap; }
.page-content blockquote { margin: var(--space-4) 0; padding-left: var(--space-3); border-left: 2px solid var(--accent); font-family: var(--font-display); font-size: 1.375rem; line-height: 1.5; color: var(--text); }
.page-content table { width: 100%; margin-bottom: 1.25rem; border-collapse: collapse; overflow-wrap: normal; }
.page-content td,
.page-content th { padding: .625rem .875rem; border: 1px solid var(--line); font-size: var(--fs-sm); }
.page-content th { background: var(--bg-alt); font-weight: 600; color: var(--text); }
/* Geniş tablolar sayfayı değil yalnızca kendi kabını kaydırır (main.js sarar) */
.table-scroll { max-width: 100%; margin-bottom: 1.25rem; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.table-scroll > table { margin-bottom: 0; }

/* ── 404 sayfası ──────────────────────────────────────────── */
.error-page {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  padding: 2.5rem 1.25rem;
  background: var(--bg-alt);
  text-align: center;
}
.error-page__code {
  font-family: var(--font-display);
  font-size: clamp(6rem, 18vw, 11rem);
  font-weight: 400;
  line-height: 1;
  color: var(--line-strong);
}
.error-page .section-label { margin-top: var(--space-3); }
.error-page__title {
  margin: 0 0 var(--space-2);
  font-size: var(--fs-h2);
  font-weight: 400;
  color: var(--text);
}
.error-page__text {
  max-width: 28rem;
  margin: 0 auto var(--space-4);
  font-size: var(--fs-body);
  color: var(--text-body);
}

/* ── Kaydırmada beliren öğeler (reveal.js) ───────────────── */
/* İçerik varsayılan olarak görünür; yalnızca JS'in ekran altında işaretlediği öğeler (.is-pending) gizlenir */
[data-reveal] {
  transition: opacity var(--dur-slow) var(--ease-out), transform var(--dur-slow) var(--ease-out);
}
[data-reveal].is-pending { opacity: 0; transform: translate3d(0, var(--space-4), 0); }

/* ── Hareket azaltma tercihi ─────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  /* !important: Swiper'ın satır içi transition-duration değerlerini de ezmek için (üçüncü taraf) */
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    transition-delay: 0s !important;
  }
  [data-reveal].is-pending { opacity: 1; transform: none; }
  .hero-slide__img,
  .hero-slide__video,
  .swiper-slide-active .hero-slide__img { transform: none; }
  .room-card:hover .room-card__media img,
  .gallery-grid-item:hover img,
  .link-arrow:hover i,
  .page-hero__slide,
  .page-hero__slide.is-active,
  .guide-card:hover .guide-card__more i,
  .news-card:hover .news-card__media img { transform: none; }
}

/* ── Yazdırma ─────────────────────────────────────────────── */
@media print {
  [data-reveal].is-pending { opacity: 1; transform: none; }
  .cookie-consent,
  .mobile-nav,
  .whatsapp-float,
  .hero-video-toggle { display: none; }
  /* Sabit başlık her sayfada içeriğin üstüne binmesin */
  .site-header { position: static; transform: none; }
}
