/* SG Instagram Bölümü – tema (dijitalla) ile uyumlu kaydırmalı akış */
.sgig {
	--sgig-blue: rgb(58, 85, 154);
	--sgig-accent: #e2445c;
	--sgig-gap: 16px;
	--sgig-per-view: 5;
	padding: 20px 0 0;
}

/* Tema bu başlık stillerini yalnızca .blog_area içinde tanımlıyor; aynısını burada uygula. */
.sgig .text_title {
	font-family: Overpass, sans-serif;
	font-size: 22px;
	font-weight: 400;
	color: rgb(119, 119, 119);
}
.sgig .sgig-follow {
	font-family: Overpass, sans-serif;
	font-size: 16px;
	font-weight: 700;
	letter-spacing: .02em;
}

.sgig .small_title { display: flex; align-items: center; gap: 8px; }
.sgig .small_title::before {
	content: "";
	width: 22px;
	height: 22px;
	flex: 0 0 22px;
	border-radius: 7px;
	background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285aeb 90%);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 2h10a5 5 0 0 1 5 5v10a5 5 0 0 1-5 5H7a5 5 0 0 1-5-5V7a5 5 0 0 1 5-5zm5 5a5 5 0 1 0 0 10 5 5 0 0 0 0-10zm0 2a3 3 0 1 1 0 6 3 3 0 0 1 0-6zm5.5-3.2a1.2 1.2 0 1 0 0 2.4 1.2 1.2 0 0 0 0-2.4z'/%3E%3C/svg%3E") center / contain no-repeat;
	        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 2h10a5 5 0 0 1 5 5v10a5 5 0 0 1-5 5H7a5 5 0 0 1-5-5V7a5 5 0 0 1 5-5zm5 5a5 5 0 1 0 0 10 5 5 0 0 0 0-10zm0 2a3 3 0 1 1 0 6 3 3 0 0 1 0-6zm5.5-3.2a1.2 1.2 0 1 0 0 2.4 1.2 1.2 0 0 0 0-2.4z'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* Kaydırıcı */
.sgig-slider { position: relative; }

.sgig #sb_instagram { padding: 0 !important; width: 100% !important; }
.sgig #sb_instagram .sb_instagram_header,
.sgig #sb_instagram #sbi_load,
.sgig #sb_instagram .sbi_follow_btn { display: none !important; }

.sgig #sb_instagram #sbi_images {
	display: flex !important;
	gap: var(--sgig-gap) !important;
	overflow-x: auto;
	overflow-y: hidden;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior-x: contain;
	padding: 4px 2px 16px !important;
	margin: 0 !important;
	width: 100% !important;
	float: none !important;
	grid-template-columns: none !important;
	scrollbar-width: thin;
	scrollbar-color: #c9ced8 transparent;
}
.sgig #sb_instagram #sbi_images::-webkit-scrollbar { height: 6px; }
.sgig #sb_instagram #sbi_images::-webkit-scrollbar-thumb { background: #c9ced8; border-radius: 6px; }
.sgig #sb_instagram #sbi_images::-webkit-scrollbar-track { background: transparent; }

.sgig #sb_instagram .sbi_item {
	flex: 0 0 calc((100% - (var(--sgig-per-view) - 1) * var(--sgig-gap)) / var(--sgig-per-view)) !important;
	width: auto !important;
	max-width: none !important;
	padding: 0 !important;
	margin: 0 !important;
	scroll-snap-align: start;
	display: block !important;
	opacity: 1 !important;
}

.sgig #sb_instagram .sbi_photo_wrap { position: relative; }

.sgig #sb_instagram .sbi_photo {
	display: block !important;
	position: relative;
	height: auto !important;
	aspect-ratio: 4 / 5;
	overflow: hidden;
	border-radius: 10px;
	background-color: #eef1f6 !important;
	background-size: cover !important;
	background-position: center !important;
	box-shadow: 0 6px 18px rgba(34, 34, 34, .10);
	transition: transform .25s ease, box-shadow .25s ease;
}
.sgig #sb_instagram .sbi_photo img {
	position: absolute;
	inset: 0;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	object-fit: cover;
	opacity: 1 !important;
	display: block !important;
}
.sgig #sb_instagram .sbi_photo:hover,
.sgig #sb_instagram .sbi_photo:focus-visible {
	transform: translateY(-3px);
	box-shadow: 0 12px 26px rgba(34, 34, 34, .16);
}

/* Video: ortada yuvarlak oynat düğmesi */
.sgig #sb_instagram .sbi_playbtn {
	position: absolute !important;
	top: 50% !important;
	left: 50% !important;
	width: 56px !important;
	height: 56px !important;
	margin: 0 !important;
	padding: 18px 17px 18px 21px !important;
	transform: translate(-50%, -50%);
	box-sizing: border-box;
	border-radius: 50%;
	background: rgba(255, 255, 255, .92);
	color: #222 !important;
	box-shadow: 0 4px 14px rgba(0, 0, 0, .25);
	z-index: 2;
	display: block !important;
	opacity: 1 !important;
	font-size: 0 !important;
}
.sgig #sb_instagram .sbi_type_video .sbi_photo::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(0, 0, 0, .28), rgba(0, 0, 0, 0) 45%);
	pointer-events: none;
}

/* Kartın altındaki kısa açıklama (JS ile görsel alt metninden) */
.sgig-caption {
	display: flex;
	align-items: flex-start;
	gap: 6px;
	margin-top: 10px;
	font-family: Overpass, sans-serif;
	font-size: 13px;
	line-height: 1.35;
	font-weight: 600;
	color: #444;
	text-transform: uppercase;
	letter-spacing: .01em;
}
.sgig-caption span {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	max-height: 2.7em;
}
.sgig-caption svg { flex: 0 0 14px; margin-top: 2px; color: var(--sgig-accent); }

/* Oklar */
.sgig-nav {
	position: absolute;
	top: calc(50% - 30px);
	z-index: 5;
	width: 46px;
	height: 46px;
	border: 0;
	border-radius: 50%;
	background: #fff;
	color: var(--sgig-blue);
	box-shadow: 0 4px 16px rgba(34, 34, 34, .18);
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: background .2s ease, color .2s ease, opacity .2s ease;
}
.sgig-nav[hidden] { display: none; }
.sgig-nav:hover, .sgig-nav:focus-visible { background: var(--sgig-blue); color: #fff; outline: none; }
.sgig-nav:disabled { opacity: 0; pointer-events: none; }
.sgig-prev { left: -23px; }
.sgig-next { right: -23px; }

@media (max-width: 1199.98px) {
	.sgig { --sgig-per-view: 4; }
}
@media (max-width: 991.98px) {
	.sgig { --sgig-per-view: 3; }
	.sgig-prev { left: 4px; }
	.sgig-next { right: 4px; }
}
@media (max-width: 767.98px) {
	.sgig { --sgig-per-view: 2.3; --sgig-gap: 12px; padding-top: 10px; }
	.sgig .text_title { font-size: 17px; }
	.sgig .tum_blog_btn { margin-top: 16px; }
	.sgig-nav { display: none !important; }
}
@media (max-width: 479.98px) {
	.sgig { --sgig-per-view: 1.6; }
}
@media (prefers-reduced-motion: reduce) {
	.sgig #sb_instagram #sbi_images { scroll-behavior: auto; }
	.sgig #sb_instagram .sbi_photo { transition: none; }
}