/* ÜRETİLMİŞ DOSYA — elle düzenlemeyin.
   Kaynak: main.css + responsive.css, build.ps1 tarafından birleştirildi.
   Değişiklikleri kaynak dosyalarda yapın. */
/* ==========================================================================
   GALATA ÜSTAD — ana stil dosyası
   ==========================================================================
   1. Fontlar
   2. Tasarım jetonları
   3. Sıfırlama ve temel
   4. Tipografi
   5. Yerleşim
   6. Görseller ve yer tutucular
   7. Bileşenler
   8. Header
   9. Footer
  10. Ana sayfa bölümleri
  11. İç sayfalar
  12. Erişilebilirlik ve yardımcılar
   Kırılım noktaları ayrı dosyadadır: responsive.css
   ========================================================================== */


/* ==========================================================================
   1. FONTLAR
   Self-host. Üçüncü taraf isteği yoktur.
   Türkçe karakterlerden ğ Ğ ş Ş İ latin-ext alt kümesindedir; ı ç ö ü latin'de.
   ========================================================================== */

@font-face {
	font-family: "Cormorant Garamond";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/cormorant-garamond-400-latin-ext.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: "Cormorant Garamond";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/cormorant-garamond-400-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: "Cormorant Garamond";
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url("../fonts/cormorant-garamond-600-latin-ext.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: "Cormorant Garamond";
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url("../fonts/cormorant-garamond-600-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: "Manrope";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/manrope-400-latin-ext.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: "Manrope";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/manrope-400-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: "Manrope";
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url("../fonts/manrope-600-latin-ext.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: "Manrope";
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url("../fonts/manrope-600-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


/* ==========================================================================
   2. TASARIM JETONLARI
   Markanın tek kaynağı. Renk veya ölçü değiştirmek gerektiğinde
   yalnızca bu blok düzenlenir. theme.json'daki palet bununla eşleşmelidir.
   ========================================================================== */

:root {

	/* — Renk — */
	--c-navy:        #09263A;
	--c-navy-deep:   #061A29;
	--c-gold:        #A47A31;
	--c-gold-soft:   #C9A560;   /* lacivert üzerinde okunabilir altın */
	--c-cream:       #F7F2E9;
	--c-cream-light: #FCFAF6;
	--c-ink:         #17232B;
	--c-gray:        #6F716E;   /* yalnızca ≥18px — kontrast 4.42 */
	--c-gray-text:   #5F615E;   /* küçük metin       — kontrast 5.61 */
	--c-line:        #E3DCCE;
	--c-line-dark:   rgba(247, 242, 233, 0.18);  /* koyu zemin üzerinde ayraç */

	/* Logo PNG'sinin kendi arka planı. Header zemini buna eşitlenerek
	   logonun kare kenarı görünmez hâle getirilir. */
	--c-logo-bg:     #F9F4EE;

	/* — Tipografi — */
	--font-body:    "Manrope", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
	--font-heading: "Cormorant Garamond", Georgia, "Times New Roman", serif;

	--fs-xs:   0.8125rem;
	--fs-sm:   0.9375rem;
	--fs-base: 1.0625rem;
	--fs-lg:   1.25rem;
	--fs-xl:   clamp(1.5rem, 1.2rem + 1.2vw, 1.9rem);
	--fs-2xl:  clamp(2rem, 1.4rem + 2.6vw, 3.5rem);

	--lh-body:    1.75;
	--lh-heading: 1.2;
	--ls-eyebrow: 0.18em;

	/* — Boşluk — */
	--sp-1:  0.25rem;
	--sp-2:  0.5rem;
	--sp-3:  1rem;
	--sp-4:  1.5rem;
	--sp-5:  2.5rem;
	--sp-6:  4rem;
	--sp-7:  6rem;
	--sp-8:  8rem;

	--section-y:   clamp(4rem, 8vw, 8rem);
	--container:   1280px;
	--measure:     68ch;
	--gutter:      1.25rem;

	/* — Header ölçüleri (Faz 2'de kullanılacak) — */
	--header-h:        108px;
	--header-h-small:  76px;
	--logo-h:          80px;
	--logo-h-small:    56px;

	/* — Diğer — */
	--radius:     2px;
	--radius-lg:  4px;
	--border:     1px solid var(--c-line);
	--transition: 160ms ease;
	--z-header:   100;
}


/* ==========================================================================
   3. SIFIRLAMA VE TEMEL
   ========================================================================== */

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
	/* Sabit header'ın çapa bağlantılarını kapatmaması için */
	scroll-padding-top: var(--header-h-small);
}

body {
	margin: 0;
	font-family: var(--font-body);
	font-size: var(--fs-base);
	font-weight: 400;
	line-height: var(--lh-body);
	color: var(--c-ink);
	background-color: var(--c-cream-light);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	/* Uzun kelimelerin mobilde taşmasını engeller */
	overflow-wrap: break-word;
}

img,
svg,
video,
canvas,
iframe {
	display: block;
	max-width: 100%;
}

img,
video {
	height: auto;
}

button,
input,
select,
textarea {
	font: inherit;
	color: inherit;
}

hr {
	height: 0;
	margin: var(--sp-5) 0;
	border: 0;
	border-top: var(--border);
}


/* ==========================================================================
   4. TİPOGRAFİ
   Cormorant Garamond yalnızca 1.5rem üstünde kullanılır; altındaki her şey
   Manrope'dur. Serif küçük boyutta zayıfladığı için bu sınır kasıtlıdır.
   ========================================================================== */

h1, h2, h3, h4, h5, h6 {
	margin: 0 0 var(--sp-3);
	font-family: var(--font-heading);
	font-weight: 600;
	line-height: var(--lh-heading);
	color: var(--c-navy);
	letter-spacing: 0.005em;
}

h1 {
	font-size: var(--fs-2xl);
	font-weight: 400;   /* büyük boyutta ince kesim daha zarif durur */
}

h2 { font-size: var(--fs-xl); }
h3 { font-size: var(--fs-lg); }

h4, h5, h6 {
	font-family: var(--font-body);
	font-size: var(--fs-base);
	font-weight: 600;
	letter-spacing: 0;
}

p,
ul,
ol,
blockquote,
figure,
table,
pre {
	margin: 0 0 var(--sp-3);
}

p:last-child,
ul:last-child,
ol:last-child {
	margin-bottom: 0;
}

/* Bölüm üstü küçük etiket — "İSTANBUL'UN KALBİNDE" gibi */
.eyebrow {
	margin: 0 0 var(--sp-3);
	font-family: var(--font-body);
	font-size: var(--fs-xs);
	font-weight: 600;
	letter-spacing: var(--ls-eyebrow);
	text-transform: uppercase;
	color: var(--c-gold);
}

.lead {
	max-width: var(--measure);
	font-size: var(--fs-lg);
	line-height: 1.6;
	color: var(--c-gray-text);
}

.section__title {
	margin-bottom: var(--sp-4);
}

/* Başlık altındaki ince altın çizgi — dekoratif ayraç */
.rule::after {
	content: "";
	display: block;
	width: 56px;
	height: 1px;
	margin-top: var(--sp-3);
	background-color: var(--c-gold);
}

.rule--center::after {
	margin-inline: auto;
}

a {
	color: var(--c-navy);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.2em;
	transition: color var(--transition);
}

a:hover,
a:focus {
	color: var(--c-gold);
}

blockquote {
	padding-left: var(--sp-4);
	border-left: 3px solid var(--c-gold);
	font-style: italic;
	color: var(--c-gray-text);
}

table {
	width: 100%;
	border-collapse: collapse;
}

th,
td {
	padding: var(--sp-2) var(--sp-3);
	border-bottom: var(--border);
	text-align: left;
}

::selection {
	background-color: var(--c-navy);
	color: var(--c-cream);
}


/* ==========================================================================
   5. YERLEŞİM
   ========================================================================== */

.container {
	width: 100%;
	max-width: var(--container);
	margin-inline: auto;
	padding-inline: var(--gutter);
}

.section {
	padding-block: var(--section-y);
}

.section--narrow {
	max-width: 720px;
}

.section--tight {
	padding-block: calc(var(--section-y) * 0.6);
}

/* Zemin varyantları — ana sayfada krem / açık krem dönüşümlü kullanılır */
.section--cream  { background-color: var(--c-cream); }
.section--light  { background-color: var(--c-cream-light); }

.section--navy {
	background-color: var(--c-navy);
	color: var(--c-cream);
}

.section--navy h1,
.section--navy h2,
.section--navy h3 {
	color: var(--c-cream);
}

.section--navy .eyebrow {
	color: var(--c-gold-soft);
}

/*
 * :not(.button) ZORUNLUDUR.
 *
 * Bu seçicinin özgüllüğü (0-1-1), .button--light kuralının özgüllüğünden
 * (0-1-0) yüksektir. Dışlama olmadan, lacivert bölümdeki açık renkli buton
 * krem zemin üzerine krem yazı basar ve içi boş bir dikdörtgen gibi görünür.
 */
.section--navy a:not(.button) {
	color: var(--c-cream);
}

.section--navy a:not(.button):hover,
.section--navy a:not(.button):focus {
	color: var(--c-gold-soft);
}

.section--navy .rule::after {
	background-color: var(--c-gold-soft);
}

.site-main {
	display: block;
}

/*
 * .has-transparent-header gövde sınıfı yalnızca hero bölümü gerçekten
 * basılacağı zaman eklenir (bkz. galata_ustad_has_hero()). Hero fotoğrafı
 * kasıtlı olarak header'ın altına uzandığı için burada boşluk bırakılmaz.
 */


/* ==========================================================================
   6. GÖRSELLER VE YER TUTUCULAR
   .media sarmalayıcısı sabit en/boy oranı verir. Fotoğraf sonradan
   yüklendiğinde yerleşim kaymaz (CLS = 0). Oran adları helpers.php içindeki
   galata_ustad_ratios() ile birebir eşleşir.
   ========================================================================== */

.media {
	position: relative;
	overflow: hidden;
	background-color: var(--c-cream);
	border-radius: var(--radius);
}

.media__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

.media--hero      { aspect-ratio: 1920 / 820; }
.media--banner    { aspect-ratio: 1920 / 640; }
.media--portrait  { aspect-ratio: 800 / 1067; }
.media--landscape { aspect-ratio: 900 / 600; }
.media--square    { aspect-ratio: 1 / 1; }

/* Yer tutucu: fotoğraf gelene kadar gösterilen markalı SVG.
   Kesilmemesi için cover değil contain ile ortalanır. */
.media__img--placeholder {
	object-fit: contain;
	background-color: var(--c-cream);
}

/* Görsel kapsayıcıya tam yayılsın (hero, banner gibi tam ekran alanlarda) */
.media--fill {
	position: absolute;
	inset: 0;
	border-radius: 0;
}

.media--fill .media__img--placeholder {
	object-fit: cover;
}


/* ==========================================================================
   7. BİLEŞENLER
   ========================================================================== */

/* — Buton — */
.button,
.wp-block-button__link {
	display: inline-block;
	padding: 0.85em 1.9em;
	font-family: var(--font-body);
	font-size: var(--fs-sm);
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: 0.02em;
	color: var(--c-cream);
	background-color: var(--c-navy);
	border: 1px solid var(--c-navy);
	border-radius: var(--radius);
	text-decoration: none;
	cursor: pointer;
	transition: background-color var(--transition), border-color var(--transition), color var(--transition);
}

.button:hover,
.button:focus,
.wp-block-button__link:hover {
	background-color: var(--c-navy-deep);
	border-color: var(--c-navy-deep);
	color: var(--c-cream);
}

/* İkincil: dolgusuz, ince kenarlı */
.button--outline {
	color: var(--c-navy);
	background-color: transparent;
	border-color: var(--c-gold);
}

.button--outline:hover,
.button--outline:focus {
	color: var(--c-cream);
	background-color: var(--c-navy);
	border-color: var(--c-navy);
}

/* Koyu zemin üzerinde */
.button--light {
	color: var(--c-navy);
	background-color: var(--c-cream);
	border-color: var(--c-cream);
}

.button--light:hover,
.button--light:focus {
	color: var(--c-navy);
	background-color: var(--c-cream-light);
	border-color: var(--c-cream-light);
}

/* — Ok işaretli metin bağlantısı — */
.link-arrow {
	display: inline-flex;
	align-items: center;
	gap: 0.5em;
	font-size: var(--fs-sm);
	font-weight: 600;
	letter-spacing: 0.02em;
	color: var(--c-navy);
	text-decoration: none;
	border-bottom: 1px solid var(--c-gold);
	padding-bottom: 0.2em;
	transition: color var(--transition), border-color var(--transition);
}

.link-arrow::after {
	content: "→";
	transition: transform var(--transition);
}

.link-arrow:hover::after,
.link-arrow:focus::after {
	transform: translateX(3px);
}

.section--navy .link-arrow {
	color: var(--c-cream);
	border-bottom-color: var(--c-gold-soft);
}

/* — Form alanları — */
input[type="text"],
input[type="email"],
input[type="url"],
input[type="tel"],
input[type="search"],
textarea,
select {
	width: 100%;
	max-width: 100%;
	padding: 0.7em 0.9em;
	color: var(--c-ink);
	background-color: var(--c-cream-light);
	border: var(--border);
	border-radius: var(--radius);
	transition: border-color var(--transition);
}

input:focus,
textarea:focus,
select:focus {
	border-color: var(--c-gold);
}

/* — Yazı / sayfa içeriği — */
.entry__header {
	padding-top: var(--section-y);
}

.entry__title {
	margin-bottom: var(--sp-4);
}

.entry__content {
	padding-bottom: var(--section-y);
}

.entry__content > * {
	max-width: var(--measure);
}

.entry__content > .alignwide,
.entry__content > .alignfull,
.entry__content > figure,
.entry__content > .wp-block-gallery,
.entry__content > .wp-block-image {
	max-width: none;
}


/* ==========================================================================
   8. HEADER
   İki durum:
     · İç sayfalar    → baştan krem, sticky
     · Ana sayfa      → hero üzerinde şeffaf (fixed), kaydırınca krem ve ince
   Durum sınıfı .is-scrolled JavaScript tarafından eklenir.
   ========================================================================== */

/* Kaydırma işaretçisi — yerleşimi etkilemez, yalnızca gözlemlenir */
.header-sentinel {
	position: absolute;
	top: 0;
	left: 0;
	width: 1px;
	height: 80px;
	pointer-events: none;
	visibility: hidden;
}

.site-header {
	position: sticky;
	top: 0;
	z-index: var(--z-header);
	background-color: var(--c-logo-bg);
	border-bottom: 1px solid var(--c-line);
	transition: background-color var(--transition), border-color var(--transition);
}

/* Ana sayfa: hero fotoğrafının üzerinde durur */
.has-transparent-header .site-header {
	position: fixed;
	inset-inline: 0;
	top: 0;
	background-color: transparent;
	border-bottom-color: transparent;
}

.has-transparent-header .site-header.is-scrolled {
	background-color: var(--c-logo-bg);
	border-bottom-color: var(--c-gold);
}

/*
 * Yönetici çubuğu (admin bar) ekranın en üstünde sabit durur. Header de sabit
 * veya yapışkan olduğu için, kaydırılmazsa ikisi üst üste biner ve logonun
 * üst kısmı kesilir. WordPress'in html'e eklediği margin-top bunu çözmez;
 * sabit/yapışkan öğelerin ayrıca kaydırılması gerekir.
 *
 * Yükseklikler WordPress'in kendi değerleridir: masaüstünde 32px, 782px
 * altında 46px (çubuk orada iki satıra çıkar).
 */
.admin-bar .site-header {
	top: 32px;
}

.admin-bar .header-sentinel {
	top: 32px;
}

@media screen and (max-width: 782px) {

	.admin-bar .site-header {
		top: 46px;
	}

	.admin-bar .header-sentinel {
		top: 46px;
	}
}

.site-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--sp-4);
	min-height: var(--header-h);
	transition: min-height var(--transition);
}

.site-header.is-scrolled .site-header__inner {
	min-height: var(--header-h-small);
}

.site-header__end {
	display: flex;
	align-items: center;
	gap: var(--sp-4);
}


/* — Logo —
   PNG'nin kendi arka planı krem olduğu için logo daima krem bir plaka
   içinde durur. Krem header'da plaka görünmez (aynı renk); şeffaf header'da
   ve lacivert footer'da kasıtlı bir tasarım öğesi olarak okunur.
   Böylece kaydırma sırasında plaka belirip kaybolmaz — zıplama olmaz. */

.site-logo {
	margin: 0;
	font-size: inherit;
	line-height: 0;
	flex-shrink: 0;
}

.site-logo__link {
	display: inline-block;
	padding: 6px;
	background-color: var(--c-logo-bg);
	border-radius: var(--radius);
	text-decoration: none;
	border: 0;
	transition: background-color var(--transition);
}

.site-logo__img {
	width: auto;
	height: var(--logo-h);
	transition: height var(--transition);
}

.site-header.is-scrolled .site-logo__img {
	height: var(--logo-h-small);
}


/* — Masaüstü menüsü — */

.site-nav__list {
	display: flex;
	align-items: center;
	gap: var(--sp-5);
	margin: 0;
	padding: 0;
	list-style: none;
}

.site-nav__list a {
	display: inline-block;
	padding: var(--sp-2) 0;
	font-family: var(--font-body);
	font-size: var(--fs-sm);
	font-weight: 600;
	color: var(--c-ink);
	text-decoration: none;
	border-bottom: 1px solid transparent;
	transition: color var(--transition), border-color var(--transition);
}

.site-nav__list a:hover,
.site-nav__list a:focus,
.site-nav__list .current-menu-item > a,
.site-nav__list .current_page_item > a {
	color: var(--c-navy);
	border-bottom-color: var(--c-gold);
}

/* Şeffaf header üzerinde metin açık renge döner.
   Hafif gölge, açık fotoğraflarda da okunabilirliği güvenceye alır. */
.has-transparent-header .site-header:not(.is-scrolled) .site-nav__list a,
.has-transparent-header .site-header:not(.is-scrolled) .site-header__social,
.has-transparent-header .site-header:not(.is-scrolled) .nav-toggle {
	color: var(--c-cream);
	text-shadow: 0 1px 2px rgba(6, 26, 41, 0.45);
}

.has-transparent-header .site-header:not(.is-scrolled) .site-nav__list a:hover,
.has-transparent-header .site-header:not(.is-scrolled) .site-nav__list a:focus {
	color: var(--c-gold-soft);
	border-bottom-color: var(--c-gold-soft);
}

.site-nav__notice a {
	color: var(--c-gold);
	font-style: italic;
}


/* — Header'daki Instagram bağlantısı —
   Menüden ince bir altın çizgiyle ayrılır. */

.site-header__social {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	padding: 0;
	color: var(--c-ink);
	text-decoration: none;
	border: 0;
	transition: color var(--transition);
}

.site-header__social:hover,
.site-header__social:focus {
	color: var(--c-gold);
}

.site-header__end > .site-header__social {
	position: relative;
}

.site-header__end > .site-header__social::before {
	content: "";
	position: absolute;
	left: calc(var(--sp-4) * -0.5);
	top: 50%;
	width: 1px;
	height: 20px;
	background-color: var(--c-gold);
	opacity: 0.5;
	transform: translateY(-50%);
}


/* — Dil değiştirici —
   Aktif dil altın, diğeri soluk. Aralarında ince bir ayraç.
   İngilizce bölümü kurulmamışsa bu blok hiç basılmaz. */

.lang-switch {
	display: inline-flex;
	align-items: center;
	gap: 0;
	font-family: var(--font-body);
	font-size: var(--fs-xs);
	font-weight: 600;
	letter-spacing: 0.08em;
}

.lang-switch__item {
	padding: 0.35em 0.55em;
	color: var(--c-gray-text);
	text-decoration: none;
	border: 0;
	border-radius: var(--radius);
	transition: color var(--transition);
}

.lang-switch__item + .lang-switch__item {
	border-left: 1px solid var(--c-line);
}

.lang-switch__item--active {
	color: var(--c-gold);
	cursor: default;
}

a.lang-switch__item:hover,
a.lang-switch__item:focus {
	color: var(--c-navy);
}

/* Şeffaf header üzerinde açık tonlara döner */
.has-transparent-header .site-header:not(.is-scrolled) .lang-switch__item {
	color: rgba(247, 242, 233, 0.72);
	text-shadow: 0 1px 2px rgba(6, 26, 41, 0.45);
}

.has-transparent-header .site-header:not(.is-scrolled) .lang-switch__item + .lang-switch__item {
	border-left-color: var(--c-line-dark);
}

.has-transparent-header .site-header:not(.is-scrolled) .lang-switch__item--active {
	color: var(--c-gold-soft);
}

.has-transparent-header .site-header:not(.is-scrolled) a.lang-switch__item:hover,
.has-transparent-header .site-header:not(.is-scrolled) a.lang-switch__item:focus {
	color: var(--c-cream);
}


/* — Mobil menü düğmesi —
   Masaüstünde gizlidir; responsive.css içinde görünür hâle gelir. */

.nav-toggle {
	display: none;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	color: var(--c-ink);
	background: none;
	border: 1px solid var(--c-line);
	border-radius: var(--radius);
	cursor: pointer;
	transition: color var(--transition), border-color var(--transition);
}

.nav-toggle:hover {
	border-color: var(--c-gold);
}

.nav-toggle__icon {
	display: flex;
}

.nav-toggle__icon--close,
.nav-toggle[aria-expanded="true"] .nav-toggle__icon--open {
	display: none;
}

.nav-toggle[aria-expanded="true"] .nav-toggle__icon--close {
	display: flex;
}


/* ==========================================================================
   9. FOOTER
   Lacivert zemin, krem metin (kontrast 13.9). Altın yalnızca ince ayraç
   ve başlık vurgusu olarak kullanılır.
   ========================================================================== */

.site-footer {
	background-color: var(--c-navy);
	color: var(--c-cream);
}

.site-footer__inner {
	display: grid;
	gap: var(--sp-5);
	padding-block: var(--sp-6);
}

.site-footer__col--brand {
	max-width: 34ch;
}

/* Footer logo plakası — koyu zemin üzerinde krem kare.
   Sade tutulur: ince altın kenar, gölge yok. */
/* Plaka rengi logonun kendi arka planıyla AYNI (--c-logo-bg) tutulur;
   böylece plaka ile logo arasında ton farkı çizgisi oluşmaz, sınırı
   yalnızca ince altın kenar belirler. */
.site-logo--footer .site-logo__link {
	padding: 10px;
	background-color: var(--c-logo-bg);
	border: 1px solid rgba(164, 122, 49, 0.45);
	border-radius: var(--radius-lg);
}

.site-logo--footer .site-logo__img {
	height: 96px;
}

.site-footer__about {
	margin: var(--sp-4) 0 0;
	font-size: var(--fs-sm);
	line-height: 1.7;
	color: var(--c-cream);
	opacity: 0.85;
}

.site-footer__title {
	margin: 0 0 var(--sp-4);
	font-family: var(--font-body);
	font-size: var(--fs-xs);
	font-weight: 600;
	letter-spacing: var(--ls-eyebrow);
	text-transform: uppercase;
	color: var(--c-gold-soft);
}

.site-footer__list,
.site-footer__menu {
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: var(--fs-sm);
}

.site-footer__item {
	display: flex;
	align-items: flex-start;
	gap: var(--sp-2);
	margin-bottom: var(--sp-3);
	color: var(--c-cream);
}

.site-footer__item .icon {
	flex-shrink: 0;
	margin-top: 0.25em;
	color: var(--c-gold-soft);
}

.site-footer__menu li {
	margin-bottom: var(--sp-2);
}

.site-footer a {
	color: var(--c-cream);
	text-decoration: none;
	border-bottom: 1px solid transparent;
	transition: color var(--transition), border-color var(--transition);
}

.site-footer a:hover,
.site-footer a:focus {
	color: var(--c-gold-soft);
	border-bottom-color: var(--c-gold-soft);
}

.site-footer__maps {
	margin-top: var(--sp-3);
	color: var(--c-cream);
	border-bottom-color: var(--c-gold-soft);
}

.site-footer__bottom {
	border-top: 1px solid var(--c-line-dark);
}

.site-footer__bottom-inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--sp-3);
	padding-block: var(--sp-4);
}

.site-footer__copyright {
	margin: 0;
	font-size: var(--fs-xs);
	color: var(--c-cream);
	opacity: 0.75;
}


/* — Sosyal bağlantı listesi (footer ve diğer bölümler) — */

.social-links {
	display: flex;
	align-items: center;
	gap: var(--sp-2);
	margin: 0;
	padding: 0;
	list-style: none;
}

.social-links__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border: 1px solid transparent;
	border-radius: var(--radius);
	transition: color var(--transition), border-color var(--transition);
}

.social-links--footer .social-links__link {
	color: var(--c-cream);
	border-color: var(--c-line-dark);
}

.social-links--footer .social-links__link:hover,
.social-links--footer .social-links__link:focus {
	color: var(--c-gold-soft);
	border-color: var(--c-gold-soft);
}


/* ==========================================================================
   10. ANA SAYFA BÖLÜMLERİ
   Mobile-first: burada tek sütun tanımlanır, çok sütunlu düzenler
   responsive.css içinde eklenir.
   ========================================================================== */

/* — 1. Hero — */

.hero {
	position: relative;
	display: flex;
	align-items: flex-end;
	min-height: clamp(520px, 86vh, 900px);
	padding-block: var(--sp-6) var(--sp-5);
	overflow: hidden;
	background-color: var(--c-navy);
	isolation: isolate;
}

.hero__media {
	z-index: -2;
}

/*
 * Kaplama düz bir renk değil, alttan yukarı açılan bir geçiş: metin alanı
 * koyu kalırken fotoğrafın üst kısmı görünür olur. Koyuluk Özelleştirici'den
 * gelen --hero-overlay değişkeniyle ayarlanır.
 */
/*
 * İki katman:
 *
 * 1) Üstteki dar bant, header'ın oturduğu alanı her koşulda hafifçe
 *    koyulaştırır. Kaplama koyuluğu sıfıra çekilse bile menü ve logo açık
 *    tonlu bir fotoğrafın üzerinde okunur kalır. Yalnızca ilk 180 pikselde
 *    etkilidir, fotoğrafın gövdesini karartmaz.
 *
 * 2) Alttan yukarı açılan asıl kaplama; metin alanı koyu kalırken fotoğrafın
 *    üst kısmı görünür olur. Koyuluğu Özelleştirici belirler.
 */
.hero__scrim {
	position: absolute;
	inset: 0;
	z-index: -1;
	background:
		linear-gradient(
			to bottom,
			rgba(6, 26, 41, 0.42) 0,
			rgba(6, 26, 41, 0.18) 110px,
			rgba(6, 26, 41, 0) 180px
		),
		linear-gradient(
			to top,
			rgba(6, 26, 41, calc(var(--hero-overlay, 0.45) + 0.35)) 0%,
			rgba(6, 26, 41, var(--hero-overlay, 0.45)) 45%,
			rgba(6, 26, 41, calc(var(--hero-overlay, 0.45) * 0.55)) 100%
		);
}

.hero__inner {
	max-width: var(--container);
	color: var(--c-cream);
}

.hero__eyebrow {
	color: var(--c-gold-soft);
}

.hero__title {
	max-width: 16ch;
	margin-bottom: var(--sp-4);
	color: var(--c-cream);
}

.hero__text {
	max-width: 48ch;
	margin-bottom: var(--sp-5);
	font-size: var(--fs-lg);
	line-height: 1.6;
	color: var(--c-cream);
}

.hero__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--sp-4);
}

.hero__link {
	color: var(--c-cream);
	border-bottom-color: var(--c-gold-soft);
}

.hero__link:hover,
.hero__link:focus {
	color: var(--c-gold-soft);
}


/* — 2. Tanıtım — */

.intro__inner {
	display: grid;
	gap: var(--sp-5);
}

.intro__body p {
	margin-bottom: var(--sp-3);
	max-width: var(--measure);
}

.intro__more {
	margin-top: var(--sp-4);
}


/* — 3. Öne çıkan görseller — */

.featured__grid {
	display: grid;
	gap: var(--sp-5);
}

.featured__item {
	display: block;
	color: inherit;
	text-decoration: none;
}

.featured__media {
	margin-bottom: var(--sp-3);
}

.featured__media .media__img {
	transition: transform 400ms ease;
}

a.featured__item:hover .media__img {
	transform: scale(1.03);
}

.featured__title {
	margin-bottom: var(--sp-3);
	font-size: var(--fs-lg);
}

.featured__text {
	max-width: 40ch;
	color: var(--c-gray-text);
}


/* — 4. Marka deneyimi — */

.highlights__title {
	text-align: center;
}

.highlights__list {
	display: grid;
	gap: var(--sp-5);
	margin: var(--sp-5) 0 0;
	padding: 0;
	list-style: none;
}

.highlights__item {
	text-align: center;
}

.highlights__icon {
	display: inline-flex;
	color: var(--c-gold);
}

.highlights__heading {
	margin: var(--sp-3) 0 var(--sp-2);
	font-size: var(--fs-lg);
}

.highlights__text {
	max-width: 32ch;
	margin-inline: auto;
	color: var(--c-gray-text);
}


/* — 5. Geniş görsel — */

.banner {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: clamp(320px, 46vh, 560px);
	padding-block: var(--sp-6);
	overflow: hidden;
	background-color: var(--c-navy);
	isolation: isolate;
}

.banner__media {
	z-index: -2;
}

.banner__scrim {
	position: absolute;
	inset: 0;
	z-index: -1;
	background-color: rgba(6, 26, 41, 0.45);
}

.banner__inner {
	text-align: center;
}

.banner__slogan {
	max-width: 20ch;
	margin: 0 auto;
	font-family: var(--font-heading);
	font-size: var(--fs-2xl);
	font-weight: 400;
	line-height: var(--lh-heading);
	color: var(--c-cream);
}


/* — 6. Galeri ön izleme — */

.gallery-preview__head {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--sp-3);
	margin-bottom: var(--sp-5);
}

.gallery-preview__head .section__title {
	margin-bottom: 0;
}

.gallery-preview__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--sp-3);
	margin: 0;
	padding: 0;
	list-style: none;
}

.gallery-preview__item .media__img {
	transition: transform 400ms ease;
}

.gallery-preview__item:hover .media__img {
	transform: scale(1.04);
}


/* — 7. İletişim çağrısı — */

.contact-summary__title {
	text-align: center;
}

.contact-summary__list {
	display: grid;
	gap: var(--sp-5);
	margin: var(--sp-5) 0 0;
	padding: 0;
	list-style: none;
	text-align: center;
}

.contact-summary__icon {
	display: inline-flex;
	color: var(--c-gold-soft);
}

.contact-summary__label {
	margin: var(--sp-3) 0 var(--sp-2);
	font-family: var(--font-body);
	font-size: var(--fs-xs);
	font-weight: 600;
	letter-spacing: var(--ls-eyebrow);
	text-transform: uppercase;
	color: var(--c-gold-soft);
}

.contact-summary__item p {
	margin: 0;
	color: var(--c-cream);
}

.contact-summary__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: var(--sp-4);
	margin-top: var(--sp-6);
}

.social-links--cta .social-links__link {
	color: var(--c-cream);
	border-color: var(--c-line-dark);
}

.social-links--cta .social-links__link:hover,
.social-links--cta .social-links__link:focus {
	color: var(--c-gold-soft);
	border-color: var(--c-gold-soft);
}

/*
 * İletişim çağrısı doğrudan footer'a bağlanır; ikisi tek koyu blok gibi
 * okunsun diye aradaki boşluk kaldırılır.
 */
.contact-summary + .site-footer {
	margin-top: 0;
}


/* ==========================================================================
   11. İÇ SAYFALAR
   Hakkımızda · Galeri · İletişim
   ========================================================================== */

/* — Ortak iç sayfa hero'su — */

.page-hero {
	position: relative;
	display: flex;
	align-items: flex-end;
	min-height: clamp(260px, 38vh, 420px);
	padding-block: var(--sp-6) var(--sp-5);
	overflow: hidden;
	background-color: var(--c-navy);
	isolation: isolate;
}

.page-hero__media {
	z-index: -2;
}

.page-hero__scrim {
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(
		to top,
		rgba(6, 26, 41, 0.78) 0%,
		rgba(6, 26, 41, 0.5) 100%
	);
}

.page-hero__title {
	margin-bottom: 0;
	color: var(--c-cream);
}

.page-hero__text {
	max-width: 52ch;
	margin: var(--sp-3) 0 0;
	font-size: var(--fs-lg);
	line-height: 1.6;
	color: var(--c-cream);
	opacity: 0.9;
}

/*
 * Öne çıkan görsel seçilmemiş sayfa: fotoğraf yerine sade krem bir başlık
 * bandı. Boş bir lacivert dikdörtgen göstermektense sayfanın kendi
 * tonunda kalmak daha temiz durur.
 */
.page-hero--plain {
	min-height: 0;
	padding-block: var(--sp-6) var(--sp-5);
	background-color: var(--c-cream);
	border-bottom: 1px solid var(--c-line);
}

.page-hero--plain .page-hero__title {
	color: var(--c-navy);
}

.page-hero--plain .page-hero__text {
	color: var(--c-gray-text);
	opacity: 1;
}


/* — Sayfa içeriği — */

.page-content {
	padding-block: var(--section-y);
	background-color: var(--c-cream-light);
}

.page-content__body > * {
	max-width: var(--measure);
	margin-inline: auto;
}

/* Geniş ve tam genişlik hizaları ölçü sınırını aşar — Hakkımızda
   sayfasındaki büyük fotoğraflar bu sayede nefes alır. */
.page-content__body > .alignwide,
.page-content__body > .alignfull,
.page-content__body > .wp-block-gallery,
.page-content__body > .wp-block-columns,
.page-content__body > figure.wp-block-image {
	max-width: none;
}

.page-content__body > * + * {
	margin-top: var(--sp-4);
}

.page-content__body > h2,
.page-content__body > h3 {
	margin-top: var(--sp-6);
}

.page-content__body figure {
	margin-block: var(--sp-5);
}

.page-content__body img {
	border-radius: var(--radius);
}


/* — Galeri sayfası (çekirdek Galeri bloğu masonry'ye çevrilir) —
 *
 * ÖZGÜLLÜK NOTU — buradaki uzun seçiciler gereksiz değildir.
 *
 * WordPress'in blok kütüphanesi galeri kurallarını
 * "figure.wp-block-image:not(#individual-image)" biçiminde yazar. Var olmayan
 * bir kimliği dışlamak seçiciye ID ağırlığı kazandırır (1-3-2) ve normal
 * yazılmış bir tema kuralını (0-4-2) ezer. Bu, çekirdeğin bilinçli bir
 * özgüllük tercihidir; tema tarafında aynı yapı kullanılmadan galeri
 * genişlikleri geçersiz kılınamaz.
 *
 * "is-cropped" varyantı ayrıca img üzerine height:100% ve object-fit:cover
 * uygular; sütun tabanlı masonry'de bu, fotoğrafların kırpılmasına yol açar.
 * O yüzden iki durum da hedeflenir.
 */

.page-content--gallery .wp-block-gallery.has-nested-images {
	display: block;
	column-count: 1;
	column-gap: var(--sp-3);
}

.page-content--gallery .wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image) {
	display: block;
	float: none;
	width: 100%;
	max-width: 100%;
	margin: 0 0 var(--sp-3);
	break-inside: avoid;
	page-break-inside: avoid;
}

.page-content--gallery .wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image) > a,
.page-content--gallery .wp-block-gallery.has-nested-images.is-cropped figure.wp-block-image:not(#individual-image) > a {
	display: block;
	width: 100%;
}

.page-content--gallery .wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image) img,
.page-content--gallery .wp-block-gallery.has-nested-images.is-cropped figure.wp-block-image:not(#individual-image) img {
	display: block;
	width: 100%;
	max-width: 100%;
	/* Masonry'nin amacı fotoğrafın kendi oranını korumaktır; kırpma yok. */
	height: auto;
	object-fit: initial;
	border-radius: var(--radius);
	transition: opacity var(--transition);
}

.page-content--gallery .wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image) img:hover {
	opacity: 0.88;
}

/* Blok içi başlıklar sütun akışını bozmasın */
.page-content--gallery .wp-block-gallery.has-nested-images figure.wp-block-image figcaption {
	position: static;
	max-width: 100%;
	padding: var(--sp-2) 0 0;
	background: none;
	color: var(--c-gray-text);
	font-size: var(--fs-xs);
	text-align: left;
}

/* — Menü görselleri sayfası —
   Galeri düzenini miras alır, tek farkı SÜTUN SAYISIDIR. Menü fotoğrafları
   okunmak içindir; üç sütuna sıkıştırıldığında yazı seçilemez hâle gelir.
   Bu yüzden masaüstünde iki sütun kullanılır ve her görsel daha büyük durur.
   Sütun sayısı responsive.css içinde ayarlanır. */

.menu-hint {
	margin: 0 0 var(--sp-4);
	font-size: var(--fs-sm);
	color: var(--c-gray-text);
	text-align: center;
}

.page-content--menu .wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image) img {
	/* Menü sayfaları genelde açık zeminlidir; ince çerçeve kenarı belirginleştirir. */
	border: 1px solid var(--c-line);
}

/* Yöneticiye görünen boş galeri uyarısı */
.notice-empty {
	max-width: 60ch;
	margin-inline: auto;
	padding: var(--sp-5);
	text-align: center;
	background-color: var(--c-cream);
	border: 1px dashed var(--c-line);
	border-radius: var(--radius-lg);
}

.notice-empty__title {
	margin-bottom: var(--sp-3);
}


/* — Görsel büyütme (lightbox) —
   Kaplama katmanı JavaScript tarafından oluşturulur; galeri bulunmayan
   sayfalarda hiç var olmaz. */

.is-zoomable {
	cursor: zoom-in;
}

/* Sayfa arkada kaymasın */
body.has-lightbox {
	overflow: hidden;
}

.lightbox {
	position: fixed;
	inset: 0;
	z-index: 200;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--sp-3);
	padding: var(--sp-5) var(--sp-3);
	background-color: rgba(6, 26, 41, 0.95);
}

.lightbox[hidden] {
	display: none;
}

.lightbox__figure {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--sp-3);
	max-width: min(1200px, 100%);
	max-height: 100%;
	margin: 0;
}

.lightbox__img {
	max-width: 100%;
	/* Başlık ve sayaç için yer bırak */
	max-height: calc(100vh - 10rem);
	width: auto;
	height: auto;
	object-fit: contain;
	border-radius: var(--radius);
}

.lightbox__caption {
	max-width: 60ch;
	margin: 0;
	font-size: var(--fs-sm);
	line-height: 1.6;
	color: var(--c-cream);
	text-align: center;
	opacity: 0.85;
}

.lightbox__caption[hidden] {
	display: none;
}

.lightbox__counter {
	position: absolute;
	left: 50%;
	bottom: var(--sp-3);
	margin: 0;
	transform: translateX(-50%);
	font-size: var(--fs-xs);
	letter-spacing: 0.1em;
	color: var(--c-gold-soft);
}

.lightbox__close,
.lightbox__nav {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 48px;
	height: 48px;
	padding: 0;
	font-family: var(--font-body);
	font-size: 2rem;
	line-height: 1;
	color: var(--c-cream);
	background-color: transparent;
	border: 1px solid var(--c-line-dark);
	border-radius: var(--radius);
	cursor: pointer;
	transition: color var(--transition), border-color var(--transition);
}

.lightbox__close:hover,
.lightbox__nav:hover,
.lightbox__close:focus-visible,
.lightbox__nav:focus-visible {
	color: var(--c-gold-soft);
	border-color: var(--c-gold-soft);
	background-color: transparent;
}

.lightbox__close {
	position: absolute;
	top: var(--sp-3);
	right: var(--sp-3);
	font-size: 1.75rem;
}

.lightbox__nav[hidden] {
	display: none;
}


/* — İletişim sayfası — */

.page-content__intro {
	margin-bottom: var(--sp-6);
}

.contact-grid {
	display: grid;
	gap: var(--sp-5);
}

.contact-card {
	padding-top: var(--sp-4);
	border-top: 1px solid var(--c-gold);
}

.contact-card__icon {
	display: inline-flex;
	color: var(--c-gold);
}

.contact-card__title {
	margin: var(--sp-3) 0 var(--sp-3);
	font-family: var(--font-body);
	font-size: var(--fs-xs);
	font-weight: 600;
	letter-spacing: var(--ls-eyebrow);
	text-transform: uppercase;
	color: var(--c-navy);
}

.contact-card p {
	margin-bottom: var(--sp-3);
}

.contact-card__list {
	margin: 0 0 var(--sp-3);
	padding: 0;
	list-style: none;
}

.contact-card__list li {
	margin-bottom: var(--sp-2);
}

.contact-card a {
	text-decoration: none;
	border-bottom: 1px solid var(--c-line);
	transition: border-color var(--transition);
}

.contact-card a:hover,
.contact-card a:focus {
	border-bottom-color: var(--c-gold);
}

.contact-card .link-arrow {
	border-bottom-color: var(--c-gold);
}

.social-links--contact {
	margin-left: -0.6rem;
}

.social-links--contact .social-links__link {
	color: var(--c-navy);
	border-color: var(--c-line);
}

.social-links--contact .social-links__link:hover,
.social-links--contact .social-links__link:focus {
	color: var(--c-gold);
	border-color: var(--c-gold);
}

.contact-form {
	max-width: 640px;
	margin: var(--sp-6) auto 0;
}

.contact-form label {
	display: block;
	margin-bottom: var(--sp-1);
	font-size: var(--fs-sm);
	font-weight: 600;
}

.contact-form p {
	margin-bottom: var(--sp-3);
}

/* Harita gömülüyse tam genişlikte, sabit oranlı bir blok olarak durur */
.contact-map {
	margin-top: var(--sp-6);
	line-height: 0;
}

.contact-map iframe {
	display: block;
	width: 100%;
	height: clamp(280px, 42vh, 460px);
	border: 0;
	border-top: 1px solid var(--c-line);
}

.contact-map-link {
	margin-top: var(--sp-5);
	text-align: center;
}


/* ==========================================================================
   12. ERİŞİLEBİLİRLİK VE YARDIMCILAR
   ========================================================================== */

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

.skip-link {
	position: absolute;
	left: -9999px;
	z-index: 999;
	padding: var(--sp-2) var(--sp-3);
	background-color: var(--c-cream-light);
	color: var(--c-navy);
	border: 1px solid var(--c-navy);
	border-radius: var(--radius);
	text-decoration: none;
	font-weight: 600;
}

.skip-link:focus {
	left: var(--sp-3);
	top: var(--sp-3);
}

/* Klavye odağı her yerde görünür ve markaya uygun */
:focus-visible {
	outline: 2px solid var(--c-gold);
	outline-offset: 3px;
	border-radius: var(--radius);
}

.section--navy :focus-visible {
	outline-color: var(--c-gold-soft);
}

/* Blok editörü hizalama sınıfları */
.alignwide   { max-width: var(--container); }
.alignfull   { max-width: none; }
.aligncenter { margin-inline: auto; }

.wp-element-caption,
.wp-caption-text {
	font-size: var(--fs-xs);
	color: var(--c-gray-text);
	text-align: center;
}

/* Hareket duyarlılığı — tüm geçiş ve animasyonlar etkisiz hâle gelir */
@media (prefers-reduced-motion: reduce) {

	html {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

/* ==========================================================================
   GALATA ÜSTAD — kırılım noktaları
   ==========================================================================
   Tema mobile-first yazılır: main.css içindeki kurallar en küçük ekranı
   tanımlar, bu dosya yalnızca ekran değiştikçe EKLENEN kuralları içerir.
   Tüm medya sorguları burada toplanır; bir bileşenin farklı ekranlardaki
   davranışı tek yerden okunabilir.

   Kırılım noktaları
     480px   büyük telefon
     768px   tablet
    1024px   masaüstü — menünün yatay şeride döndüğü eşik
    1280px   geniş ekran
   ========================================================================== */


/* ==========================================================================
   ≥ 480px — büyük telefon
   ========================================================================== */

@media (min-width: 480px) {

	:root {
		--gutter: 1.5rem;
	}
}


/* ==========================================================================
   ≥ 768px — tablet
   ========================================================================== */

@media (min-width: 768px) {

	:root {
		--gutter:         2rem;
		--header-h:       84px;
		--header-h-small: 72px;
		--logo-h:         60px;
		--logo-h-small:   52px;
	}

	.site-footer__inner {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: var(--sp-5) var(--sp-4);
	}

	/* İletişim kartları iki sütuna açılır */
	.contact-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: var(--sp-5) var(--sp-4);
	}

	/* Galeri masonry iki sütun */
	.page-content--gallery .wp-block-gallery.has-nested-images {
		column-count: 2;
	}

	/* Menü görselleri tabletten itibaren iki sütun ve orada kalır */
	.page-content--menu .wp-block-gallery.has-nested-images {
		column-count: 2;
	}

	/* Marka deneyimi üç sütuna açılır */
	.highlights__list {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: var(--sp-4);
	}

	/* İletişim çağrısı üç sütuna açılır */
	.contact-summary__list {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	/* Galeri üç sütun */
	.gallery-preview__grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	/* Öne çıkanlar: ilk kart dikey ve tam yükseklik, diğer ikisi sağda alt alta */
	.featured__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: var(--sp-4);
	}

	.featured__item--tall {
		grid-row: span 2;
		display: flex;
		flex-direction: column;
	}

	.featured__item--tall .featured__media {
		flex: 1 1 auto;
	}

	.featured__item--tall .media {
		height: 100%;
	}
}


/* ==========================================================================
   ≥ 1024px — masaüstü
   Header tam yüksekliğine ve logo hedef ölçüsüne burada ulaşır.
   ========================================================================== */

@media (min-width: 1024px) {

	:root {
		--gutter:         2.5rem;
		--header-h:       108px;
		--header-h-small: 76px;
		--logo-h:         80px;
		--logo-h-small:   56px;
	}

	.section--narrow {
		max-width: 760px;
	}

	.site-footer__inner {
		grid-template-columns: 1.4fr 1fr 1fr 0.8fr;
		gap: var(--sp-5);
	}

	/* Tanıtım: solda dikey fotoğraf, sağda metin — metin dikeyde ortalanır */
	.intro__inner {
		grid-template-columns: 5fr 6fr;
		gap: var(--sp-6);
		align-items: center;
	}

	.hero {
		padding-block: var(--sp-8) var(--sp-7);
	}

	.highlights__list {
		gap: var(--sp-6);
	}

	/* İletişim kartları dört sütuna açılır */
	.contact-grid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	/* Galeri masonry üç sütun */
	.page-content--gallery .wp-block-gallery.has-nested-images {
		column-count: 3;
	}

	/* Menü görselleri üç sütuna ÇIKMAZ: yazının okunabilir kalması için
	   masaüstünde de iki sütunda kalır. */
	.page-content--menu .wp-block-gallery.has-nested-images {
		column-count: 2;
	}
}


/* ==========================================================================
   ≥ 1280px — geniş ekran
   ========================================================================== */

@media (min-width: 1280px) {

	.site-footer__inner {
		gap: var(--sp-6);
	}
}


/* ==========================================================================
   ≤ 1023.98px — mobil ve tablet
   Menü, header'ın altından açılan sade bir panele döner. Tam ekran kaplama
   veya karmaşık animasyon kullanılmaz; panel yalnızca görünür/görünmez olur.
   ========================================================================== */

@media (max-width: 1023.98px) {

	.site-header__inner {
		position: relative;
		gap: var(--sp-3);
	}

	.site-header__end {
		gap: var(--sp-2);
	}

	.nav-toggle {
		display: inline-flex;
	}

	/* Menü yatay şerit olmaktan çıktığı için ayraç çizgisinin ayıracağı bir
	   şey kalmaz; dar boşlukta düğmenin üzerine binmemesi için kaldırılır. */
	.site-header__end > .site-header__social::before {
		display: none;
	}

	/* Dil değiştirici mobilde de header'da kalır — menüyü açmadan dil
	   değiştirebilmek gerekir — ama daha dar durur. */
	.lang-switch__item {
		padding: 0.35em 0.4em;
	}

	/* Menü paneli — kapalı durum */
	.site-nav {
		position: absolute;
		inset-inline: calc(var(--gutter) * -1);
		top: 100%;
		display: none;
		padding: var(--sp-3) var(--gutter) var(--sp-4);
		background-color: var(--c-logo-bg);
		border-top: 1px solid var(--c-line);
		border-bottom: 1px solid var(--c-gold);
		max-height: calc(100vh - var(--header-h));
		overflow-y: auto;
	}

	.site-nav.is-open {
		display: block;
	}

	.site-nav__list {
		flex-direction: column;
		align-items: stretch;
		gap: 0;
	}

	.site-nav__list li + li {
		border-top: 1px solid var(--c-line);
	}

	.site-nav__list a {
		display: block;
		padding: var(--sp-3) 0;
		font-size: var(--fs-base);
		border-bottom: 0;
	}

	.site-nav__list a:hover,
	.site-nav__list a:focus,
	.site-nav__list .current-menu-item > a,
	.site-nav__list .current_page_item > a {
		border-bottom: 0;
		color: var(--c-gold);
	}

	/*
	 * Panel açıkken şeffaf header kuralları geçersiz kılınır: panelin zemini
	 * krem olduğu için metin de koyu kalmalıdır. Aksi hâlde krem üzerine krem
	 * yazı çıkar ve menü okunmaz olur.
	 */
	.has-transparent-header .site-header:not(.is-scrolled) .site-nav.is-open a {
		color: var(--c-ink);
		text-shadow: none;
	}

	.has-transparent-header .site-header:not(.is-scrolled) .site-nav.is-open a:hover,
	.has-transparent-header .site-header:not(.is-scrolled) .site-nav.is-open a:focus,
	.has-transparent-header .site-header:not(.is-scrolled) .site-nav.is-open .current-menu-item > a {
		color: var(--c-gold);
	}

	/* Menü açıkken header her zaman opak olmalı */
	.has-transparent-header .site-header.nav-open {
		background-color: var(--c-logo-bg);
	}

	.has-transparent-header .site-header.nav-open .site-header__social,
	.has-transparent-header .site-header.nav-open .nav-toggle {
		color: var(--c-ink);
		text-shadow: none;
	}
}


/* ==========================================================================
   ≤ 479.98px — küçük telefon
   ========================================================================== */

@media (max-width: 479.98px) {

	/* Dar ekranda gezinme düğmeleri görselin yanında değil ALTINDA durur;
	   yanda kalsalardı görsele ayrılan genişlik yarıya inerdi. */
	.lightbox {
		flex-wrap: wrap;
		padding: var(--sp-5) var(--sp-2) var(--sp-6);
	}

	.lightbox__figure {
		order: -1;
		flex-basis: 100%;
	}

	.lightbox__img {
		max-height: calc(100vh - 14rem);
	}

	:root {
		--header-h:       68px;
		--header-h-small: 64px;
		--logo-h:         48px;
		--logo-h-small:   44px;
	}

	.site-logo__link {
		padding: 4px;
	}

	.site-logo--footer .site-logo__img {
		height: 80px;
	}

	.site-footer__bottom-inner {
		flex-direction: column;
		align-items: flex-start;
	}
}


/* ==========================================================================
   Yazdırma
   ========================================================================== */

@media print {

	.site-header,
	.site-footer,
	.skip-link,
	.header-sentinel {
		display: none !important;
	}

	body {
		background: #fff;
		color: #000;
		font-size: 12pt;
	}

	a {
		text-decoration: underline;
	}
}