/* Araç Markaları — kart carousel'i */

.vehicle-carousel {
	position: relative;
	margin: 0 0 30px;

	/* Tema renkleri — child theme'den kolayca değiştirilebilir */
	--vc-vurgu:      #d0021b;
	--vc-vurgu-acik: #fdeef0;
	--vc-baslik:     #14161a;
	--vc-metin:      #5c6470;
	--vc-kart:       #ffffff;
	--vc-ikon-zemin: #f1f1f4;
	--vc-radius:     22px;
	--vc-bosluk:     26px;

	/* Kolon sayısı: satır içi stil masaüstü/tablet/mobil değerlerini verir,
	   aşağıdaki medya sorguları hangisinin geçerli olacağını seçer. */
	--vc-kolon:     var(--vc-kolon-masaustu, 3);
	--vc-kolon-tam: var(--vc-kolon-masaustu-tam, 3);
}

/* --- Şerit --- */

.vehicle-carousel .vehicle-cards {
	display: flex;
	gap: var(--vc-bosluk);
	overflow-x: auto;
	overflow-y: hidden;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	scrollbar-width: none;
	-ms-overflow-style: none;
	-webkit-overflow-scrolling: touch;
	/* kart gölgesi kırpılmasın */
	padding: 10px 6px 20px;
	margin: -10px -6px 0;
}

.vehicle-carousel .vehicle-cards::-webkit-scrollbar { display: none; }

.vehicle-carousel .vehicle-cards:focus-visible {
	outline: 2px solid var(--vc-vurgu);
	outline-offset: 2px;
	border-radius: var(--vc-radius);
}

.vehicle-carousel .vehicle-card {
	flex: 0 0 calc((100% - (var(--vc-kolon, 3) - 1) * var(--vc-bosluk)) / var(--vc-kolon, 3));
	scroll-snap-align: start;
}

.vehicle-carousel.is-dragging .vehicle-cards {
	scroll-snap-type: none;
	scroll-behavior: auto;
	cursor: grabbing;
}
.vehicle-carousel.is-dragging .vehicle-card { pointer-events: none; }

/* --- Izgara modu --- */

.vehicle-carousel.is-grid .vehicle-cards {
	display: grid;
	grid-template-columns: repeat(var(--vc-kolon-tam, 3), minmax(0, 1fr));
	overflow: visible;
	padding: 0;
	margin: 0;
}

/* --- Kart --- */

.vehicle-card {
	position: relative;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	padding: 34px 32px 30px;
	background: var(--vc-kart);
	border: 0;
	border-radius: var(--vc-radius);
	color: var(--vc-baslik);
	text-decoration: none;
	box-shadow: 0 2px 10px rgba(20, 22, 26, .05);
	transition: transform .3s ease, box-shadow .3s ease;
}

/* Sağ üst köşe lekesi */
.vehicle-card::after {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	width: 118px;
	height: 118px;
	background: var(--vc-vurgu-acik);
	border-bottom-left-radius: 100%;
	pointer-events: none;
	transition: transform .35s ease;
	transform-origin: top right;
	z-index: 0;
}

.vehicle-card > * { position: relative; z-index: 1; }

.vehicle-card:hover,
.vehicle-card:focus-visible {
	transform: translateY(-6px);
	box-shadow: 0 18px 40px rgba(20, 22, 26, .12);
	color: var(--vc-baslik);
	text-decoration: none;
}

.vehicle-card:hover::after { transform: scale(1.18); }

.vehicle-card:focus-visible {
	outline: 2px solid var(--vc-vurgu);
	outline-offset: 3px;
}

/* İkon karesi */
.vehicle-card .card-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	overflow: hidden;
	width: 88px;
	height: 88px;
	margin-bottom: 30px;
	border-radius: 20px;
	background: var(--vc-ikon-zemin);
	color: var(--vc-vurgu);
	transition: background .3s ease;
}

.vehicle-card:hover .card-icon { background: var(--vc-vurgu-acik); }

.vehicle-card .card-icon svg { width: 38px; height: 38px; }

/* Marka logosu — kırpılmadan kareye oturur.
   !important, temanın img { height: auto } kuralını geçmek için. */
.vehicle-card .card-icon img {
	box-sizing: border-box;
	display: block;
	width: 100% !important;
	height: 100% !important;
	max-width: 100%;
	margin: 0;
	padding: 14px;
	object-fit: contain;
	object-position: center;
}

/* Zeminsiz varyant: [arac_kartlari zemin="hayir"] */
.vehicle-carousel.vc-zeminsiz .card-icon {
	width: auto;
	height: 64px;
	max-width: 170px;
	background: none;
	border-radius: 0;
	justify-content: flex-start;
}

.vehicle-carousel.vc-zeminsiz .card-icon img {
	width: auto !important;
	max-width: 170px;
	padding: 0;
	object-position: left center;
}

.vehicle-carousel.vc-zeminsiz .vehicle-card:hover .card-icon { background: none; }

/* Metin */
.vehicle-card h3 {
	margin: 0 0 16px;
	font-size: 23px;
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: -.02em;
	color: var(--vc-baslik);
}

.vehicle-card p {
	margin: 0 0 34px;
	font-size: 15px;
	line-height: 1.95;
	color: var(--vc-metin);
}

/* Alt satır — çizgisiz, iki uca yaslı */
.vehicle-card .card-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-top: auto;
	font-size: 19px;
	font-weight: 700;
	letter-spacing: -.01em;
	color: var(--vc-vurgu);
}

.vehicle-card .arrow {
	display: inline-flex;
	color: var(--vc-vurgu);
	transition: transform .3s ease;
}

.vehicle-card .arrow svg { width: 26px; height: 26px; }
.vehicle-card:hover .arrow { transform: translateX(6px); }

/* --- Oklar --- */

.vehicle-carousel .vc-nav {
	position: absolute;
	top: calc(50% - 22px);
	z-index: 3;
	display: flex;
	align-items: center;
	justify-content: center;
	-webkit-appearance: none;
	appearance: none;
	box-sizing: border-box;
	width: 44px;
	height: 44px;
	min-width: 0;
	min-height: 0;
	padding: 0;
	margin: 0;
	border: 0;
	border-radius: 50%;
	line-height: 0;
	background: var(--vc-kart);
	color: var(--vc-vurgu);
	box-shadow: 0 6px 20px rgba(20, 22, 26, .14);
	cursor: pointer;
	transition: background .2s ease, color .2s ease, opacity .2s ease;
}

.vehicle-carousel .vc-nav:hover { background: var(--vc-vurgu); color: #fff; }
.vehicle-carousel .vc-prev { left: -20px; }
.vehicle-carousel .vc-next { right: -20px; }

.vehicle-carousel .vc-nav[disabled] {
	opacity: .3;
	cursor: default;
	background: var(--vc-kart);
	color: var(--vc-vurgu);
}

/* --- Noktacıklar --- */

.vehicle-carousel .vc-dots {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin-top: 14px;
	line-height: 0;
}

.vehicle-carousel .vc-dots button {
	-webkit-appearance: none;
	appearance: none;
	box-sizing: border-box;
	flex: 0 0 auto;
	width: 7px;
	height: 7px;
	min-width: 0;
	min-height: 0;
	max-width: none;
	max-height: none;
	padding: 0;
	margin: 0;
	border: 0;
	border-radius: 50%;
	background: #d8dade;
	box-shadow: none;
	font-size: 0;
	line-height: 0;
	letter-spacing: 0;
	text-transform: none;
	cursor: pointer;
	transition: width .25s ease, background .25s ease;
}

.vehicle-carousel .vc-dots button:hover { background: #b9bcc2; }

.vehicle-carousel .vc-dots button[aria-selected="true"] {
	width: 22px;
	border-radius: 4px;
	background: var(--vc-vurgu);
}

/* --- Duyarlı --- */

@media (max-width: 849px) {
	.vehicle-carousel {
		--vc-bosluk: 18px;
		--vc-kolon:     var(--vc-kolon-tablet, 2);
		--vc-kolon-tam: var(--vc-kolon-tablet-tam, 2);
	}
	.vehicle-card { padding: 28px 26px 26px; }
	.vehicle-card .card-icon { width: 76px; height: 76px; margin-bottom: 24px; border-radius: 18px; }
	.vehicle-card .card-icon img { padding: 12px; }
	.vehicle-carousel.vc-zeminsiz .card-icon { width: auto; height: 56px; }
	.vehicle-carousel .vc-prev { left: -8px; }
	.vehicle-carousel .vc-next { right: -8px; }
}

@media (max-width: 549px) {
	.vehicle-carousel {
		--vc-kolon:     var(--vc-kolon-mobil, 1.12); /* 1.12 = sonraki kartın kenarı görünür */
		--vc-kolon-tam: var(--vc-kolon-mobil-tam, 1);
	}
	.vehicle-card h3 { font-size: 21px; }
	.vehicle-card p { margin-bottom: 26px; }
	.vehicle-card .card-footer { font-size: 17px; }
	.vehicle-carousel .vc-nav { display: none; }
}

@media (prefers-reduced-motion: reduce) {
	.vehicle-carousel .vehicle-cards { scroll-behavior: auto; }
	.vehicle-card,
	.vehicle-card::after,
	.vehicle-card .card-icon,
	.vehicle-card .arrow,
	.vehicle-carousel .vc-dots button { transition: none; }
	.vehicle-card:hover { transform: none; }
	.vehicle-card:hover::after { transform: none; }
}
