/*
 * FileUSB Business — üst menü bağlantıları
 *
 * YERLEŞİM
 *   [logo]  (Ücretsiz Resim Linki)  ....  Özellikler · Paketler · Business ·
 *           Nasıl Çalışır · Rehberler · Destek · Blog · TR/EN · [düğmeler]
 *
 * Menü kapsayıcısı (.fuv-header nav) `justify-content:flex-end` ile sağa
 * yaslıdır. `.fusb-nav-lead` üzerindeki `margin-right:auto` resim linkini
 * logonun yanına, SOLA iter; menünün geri kalanı sağda kalır.
 *
 * Marka mavisi #075cef. Ücretsiz Resim Linki bilerek turuncu: menüdeki tek
 * sıcak renk olduğu için mavi öğelerin arasında hemen fark edilir.
 */

/*
 * Menü aralığı 26px'ten 18px'e çekildi. Ölçüldü: yeni üç bağlantıyla birlikte
 * 26px aralık 1240px kapsayıcıyı taşırıyor ve "Nasıl Çalışır" ile giriş
 * düğmelerini alt satıra kırıyordu.
 */
.fuv-header nav {
	gap: 16px;
}

/*
 * Blog bağlantısı devreye girdiğinde (blog sayfası oluşturulduğunda) menüye
 * bir öğe daha katılır. Ölçüldü: o durumda 1240px kapsayıcı taşıyor. Resim
 * linkinin dolgusu yalnız o hâlde bir tık daralır; blog yokken geniş kalır.
 */
.fuv-header nav:has(.fusb-nav-blog) .fusb-nav-free {
	padding: 9px 15px;
	font-size: 12.5px;
	gap: 7px;
}

/* Mevcut menü öğeleri alt satıra kırılmasın. */
.fuv-header nav > a {
	white-space: nowrap;
}

/*
 * Giriş/Ücretsiz Başla düğmeleri daralmasın. Esnek kapsayıcıda varsayılan
 * `flex-shrink:1` olduğu için menü doluyken bu kutu sıkışıp düğme metinlerini
 * iki satıra kırıyordu (canlıda ölçüldü: yükseklik 46px → 65px). Toplam
 * genişlikte yer var; sorun yalnız daralmaydı.
 */
.fuv-header .fuv-nav-actions {
	flex: none;
}

.fuv-header .fuv-nav-actions .fuv-button {
	white-space: nowrap;
}

.fuv-header nav > .fusb-nav-lead {
	display: flex;
	align-items: center;
	margin-right: auto;   /* soldaki boşluğa iter */
	flex: none;
}

/* ---------- Ücretsiz Resim Linki (vurgulu, geniş) ---------- */

.fuv-header nav .fusb-nav-free {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 9px;
	padding: 11px 19px;
	border: 1px solid rgba(255, 255, 255, .45);
	border-radius: 999px;
	background: linear-gradient(135deg, #ff9522 0%, #fb6514 52%, #f04e23 100%);
	color: #fff;
	font-size: 13.5px;
	font-weight: 800;
	line-height: 1.3;
	letter-spacing: .005em;
	text-decoration: none;
	white-space: nowrap;
	box-shadow: 0 6px 18px rgba(240, 90, 30, .36);
	overflow: hidden;
	transition: transform .15s, box-shadow .15s, filter .15s;
}

.fuv-header nav .fusb-nav-free:hover {
	color: #fff;
	text-decoration: none;
	transform: translateY(-1px);
	filter: saturate(1.08);
	box-shadow: 0 9px 26px rgba(240, 90, 30, .46);
}

.fuv-header nav .fusb-nav-free:active {
	transform: translateY(0);
}

.fusb-nav-free-ikon {
	flex: none;
	opacity: .95;
}

.fusb-nav-free-rozet {
	flex: none;
	padding: 3px 8px;
	border-radius: 999px;
	background: rgba(255, 255, 255, .24);
	font-size: 10px;
	font-weight: 800;
	letter-spacing: .08em;
}

/*
 * Üzerinden geçen ince parlama. Dikkat çeker ama metni örtmez; `overflow:hidden`
 * sayesinde düğmenin dışına taşmaz.
 */
.fuv-header nav .fusb-nav-free::after {
	content: "";
	position: absolute;
	top: -60%;
	left: -75%;
	width: 45%;
	height: 220%;
	background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .42), transparent);
	transform: rotate(18deg);
	animation: fusb-nav-parla 4.5s ease-in-out infinite;
	pointer-events: none;
}

@keyframes fusb-nav-parla {
	0%, 62% { left: -75%; }
	88%     { left: 125%; }
	100%    { left: 125%; }
}

/* ---------- Business (menü listesinin içinde) ---------- */

/*
 * Komşu menü öğeleriyle aynı ölçüde durur ama marka mavisi ve kalın ağırlıkla
 * ayrışır: menünün parçasıdır, reklam değildir.
 */
.fuv-header nav .fusb-nav-biz {
	color: #075cef;
	font-size: 13px;
	font-weight: 800;
	text-decoration: none;
	white-space: nowrap;
	transition: color .15s;
}

.fuv-header nav .fusb-nav-biz:hover {
	color: #0848b8;
	text-decoration: none;
}

.fuv-header nav .fusb-nav-biz.is-aktif {
	color: #0848b8;
	text-decoration: underline;
	text-underline-offset: 5px;
}

/* ---------- Blog ---------- */

.fuv-header nav .fusb-nav-blog {
	color: #283b59;
	font-size: 13px;
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
	transition: color .15s;
}

.fuv-header nav .fusb-nav-blog:hover {
	color: #075cef;
	text-decoration: none;
}

.fuv-header nav .fusb-nav-blog.is-aktif {
	color: #075cef;
}

/* ---------- Dar masaüstü: menü sıkışmasın ---------- */

@media (max-width: 1340px) {
	.fusb-nav-free-rozet { display: none; }
}

@media (max-width: 1240px) {
	.fuv-header nav { gap: 13px; }
	.fuv-header nav .fusb-nav-free { padding: 9px 14px; font-size: 12.5px; gap: 7px; }
}

@media (max-width: 1080px) {
	.fusb-nav-free-metin { display: none; }   /* turuncu simge düğmesi kalır */
	.fuv-header nav .fusb-nav-free { padding: 9px 12px; }
}

/* ---------- Mobil: menü açılır sütun olur ---------- */

@media (max-width: 900px) {
	.fuv-header nav { gap: 8px; }

	.fuv-header nav > .fusb-nav-lead {
		width: 100%;
		margin: 0 0 6px;
		padding-bottom: 10px;
		border-bottom: 1px solid #e8eff8;
	}

	.fuv-header nav .fusb-nav-free {
		width: 100%;
		justify-content: center;
		padding: 13px 16px;
		font-size: 14.5px;
	}

	.fusb-nav-free-metin { display: inline; }
	.fusb-nav-free-rozet { display: inline-block; }

	.fuv-header nav .fusb-nav-biz,
	.fuv-header nav .fusb-nav-blog {
		padding: 10px;
		font-size: 15px;
	}
}

/* =========================================================================
 * BLOG: OKUMA KOLONU VE TİPOGRAFİ
 *
 * Tema blog içeriğini saran `.fusb-container--text` kapsayıcısına genişlik
 * sınırı koymuyor (ölçüldü: `max-width: none`). Sonuç: metin sayfanın sol
 * kenarına yapışıyor, başlık ortada kalıyor ve ikisi hizasız görünüyordu.
 *
 * Burada ortalanmış, okunabilir genişlikte tek bir kolon kurulur ve yazı
 * tipografisi düzenlenir. Tema dosyalarına dokunulmaz; kurallar yalnız blog
 * gövde sınıflarıyla (`body.single-post`, `body.blog`) sınırlıdır, bu yüzden
 * sitenin diğer sayfalarını etkilemez ve yeni yazılara kendiliğinden uygulanır.
 * ====================================================================== */

body.single-post .fusb-entry,
body.blog .fusb-list {
	width: min(720px, calc(100% - 48px));
	margin-inline: auto;
}

/* ---------- Yazı başlığı ---------- */

/*
 * Başlığın kendisine genişlik vermek işe yaramıyor: üst kapsayıcısı
 * `max-width: 586.5px` ile sınırlı olduğu için başlık gövde kolonundan dar
 * kalıp kayıyordu (ölçüldü: başlık sol 707px, gövde sol 593px). Bu yüzden
 * sınırlama kapsayıcıda kaldırılır ve kolon orada kurulur.
 */
body.single-post .fusb-pagehead .fusb-container--text,
body.blog .fusb-pagehead .fusb-container--text {
	max-width: none;
	width: min(720px, calc(100% - 48px));
	margin-inline: auto;
	padding-inline: 0;
}

body.single-post .fusb-pagehead__title,
body.blog .fusb-pagehead__title {
	width: auto;
	margin-inline: 0;
	text-align: left;
	font-size: clamp(31px, 4.4vw, 45px);
	line-height: 1.16;
	letter-spacing: -.032em;
	font-weight: 800;
	color: #102341;
	text-wrap: balance;
}

body.single-post .fusb-pagehead,
body.blog .fusb-pagehead {
	padding-block: 56px 10px;
}

/* ---------- Gövde metni ---------- */

body.single-post .fusb-entry {
	font-size: 18px;
	line-height: 1.78;
	color: #26364f;
}

/* Kolon zaten dar; paragrafın ayrıca kısıtlanması sağ kenarı tırtıklı bırakıyordu. */
body.single-post .fusb-entry p,
body.single-post .fusb-entry li {
	max-width: none;
}

body.single-post .fusb-entry p {
	margin: 0 0 1.35em;
	font-size: inherit;
	line-height: inherit;
	color: inherit;
}

/* Giriş paragrafı: yazının özeti olduğu için bir tık öne çıkar. */
body.single-post .fusb-entry > p:first-of-type {
	font-size: 20px;
	line-height: 1.7;
	color: #1b2b44;
	margin-bottom: 1.6em;
}

/* ---------- Ara başlıklar ---------- */

body.single-post .fusb-entry h2 {
	margin: 2.3em 0 .6em;
	font-size: 28px;
	line-height: 1.25;
	letter-spacing: -.022em;
	font-weight: 800;
	color: #102341;
	text-wrap: balance;
}

body.single-post .fusb-entry h3 {
	margin: 1.9em 0 .5em;
	font-size: 21px;
	line-height: 1.3;
	font-weight: 700;
	color: #102341;
}

/* ---------- Listeler ---------- */

body.single-post .fusb-entry ul,
body.single-post .fusb-entry ol {
	margin: 0 0 1.5em;
	padding-left: 1.35em;
}

body.single-post .fusb-entry li {
	margin-bottom: .55em;
	padding-left: .2em;
}

body.single-post .fusb-entry li::marker {
	color: #075cef;
	font-weight: 700;
}

/* ---------- Bağlantı ve vurgu ---------- */

body.single-post .fusb-entry a {
	color: #0754d7;
	text-decoration: underline;
	text-decoration-thickness: 1.5px;
	text-underline-offset: 3px;
	text-decoration-color: rgba(7, 92, 239, .35);
	transition: text-decoration-color .15s, color .15s;
}

body.single-post .fusb-entry a:hover {
	color: #0848b8;
	text-decoration-color: currentColor;
}

body.single-post .fusb-entry strong {
	color: #102341;
	font-weight: 700;
}

/* ---------- Mobil ---------- */

@media (max-width: 760px) {
	body.single-post .fusb-entry,
	body.blog .fusb-list,
	body.single-post .fusb-pagehead .fusb-container--text,
	body.blog .fusb-pagehead .fusb-container--text {
		width: calc(100% - 36px);
	}

	body.single-post .fusb-pagehead { padding-block: 34px 6px; }
	body.single-post .fusb-entry { font-size: 17px; line-height: 1.74; }
	body.single-post .fusb-entry > p:first-of-type { font-size: 18.5px; }
	body.single-post .fusb-entry h2 { font-size: 24px; margin-top: 2em; }
	body.single-post .fusb-entry h3 { font-size: 19px; }
}

/* ---------- Blog listesi: kartlar ---------- */

body.blog .fusb-list__item {
	padding: 30px 0;
	border-bottom: 1px solid #e6edf8;
}

body.blog .fusb-list__item:last-child {
	border-bottom: 0;
}

body.blog .fusb-list__title {
	margin: 0 0 10px;
	font-size: 25px;
	line-height: 1.28;
	letter-spacing: -.022em;
	font-weight: 800;
	text-wrap: balance;
}

body.blog .fusb-list__title a {
	color: #102341;
	text-decoration: none;
}

body.blog .fusb-list__title a:hover {
	color: #075cef;
}

body.blog .fusb-list__excerpt {
	max-width: none;
	margin: 0;
	font-size: 16.5px;
	line-height: 1.72;
	color: #4e5f79;
}

/* ---------- Blog: liste kapak görselleri ---------- */

/*
 * Liste kapağı bilerek dar tutuldu. Kapak görseli yazının başlığını zaten
 * içeriyor; kartın tamamını kaplaması hem gereksiz tekrar hem de listeyi
 * okunmaz derecede uzun yapıyordu (canlıda ölçüldü).
 */
.fusb-liste-gorsel {
	display: block;
	width: 100%;
	max-width: 420px;
	margin: 0 0 18px;
	border-radius: 12px;
	overflow: hidden;
	line-height: 0;
	transition: box-shadow .18s, transform .18s;
}

.fusb-liste-gorsel .fusb-liste-img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 1200 / 630;
	object-fit: cover;
}

.fusb-liste-gorsel:hover {
	transform: translateY(-2px);
	box-shadow: 0 12px 30px rgba(16, 35, 65, .14);
}

/* ---------- Hareket azaltma tercihi ---------- */

@media (prefers-reduced-motion: reduce) {
	.fuv-header nav .fusb-nav-free::after { animation: none; display: none; }
	.fuv-header nav .fusb-nav-free,
	.fuv-header nav .fusb-nav-biz,
	.fuv-header nav .fusb-nav-blog,
	.fusb-liste-gorsel { transition: none; }
	.fuv-header nav .fusb-nav-free:hover { transform: none; }
	.fusb-liste-gorsel:hover { transform: none; }
}