* { box-sizing: border-box; }

		.container { width: 100%; margin: 0 auto; padding: 0 15px; }
		@media (min-width: 576px) { .container { max-width: 540px; } }
		@media (min-width: 768px) { .container { max-width: 720px; } }
		@media (min-width: 992px) { .container { max-width: 960px; } }
		@media (min-width: 1200px) { .container { max-width: 1140px; } }

		/* ===== TEMEL SAYFA ===== */
		html {
			width: 100%;
			height: 100%;
		}

		body {
			padding: 0;
			margin: 0;
			width: 100%;
			min-height: 100vh;
			font-family: "Noto Sans", sans-serif;
			font-weight: bold;
			background-color: #0b0d10;
			background-image: url('../img/bg.png');
			background-repeat: no-repeat;
			background-position: center top;
			background-attachment: fixed;
			background-size: cover;
			-webkit-background-size: cover;
			-moz-background-size: cover;
			-o-background-size: cover;
			overflow-x: hidden;
		}

		/* ===== SABİT YAN MENÜ (Masaüstü) ===== */
		.fixed-menu {
			position: fixed;
			top: clamp(65px, 8.5vh, 95px); /* Çok yukarıda durmaması için aşağı indirildi */
			bottom: clamp(25px, 3.5vh, 45px);
			left: 4.5%;
			z-index: 999;
			pointer-events: none;
			display: flex;
			flex-direction: column;
			justify-content: space-between; /* Üsttekileri yukarıda, Discord'u en altta tutar */
		}

		/* Üstteki 4 buton grubu (Ana Sayfa, Kayıt Ol, Kurulum, Instagram) */
		.fixed-menu .top-nav {
			display: flex;
			flex-direction: column;
			pointer-events: auto;
			margin-left: 28px; /* Butonları biraz sağa kaydırır */
		}

		.fixed-menu ul {
			list-style-type: none;
			margin: 0;
			padding: 0;
			display: flex;
			flex-direction: column;
			gap: 12px;
		}

		.fixed-menu a {
			display: block;
			transition: transform 0.25s ease, filter 0.25s ease;
		}

		.fixed-menu a:hover {
			transform: scale(1.06);
			filter: drop-shadow(0 6px 16px rgba(255, 255, 255, 0.45));
		}

		/* Üst buton boyutları */
		.fixed-menu .top-nav img {
			width: 270px;
			height: auto;
			max-width: 100%;
			display: block;
		}

		/* Discord butonu - en altta ve çok minimal büyütülmüş */
		.fixed-menu .bottom-nav {
			pointer-events: auto;
			margin-top: 40px;
		}

		.fixed-menu .bottom-nav img {
			width: 330px; /* Minimal büyütme (315px -> 330px) */
			height: auto;
			max-width: 100%;
			display: block;
		}

		/* Düşük ekran yükseklikleri için buton ölçekleme */
		@media (max-height: 850px) {
			.fixed-menu {
				top: clamp(40px, 5.5vh, 60px);
			}
			.fixed-menu .top-nav img {
				width: 235px;
			}
			.fixed-menu .bottom-nav img {
				width: 290px;
			}
			.fixed-menu ul {
				gap: 8px;
			}
			.fixed-menu .bottom-nav {
				margin-top: 25px;
			}
		}

		@media (max-height: 700px) {
			.fixed-menu {
				top: 25px;
			}
			.fixed-menu .top-nav img {
				width: 205px;
			}
			.fixed-menu .bottom-nav img {
				width: 250px;
			}
			.fixed-menu ul {
				gap: 6px;
			}
			.fixed-menu .bottom-nav {
				margin-top: 15px;
			}
		}

		/* ===== MERKEZ GALERİ ===== */
		.main-content-wrapper {
			position: relative;
			z-index: 10;
			text-align: center;
			padding-left: 0;
			padding-right: 0;
			padding-bottom: 80px;
		}

		.image-gallery {
			display: flex;
			flex-wrap: wrap;
			justify-content: center;
			gap: 20px;
		}

		/* Görsel boyutu - orijinal 850px */
		.gallery-image {
			max-width: 850px;
			width: 100%;
			height: auto;
		}

		/* ===== RESPONSIVE - MOBİL UYUM ===== */
		@media (max-width: 1365px) {
			.m-d-n {
				display: none !important;
			}
		}

		@media (min-width: 1366px) {
			.f-d-n {
				display: none !important;
			}
		}

		/* Mobil alt menü */
		.mobil_menu {
			background: rgba(0, 0, 0, 0.75);
			backdrop-filter: blur(8px);
			-webkit-backdrop-filter: blur(8px);
			width: 100%;
			max-width: 100%;
			z-index: 999;
			position: fixed;
			bottom: 0px;
			left: 0;
			border-top: 1px solid rgba(255, 255, 255, 0.1);
		}

		.mobil_menu ul {
			width: 100%;
			list-style: none;
			margin: 0 !important;
			padding: 8px 10px !important;
			display: flex;
			align-items: center;
			justify-content: space-around;
		}

		.mobil_menu ul li {
			flex: 1;
			text-align: center;
			padding: 0 3px;
		}

		.mobil_menu ul li img {
			max-height: 38px;
			width: auto;
			max-width: 100%;
			object-fit: contain;
			transition: transform 0.2s ease;
		}

		.mobil_menu ul li a:active img {
			transform: scale(0.94);
		}
/* Dar ekranlarda posterleri sığdır ve sabit menü için alan bırak. */
@media (max-width: 767px) {
	body { background-attachment: scroll; }
	.main-content-wrapper { padding-bottom: calc(90px + env(safe-area-inset-bottom)); }
	.image-gallery { gap: 12px; }
	.mobil_menu { padding-bottom: env(safe-area-inset-bottom); }
	.mobil_menu ul { padding: 6px 4px !important; }
	.mobil_menu ul li { padding: 0 2px; }
	.mobil_menu ul li img { max-height: 32px; }
}