/* ==========================================================================
   Öz Yasin Vinç — Hero Slider v2
   Palet: dövme siyahı / çelik grisi / kurumsal kırmızı. Mavi kullanılmaz.
   ========================================================================== */

.oyv-hero{
	--ink:#07080A;
	--steel:#141619;
	--smoke:#9CA1A7;
	--chalk:#FFFFFF;
	--accent:#D8232A;
	--accent-hi:#F0343C;

	--hd:var(--oyv-hd, 84vh);
	--hm:var(--oyv-hm, 86vh);
	--ov:var(--oyv-ov, .80);
	--dur:var(--oyv-dur, 7000ms);
	--pad-x:clamp(22px, 4.5vw, 72px);

	position:relative;
	display:block;
	width:100%;
	/* Yükseklik en baştan sabit — yenilemede sıçrama olmaz */
	height:clamp(560px, var(--hd), 900px);
	min-height:560px;
	overflow:hidden;
	isolation:isolate;
	background:var(--ink);
	color:var(--chalk);
	font-family:inherit;
	contain:layout paint;
}
.oyv-hero *{box-sizing:border-box;}
.oyv-hero[style*="--oyv-accent"]{--accent:var(--oyv-accent);}

/* Tema buton stillerini sıfırla ----------------------------------------- */
.oyv-hero button{
	-webkit-appearance:none !important; appearance:none !important;
	background:none !important; background-image:none !important;
	border:0 !important; border-radius:0 !important;
	box-shadow:none !important; text-shadow:none !important;
	margin:0 !important; padding:0 !important;
	font:inherit !important; color:inherit !important;
	min-width:0 !important; min-height:0 !important;
	line-height:normal !important; letter-spacing:normal !important;
	text-transform:none !important;
}
.oyv-hero button:hover,
.oyv-hero button:focus,
.oyv-hero button:active{background:none !important; box-shadow:none !important;}

/* Sahne ve slaytlar ------------------------------------------------------ */
.oyv-stage{position:absolute; inset:0;}

.oyv-slide{
	position:absolute; inset:0;
	opacity:0; visibility:hidden;
	transition:opacity .9s ease, visibility .9s;
}
/* İlk slayt sunucudan aktif gelir — JS beklenmeden görünür */
.oyv-slide.is-active{opacity:1; visibility:visible;}

.oyv-bg{
	position:absolute; inset:0;
	background-color:var(--steel);
	background-size:cover;
	background-position:center;
	background-repeat:no-repeat;
	transform:scale(1.04);
	filter:grayscale(.12) contrast(1.05) brightness(.98);
}
.oyv-hero.has-ken .oyv-slide.is-active .oyv-bg{
	animation:oyvKen 12s cubic-bezier(.2,.4,.3,1) forwards;
}
@keyframes oyvKen{
	from{transform:scale(1.10);}
	to{transform:scale(1) translateY(-1%);}
}

/* Dökme demir dokusu */
.oyv-tex{
	position:absolute; inset:0; z-index:2;
	opacity:.26; mix-blend-mode:multiply;
	background-image:repeating-linear-gradient(
		135deg,
		rgba(0,0,0,.5) 0px, rgba(0,0,0,.5) 1px,
		transparent 1px, transparent 4px);
}

/* Karartma — metnin bulunduğu tarafa ağırlık verir */
.oyv-scrim{
	position:absolute; inset:0; z-index:2;
	background:
		linear-gradient(90deg,
			rgba(7,8,10,var(--ov)) 0%,
			rgba(7,8,10,calc(var(--ov) * .80)) 40%,
			rgba(7,8,10,calc(var(--ov) * .26)) 74%,
			rgba(7,8,10,calc(var(--ov) * .58)) 100%),
		linear-gradient(0deg, rgba(7,8,10,.84) 0%, rgba(7,8,10,0) 44%);
}
/* Ürün soldaysa metin sağa geçer, karartma da yön değiştirir */
.oyv-slide.prod-left .oyv-scrim{
	background:
		linear-gradient(270deg,
			rgba(7,8,10,var(--ov)) 0%,
			rgba(7,8,10,calc(var(--ov) * .80)) 40%,
			rgba(7,8,10,calc(var(--ov) * .30)) 74%,
			rgba(7,8,10,calc(var(--ov) * .62)) 100%),
		linear-gradient(0deg, rgba(7,8,10,.84) 0%, rgba(7,8,10,0) 44%);
}

/* Yerleşim --------------------------------------------------------------- */
.oyv-inner{
	position:relative; z-index:4;
	height:100%;
	max-width:1320px;
	margin:0 auto;
	padding:0 var(--pad-x) 0 calc(var(--pad-x) + 52px);
	display:flex; align-items:center;
}
.oyv-copy{max-width:720px; width:100%;}

/* İki kolon — ürün görseli varken */
.oyv-slide.has-product .oyv-inner{
	display:grid;
	grid-template-columns:minmax(0, 1.05fr) minmax(0, .95fr);
	gap:clamp(24px, 4vw, 64px);
	align-items:center;
}
.oyv-slide.has-product .oyv-copy{max-width:none;}

.oyv-slide.prod-left .oyv-product{order:1;}
.oyv-slide.prod-left .oyv-copy{order:2;}
.oyv-slide.prod-right .oyv-copy{order:1;}
.oyv-slide.prod-right .oyv-product{order:2;}

/* Ürün görseli ----------------------------------------------------------- */
.oyv-product{
	position:relative;
	display:flex; align-items:center; justify-content:center;
	height:100%;
	min-width:0;
}

.oyv-product .oyv-product__img{
	position:relative; z-index:3;
	display:block;
	width:auto; height:auto;
	max-width:100%;
	max-height:64%;
	object-fit:contain;
	filter:drop-shadow(0 34px 46px rgba(0,0,0,.62)) drop-shadow(0 3px 10px rgba(0,0,0,.4));
	opacity:0; transform:translateY(28px) scale(.965);
}
.oyv-slide.size-small  .oyv-product__img{max-height:50%;}
.oyv-slide.size-medium .oyv-product__img{max-height:64%;}
.oyv-slide.size-large  .oyv-product__img{max-height:78%;}

/* Arkadaki kırmızı ışık */
.oyv-product__halo{
	position:absolute; z-index:1;
	width:78%; padding-bottom:78%;
	border-radius:50%;
	background:radial-gradient(circle, rgba(216,35,42,.30) 0%, rgba(216,35,42,.10) 44%, rgba(216,35,42,0) 70%);
	filter:blur(8px);
	opacity:0;
}
/* Çelik plaka — ürünü zemine oturtur */
.oyv-product__plate{
	position:absolute; z-index:2;
	left:50%; bottom:11%;
	width:62%; height:2px;
	transform:translateX(-50%) scaleX(0);
	transform-origin:center;
	background:linear-gradient(90deg, transparent, var(--accent) 22%, var(--accent) 78%, transparent);
	box-shadow:0 0 22px rgba(216,35,42,.5);
}

.oyv-hero.has-float .oyv-slide.is-active .oyv-product__img{
	animation:
		oyvProdIn .95s cubic-bezier(.2,.8,.25,1) .42s forwards,
		oyvFloat 6.5s ease-in-out 1.5s infinite;
}
.oyv-hero:not(.has-float) .oyv-slide.is-active .oyv-product__img{
	animation:oyvProdIn .95s cubic-bezier(.2,.8,.25,1) .42s forwards;
}
.oyv-slide.is-active .oyv-product__halo{animation:oyvHalo 1.4s ease .35s forwards;}
.oyv-slide.is-active .oyv-product__plate{animation:oyvPlate .9s cubic-bezier(.2,.8,.25,1) .75s forwards;}

@keyframes oyvProdIn{to{opacity:1; transform:translateY(0) scale(1);}}
@keyframes oyvHalo{to{opacity:1;}}
@keyframes oyvPlate{to{transform:translateX(-50%) scaleX(1);}}
@keyframes oyvFloat{
	0%,100%{transform:translateY(0);}
	50%{transform:translateY(-13px);}
}

/* Üst etiket ------------------------------------------------------------- */
.oyv-hero .oyv-eyebrow{
	display:inline-flex; align-items:center; gap:12px;
	font-size:11px; font-weight:700;
	letter-spacing:3.2px; text-transform:uppercase;
	color:var(--smoke) !important;
	margin:0 0 26px;
	opacity:0; transform:translateY(14px);
}
.oyv-eyebrow i{width:24px; height:2px; flex:0 0 24px; background:var(--accent);}

/* Başlık ----------------------------------------------------------------- */
.oyv-hero h1.oyv-title,
.oyv-hero h2.oyv-title{
	margin:0 !important; padding:0 !important;
	font-size:clamp(34px, 4.9vw, 70px) !important;
	font-weight:800 !important;
	line-height:1.03 !important;
	letter-spacing:-1.6px !important;
	color:var(--chalk) !important;
	text-shadow:0 4px 34px rgba(0,0,0,.6);
	opacity:0; transform:translateY(20px);
}
.oyv-slide.has-product h1.oyv-title,
.oyv-slide.has-product h2.oyv-title{
	font-size:clamp(31px, 3.9vw, 56px) !important;
	letter-spacing:-1.2px !important;
}

.oyv-rule{
	display:block;
	width:84px; height:4px;
	margin:28px 0 22px;
	background:var(--accent);
	transform-origin:left; transform:scaleX(0);
}

.oyv-hero p.oyv-sub{
	margin:0 !important; padding:0 !important;
	font-size:clamp(15px, 1.45vw, 19px) !important;
	font-weight:400 !important;
	line-height:1.66 !important;
	letter-spacing:.2px !important;
	color:#CDD1D5 !important;
	max-width:42ch;
	text-shadow:0 2px 18px rgba(0,0,0,.55);
	opacity:0; transform:translateY(20px);
}

/* Butonlar --------------------------------------------------------------- */
.oyv-actions{
	display:flex; align-items:center; flex-wrap:wrap; gap:13px;
	margin-top:38px;
	opacity:0; transform:translateY(20px);
}
.oyv-hero a.oyv-btn,
.oyv-hero a.oyv-btn:link,
.oyv-hero a.oyv-btn:visited{
	position:relative;
	display:inline-flex !important; align-items:center; gap:11px;
	padding:17px 32px !important;
	font-size:13px !important; font-weight:700 !important;
	letter-spacing:1.6px !important; text-transform:uppercase;
	text-decoration:none !important;
	border-radius:0 !important;
	transition:transform .4s cubic-bezier(.2,.8,.25,1), box-shadow .4s ease, background-color .4s ease, border-color .4s ease;
	-webkit-tap-highlight-color:transparent;
}
.oyv-btn span,.oyv-btn svg{position:relative; z-index:2;}
.oyv-btn svg{flex:0 0 auto; transition:transform .4s ease;}
.oyv-btn:hover svg{transform:translateX(4px);}

.oyv-hero a.oyv-btn--solid,
.oyv-hero a.oyv-btn--solid:link,
.oyv-hero a.oyv-btn--solid:visited{
	color:#fff !important;
	background:var(--accent) !important;
	border:1px solid var(--accent) !important;
	box-shadow:0 14px 32px rgba(0,0,0,.45);
}
.oyv-hero a.oyv-btn--solid:hover{
	transform:translateY(-3px);
	background:var(--accent-hi) !important;
	border-color:var(--accent-hi) !important;
	box-shadow:0 22px 42px rgba(0,0,0,.55);
}
.oyv-hero a.oyv-btn--ghost,
.oyv-hero a.oyv-btn--ghost:link,
.oyv-hero a.oyv-btn--ghost:visited{
	color:#fff !important;
	background:rgba(255,255,255,.04) !important;
	border:1px solid rgba(255,255,255,.26) !important;
	-webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
}
.oyv-hero a.oyv-btn--ghost:hover{
	transform:translateY(-3px);
	background:rgba(255,255,255,.11) !important;
	border-color:rgba(255,255,255,.55) !important;
}

/* Metin giriş sıralaması -------------------------------------------------- */
.oyv-slide.is-active .oyv-eyebrow{animation:oyvIn .75s cubic-bezier(.2,.8,.25,1) .10s forwards;}
.oyv-slide.is-active .oyv-title{animation:oyvIn .85s cubic-bezier(.2,.8,.25,1) .24s forwards;}
.oyv-slide.is-active .oyv-rule{animation:oyvRule .65s cubic-bezier(.2,.8,.25,1) .58s forwards;}
.oyv-slide.is-active .oyv-sub{animation:oyvIn .85s cubic-bezier(.2,.8,.25,1) .40s forwards;}
.oyv-slide.is-active .oyv-actions{animation:oyvIn .85s cubic-bezier(.2,.8,.25,1) .54s forwards;}
@keyframes oyvIn{to{opacity:1; transform:translateY(0);}}
@keyframes oyvRule{to{transform:scaleX(1);}}

/* Sol dikey gösterge rayı ------------------------------------------------- */
.oyv-rail{
	position:absolute; z-index:6;
	left:0; top:0; bottom:0;
	width:52px;
	display:flex; align-items:center; justify-content:center;
	border-right:1px solid rgba(255,255,255,.08);
	background:linear-gradient(180deg, rgba(7,8,10,.5), rgba(7,8,10,.14) 50%, rgba(7,8,10,.5));
	pointer-events:none;
}
.oyv-dots{
	display:flex; flex-direction:column; align-items:flex-end; gap:14px;
	pointer-events:auto;
}
.oyv-hero button.oyv-dot{
	display:flex !important; align-items:center; justify-content:flex-end;
	width:24px !important; height:14px !important;
	cursor:pointer;
}
.oyv-hero button.oyv-dot::before{
	content:"";
	width:13px; height:2px;
	background:rgba(255,255,255,.26);
	transition:width .45s cubic-bezier(.2,.8,.25,1), background-color .35s ease;
}
.oyv-hero button.oyv-dot:hover::before{width:20px; background:rgba(255,255,255,.6);}
.oyv-hero button.oyv-dot.is-active::before{width:24px; background:var(--accent);}

/* Oklar + sayaç ----------------------------------------------------------- */
.oyv-nav{
	position:absolute; z-index:6;
	right:var(--pad-x); bottom:56px;
	display:flex; align-items:center; gap:5px;
	padding:6px;
	border:1px solid rgba(255,255,255,.15);
	background:rgba(7,8,10,.42);
	-webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px);
}
.oyv-hero button.oyv-arrow{
	width:44px !important; height:44px !important;
	display:flex !important; align-items:center; justify-content:center;
	cursor:pointer;
	background:rgba(255,255,255,.04) !important;
	transition:background-color .3s ease, transform .3s cubic-bezier(.2,.8,.25,1);
}
.oyv-hero button.oyv-arrow:hover{background:var(--accent) !important;}
.oyv-hero button.oyv-arrow:active{transform:scale(.94);}

.oyv-count{
	display:flex; align-items:center; gap:8px;
	padding:0 12px;
	font-size:12px; font-weight:600; letter-spacing:1.6px;
	color:rgba(255,255,255,.45) !important;
	font-variant-numeric:tabular-nums;
}
.oyv-count b{color:#fff !important; font-size:15px; font-weight:800;}
.oyv-count i{width:12px; height:1px; background:rgba(255,255,255,.28);}

/* Alt ilerleme ------------------------------------------------------------ */
.oyv-progress{
	position:absolute; left:0; right:0; bottom:0; z-index:6;
	height:3px; background:rgba(255,255,255,.07);
}
.oyv-progress > span{display:block; height:100%; width:0; background:var(--accent);}
.oyv-hero.is-running .oyv-progress > span{animation:oyvBar var(--dur) linear forwards;}
.oyv-hero.is-paused .oyv-progress > span{animation-play-state:paused;}
@keyframes oyvBar{from{width:0;}to{width:100%;}}

/* Tek slayt: ray ve kontroller gizlenir */
.oyv-hero.is-single .oyv-inner{padding-left:var(--pad-x);}

/* Odak görünürlüğü -------------------------------------------------------- */
.oyv-hero a.oyv-btn:focus-visible,
.oyv-hero button.oyv-dot:focus-visible,
.oyv-hero button.oyv-arrow:focus-visible{
	outline:2px solid var(--accent) !important; outline-offset:3px;
}

/* Tablet ------------------------------------------------------------------ */
@media (max-width:1100px){
	.oyv-slide.has-product .oyv-inner{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);}
	.oyv-slide.size-large .oyv-product__img{max-height:66%;}
}

@media (max-width:900px){
	.oyv-rail{width:44px;}
	.oyv-inner{padding-left:calc(var(--pad-x) + 44px);}
	.oyv-nav{bottom:46px;}
}

/* Mobil ------------------------------------------------------------------- */
@media (max-width:767px){
	.oyv-hero{
		height:clamp(520px, var(--hm), 760px);
		min-height:520px;
	}

	.oyv-scrim,
	.oyv-slide.prod-left .oyv-scrim{
		background:linear-gradient(180deg,
			rgba(7,8,10,.50) 0%,
			rgba(7,8,10,.78) 44%,
			rgba(7,8,10,.95) 100%);
	}
	.oyv-tex{opacity:.18;}

	.oyv-inner,
	.oyv-slide.has-product .oyv-inner{
		display:flex; flex-direction:column;
		justify-content:flex-end;
		padding:26px 22px 100px;
		gap:0;
	}
	.oyv-copy{order:2 !important; max-width:100%;}
	.oyv-product{order:1 !important; height:auto; flex:0 1 auto; margin-bottom:6px;}

	.oyv-product .oyv-product__img,
	.oyv-slide.size-small .oyv-product__img,
	.oyv-slide.size-medium .oyv-product__img,
	.oyv-slide.size-large .oyv-product__img{
		max-height:min(30vh, 230px);
		max-width:80%;
		margin:0 auto;
		filter:drop-shadow(0 18px 26px rgba(0,0,0,.6));
	}
	.oyv-product__halo{width:64%; padding-bottom:64%;}
	.oyv-product__plate{width:48%; bottom:2%;}

	.oyv-hero .oyv-eyebrow{font-size:9.5px; letter-spacing:2.2px; margin-bottom:14px;}
	.oyv-eyebrow i{width:16px; flex:0 0 16px;}

	.oyv-hero h1.oyv-title,
	.oyv-hero h2.oyv-title,
	.oyv-slide.has-product h1.oyv-title,
	.oyv-slide.has-product h2.oyv-title{
		font-size:28px !important;
		line-height:1.1 !important;
		letter-spacing:-.7px !important;
	}

	.oyv-rule{width:52px; height:3px; margin:16px 0 14px;}
	.oyv-hero p.oyv-sub{font-size:14px !important; line-height:1.56 !important; max-width:100%;}

	.oyv-actions{margin-top:24px; gap:9px; width:100%;}
	.oyv-hero a.oyv-btn{
		padding:14px 18px !important;
		font-size:11.5px !important; letter-spacing:1px !important;
		flex:1 1 138px; justify-content:center;
	}

	/* Ray yataya döner */
	.oyv-rail{
		left:22px; right:22px; top:auto; bottom:30px;
		width:auto; height:auto;
		border-right:0; background:none;
		justify-content:flex-start;
	}
	.oyv-dots{flex-direction:row; align-items:center; gap:8px;}
	.oyv-hero button.oyv-dot{width:26px !important; height:12px !important; justify-content:flex-start;}
	.oyv-hero button.oyv-dot::before{width:17px;}
	.oyv-hero button.oyv-dot:hover::before{width:23px;}
	.oyv-hero button.oyv-dot.is-active::before{width:26px;}

	.oyv-nav{display:none;}
}

@media (max-width:420px){
	.oyv-product .oyv-product__img,
	.oyv-slide.size-small .oyv-product__img,
	.oyv-slide.size-medium .oyv-product__img,
	.oyv-slide.size-large .oyv-product__img{max-height:min(24vh, 175px);}
	.oyv-hero h1.oyv-title,
	.oyv-hero h2.oyv-title{font-size:25px !important;}
}

/* Hareket azaltma --------------------------------------------------------- */
@media (prefers-reduced-motion:reduce){
	.oyv-hero.has-ken .oyv-slide.is-active .oyv-bg{animation:none; transform:scale(1);}
	.oyv-eyebrow,.oyv-title,.oyv-sub,.oyv-actions{opacity:1 !important; transform:none !important; animation:none !important;}
	.oyv-rule{transform:scaleX(1) !important; animation:none !important;}
	.oyv-product__img{opacity:1 !important; transform:none !important; animation:none !important;}
	.oyv-product__halo{opacity:1 !important; animation:none !important;}
	.oyv-product__plate{transform:translateX(-50%) scaleX(1) !important; animation:none !important;}
	.oyv-hero.is-running .oyv-progress > span{animation:none; width:100%;}
	.oyv-slide,.oyv-btn,.oyv-arrow{transition:none !important;}
}