/*
 * SC Core — ortak stiller.
 *
 * BU DOSYA TASARIMI DEĞİŞTİRMEZ.
 * Kaynak tasarım dosyalarındaki satır içi (inline) stiller şablonlarda birebir
 * korunmuştur. Burada yalnızca kaynakta satır içi yazılamayan üç şey vardır:
 *   1) <helmet> içindeki global reset
 *   2) style-hover="..." niteliklerinin CSS karşılıkları
 *   3) 1440px tuvalin dar ekranlarda orantılı küçültülmesi
 */

/* ---------------------------------------------------------------------------
 * 1) Global reset — kaynak <helmet> bloğunun birebir karşılığı
 * ------------------------------------------------------------------------ */

html,
body {
	margin: 0;
	padding: 0;
	background: #0a0908;
}

body {
	font-family: 'Jost', sans-serif;
	-webkit-font-smoothing: antialiased;
}

a {
	color: #d8b26a;
	text-decoration: none;
}

a:hover {
	color: #f0d49b;
}

/* Kaynak tasarımda tüm kutular content-box; WP temaları genelde border-box
   uygular. Tuval içinde kaynağın davranışını geri alıyoruz. */
.sc-canvas,
.sc-canvas *,
.sc-canvas *::before,
.sc-canvas *::after {
	box-sizing: content-box;
}

/* ---------------------------------------------------------------------------
 * 2) style-hover karşılıkları
 * ------------------------------------------------------------------------ */

/* style-hover="border-color: #d8b26a" */
.sc-hov-gold-border:hover {
	border-color: #d8b26a;
}

/* style-hover="border-color: #d8b26a; color: #f0d49b" */
.sc-hov-gold-outline:hover {
	border-color: #d8b26a;
	color: #f0d49b;
}

/* style-hover="background: linear-gradient(180deg, #f4e2c0, #d6b686)" */
.sc-hov-gold-fill:hover {
	background: linear-gradient(180deg, #f4e2c0, #d6b686);
}

/* style-hover="border-color: rgba(255,255,255,.35)" */
.sc-hov-line:hover {
	border-color: rgba(255, 255, 255, .35);
}

/* style-hover="border-color: rgba(216,178,106,.4)" */
.sc-hov-card:hover {
	border-color: rgba(216, 178, 106, .4);
}

/* style-hover="border-color: rgba(216,178,106,.55)" */
.sc-hov-row:hover {
	border-color: rgba(216, 178, 106, .55);
}

/* style-hover="color: #f0d49b" */
.sc-hov-gold-text:hover {
	color: #f0d49b;
}

/* style-hover="border-color: rgba(255,255,255,.4)" */
.sc-hov-line-strong:hover {
	border-color: rgba(255, 255, 255, .4);
}

/* style-hover="background: rgba(255,255,255,.03)" — parça listesi satırları */
.sc-hov-track:hover {
	background: rgba(255, 255, 255, .03);
}

/* ---------------------------------------------------------------------------
 * 3) Tuval ve ölçekleme
 *
 * Kaynak tasarım sabit 1440px genişliğinde çizilmiştir. Oranların bozulmaması
 * için tuval yeniden akıtılmaz; dar ekranlarda bütün olarak küçültülür.
 * 900px altında kaynaktaki ayrı mobil markup devreye girer (kaynak: w < 900).
 * ------------------------------------------------------------------------ */

.sc-canvas {
	width: 1440px;
	margin: 0 auto;
	background: #0a0908;
	color: #efeae2;
	overflow: hidden;
}

.sc-canvas-mobile {
	width: 100%;
	max-width: 430px;
	margin: 0 auto;
	background: #0a0908;
	color: #efeae2;
	overflow: hidden;
}

/*
 * NOT: Mobil tuvale ölçekleme UYGULANMAZ ve uygulanmamalıdır.
 *
 * Kaynak mobil düzen zaten akışkandır (`width: 100%; max-width: 430px`) ve
 * 430px altındaki telefonlarda doğru şekilde daralır. Hero metin bloğu gibi
 * `position:absolute; left:0; right:0; padding:0 22px` taşıyan elemanlarda
 * padding kapsayıcı genişlikten ÇIKARILIR (width:auto denklemi gereği),
 * eklenmez — dolayısıyla yatay taşma oluşmaz.
 */

/* Masaüstü / mobil markup anahtarı — kaynaktaki showDesktop / showMobile. */
.sc-view-desktop {
	display: none;
}

.sc-view-mobile {
	display: block;
}

@media (min-width: 900px) {
	.sc-view-desktop {
		display: block;
	}

	.sc-view-mobile {
		display: none;
	}
}

/*
 * 900–1439px arası: tuval orantılı küçülür. --sc-zoom değerini sc-core.js
 * yazar (100vw / 1440). JS çalışmazsa tuval 1440px kalır ve yatay kaydırma
 * olur — tasarım yine bozulmaz.
 */
@media (min-width: 900px) and (max-width: 1439px) {
	.sc-view-desktop {
		zoom: var(--sc-zoom, 1);
	}
}

/* zoom desteklemeyen tarayıcılar için transform yedeği. */
.sc-scale-fallback .sc-view-desktop {
	zoom: normal;
	transform: scale(var(--sc-zoom, 1));
	transform-origin: top left;
}

.sc-scale-fallback .sc-view-desktop-wrap {
	overflow: hidden;
	height: var(--sc-scaled-height, auto);
}

/*
 * Hero tam genişlik (full-bleed).
 *
 * Tuval 1440px'te ortalandığı için daha geniş ekranlarda hero görselinin sol
 * ve sağ kenarı keskin biter. `.sc-hero-bleed` sınıfı hero bölümünü görüntü
 * alanının tamamına yayar; içerik (menü, başlık) şablondaki 1440px'lik iç
 * sarmalayıcıda hizalı kalır. 1440px ve altında hiçbir şey değişmez.
 */
@media (min-width: 1441px) {
	body {
		overflow-x: hidden;
	}

	.sc-canvas {
		overflow: visible;
	}

	.sc-view-desktop .sc-hero-bleed {
		width: 100vw;
		margin-left: calc((1440px - 100vw) / 2);
	}
}

/* Mobil tuval 430px'te ortalanır; daha geniş telefonlarda aynı sorun oluşur. */
@media (min-width: 431px) and (max-width: 899px) {
	body {
		overflow-x: hidden;
	}

	.sc-canvas-mobile {
		overflow: visible;
	}

	.sc-view-mobile .sc-hero-bleed {
		width: 100vw;
		margin-left: calc((430px - 100vw) / 2);
	}
}

/* ---------------------------------------------------------------------------
 * 4) Görsel yuvaları
 * ------------------------------------------------------------------------ */

.sc-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

/* Placeholder'lar SVG olduğu için `cover` yerine `contain` daha okunaklı. */
.sc-img--placeholder {
	object-fit: cover;
	background: #100e0c;
}

/* ---------------------------------------------------------------------------
 * 5) Video lightbox
 *
 * .sc-lightbox sınıflı bağlantılar (data-yt="videoID") sayfadan ayrılmadan
 * gömülü YouTube oynatıcısı açar. Kapatma: ✕, ESC veya perdeye tıklama.
 * ------------------------------------------------------------------------ */

.sc-lb {
	position: fixed;
	inset: 0;
	z-index: 9999;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
	background: rgba(5, 4, 3, .94);
}

.sc-lb-box {
	position: relative;
	width: min(1080px, 100%);
}

.sc-lb-video {
	aspect-ratio: 16 / 9;
	width: 100%;
	background: #000;
	border: 1px solid rgba(216, 178, 106, .35);
	border-radius: 6px;
	overflow: hidden;
	box-shadow: 0 30px 90px rgba(0, 0, 0, .7);
}

.sc-lb-video iframe {
	width: 100%;
	height: 100%;
	border: 0;
	display: block;
}

.sc-lb-close {
	position: absolute;
	right: 0;
	top: -44px;
	appearance: none;
	background: none;
	border: 0;
	padding: 8px;
	color: #efeae2;
	font-size: 24px;
	line-height: 1;
	cursor: pointer;
	font-family: inherit;
}

.sc-lb-close:hover {
	color: #f0d49b;
}

.sc-lb-fallback {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	margin-top: 14px;
	font-family: 'Jost', sans-serif;
	font-size: 11px;
	letter-spacing: 2px;
	font-weight: 300;
	color: #a49b8e;
}

.sc-lb-fallback:hover {
	color: #f0d49b;
}

/* ---------------------------------------------------------------------------
 * 6) Erişilebilirlik
 * ------------------------------------------------------------------------ */

/*
 * `hidden` niteliği, satır içi `display` bildirimini yenemez (satır içi stil
 * her zaman kazanır). Mobil menü satır içi `display:flex` taşıdığı için
 * kapalıyken de görünüyordu. !important ile düzeltiyoruz.
 */
[hidden] {
	display: none !important;
}

.sc-sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.sc-canvas a:focus-visible,
.sc-canvas-mobile a:focus-visible,
.sc-canvas button:focus-visible,
.sc-canvas-mobile button:focus-visible {
	outline: 2px solid #d8b26a;
	outline-offset: 2px;
}