/* Marka sitesi: gece hâli. Sıcak koyu zemin, keten metin, logo sarısı yalnız işaret ve ana düğmede.
   Sarı (#FFE62E) koyu zeminde metin olarak 14:1 okunur; açık yüzeylerde kullanılmaz. */
body[data-tema="marka"] {
  --c-zemin: #121110;
  --c-yuzey: #1A1917;
  --c-kart: rgb(255 255 255 / .05);
  --c-kart-cizgi: rgb(255 255 255 / .1);
  --c-cam: rgb(18 17 16 / .55);
  --c-cam-cizgi: rgb(255 255 255 / .14);
  --c-header: rgb(18 17 16 / .72);
  --c-metin: #F3F0EA;
  --c-metin-2: #A9A49B;
  --c-cizgi: rgb(255 255 255 / .1);
  --c-cizgi-guclu: rgb(255 255 255 / .28);
  --c-isaret: #FFE62E;
  --c-sari: #FFE62E;
  --c-vurgu-metin: #FFE62E;
  --c-etiket: #D8C86A;
  --c-odak: #FFE62E;
  --c-secim: #5A5214;
  --c-dugme: #FFE62E;
  --c-dugme-uzeri: #161616;
  --c-dugme-koyu: #FFF07A;
  --c-wa: #1E7A4C;
  --c-wa-koyu: #17643E;
  --c-alt: #0D0C0B;
  --c-alt-metin: #F3F0EA;
  --c-alt-metin-2: #8E8980;
  --c-alt-cizgi: rgb(255 255 255 / .12);
  --c-alt-vurgu: #FFE62E;
  color-scheme: dark;
}
body[data-tema="marka"] .btn--cizgi { border-color: rgb(255 255 255 / .3); color: #fff; }
body[data-tema="marka"] .btn--cizgi:hover { border-color: #fff; background: rgb(255 255 255 / .06); }
body[data-tema="marka"] .dil-secici__dugme { border-color: rgb(255 255 255 / .28); }

/* Vitrin: tam ekran fotoğraf, altta koyu degrade ve gren; başlık sol altta; otel seçici vitrinin altına biner */
.vitrin { position: relative; min-height: calc(100svh - var(--header-h)); display: grid; align-items: end; isolation: isolate; margin-top: calc(-1 * var(--header-h)); padding-top: var(--header-h); }
.vitrin__foto { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: 50% 55%; }
.vitrin::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(to top, #121110 0%, rgb(18 17 16 / .86) 22%, rgb(18 17 16 / .25) 60%, rgb(18 17 16 / .45) 100%), linear-gradient(to right, rgb(18 17 16 / .45), transparent 55%); }
.vitrin::after { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--gren); opacity: .07; mix-blend-mode: overlay; pointer-events: none; }
.vitrin__metin { display: grid; gap: 1.4rem; justify-items: start; padding-block: clamp(4rem, 12vh, 8rem) clamp(2rem, 6vh, 4rem); max-width: 52rem; }
.vitrin__metin h1 { max-width: 11em; color: #fff; }
.vitrin__metin .giris { color: rgb(243 240 234 / .82); }
.vitrin__eylem { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: .25rem; }

/* Otel seçici: iki cam kart yan yana; her biri kendi rengiyle imzalı */
.secici { position: relative; z-index: 2; display: grid; gap: 1rem; margin-top: -1.5rem; }
.otel-kart { display: grid; grid-template-columns: 1fr; overflow: hidden; text-decoration: none; color: #fff; border-radius: var(--kose-buyuk); background: var(--c-yuzey); border: 1px solid var(--c-kart-cizgi); transition: transform var(--gecis), border-color var(--gecis), box-shadow var(--gecis); }
.otel-kart:hover { transform: translateY(-4px); border-color: rgb(255 255 255 / .3); box-shadow: var(--golge); }
.otel-kart__foto { position: relative; overflow: hidden; aspect-ratio: 16 / 9; }
.otel-kart__foto img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--gecis-yavas); }
.otel-kart:hover .otel-kart__foto img { transform: scale(1.04); }
.otel-kart__foto::after { content: ""; position: absolute; inset-inline: 0; bottom: 0; height: 4px; background: var(--imza); }
.otel-kart__metin { display: grid; gap: .65rem; padding: 1.5rem clamp(1.25rem, 3vw, 2rem) 1.75rem; }
.otel-kart__ilce { font: 600 .75rem/1.4 var(--f-metin); letter-spacing: .16em; text-transform: uppercase; color: var(--c-metin-2); }
.otel-kart h2 { font-size: clamp(1.75rem, 1.2rem + 1.8vw, 2.5rem); color: #fff; }
.otel-kart p { color: var(--c-metin-2); font-size: .9375rem; max-width: 32em; }
.otel-kart__alt { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .75rem 1.5rem; margin-top: .75rem; padding-top: 1rem; border-top: 1px solid var(--c-cizgi); font-size: .9375rem; }
.otel-kart__alt .bag { color: #fff; }
.otel-kart__alt .tel { color: var(--c-metin-2); }
.otel-kart--halkali { --imza: #3D5AA6; }
.otel-kart--eyup { --imza: #C9403A; }
.otel-kart--eyup h2 { font-style: normal; font-weight: 500; }
.otel-kart--eyup h2 em { color: #E0756F; }
@media (min-width: 760px) { .secici { grid-template-columns: 1fr 1fr; gap: 1.25rem; } }
@media (min-width: 1100px) { .otel-kart { grid-template-columns: 5fr 6fr; } .otel-kart__foto { aspect-ratio: auto; } .otel-kart__foto::after { inset: 0 auto 0 0; width: 4px; height: auto; } }

/* Sayılar: iki otelin toplamı, tek satır */
.sayilar { display: grid; gap: 1.5rem; padding-block: clamp(2.5rem, 5vw, 4rem); border-block: 1px solid var(--c-cizgi); }
.sayilar li { display: grid; gap: .3rem; }
.sayilar strong { font: 600 clamp(2.25rem, 1.5rem + 3vw, 4rem)/1 var(--f-baslik); letter-spacing: -.04em; color: #fff; font-variant-numeric: tabular-nums; }
.sayilar strong small { font-size: .45em; font-weight: 500; letter-spacing: -.01em; color: var(--c-sari); margin-inline-start: .2em; }
.sayilar span { color: var(--c-metin-2); font-size: .9375rem; }
@media (min-width: 640px) { .sayilar { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* Otel bölümleri: dönüşümlü fotoğraf + metin, imza rengi başlıkta */
.otel-satir { display: grid; gap: 2rem; align-items: center; }
.otel-satir + .otel-satir { margin-top: var(--bolum); }
.otel-satir__foto { position: relative; overflow: hidden; border-radius: var(--kose-buyuk); }
.otel-satir__foto img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: transform var(--gecis-yavas); }
.otel-satir:hover .otel-satir__foto img { transform: scale(1.03); }
.otel-satir__foto figcaption { position: absolute; inset-inline-start: 1rem; bottom: 1rem; padding: .5rem .9rem; border-radius: 999px; font: 600 .75rem/1.3 var(--f-metin); letter-spacing: .1em; text-transform: uppercase; color: #fff; background: rgb(0 0 0 / .45); backdrop-filter: blur(8px); }
.otel-satir__metin { display: grid; gap: 1.1rem; justify-items: start; }
.otel-satir__metin h2 { max-width: 12em; }
.otel-satir__metin .giris { max-width: 30em; }
.otel-satir__odalar { display: flex; flex-wrap: wrap; gap: .4rem; }
.otel-satir__odalar li { padding: .35rem .8rem; border: 1px solid var(--c-cizgi-guclu); border-radius: 999px; font-size: var(--t-kucuk); color: var(--c-metin); }
.otel-satir__eylem { display: flex; flex-wrap: wrap; gap: .75rem 1.25rem; margin-top: .5rem; align-items: center; }
.otel-satir--eyup h2 { font-style: normal; font-weight: 500; }
.otel-satir--eyup h2 em { color: #E0756F; }
.otel-satir--eyup .otel-satir__foto img { border-radius: 999px 999px 0 0 / 25% 25% 0 0; }
.otel-satir--halkali h2 em { color: #8FA6E6; }
@media (min-width: 900px) {
  .otel-satir { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 5rem; }
  .otel-satir--ters .otel-satir__foto { order: 2; }
  .otel-satir__foto img { aspect-ratio: 3 / 2; }
}

/* Üçüncü otel: ince kart */
.dis-otel { display: grid; gap: 1.5rem; align-items: center; padding: 1.5rem; border: 1px solid var(--c-kart-cizgi); border-radius: var(--kose-buyuk); background: var(--c-kart); }
.dis-otel img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: var(--kose); }
.dis-otel__metin { display: grid; gap: .6rem; justify-items: start; }
.dis-otel h2 { font-size: clamp(1.5rem, 1.2rem + 1.2vw, 2.125rem); }
.dis-otel p { color: var(--c-metin-2); max-width: 36em; }
@media (min-width: 760px) { .dis-otel { grid-template-columns: 2fr 3fr; gap: 2.5rem; padding: 2rem; } }

/* Spa bandı: hamam fotoğrafı arkada, cam metin kutusu önde */
.spa-bant { position: relative; overflow: hidden; border-radius: var(--kose-buyuk); min-height: 420px; display: grid; align-items: end; isolation: isolate; }
.spa-bant__foto { position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; object-fit: cover; }
.spa-bant::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(to top, rgb(18 17 16 / .9), rgb(18 17 16 / .2) 60%, rgb(18 17 16 / .1)); }
.spa-bant__ic { display: grid; gap: 1.25rem; padding: clamp(1.5rem, 4vw, 3rem); }
.spa-bant h2 { color: #fff; max-width: 14em; }
.spa-bant p { color: rgb(255 255 255 / .8); max-width: 36em; }
.spa-bant__subeler { display: grid; gap: .5rem; }
.spa-bant__subeler a { display: flex; justify-content: space-between; align-items: center; gap: 1rem; min-height: 60px; padding: .6rem 1.1rem; color: #fff; text-decoration: none; transition: border-color var(--gecis), background-color var(--gecis); }
.spa-bant__subeler a:hover { border-color: rgb(255 255 255 / .5); background: rgb(255 255 255 / .1); }
.spa-bant__subeler strong { font-weight: 600; }
.spa-bant__subeler small { color: rgb(255 255 255 / .7); }
@media (min-width: 900px) { .spa-bant__ic { grid-template-columns: 1.2fr 1fr; align-items: end; gap: 3rem; } .spa-bant { min-height: 520px; } }

/* İletişim sayfası: iki otel yan yana */
.iletisim-oteller { display: grid; gap: 1.5rem; }
.iletisim-otel { display: grid; gap: 1.25rem; align-content: start; padding: clamp(1.25rem, 3vw, 2rem); border-radius: var(--kose-buyuk); background: var(--c-kart); border: 1px solid var(--c-kart-cizgi); }
.iletisim-otel h2 { font-size: clamp(1.5rem, 1.2rem + 1.4vw, 2.25rem); }
.iletisim-otel h2 a { text-decoration: none; }
.iletisim-otel h2 a:hover { color: var(--c-vurgu-metin); }
.iletisim-otel .bilgi { max-width: none; }
.iletisim-otel__eylem { display: flex; flex-wrap: wrap; gap: .75rem; }
@media (min-width: 900px) { .iletisim-oteller { grid-template-columns: 1fr 1fr; gap: 2rem; } }

/* Hakkımızda: metin ve değerler */
.metin-iki { display: grid; gap: 3rem; }
.metin-iki__govde { display: grid; gap: 1.25rem; font-size: var(--t-giris); line-height: 1.65; max-width: 38em; }
.degerler { display: grid; align-content: start; border-top: 1px solid var(--c-cizgi-guclu); }
.degerler li { padding-block: 1rem; border-bottom: 1px solid var(--c-cizgi); font: 600 1.25rem/1.3 var(--f-baslik); letter-spacing: -.01em; }
@media (min-width: 900px) { .metin-iki { grid-template-columns: 3fr 2fr; gap: 6rem; } }