/* ══════════════════════════════════════════════════════════
   Özen Mermer — ozen.css (otomatik üretildi, ELLE DÜZENLEME)
   Kaynak: build/gen-assets.mjs + build/ozen-ek.css
   Tilux custom.css satır 1..9505 (yalnızca silver skin atıldı: ~50 KB)
   ══════════════════════════════════════════════════════════ */
/* ----------------------------------------------------------------------------------------
* Author        : Awaiken
* Template Name : Tilux - Tiles Marble & Flooring HTML Template
* File          : CSS File
* Version       : 1.0
* ---------------------------------------------------------------------------------------- */
/* INDEX
----------------------------------------------------------------------------------------
01. Global Variables
02. General css
03. Header css
04. Hero css
05. About Us css
06. Our Collection css
07. Why Choose Us css
08. Our Products css
09. Interactive Process css
10. Our Features css
11. CTA Box css
12. Our Partners css
13. Our Testimonials css
14. Our Blog css
15. Footer css
16. About Us Page css
17. Events Page css
18. Event Single css
19. Blog Archive css
20. Blog Single css
21. Team Page css
22. Team Single css
23. Collection Page css
24. Products Page css
25. Export Page css
26. Pricing Page css
27. Testimonials Page css
28. Image Gallery css
29. Video Gallery css
30. FAQ's Page css
31. Catalogue Page css
32.	Contact Us Page css
33. 404 Error Page css
34. Responsive css
35. Home - Version 2 css
36. Home - Version 3 css
-------------------------------------------------------------------------------------- */

/************************************/
/*** 	 01. Global Variables	  ***/
/************************************/

:root{
	--primary-color				: #1D1D1D;
	--secondary-color			: #FFFFFF;
	--bg-color					: #F7F7F7;
	--text-color				: #575757;
	--accent-color				: #6D1731;
	--accent-secondary-color	: #D5B471;
	--white-color				: #FFFFFF;
	--divider-color				: #1D1D1D14;
	--dark-divider-color		: #FFFFFF14;
	--error-color				: rgb(230, 87, 87);
	--default-font				: "Inter", sans-serif;
	--accent-font				: 'ClashGrotesk-Variable';
}

/************************************/
/*** 	   02. General css		  ***/
/************************************/

html,
body{
	width: 100%;
	overflow-x: clip;
}

body{
	font-family: var(--default-font);
	font-size: 16px;
	font-weight: 400;
	line-height: 1em;
	color: var(--text-color);
	background: var(--bg-color);
}

::-webkit-scrollbar-track{
	background-color: var(--primary-color);
	border-left: 1px solid var(--primary-color);
}

::-webkit-scrollbar{
	width: 7px;
	background-color: var(--accent-color);
}

::-webkit-scrollbar-thumb{
	background: var(--accent-color);
}

::selection{
	color: var(--white-color);
	background-color: var(--accent-color);
	filter: invert(1);
}

p{
	line-height: 1.6em;
	margin-bottom: 1.5em;
}

h1,
h2,
h3,
h4,
h5,
h6{
    font-family: var(--accent-font);
	font-weight: 500;
	line-height: 1.2em;
	color: var(--primary-color);
	margin :0;
}

figure{
	margin: 0;
}

img{
	max-width: 100%;
}

a{
	text-decoration: none;
}

a:hover{
	text-decoration: none;
	outline: 0;
}

a:focus{
	text-decoration: none;
	outline: 0;
}

.container{
	max-width: 1300px;
}

.container,
.container-fluid,
.container-lg,
.container-md,
.container-sm,
.container-xl,
.container-xxl{
    padding-right: 15px;
    padding-left: 15px;
}

.image-anime{
	position: relative;
	overflow: hidden;
}

.image-anime:after{
	content: "";
	position: absolute;
    width: 200%;
    height: 0%;
    left: 50%;
    top: 50%;
    background-color: rgba(255,255,255,.3);
    transform: translate(-50%,-50%) rotate(-45deg);
    z-index: 1;
}

.image-anime:hover:after{
    height: 250%;
    transition: all 600ms linear;
    background-color: transparent;
}

.reveal{
	position: relative;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    visibility: hidden;
    overflow: hidden;
}

.reveal img{
    height: 100%;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -webkit-transform-origin: left;
    transform-origin: left;
}

.row{
    margin-right: -15px;
    margin-left: -15px;
}

.row > *{
	padding-right: 15px;
	padding-left: 15px;
}

.row.no-gutters{
    margin-right: 0px;
    margin-left: 0px;
}

.row.no-gutters > *{
    padding-right: 0px;
    padding-left: 0px;
}

.btn-default{
	position: relative;
	display: inline-block;
	font-size: 16px;
	font-weight: 600;
	line-height: 1em;
	text-transform: capitalize;
	background: var(--accent-color);
	color: var(--white-color);
	border: none;
	border-radius: 100px;
	padding: 18px 56px 18px 25px;
	overflow: hidden;
	transition: all 0.4s ease-in-out;
	z-index: 1;
}

.btn-default::before{
	content: '';
	position: absolute;
    top: 50%;
    right: 6px;
    width: 40px;
    height: 40px;
	background-color: var(--accent-secondary-color);
    background-image: url('/assets/images/arrow-white.svg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 14px auto;
	border-radius: 50%;
    transform: translateY(-50%);
	transition: all 0.4s ease-in-out;
}

.btn-default:hover::before{
    transform: translateY(-50%) rotate(45deg);
}

.btn-default::after{ 
	content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 0;
    height: 100%;
    background: var(--primary-color);
    z-index: -1;
    transition: all 0.4s ease-in-out;
}

.btn-default:hover::after{
	right: auto;
	left: 0;
    width: 100%;
}

.btn-default.btn-highlighted:hover{
	color: var(--primary-color);
}

.btn-default.btn-highlighted:hover:before{
	background-color: var(--accent-color);
}

.btn-default.btn-highlighted::after{
	background: var(--white-color);
}

.readmore-btn{
	position: relative;
	display: inline-block;
	color: var(--white-color);
	font-weight: 600;
	line-height: normal;
	text-transform: capitalize;
	padding-right: 22px;
}

.readmore-btn::before{
	content: '';
    position: absolute;
    top: 50%;
    right: 0;
	width: 12px;
	height: 12px;
	transform: translateY(-50%);
	background-image: url('/assets/images/arrow-white.svg');
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
    transition: all 0.4s ease-in-out;
}

.readmore-btn:hover::before{
	transform: translateY(-50%) rotate(45deg);
}

.preloader{
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1000;
	background: var(--primary-color);
	display: flex;
	align-items: center;
	justify-content: center;
}
.loading{
	height: 100px;
	position: relative;
	width: 100px;
	border-radius: 100%;
}

.loading{
	border: 1px solid transparent;
	border-color: transparent var(--white-color) transparent var(--white-color);
	animation: rotate-loading 1.5s linear 0s infinite normal;
	transform-origin: 50% 50%;
}

.loading-container:hover .loading,
.loading-container .loading{
	transition: all 0.5s ease-in-out;
}

#loading-icon{
	position: absolute;
	top: 50%;
	left: 50%;
	max-width: 66px;
	transform: translate(-50%, -50%);
}

@keyframes rotate-loading{
	0%{
		transform: rotate(0deg);
	}
	100%{
		transform: rotate(360deg);
	}
}

.dark-section{
	background-color: var(--primary-color);
	background-image: url('/assets/images/dark-section-bg-image-1.png');
	background-repeat: no-repeat;
	background-position: top center;
	background-size: cover;
}

.section-row{
	margin-bottom: 80px;
}

.section-row .section-title{
	margin-bottom: 0; 
}

.section-row .section-title.section-title-center{
	width: 100%;
	max-width: 700px;
	margin: 0 auto;
	text-align: center;
}

.section-btn{
	text-align: right;
}

.section-content-btn .section-btn{
	margin-top: 30px;
	text-align: left;
}

.section-title-content p{
	margin-bottom: 20px;
}

.section-title-content p:last-child{
	margin-bottom: 0;	
}

.section-title{
	margin-bottom: 40px;
}

.section-title .section-sub-title{
	position: relative;
	display: inline-block;
	font-size: 14px;
	font-weight: 500;
	text-transform: capitalize;
	line-height: 1em;
	color: var(--primary-color);
	border: 1px solid var(--divider-color);
	border-radius: 40px;
	padding: 8px 20px 8px 35px;
    margin-bottom: 15px;
}

.section-title .section-sub-title::before{
	content: '';
    position: absolute;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
    background: var(--accent-secondary-color);
	border-radius: 50%;
    width: 5px;
    height: 5px;
}

.section-title h1{
	font-size: 60px;
	font-weight: 500;
    line-height: 1.1em;
	margin-bottom: 0;
}

.section-title h2{
	font-size: 48px;
	font-weight: 500;
    line-height: 1.1em;
	margin-bottom: 0;
}

.section-title p{
	margin-top: 20px;
	margin-bottom: 0;
}

.dark-section .section-title .section-sub-title{
	border-color: var(--dark-divider-color);
}

.dark-section .section-title .section-sub-title,
.dark-section .section-title h1,
.dark-section .section-title h2,
.dark-section .section-title p,
.dark-section .section-title-content p{
	color: var(--white-color);
}

/************************************/
/**** 	    03. Header css		 ****/
/************************************/

header.main-header{
	position: absolute;
	top: 30px;
	left: 15px;
	right: 15px;
	z-index: 100;
}

header.main-header .header-sticky{
	position: relative;
	max-width: 1300px;
	top: 0;
	background: var(--white-color);
	border-radius: 100px;
	margin: 0 auto;
	z-index: 100;
}

header.main-header .header-sticky.hide{
	transform: translateY(-100%);
	transition: transform 0.3s ease-in-out;
}

header.main-header .header-sticky.active{
	position: fixed;
	top: 30px;
	left: 15px;
	right: 15px;
    transform: translateY(0);
	background: var(--white-color);
	border-radius: 100px;
}

.navbar{
	padding: 15px 0;
	align-items: center;
}

.navbar-brand{
	padding: 0;
	margin: 0;
}

.main-menu .nav-menu-wrapper{
	flex: 1;
	text-align: center;
	margin: 0 1.042vw;
}

.main-menu .nav-menu-wrapper > ul{
	align-items: center;
	display: inline-flex;
}

.main-menu ul li{
	margin: 0 5px;
	position: relative;
}

.main-menu ul li a{
	font-size: 16px;
	font-weight: 600;
	line-height: 1.2em;
	padding: 12px 10px !important;
	color: var(--primary-color);
	background: transparent;
	border-radius: 0px;
	text-transform: capitalize;
	transition: all 0.3s ease-in-out;
}

.main-menu ul li.submenu > a:after{
	content: '\f107';
	font-family: 'FontAwesome';
	font-weight: 900;
	font-size: 14px;
	margin-left: 8px;
}

.main-menu ul li a:hover,
.main-menu ul li a:focus{
	color: var(--accent-color);
}

.main-menu ul ul{
	visibility: hidden;
	opacity: 0;
	transform: scale(1,0.8);
	transform-origin: top;
	padding: 0;
	margin: 0;
	list-style: none;
	width: 235px;
	border-radius: 4px;
	position: absolute;
	left: 0;
	top: 100%;
	background: var(--accent-color);
	transition: all 0.3s ease-in-out;
	text-align: left;
}

.main-menu ul li.submenu:first-child ul{
    width: 235px;
}

.main-menu ul ul ul{
	left: 100%;
	top: 0;
	text-align: left;
}

.main-menu ul li:hover > ul{
	visibility: visible;
	opacity: 1;
	transform: scale(1,1);
    padding: 5px 0;
}

.main-menu ul li.submenu ul li.submenu > a:after{
    content: '\f105';
    float: right;
}

.main-menu ul ul li{
	margin: 0;
	padding: 0;
}

.main-menu ul ul li a{
	color: var(--white-color);
	padding: 8px 20px !important;
	transition: all 0.3s ease-in-out;
}

.main-menu ul ul li a:hover,
.main-menu ul ul li a:focus{
	color: var(--accent-secondary-color);
	background-color: transparent;
	padding: 8px 20px 8px 23px !important;
}

.main-menu ul li.highlighted-menu{
    display: none;
}

.responsive-menu,
.navbar-toggle{
	display: none;
}

.responsive-menu{
	position: relative;
	top: 0;
}

.slicknav_btn{
	background: var(--accent-color);
	padding: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	margin: 0;
	border-radius: 6px;
}

.slicknav_icon .slicknav_icon-bar{
	display: block;
	width: 100%;
	height: 3px;
	width: 22px;
	background-color: var(--white-color);
	border-radius: 6px;
	margin: 4px auto !important;
	transition: all 0.1s ease-in-out;
}

.slicknav_icon .slicknav_icon-bar:first-child{
	margin-top: 0 !important;
}

.slicknav_icon .slicknav_icon-bar:last-child{
	margin-bottom: 0 !important;
}

.navbar-toggle a.slicknav_btn.slicknav_open .slicknav_icon span.slicknav_icon-bar:nth-child(1){
    transform: rotate(-45deg) translate(-5px, 5px);
}

.navbar-toggle a.slicknav_btn.slicknav_open .slicknav_icon span.slicknav_icon-bar:nth-child(2){
    opacity: 0;
}

.navbar-toggle a.slicknav_btn.slicknav_open .slicknav_icon span.slicknav_icon-bar:nth-child(3){
    transform: rotate(45deg) translate(-5px, -5px);
}

.slicknav_menu{
	position: absolute;
    width: 100%;
	padding: 0;
	background: var(--accent-color);
}

.slicknav_menu ul{
	margin: 5px 0;
}

.slicknav_menu ul ul{
	margin: 0;
}

.slicknav_nav .slicknav_row,
.slicknav_nav li a{
	position: relative;
	font-size: 16px;
	font-weight: 600;
	text-transform: capitalize;
	padding: 7px 20px;
	color: var(--white-color);
	line-height: normal;
	margin: 0;
	border-radius: 0 !important;
	transition: all 0.3s ease-in-out;
}

.slicknav_nav a:hover,
.slicknav_nav a:focus,
.slicknav_nav .slicknav_row:hover{
	background-color: transparent;
	color: var(--accent-secondary-color);
}

.slicknav_menu ul ul li a{
    padding: 7px 20px 7px 30px;
}

.slicknav_arrow{
	font-size: 0 !important;
}

.slicknav_arrow:after{
	content: '\f107';
	position: absolute;
	font-family: 'FontAwesome';
	font-weight: 900;
	font-size: 12px;
	margin-left: 8px;
	color: var(--white-color);
	right: 15px;
	top: 50%;
	transform: translateY(-50%);
	transition: all 0.3s ease-out;
}

.slicknav_open > a .slicknav_arrow:after{
    transform: translateY(-50%) rotate(-180deg);
	color: var(--accent-secondary-color);
}

.hero .container{
    position: relative;
    z-index: 2;
}

.hero-content .section-title .section-sub-title{
	background: var(--dark-divider-color);
	backdrop-filter: blur(50px);
	-webkit-backdrop-filter: blur(50px);
	border: none;
	padding: 12px 24px 12px 40px;
}

.hero-content .section-title .section-sub-title::before{
	left: 24px;
}

.satisfy-client-images{
	display: flex;
	align-items: center;
}

.satisfy-client-image{
	position: relative;
    display: inline-block;
    margin-left: -16px;
	border: 1px solid var(--white-color);
	border-radius: 50%;
	overflow: hidden;
	z-index: 1;
}

.satisfy-client-image:first-child{
	margin: 0;
}

.satisfy-client-image figure{
	display: block;
}

.satisfy-client-image figure img{
	width: 100%;
	max-width: 50px;
	border-radius: 50%;
}

.satisfy-client-image.add-more{
	width: 52px;
	height: 52px;
	background-color: var(--accent-color);
	display: flex;
	justify-content: center;
	align-items: center;
	transition: all 0.3s ease-in-out;
}

.satisfy-client-image.add-more i{
	font-size: 20px;
	color: var(--white-color);
}

.satisfy-client-image.add-more h3{
	color: var(--white-color);
	font-size: 16px;
	line-height: 1em;
}

.satisfy-client-content p{
	color: var(--white-color);
	margin: 0;
}

.hero-client-box .satisfy-client-image figure img{
	max-width: 44px;
}

.hero-client-box .satisfy-client-content{
	max-width: 163px;
}

/************************************/
/*** 	   05.  About Us css	  ***/
/************************************/

.about-us{
	background: url('/assets/images/section-bg-1.png') no-repeat;
	background-position: bottom right;
	background-size: auto;
	padding: 120px 0;
}

.about-us-image-box{
	display: flex;
	flex-wrap: wrap;
	align-items: end;
	margin-right: 15px;
}

.about-us-image-box-1{
	position: relative;
	width: 79%;
}

.about-us-image-box-2{
	position: relative;
	width: 21%;
	padding-bottom: 90px;
	z-index: 1;
}

.about-us-image figure{
	display: block;
	border-radius: 4px;
}

.about-us-image figure img{
	width: 100%;
	object-fit: cover;
	border-radius: 4px;
}

.about-us-image-box-1 .about-us-image figure img{
	aspect-ratio: 1 / 1.44;
}

.about-us-image-box-2 .about-us-image figure{
	margin-left: -236px;
	border: 6px solid var(--bg-color);
	border-radius: 12px;
}

.about-us-image-box-2 .about-us-image figure img{
	aspect-ratio: 1 / 0.745;
}

.about-us-image-box-1 .contact-us-circle{
	position: absolute;
	top: 60px;
	right: 0;
	transform: translateX(50%);
	z-index: 1;
}

.about-us-image-box-1 .contact-us-circle a{
	border: 6px solid var(--white-color);
}

.contact-us-circle a{
	display: inline-block;
	background: var(--dark-divider-color);
	backdrop-filter: blur(50px);
	-webkit-backdrop-filter: blur(50px);
    border-radius: 50%;
}

.contact-us-circle a img{
	width: 100%;
    max-width: 130px;
    border-radius: 50%;
    animation: infiniterotate 20s infinite linear;
}

@keyframes infiniterotate{
	from{
		transform: rotate(0deg);
    }
    to{
		transform: rotate(360deg);
    }
}

.contact-us-circle a img:hover{
    animation-play-state: paused;
}

.about-us-body{
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
	border-top: 1px solid var(--divider-color);
	padding-top: 40px;
}

.about-us-body-content{
	width: calc(100% - 240px);
	align-content: center;
}

/************************************/
/***    06.  Our Collection css	  ***/
/************************************/

.our-collection{
	padding: 120px 0;
}

.collection-item{
	position: relative;
	min-height: 430px;
	height: calc(100% - 30px);
	border-radius: 4px;
	margin-bottom: 30px;
	padding: 40px;
	overflow: hidden;
}

.collection-item-image{
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.collection-item-image a{
	display: block;
	height: 100%;
}

.collection-item-image a figure{
	position: relative;
	display: block;
	height: 100%;
	overflow: hidden;
}

.collection-item-image a figure::before{
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(180deg, transparent 50%, rgba(29, 29, 29, 0.90) 90%);
	z-index: 1;
}

.collection-item-image a figure img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: all 0.6s ease-in-out;
}

.collection-item:hover .collection-item-image a figure img{
	transform: scale(1.06);
}

.collection-item-body{
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 30px;
}

.collection-item-btn{
	position: relative;
	visibility: hidden;
	opacity: 0;
	transform: scale(0);
	margin-left: auto;
	z-index: 1;
	transition: all 0.4s ease-in-out;
}

.collection-item:hover .collection-item-btn{
	visibility: visible;
	opacity: 1;
	transform: scale(1);
}

.collection-item-btn a{
	width: 50px;
	height: 50px;
	background: var(--accent-color);
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	transition: all 0.4s ease-in-out;
}

.collection-item-btn a:hover{
	background: var(--primary-color);
}

.collection-item-btn a img{
	width: 100%;
	max-width: 16px;
	transition: all 0.4s ease-in-out;
}

.collection-item-btn a:hover img{
	transform: rotate(45deg);
}

.collection-item-content{
	position: relative;
	z-index: 1;
}

.collection-item-content h2{
	font-size: 20px;
	color: var(--white-color);
}

.collection-item-content h2 a{
	color: inherit;
}

.collection-item-content p{
	color: var(--white-color);
	border-top: 1px solid var(--dark-divider-color);
	padding-top: 15px;
	margin: 15px 0 0;
}

.section-footer-text{
	margin-top: 30px;
	text-align: center;
}

.section-footer-text p{
	color: var(--primary-color);
	margin-bottom: 0;
}

.section-footer-text p span{
	display: inline-block;
	font-size: 14px;
	font-weight: 500;
	background: var(--accent-color);
	color: var(--white-color);
	line-height: 1em;
	padding: 4px 10px;
	border-radius: 20px;
	margin-right: 10px;
}

.section-footer-text p a{
	font-weight: 600;
	text-transform: capitalize;
	text-decoration: underline;
	text-underline-offset: 3px;
	color: var(--accent-color);
	transition: all 0.3s ease-in-out;
}

.section-footer-text p a:hover{
	color: var(--primary-color);
}

.section-footer-text ul{
	width: 100%;
	padding: 0;
	margin: 20px 0 0;
	list-style: none;
}

.section-footer-text ul li{
	display: inline-block;
	font-size: 16px;
	font-weight: 600;
	line-height: normal;
	color: var(--primary-color);
	margin-right: 10px;
}

.section-footer-text ul li:last-child{
	margin: 0;
}

.section-footer-text ul li i{
	color: var(--accent-color);
}

.dark-section .section-footer-text.section-satisfy-img .satisfy-client-image{
    border-color: var(--primary-color);
}

.dark-section .section-footer-text p,
.dark-section .section-footer-text p a,
.dark-section .section-footer-text ul li{
	color: var(--white-color);
}

.dark-section .section-footer-text p a:hover{
	color: var(--accent-secondary-color);
}

.section-footer-text.section-footer-contact{
	display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 10px 20px;
}

.section-footer-text.section-footer-contact span{
	width: 30px;
    height: 30px;
    padding: 0;
    display: inline-flex;
    justify-content: center;
	align-items: center;
    margin-right: 10px;
}

.section-footer-text.section-footer-contact span img{
	width: 100%;
	max-width: 16px;
}

.section-footer-text.section-satisfy-img{
	display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.section-footer-text.section-satisfy-img .satisfy-client-image figure img{
	max-width: 30px;
}

.section-footer-text.section-satisfy-img .satisfy-client-image.add-more{
	width: 32px;
	height: 32px;
    margin-left: -10px;
}

.section-footer-text.section-satisfy-img .satisfy-client-image.add-more img{
	max-width: 18px;
}

.section-footer-text.section-satisfy-img ul{
	margin: 5px 0 0;
}

/************************************/
/***     07. Why Choose Us css    ***/
/************************************/

.why-choose-us{
	padding: 120px 0;
}

.why-choose-us-image-box{
	position: relative;
	height: 100%;
	margin-right: 15px;
}

.why-choose-us-image{
	height: 100%;
}

.why-choose-us-image figure{
	display: block;
	height: 100%;
	border-radius: 4px;
}

.why-choose-us-image figure img{
	width: 100%;
	height: 100%;
	aspect-ratio: 1 / 1.1447;
	object-fit: cover;
	border-radius: 4px;
}

.why-choose-us-cta-box .satisfy-client-image{
	margin-left: -10px;
}

.why-choose-us-cta-box .satisfy-client-image:first-child{
	margin: 0;
}

.why-choose-us-cta-box .satisfy-client-image img{
	max-width: 40px;
}

.why-choose-us-cta-box .satisfy-client-content{
	margin-top: 20px;
}

.why-choose-us-cta-box .satisfy-client-content p{
	color: var(--white-color);
	margin: 0;
}

.why-choose-us-content{
	height: 100%;
	align-content: center;
}

.why-choose-item-list{
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
}

.why-choose-item{
	width: calc(50% - 15px);
	min-height: 330px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 20px;
	background: var(--secondary-color);
	border-radius: 4px;
	padding: 30px;
}

.why-choose-item .satisfy-client-content p{
	font-size: 20px;
	line-height: 1.4em;
	font-weight: 500;
	font-family: var(--accent-font);
	color: var(--primary-color);
}

.why-choose-counter-content h2{
	font-size: 40px;
	font-weight: 600;
}

.why-choose-counter-content h3{
	font-size: 20px;
	margin: 5px 0 0;
}

.why-choose-item-content{
	border-top: 1px solid var(--divider-color);
	padding-top: 20px;
}

.why-choose-item-content p{
	margin: 0;
}

.why-choose-item.global-network-box{
	width: 100%;
	min-height: auto;
	gap: 30px;
}

.why-choose-item-header{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 15px;
}

.why-choose-item-header .icon-box{
	position: relative;
	width: 50px;
	height: 50px;
	background: var(--accent-color);
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	overflow: hidden;
}

.why-choose-item-header .icon-box::before{
	content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background: var(--primary-color);
    border-radius: 50%;
    width: 100%;
    height: 100%;
    transform: scale(0);
    transition: all 0.4s ease-in-out;
    z-index: 0;
}

.why-choose-item:hover .why-choose-item-header .icon-box::before{
	transform: scale(1);
}

.why-choose-item-header .icon-box img{
	position: relative;
    width: 100%;
    max-width: 24px;
    z-index: 1;
}

.why-choose-item-title{
	width: calc(100% - 65px);
}

.why-choose-item-title h3{
	font-size: 20px;
}

.why-choose-country-flag-list{
	border-top: 1px solid var(--divider-color);
	padding-top: 30px;
}

.why-choose-country-flag-list ul{
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 15px 22px;
	padding: 0;
	margin: 0;
}

.why-choose-country-flag-list ul li img{
	width: 60px;
    height: 60px;
    object-fit: cover;
    border-radius: 50%;
}

.why-choose-us-content .section-footer-text{
	border-top: 1px solid var(--divider-color);
	padding-top: 40px;
	margin-top: 40px;
}

/************************************/
/***     08. Our Products css     ***/
/************************************/

.our-products{
	background-image: url('/assets/images/dark-section-bg-image-2.png');
	padding: 120px 0;
}

.product-box{
	background: var(--dark-divider-color);
	backdrop-filter: blur(50px);
	-webkit-backdrop-filter: blur(50px);
	border-radius: 4px;
	height: calc(100% - 30px);
	margin-bottom: 30px;
	padding: 40px;
	transition: all 0.4s ease-in-out;
}

.product-box:hover{
	transform: translateY(-5px);
}

.product-box .icon-box{
	margin-bottom: 50px;
}

.product-box .icon-box img{
	width: 100%;
	max-width: 80px;
}

.product-box-content h2{
	font-size: 20px;
	color: var(--white-color);
}

.product-box-content h2 a{
	color: inherit;
}

.product-box-content p{
	color: var(--white-color);
	margin: 10px 0 0;
}

.product-box-btn{
	border-top: 1px solid var(--dark-divider-color);
	padding-top: 30px;
	margin-top: 30px;
}

.our-products .company-supports-slider-box{
    margin-top: 90px;
}

/*************************************/
/*** 09. Our Product Qualities css ***/
/*************************************/

.our-product-qualities{
	background-image: url('/assets/images/section-bg-2.png');
	background-repeat: no-repeat;
	background-position: bottom left 60px;
	background-size: auto;
	padding: 120px 0;
}

.product-qualities-image-box{
	position: relative;
	background-image: url('/assets/images/product-qualities-image-box-bg.png');
	background-repeat: no-repeat;
	background-position: top 110px right 60px;
	background-size: auto;
	display: flex;
	flex-wrap: wrap;
	align-items: end;
	margin-right: 15px;
}

.product-qualities-image-box-1{
	width: 40%;
}

.product-qualities-image figure{
	display: block;
	border-radius: 4px;
}

.product-qualities-image figure img{
	width: 100%;
	object-fit: cover;
	border-radius: 4px;
}

.product-qualities-image-box-1 .product-qualities-image figure{
	margin-right: -185px;
}

.product-qualities-image-box-1 .product-qualities-image figure img{
	aspect-ratio: 1 / 1.2;
}

.product-qualities-image-box-2 .product-qualities-image figure{
	border: 6px solid var(--bg-color);
	border-right: none;
	border-bottom: none;
	border-radius: 12px 0 0 12px;
}

.product-qualities-image-box-2 .product-qualities-image figure img{
	aspect-ratio: 1 / 1.45;
}

.product-qualities-counter-box{
	position: relative;
	background-color: var(--accent-color);
	border-radius: 4px;
	text-align: center;
	padding: 30px;
	margin: 20px 20px 30px 0;
}

.product-qualities-counter-box h3{
	position: relative;
	font-size: 36px;
	font-weight: 600;
	color: var(--white-color);
	z-index: 1;
}

.product-qualities-counter-box p{
	position: relative;
	font-family: var(--accent-font);
	font-size: 20px;
	font-weight: 500;
	line-height: 1.4em;
	color: var(--white-color);
	margin: 15px 0 0;
	z-index: 1;
}

.product-qualities-image-box-2{
	position: relative;
	width: 60%;
	z-index: 1;
}

.product-qualities-item-list{
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
}

.product-qualities-item{
	position: relative;
	width: calc(50% - 15px);
	background-color: var(--secondary-color);
	border-radius: 4px;
	padding: 30px;
	overflow: hidden;
}

.product-qualities-item::before{
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	width: 0;
	height: 100%;
	background: var(--accent-color);
	border-radius: 4px;
	transition: all 0.4s ease-in-out;
}

.product-qualities-item:nth-of-type(odd):before{
	left: 0;
}

.product-qualities-item:nth-of-type(even):before{
	right: 0;
}

.product-qualities-item:hover:before{
	width: 100%;
}

.product-qualities-item-bg-image{
	position: absolute;
	right: -10px;
	bottom: -10px;
}

.product-qualities-item-bg-image .icon-box img{
	position: relative;
	width: 100%;
	max-width: 50px;
	transition: all 0.4s ease-in-out;
	z-index: 1;
}

.product-qualities-item:hover .product-qualities-item-bg-image .icon-box img{
	filter: brightness(0) invert(1);
}

.product-qualities-item-header{
	position: relative;
	border-bottom: 1px solid var(--divider-color);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	padding-bottom: 20px;
	margin-bottom: 20px;
	z-index: 1;
	transition: all 0.4s ease-in-out;
}

.product-qualities-item:hover .product-qualities-item-header{
	border-color: var(--dark-divider-color);
}

.product-qualities-item-header .icon-box img{
	width: 100%;
	max-width: 24px;
	transition: all 0.4s ease-in-out
}

.product-qualities-item:hover .product-qualities-item-header .icon-box img{
	filter: brightness(0) invert(1);
}

.product-qualities-item-title{
	width: calc(100% - 34px);
}

.product-qualities-item-title h3{
	font-size: 20px;
	transition: all 0.4s ease-in-out;
}

.product-qualities-item-content{
	position: relative;
	z-index: 1;
}

.product-qualities-item-content p{
	margin-bottom: 0;
	transition: all 0.4s ease-in-out;
}

.product-qualities-item:hover .product-qualities-item-title h3,
.product-qualities-item:hover .product-qualities-item-content p{
	color: var(--white-color);
}

/************************************/
/***  09. Interactive Process css ***/
/************************************/

.interactive-process-layout .interactive-process-item{
	width: 25%;
	display: flex;
    flex-direction: column;
    justify-content: flex-end;
	border-right: 1px solid var(--dark-divider-color);
    position: relative;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -webkit-transition: all .5s ease;
    transition: all .5s ease;
    overflow: hidden;
	z-index: 1;
}

.interactive-process-layout .interactive-inner-process{
    position: relative;
	padding: 495px 0 0;
	height: 100%;
	transition: all 0.4s ease-in-out;
    z-index: 3;
}

.interactive-process-layout .interactive-process-item:nth-child(4n + 4) .interactive-inner-process{
	border-right: none;
}

.process-content-wap{
	position: relative;
	padding: 3.125vw;
	-ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -webkit-transition: all .5s ease;
    transition: all .5s ease;
}

.interactive-process-item-wap{
	transform: translateY(50px);
	transition: all 0.4s ease-in-out;
}

.interactive-process-layout .interactive-inner-process.activate .interactive-process-item-wap,
.interactive-process-layout .interactive-process-item:hover .interactive-process-item-wap{
	transform: translateY(0px);
}

.interactive-process-item-content-wap h3{
	font-size: 20px;
	color: var(--white-color);
}

.interactive-process-item-content-wap h3 a{
	color: inherit;
}

.interactive-process-item-content-wap p{
	color: var(--white-color);
	margin: 15px 0 0;
}

.interactive-process-layout .interactive-inner-process.activate .interactive-process-item-btn,
.interactive-process-layout .interactive-process-item:hover .interactive-process-item-btn{
	opacity: 1;
	visibility: visible;
}

.interactive-process-layout .interactive-con{
    position: relative;
    padding-bottom: 0!important;
    z-index: 1;
}

.interactive-process-layout .interactive-con-inner{
    position: relative;
    display: flex;
	flex-wrap: wrap;
    z-index: 2;
}

.interactive-process-layout .interactive-con-inner:before{
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(180deg, rgba(29, 29, 29, 0.00) 41%, rgba(29, 29, 29, 0.90) 82.3%);
    z-index: 1;
}

.interactive-process-layout .interactive-process-list-image{
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 1;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    overflow: hidden;
}

.interactive-process-layout .interactive-process-list-image .interactive-process-image{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    opacity: 0;
    z-index: -1;
    -ms-transition: all .7s ease;
    -o-transition: all .7s ease;
    -moz-transition: all .7s ease;
    -webkit-transition: all .7s ease;
    transition: all .7s ease
}

.interactive-process-layout .interactive-process-list-image .interactive-process-image:first-child{
    z-index: 1
}

.interactive-process-layout .interactive-process-list-image .interactive-process-image.show{
    z-index: 2;
    opacity: 1;
    -ms-transform: scale(1.05);
    -o-transform: scale(1.05);
    -moz-transform: scale(1.05);
    -webkit-transform: scale(1.05);
    transform: scale(1.05)
}

/************************************/
/***     10. Our Features css     ***/
/************************************/

.our-core-features{
	position: relative;
	padding: 120px 0;
	overflow: hidden;
}

.our-core-features::before{
	content: '';
	position: absolute;
	right: -8.854vw;
    bottom: -6.771vw;
    width: 23.438vw;
    height: 26.042vw;
	background-image: url('/assets/images/section-bg-4.png');
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	transform: rotate(7deg);
	z-index: 1;
}

.our-core-features .container{
	position: relative;
	z-index: 2;
}

.core-features-image-box{
	position: relative;
	height: 100%;
	margin-right: 15px;
}

.core-features-image{
	height: 100%;
}

.core-features-image figure{
	display: block;
	height: 100%;
	border-radius: 4px;
}

.core-features-image figure img{
	width: 100%;
	height: 100%;
	aspect-ratio: 1 / 1.17;
	object-fit: cover;
	border-radius: 4px;
}

.core-features-content{
	height: 100%;
	align-content: center;
}

.features-accordion .accordion-item{
	position: relative;
	border-bottom: 1px solid var(--divider-color);
	border-radius: 0;
	margin-bottom: 25px;
	padding-bottom: 25px;
	overflow: hidden;
}

.features-accordion .accordion-item:last-child{
	border-bottom: none;
	margin-bottom: 0;
	padding-bottom: 0;
}

.features-accordion .accordion-header .accordion-button{
	font-size: 20px;
	font-weight: 500;
	line-height: 1.4em;
    background: transparent;
    color: var(--primary-color);
    padding: 0 30px 15px 0;
	transition: all 0.3s ease-in-out;
}

.features-accordion .accordion-header .accordion-button img{
	width: 100%;
	max-width: 24px;
	margin-right: 15px;
}

.features-accordion .accordion-header .accordion-button.collapsed{
	padding: 0;
}

.features-accordion .accordion-item .accordion-button::after, 
.features-accordion .accordion-item .accordion-button.collapsed::after{
    content: '\2b';
    font-family: 'FontAwesome';
    position: absolute;
    right: 0;
    top: 0;
    font-size: 20px;
    color: var(--accent-color);
    transition: all 0.3s ease-in-out;
}

.features-accordion .accordion-button:not(.collapsed)::after{
    content: '\f068';
}

.features-accordion .accordion-item .accordion-body p{
	margin: 0;
}

/************************************/
/***        11. Cta Box css       ***/
/************************************/

.cta-box{
	position: relative;
	/* kaldırıldı (kopyalanmayan yer tutucu): cta-box-bg-image.jpg — bkz. ozen-ek.css §12 */
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	padding: 120px 0;
}

.cta-box::before{
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(270deg, rgba(29, 29, 29, 0.00) 0%, rgba(29, 29, 29, 0.95) 55.93%);
	z-index: 1;
}

.cta-box .container{
	position: relative;
	z-index: 2;
}

.cta-box-content{
	margin-right: 5.208vw;
}

.cta-box-contact-content{
	border-top: 1px solid var(--dark-divider-color);
	padding-top: 40px;
}

.cta-box-contact-content p{
	color: var(--white-color);
	margin-bottom: 10px;
}

.cta-box-contact-content h3{
	font-size: 30px;
	font-weight: 600;
	color: var(--white-color);
}

.cta-box-contact-content h3 a{
	color: inherit;
	transition: all 0.4s ease-in-out;
}

.cta-box-contact-content h3 a:hover{
	color: var(--accent-secondary-color);
}

.contact-us-circle{
	text-align: center;
}

.cta-box-counter-item .icon-box{
	position: relative;
	width: 50px;
	height: 50px;
	background: var(--accent-color);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}

.cta-box-counter-item .icon-box::before{
	content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background: var(--accent-secondary-color);
    border-radius: 50%;
    width: 100%;
    height: 100%;
    transform: scale(0);
    transition: all 0.4s ease-in-out;
    z-index: 0;
}

.cta-box-counter-item:hover .icon-box::before{
    transform: scale(1);
}

.cta-box-counter-item .icon-box img{
	position: relative;
    width: 100%;
    max-width: 24px;
    z-index: 1;
}

.our-partners .container{
	position: relative;
	z-index: 1;
}

.partners-item-header .icon-box{
	position: relative;
	width: 50px;
	height: 50px;
	background: var(--accent-color);
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-bottom: 30px;
	overflow: hidden;
}

.partners-item-header .icon-box::before{
	content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background: var(--accent-secondary-color);
    border-radius: 50%;
    width: 100%;
    height: 100%;
    transform: scale(0);
    transition: all 0.4s ease-in-out;
    z-index: 0;
}

.partners-item:hover .icon-box::before{
    transform: scale(1);
}

.partners-item-header .icon-box img{
	position: relative;
    width: 100%;
    max-width: 24px;
    z-index: 1;
}

.our-testimonials .container{
	position: relative;
	z-index: 2;
}

.testimonial-slider .swiper-wrapper{
}

.testimonial-slider .swiper-wrapper .testimonial-item{
	transform: scale(0.95);
}

.testimonial-slider .swiper-wrapper .swiper-slide.swiper-slide-next .testimonial-item{
	transform: scale(1);
}

.our-testimonials .section-footer-text{
	margin-top: 60px;
}

/************************************/
/***       14. Our Blog css       ***/
/************************************/

.our-blog{
	padding: 120px 0 90px;
}

.post-item{
	position: relative;
	height: calc(100% - 30px);
	min-height: 500px;
	border-radius: 4px;
	align-content: end;
	padding: 40px;
	margin-bottom: 30px;
	overflow: hidden;
}

.post-item .post-featured-image{
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.post-item .post-featured-image a, 
.post-item .post-featured-image figure{
	position: relative;
    display: block;
	width: 100%;
	height: 100%;
	border-radius: 4px;
	overflow: hidden;
}

.post-item .post-featured-image figure::before{
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: linear-gradient(180deg, transparent 50%, rgba(29, 29, 29, 0.90) 90%);
    height: 100%;
    width: 100%;
    z-index: 1;
}

.post-item .post-featured-image figure img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 4px;
	transition: all 0.6s ease-in-out;
}

.post-item:hover .post-featured-image img{
	transform: scale(1.06);
}

.post-item .post-item-body{
	position: relative;
	z-index: 1;
}

.post-item .post-item-content h2{
	font-size: 20px;
	color: var(--white-color);
	line-height: 1.4em;
}

.post-item .post-item-content h2 a{
	color: inherit;
}

.post-item .post-item-btn{
	border-top: 1px solid var(--dark-divider-color);
	padding-top: 25px;
	margin-top: 25px;
}

/************************************/
/***        15. Footer css        ***/
/************************************/

.main-footer{
	padding: 120px 0 0;
}

.about-footer-box{
	background-color: var(--dark-divider-color);
	backdrop-filter: blur(50px);
	-webkit-backdrop-filter: blur(50px);
	border-radius: 4px;
	padding: 40px;
}

.about-footer-content{
	margin-top: 20px;
}

.footer-logo img{
	width: 100%;
	max-width: 126px;
}

.about-footer-content p{
	color: var(--white-color);
	margin-bottom: 0;
}

.footer-social-links{
	border-top: 1px solid var(--dark-divider-color);
	padding-top: 30px;
	margin-top: 80px;
}

.footer-social-links h2{
	font-size: 20px;
	color: var(--white-color);
	margin-bottom: 15px;
}

.footer-social-links ul{
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 15px;
	align-items: center;
	padding: 0;
	margin: 0;
}

.footer-social-links ul li a{
	width: 40px;
	height: 40px;
	border: 1px solid var(--dark-divider-color);
	border-radius: 50%;
	color: var(--white-color);
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.4s ease-in-out;
}

.footer-social-links ul li a:hover{
	background-color: var(--accent-color);
	border-color: var(--accent-color);
}

.footer-social-links ul li a i{
	font-size: 18px;
	color: inherit;
}

.footer-links-box{
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
	justify-content: space-between;
	margin-left: 40px;
}

.footer-links{
	max-width: 40%;
}

.footer-links h2{
	font-size: 20px;
	color: var(--white-color);
	margin-bottom: 25px;
}

.footer-links ul{
	list-style: disc;
	margin: 0;
	padding: 0 0 0 20px;
}

.footer-links ul li{
	color: var(--white-color);
	line-height: 1.5em;
	margin-bottom: 20px;
}

.footer-links ul li:last-child{
	margin-bottom: 0;
}

.footer-links ul li::marker{
	color: var(--accent-secondary-color);
}

.footer-links ul li a{
	color: inherit;
	transition: all 0.4s ease-in-out;
}

.footer-links ul li a:hover{
	color: var(--accent-secondary-color);
}

.footer-links.footer-newsletter-form{
	max-width: 42%;
}

.footer-newsletter-form .form-group{
	position: relative;
    display: flex;
	border-bottom: 1px solid var(--dark-divider-color);
}

.footer-newsletter-form .form-group .form-control{
	width: calc(100% - 34px);
	font-size: 14px;
	font-weight: 400;
	line-height: 1.3em;
	color: var(--white-color);
	background: transparent;
	border: none;
	border-radius: 0;
	outline: none;
	box-shadow: none;
	padding: 6px 20px 25px 0;
}

.footer-newsletter-form .form-group .form-control::placeholder{
	color: var(--white-color);
	opacity: 50%;
}

.footer-newsletter-form .form-group .newsletter-btn{
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: var(--accent-secondary-color);
	border: none;
	padding: 0;
	display: flex;
	align-items: center;
	justify-content: center;
    transition: all 0.3s ease-in-out;
}

.footer-newsletter-form .form-group .newsletter-btn:hover{
    background: var(--accent-color);
}

.footer-newsletter-form .form-group .newsletter-btn img{
    width: 100%;
	max-width: 12px;
	transition: all 0.3s ease-in-out;
}

.footer-newsletter-form .form-group .newsletter-btn:hover img{
    transform: rotate(45deg);
}

.footer-policy-info-box{
	width: 100%;
	border-top: 1px solid var(--dark-divider-color);
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 20px;
	padding-top: 40px;
	margin-top: 10px;
}

.footer-policy-box-title{
	max-width: 60%;
}

.footer-policy-box-title h3{
	font-size: 20px;
	color: var(--white-color);
}

.footer-privacy-policy ul{
	display: flex;
	flex-wrap: wrap;
	gap: 10px 30px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.footer-privacy-policy ul li{
	position: relative;
	line-height: 1.5em;
	color: var(--white-color);
}

.footer-privacy-policy ul li::before{
	content: '';
	position: absolute;
	top: 50%;
	right: -22px;
	background: var(--accent-secondary-color);
	border-radius: 100px;
	transform: translateY(-50%);
	width: 5px;
	height: 5px;
}

.footer-privacy-policy ul li:last-child::before{
	display: none;
}

.footer-privacy-policy ul li a{
	color: inherit;
	transition: all 0.4s ease-in-out;
}

.footer-privacy-policy ul li a:hover{
	color: var(--accent-secondary-color);
}

.footer-copyright-text{
    text-align: center;
    border-top: 1px solid var(--dark-divider-color);
    padding: 60px 0;
    margin-top: 60px;
}

.footer-copyright-text p{
    color: var(--white-color);
    margin: 0;
}

/************************************/
/***     16. About Us Page css    ***/
/************************************/

.page-header{
	position: relative;
	/* kaldırıldı (kopyalanmayan yer tutucu): page-header-bg.jpg — bkz. ozen-ek.css §12 */
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	padding: 295px 0 180px;
	overflow: hidden;
}

.page-header:before{
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background: linear-gradient(180deg, var(--primary-color) 0%, transparent 45%, var(--primary-color) 85.39%);
	z-index: 1;
}

.page-header-box{
	position: relative;
    text-align: center;
	z-index: 2;
}

.page-header-box h1{
	display: inline-block;
	font-size: 60px;
	line-height: 1.1em;
	color: var(--white-color);
	margin-bottom: 15px;
}

.page-header-box ol{
    justify-content: center;
	margin: 0;
	padding: 0;
}

.page-header-box ol li.breadcrumb-item{
	font-size: 16px;
	font-weight: 400;
	line-height: normal;
    text-transform: capitalize;
	color: var(--white-color);
}

.page-header-box ol li.breadcrumb-item a{
    color: inherit;
}

.page-header-box ol .breadcrumb-item+.breadcrumb-item::before{
    color: var(--white-color);
}

.our-values{
	background: var(--secondary-color);
	padding: 120px 0;
}

.our-values-content{
	display: flex;
	flex-direction: column;
	height: 100%;
}

.our-values-image{
	height: 100%;
}

.our-values-image figure{
	display: block;
	height: 100%;
	border-radius: 4px;
}

.our-values-image figure img{
	width: 100%;
	height: 100%;
	aspect-ratio: 1 / 0.565;
	object-fit: cover;
	border-radius: 4px;
}

.our-value-item-list{
	height: 100%;
	align-content: center;
	margin-left: 15px;
}

.our-value-item{
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	border-bottom: 1px solid var(--divider-color);
	padding-bottom: 40px;
	margin-bottom: 40px;
}

.our-value-item:last-child{
	border: none;
	padding-bottom: 0;
	margin-bottom: 0;
}

.our-value-item .icon-box{
	position: relative;
	width: 50px;
	height: 50px;
	background: var(--accent-color);
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	overflow: hidden;
}

.our-value-item .icon-box::before{
	content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background: var(--primary-color);
    border-radius: 50%;
    width: 100%;
    height: 100%;
    transform: scale(0);
    transition: all 0.4s ease-in-out;
    z-index: 0;
}

.our-value-item:hover .icon-box::before{
    transform: scale(1);
}

.our-value-item .icon-box img{
	position: relative;
    width: 100%;
    max-width: 24px;
    z-index: 1;
}

.our-value-item-content{
	width: calc(100% - 70px);
}

.our-value-item-content h3{
	font-size: 20px;
}

.our-value-item-content p{
	margin: 10px 0 0;
}

.our-value-item-content ul{
	display: flex;
	flex-wrap: wrap;
	gap: 10px 40px;
	list-style: disc;
	margin: 20px 0 0;
	padding: 0 0 0 17px;
}

.our-value-item-content ul li{
	position: relative;
	width: calc(50% - 20px);
	line-height: 1.5em;
}

.our-value-item-content ul li::marker{
	color: var(--accent-color);
}

.work-process{
	background-image: url('/assets/images/dark-section-bg-image-2.png');
	padding: 120px 0;
}

.work-process-item-list{
	display: flex;
	flex-wrap: wrap;
	gap: 60px 30px;
}

.work-process-item{
	width: calc(33.33% - 20px);
	display: flex;
	flex-direction: column;
	gap: 30px;
	text-align: center;
}

.work-process-item:nth-child(3n + 2){
	flex-direction: column-reverse;
}

.work-process-item-image{
	max-width: 240px;
	background: var(--dark-divider-color);
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	border-radius: 50%;
	padding: 15px;
	margin: 0 auto;
}

.work-process-item-image figure{
	display: block;
	border-radius: 50%;
}

.work-process-item-image figure img{
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	border-radius: 50%;
}

.work-process-item-step{
	display: inline-block;
	background: var(--dark-divider-color);
	backdrop-filter: blur(30px);
	-webkit-backdrop-filter: blur(30px);
	border-radius: 40px;
	padding: 9px 20px;
	margin-bottom: 20px;
}

.work-process-item-step p{
	font-size: 14px;
	font-weight: 500;
	line-height: 1em;
	color: var(--white-color);
	margin: 0;
}

.work-process-item-content h3{
	font-size: 20px;
	color: var(--white-color);
}

.work-process-item-content p{
	color: var(--white-color);
	margin: 10px 0 0;
}

.work-process .section-footer-text{
	margin-top: 60px;
}

.our-team{
	background: var(--secondary-color);
	padding: 120px 0;
}

.team-item{
    position: relative;
    border-radius: 4px;
    height: calc(100% - 30px);
    margin-bottom: 30px;
    overflow: hidden;
}

.team-item-image figure,
.team-item-image a{
    display: block;
}

.team-item-image img{
    width: 100%;
    aspect-ratio: 1 / 1.1901;
    object-fit: cover;
	transition: all 0.6s ease-in-out;
}

.team-item:hover .team-item-image img{
	transform: scale(1.06);
}

.team-item-body{
    position: absolute;
    bottom: 20px;
    left: 20px;
    right: 20px;
	background-color: var(--dark-divider-color);
    backdrop-filter: blur(50px);
    -webkit-backdrop-filter: blur(50px);
    border-radius: 4px;
    text-align: center;
    padding: 30px;
    overflow: hidden;
    z-index: 1;
}

.team-item-content h2{
    font-size: 20px;
    color: var(--white-color);
}

.team-item-content h2 a{
    color: inherit;
}

.team-item-content p{
    color: var(--white-color);
	margin: 10px 0 0;
}

.team-item:hover .team-social-list{
    height: 60px;
    opacity: 1;
    visibility: visible;
	transform: scaleY(1);
    margin-bottom: 20px;
}

.our-faqs{
	padding: 120px 0;
}

.faq-image-box{
	position: relative;
	height: 100%;
}

.faq-image{
	height: 100%;
}

.faq-image figure{
	display: block;
	height: 100%;
	border-radius: 4px;
}

.faq-image figure img{
	width: 100%;
	height: 100%;
	aspect-ratio: 1 / 1.279;
	object-fit: cover;
	border-radius: 4px;
}

.faq-cta-box{
	position: absolute;
	right: 20px;
	bottom: 20px;
	left: 20px;
	background-color: var(--divider-color);
	backdrop-filter: blur(50px);
	-webkit-backdrop-filter: blur(50px);
	border-radius: 4px;
	padding: 30px;
	z-index: 1;
}

.faq-cta-item .icon-box,
.faq-cta-contact-item .icon-box{
	position: relative;
	width: 50px;
	height: 50px;
	background: var(--accent-color);
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
}

.faq-cta-item .icon-box::before{
	content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background: var(--accent-secondary-color);
    border-radius: 50%;
    width: 100%;
    height: 100%;
    transform: scale(0);
    transition: all 0.4s ease-in-out;
    z-index: 0;
}

.faq-cta-item:hover .icon-box::before{
	transform: scale(1);
}

.faq-cta-item .icon-box img,
.faq-cta-contact-item .icon-box img{
	position: relative;
    width: 100%;
    max-width: 24px;
	z-index: 1;
}
.faq-cta-contact-item-content h3{
	font-size: 20px;
	color: var(--white-color);
}
.faq-cta-contact-item-content p{
	color: var(--white-color);
	margin: 10px 0 0;
}

.faq-cta-contact-item{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 15px;
}

.faq-cta-contact-item .icon-box{
	background: var(--secondary-color);
}

.faq-cta-contact-item-content p a{
	color: inherit;
	transition: all 0.4s ease-in-out;
}

.faq-cta-contact-item-content p a:hover{
	color: var(--accent-color);
}

.faqs-content{
	height: 100%;
	align-content: center;
	margin-left: 15px;
}

.faq-accordion .accordion-item{
    margin-bottom: 30px;
}

.faq-accordion .accordion-item:last-child{
    margin-bottom: 0;
}

.faq-accordion .accordion-header .accordion-button{
    font-size: 18px;
    font-weight: 500;
    line-height: 1.4em;
    color: var(--primary-color);
    padding: 0 40px 25px 0;
	border-bottom: 1px solid var(--divider-color);
    transition: all 0.3s ease-in-out;
}

.faq-accordion .accordion-item:last-child .accordion-header .accordion-button.collapsed{
	border-bottom: none;
	padding-bottom: 0;
}

.faq-accordion .accordion-item .accordion-button::after, 
.faq-accordion .accordion-item .accordion-button.collapsed::after{
    content: '\f055';
	font-family: 'FontAwesome';
	position: absolute;
	top: 0;
	right: 0;
	font-size: 26px;
	line-height: normal;
	color: var(--accent-color);
	transition: all 0.3s ease-in-out;
}

.faq-accordion .accordion-button:not(.collapsed)::after{
	content: '\f056';
	color: var(--accent-secondary-color);
}

.faq-accordion .accordion-item .accordion-body{
    padding: 25px 0 0;
}

.faq-accordion .accordion-item .accordion-body p:last-child{
    margin-bottom: 0;
}

.event-info-item .icon-box{
	position: relative;
	width: 50px;
	height: 50px;
	background: var(--accent-color);
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	overflow: hidden;
}

.event-info-item .icon-box::before{
	content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background: var(--primary-color);
    border-radius: 50%;
    width: 100%;
    height: 100%;
    transform: scale(0);
    transition: all 0.4s ease-in-out;
    z-index: 0;
}

.event-info-item:hover .icon-box::before{
    transform: scale(1);
}

.event-info-item .icon-box img{
	position: relative;
    width: 100%;
    max-width: 24px;
    z-index: 1;
}

.page-event-gallery-box .photo-gallery{
	width: calc(25% - 22.5px);
}

.page-event-gallery-box .photo-gallery a{
}

.page-event-gallery-box .photo-gallery figure{
	display: block;
	border-radius: 4px;
}

.page-event-gallery-box .photo-gallery img{
	width: 100%;
	aspect-ratio: 1 / 1.189;
	object-fit: cover;
	border-radius: 4px;
}
.page-pagination ul li.active a{
	color: var(--white-color);
    background: var(--accent-color);
}

.page-single-sidebar{
	position: sticky;
    top: 30px;
    margin-right: 15px;
}

.sidebar-cta-box{
	background-color: var(--primary-color);
	border-radius: 4px;
	padding: 40px;
}

.sidebar-cta-item{
	margin-bottom: 40px;
}

.sidebar-cta-item .icon-box{
	position: relative;
	width: 50px;
	height: 50px;
	background: var(--accent-color);
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-bottom: 30px;
	overflow: hidden;
}

.sidebar-cta-item .icon-box::before{
	content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background: var(--accent-secondary-color);
    border-radius: 50%;
    width: 100%;
    height: 100%;
    transform: scale(0);
    transition: all 0.4s ease-in-out;
    z-index: 0;
}

.sidebar-cta-box:hover .sidebar-cta-item .icon-box::before{
	transform: scale(1);
}

.sidebar-cta-item .icon-box img{
	position: relative;
    width: 100%;
    max-width: 24px;
    z-index: 1;
}

.sidebar-cta-item-content h2{
	font-size: 20px;
	color: var(--white-color);
	border-bottom: 1px solid var(--dark-divider-color);
	padding-bottom: 20px;
	margin: 0 0 20px;
}

.sidebar-cta-item-content p{
	color: var(--white-color);
	margin-bottom: 15px;
}

.sidebar-cta-item-content p:last-child{
	margin-bottom: 0;
}

.sidebar-cta-contact-list ul{
	list-style: none;
	margin: 0;
	padding: 0;
}

.sidebar-cta-contact-list ul li{
	background-color: var(--dark-divider-color);
	border-radius: 4px;
	color: var(--white-color);
	line-height: 1.5em;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	padding: 12px 15px;
	gap: 10px;
	margin-bottom: 20px;
}

.sidebar-cta-contact-list ul li:last-child{
	margin-bottom: 0;
}

.sidebar-cta-contact-list ul li img{
	width: 100%;
	max-width: 20px;
	margin-right: 5px;
}

.sidebar-cta-contact-list ul li span{
	width: calc(100% - 35px);
}

.sidebar-cta-contact-list ul li a{
	color: inherit;
	transition: all 0.4s ease-in-out;
}

.sidebar-cta-contact-list ul li a:hover{
	color: var(--accent-secondary-color);
}

.team-member-contact-item .icon-box{
	position: relative;
	width: 50px;
	height: 50px;
	background: var(--accent-color);
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	overflow: hidden;
}

.team-member-contact-item .icon-box::before{
	content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background: var(--primary-color);
    border-radius: 50%;
    width: 100%;
    height: 100%;
    transform: scale(0);
    transition: all 0.4s ease-in-out;
    z-index: 0;
}

.team-member-contact-item:hover .icon-box::before{
	transform: scale(1);
}

.team-member-contact-item .icon-box img{
	position: relative;
    width: 100%;
    max-width: 24px;
    z-index: 1;
}

.contact-us-form.team-member-contact-form{
	padding: 60px;
}

/************************************/
/***    23. Collection Page css   ***/
/************************************/

.page-collection{
	padding: 120px 0 90px;
}

.product-item-list{
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
}

.trade-item .icon-box{
	position: relative;
	width: 50px;
	height: 50px;
	background: var(--accent-color);
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	overflow: hidden;
}

.trade-item .icon-box::before{
	content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background: var(--primary-color);
    border-radius: 50%;
    width: 100%;
    height: 100%;
    transform: scale(0);
    transition: all 0.4s ease-in-out;
    z-index: 0;
}

.trade-item:hover .icon-box::before{
	transform: scale(1);
}

.trade-item .icon-box img{
	position: relative;
    width: 100%;
    max-width: 24px;
    z-index: 1;
}

.our-global-clients{
	position: relative;
	background-color: var(--secondary-color);
	background-image: url('/assets/images/world-map-image.png');
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 100% auto;
	padding: 120px 0;
}

.global-clients-item-list{
	max-width: 1080px;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 40px 50px;
	margin: 0 auto;
}

.global-client-item{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	background: var(--bg-color);
	border-radius: 40px;
	padding: 8px 20px 8px 8px;
}

.global-client-item:first-child{
	margin-left: 66px;
}

.global-client-item figure{
	display: block;
	border-radius: 50%;
}

.global-client-item figure img{
	width: 100%;
	max-width: 40px;
	border-radius: 50%;
}

.global-client-item h3{
	font-size: 16px;
}

.our-global-clients .section-footer-text{
	margin-top: 80px;
}

.what-we-item .icon-box{
	position: relative;
	width: 50px;
	height: 50px;
	background: var(--accent-color);
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-bottom: 30px;
	overflow: hidden;
}

.what-we-item .icon-box::before{
	content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background: var(--primary-color);
    border-radius: 50%;
    width: 100%;
    height: 100%;
    transform: scale(0);
    transition: all 0.4s ease-in-out;
    z-index: 0;
}

.what-we-item:hover .icon-box::before{
    transform: scale(1);
}

.what-we-item .icon-box img{
	position: relative;
    width: 100%;
    max-width: 24px;
    z-index: 1;
}

.what-we-do .section-footer-text{
	margin-top: 60px;
}

.pricing-item-header .icon-box{
	position: relative;
	width: 50px;
	height: 50px;
	background: var(--accent-color);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.4s ease-in-out;
}

.pricing-item-header .icon-box::before{
	content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background: var(--primary-color);
    border-radius: 50%;
    width: 100%;
    height: 100%;
    transform: scale(0);
    transition: all 0.4s ease-in-out;
    z-index: 0;
}

.pricing-item:hover .icon-box::before{
    transform: scale(1);
}

.pricing-item-header .icon-box img{
	position: relative;
    width: 100%;
    max-width: 24px;
    z-index: 1;
}

/************************************/
/***     28. Image Gallery css    ***/
/************************************/

.page-gallery{
	padding: 120px 0 90px;
}

.page-gallery-box .photo-gallery{
	height: calc(100% - 30px);
	margin-bottom: 30px;
}

.page-gallery-box .photo-gallery a{
}

.page-gallery-box .photo-gallery figure{
	display: block;
	border-radius: 4px;
}

.page-gallery-box .photo-gallery img{
	width: 100%;
	aspect-ratio: 1 / 0.829;
	object-fit: cover;
	border-radius: 4px;
}

/************************************/
/***      30. FAQ's Page css      ***/
/************************************/

.page-faqs{
	padding: 120px 0;
}

.page-category-list{
	background-color: var(--secondary-color);
	border-radius: 4px;
    margin-bottom: 40px;
	overflow: hidden;
}

.page-category-list h3{
	font-size: 20px;
	line-height: 1.4em;
	color: var(--primary-color);
	background: var(--accent-color);
	padding: 20px 30px;
}

.page-category-list ul{
	list-style: none;
    margin: 0;
	padding: 30px;
}

.page-category-list ul li{
	font-family: var(--accent-font);
	font-weight: 500;
	line-height: 1.5em;
	color: var(--primary-color);
    border-bottom: 1px solid var(--divider-color);
    padding-bottom: 20px;
    margin-bottom: 20px;
}

.page-category-list ul li:last-child{
    border-bottom: none;
    margin: 0;
    padding: 0;
}

.page-category-list ul li a{
    position: relative;
    display: block;
	color: inherit;
    padding-right: 24px;
	transition: all 0.4s ease-in-out;
}

.page-category-list ul li a::before{
	content: '';
    position: absolute;
    top: 50%;
	transform: translateY(-50%);
    right: 0;
	background: url('/assets/images/arrow-primary.svg') no-repeat;
	background-position: center center;
	background-size: cover;
    width: 12px;
    height: 12px;
	transition: all 0.4s ease-in-out;
}

.page-category-list ul li a:hover::before{
	transform: translateY(-50%) rotate(45deg);
}

.page-faqs .page-single-faqs{
    margin-bottom: 60px;
}

.page-faqs .page-single-faqs:last-child{
    margin-bottom: 0px;
}

/************************************/
/***    32. Contact Us Page css   ***/
/************************************/

.page-contact-us{
	padding: 120px 0 60px;
}

.contact-us-content{
	position: sticky;
	top: 30px;
	margin-right: 15px;
}

.contact-info-box{
	position: relative;
	background-color: var(--primary-color);
	background-image: url('/assets/images/contact-info-box-bg-image.png');
	background-repeat: no-repeat;
	background-position: right -20px bottom -20px;
	background-size: auto;
	border-radius: 4px;
	padding: 30px;
	overflow: hidden;
}

.contact-info-box-header{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 20px;
	margin-bottom: 20px;
}

.contact-info-box-header .icon-box img{
	width: 100%;
	max-width: 30px;
}

.contact-info-box-title{
	width: calc(100% - 50px);
}

.contact-info-box-title h3{
	font-size: 20px;
	color: var(--white-color);
}

.contact-info-box-content p{
	color: var(--white-color);
	margin-bottom: 0;
}

.contact-us-form{
	background-color: var(--secondary-color);
	border-radius: 10px;
	padding: 2.604vw;
}

.contact-form .form-control{
	font-size: 16px;
	font-weight: 500;
	line-height: 1.3em;
	color: var(--primary-color);
	background: var(--bg-color);
	border: none;
	border-radius: 4px;
	padding: 21px 20px;
	box-shadow: none;
	outline: none;
}

.contact-form .form-control::placeholder{
	font-size: 14px;
	color: var(--text-color);
}

.google-map{
    padding: 60px 0 120px;
}

/************************************/
/***    33. 404 Error Page css    ***/
/************************************/

.error-page{
	padding: 120px 0;
}

.error-page-content{
	text-align: center;
}

.error-page-content .section-title{
	margin-bottom: 15px;
}

/************************************/
/***      34. Responsive css      ***/
/************************************/

@media only screen and (max-width: 1440px){

	.hero{
		min-height: 850px;
	}

	.process-content-wap{
		padding: 30px;
	}
}

@media only screen and (max-width: 1024px){

	.main-menu ul li{
		margin: 0;
	}

	.section-content-btn .section-btn{
		margin-top: 20px;
	}
	
	.section-title-content{
        margin-top: 10px;
    }

	.section-btn{
        text-align: left;
        margin-top: 15px;
	}

	.hero{
		height: auto;
		min-height: 850px;
	}

	.hero::before{
		background: var(--primary-color);
		opacity: 65%;
	}

	.hero-content{
		margin-bottom: 30px;
	}

	.about-us-image-box{
		max-width: 740px;
		margin: 0 auto 30px;
	}

	.about-us-image-box-1 .about-us-image figure img{
		aspect-ratio: 1 / 1.2;
	}

	.why-choose-us-image-box{
		height: auto;
		margin: 0 0 30px;
	}

	.why-choose-us-image,
	.why-choose-us-image figure{
		height: auto;
	}

	.why-choose-us-image figure img{
		aspect-ratio: 1 / 0.8;
		height: auto;
	}

	.why-choose-us-content{
		height: auto;
	}

	.why-choose-item{
		min-height: auto;
	}

	.product-qualities-image-box{
		max-width: 605px;
		margin: 0 auto 30px;
	}

	.our-product-qualities{
		background-size: 400px auto;
	}

	.interactive-process-layout .interactive-process-item{
		border-bottom: 1px solid var(--dark-divider-color);
		width: 50%;
	}

	.interactive-process-layout .interactive-inner-process{
		padding: 200px 0 0;
		height: auto;
	}

	.interactive-process-layout .interactive-con-inner:before{
		background-color: var(--primary-color);
		opacity: 60%;
	}

	.core-features-image-box{
		height: auto;
		margin: 0 0 30px;
	}

	.core-features-image,
	.core-features-image figure{
		height: auto;
	}

	.core-features-image figure img{
		height: auto;
		aspect-ratio: 1 / 0.8;
	}

	.core-features-content{
		height: auto;
	}

	.cta-box-content{
		margin-right: 0;
	}

	.cta-box .contact-us-circle{
		display: none;
	}

	.cta-box-counter-list{
		gap: 30px;
		padding-top: 40px;
		margin-top: 40px;
	}

	.cta-box-counter-item{
		width: calc(33.33% - 20px);
	}

	.cta-box-counter-item::before{
		right: -15px;
	}

	.cta-box-counter-item-content h2{
		font-size: 38px;
	}

	.partners-item{
		padding: 30px;
		min-height: auto;
	}

	.testimonial-item{
		min-height: auto;
		padding: 30px;
	}

	.testimonial-slider .swiper-wrapper .testimonial-item{
		transform: scale(1);
	}

	.post-item{
		min-height: 420px;
		padding: 30px 20px;
	}

	.about-footer-box{
		padding: 20px;
	}

	.footer-links-box{
		margin-left: 0;
	}

	.footer-policy-info-box{
		padding-top: 30px;
		margin-top: 0;
	}

	.footer-policy-box-title{
		max-width: 100%;
	}

	.our-values-content{
		height: auto;
		margin-bottom: 30px;
	}

	.our-values-image,
	.our-values-image figure,
	.our-values-image figure img{
		height: auto;
	}

	.our-value-item-list{
		height: auto;
		margin: 0;
	}

	.our-value-item{
		margin-bottom: 30px;
		padding-bottom: 30px;
	}

	.work-process-item{
		width: calc(50% - 15px);
	}

	.work-process-item:nth-child(3n + 2){
		flex-direction: column;
	}
	
	.faq-image-box{
		height: auto;
		max-width: 740px;
		margin: 0 auto 30px;
	}

	.faq-image,
	.faq-image figure{
		height: auto;
	}

	.faq-image figure img{
		height: auto;
		aspect-ratio: 1 / 1.1;
	}

	.faqs-content{
		height: auto;
		margin: 0;
	}

	.event-info-item-list{
		gap: 20px;
		padding: 20px;
	}

	.event-info-item{
		padding-right: 20px;
	}

	.event-info-item .icon-box{
		width: 44px;
		height: 44px;
	}

	.event-info-item .icon-box img{
		max-width: 20px;
	}

	.event-info-item-content{
		width: calc(100% - 59px);
	}

	.page-single-sidebar{
		margin-right: 0;
	}

	.sidebar-cta-box{
		padding: 30px;
	}

	.sidebar-cta-contact-list ul li b{
		display: none;
	}

	.team-member-about,
	.team-member-qualifications,
	.team-member-expertise{
		margin-bottom: 40px;
	}

	.team-member-about-content{
		padding: 30px;
	}

	.team-member-contact-list{
		gap: 20px;
	}

	.team-member-contact-item .icon-box{
		width: 42px;
		height: 42px;
	}

	.team-member-contact-item .icon-box img{
		max-width: 20px;
	}

	.team-member-contact-item-content{
		width: calc(100% - 57px);
	}

	.team-member-contact-item-content h3{
		font-size: 18px;
	}

	.team-member-qualifications{
		padding: 30px;
	}

	.member-qualifications-item-list{
		gap: 20px;
	}

	.member-qualifications-item{
		width: calc(50% - 10px);
        padding: 20px;
	}

	.team-member-expertise{
		padding: 30px;
	}

	.contact-us-form.team-member-contact-form{
		padding: 30px;
	}

	.product-item{
		width: calc(50% - 15px);
	}

	.product-category-item{
		padding: 20px;
	}

	.product-category-item ul li input[type=checkbox]{
		width: 20px;
		height: 20px;
	}

	.product-category-item ul li span label{
		width: calc(100% - 30px);
	}

	.our-trade-image{
		height: auto;
		margin: 0 auto 30px;
	}

	.our-trade-image figure,
	.our-trade-image figure img{
		height: auto;
	}

	.our-trade-image figure img{
		aspect-ratio: 1 / 0.8;
	}

	.our-trade-content{
		height: auto;
	}

	.global-clients-item-list{
		gap: 30px;
	}

	.what-we-do-content{
		margin: 0 0 30px;
	}

	.what-we-do-image,
	.what-we-do-image figure,
	.what-we-do-image figure img{
		height: auto;
	}

	.what-we-item-list{
		padding: 30px;
	}

	.packaging-detail-content th,
	.packaging-detail-content td{
		height: 60px;
	}

	.contact-us-content{
		position: initial;
		margin: 0 0 30px;
	}
}

@media only screen and (max-width: 991px){

	.btn-default{
        padding: 15px 50px 15px 15px;
    }

	.btn-default::before{
		width: 36px;
		height: 36px;
	}
	
	header.main-header{
		top: 0px;
		left: 0;
		right: 0;
	}

	header.main-header .header-sticky{
		width: 100%;
		border-radius: 0;
	}
	
	header.main-header .header-sticky.active{
		width: 100%;
		top: 0;
		left: 0;
		right: 0;
		border-radius: 0;
	}

	.responsive-menu,
    .navbar-toggle{
        display: block;
    }

	.slicknav_nav li,
	.slicknav_nav ul{
        display: block;
    }

	.header-btn{
		display: none;
	}

	.section-row{
		margin-bottom: 40px;
	}
	
	.section-title{
		margin-bottom: 30px;
	}

	.section-title .section-sub-title{
		padding: 6px 12px 6px 25px;
		margin-bottom: 10px;
	}

	.section-title .section-sub-title::before{
		left: 12px;
	}

	.section-title h1{
		font-size: 44px;
	}

	.section-title h2{
		font-size: 38px;
	}

	.section-title p{
		margin-top: 10px;
	}

	.hero{
		min-height: 780px;
		align-content: center;
		padding: 130px 0 60px;
	}

	.hero-content .section-title .section-sub-title{
		padding: 8px 14px 8px 29px;
	}

	.hero-content .section-title .section-sub-title::before{
		left: 14px;
	}

	.about-us{
		background-size: 300px auto;
		padding: 60px 0;
	}

	.about-us-body{
		padding-top: 30px;
	}

	.about-us-body-list ul li{
		margin-bottom: 10px;
	}

	.about-us-body-list ul li::before{
		font-size: 16px;
	}

	.about-us-btn{
		padding-top: 30px;
		margin-top: 30px;
	}

	.our-collection{
		padding: 60px 0;
	}

	.collection-item{
		min-height: 380px;
		padding: 30px;
	}

	.section-footer-text{
		margin-top: 10px;
	}

	.section-footer-text ul{
		margin-top: 10px;
	}

	.section-footer-text ul li{
		font-size: 18px;
		margin-right: 5px;
	}

	.section-footer-text ul li i{
		font-size: 16px;
	}

	.why-choose-us{
		padding: 60px 0;
	}

	.why-choose-us-cta-box{
		right: 30px;
		bottom: 30px;
	}

	.why-choose-counter-content h2{
		font-size: 34px;
	}

	.why-choose-country-flag-list ul li img{
		width: 50px;
		height: 50px;
	}

	.why-choose-us-content .section-footer-text{
		padding-top: 30px;
		margin-top: 30px;
	}

	.our-products{
		padding: 60px 0;
	}

	.product-box{
		padding: 30px;
	}

	.product-box .icon-box{
		margin-bottom: 30px;
	}

	.product-box .icon-box img{
		max-width: 60px;
	}

	.product-box-btn{
		margin-top: 20px;
		padding-top: 20px;
	}

	.our-products .company-supports-slider-box{
		margin-top: 30px;
	}

	.company-supports-content{
		margin-bottom: 30px;
	}

	.company-supports-slider{
		margin: 0;
	}

	.company-supports-logo img{
		max-width: 145px;
		height: 34px;
	}

	.our-product-qualities{
		padding: 60px 0;
	}

	.product-qualities-counter-box{
		padding: 20px;
		margin: 20px 20px 20px 0;
	}

	.product-qualities-counter-box h3{
		font-size: 30px;
	}

	.product-qualities-counter-box p{
		font-size: 18px;
		margin: 10px 0 0;
	}

	.product-qualities-item{
		padding: 20px;
	}

	.product-qualities-item-header{
		margin-bottom: 15px;
		padding-bottom: 15px;
	}

	.process-content-wap{
		padding: 20px;
	}

	.our-core-features{
		padding: 60px 0;
	}

	.core-features-cta-box{
		right: 30px;
		bottom: 30px;
		padding: 20px;
	}

	.core-features-cta-image img{
		max-width: 40px;
	}

	.core-features-cta-info{
		width: calc(100% - 55px);
	}

	.core-features-cta-info-header h3{
		width: 80px;
		font-size: 26px;
	}

	.core-features-cta-rating i{
		font-size: 16px;
	}

	.features-accordion .accordion-item{
		margin-bottom: 20px;
		padding-bottom: 20px;
	}

	.features-accordion .accordion-header .accordion-button{
		padding-bottom: 10px;
	}

	.core-features-btn{
		margin-top: 30px;
	}

	.cta-box{
		padding: 60px 0;
	}

	.cta-box-contact-content{
		padding-top: 30px;
	}

	.cta-box-contact-content h3{
		font-size: 26px;
	}

	.cta-box-counter-list{
		justify-content: start;
		padding-top: 30px;
        margin-top: 30px;
	}

	.cta-box-counter-item{
		width: calc(50% - 15px);
		justify-content: start;
	}

	.our-partners{
		background-size: 100% auto;
		padding: 60px 0;
	}

	.partners-item-counter-number h2{
		font-size: 44px;
		margin-bottom: -15px;
	}

	.partners-item:hover .partners-item-counter-number h2{
		transform: translateY(-7px);
	}

	.our-testimonials{
		padding: 60px 0;
	}

	.testimonial-item{
		gap: 20px;
	}

	.testimonial-item-rating{
		margin-bottom: 15px;
	}

	.testimonial-item-content p{
		font-size: 18px;
	}

	.testimonial-author-content{
		padding-top: 20px;
		margin-top: 20px;
	}

	.our-testimonials .section-footer-text{
		margin-top: 40px;
	}

	.our-blog{
		padding: 60px 0 30px;
	}

	.post-item .post-item-btn{
		padding-top: 20px;
		margin-top: 20px;
	}

	.main-footer{
		padding: 60px 0 0;
	}

	.about-footer-box{
		margin-bottom: 30px;
	}

	.about-footer-content{
		margin-top: 10px;
	}

	.footer-social-links{
		margin-top: 30px;
	}

	.footer-links h2{
		margin-bottom: 20px;
	}

	.footer-links ul li{
		margin-bottom: 15px;
	}

	.footer-newsletter-form p{
		margin-bottom: 20px;
	}

	.footer-newsletter-form .form-group .form-control{
		padding: 6px 20px 20px 0;
	}

	.footer-copyright-text{
		padding: 30px 0;
		margin-top: 30px;
	}

	.page-header{
		padding: 190px 0 100px;
	}

	.page-header-box h1{
		font-size: 44px;
		margin-bottom: 10px;
	}

	.our-values{
		padding: 60px 0;
	}

	.work-process{
		padding: 60px 0;
	}

	.work-process-item-list{
		gap: 40px 30px;
	}

	.work-process-item{
		gap: 20px;
	}

	.work-process-item-image{
		max-width: 200px;
		padding: 10px;
	}

	.work-process-item-step{
		padding: 7px 15px;
		margin-bottom: 15px;
	}

	.work-process .section-footer-text{
		margin-top: 40px;
	}

	.our-team{
		padding: 60px 0;
	}

	.team-item-body{
		padding: 20px;
	}

	.our-faqs{
		padding: 60px 0;
	}

	.faq-cta-box{
		padding: 20px;
	}

	.faq-cta-item{
		padding-bottom: 20px;
		margin-bottom: 20px;
	}

	.faq-cta-content{
		margin-top: 20px;
	}
	
	.faq-accordion .accordion-item{
		margin-bottom: 20px;
	}

	.faq-accordion .accordion-header .accordion-button{
		padding: 0 34px 20px 0;
	}

	.faq-accordion .accordion-item .accordion-button::after, 
	.faq-accordion .accordion-item .accordion-button.collapsed::after{
		font-size: 22px;
	}

	.faq-accordion .accordion-item .accordion-body{
		padding: 20px 0 0;
	}

	.page-events{
		padding: 60px 0 30px;
	}

	.event-item{
		min-height: 400px;
		padding: 30px;
	}

	.page-event-single{
		padding: 60px 0 30px;
	}

	.event-entry p{
		margin-bottom: 15px;
	}

	.event-info-item-list{
		margin-top: 30px;
	}

	.event-info-item{
		max-width: 60%;
	}

	.page-event-gallery{
		padding: 30px 0 60px;
	}

	.page-event-gallery-box{
		gap: 20px;
	}

	.page-event-gallery-box .photo-gallery{
		width: calc(25% - 15px);
	}

	.page-blog{
		padding: 60px 0;
	}

	.page-pagination{
		margin-top: 10px;
	}

	.page-single-post{
        padding: 60px 0;
    }
    
    .post-image{
        margin-bottom: 20px;
    }
    
    .post-entry h2{
        font-size: 38px;
    }
    
    .post-entry p{
        margin-bottom: 15px;
    }
    
    .post-entry ol li,
    .post-entry ul li{
		font-size: 16px;
        margin-bottom: 10px;
    }
    
    .post-entry blockquote{
        background-position: 20px 20px;
        background-size: 40px;
        padding: 20px 20px 20px 70px;
        margin-bottom: 20px;
    }
    
    .post-entry blockquote p{
        font-size: 18px;
    }
    
    .post-tags{
        margin-bottom: 20px;
    }
    
    .post-tags .tag-links a{
        padding: 12px 15px;
    }
    
    .post-social-sharing ul{
        text-align: left;
    }

	.page-team{
		padding: 60px 0 30px;
	}

	.page-team-single{
		padding: 60px 0;
	}

	.page-single-sidebar{
		position: initial;
		margin-bottom: 30px;
	}

	.team-single-image{
		margin-bottom: 30px;
	}

	.team-single-image img{
		aspect-ratio: 1 / 0.95;
	}

	.sidebar-cta-item{
		margin-bottom: 30px;
	}

	.sidebar-cta-item .icon-box{
		margin-bottom: 20px;
	}

	.team-member-about-content p{
		margin-bottom: 15px;
	}

	.team-member-contact-list{
		padding-top: 30px;
		margin-top: 30px;
	}

	.member-qualifications-item-year{
		margin-bottom: 20px;
	}

	.page-collection{
		padding: 60px 0 30px;
	}

	.page-products{
		padding: 60px 0;
	}

	.product-category-item-title{
		margin-bottom: 20px;
		padding-bottom: 20px;
	}

	.page-products .page-pagination{
		margin-top: 10px;
	}

	.our-trade{
		padding: 60px 0;
	}

	.our-trade-list ul li{
		margin-bottom: 10px;
	}

	.our-trade-list ul li::before{
		font-size: 16px;
	}

	.trade-content-btn{
		margin-top: 30px;
	}

	.our-global-clients{
		padding: 60px 0;
	}

	.global-clients-item-list{
		gap: 20px;
	}

	.global-client-item{
		padding: 6px 14px 6px 6px;
	}

	.global-client-item:first-child{
		margin-left: 50px;
	}

	.global-client-item figure img{
		max-width: 36px;
	}

	.our-global-clients .section-footer-text{
		margin-top: 40px;
	}

	.what-we-do{
		padding: 60px 0;
	}

	.what-we-item-list{
		gap: 30px 40px;
		margin-top: 40px;
	}

	.what-we-item{
		width: calc(50% - 20px);
	}

	.what-we-item::before{
		right: -20px;
	}

	.what-we-item:nth-child(2n + 2):before{
		display: none;
	}

	.what-we-item .icon-box{
		margin-bottom: 20px;
	}

	.what-we-item-content ul{
		margin: 20px 0 0;
		padding: 20px 0 0 20px;
	}

	.what-we-do .section-footer-text{
		margin-top: 40px;
	}

	.packaging-details{
		padding: 60px 0;
	}

	.page-pricing{
		padding: 60px 0;
	}

	.pricing-item{
		padding: 30px;
	}

	.pricing-item-header-box{
		margin-bottom: 20px;
	}

	.pricing-item-header{
		margin-bottom: 20px;
	}

	.pricing-item-price h2{
		font-size: 38px;
	}

	.pricing-item-list ul li{
		margin-bottom: 10px;
	}

	.pricing-item-list ul li::before{
		font-size: 16px;
	}

	.pricing-benefit-list{
		margin-top: 10px;
	}

	.pricing-benefit-list ul li img{
		max-width: 18px;
		margin-right: 10px;
	}

	.page-testimonials{
		padding: 60px 0 30px;
	}

	.page-gallery{
        padding: 60px 0 30px;
    }

	.page-video-gallery{
        padding: 60px 0 30px;
    }

	.page-faqs{
        padding: 60px 0;
    }

	.page-category-list{
		margin-bottom: 30px;
	}

	.page-category-list ul{
		padding: 20px;
	}

	.page-category-list ul li{
		padding-bottom: 15px;
		margin-bottom: 15px;
	}

    .page-faqs .page-single-faqs{
        margin-bottom: 40px;
    }

	.page-catalogue{
		padding: 60px 0 30px;
	}

	.page-contact-us{
		padding: 60px 0 30px;
	}

	.contact-info-box{
		background-position: right -15px bottom -15px;
		background-size: 80px auto;
		padding: 20px;
	}

	.contact-info-box-list{
		padding-top: 20px;
		margin-top: 20px;
	}

	.contact-us-form{
		padding: 30px;
	}

	.contact-form .form-control{
		padding: 17px 15px;
	}

	.google-map{
		padding: 30px 0 60px;
	}

	.google-map-iframe, .google-map-iframe iframe{
		height: 550px;
	}

	.error-page{
		padding: 60px 0px;
	}
	
	.error-page-image{
		margin-bottom: 20px;
	}
}

@media only screen and (max-width: 767px){

	.section-row{
		margin-bottom: 30px;
	}

	.section-title h1{
		font-size: 28px;
	}

	.section-title h2{
		font-size: 26px;
	}

	.hero-info-box{
		padding-top: 20px;
		margin-top: 20px;
	}

	.hero-info-box .hero-client-box{
		max-width: 100%;
	}

	.satisfy-client-image.add-more h3,
	.satisfy-client-image.add-more i{
		font-size: 18px;
	}

	.about-us-image-box-1 .about-us-image figure img{
        aspect-ratio: 1 / 1.44;
    }

	.about-us-image-box-2{
		padding-bottom: 30px;
	}

	.about-us-image-box-2 .about-us-image figure{
		margin-left: -134px;
	}

	.about-us-image-box-1 .contact-us-circle{
		top: 30px;
	}

	.contact-us-circle a img{
		max-width: 100px;
	}

	.about-us-body-content{
		width: 100%;
	}

	.skills-progress-bar{
		margin-bottom: 20px;
	}

	.skills-progress-bar .skill-data{
		margin-bottom: 10px;
	}

	.about-us-body-image{
		max-width: 100%;
	}

	.about-us-body-image figure,
	.about-us-body-image figure img{
		height: auto;
	}

	.about-us-body-image figure img{
		aspect-ratio: 1 / 0.8;
	}

	.collection-item{
		padding: 20px;
	}

	.collection-item-content h2{
		font-size: 18px;
	}

	.section-footer-text ul li{
		font-size: 16px;
	}

	.why-choose-us-image figure img{
		aspect-ratio: 1 / 1.1447;
	}

	.why-choose-us-cta-box{
		right: 15px;
		bottom: 15px;
		left: 15px;
		max-width: 100%;
		padding: 15px;
	}

	.why-choose-us-cta-box .satisfy-client-content{
		margin-top: 15px;
	}

	.why-choose-us-cta-box .satisfy-client-content p{
		font-size: 14px;
	}

	.why-choose-item{
		width: 100%;
		gap: 15px;
		padding: 20px;
	}

	.why-choose-item .satisfy-client-content p{
		font-size: 18px;
	}

	.why-choose-counter-content h2{
		font-size: 28px;
	}

	.why-choose-counter-content h3{
		font-size: 18px;
	}

	.why-choose-item-content{
		padding-top: 20px;
	}

	.why-choose-item.global-network-box{
		gap: 20px;
	}

	.why-choose-item-title h3{
		font-size: 18px;
	}

	.why-choose-country-flag-list{
		justify-content: initial;
		padding-top: 20px;
	}

	.why-choose-country-flag-list ul li img{
		width: 40px;
        height: 40px;
	}

	.product-box{
		padding: 20px;
	}

	.product-box .icon-box{
		margin-bottom: 20px;
	}

	.product-box-content h2{
		font-size: 18px;
	}

	.our-products .company-supports-slider-box{
		margin-top: 10px;
	}

	.company-supports-content{
		margin-bottom: 20px;
	}

	.company-supports-content hr{
		display: none;
	}

	.product-qualities-image-box{
		background-position: top 65px right 35px;
	}

	.product-qualities-image-box-1{
		width: 45%;
	}

	.product-qualities-image-box-1 .product-qualities-image figure{
    	margin-right: -85px;
	}

	.product-qualities-counter-box{
        padding: 10px;
        margin: 10px 10px 10px 0;
    }

	.product-qualities-counter-box h3{
        font-size: 24px;
    }

	.product-qualities-counter-box p{
		font-size: 16px;
        margin: 5px 0 0;
    }

	.product-qualities-image-box-2{
		width: 55%;
	}

	.product-qualities-item-list{
		gap: 20px;
	}

	.product-qualities-item{
		width: 100%;
	}

	.product-qualities-item-title h3{
		font-size: 18px;
	}

	.product-qualities-item-bg-image{
		right: -5px;
		bottom: -5px;
	}

	.product-qualities-item-bg-image .icon-box img{
		max-width: 40px;
	}

	.interactive-process-layout .interactive-process-item{
		width: 100%;
	}

	.interactive-process-layout .interactive-inner-process{
		padding: 100px 0 0;
	}

	.interactive-process-item-wap{
        transform: translateY(40px);
    }

	.interactive-process-item-content-wap h3{
		font-size: 18px;
	}

	.interactive-process-item-btn{
		margin-top: 20px;
	}

	.core-features-image figure img{
		aspect-ratio: 1 / 1.17;
	}

	.core-features-cta-box{
		right: 20px;
		bottom: 20px;
		left: 20px;
		padding: 15px;
	}

	.core-features-cta-info-header h3{
		width: 70px;
		font-size: 22px;
	}

	.our-core-features::before{
		right: -45px;
		bottom: -40px;
		width: 150px;
		height: 150px;
	}

	.features-accordion .accordion-header .accordion-button{
		font-size: 18px;
	}

	.features-accordion .accordion-header .accordion-button img{
		max-width: 20px;
		margin-right: 10px;
	}

	.features-accordion .accordion-item .accordion-button::after, 
	.features-accordion .accordion-item .accordion-button.collapsed::after{
		font-size: 18px;
	}

	.cta-box-contact-content h3{
		font-size: 22px;
	}

	.cta-box-counter-list{
		gap: 20px;
	}

	.cta-box-counter-item{
		width: 100%;
	}

	.cta-box-counter-item::before{
		display: none;
	}

	.cta-box-counter-item-content h2{
		font-size: 26px;
	}

	.partners-item{
		gap: 10px;
		padding: 20px;
	}

	.partners-item-counter-content h3{
		font-size: 18px;
	}

	.testimonial-item{
		padding: 20px;
	}

	.testimonial-item-rating i{
		font-size: 16px;
	}

	.testimonial-item-content p{
		font-size: 16px;
	}

	.testimonial-author-content h2{
		font-size: 18px;
	}

	.testimonial-author-content p{
		margin: 5px 0 0;
	}

	.post-item{
		min-height: 370px;
		padding: 20px;
	}

	.post-item .post-item-content h2{
		font-size: 18px;
	}

	.post-item .post-item-btn{
        padding-top: 15px;
        margin-top: 15px;
    }

	.footer-social-links{
		padding-top: 20px;
		margin-top: 20px;
	}

	.footer-social-links h2{
		font-size: 18px;
	}

	.footer-links{
		max-width: 100%;
	}

	.footer-links h2{
		font-size: 18px;
		margin-bottom: 15px;
	}

	.footer-links ul li{
		margin-bottom: 10px;
	}

	.footer-links.footer-newsletter-form{
		max-width: 100%;
		width: 100%;
	}

	.footer-policy-info-box{
		justify-content: center;
		text-align: center;
		gap: 10px;
	}

	.footer-policy-box-title{
		max-width: 100%;
		width: 100%;
	}

	.footer-policy-box-title h3{
		font-size: 18px;
	}

	.footer-copyright-text{
		padding: 15px 0;
	}

	.page-header-box h1{
		font-size: 28px;
	}

	.our-value-item-content{
		width: 100%;
	}

	.our-value-item-content h3{
		font-size: 18px;
	}

	.our-value-item-content ul{
		margin: 15px 0 0;
	}

	.our-value-item-content ul li{
		width: 100%;
	}

	.work-process-item-list{
        gap: 30px;
    }

	.work-process-item{
		width: 100%;
	}

	.work-process-item-content h3{
		font-size: 18px;
	}

	.team-item:hover .team-social-list{
		height: 52px;
		margin-bottom: 15px;
	}

	.team-social-list ul{
		padding: 0 0 15px;
	}

	.team-social-list ul li a{
		width: 36px;
		height: 36px;
	}

	.team-social-list ul li a i{
		font-size: 16px;
	}

	.faq-image figure img{
		aspect-ratio: 1 / 1.279;
	}

	.faq-cta-box{
		right: 10px;
		bottom: 10px;
		left: 10px;
		padding: 12px;
	}

	.faq-cta-item{
		padding-bottom: 15px;
		margin-bottom: 15px;
	}

	.faq-cta-item .icon-box,
	.faq-cta-contact-item .icon-box{
		width: 44px;
		height: 44px;
	}

	.faq-cta-item .icon-box img,
	.faq-cta-contact-item .icon-box img{
		max-width: 20px;
	}
	
	.faq-cta-content{
		margin-top: 15px;
    }
	
	.faq-cta-content h3,
	.faq-cta-contact-item-content h3{
		font-size: 18px;
	}

	.faq-cta-content p,
	.faq-cta-contact-item-content p{
		margin-top: 5px;
	}

	.faq-accordion .accordion-header .accordion-button{
		padding: 0 30px 15px 0;
	}

	.faq-accordion .accordion-item .accordion-button::after, 
	.faq-accordion .accordion-item .accordion-button.collapsed::after{
		font-size: 20px;
	}

	.faq-accordion .accordion-item .accordion-body{
		padding: 15px 0 0;
	}
	
	.event-item{
        padding: 20px;
    }

	.event-item-content{
		max-width: 100%;
	}

	.event-item-content h2{
		font-size: 18px;
	}

	.event-item-btn a{
		width: 42px;
		height: 42px;
	}

	.event-item-btn a img{
		max-width: 14px;
	}

	.event-info-item-content h2{
		font-size: 18px;
	}

	.event-info-item{
		width: 100%;
		max-width: 100%;
		border-right: none;
		padding-right: 0;
	}

	.page-event-gallery-box .photo-gallery{
        width: calc(50% - 10px);
    }

	.post-single-meta ol li,
	.post-single-meta ol li i{
		font-size: 16px;
	}

	.post-image img{
		aspect-ratio: 1 / 0.7;
	}

	.post-entry blockquote{
		padding: 65px 20px 20px 20px;
	}

	.post-entry blockquote p{
		font-size: 16px;
	}

	.post-entry h2{
		font-size: 26px;
	}

	.team-single-image img{
		aspect-ratio: 1 / 1.191;
	}

	.sidebar-cta-box{
		padding: 20px;
	}

	.sidebar-cta-item-content h2{
		font-size: 18px;
		padding-bottom: 15px;
		margin: 0 0 15px;
	}

	.sidebar-cta-contact-list ul li{
		padding: 8px 12px;
	}

	.team-member-about-content,
	.team-member-expertise,
	.contact-us-form.team-member-contact-form{
		padding: 20px;
	}

	.team-member-contact-item{
		width: 100%;
	}

	.team-member-contact-item-content h3{
		font-size: 18px;
	}

	.team-member-qualifications{
		padding: 20px;
	}

	.member-qualifications-item{
		width: 100%;
	}

	.member-qualifications-item-content h3{
		font-size: 18px;
	}

	.team-expertise-skills-list .skills-progress-bar .skill-data .skill-title{
		font-size: 18px;
	}

	.product-category-item-title{
		font-size: 18px;
        margin-bottom: 15px;
        padding-bottom: 15px;
    }

	.product-category-item ul li{
		margin-bottom: 15px;
	}

	.product-item-list{
		gap: 30px 20px;
	}

	.product-item{
        width: calc(50% - 10px);
    }

	.product-item-image{
		margin-bottom: 15px;
	}

	.product-item-content h2{
		font-size: 18px;
	}

	.our-trade-body{
		padding: 20px;
	}

	.trade-item-content{
		width: 100%;
	}

	.trade-item-content h3{
		font-size: 18px;
	}

	.global-clients-item-list{
		gap: 12px;
	}

	.global-client-item{
		gap: 6px;
		padding: 5px 10px 5px 5px;
	}

	.global-client-item:first-child{
		margin-left: 0;
	}

	.global-client-item figure img{
		max-width: 30px;
	}

	.global-client-item h3{
		font-size: 14px;
	}

	.what-we-item-list{
		padding: 20px;
	}

	.what-we-item{
		width: 100%;
	}

	.what-we-item::before{
		display: none;
	}

	.what-we-item .icon-box{
		margin-bottom: 20px;
	}

	.what-we-item-content h3{
		font-size: 18px;
	}

	.packaging-detail-content th,
	.packaging-detail-content td{
		height: 40px;
		padding: 15px;
	}

	.pricing-item{
		padding: 20px;
	}

	.pricing-item-title h2{
		font-size: 18px;
	}

	.pricing-item-price{
		margin-bottom: 15px;
		padding-bottom: 15px;
	}

	.pricing-item-price h2{
		font-size: 26px;
	}

	.pricing-item-price h2 sub{
		font-size: 14px;
	}

	.pricing-item-list h3{
		font-size: 18px;
		margin-bottom: 15px;
	}

	.pricing-benefit-list ul{
		gap: 10px 20px;
	}

	.pricing-benefit-list ul li{
		font-size: 14px;
	}

	.pricing-benefit-list ul li img{
		max-width: 16px;
		margin-right: 5px;
	}

	.catalogue-item-image{
		margin-bottom: 15px;
	}

	.catalogue-item-content h2{
		font-size: 18px;
	}

	.contact-info-box-header{
		gap: 10px;
	}

	.contact-info-box-title{
		width: calc(100% - 40px);
	}

	.contact-info-box-title h3{
		font-size: 18px;
	}

	.contact-info-box-list ul{
		gap: 10px;
	}

	.contact-us-form{
		padding: 20px;
	}

	.google-map-iframe, .google-map-iframe iframe{
		height: 350px;
	}
}

/************************************/
/***   35. Home - Version 2 css   ***/
/************************************/

header.main-header.main-header-gold{
	top: 0;
	left: 0;
	right: 0;
}

header.main-header.main-header-gold .header-sticky{
	max-width: 100%;
	background: transparent;
	border-bottom: 1px solid var(--dark-divider-color);
	border-radius: 0;
}

header.main-header.main-header-gold.active-sticky-header .header-sticky{
	top: 0;
	left: 0;
	right: 0;
	background: var(--primary-color);
}

header.main-header.main-header-gold .navbar{
	padding: 30px 0;
}

header.main-header.main-header-gold .main-menu ul li a{
	color: var(--white-color);
}

header.main-header.main-header-gold .main-menu ul li a:hover,
header.main-header.main-header-gold .main-menu ul li a:focus{
	color: var(--accent-secondary-color);
}

.hero-gold{
	position: relative;
	min-height: 780px;
	align-content: center;
    /* kaldırıldı (kopyalanmayan yer tutucu): hero-bg-image-gold.jpg — bkz. ozen-ek.css §12 */
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	padding: 285px 0 170px;
}

.hero-gold::before{
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: linear-gradient(0deg, rgba(29, 29, 29, 0.00) 82.42%, rgba(29, 29, 29, 0.80) 100%), linear-gradient(270deg, rgba(29, 29, 29, 0.00) 42.26%, rgba(29, 29, 29, 0.80) 78.56%);
	width: 100%;
	height: 100%;
	z-index: 1;
}

.hero-gold .container{
	position: relative;
	z-index: 2;
}

.hero-content-gold .section-title .section-sub-title{
	background-color: var(--dark-divider-color);
	backdrop-filter: blur(50px);
	-webkit-backdrop-filter: blur(50px);
	border: none;
	padding: 12px 20px 12px 35px;
}

.hero-content-gold .section-title h1{
	font-size: 70px;
}

.hero-content-footer-gold{
	border-top: 1px solid var(--dark-divider-color);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 20px 40px;
	padding-top: 40px;
}

.hero-content-footer-gold .hero-contact-box-gold{
	max-width: 240px;
}

.hero-contact-box-gold{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 15px;
}

.hero-contact-box-gold .icon-box{
	position: relative;
	width: 50px;
	height: 50px;
	background: var(--accent-secondary-color);
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	overflow: hidden;
}

.hero-contact-box-gold .icon-box::before{
	content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background: var(--white-color);
    border-radius: 50%;
    width: 100%;
    height: 100%;
    transform: scale(0);
    transition: all 0.4s ease-in-out;
    z-index: 0;
}

.hero-contact-box-gold:hover .icon-box::before{
	transform: scale(1);
}

.hero-contact-box-gold .icon-box img{
	position: relative;
    width: 100%;
    max-width: 24px;
    z-index: 1;
	transition: all 0.4s ease-in-out;
}

.hero-contact-box-gold:hover .icon-box img{
	filter: brightness(0) invert(0);
}

.hero-contact-box-content-gold{
	width: calc(100% - 65px);
}

.hero-contact-box-content-gold h2{
	font-size: 20px;
	line-height: 1.3em;
	color: var(--white-color);
}

.hero-contact-box-content-gold p{
	color: var(--white-color);
	margin: 5px 0 0;
}

.hero-contact-box-content-gold p a{
	color: inherit;
	transition: all 0.4s ease-in-out;
}

.hero-contact-box-content-gold p a:hover{
	color: var(--accent-secondary-color);
}

.about-us-gold{
	padding: 120px 0;
}

.about-us-image-box-gold{
	height: 100%;
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
	margin-right: 15px;
}

.about-us-image-box-1-gold{
	width: calc(48% - 15px);
	display: flex;
	flex-direction: column;
	gap: 30px;
}

.about-us-image-gold{
	height: 100%;
}

.about-us-image-gold figure{
	display: block;
	height: 100%;
	border-radius: 4px;
}

.about-us-image-gold figure img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 4px;
}

.about-us-image-box-1-gold .about-us-image-gold figure img{
	aspect-ratio: 1 / 1.072;
}

.about-us-image-box-2-gold{
	position: relative;
	width: calc(52% - 15px);
}

.about-us-image-box-2-gold .about-us-image-gold figure img{
	aspect-ratio: 1 / 2.07;
}

.about-us-image-box-2-gold .learn-more-circle-gold{
	position: absolute;
	top: 50px;
	left: -15px;
	transform: translateX(-50%);
	z-index: 1;
}

.learn-more-circle-gold a{
	display: inline-block;
    border-radius: 50%;
}

.learn-more-circle-gold a img{
	width: 100%;
    max-width: 170px;
    border-radius: 50%;
    animation: infiniterotate 20s infinite linear;
}

.learn-more-circle-gold a:hover img{
	animation-play-state: paused;
}

.about-us-content-gold{
	height: 100%;
	align-content: center;
}

.about-us-item-gold{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 15px;
	margin-bottom: 30px;
}

.about-us-item-gold:last-child{
	margin-bottom: 0;
}

.about-us-item-gold .icon-box{
	position: relative;
	width: 60px;
	height: 60px;
	background: var(--accent-color);
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	overflow: hidden;
}

.about-us-item-gold .icon-box::before{
	content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background: var(--primary-color);
    border-radius: 50%;
    width: 100%;
    height: 100%;
    transform: scale(0);
    transition: all 0.4s ease-in-out;
    z-index: 0;
}

.about-us-item-gold:hover .icon-box::before{
	transform: scale(1);
}

.about-us-item-gold .icon-box img{
	position: relative;
    width: 100%;
    max-width: 30px;
    z-index: 1;
}

.about-us-item-content-gold{
	width: calc(100% - 75px);
}

.about-us-item-content-gold h3{
	font-size: 16px;
	line-height: 1.6em;
}

.about-us-body-gold{
	border-top: 1px solid var(--divider-color);
	display: flex;
	flex-wrap: wrap;
	gap: 25px 7.292vw;
	padding-top: 40px;
	margin-top: 40px;
}

.about-us-body-list-gold{
	position: relative;
	align-content: center;
	width: calc(65% - 3.646vw);
}

.about-us-body-list-gold::before{
	content: '';
	position: absolute;
	top: 0;
	right: -3.646vw;
	background: var(--divider-color);
	transform: rotate(10deg);
	width: 1px;
	height: 100%;
}

.about-us-body-list-gold ul{
	list-style: none;
	padding: 0;
	margin: 0;
}

.about-us-body-list-gold ul li{
	position: relative;
	line-height: 1.5em;
	padding-left: 25px;
	margin-bottom: 15px;
}

.about-us-body-list-gold ul li:last-child{
	margin-bottom: 0;
}

.about-us-body-list-gold ul li::before{
	content: '\f058';
    position: absolute;
    font-family: 'Font Awesome 7 Free';
    font-size: 18px;
    font-weight: 900;
    color: var(--accent-color);
    top: 0;
    left: 0;
}

.about-us-client-box-gold{
	width: calc(35% - 3.646vw);
	text-align: center;
}

.about-us-client-image-gold{
	margin-bottom: 20px;
}

.about-us-client-image-gold figure{
	display: inline-block;
	max-width: 60px;
	border-radius: 4px;
}

.about-us-client-image-gold img{
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	border-radius: 4px;
}

.about-us-client-content-gold h3{
	font-size: 20px;
}

.about-us-client-content-gold p{
	margin: 5px 0 0;
}

.our-collection-gold{
	background: var(--secondary-color) url('/assets/images/section-bg-1.png') no-repeat;
    background-position: bottom right;
    background-size: auto;
    padding: 120px 0;
}

.collection-item-gold{
	position: relative;
	background-color: var(--bg-color);
	border-radius: 4px;
	height: calc(100% - 30px);
	padding: 40px;
	margin-bottom: 30px;
}

.collection-item-gold::before{
	content: '';
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 0;
	background: var(--accent-color);
	border-radius: 4px;
	transition: all 0.4s ease-in-out;
}

.collection-item-gold:hover:before{
	height: 100%;
}

.collection-item-image-gold{
	margin-bottom: 40px;
}

.collection-item-image-gold a,
.collection-item-image-gold figure{
	display: block;
	max-width: 150px;
	border-radius: 4px;
}

.collection-item-image-gold figure img{
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	border-radius: 4px;
	transition: all 0.6s ease-in-out;
}

.collection-item-gold:hover .collection-item-image-gold figure img{
	transform: scale(1.04);
}

.collection-item-body-gold{
	position: relative;
	z-index: 1;
}

.collection-item-content-gold h2{
	font-size: 20px;
	transition: all 0.4s ease-in-out;
}

.collection-item-content-gold h2 a{
	color: inherit;
}

.collection-item-content-gold p{
	margin: 10px 0 0;
	transition: all 0.4s ease-in-out;
}

.collection-item-btn-gold{
	border-top: 1px solid var(--divider-color);
	padding-top: 20px;
	margin-top: 20px;
	transition: all 0.4s ease-in-out;
}

.collection-item-gold:hover .collection-item-btn-gold{
	border-color: var(--dark-divider-color);
}

.collection-item-btn-gold .readmore-btn{
	color: var(--primary-color);
	transition: all 0.3s ease-in-out;
}

.collection-item-gold:hover .collection-item-content-gold p,
.collection-item-gold:hover .collection-item-content-gold h2,
.collection-item-gold:hover .collection-item-btn-gold .readmore-btn{
	color: var(--white-color);
}

.collection-item-btn-gold .readmore-btn::before{
	background-image: url('/assets/images/arrow-primary.svg');
	transition: all 0.3s ease-in-out;
}

.collection-item-gold:hover .collection-item-btn-gold .readmore-btn::before{
	background-image: url('/assets/images/arrow-white.svg');
}

.what-we-do-gold{
	padding: 120px 0;
}

.what-we-counter-list-gold{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 30px 60px;
}

.what-we-counter-item-gold{
	position: relative;
	width: calc(33.33% - 40px);
	text-align: center;
}

.what-we-counter-item-gold::before{
	content: '';
	position: absolute;
	top: 0;
	right: -30px;
	transform: rotate(8deg);
	width: 1px;
	height: 100%;
	background: var(--divider-color)
}

.what-we-counter-item-gold:nth-child(3n + 3):before,
.what-we-counter-item-gold:last-child:before{
	display: none;
}

.what-we-counter-item-gold h2{
	font-size: 48px;
	line-height: 1em;
}

.what-we-counter-item-gold p{
	margin: 10px 0 0;
}

.what-we-content-footer-gold{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 20px 40px;
	border-top: 1px solid var(--divider-color);
	padding-top: 40px;
	margin-top: 40px;
}

.what-we-client-box-gold{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 15px;
}

.what-we-client-review-gold{
	margin-bottom: 5px;
}

.what-we-client-review-gold i{
	font-size: 14px;
	color: var(--accent-secondary-color);
}

.what-we-client-content-gold{
	margin-top: 5px;
}

.what-we-client-content-gold p{
	margin-bottom: 0;
}

.what-we-client-content-gold p span{
	font-weight: 600;
	color: var(--primary-color);
	margin-right: 5px;
}

.what-we-do-image-box-gold{
	position: relative;
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
}

.what-we-image-box-1-gold{
	width: calc(41% - 10px);
}

.what-we-image-gold figure{
	position: relative;
	display: block;
    mask-image: url('/assets/images/what-we-do-image-bg-shape-gold.svg');
    background-image: url('/assets/images/what-we-do-image-bg-shape-gold.svg');
    mask-size: cover;
    mask-position: center center;
    mask-repeat: no-repeat;
    width: 100%;
    height: 100%;
	border-radius: 4px;
}

.what-we-image-gold figure img{
	width: 100%;
	aspect-ratio: 1 / 1.546;
	object-fit: cover;
	border-radius: 4px;
}

.what-we-image-box-1-gold .what-we-image-gold{
	margin-right: -111px;
}

.what-we-do-image-box-gold .learn-more-circle-gold{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
	z-index: 2;
}

.what-we-do-image-box-gold .learn-more-circle-gold a{
	border: 10px solid var(--bg-color);
}

.what-we-image-box-2-gold{
	position: relative;
	width: calc(59% - 10px);
}

.what-we-image-box-2-gold::before{
	content: '';
	position: absolute;
	top: 50%;
	right: 30px;
	transform: translateY(-50%) rotate(12deg);
	background: var(--accent-color);
	border-radius: 4px;
	width: 60px;
	height: 280px;
}

.intro-video-box-gold{
	position: relative;
	/* kaldırıldı (kopyalanmayan yer tutucu): intro-video-bg-image-gold.jpg — bkz. ozen-ek.css §12 */
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	height: 100%;
	min-height: 46.875vw;
	align-content: end;
	text-align: center;
	padding: 0 2.083vw;
}

.intro-video-box-gold .container-fluid{
	padding: 0;
}

.intro-video-box-gold::before{
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: linear-gradient(180deg, rgba(29, 29, 29, 0.00) 0%, rgba(29, 29, 29, 0.80) 83.64%);
	width: 100%;
	height: 100%;
}

.intro-video-body-gold{
	position: relative;
	min-height: 28.646vw;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 30px;
	text-align: center;
	z-index: 1;
}

.intro-video-body-gold .video-play-button-gold a{
	font-family: var(--accent-font);
	width: 120px;
	height: 120px;
	font-size: 20px;
	font-weight: 500;
	background-color: var(--dark-divider-color);
	border-radius: 50%;
	backdrop-filter: blur(30px);
	-webkit-backdrop-filter: blur(30px);
	color: var(--white-color);
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
	transition: all 0.4s ease-in-out;
}

.video-play-button-gold a:hover{
	background-color: var(--accent-secondary-color);
	color: var(--primary-color);
}

.intro-video-title-box-gold h2{
	font-size: 10.417vw;
	font-weight: 600;
	text-transform: uppercase;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.30) 0%, rgba(255, 255, 255, 0.00) 100%);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	user-select: none;
}

.our-product-gold{
	background-image: url("/assets/images/section-bg-2.png");
	background-position: bottom left;
	background-repeat: repeat-x;
	background-size: auto;
	padding: 120px 0;
}

.product-box-gold{
	background-color: var(--secondary-color);
	border-radius: 4px;
	padding: 10px;
	height: calc(100% - 30px);
	margin-bottom: 30px;
}

.product-box-image-gold{
	margin-bottom: 10px;
}

.product-box-image-gold a,
.product-box-image-gold figure{
	display: block;
	border-radius: 4px;
}

.product-box-image-gold figure img{
	width: 100%;
	aspect-ratio: 1 / 0.915;
	object-fit: cover;
	border-radius: 4px;
	transition: all 0.6s ease-in-out;
}

.product-box-gold:hover .product-box-image-gold figure img{
	transform: scale(1.06);
}

.product-box-body-gold{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	gap: 15px;
	padding: 20px;
}

.product-box-content-gold{
	width: calc(100% - 55px);
}

.product-box-content-gold h2{
	font-size: 20px;
	line-height: 1.4em;
}

.product-box-content-gold a{
	color: inherit;
}

.product-box-btn-gold a{
	width: 40px;
	height: 40px;
	background-color: var(--accent-secondary-color);
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	transition: all 0.4s ease-in-out;
}

.product-box-btn-gold a:hover{
	background: var(--accent-color);
}

.product-box-btn-gold a img{
	width: 100%;
	max-width: 14px;
	transition: all 0.4s ease-in-out;
}

.product-box-btn-gold a:hover img{
	transform: rotate(45deg);
}

.our-surfaces-gold .container-fluid{
	padding: 0;
}

.surfaces-item-slider-gold{
    position: relative;
	height: 100%;
}

.surfaces-img-slider-gold .swiper-wrapper{
	height: 100%;
}

.surfaces-img-slider-gold,
.surfaces-img-slider-gold .swiper-slide{
	height: 100%;
}

.surfaces-img-slider-gold .swiper-slide figure{
    display: block;
	height: 100%;
}

.surfaces-img-slider-gold .swiper-slide img{
    width: 100%;
	height: 100%;
    aspect-ratio: 1 / 0.957;
    object-fit: cover;
}

.surfaces-img-item-gold{
    position: absolute;
	right: 10px;
    bottom: 10px;
    max-width: 220px;
	background-color: var(--divider-color);
	border-radius: 4px;
	backdrop-filter: blur(30px);
	-webkit-backdrop-filter: blur(30px);
	padding: 10px;
	z-index: 1;
}

.surfaces-img-item-gold .swiper-slide figure{
	display: block;
}

.surfaces-img-item-gold .swiper-slide img{
    width: 60px;
    height: 60px;
    object-fit: cover;
    border-radius: 4px;
}

.surfaces-img-item-gold .swiper-slide{
}

.surfaces-content-box-gold{
	background-image: url('/assets/images/dark-section-bg-image-2.png');
	height: 100%;
	align-content: center;
	padding: 100px 5.208vw;
}

.surfaces-item-list-gold{
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
}

.surfaces-item-gold{
	position: relative;
	width: calc(33.33% - 20px);
	background-color: var(--dark-divider-color);
	backdrop-filter: blur(30px);
	-webkit-backdrop-filter: blur(30px);
	border-radius: 4px;
	padding: 30px;
	overflow: hidden;
}

.surfaces-item-gold::before{
	content: '';
    position: absolute;
    top: 0;
	right: 0;
	bottom: 0;
    left: auto;
    background: var(--accent-secondary-color);
    border-radius: 4px;
    width: 0;
    height: 100%;
    transition: all 0.4s ease-in-out;
}

.surfaces-item-gold:hover:before{
	width: 100%;
	left: 0;
}

.surfaces-item-gold .icon-box,
.surfaces-item-title-gold{
	position: relative;
	z-index: 1;
}

.surfaces-item-gold .icon-box{
	margin-bottom: 20px;
}

.surfaces-item-gold .icon-box img{
	width: 100%;
	max-width: 30px;
	transition: all 0.4s ease-in-out;
}

.surfaces-item-gold:hover .icon-box img{
	filter: brightness(0) invert(0);
}

.surfaces-item-title-gold h3{
	font-size: 20px;
	color: var(--white-color);
	transition: all 0.4s ease-in-out;
}

.surfaces-item-gold:hover .surfaces-item-title-gold h3{
	color: var(--primary-color);
}

.surfaces-footer-box-gold{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 20px 40px;
	margin-top: 50px;
}

.surfaces-footer-contact-box-gold{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 15px;
}

.our-features-gold{
	background-image: url("/assets/images/section-bg-3.png");
	background-position: bottom -180px center;
	background-repeat: no-repeat;
	background-size: auto;
	padding: 120px 0;
}

.feaures-content-gold p:last-child{
	margin: 0;
}

.features-item-list-gold{
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
	margin-top: 40px;
}

.features-item-gold{
	width: calc(50% - 15px);
	background-color: var(--secondary-color);
	border-radius: 4px;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 15px;
	padding: 30px 25px;
	transition: all 0.4s ease-in-out;
}

.features-item-gold:hover{
	background-color: var(--accent-color);
}

.features-item-gold .icon-box img{
	width: 100%;
	max-width: 30px;
	transition: all 0.4s ease-in-out;
}

.features-item-gold:hover .icon-box img{
	filter: brightness(0) invert(1);
}

.features-item-content-gold{
	width: calc(100% - 45px);
}

.features-item-content-gold h3{
	font-size: 20px;
	line-height: 1.4em;
	transition: all 0.4s ease-in-out;
}

.features-item-gold:hover .features-item-content-gold h3{
	color: var(--white-color);
}

.features-image-gold{
	margin-left: 15px;
}

.features-image-gold figure{
	display: block;
	border-radius: 4px;
}

.features-image-gold figure img{
	width: 100%;
	aspect-ratio: 1 / 0.893;
	object-fit: cover;
	border-radius: 4px;
}

.cta-box-gold{
	padding: 120px 0;
}

.cta-box-content-gold{
	position: relative;
    text-align: center;
    max-width: 800px;
    margin: 0 auto;
}

.cta-box-content-gold::before,
.cta-box-content-gold::after{
	content: '';
	display: block;
	position: absolute;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	animation: infiniterotate 20s infinite linear alternate;
	z-index: 0;
}

.cta-box-content-gold::before{
    top: 0;
	left: -15.625vw;
    background-image: url('/assets/images/cta-box-image-1-gold.png');
    width: 120px;
    height: 120px;
}

.cta-box-content-gold::after{
    right: -15.625vw;
	bottom: 0;
    background-image: url('/assets/images/cta-box-image-2-gold.png');
    width: 135px;
    height: 135px;
}

.cta-box-content-gold .section-title,
.cta-box-newsletter-form-gold{
	position: relative;
	z-index: 1;
}

.cta-box-content-gold .section-title{
	margin-bottom: 60px;
}

.cta-box-content-gold .section-title p{
	max-width: 610px;
	margin-left: auto;
	margin-right: auto;
}

.cta-box-newsletter-form-gold{
	width: 100%;
	max-width: 600px;
	margin: 0 auto;
}

.cta-box-newsletter-form-gold .form-group{
	display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--dark-divider-color);
    backdrop-filter: blur(30px);
    -webkit-backdrop-filter: blur(30px);
    border-radius: 100px;
    padding: 5px;
}

.cta-box-newsletter-form-gold .form-group .form-control{
	width: auto;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.4em;
    color: var(--white-color);
    background: transparent;
    border: none;
    border-radius: 0;
	flex-grow: 1;
    outline: none;
    box-shadow: none;
    padding: 5px 20px;
}

.cta-box-newsletter-form-gold .form-group .form-control::placeholder{
	color: var(--text-color);
}

.our-global-network-gold{
	background-image: url("/assets/images/network-bg-image-gold.png");
	background-repeat: no-repeat;
	background-position: center right -60px;
	background-size: 780px auto;
	padding: 120px 0;
}

.network-content-gold{
	display: flex;
	flex-direction: column;
	height: 100%;
	margin-right: 15px;
}

.network-image-gold{
	height: 100%;
}

.network-image-gold figure{
	height: 100%;
	display: block;
	border-radius: 4px;
}

.network-image-gold figure img{
	width: 100%;
	height: 100%;
	aspect-ratio: 1 / 0.695;
	object-fit: cover;
	border-radius: 4px;
}

.network-item-list-gold{
	height: 100%;
	display: flex;
	flex-wrap: wrap;
	align-content: center;
	gap: 30px;
}

.network-item-gold{
	position: relative;
	width: calc(50% - 15px);
	background-color: var(--white-color);
	border-radius: 4px;
	padding: 30px;
	overflow: hidden;
}

.network-item-gold::before{
	content: '';
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 0;
	background: var(--accent-color);
	border-radius: 4px;
	transition: all 0.4s ease-in-out;
}

.network-item-gold:hover:before{
	height: 100%;
}

.network-item-gold .icon-box,
.network-item-content-gold{
	position: relative;
	z-index: 1;
}

.network-item-gold .icon-box img{
	width: 100%;
	max-width: 60px;
}

.network-item-content-gold{
	border-top: 1px solid var(--divider-color);
	padding-top: 40px;
	margin-top: 40px;
	transition: all 0.4s ease-in-out;
}

.network-item-gold:hover .network-item-content-gold{
	border-color: var(--dark-divider-color);
}

.network-item-content-gold h2{
	font-size: 48px;
	transition: all 0.4s ease-in-out;
}

.network-item-content-gold p{
	font-size: 20px;
	font-weight: 500;
	color: var(--primary-color);
	margin: 5px 0 0;
	transition: all 0.4s ease-in-out;
}

.network-item-gold:hover .network-item-content-gold h2,
.network-item-gold:hover .network-item-content-gold p{
	color: var(--white-color);
}

.our-testimonials-gold{
	position: relative;
	background-color: var(--secondary-color);
	padding: 120px 0;
	overflow: hidden;
}

.our-testimonials-gold::before{
	content: '';
	position: absolute;
	right: -8.854vw;
    bottom: -6.771vw;
    width: 23.438vw;
    height: 26.042vw;
	background-image: url('/assets/images/section-bg-4.png');
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	transform: rotate(7deg);
	z-index: 0;
}

.our-testimonials-gold .container{
	position: relative;
	z-index: 1;
}

.testimonial-slider-gold .swiper-wrapper{
}

.testimonial-item-gold{
	background-color: var(--bg-color);
	border-radius: 4px;
	padding: 40px;
	transition: all 0.6s ease-in-out;
}

.testimonial-slider-gold .swiper-wrapper .testimonial-item-gold{
	transform: scale(0.95);
}

.testimonial-slider-gold .swiper-wrapper .swiper-slide.swiper-slide-next .testimonial-item-gold{
	transform: scale(1);
}

.testimonial-author-image-gold{
	margin-bottom: 40px;
}

.testimonial-author-image-gold figure{
	display: inline-block;
	border-radius: 4px;
}

.testimonial-author-image-gold figure img{
	width: 100%;
	max-width: 60px;
	border-radius: 4px;
}

.testimonial-item-content-gold p:last-child{
	margin-bottom: 0;
}

.testimonial-item-footer-gold{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 15px;
	border-top: 1px solid var(--divider-color);
	padding-top: 40px;
	margin-top: 40px;
}

.testimonial-author-content-gold{
	width: 55%;
}

.testimonial-author-content-gold h2{
	font-size: 20px;
}

.testimonial-author-content-gold p{
	margin: 5px 0 0;
}

.testimonial-item-rating-gold i{
	color: var(--accent-secondary-color);
}

.our-testimonials-gold .section-footer-text{
	margin-top: 60px;
}

.main-footer-gold{
	padding: 120px 0 0;
}

.about-footer-gold{
	max-width: 300px;
}

.footer-logo-gold img{
	width: 100%;
	max-width: 126px;
}

.about-footer-content-gold{
	margin-top: 40px;
}

.about-footer-content-gold p{
	color: var(--white-color);
	margin-bottom: 0;
}

.footer-links-box-gold{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 30px 5.208vw;
}

.footer-links-gold{
	position: relative;
}

.footer-links-gold::before{
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    right: -2.604vw;
    background: var(--dark-divider-color);
    width: 1px;
    height: 100%;
}

.footer-links-gold:last-child::before{
	display: none;
}

.footer-quick-links-gold{
	width: calc(26% - 3.472vw);
}

.footer-event-links-gold{
	width: calc(34% - 3.472vw);
}

.footer-links-gold h2{
	font-size: 20px;
	color: var(--white-color);
	margin-bottom: 30px;
}

.footer-links-gold ul{
	list-style: none;
	margin: 0;
	padding: 0;
}

.footer-links-gold ul li{
	line-height: 1.4em;
	color: var(--white-color);
	margin-bottom: 15px;
}

.footer-links-gold ul li:last-child{
	margin-bottom: 0;
}

.footer-links-gold ul li a{
	color: inherit;
	transition: all 0.4s ease-in-out;
}

.footer-links-gold ul li a:hover{
	color: var(--accent-secondary-color);
}

.footer-contact-box-gold{
	width: calc(40% - 3.472vw);
}

.footer-links-gold.footer-contact-box-gold ul li{
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 20px;
}

.footer-links-gold.footer-contact-box-gold ul li:last-child{
	margin-bottom: 0;
}

.footer-contact-box-gold ul li img{
	width: 100%;
	max-width: 20px;
}

.footer-cta-box-gold{
	background-color: var(--dark-divider-color);
	border-radius: 100px;
	backdrop-filter: blur(30px);
	-webkit-backdrop-filter: blur(30px);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	margin-top: 60px;
	padding: 20px;
}

.footer-cta-box-gold .section-title{
	max-width: 73%;
	margin: 0 0 0 20px;
}

.footer-copyright-text-gold{
	text-align: center;
	padding: 60px 0;
}

.footer-copyright-text-gold p{
	color: var(--white-color);
	margin-bottom: 0;
}

@media only screen and (max-width: 1440px){

	.surfaces-content-box-gold{
		padding: 100px 3.472vw;
	}
}

@media only screen and (max-width: 1024px){

	.hero-gold::before{
		background: var(--primary-color);
        opacity: 60%;
	}

	.about-us-image-box-gold{
		height: auto;
		max-width: 740px;
		margin: 0 auto 30px;
	}

	.about-us-content-gold{
		height: auto;
	}

	.what-we-do-content-gold{
		margin-bottom: 30px;
	}

	.what-we-do-image-box-gold{
		max-width: 640px;
		margin: 0 auto;
	}

	.intro-video-box-gold{
		min-height: 600px;
	}

	.intro-video-body-gold{
		min-height: 370px;
	}

	.intro-video-body-gold .video-play-button-gold a{
		width: 100px;
		height: 100px;
	}

	.surfaces-item-slider-gold,
	.surfaces-img-slider-gold,
	.surfaces-img-slider-gold .swiper-wrapper,
	.surfaces-img-slider-gold .swiper-slide,
	.surfaces-img-slider-gold .swiper-slide figure{
		height: auto;
	}

	.surfaces-img-slider-gold .swiper-slide img{
		height: auto;
		aspect-ratio: 1 / 0.67;
	}

	.surfaces-content-box-gold{
		padding: 100px 15px;
		height: auto;
	}

	.feaures-content-box-gold{
		margin-bottom: 30px;
	}

	.features-image-gold{
		max-width: 740px;
		margin: 0 auto;
	}

	.cta-box-content-gold::before,
	.cta-box-content-gold::after{
		width: 95px;
		height: 95px;
		opacity: 30%;
	}

	.cta-box-content-gold::before{
		left: -90px;
	}

	.cta-box-content-gold::after{
		right: -80px;
	}

	.network-content-gold{
		height: auto;
		margin: 0 0 30px;
	}

	.network-image-gold,
	.network-image-gold figure,
	.network-image-gold figure img,
	.network-item-list-gold{
		height: auto;
	}

	.our-testimonials-gold::before{
		opacity: 30%;
	}

	.testimonial-slider-gold .swiper-wrapper .testimonial-item-gold{
		transform: scale(1);
	}

	.about-footer-gold{
		max-width: 100%;
		margin-bottom: 30px;
	}

	.about-footer-content-gold{
		margin-top: 10px;
	}
}

@media only screen and (max-width: 991px){

	header.main-header.main-header-gold .navbar{
		padding: 20px 0;
	}

	.hero-gold{
        padding: 150px 0 60px;
    }

	.hero-content-gold .section-title .section-sub-title{
		padding: 8px 14px 8px 29px;
	}

	.hero-content-gold .section-title .section-sub-title::before{
		left: 14px;
	}

	.hero-content-gold .section-title h1{
		font-size: 48px;
	}

	.hero-content-footer-gold{
		gap: 20px 30px;
		padding-top: 30px;
	}

	.hero-contact-box-gold .icon-box{
		width: 44px;
		height: 44px;
	}

	.hero-contact-box-gold .icon-box img{
		max-width: 22px;
	}

	.hero-contact-box-content-gold{
		width: calc(100% - 59px);
	}

	.hero-contact-box-content-gold h2{
		font-size: 18px;
	}

	.about-us-gold{
		padding: 60px 0;
	}

	.learn-more-circle-gold a img{
		max-width: 130px;
	}

	.about-us-item-gold .icon-box{
		width: 50px;
		height: 50px;
	}

	.about-us-item-gold .icon-box img{
		max-width: 24px;
	}

	.about-us-item-content-gold{
		width: calc(100% - 65px);
	}

	.about-us-body-gold{
		padding-top: 30px;
		margin-top: 30px;
	}

	.about-us-body-list-gold ul li{
		margin-bottom: 10px;
	}

	.about-us-body-list-gold ul li::before{
		font-size: 16px;
	}

	.about-us-client-image-gold figure{
		max-width: 50px;
	}

	.our-collection-gold{
		background-size: 300px auto;
		padding: 60px 0;
	}

	.collection-item-gold{
		padding: 30px;
	}

	.collection-item-image-gold{
		margin-bottom: 30px;
	}

	.collection-item-image-gold a,
	.collection-item-image-gold figure{
		max-width: 130px;
	}

	.what-we-do-gold{
		padding: 60px 0;
	}

	.what-we-counter-item-gold h2{
		font-size: 36px;
	}

	.what-we-content-footer-gold{
		padding-top: 30px;
		margin-top: 30px;
	}

	.what-we-content-footer-gold .satisfy-client-image figure img{
		max-width: 44px;
	}

	.what-we-do-image-box-gold .learn-more-circle-gold a{
		border-width: 5px;
	}

	.our-product-gold{
		background-size: 50% auto;
		padding: 60px 0;
	}

	.product-box-body-gold{
		padding: 10px;
	}

	.surfaces-content-box-gold{
		padding: 60px 15px;
	}

	.surfaces-item-list-gold{
		gap: 20px;
	}

	.surfaces-item-gold{
		width: calc(33.33% - 13.33px);
		padding: 20px;
	}

	.surfaces-footer-box-gold{
		margin-top: 30px;
	}

	.our-features-gold{
		background-size: 100% auto;
		padding: 60px 0;
	}

	.features-item-list-gold{
		gap: 20px;
		margin-top: 30px;
	}

	.features-item-gold{
		width: calc(50% - 10px);
		padding: 20px;
		gap: 10px;
	}

	.features-item-gold .icon-box img{
		max-width: 24px;
	}

	.features-item-content-gold{
		width: calc(100% - 34px);
	}

	.cta-box-gold{
		padding: 60px 0;
	}

	.cta-box-content-gold::before{
        left: 0;
    }

	.cta-box-content-gold::after{
        right: 0;
    }

	.cta-box-content-gold .section-title{
		margin-bottom: 40px;
	}

	.our-global-network-gold{
		padding: 60px 0;
		background-size: 450px auto;
	}

	.network-content-gold{
		margin: 0 0 30px;
		height: auto;
	}

	.network-item-content-gold{
		padding-top: 30px;
		margin-top: 30px;
	}

	.network-item-gold .icon-box img{
		max-width: 50px;
	}

	.network-item-content-gold h2{
		font-size: 38px;
	}

	.network-item-content-gold p{
		font-size: 18px;
	}

	.our-testimonials-gold{
		padding: 60px 0;
	}

	.testimonial-item-gold{
		padding: 20px;
	}

	.testimonial-author-image-gold{
		margin-bottom: 30px;
	}

	.testimonial-author-image-gold figure img{
		max-width: 50px;
	}

	.testimonial-item-footer-gold{
		padding-top: 30px;
		margin-top: 30px;
	}

	.our-testimonials-gold .section-footer-text{
		margin-top: 40px;
	}

	.main-footer-gold{
		padding: 60px 0 0;
	}

	.footer-links-gold h2{
		margin-bottom: 20px;
	}

	.footer-links-gold ul li{
		margin-bottom: 10px;
	}

	.footer-links-gold.footer-contact-box-gold ul li{
		margin-bottom: 15px;
	}

	.footer-cta-box-gold{
		justify-content: center;
		border-radius: 10px;
		margin-top: 30px;
	}

	.footer-cta-box-gold .section-title{
		max-width: 100%;
		margin: 0;
	}

	.footer-copyright-text-gold{
		padding: 30px 0;
	}
}

@media only screen and (max-width: 767px){

	.hero-content-gold .section-title h1{
		font-size: 28px;
	}

	.hero-content-footer-gold{
		gap: 20px;
	}

	.hero-contact-box-content-gold h2{
		font-size: 16px;
	}

	.about-us-image-box-gold{
		gap: 20px;
	}

	.about-us-image-box-1-gold{
		width: calc(48% - 10px);
		gap: 20px;
	}

	.about-us-image-box-2-gold{
		width: calc(52% - 10px);
	}

	.about-us-image-box-2-gold .learn-more-circle-gold{
		top: 25px;
		left: -10px;
	}

	.learn-more-circle-gold a img{
		max-width: 100px;
	}

	.about-us-item-content-gold,
	.about-us-body-list-gold{
		width: 100%;
	}

	.about-us-body-list-gold::before{
		display: none;
	}

	.about-us-client-box-gold{
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		text-align: left;
		gap: 15px;
	}

	.about-us-client-image-gold{
		margin-bottom: 0;
	}

	.about-us-client-content-gold{
		width: calc(100% - 65px);
	}

	.about-us-client-content-gold h3{
		font-size: 18px;
	}

	.collection-item-gold{
		padding: 20px;
	}

	.collection-item-image-gold{
		margin-bottom: 20px;
	}

	.collection-item-image-gold a,
	.collection-item-image-gold figure{
		max-width: 100px;
	}

	.collection-item-content-gold h2{
		font-size: 18px;
	}

	.what-we-counter-list-gold{
		gap: 20px;
	}

	.what-we-counter-item-gold{
		width: calc(33.33% - 13.33px);
	}

	.what-we-counter-item-gold::before{
		right: -10px;
	}

	.what-we-counter-item-gold h2{
		font-size: 26px;
	}

	.what-we-counter-item-gold p{
		font-size: 14px;
	}

	.what-we-image-box-1-gold .what-we-image-gold{
		margin-right: -60px;
	}

	.what-we-image-box-2-gold::before{
		right: 20px;
		height: 200px;
	}

	.intro-video-box-gold{
		min-height: 420px;
	}

	.intro-video-body-gold{
        min-height: 250px;
    }

	.intro-video-body-gold .video-play-button-gold a{
		font-size: 18px;
        width: 80px;
        height: 80px;
    }

	.product-box-content-gold h2{
		font-size: 18px;
	}

	.surfaces-img-slider-gold .swiper-slide img{
		aspect-ratio: 1 / 0.8;
	}

	.surfaces-item-gold{
		width: calc(50% - 10px);
		padding: 15px;
	}

	.surfaces-item-title-gold h3{
		font-size: 18px;
	}

	.surfaces-footer-box-gold{
		gap: 20px;
	}

	.features-item-gold{
		width: calc(50% - 10px);
		justify-content: center;
		text-align: center;
	}

	.features-item-content-gold{
		width: 100%;
	}

	.features-item-content-gold h3{
		font-size: 18px;
	}

	.cta-box-content-gold::before,
	.cta-box-content-gold::after{
		width: 70px;
		height: 70px;
	}

	.cta-box-content-gold::after{
		bottom: 20px;
	}

	.cta-box-newsletter-form-gold .form-group .form-control{
		padding: 5px 15px;
		width: calc(100% - 40px);
	}

	.cta-box-newsletter-form-gold .form-group .btn-default{
		font-size: 0;
		padding: 0;
		width: 40px;
		height: 40px;
	}

	.cta-box-newsletter-form-gold .form-group .btn-default::before{
		right: 2px;
	}

	.our-global-network-gold{
		background-size: 450px;
	}

	.network-item-list-gold{
		gap: 20px;
	}

	.network-item-gold{
		width: calc(50% - 10px);
		padding: 15px;
	}

	.network-item-content-gold{
		padding-top: 20px;
		margin-top: 20px;
	}

	.network-item-content-gold h2{
		font-size: 24px;
	}

	.network-item-content-gold p{
		font-size: 16px;
	}

	.testimonial-author-image-gold{
        margin-bottom: 20px;
    }

	.testimonial-item-footer-gold{
		padding-top: 20px;
		margin-top: 20px;
	}

	.testimonial-author-content-gold h2{
		font-size: 18px;
	}

	.testimonial-author-content-gold p{
		font-size: 14px;
	}

	.footer-links-gold{
		width: auto;
	}

	.footer-links-gold::before{
		display: none;
	}

	.footer-links-gold h2{
		font-size: 18px;
		margin-bottom: 15px;
	}

	.footer-cta-box-gold{
		padding: 15px;
	}

	.footer-cta-box-gold .section-title{
		margin: 0;
	}

	.footer-copyright-text-gold{
		padding: 15px 0;
	}
}

/* ══════════════════════════════════════════════════════════════════
   ÖZEN MERMER — TEMA ÜSTÜ EKLER
   Bu dosya ozen.css'in sonuna eklenir. Tilux'ta karşılığı olmayan
   bileşenler ve Türkçe/erişilebilirlik düzeltmeleri burada.
   ══════════════════════════════════════════════════════════════════ */

/* ─────────────────────────────────────────────────────────────
   0. DÜZELTMELER
   ───────────────────────────────────────────────────────────── */

/* Temanın `text-transform: capitalize` kuralları Türkçe cümle düzenini
   eziyor ve KESME İŞARETİNDEN SONRA yanlış büyütüyor:
   "Ataşehir'deki" -> "Ataşehir'Deki",  "1983'ten Beri" -> "1983'Ten Beri".
   Tarayıcı kesme işaretini sözcük sınırı sayıyor; lang="tr" bunu düzeltmiyor.

   Temada capitalize kullanan 10 seçicinin tamamı burada karşılanıyor
   (kaynak: custom.css içinde `text-transform: capitalize` araması).
   Silver skin seçicileri (`.footer-links-silver`) hariç — o skin atıldı. */
.btn-default,
.btn-default span,
.readmore-btn,
.nav-menu-wrapper .navbar-nav .nav-link,
.section-title .section-sub-title,
.section-footer-text p a,
.page-header-box ol li.breadcrumb-item,
.slicknav_nav .slicknav_row,
.slicknav_nav li a{
	text-transform: none;
}

/* Menü başlıkları satır kırmasın ("Ana Sayfa" iki satıra düşüyordu) */
.main-menu ul li > a { white-space: nowrap; }

/* `.text-anime-style-*` sınıflarının custom.css'te hiç kuralı yok; gizli
   başlangıç durumunu gsap.set() çalışma anında kuruyor. Bu emniyet ağı
   KAPSAYICIYA uygulanır — GSAP harfleri (`.split-line` içindeki span'lar)
   animasyona devam eder, çakışma olmaz. gsap.min.js yüklenemezse hiçbir
   şey gizlenmemiş olur, yani başlık zaten görünür kalır.
   Hareket azaltma tercihinin tam karşılığı: §18.9. */
.text-anime-style-1,
.text-anime-style-2,
.text-anime-style-3 {
	visibility: visible;
	clip-path: none;
}

/* Klavye ile gezinenler için görünür odak halkası (temada yoktu) */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible {
	outline: 3px solid var(--accent-secondary-color);
	outline-offset: 2px;
	border-radius: 2px;
}

/* İçeriğe atla — ekran okuyucu ve klavye kullanıcıları için */
.icerige-atla {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 10000;
	background: var(--accent-color);
	color: var(--white-color);
	padding: 14px 24px;
	font-weight: 600;
	border-radius: 0 0 6px 0;
}
.icerige-atla:focus {
	left: 0;
}

/* Sabit üst menü, iç bağlantıya atlarken başlığı kapatmasın */
:target {
	scroll-margin-top: 120px;
}

/* ─────────────────────────────────────────────────────────────
   1. .veri-bekleniyor — FİRMADAN VERİ BEKLEYEN BLOKLAR
   Tek anahtar: <body class="yayin"> tüm bu blokları gizler.
   ───────────────────────────────────────────────────────────── */

.veri-bekleniyor {
	position: relative;
	border: 2px dashed var(--accent-color);
	border-radius: 10px;
	padding: 40px 28px 28px;
	margin: 28px 0;
	background: #FBF7F8;
}

.veri-bekleniyor-etiket {
	position: absolute;
	top: -13px;
	left: 20px;
	background: var(--accent-color);
	color: var(--white-color);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .04em;
	padding: 4px 12px;
	border-radius: 4px;
}

.veri-bekleniyor-not {
	font-size: 14px;
	line-height: 1.6;
	color: var(--accent-color);
	margin-bottom: 22px;
	max-width: 70ch;
}

/* Karanlık bölüm içindeyken okunur kalsın */
.dark-section .veri-bekleniyor {
	background: rgba(255,255,255,.04);
	border-color: var(--accent-secondary-color);
}
.dark-section .veri-bekleniyor-etiket {
	background: var(--accent-secondary-color);
	color: var(--primary-color);
}
.dark-section .veri-bekleniyor-not {
	color: var(--accent-secondary-color);
}

/* Satır/öğe varyantı: <tr> ve <li> üzerinde kesikli kutu düzeni bozar */
.veri-bekleniyor--satir {
	border: 0;
	padding: 0;
	margin: 0;
	background: #FFF7E0;
	box-shadow: inset 3px 0 0 var(--accent-secondary-color);
}
.veri-bekleniyor--satir .veri-bekleniyor-etiket {
	position: static;
	display: inline-block;
	margin-right: 8px;
	font-size: 11px;
}

/* Boş iskeletler — içi doldurulacak kart yerleri */
.iskelet {
	/* display:block ZORUNLU: iskeletler <span> ile basiliyor ve satir ici
	   elemanlarda min-height yok sayiliyor — iskelet satirlari hic gorunmuyordu. */
	display: block;
	background: linear-gradient(100deg, #EFEAEA 30%, #F7F3F3 50%, #EFEAEA 70%);
	border-radius: 8px;
	min-height: 200px;
}
.iskelet--satir { min-height: 18px; margin-bottom: 10px; }
.iskelet--kisa  { width: 55%; }

/* ══ TEK ANAHTAR ══
   Yayına geçerken 20 dosyada <body> -> <body class="yayin">.
   Tek sed komutu, geri alınabilir, build adımı yok. */
body.yayin .veri-bekleniyor {
	display: none !important;
}

/* ─────────────────────────────────────────────────────────────
   2. .veri-tablosu — İÇERİK TABLOLARI
   Temada içerik tablosu stili sıfır. Malzeme karşılaştırma
   tabloları SEO §8'e göre sitedeki en değerli AI-alıntı varlığı.
   ───────────────────────────────────────────────────────────── */

/* Yatay kaydırma. Gradyanlı "gölge afiş" numarası denendi ve terk edildi:
   arka plan sarmalayıcıya uygulandığı için <caption> hizasında beyaz leke
   bırakıyordu. Bunun yerine sade kenarlık + mobilde açık bir kaydırma notu. */
.tablo-kaydir {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	margin: 28px 0;
	border: 1px solid var(--divider-color);
	border-radius: 8px;
}
.dark-section .tablo-kaydir { border-color: var(--dark-divider-color); }
.dark-section .tablo-kaydir::after {
	color: rgba(255, 255, 255, .6);
	border-top-color: var(--dark-divider-color);
}

@media only screen and (max-width: 767px) {
	.tablo-kaydir::after {
		content: 'Tabloyu yana kaydırabilirsiniz →';
		display: block;
		font-size: 13px;
		color: var(--text-color);
		padding: 8px 13px;
		border-top: 1px dashed var(--divider-color);
		position: sticky;
		left: 0;
	}
}

.veri-tablosu {
	width: 100%;
	min-width: 560px;
	border-collapse: collapse;
	font-size: 16px;
	line-height: 1.6;
	background: var(--white-color);
}

.veri-tablosu caption {
	caption-side: top;
	text-align: left;
	font-family: var(--accent-font);
	font-size: 15px;
	font-weight: 500;
	color: var(--text-color);
	padding-bottom: 12px;
}

.veri-tablosu thead th {
	background: var(--primary-color);
	color: var(--white-color);
	font-family: var(--accent-font);
	font-weight: 500;
	text-align: left;
	padding: 14px 18px;
	white-space: nowrap;
}

.veri-tablosu tbody th,
.veri-tablosu tbody td {
	padding: 14px 18px;
	border-bottom: 1px solid var(--divider-color);
	vertical-align: top;
}

.veri-tablosu tbody th {
	text-align: left;
	font-weight: 600;
	color: var(--primary-color);
	white-space: nowrap;
}

.veri-tablosu tbody tr:nth-child(even) { background: var(--bg-color); }
.veri-tablosu tbody tr:last-child th,
.veri-tablosu tbody tr:last-child td { border-bottom: 0; }

.veri-tablosu strong { color: var(--primary-color); }

@media only screen and (max-width: 767px) {
	.veri-tablosu { font-size: 15px; }
	.veri-tablosu thead th,
	.veri-tablosu tbody th,
	.veri-tablosu tbody td { padding: 11px 13px; }
}

.dark-section .surec-adim {
	background: rgba(255,255,255,.03);
	border-color: var(--dark-divider-color);
}
.dark-section .surec-adim h3 { color: var(--white-color); }

/* Koyu bölüm metin kuralları dosyanın EN SONUNDA (bkz. bölüm 11) —
   aynı özgüllükteki açık tema kurallarını sıra ile yenmeleri gerekiyor. */

/* ─────────────────────────────────────────────────────────────
   4. .teknik-ozet — MALZEME TEKNİK ŞERİDİ
   Front matter `teknik` bloğundan; JSON-LD additionalProperty ile
   aynı kaynaktan beslenir (tek kaynak, çift çıktı).
   ───────────────────────────────────────────────────────────── */

.teknik-ozet {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	gap: 1px;
	background: var(--divider-color);
	border: 1px solid var(--divider-color);
	border-radius: 10px;
	overflow: hidden;
	margin: 30px 0;
}

.teknik-ozet-oge {
	background: var(--white-color);
	padding: 22px 20px;
}

.teknik-ozet-etiket {
	display: block;
	font-size: 13px;
	letter-spacing: .05em;
	text-transform: uppercase;
	color: var(--text-color);
	margin-bottom: 7px;
}

.teknik-ozet-deger {
	display: block;
	font-family: var(--accent-font);
	font-size: 22px;
	font-weight: 500;
	line-height: 1.25;
	color: var(--primary-color);
}

.teknik-kullanim {
	list-style: none;
	padding: 0;
	margin: 0 0 30px;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}
.teknik-kullanim li {
	background: var(--bg-color);
	border: 1px solid var(--divider-color);
	border-radius: 100px;
	padding: 7px 16px;
	font-size: 15px;
	color: var(--primary-color);
}

.dark-section .bolge-listesi li {
	background: rgba(255,255,255,.05);
	border-color: var(--dark-divider-color);
	color: var(--white-color);
}

/* ─────────────────────────────────────────────────────────────
   6. .footer-nap — FOOTER İLETİŞİM KOLONU
   SITE-STRUCTURE §8 zorunlu kılıyor, temada yoktu.
   Tamamı _data/site.yml'den üretilir -> LocalBusiness JSON-LD ile
   byte-byte aynı kalır.
   ───────────────────────────────────────────────────────────── */

.footer-nap address {
	font-style: normal;
	margin-bottom: 18px;
	line-height: 1.75;
}

.footer-nap-satir {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	margin-bottom: 13px;
	font-size: 16px;
}
.footer-nap-satir i {
	color: var(--accent-secondary-color);
	font-size: 15px;
	margin-top: 5px;
	flex: none;
}
.footer-nap-satir a { color: inherit; }
.footer-nap-satir a:hover { color: var(--accent-secondary-color); }

.footer-nap-saatler {
	margin: 18px 0 0;
	font-size: 15px;
	line-height: 1.9;
}
.footer-nap-saatler div {
	display: flex;
	justify-content: space-between;
	gap: 18px;
	max-width: 280px;
	border-bottom: 1px solid var(--dark-divider-color);
	padding: 3px 0;
}
.footer-nap-saatler dt { font-weight: 400; }
.footer-nap-saatler dd { margin: 0; font-weight: 600; }

/* ─────────────────────────────────────────────────────────────
   7. .mobil-eylem-cubugu — MOBİL SABİT ALT BAR
   SITE-STRUCTURE §8: "telefon ve WhatsApp butonu her ekranda
   erişilebilir olmalı — birincil dönüşüm kanalı bu."
   ───────────────────────────────────────────────────────────── */

.mobil-eylem-cubugu { display: none; }

@media only screen and (max-width: 1024px) {
	.mobil-eylem-cubugu {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 999;
		background: var(--primary-color);
		border-top: 1px solid rgba(255,255,255,.1);
		box-shadow: 0 -4px 18px rgba(0,0,0,.18);
		padding-bottom: env(safe-area-inset-bottom);
	}

	.mobil-eylem-cubugu a {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 5px;
		padding: 11px 6px;
		color: var(--white-color);
		font-size: 13px;
		font-weight: 500;
		line-height: 1.2;
		text-align: center;
		min-height: 58px;
	}
	.mobil-eylem-cubugu a + a { border-left: 1px solid rgba(255,255,255,.1); }
	.mobil-eylem-cubugu a i { font-size: 18px; color: var(--accent-secondary-color); }
	.mobil-eylem-cubugu a.eylem-birincil { background: var(--accent-color); }
	.mobil-eylem-cubugu a.eylem-birincil i { color: var(--white-color); }

	/* Sabit bar footer'ın son satırını kapatmasın */
	body { padding-bottom: 58px; }
}

/* ─────────────────────────────────────────────────────────────
   7b. HERO — statik LCP görseli
   Tema hero'su uzak sunucudan gelen bir <video> kullanıyordu.
   `.hero::before` gradyan örtüsü ve `.hero .container{z-index:2}`
   temadan geliyor; burada yalnızca görsel katmanı tanımlanıyor.
   ───────────────────────────────────────────────────────────── */

.hero-arka-plan {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	z-index: 0;
}
.hero-arka-plan img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

@media only screen and (max-width: 767px) {
	.hero { min-height: 620px; height: auto; padding: 150px 0 70px; }
	.hero-content-body p { font-size: 16px; }
	.hero-content-footer .btn-default { width: 100%; text-align: center; }
}

/* ─────────────────────────────────────────────────────────────
   8. HARİTA FACADE — tıkla-yükle
   Eager Maps iframe'i ~700 KB üçüncü taraf JS demek; hem de tüm
   işi dönüşüm olan bir sayfada.
   ───────────────────────────────────────────────────────────── */

.harita-facade {
	position: relative;
	display: block;
	width: 100%;
	min-height: 380px;
	border: 0;
	border-radius: 10px;
	overflow: hidden;
	background: var(--primary-color) url('/assets/images/dark-section-bg-image-1.png') center/cover no-repeat;
	color: var(--white-color);
	cursor: pointer;
}
.harita-facade-ic {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 12px;
	text-align: center;
	padding: 30px;
	background: rgba(29,29,29,.62);
}
.harita-facade-ic i { font-size: 34px; color: var(--accent-secondary-color); }
.harita-facade-ic strong { font-family: var(--accent-font); font-size: 22px; font-weight: 500; }
.harita-facade-ic span { font-size: 15px; opacity: .82; max-width: 44ch; }
.harita-facade iframe { width: 100%; height: 100%; border: 0; display: block; }

/* ─────────────────────────────────────────────────────────────
   9. FORM — teklif-al
   validator.min.js kaldırıldı; doğrulama ozen.js'te native
   Constraint Validation API ile.
   ───────────────────────────────────────────────────────────── */

.form-group { margin-bottom: 22px; }

.form-group label {
	display: block;
	font-size: 15px;
	font-weight: 500;
	color: var(--primary-color);
	margin-bottom: 8px;
}
.form-group label .zorunlu { color: var(--accent-color); margin-left: 2px; }
.form-group .ipucu { display: block; font-size: 14px; color: var(--text-color); margin-top: 6px; }

.form-hata {
	display: none;
	font-size: 14px;
	color: var(--error-color);
	margin-top: 7px;
}
.form-group.hatali .form-hata { display: block; }
.form-group.hatali .form-control { border-color: var(--error-color); }

select.form-control {
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' stroke='%23575757' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 18px center;
	padding-right: 46px;
}

.form-onay {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	font-size: 15px;
	line-height: 1.6;
}
.form-onay input[type="checkbox"] {
	width: 20px;
	height: 20px;
	margin-top: 3px;
	flex: none;
	accent-color: var(--accent-color);
}
.form-onay label { margin-bottom: 0; font-weight: 400; }

.form-durum {
	margin-top: 20px;
	padding: 16px 20px;
	border-radius: 8px;
	font-size: 15px;
	line-height: 1.6;
	display: none;
}
.form-durum.gorunur { display: block; }
.form-durum.basarili { background: #EAF6EE; color: #1D6B37; border: 1px solid #B9DFC6; }
.form-durum.hatali   { background: #FDECEC; color: #A32020; border: 1px solid #F3C3C3; }

/* Dosya alanı: backend olmadan taşınamaz -> disabled + açıklama */
.form-group input[type="file"][disabled] {
	opacity: .55;
	cursor: not-allowed;
}

/* ─────────────────────────────────────────────────────────────
   10. KÜÇÜK YARDIMCILAR
   ───────────────────────────────────────────────────────────── */

/* Hızlı iletişim paneli (iletişim + teklif-al sağ kolon) */
.hizli-iletisim {
	background: var(--primary-color);
	border-radius: 10px;
	padding: 38px 32px;
	color: var(--white-color);
}
.hizli-iletisim h3 { color: var(--white-color); font-size: 26px; margin-bottom: 12px; }
.hizli-iletisim p  { color: rgba(255,255,255,.78); margin-bottom: 26px; }
.hizli-iletisim .btn-default { width: 100%; text-align: center; margin-bottom: 12px; }
.hizli-iletisim .btn-default:last-child { margin-bottom: 0; }

/* Gövde içi düz bölüm — özel bir tema bloğu gerektirmeyen prose */
.duz-bolum { padding: 90px 0; }
.duz-bolum + .duz-bolum { padding-top: 0; }
@media only screen and (max-width: 767px) {
	.duz-bolum { padding: 60px 0; }
}

/* Yasal sayfa gövdesi */
.yasal-icerik { max-width: 78ch; }
.yasal-icerik h2 { font-size: 27px; margin: 42px 0 14px; }
.yasal-icerik h2:first-child { margin-top: 0; }
.yasal-icerik ul { padding-left: 22px; margin-bottom: 20px; }
.yasal-icerik li { margin-bottom: 9px; }

/* Uyarı bandı (yasal sayfaların başında) */
.uyari-bandi {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	background: #FFF7E0;
	border-left: 4px solid var(--accent-secondary-color);
	border-radius: 0 8px 8px 0;
	padding: 20px 24px;
	margin-bottom: 40px;
	font-size: 15px;
	line-height: 1.65;
}
.uyari-bandi i { color: #B08430; font-size: 19px; margin-top: 2px; flex: none; }

/* İçerik listeleri — gövdeden gelen <ul> */
.icerik-liste { list-style: none; padding: 0; margin: 0 0 26px; }
.icerik-liste li {
	position: relative;
	padding-left: 32px;
	margin-bottom: 13px;
	line-height: 1.7;
}
.icerik-liste li::before {
	content: '\f058';
	font-family: 'Font Awesome 7 Free';
	font-weight: 900;
	font-size: 17px;
	color: var(--accent-color);
	position: absolute;
	left: 0;
	top: 1px;
}

/* Numaralı içerik listesi */
.icerik-liste-no { counter-reset: adim; list-style: none; padding: 0; margin: 0 0 26px; }
.icerik-liste-no li {
	position: relative;
	padding-left: 46px;
	margin-bottom: 18px;
	line-height: 1.7;
	counter-increment: adim;
}
.icerik-liste-no li::before {
	content: counter(adim);
	position: absolute;
	left: 0;
	top: -1px;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: var(--accent-color);
	color: var(--white-color);
	font-size: 14px;
	font-weight: 600;
	display: flex;
	align-items: center;
	justify-content: center;
}

.dark-section .icerik-liste li::before { color: var(--accent-secondary-color); }

/* Sadece ekran okuyucular için */
.gorsel-gizli {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden;
	clip: rect(0,0,0,0);
	white-space: nowrap;
	border: 0;
}

/* Görsel yer tutucular gerçek fotoğrafla değişene kadar hafif zemin */
figure.image-anime img { background: #EFEBE7; }

/* İçerik metnindeki iç linkler belirgin olsun — SITE-STRUCTURE §3'ün
   kurduğu iç link ağının çalışması buna bağlı. */
.duz-bolum-ic a:not(.btn-default):not(.readmore-btn),
.about-us-body a:not(.btn-default):not(.readmore-btn),
.yasal-icerik a,
.veri-tablosu a {
	color: var(--accent-color);
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-thickness: 1px;
}
.duz-bolum-ic a:hover,
.about-us-body a:hover,
.veri-tablosu a:hover {
	text-decoration-thickness: 2px;
}

/* Gövde metni ölçüsü — okunabilirlik */
.duz-bolum-ic p,
.about-us-body p { line-height: 1.8; }
.duz-bolum-ic h3 { font-size: 24px; margin: 34px 0 12px; }
.duz-bolum-ic > :last-child { margin-bottom: 0; }

/* ─────────────────────────────────────────────────────────────
   11. KOYU BÖLÜM METİN KURALLARI — EN SONDA OLMALI
   Tema, koyu bölümlerde yalnızca `.section-title` içini beyazlatıyor;
   gövde metni --text-color (#575757) kalıp koyu zeminde okunmuyordu.
   Bu bloğun dosya sonunda durması ŞART: yukarıdaki açık tema link
   kuralıyla (.duz-bolum-ic a:not(...)) aynı özgüllükte olduğu için
   kazanmasını sıraya borçlu.
   ───────────────────────────────────────────────────────────── */

/* `.about-us`'un KENDİ `background` KISALTMASI (tema, satır ~823)
   `background-color` yazmıyor — kısaltma kullanmak bunu ZIMNEN
   `transparent` yapıyor. `.dark-section`in `background-color`'ı AYNI
   ÖZGÜLLÜKTE (tek sınıf) ama dosyada DAHA ÖNCE tanımlı olduğu için
   kaybediyor: `.about-us.dark-section` koyu değil AÇIK zeminde BEYAZ
   metin oluyor — görünmez. Bileşik seçici (`.about-us.dark-section`,
   iki sınıf) özgüllükte üstün geldiği için sıradan bağımsız çalışır. */
.about-us.dark-section {
	background-color: var(--primary-color);
}

.dark-section .surec-adim p,
.dark-section .duz-bolum-ic,
.dark-section .duz-bolum-ic p,
.dark-section .duz-bolum-ic li,
.dark-section .about-us-body,
.dark-section .about-us-body p,
.dark-section .about-us-body li,
.dark-section .contact-info-box-content,
.dark-section .contact-info-box-content p,
.dark-section .contact-info-box-content address {
	color: rgba(255, 255, 255, .82);
}

.dark-section .duz-bolum-ic h2,
.dark-section .duz-bolum-ic h3,
.dark-section .duz-bolum-ic h4,
.dark-section .duz-bolum-ic strong,
.dark-section .about-us-body strong,
.dark-section .contact-info-box-title h3 {
	color: var(--white-color);
}

.dark-section .duz-bolum-ic a:not(.btn-default):not(.readmore-btn),
.dark-section .about-us-body a:not(.btn-default):not(.readmore-btn),
.dark-section .contact-info-box-content a,
.dark-section .veri-tablosu a {
	color: var(--accent-secondary-color);
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* Koyu bölümdeki tablolar */
.dark-section .veri-tablosu {
	background: rgba(255, 255, 255, .04);
	color: rgba(255, 255, 255, .85);
}
.dark-section .veri-tablosu thead th {
	background: var(--accent-color);
	color: var(--white-color);
}
.dark-section .veri-tablosu tbody th { color: var(--white-color); }
.dark-section .veri-tablosu tbody tr:nth-child(even) { background: rgba(255, 255, 255, .03); }
.dark-section .veri-tablosu tbody th,
.dark-section .veri-tablosu tbody td { border-bottom-color: var(--dark-divider-color); }
.dark-section .veri-tablosu caption { color: rgba(255, 255, 255, .6); }
/* Kaydırma gölgesi açık temaya göre ayarlıydı; koyu zeminde beyaz leke yapıyordu */
.dark-section .tablo-kaydir { background: none; }

/* İletişim kartları koyu zeminde */
.contact-info-box-content address { font-style: normal; }

/* Form durum kutusu — WhatsApp numarası gelene kadar gösterilen eylem
   bağlantıları (bkz. ozen.js: otomatik mailto yönlendirmesi yapılmıyor) */
.form-durum-eylemler {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin: 18px 0 12px;
}
.form-durum-eylemler .btn-default { margin: 0; }
.form-durum-not {
	display: block;
	font-size: 14px;
	opacity: .85;
}

/* ─────────────────────────────────────────────────────────────
   12. BÖLÜM ARKA PLANLARI
   Tema bunları `images/page-header-bg.jpg` ve `cta-box-bg-image.jpg`
   olarak tanımlıyordu; ikisi de gri ölçü placeholder'ıydı ve
   kopyalanmadıkları için 404 veriyorlardı. İçerik tarafına
   (/img/sayfa/) taşındılar — böylece firma gerçek fotoğrafla
   değiştirebiliyor ve EKSIKLER listesinde görünüyorlar.
   ───────────────────────────────────────────────────────────── */
.page-header { background-image: url('/img/sayfa/sayfa-basligi-arkaplan.webp'); }
.cta-box     { background-image: url('/img/sayfa/cta-arkaplan.webp'); }

/* ─────────────────────────────────────────────────────────────
   13. İLETİŞİM KARTLARI
   Tema yalnızca `.contact-info-box-content p` için beyaz renk
   tanımlamış; <address> ve <a> kapsam dışı kalıp okunmaz oluyordu
   (linkler varsayılan mavi çıkıyordu).
   ───────────────────────────────────────────────────────────── */
.contact-info-box-content,
.contact-info-box-content address,
.contact-info-box-content p {
	color: rgba(255, 255, 255, .88);
	font-style: normal;
	line-height: 1.7;
	margin-bottom: 0;
}
.contact-info-box-content a {
	color: var(--accent-secondary-color);
	text-decoration: none;
	font-weight: 500;
}
.contact-info-box-content a:hover {
	color: var(--white-color);
	text-decoration: underline;
}

/* /iletişim/ sol kolonda `.contact-info-box` üst üste 3 kez, her biri
   ağırlıklı içerikle (çok satırlı adres, rozet-listeler, tam bir
   `.veri-tablosu`) kullanılıyor — temanın kendi `contact.html`'inde bu
   kutu YALNIZ BİR KEZ ve tek cümlelik içerikle görünür. İki sonuç:

   1) Kutu, `dark-section` sınıfı OLMADAN sadece bu dosyanın yukarıdaki
      "her zaman beyaz" yamasıyla ayakta duruyordu — içine giren
      `.veri-tablosu` kendi AÇIK temasıyla basılıyor, sonuçta koyu kart
      içinde bembeyaz bir tablo bloğu (kontrast/estetik kırılması).
      Çözüm: kutuya `dark-section` sınıfı da eklendi (bkz. bilesenler.mjs
      `iletisimKutusu()`) — böylece §11'in TAM koyu tablo varyantı
      (`.dark-section .veri-tablosu …`) devreye giriyor ve eskiden
      burada duran tek satırlık `<td>` yaması gereksiz kaldı (kaldırıldı).
      Aynı sınıf, içindeki `.veri-bekleniyor--satir` rozetini de (WhatsApp
      satırı) §1'in koyu varyantına bağlıyor — açık sarı kutu artık koyu
      kartın üstünde ayrı bir yama gibi durmuyor.
   2) Temanın kendi `background-image: url(contact-info-box-bg-image.png)`
      köşe süsü tek satırlık içerik için tasarlanmış; burada metnin
      ÜSTÜNE biniyordu. Bu bağlamda tamamen kapatıldı. */
.contact-us-content .contact-info-box {
	background-image: none;
}
.contact-us-content .contact-info-box:not(:last-child) {
	margin-bottom: 30px;
}

/* ─────────────────────────────────────────────────────────────
   14. SSS SAYFASI YAN MENÜSÜ
   Temanın kendi kontrast hatası: `.page-category-list h3` bordo
   zemin (--accent-color) üzerine neredeyse siyah metin
   (--primary-color) koyuyor — okunmuyor. `.sidebar-cta-box` da
   koyu zeminli ama içindeki başlık/paragraf renksiz kalıyor.
   ───────────────────────────────────────────────────────────── */

.page-category-list h3 {
	color: var(--white-color);
	margin-bottom: 0;
}

.page-category-list ul li a {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
	color: var(--primary-color);
}
.page-category-list ul li a:hover { color: var(--accent-color); }
.page-category-list ul li a span {
	background: var(--bg-color);
	border-radius: 100px;
	padding: 1px 10px;
	font-size: 13px;
	color: var(--text-color);
}

.sidebar-cta-box h3 { color: var(--white-color); margin-bottom: 10px; }
.sidebar-cta-box p  { color: rgba(255, 255, 255, .78); margin-bottom: 24px; }
.sidebar-cta-box .btn-default { width: 100%; text-align: center; margin-bottom: 12px; }
.sidebar-cta-box .btn-default:last-child { margin-bottom: 0; }

/* Soru grupları arası nefes payı */
.page-single-faqs { margin-top: 56px; }
.page-single-faqs:first-of-type { margin-top: 34px; }
.page-single-faqs > h2 {
	font-size: 29px;
	margin-bottom: 20px;
	padding-bottom: 14px;
	border-bottom: 2px solid var(--divider-color);
	scroll-margin-top: 130px;
}

/* ─────────────────────────────────────────────────────────────
   15. KART BAŞLIKLARI — h2 → h3
   Tema kart başlıklarını <h2> varsayıp `.collection-item-content h2`
   ile stilliyor. Biz belge planı doğru olsun diye <h3> kullanıyoruz
   (sayfada tek H1, ardından bölüm H2'leri, kartlar H3) — bu yüzden
   tema kuralı tutmuyordu ve başlık bağlantıları Bootstrap'in
   varsayılan mavisiyle (#0d6efd) çıkıyordu.
   ───────────────────────────────────────────────────────────── */

.collection-item-content h3 {
	font-size: 20px;
	line-height: 1.35;
	color: var(--white-color);
	margin-bottom: 12px;
}
.collection-item-content h3 a { color: inherit; text-decoration: none; }
.collection-item-content h3 a:hover { color: var(--accent-secondary-color); }

@media only screen and (max-width: 767px) {
	.collection-item-content h3 { font-size: 18px; }
}

/* ─────────────────────────────────────────────────────────────
   16. GÖRSEL EN-BOY ORANI
   Her <img>'de CLS için width/height ÖZNİTELİKLERİ var. Tema ise
   bu kaplarda yalnızca `width:100%` tanımlıyor, height demiyor —
   bu durumda tarayıcı HTML height özniteliğini kullanıyor ve
   16:9 bir görsel 605×900 gibi gerilmiş bir kutuya oturuyordu.
   `height:auto` oranı geri veriyor; width/height öznitelikleri
   yerinde kaldığı için CLS koruması da sürüyor.

   DİKKAT: `.collection-item-image` içindeki görseller HARİÇ —
   onlar bilinçli olarak `height:100% + object-fit:cover` ile
   kartın tamamını kaplıyor. Bu yüzden kural `figure.image-anime`
   ile sınırlandı (kart görselleri sınıfsız <figure> kullanıyor).
   ───────────────────────────────────────────────────────────── */
figure.image-anime img {
	height: auto;
}

/* ─────────────────────────────────────────────────────────────
   17. 404 VE TEŞEKKÜR SAYFALARI
   Bu iki sayfada `.page-header` yok, dolayısıyla üstte sabit
   menünün altına girmeyi engelleyecek bir blok da yok. Temanın
   `.error-page{padding:120px 0}` değeri menü yüksekliğinden az
   kalıyordu ve <h1> menünün arkasında görünmez oluyordu.
   ───────────────────────────────────────────────────────────── */
.error-page {
	padding: 230px 0 120px;
}
.error-page-content h1 {
	font-size: clamp(56px, 9vw, 104px);
	line-height: 1;
	color: var(--accent-color);
	margin-bottom: 16px;
}
.error-page-content h2 {
	font-size: 34px;
	margin-bottom: 16px;
}
.error-page-content p {
	max-width: 58ch;
	margin: 0 auto 26px;
}
.error-page-content .icerik-liste {
	margin: 0 auto 34px;
	max-width: 320px;
}
/* Bu sayfalardaki bağlantılar `.duz-bolum-ic` dışında kaldığı için
   Bootstrap'in varsayılan mavisiyle çıkıyordu. */
.error-page-content a:not(.btn-default) {
	color: var(--accent-color);
	text-decoration: underline;
	text-underline-offset: 3px;
}
.error-page-content a:not(.btn-default):hover {
	text-decoration-thickness: 2px;
}
.error-page-content .section-btn {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	justify-content: center;
}

@media only screen and (max-width: 767px) {
	.error-page { padding: 170px 0 80px; }
	.error-page-content h2 { font-size: 26px; }
}

/* ═════════════════════════════════════════════════════════════
   18. GOLD SKIN DÜZELTMELERİ  (ana sayfa · index-2.html)

   custom.css 7407-9505 arası artık ozen.css'e giriyor. O blok
   MagicCursor ve GSAP'ın yüklü olduğunu varsayıyor; ikisinden
   yalnızca GSAP var. Aşağıdakiler o varsayımların açtığı
   boşlukları kapatıyor.

   ⚠ Bu bant §16'dan SONRA olmak ZORUNDA: §16'nın
   `figure.image-anime img{height:auto}` kuralını geri alıyor.
   ═════════════════════════════════════════════════════════════ */

/* ── 18.1 Slider imleçleri ──
   Temanın `cursor: none` bildirimleri gen-assets.mjs'te kaynaktan
   siliniyor (MagicCursor yok; 381 elemanda imleç kayboluyordu).
   Geriye tek eksik kalıyor: sürüklenebilir slider'lar bunu belli etmeli. */
.surfaces-img-item-gold .swiper-slide,
.surfaces-img-slider-gold .swiper-wrapper,
.testimonial-slider-gold .swiper-wrapper {
	cursor: grab;
}
.surfaces-img-slider-gold .swiper-wrapper:active,
.testimonial-slider-gold .swiper-wrapper:active {
	cursor: grabbing;
}

/* ── 18.2 §16 istisnası — gold görsel kapları ──
   §16 `height:auto` diyerek 16:9 görsellerin gerilmesini engelliyor.
   Gold kaplarda ise `aspect-ratio` + `object-fit:cover` zaten oranı
   koruyor ve `height:100%` kolonların eşit boyda kalması için gerekli;
   `height:auto` kolajın hizasını bozuyordu. */
.about-us-image-gold figure.image-anime img,
.what-we-image-gold figure.image-anime img,
.features-image-gold figure.image-anime img,
.network-image-gold figure.image-anime img,
.our-values-image figure.image-anime img,
.surfaces-item-slider-gold figure img,
.work-process-item-image figure.image-anime img {
	height: 100%;
}

/* ── 18.3 Kart başlıkları h2 → h3 ──
   Belge planı: sayfada tek H1, bölümler H2, kartlar H3 (bkz. §15).
   Tema bu kutuları <h2> varsayıp stilliyor; kurallar h3'e taşındı.
   Aksi hâlde başlıklar Bootstrap'in varsayılan mavisiyle çıkıyor. */
.collection-item-content-gold h3 {
	font-size: 22px;
	line-height: 1.3;
	margin-bottom: 10px;
}
.collection-item-content-gold h3 a,
.product-box-content-gold h3 a {
	color: inherit;
	text-decoration: none;
	transition: color .3s ease;
}
.collection-item-content-gold h3 a:hover,
.product-box-content-gold h3 a:hover {
	color: var(--accent-secondary-color);
}
.product-box-content-gold h3 {
	font-size: 20px;
	line-height: 1.3;
	margin-bottom: 6px;
}
/* Malzeme kartlarındaki kısa açıklama — temada bu <p> yok, biz ekledik:
   "asit dayanımı", "gözeneklilik" gibi seçimi belirleyen tek satırlık bilgi. */
.product-box-content-gold p {
	font-size: 15px;
	line-height: 1.55;
	margin-bottom: 0;
	color: var(--text-color);
}
.what-we-counter-item-gold h3,
.network-item-content-gold h3 {
	font-family: var(--accent-font);
	font-size: 46px;
	font-weight: 500;
	line-height: 1;
	margin-bottom: 6px;
	color: var(--accent-color);
}
.testimonial-author-content-gold h3 {
	font-size: 20px;
	margin-bottom: 4px;
}

/* ── 18.4 Arka planlar içerik tarafına taşındı ──
   `hero-bg-image-gold.jpg` ve `intro-video-bg-image-gold.jpg` temanın
   gri yer tutucularıydı (bkz. §12 ve gen-assets.mjs'teki ölü referans
   temizliği). İkisi de artık `.hero-arka-plan` <img> katmanı:
   LCP görseli preload edilebiliyor ve alt metni oluyor. */
.hero-gold,
.intro-video-box-gold {
	position: relative;
	background-image: none;
}
.hero-gold > .container,
.intro-video-box-gold > .container-fluid {
	position: relative;
	z-index: 2;
}
.intro-video-box-gold .hero-arka-plan img {
	filter: brightness(.55);
}

/* ── 18.5 Koyu bölümlerde eklenen prose blokları ──
   `.surfaces-content-box-gold` koyu zeminli; tema yalnızca
   `.section-title` içini beyazlatıyor (bkz. §11). Bu kutuya sonradan
   `.duz-bolum-ic` eklendiği için ayrıca yazılıyor. */
.surfaces-content-box-gold .duz-bolum-ic,
.surfaces-content-box-gold .duz-bolum-ic p {
	color: rgba(255, 255, 255, .78);
}
.surfaces-content-box-gold .duz-bolum-ic a {
	color: var(--accent-secondary-color);
}
.about-us-content-gold .duz-bolum-ic,
.what-we-do-content-gold .duz-bolum-ic {
	margin-top: 26px;
}
.about-us-content-gold .duz-bolum-ic p:last-child,
.what-we-do-content-gold .duz-bolum-ic p:last-child {
	margin-bottom: 0;
}

/* ── 18.6 Hizmet bölgesi ızgarası ──
   export.html'de `.global-client-item` ülke bayrağı <figure> bekliyor;
   burada ilçe adının yanında konum ikonu var. `:first-child` girintisi
   logo şeridi içindi, ilçe listesinde hizayı bozuyor. */
.global-client-item:first-child { margin-left: 0; }
.global-client-item i {
	color: var(--accent-color);
	font-size: 15px;
	width: 32px;
	height: 32px;
	line-height: 32px;
	text-align: center;
	background: var(--white-color);
	border-radius: 50%;
	flex-shrink: 0;
}
.global-client-item h3 {
	font-size: 16px;
	margin-bottom: 0;
}

/* ── 18.7 Footer CTA bandı ──
   index-2.html:1412'den alındı ama temada footer'ın ALTINDA duruyor;
   bizde NAP kolonlarının üstünde. Temanın `margin-top` değeri burada
   bandı içeriğin içine itiyordu. */
.main-footer .footer-cta-box-gold {
	margin-top: 0;
	margin-bottom: 50px;
	width: 100%;
}
.main-footer .footer-cta-box-gold .section-title h2 {
	color: var(--white-color);
	margin-bottom: 0;
}

/* ── 18.8 Tanıtım videosu — link bekleyen hâli ──
   Video linki gelmeden oynat butonu basılmıyor; yerindeki uyarı
   kutusu koyu zeminde okunur olmalı. */
.video-play-button-gold.veri-bekleniyor {
	background: rgba(29, 29, 29, .72);
	max-width: 46ch;
	text-align: center;
}
.video-play-button-gold.veri-bekleniyor .veri-bekleniyor-not {
	color: rgba(255, 255, 255, .82);
}

/* ── 18.9 `.reveal` emniyet ağı ──
   `.reveal{visibility:hidden}` (custom.css:183) görseli GSAP
   `autoAlpha:1` yazana kadar gizliyor. Hareket azaltma tercihinde
   animasyon hiç çalışmamalı — o zaman görsel de hiç görünmezdi.
   JS tarafındaki ikinci emniyet ağı: ozen.js `window.load`. */
@media (prefers-reduced-motion: reduce) {
	.reveal { visibility: visible !important; }
	.text-anime-style-3,
	.text-anime-style-3 .split-line,
	.text-anime-style-3 div {
		opacity: 1 !important;
		transform: none !important;
	}
}

/* ── 18.10 Ana sayfa şeffaf menüsü ──
   `main-header-gold` yalnızca ana sayfada (kabuk.mjs). Tema, gold
   menüde yalnızca `.main-menu ul li a` rengini beyazlatıyor; bizim
   kabuğumuzdaki "aktif" işareti kapsam dışı kalıp koyu zeminde
   okunmuyordu. */
.main-header-gold .nav-item.aktif > .nav-link {
	color: var(--accent-secondary-color);
}

/* index-2.html'deki gold başlıkta `active-sticky-header` YOK; menü hero'nun
   üzerine şeffaf biniyor. Bizim kabuğumuz o sınıfı ekliyor (kaydırınca
   sabitlenme davranışını istiyoruz) ama temanın
   `.main-header-gold.active-sticky-header .header-sticky{background:primary}`
   kuralı menüyü BAŞLANGIÇTA da opak yapıyor ve hero'nun üstünü kesiyordu.
   Koyu zemin yalnızca `.active` geldiğinde (600px kaydırma, function.js).

   Seçici temanınkiyle AYNI biçimde yazılmalı: `header` + 3 sınıf. Daha
   kısa yazılınca özgüllük yetmiyor ve kural sessizce yutuluyor. */
header.main-header.main-header-gold.active-sticky-header .header-sticky {
	background: transparent;
}
header.main-header.main-header-gold.active-sticky-header .header-sticky.active {
	background: var(--primary-color);
}

/* ── 18.11 Yorum slider'ı — iskelet hâli ──
   Gerçek yorum yokken Swiper başlatılmıyor; slaytlar yan yana akmasın,
   iskelet kutuları eşit yükseklikte dursun. */
.our-testimonials-gold .veri-bekleniyor .swiper-wrapper {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 20px;
	transform: none !important;
}
.our-testimonials-gold .veri-bekleniyor .swiper-slide {
	width: auto !important;
}

/* ── 18.12 Süreç adımları — 3 değil 5 adım ──
   about.html'deki `.work-process` tam ÜÇ karta göre yazılmış:
   `width: calc(33.33% - 20px)` ve `:nth-child(3n + 2)` ile ortadaki kart
   ters çevriliyor (görsel altta). Ana sayfada 5 adım var; tema kuralı
   olduğu gibi bırakılınca 2. ve 5. kart aşağı kayıyor ve satır düzeni
   dağılıyordu.

   Çözüm: aynı flex düzeni, 5 kolon; zikzak `3n+2` yerine `even` ile
   kuruluyor — 5 kartta düzenli bir dönüşüm veriyor.

   ⚠ Duyarlı genişlikleri BURADA yeniden tanımlamak zorunlu: temanın
   991px/767px kuralları dosyada daha ÖNCE geldiği için, buradaki
   koşulsuz `width` onları eziyordu.

   Adım sayısı `surecAdimlariTema()` tarafından sarmalayıcıya
   `work-process--N` olarak yazılıyor; genişlik BURADA ona göre veriliyor.
   Kural modifier'sız yazılırsa 6 adımlı hizmet sayfaları da 5 kolona
   zorlanıyor ve 6. kart taşıyor. */
.work-process--5 .work-process-item {
	/* 5 × (20% − 24px) + 4 × 30px boşluk = tam kapsayıcı genişliği.
	   20px yazılınca 15px taşıyor ve 5. kart alt satıra düşüyordu. */
	width: calc(20% - 24px);
}
.work-process--6 .work-process-item {
	/* 6 adım: 3'lü iki satır. 4 ya da 5 kolonda kart genişliği
	   başlık + açıklamayı taşıyamayacak kadar daralıyor. */
	width: calc(33.33% - 20px);
}
.work-process-item:nth-child(3n + 2) { flex-direction: column; }
.work-process-item:nth-child(even)   { flex-direction: column-reverse; }
.work-process-item-image { max-width: 200px; }

@media only screen and (max-width: 1399px) {
	.work-process--5 .work-process-item,
	.work-process--6 .work-process-item { width: calc(33.33% - 20px); }
}
@media only screen and (max-width: 991px) {
	.main-footer .footer-cta-box-gold { margin-bottom: 34px; }
	.work-process--5 .work-process-item,
	.work-process--6 .work-process-item { width: calc(50% - 15px); }
}
@media only screen and (max-width: 767px) {
	.work-process--5 .work-process-item,
	.work-process--6 .work-process-item { width: 100%; }
	/* Tek kolonda zikzak anlamsız; hepsi görsel üstte olsun */
	.work-process-item:nth-child(even) { flex-direction: column; }
}

/* ── 18.13 Bölüm açıklamasındaki iç linkler ──
   `.section-title p` içine içerik metni bastığımız yerlerde (malzemeler,
   hizmet bölgesi) linkler Bootstrap'in varsayılan mavisiyle çıkıyordu;
   tema bu paragrafta link olacağını varsaymamış. §11'deki `.duz-bolum-ic`
   kuralının bu bağlamdaki karşılığı. */
.section-title p a {
	color: var(--accent-color);
	text-decoration: underline;
	text-underline-offset: 3px;
}
.section-title p a:hover { text-decoration-thickness: 2px; }
.dark-section .section-title p a,
.surfaces-content-box-gold .section-title p a {
	color: var(--accent-secondary-color);
}

/* ══════════════════════════════════════════════════════════════════
   § 19  HİZMET SAYFALARI  (collection.html · faqs.html · about.html)

   Kullanılan tema bölümleri CSS'i custom.css 1-35 arasında hazır
   geliyor; buradaki kurallar yalnızca iki şeyi düzeltiyor:
     a) sabit öğe sayısına göre yazılmış genişlikler (tema 3 ya da 4
        karta göre yazmış, bizde 5-6 var)
     b) uydurma sosyal kanıt blokları basılmadığı için açıkta kalan
        konumlandırma/yükseklik varsayımları

   ⚠ Bu bant §18'den SONRA olmak zorunda: §18.12'nin work-process
     kuralları ve §16'nın `figure.image-anime img{height:auto}` kuralı
     burada daraltılıyor/istisna ediliyor.
   ══════════════════════════════════════════════════════════════════ */

/* ── 19.1 Etkileşimli süreç — 4 değil 6 öğe ──
   collection.html'deki `.interactive-process-item` tam DÖRT öğeye göre
   yazılmış: `width:25%` ve `:nth-child(4n+4)` ile son sütunun dikey
   çizgisi kaldırılıyor. Hub'da 6 adım var; kural olduğu gibi bırakılınca
   4+2 kırık bir satır düzeni çıkıyor ve ikinci satırın sağında iki boş
   sütunluk boşluk kalıyordu.

   Çözüm: 3'lü iki satır. 6 kolon denendi — kart genişliği 200px'e
   düşüyor ve iki kelimelik başlıklar bile sarıyor. */
.interactive--6 .interactive-process-item { width: 33.333%; }
.interactive--6 .interactive-process-item:nth-child(4n + 4) {
	border-right: 1px solid var(--dark-divider-color);
}
.interactive--6 .interactive-process-item:nth-child(3n + 3) { border-right: none; }
.interactive--6 .interactive-process-item:nth-child(-n + 3) {
	border-bottom: 1px solid var(--dark-divider-color);
}
/* Tema 495px üst dolgu veriyor (tek satır, tam ekran yüksekliğinde
   bir bölüm için). İki satırda bu 1100px'lik bir blok demek. */
.interactive--6 .interactive-inner-process { padding: 260px 0 0; }

/* Bölüm başlığı temada yoktu (bölüm doğrudan ızgarayla başlıyordu);
   koyu arka plan üzerinde durduğu için kendi boşluğunu istiyor. */
.interactive-process-layout > .container { padding-top: 100px; }
.interactive-process-layout .section-title { margin-bottom: 0; }

/* Klavye erişimi: `.interactive-inner-process` tabindex aldı (function.js
   `focusin` ile de etkinleştiriyor), odak halkası görünür kalmalı. */
.interactive-inner-process:focus-visible {
	outline: 2px solid var(--accent-secondary-color);
	outline-offset: -2px;
}

@media only screen and (max-width: 1024px) {
	/* Temanın 50% kuralı buraya kadar geliyor ama bizim koşulsuz
	   33.333%'imiz onu eziyor — yeniden bildirmek zorunlu (§18.12 notu). */
	.interactive--6 .interactive-process-item { width: 50%; }
	.interactive--6 .interactive-process-item:nth-child(3n + 3) {
		border-right: 1px solid var(--dark-divider-color);
	}
	.interactive--6 .interactive-process-item:nth-child(even) { border-right: none; }
	.interactive--6 .interactive-inner-process { padding: 180px 0 0; }
	.interactive-process-layout > .container { padding-top: 60px; }
}
@media only screen and (max-width: 767px) {
	.interactive--6 .interactive-process-item { width: 100%; border-right: none; }
	.interactive--6 .interactive-inner-process { padding: 120px 0 0; }
}

/* ── 19.2 Neden Biz — sahte sosyal kanıt blokları basılmıyor ──
   Tema `.why-choose-us-image-box`'ı `.why-choose-us-cta-box` (müşteri
   portreleri + "2000+ müşteri") ile birlikte kurgulamış; o kutu mutlak
   konumlu ve görselin altına taşıyor, bu yüzden görsel kutusunun altında
   onun yüksekliği kadar boşluk bırakılmış. Kutu basılmayınca o boşluk
   sayfada asılı kalıyor. */
.why-choose-us-image-box { padding-bottom: 0; margin-bottom: 30px; }
.why-choose-us-image figure { display: block; margin: 0; }

/* Alıntı öğesi temada dört portre + metinden oluşuyordu; yalnız metin
   kalınca kutu içinde dikey olarak ortalanmalı. */
.why-choose-item .satisfy-client-content { margin: 0; }
.why-choose-item .satisfy-client-content p { margin: 0; }

/* Sayaç öğesinde tema <h2> + <h3> kullanıyor; belge planı gereği
   ikisi de <h3> (§18.3 ile aynı gerekçe). Boyut farkı korunmalı. */
.why-choose-counter-content h3:first-child {
	font-size: 48px;
	line-height: 1.1;
	margin-bottom: 4px;
}

/* Bayrak listesi yerine ilçe adları: <img> değil metin geliyor. */
.why-choose-country-flag-list ul {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 10px;
	list-style: none;
	margin: 0;
	padding: 0;
}
.why-choose-country-flag-list ul li {
	padding: 6px 14px;
	border: 1px solid var(--dark-divider-color);
	border-radius: 100px;
	font-size: 14px;
	line-height: 1.4;
}

/* ── 19.3 Çekirdek özellikler — puan rozeti basılmıyor ──
   `.core-features-image-box` yüksekliğini içindeki mutlak konumlu
   `.core-features-cta-box`a göre alıyordu. */
.core-features-image-box { height: auto; }
.core-features-image figure { display: block; margin: 0; }
.features-accordion .accordion-button img { margin-right: 12px; flex: 0 0 auto; }

/* ── 19.4 Hizmet detay gövdesi (page-single-sidebar) ── */
.page-service-single { padding: 120px 0 0; }

/* Yapışkan kenar çubuğu: tema `top:30px` veriyor ama sticky header
   90px yükseklikte — kutu menünün altına giriyordu. */
.page-single-sidebar { top: 120px; }
.page-category-list ul li.active > a {
	color: var(--accent-color);
	font-weight: 600;
}
.sidebar-cta-item-content h3 { font-size: 22px; line-height: 1.3; }
.sidebar-cta-contact-list ul li img { flex: 0 0 auto; }

.service-single-image { margin-bottom: 40px; }
.service-single-image figure { display: block; margin: 0; border-radius: 4px; }
.service-single-block + .service-single-block { margin-top: 40px; }
.service-single-block .section-title { margin-bottom: 20px; }

/* ── 19.5 §16 istisnası — hizmet sayfası görsel kapları ──
   §16 `figure.image-anime img{height:auto}` diyerek 16:9 görsellerin
   HTML `height` özniteliğiyle gerilmesini engelliyor. Aşağıdaki kaplar
   ise `aspect-ratio` + `object-fit:cover` ile çalışıyor (§18.2 ile aynı
   durum) — orada `height:100%` geri verilmeli. */
.page-gallery-box .photo-gallery figure.image-anime img,
.why-choose-us-image figure.image-anime img,
.core-features-image figure.image-anime img,
.service-single-image figure.image-anime img {
	height: 100%;
}

/* ── 19.6 Ürün kutuları — kart başlığı h2 değil h3 ──
   §18.3 ile aynı gerekçe: sayfada tek H1, bölümler H2, kartlar H3. */
.product-box-content h3 {
	font-size: 24px;
	line-height: 1.3;
	margin-bottom: 10px;
}
.product-box-content h3 a { color: inherit; }
.product-box-content h3 a:hover { color: var(--accent-color); }

/* ── 19.7 Duyarlı düzeltmeler ── */
@media only screen and (max-width: 991px) {
	.page-service-single { padding: 60px 0 0; }
	.page-single-sidebar { top: auto; }
	.why-choose-us-image-box { margin-bottom: 20px; }
}

/* ── 19.8 Hero yüksekliği — temanın oranına dönüş ──
   Tema hero'su (index-2.html) desktop'ta 945px: 455px dikey boşluk
   (`padding: 285px 0 170px`, §hero-gold) + 490px içerik (h1 3 satır,
   paragraf 2 satır). Bizim hero metnimiz daha uzun — h1 4, paragraf
   5 satır, 647px — ve aynı padding'le hero 1102px'e çıkıyor. Sonuçları:
     · 1440×900 ve 1366×768'de CTA katlamanın altında kalıyor (932px),
     · kutu uzadıkça 16:9 görsel `object-fit:cover` ile YANDAN kırpılıyor:
       temada %14 olan kayıp bizde %26-30'a çıkıp üçüncü plakayı kesiyor.
   Padding'i temanın 285:170 oranını koruyarak kısıyoruz (187:111 = 298px)
   ki hero yine 945px olsun. ≤991px temanın kendi kuralında (150/60). */
@media only screen and (min-width: 992px) {
	.hero-gold { padding: 187px 0 111px; }
}

/* ── 19.9 Yan yana iletişim kutuları — eşit yükseklik ──
   Ana sayfa "Hizmet Bölgemiz" altındaki üç `.contact-info-box`
   (Atölyemiz / Telefon / E-posta) `.row` içinde yan yana duruyor ama
   içerikleri farklı satır sayısında: adres iki satır, telefon ve
   e-posta birer satır. Tema kutuya yükseklik vermediği için kartlar
   farklı boyda basılıyor ve alt kenarları hizasız kalıyor.
   Bootstrap kolonu zaten satırın tam yüksekliğinde; kutuyu da kolona
   yaymak yetiyor. /iletişim/ sayfasındaki kutular `.contact-us-content`
   içinde ALT ALTA durduğu için bu kural onları etkilemesin diye
   `.duz-bolum` ile sınırlandırıldı. */
.duz-bolum .contact-info-box {
	height: 100%;
}

/* Temanın köşe süsü (`contact-info-box-bg-image.png`) tek satırlık içerik
   için konumlanmış; ana sayfadaki adres kutusu iki satır olduğu için metnin
   üstüne biniyor ve son satır görselin altında kalıyor. /iletişim/ sayfasında
   aynı sebeple zaten kapatılmıştı (§19.13, `.contact-us-content`). */
.duz-bolum .contact-info-box {
	background-image: none;
}

/* ── 19.10 Dönen rozetler — metin artık dilden geliyor ──
   Tema bu rozeti iki hazır SVG dosyası olarak veriyordu
   (learn-more-circle-gold.svg / enquire-now-circle.svg); halka yazısı
   ("LEARN MORE", "ENQUIRE NOW") dosyanın içinde vektör path'i olarak
   gömülü, yani çevrilemez. Site tr + en olduğu için yazı `<textPath>`
   ile çiziliyor ve `site.badge.*` anahtarlarından geliyor
   (bkz. components/public/donen-rozet.blade.php).
   Temanın `.learn-more-circle-gold a img` kuralları `<img>` hedeflediği
   için inline `<svg>` karşılıkları burada yazılıyor. */
.learn-more-circle-gold .donen-rozet {
	display: block;
	width: 100%;
	max-width: 170px;
	height: auto;
	border-radius: 50%;
}

.learn-more-circle-gold .donen-rozet-halka {
	transform-origin: 50% 50%;
	animation: infiniterotate 20s infinite linear;
}

.learn-more-circle-gold a:hover .donen-rozet-halka {
	animation-play-state: paused;
}

.donen-rozet-yazi {
	fill: var(--white-color);
	font-family: var(--default-font);
	font-weight: 600;
}

@media only screen and (max-width: 767px) {
	.learn-more-circle-gold .donen-rozet { max-width: 120px; }
}

@media (prefers-reduced-motion: reduce) {
	.learn-more-circle-gold .donen-rozet-halka { animation: none; }
}