@font-face {
    font-family: 'Banjax Notched';
    src: url('/logofont/BanjaxNotched-Regular.woff2') format('woff2'),
        url('/logofont/BanjaxNotched-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Banjax Notched';
    src: url('/logofont/BanjaxNotched-Bold.woff2') format('woff2'),
        url('/logofont/BanjaxNotched-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}






/* Ana Kapsayıcı (Resim gibi davranan koruyucu kalkan) */
.html-logo {
    font-family: 'Banjax Notched';
	text-transform: uppercase;
    display: inline-flex;
    flex-direction: column;
    line-height: 1; /* İsim ve sloganın arasındaki gereksiz boşluğu alır */
    user-select: none; /* Logo metninin kullanıcı tarafından yanlışlıkla seçilmesini/mavi olmasını engeller */
}

/* İsim Kısmı (Yan yana duruş) */
.logo-core {
    display: flex;
    align-items: baseline; /* Harflerin alt çizgilerini kusursuz hizalar */
}

.logo-first {
    color: #F3DF0C; /* Sarı renk (İsterseniz #f5c518 gibi daha tok bir sarı da kullanabilirsiniz) */
    font-weight: 700;
    margin-right: 4px; /* Gökhan ve EGE arasındaki mesafe. Bitişik isterseniz 0 yapın */
}

.logo-last {
    color: #231F20; /* Siyah */
    font-weight: 900; /* Daha kalın bir duruş */
    text-transform: uppercase; /* Her zaman büyük harf kalmasını garantiler */
}

/* Slogan Kısmı (%50 büyüklük ve Sağa Yaslanma) */
.logo-slogan {
    font-size: 0.35em; /* Ana logonun (font-size) tam olarak %50'si büyüklüğünde olur */
    align-self: flex-start; /* Sloganı sağa iter */
    color: #6c6c70; /* Çok bağırmaması için koyu gri */
    margin-top: 0.2em; /* İsim ile arasına yine oransal (büyüdükçe artan) bir boşluk bırakır */
    font-weight: normal;
}
.logo-slogan.center {
	align-self:center;
	text-align:center;
}
.logo-slogan.end {
	align-self:flex-end;
}

@media (prefers-color-scheme: dark) {
	.logo-first {
	    color: #f5c518;
	}
	.logo-last {
		color: #c0c0c0;
	}
	.logo-slogan {
		color: #b9b9b9;
	}
}
.html-logo.logo-inverted .logo-first {
}
.html-logo.logo-inverted .logo-last {
	color: #fff;
}
.html-logo.logo-inverted .logo-slogan {
	color: #fff;
}