body {
		font-family: "Poppins", sans-serif;
		background: #fff;
		color: #000;
		line-height: 1.6;
	}

	.hero {
		position: relative;
		width: 100%;
		overflow: hidden;
	}

	.hero-img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		margin-top:60px;
	}

	.cards-wrapper {
		margin-top: 10px;
	}

	.cards {
		display: flex;
		gap: 10px;
		width: 98.3vw;
		height: 700px;
		transition: all 0.3s ease;
	}

	.card {
		position: relative;
		flex: 1;
		overflow: hidden;
		transition: all 0.3s ease;
	}

	.card img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		display: block;
		transition: all 0.3s ease;
	}

	.card-text {
		position: absolute;
		bottom: 20px;
		left: 20px;
		color: white;
		z-index: 2;
	}

	.card-text h2 {
		font-size: 20px;
		font-weight:600;
		margin-bottom: 15px;
		line-height: 1.3;
	}

	.card-text a {
		display: inline-block;
		background: white;
		color: black;
		padding: 10px 15px;
		font-size: 14px;
		font-weight: bold;
		text-decoration: none;
		transition: background 0.3s ease;
	}

	.card.black {
		background: black;
	}

	.card.blue {
		background: #0b8cd7;
	}

	.cards:hover .card {
		flex: 1;
	}

	.cards .card:hover {
		flex: 2;
		z-index: 3;
	}

	.cards:not(:hover) .card:first-child {
		flex: 2;
	}

	.buttondizilis {
		display:flex; 
		align-items:center; 
		gap:30px;
	}

	.buttonileri {
		font-size:16px;
		font-weight:700;
	}

	.slider-box { 
		position:relative;
		margin:80px auto 0;
		height: 44.6vw;
		overflow:hidden
	}
	
	.slider-box .slide {
		position:absolute;
		inset:0;
		display:none
	}
	
	.slider-box .slide.active{
		display:block
	}
	
	.slider-box img,.slider-box video{
		width:100%;
		display:block;
	}
	
	.slider-box button.nav{
		position:absolute;
		top:50%;
		transform:translateY(-50%);
		width:46px;
		height:46px;
		border:none;
		border-radius:50%;
		background:rgba(0,0,0,.45);
		color:#fff;
		font-size:28px;
		cursor:pointer;
		z-index:10
	}
	
	.slider-box button.nav:hover{
		background:rgba(0,0,0,.75)
	}
	
	.slider-box .prev{
		left:10px
	}
	
	.slider-box .next{
		right:10px
	}

	.section {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 30px 0px;
	}
	.text {
		flex: 1;
		max-width: 600px;
		margin-left: 86px
	}

	.text h2 {
		font-size: 28px;
		font-weight: bold;
		margin-bottom: 20px;
	}

	.text p {
		font-size:18px;
		text-align: center;
		margin-bottom: 20px;
		color: #333;
	}

	.textt {
		flex: 1;
		max-width: 40vw;
		margin-right: 5vw;
	}

	.textt h2 {
		font-size: 28px;
		font-weight: bold;
		margin-bottom: 20px;
	}

	.textt p {
		text-align: center;
		margin-bottom: 0px;
		color: #333;
	}

	.video {
		flex: 1;
		position: relative;
		padding-bottom: 560px;
		height: 0;
	}

	.video iframe,
	.video video {
		position: absolute;
		top: -30px;
		left: 0;
		width: 49vw;
		border: none;
		cursor:pointer;
	}

	.gorsel img {
		width: 49vw;
	}

	@media(max-width:768px){
		.slider-desktop {
			display:none
		}
		
		.slider-mobile {
			display:block
		}

		.slider-box {
			margin:65px auto 0;
			border-radius:0
			width: 100%;
			height: 110vw;
		}

		.cards {
			display: flex;
			flex-direction: column;
			gap: 10px;
			transition: none !important;
			width: 100%;
			height: 1100px;
		}

		.card {
			width: 100%;
			height: 500px;
		}

		.section {
			padding: 30px 20px;
			flex-direction: column !important;
			align-items: center !important;
		}

		.text {
			margin-left: 0px;
		}

		.textt {
			max-width: 100%;
			margin-right:0;
		}

		.textt p {
			margin-bottom: 40px;
		}

		.video {
			width: 100%;
			padding-bottom: 56.25%;
		}

		.video iframe, .video video {
			width: 100%;
			height: 190px;
		}

		.gorsel img {
			width: 100%;
		}

		.cards:hover .card {
			flex: 1;
		}

		.cards .card:hover {
			flex: 1;
			z-index: 1;
		}

		.cards:not(:hover) .card:first-child {
			flex: 1;
		}

		.section:first-of-type {
			display: flex;
			flex-direction: column-reverse;
			padding: 0 15px;
		}

		.gorsel img {
			width: 100%;
			height: auto;
		}

		.text p {
			font-size: 15px;
		}

		.text {
			margin-top: 0px;
		}  

		.textt p {
			margin-bottom: 0px;
		}
	}

	@media(min-width:769px){
		.slider-desktop {
			display:block
		}
		
		.slider-mobile {
			display:none
		}
	}