@charset "utf-8";
/*
/*	Copyright (c) 2021 Frenify
/*	Author: Frenify
/*	This file is made for CURRENT TEMPLATE
/*


	List of CSS codes:
	
	01) Base
	02) Mobile Menu
	03) Sidebar
	04) Main Title
	05) HOME Section
	06) ABOUT Section
	07) SERVICES Section
	08) RESUME Section
	09) POPUP
	10) PORTFOLIO Section
	11) BLOG Section
	12) CONTACT Section
	13) NEW SLIDER: main slider
	14) RESPONSIVE MEDIA QUERIES

/*------------------------------------------------------------------*/
/*	01) Base
/*------------------------------------------------------------------*/
html {
	overflow-x: hidden;
	padding: 0px;
	margin: 0px
}
body{
	overflow-x: hidden;
	font-family: 'Jost', Arial, Helvetica, sans-serif;
	font-size: 18px;
	line-height: 1.3;
	letter-spacing: 0;
	font-weight: 400;
	color: #777;
	word-break: break-word;
}
p{
	letter-spacing: 0;
}
section,
[class^="persono_fn_"]{
	width: 100%;
	float: left;
	clear: both;
}
.persono_fn_wrapper,
.persono_fn_wrapper *{
	box-sizing: border-box;
}
.persono_fn_svg{
	fill: currentcolor;
	width: 18px;
	height: 18px;
	float: none;
	clear: none;
}
h1,h2,h3,h4,h5,h6{
	color: #0e090d;
}
.persono_fn_content{
	width: 100%;
	position: relative;
	z-index: 10;
	padding-left: 400px;
	transition: padding .5s ease;
}
.container{
	max-width: 1280px;
	padding: 0px 40px;
	margin: 0px auto;
}
/*------------------------------------------------------------------*/
/*	02) Mobile Menu
/*------------------------------------------------------------------*/
.persono_fn_mobilemenu{
	width: 100%;
	float: left;
	clear: both;
	display: none;
	position: relative;
	z-index: 33;
}
.persono_fn_mobilemenu .hamburger{
	opacity: 1;
}
.persono_fn_mobilemenu ul{
	list-style-type: none;
	margin: 0px;
}
.persono_fn_mobilemenu .logo_hamb{
	width: 100%;
	float: left;
	clear: both;
	padding: 20px;
	background-color: #000;
	
	box-sizing: border-box;
}
.persono_fn_mobilemenu .logo_hamb .in{
	width: 100%;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	justify-content: space-between;
}
.persono_fn_mobilemenu .menu_logo a{
	text-decoration: none;
	display: block;
	cursor: pointer;
}
.persono_fn_mobilemenu .menu_logo img{
	max-width: 250px;
	max-height: 40px;
}
.persono_fn_mobilemenu .mobilemenu{
	width: 100%;
	float: left;
	clear: both;
	padding: 40px 20px 30px 20px;
	background-color: #856267;
	display: none;
	overflow: hidden;
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
}
.persono_fn_mobilemenu ul a{
	text-decoration: none;
	color: #fff;
	font-size: 18px;
	line-height: 27px;
	text-transform: uppercase;
	display: block;
	position: relative;
}
.persono_fn_mobilemenu ul ul a{
	text-transform: none;
}
.persono_fn_mobilemenu ul li{
	margin: 0px;
	position: relative;
	margin-bottom: 10px;
}
.persono_fn_mobilemenu .menu_logo{
	margin-right: 20px;
}
.hamburger {
	padding: 15px 15px;
	display: inline-block;
	cursor: pointer;
	transition-property: opacity, filter;
	transition-duration: 0.15s;
	transition-timing-function: linear;
	font: inherit;
	color: inherit;
	text-transform: none;
	background-color: transparent;
	border: 0;
	margin: 0;
	overflow: visible;
}
.hamburger-box {
	width: 30px;
	height: 18px;
	display: inline-block;
	position: relative;
}

.hamburger-inner {
	display: block;
	top: 50%;
	margin-top: -2px;
}
.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
    width: 30px;
    height: 2px;
    background-color: #000;
    position: absolute;
    transition-property: transform;
    transition-duration: 0.15s;
    transition-timing-function: ease;
	
	-webkit-border-radius: 4px;
	   -moz-border-radius: 4px;
	        border-radius: 4px;
}
.hamburger-inner::before,
.hamburger-inner::after {
    content: "";
    display: block;
}
.hamburger-inner::before{
    top: -8px;
}
.hamburger-inner::after{
    bottom: -10px;
}
.hamburger--collapse-r .hamburger-inner {
  top: auto;
  bottom: 0;
  transition-duration: 0.13s;
  transition-delay: 0.13s;
  transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
.hamburger--collapse-r .hamburger-inner::after{
    top: -16px;
	
	-webkit-transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), opacity 0.1s linear;
	   -moz-transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), opacity 0.1s linear;
	    -ms-transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), opacity 0.1s linear;
	     -o-transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), opacity 0.1s linear;
	        transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), opacity 0.1s linear;
}
.hamburger--collapse-r .hamburger-inner::before{
	-webkit-transition: top 0.12s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
	   -moz-transition: top 0.12s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
	    -ms-transition: top 0.12s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
	     -o-transition: top 0.12s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
	        transition: top 0.12s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--collapse-r.is-active .hamburger-inner{
	-webkit-transform: translate3d(0, -10px, 0) rotate(45deg);
	   -moz-transform: translate3d(0, -10px, 0) rotate(45deg);
	    -ms-transform: translate3d(0, -10px, 0) rotate(45deg);
	        transform: translate3d(0, -10px, 0) rotate(45deg);
	
	transition-delay: 0.22s;
	transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
.hamburger--collapse-r.is-active .hamburger-inner::after{
    top: 0;
    opacity: 0;
	
	-webkit-transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), opacity 0.1s 0.22s linear;
	   -moz-transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), opacity 0.1s 0.22s linear;
	    -ms-transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), opacity 0.1s 0.22s linear;
	     -o-transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), opacity 0.1s 0.22s linear;
	        transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), opacity 0.1s 0.22s linear;
}
.hamburger--collapse-r.is-active .hamburger-inner::before{
    top: 0;
	
	-webkit-transform: rotate(90deg);
	   -moz-transform: rotate(90deg);
	    -ms-transform: rotate(90deg);
	        transform: rotate(90deg);
	
	-webkit-transition: top 0.1s 0.16s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1);
	   -moz-transition: top 0.1s 0.16s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1);
	    -ms-transition: top 0.1s 0.16s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1);
	     -o-transition: top 0.1s 0.16s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1);
	        transition: top 0.1s 0.16s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.hamburger{
	padding: 0px;
	height: 100%;
	display: table-cell;
	vertical-align: middle;
}
.hamburger-box{display: block;}
.hamburger .hamburger-inner::before,
.hamburger .hamburger-inner::after,
.hamburger .hamburger-inner{
	background-color: #fff;
	width: 30px;
	
	-webkit-transition: all .3s ease;
	   -moz-transition: all .3s ease;
	    -ms-transition: all .3s ease;
	     -o-transition: all .3s ease;
	        transition: all .3s ease;
}
/*------------------------------------------------------------------*/
/*	03) Sidebar
/*------------------------------------------------------------------*/

.persono_fn_sidebar{
	width: 400px;
	position: fixed;
	top: 0;
	left: 0;
	bottom: 0;
	z-index:  20;
	background-color: #f6efef;
	padding: 200px 20px;
	padding: 15vh 20px;
	transition: transform .5s ease;
}
.persono_fn_wrapper.sidebar-closed .persono_fn_sidebar{transform: translateX(-100%);}
.persono_fn_wrapper.sidebar-closed .persono_fn_content{padding-left: 0 !important;}
.persono_fn_wrapper.sidebar-closed .persono_fn_sidebar .nav__button{
	transform: translateX(0);
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
	box-shadow: 0px 2px 3px rgb(0 0 0 / 25%);
}
.persono_fn_sidebar .nav__button{
    position: absolute;
	min-width: 50px;
	height: 30px;
    left: 100%;
    transform: translateX(-50%);
    max-width: 100px;
    color: #000;
    font-weight: 400;
    top: 40px;
    display: block;
    white-space: nowrap;
    transition: all .5s ease;
    background: #fff;
    border-radius: 15px;
    font-size: 15px;
    line-height: 30px;
    padding: 0 15px;
	text-align: center;
    box-shadow: 0px 2px 3px rgb(0 0 0 / 5%);
	z-index: 33;
	cursor: pointer;
}
.persono_fn_sidebar .nav__button .width_indicator{
	opacity: 0;
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	left: 0;
	text-align: center;
}
.persono_fn_sidebar .nav__button.resize .nav_trigger{
	opacity: 0;
}
.persono_fn_sidebar .nav__button.resize .width_indicator{
	opacity: 1;
}
.persono_fn_sidebar .sidebar_in{
	width: 100%;
	height: 100%;
	position: relative;
}
.persono_fn_sidebar .logo{
	text-align: center;
	padding-bottom: 100px;
	padding-bottom: 5vh;
}
.persono_fn_sidebar .logo a{
	text-decoration: none;
	position: relative;
	display: inline-block;
}
.persono_fn_sidebar .logo span{
	width: 8px;
	height: 8px;
	background-color: #856267;
	display: block;
	text-decoration: none;
	border-radius: 100%;
	cursor: pointer;
	position: absolute;
	bottom: 7px;
	right: -3px;
}
.persono_fn_sidebar .navigation ul{
	margin: 0;
	padding: 0;
	list-style-type: none;
	opacity: 0;
	transition: margin .3s ease, opacity .6s ease;
}
.persono_fn_sidebar .navigation ul.ready{
	opacity: 1;
}
.persono_fn_sidebar .sidebar_in > *{
	width: 100%;
	float: left;
	clear: both;
}
.persono_fn_sidebar .navigation{
	overflow: hidden;
}
.persono_fn_sidebar .navigation ul li{
	text-align: center;
	margin-bottom: 13px;
}
.persono_fn_sidebar .navigation ul li:last-child{
	margin-bottom: 0;
}
.persono_fn_sidebar .navigation ul li a{
	text-decoration: none;
	font-weight: 400;
	text-transform: capitalize;
	font-size: 22px;
	color: #1b1a1f;
	line-height: 25px;
}
.persono_fn_sidebar .copyright{
	position: absolute;
	bottom: 0;
	padding-top: 5vh;
}
.persono_fn_sidebar .copyright p{
	color: #777777;
	text-align: center;
	font-size: 16px;
	font-weight: 400;
}
.persono_fn_sidebar .copyright p a{
	color: inherit;
	text-decoration: none;
	padding-bottom: 1px;
	border-bottom: 1px solid transparent;
	transition: all 0.5s ease;
}
.persono_fn_sidebar .copyright p a:hover{
	border-bottom-color: #000;
	color: #000;
}
.shifter_wrapper{
	position: absolute;
	top: 0;
	right: 0px;
	width: 10px;
	height: 100vh;
	overflow: hidden;
	cursor: e-resize;
	-webkit-user-select: none; /* Safari */
	-ms-user-select: none; /* IE 10 and IE 11 */
	user-select: none; /* Standard syntax */
}
.shifter ul{
	margin: 0;
	padding: 0;
	list-style-type: none;
}
.shifter ul li{
	margin: 0;
	padding: 0;
	padding-top: 100px;
}
.shifter ul li span{
	position: relative;
	width: 15px;
	height: 6px;
	background-color: #fff;
	display: inline-block;
	z-index: 20;
	transform: rotate(20deg);
}
/*------------------------------------------------------------------*/
/*	04) Main Title
/*------------------------------------------------------------------*/
.persono_fn_title{
	text-align: center;
	margin-bottom: 70px;
}
.persono_fn_title .title_fixer{
	max-width: 720px;
	margin: 0 auto;
	padding-bottom: 30px;
	position: relative;
}
.persono_fn_title h2{
	margin: 0;
	padding: 0;
	font-size: 60px;
	font-size: calc(30px + 1.57vw);
	font-weight: 600;
	line-height: 1;
	padding-bottom: 0px;
	text-transform: uppercase;
}
.persono_fn_title .title_fixer:after{
	position: absolute;
	content: '';
	left: 50%;
	margin-left: -75px;
	bottom: 0;
	width: 150px;
	height: 10px;
	background-color: #856267;
	border-radius: 25px;
	display: block;
}
/*------------------------------------------------------------------*/
/*	05) HOME Section
/*------------------------------------------------------------------*/
.section_home{
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	position: relative;
}
.section_home .home_left{
	position: relative;
	z-index: 5;
	width: 52%;
	min-width: 52%;
	padding: 67px 0;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-webkit-flex-direction: column;
	-moz-flex-direction: column;
	-ms-flex-direction: column;
	-o-flex-direction: column;
	flex-direction: column;
	justify-content: center;
	min-height: 100vh;
}
.section_home .home_left h2{
	font-weight: 600;
	font-size: 100px;
	font-size: calc(40px + 3.1vw);
	text-transform: uppercase;
	line-height: 0.9;
	margin-bottom: 20px;
	position: relative;
	left: -3px;
}
.animated_text{
	display: inline-block;
	position: relative;
}
.animated_text .line{
	width: 0%;
	top: 0;
	bottom: 0;
    height: inherit;
    background: #f6efef;
    position: absolute;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
}
.animated_text .word{
	display: inline-block;
}
.animated_text .char{
	display: inline-block;
    position: relative;
    opacity: 0;
    visibility: hidden;
    transform: translateZ(0) rotateY(-90deg) translateY(10px);
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
}
.animated_text .char.opened{
	opacity: 1;
	visibility: visible;
	transform: rotate(0deg);
}
.animated_text .text{
    opacity: 0;
	display: block;
}
.animated_text.ready .text{
	-webkit-animation: animateText 2s forwards;
    -o-animation: animateText 2s forwards;
    animation: animateText 2s forwards;
    animation-delay: 1.6s;
}
.animated_text.ready .line{
	 -webkit-animation: animateLine 2s cubic-bezier(0.74, 0.06, 0.4, 0.92) forwards;
	 -o-animation: animateLine 2s cubic-bezier(0.74, 0.06, 0.4, 0.92) forwards;
	 animation: animateLine 2s cubic-bezier(0.74, 0.06, 0.4, 0.92) forwards;
}
@keyframes animateLine {
  0% {width: 0%;left: 0;}
  50% {width: 100%;left: 0;}
  100% {width: 0;left: 100%;}
}
@keyframes animateText {
  0% {opacity: 0; /*transform: translateX(50px) rotate(3deg);*/}
  100% {opacity: 1; transform: translateX(0px) rotate(0deg);}
}
.section_home .home_left_stick span{
	height: 10px;
	width: 250px;
	max-width: 60%;
	border-radius: 25px;
	background-color: #856267;
	display: block;
	margin-bottom: 44px;
}
.section_home .subtitle{
	max-width: 510px;
}
.section_home .subtitle p{
	line-height: 30px;
	font-size: 22px;
}
.section_home .subtitle a{
	text-decoration: none;
	color: inherit;
	border-bottom: 1px solid transparent;
}
.section_home .subtitle a:hover{
	border-bottom-color: #000;
	color: #000;
}
.section_home .home_right{
	position: relative;
	width: 70%;
	min-width: 70%;
	left: -20%;
}
.section_home .home_right img{
	position: relative;
	left: 10%;
}
/*------------------------------------------------------------------*/
/*	06) ABOUT Section
/*------------------------------------------------------------------*/
.section_about{
	padding: 145px 0 0 0;
}
.section_about .about_content{
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	width: 100%;
}
.section_about .about_left{
	width: 50%;
	padding-right: 30px;
	position: relative;
}
.section_about .left_in{
	border: 1px solid transparent;
	padding: 67px 50px 64px;
	margin: 0;
	display: block;
}
.section_about .about_mover{
	border: 1px solid #f6efef;
	border-radius: 8px;
	box-shadow: 0 3px 20px rgba(0,0,0,0.04);
	margin: 0;
	display: block;
	z-index: -1;
	position: absolute;
	left: 0;
	right: 30px;
	top: 0;
	bottom: 0;
	background-color: #fff;
}
.section_about .about_left ul{
	margin: 0;
	padding: 0;
	list-style-type: none;
}
.section_about .about_left li{
	margin-bottom: 20px;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	width: 100%;
}
.section_about .about_left li:last-child{
	margin-bottom: 0;
}
.section_about .about_left h5{
	font-size: 18px;
	font-weight: 600;
	min-width: 100px;
	margin: 0;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
}
.section_about .about_left .about_title{
	color: #000;
	min-width: 100px;
	margin-right: 30px;
	display: inline-block;
	font-weight: 600;
}
.section_about .about_left span{
	color: #777;
	font-size: 18px;
	font-weight: 400;
}
.section_about .about_left a{
	text-decoration: none;
	color: inherit;
	border-bottom: 1px solid transparent;
}
.section_about .about_left a:hover{
	border-bottom-color: #000;
	color: #000;
}
.section_about .about_left .special{
	color: #856267;
}
.section_about .about_right{
	width: 50%;
	padding-left: 30px;
}
.about_me{
	padding-bottom: 33px;
}
.about_me p{
	font-size: 18px;
	font-weight: 400;
	color: #777;
	line-height: 26px;
	margin-bottom: 27px;
}
.about_me p:last-child{
	margin-bottom: 0;
}
.learn_more ul{
	margin: 0;
	padding: 0;
	margin-left: -30px;
}
.learn_more li{
	display: inline-block;
	padding-left: 30px;
}
.learn_more a{
	color: #0e090d;
	text-decoration: none;
	display: block;
	position: relative;
	width: 18px;
	height: 18px;
}
.learn_more a:after{
	position: absolute;
	border-radius: 100%;
	content: "";
	top: -11px;
	left: -11px;
	bottom: -11px;
	right: -11px;
	background-color: transparent;
	transition: all 0.4s ease;
	z-index: 2;
	transform: scale(0.8);
}
.learn_more a span{
	z-index: 5;
	position: relative;
}
.learn_more a:hover{
	color: #fff;
}
.learn_more a:hover:after{
	background-color: #0e090d;
	transform: scale(1);
}
/*------------------------------------------------------------------*/
/*	07) SERVICES Section
/*------------------------------------------------------------------*/
.section_services{
	padding: 200px 0 40px 0px;
}
.persono_services{
	margin-left: -60px;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-webkit-flex-direction: row;
	-moz-flex-direction: row;
	-ms-flex-direction: row;
	-o-flex-direction: row;
	flex-direction: row;
}
.persono_services .service_list{
	width: 100%;
	padding-left: 60px;
}
.persono_services .service_nav{
	width: 100%;
	float: left;
	clear: both;
	opacity: 0;
	transition: all 1s ease;
}
.persono_services .service_nav ul{
	margin: 0;
	padding: 0;
	list-style-type: none;
	margin-left: -4px;
}
.persono_services .service_nav li{
	margin: 0;
	padding: 0;
	width: 50%;
	float: left;
	padding-left: 4px;
}
.persono_services .service_nav span{
	display: block;
	line-height: 50px;
	padding: 0 40px;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 4px;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}
.persono_services .service_nav a{
	display: block;
	line-height: 60px;
	padding: 0 40px;
	font-size: 18px;
	font-weight: 500;
	letter-spacing: 0;
	background-color: #856267;
	color: #fff;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	text-decoration: none;
	width: 100%;
	height: 60px;
}
.persono_services .list{
	margin: 0;
	padding: 0;
	list-style-type: none;
	margin-left: -60px;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-webkit-flex-direction: row;
	-moz-flex-direction: row;
	-ms-flex-direction: row;
	-o-flex-direction: row;
	flex-direction: row;
	flex-wrap: wrap;
}
.persono_services .list > li{
	width: 50%;
	float: left;
	padding-left: 60px;
	margin-bottom: 60px;
}
.persono_services .item{
	padding: 50px 40px 54px;
	border: 1px solid #f6efef;
	box-shadow: 0 3px 20px rgba(0,0,0,0.04);
	border-radius: 8px;
	cursor: pointer;
	height: 100%;
	transition: all .3s ease;
	background-color: #fff;
}
.persono_services .item:hover{
	box-shadow: 0 3px 30px rgba(0,0,0,0.08);
}
.hidden_info{
	display: none;
}
.persono_services .item .wing{
	position: absolute;
	left: 100%;
	width: 60px;
	height: 5px;
	display: block;
	background-color: #f6efef;
	top: 50%;
	transform: translateY(-50%);
	opacity: 0;
	transition: all .5s ease;
}
.persono_services .item .wing:after,
.persono_services .item .wing:before{
	width: 30px;
	height: 5px;
	position: absolute;
	content: '';
	display: block;
	background-color: #f6efef;
}
.persono_services .item .wing:after{bottom: 100%;margin-bottom: 10px;left: 0;}
.persono_services .item .wing:before{top: 100%;margin-top: 10px;right: 0;}
.persono_services .list h4{
	margin: 0;
	padding: 0;
	min-height: 60px;
	font-weight: 500;
	font-size: 24px;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	width: 100%;
	margin-bottom: 17px;
}
.persono_services .list .counter{
	width: 60px;
	height: 60px;
	min-width: 60px;
	padding: 0;
	display: block;
	text-align: center;
	line-height: 60px;
	background-color: #000;
	border-radius: 20px;
	color: #fff;
	font-weight: 500;
	margin-right: 20px;
}
.persono_services .content{
	width: 0%;
	margin: 0;
	padding: 0 0 60px 60px;
	padding-left: 0;
}
.fn__closer{
	cursor: pointer;
	position: absolute;
	width: 27px;
	height: 27px;
	top: 20px;
	right: 20px;
	background-color: #f6efef;
	border-radius: 7px;
	transition: all .3s ease;
}
.fn__closer:hover{
	background-color: #856267;
}
.fn__closer:hover:after,
.fn__closer:hover:before{
	background-color: #fff;
}
.fn__closer:after,
.fn__closer:before{
	content: '';
	position: absolute;
	width: 11px;
	height: 1px;
	background-color: #0f0a0e;
	left: 8px;
	top: 13px;
	transition: all .3s ease;
}
.fn__closer:after{transform: rotate(45deg);}
.fn__closer:before{transform: rotate(135deg);}
.persono_services .fn_in{
	border: 1px solid transparent;
	border-radius: 8px;
	width: 100%;
	float: left;
	overflow: hidden;
	position: relative;
}
.persono_services .fn_wrapper{
	width: 100%;
	float: left;
	overflow: hidden;
	padding: 50px 40px 54px;
}
.persono_services .fn_inner{
	display: none;
	width: 100%;
	float: left;
	overflow: hidden;
	opacity: 0;
}
.persono_services .content h3{
	margin: 0;
	padding: 0;
	font-size: 36px;
	font-weight: 500;
	margin-bottom: 27px;
}
.persono_services .content p{
	margin: 0;
	padding: 0;
	font-size: 18px;
	margin-bottom: 25px;
}
.persono_services .content p:last-child{
	margin-bottom: 0;
}
.persono_services.opened .service_nav{opacity: 1;}
.persono_services.opened .list li{width: 100%;}
.persono_services.opened .content{padding-left: 60px;width: 50%;}
.persono_services.opened .service_list{width: 50%;}
.persono_services.opened .item{opacity: 0.4;}
.persono_services.opened .item.opened{opacity: 1;box-shadow: 0 3px 30px rgba(0,0,0,0.08);}
.persono_services .item.opened .counter{background-color: #856267;}
.persono_services .item.opened .wing{opacity: 1;}
.persono_services.opened .fn_in{border-color: #f6efef;box-shadow: 0 3px 30px rgba(0,0,0,0.08);}
.persono_services .fn_inner.ready{display: block;}
.persono_services .fn_inner.opened{
	-webkit-animation: persono-service-animation 1s ease;
    -moz-animation: persono-service-animation 1s ease;
	opacity: 1;
}
@-webkit-keyframes persono-service-animation {
      0% { opacity: 0; transform: rotateZ(-5deg) translateY(100px);}   
    100% { opacity: 1; transform: rotateZ(0deg) translateY(0px);}
}
@-moz-keyframes persono-service-animation {
      0% { opacity: 0;  transform: rotateZ(-5deg) translateY(100px);}   
    100% { opacity: 1; transform: rotateZ(0deg) translateY(0px);}
}
/*------------------------------------------------------------------*/
/*	08) RESUME Section
/*------------------------------------------------------------------*/
.section_resume{
	padding: 100px 0;
}
.section_resume .resume_footer{
	max-width: 100%;
	width: 100%;
	float: left;
	clear: both;
	position: relative;
}
.section_resume .resume_list{
	position: relative;
	z-index: 5;
	width: 100%;
	float: left;
	clear: both;
}
.section_resume ul{
	margin: 0;
	padding: 0;
	list-style-type: none;
}
.section_resume li{
	margin: 0;
	width: 100%;
	float: left;
	border-bottom: 1px solid #e5e5e5;
	padding: 26px 0 24px;
	position: relative;
	cursor: pointer;
	transition: all 0.5s ease;
}
.section_resume .fn_tooltip{
	position: absolute;
	bottom: 100%;
	border-radius: 5px;
	width: auto;
	max-width: 100%;
	display: block;
	left: 50%;
	opacity: 0;
	visibility: hidden;
	background-color: #fff;
	border: 1px solid #f6efef;
    box-shadow: 0 3px 20px rgba(0,0,0,0.04);
	color: #777;
	padding: 34px 30px;
	transition: all .5s ease, opacity 0s ease;
	transform: translate(-50%,20px);
}
.section_resume .fn_tooltip p{
	margin-bottom: 20px;
	display: block;
	text-indent: 20px;
}
.section_resume .fn_tooltip p:last-child{
	margin-bottom: 0;
}
.section_resume .fn_tooltip span{
	position: absolute;
	border: 10px solid transparent;
	border-top-color: #fff;
	left: 50%;
	top: 100%;
	margin-left: -10px;
	font-size: 18px;
	font-weight: 400;
}
.section_resume li:nth-child(5){
	border-bottom: 0px solid #e5e5e5;
}
.section_resume li > span{
	width: 33.3333%;
	float: left;
	display: block;
}
.section_resume li .middle_text{
	font-weight: 600;
	color: #0e090d;
	padding-left: 20px;
}
.section_resume li .right_text{
	display: block;
	text-align: right;
}
.section_resume li:hover:after{
	box-shadow: 0px 5px 10px rgba(0,0,0,0.05);
}
.section_resume ul:hover li {
	border-bottom-color: transparent;
	opacity: .2;
}
.section_resume ul:hover li:hover{
	opacity: 1;
}
.section_resume li:hover .fn_tooltip{
	opacity: 1;
	visibility: visible;
	transform: translate(-50%,0px);
	transition: all 1s .5s ease, opacity 0s ease;
}
.section_resume .hover_box{
	position: absolute;
	z-index: 1;
	left: -20px;
	right: -20px;
	border-radius: 5px;
	transition: all 0.5s ease;
	background-color: transparent;
}
.section_resume .hover_box .dots{
	position: absolute;
	bottom: -8px;
	left: 0;
	width: 100%;
	overflow: hidden;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
}
.section_resume .hover_box .dot{
	padding-left: 100px;
}
.section_resume .hover_box .dot span{
	position: relative;
    width: 18px;
    height: 6px;
    background-color: #fff;
    display: inline-block;
    z-index: 20;
    transform: rotate(35deg);
}
.section_resume .hover_box.ready{
	background-color: #f6efef;
}
/*------------------------------------------------------------------*/
/*	09) POPUP
/*------------------------------------------------------------------*/
.persono_popup{
	position: fixed;
	left: 400px;
	top: 0;
	right: 0;
	bottom: 0;
	z-index: 15;
	background-color: #fff;
	overflow-y: scroll;
	overflow-x: hidden;
	opacity: 0;
	visibility: hidden;
	-webkit-transition: all .5s ease;
	-o-transition:  all .5s ease;
	transition:  all .5s ease;
}
.persono_popup .stopper{
	position: fixed;
	z-index: -1;
	left: 400px;
	top: 0;
	right: 0;
	bottom: 0;
	margin: 0;
	padding: 0;
	background: none;
	border: none;
	outline: none;
}
.persono_popup .extra_img{
	position: absolute;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	top: 0;
	left: 0;
	right: 0;
	height: 100%;
	max-height: 100vh;
	-webkit-transition: all .5s ease;
	-o-transition:  all .5s ease;
	transition:  all .5s ease;
}
.persono_popup.opened{
	opacity: 1;
	visibility: visible;
}
.persono_popup::-webkit-scrollbar {
    width: 6px;
}
.persono_popup::-webkit-scrollbar-button {
    background: #f1f1f1;
}
.persono_popup::-webkit-scrollbar-track-piece {
    background: #f1f1f1
}
.persono_popup::-webkit-scrollbar-thumb {
    background: #c1c1c1
}
.persono_popup .fn__closer{
	position: fixed;
	width: 31px;
	height: 31px;
	border: 2px solid #fff;
	z-index: 2;
	opacity: 0;
	right: 44px;
	top: 38px;
}
.persono_popup .content{
	padding: 150px 0 100px;
}
.persono_popup .top_part{
	margin-bottom: 56px;
}
.persono_popup iframe{
	width: 100%;
}
.persono_popup .top_part img{
	display: block;
	margin: 0 auto;
}
.persono_popup .title_holder .subtitle{
	margin: 0;
	padding: 0;
	font-size: 14px;
	letter-spacing: .5px;
	color: #856267;
	font-weight: 500;
	text-transform: uppercase;
	margin-bottom: 16px;
}
.persono_popup .title_holder .title{
	margin: 0;
	padding: 0;
	font-size: 36px;
	letter-spacing: 0;
	font-weight: 500;
	margin-bottom: 26px;
}
.persono_popup .title_holder .desc{
	margin-bottom: 32px;
}
.persono_popup .title_holder .desc:last-child{
	margin-bottom: 72px;
}
.persono_popup .info_list{
	width: 100%;
	float: left;
	margin-bottom: 34px;
}
.persono_popup .info_list ul{
	margin: 0;
	padding: 0;
	list-style-type: none;
	margin-left: -40px;
}
.persono_popup .info_list li{
	width: 25%;
	float: left;
	padding-left: 40px;
	margin-bottom: 40px;
}
.persono_popup .info_list span{
	display: block;
}
.persono_popup .info_list .label{
	font-size: 16px;
	font-weight: 600;
	color: #222;
	margin-bottom: 7px;
}
.persono_popup .info_list a{
	color: inherit;
    text-decoration: none;
    padding-bottom: 1px;
    border-bottom: 1px solid transparent;
    transition: all 0.5s ease;
}
.persono_popup .info_list a:hover{
	border-bottom-color: #000;
    color: #000;
}
.persono_popup .img_list{
	width: 100%;
	float: left;
	clear: both;
	margin-bottom: 60px;
}
.persono_popup .img_list ul{
	margin: 0;
	padding: 0;
	list-style-type: none;
	margin-left: -20px;
}
.persono_popup .img_list li{
	width: 50%;
	padding-left: 20px;
	float: left;
	margin-bottom: 20px;
}
.persono_popup .img_list li:nth-child(1){
	width: 100%;
}
.persono_popup .img_list img{
	min-width: 100%;
	opacity: 0;
}
.persono_popup .img_list .abs_img{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}
.persono_popup .img_item{
	width: 100%;
	position: relative;
	overflow: hidden;
	border-radius: 5px;
}
.persono_popup .popup_nav{
	opacity: 0;
	position: relative;
	width: 100%;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: flex-end;
	align-items: flex-end;
	justify-content: space-between;
}
.persono_popup .post_nav{
	width: 40%;
	width: calc(50% - 50px);
	max-width: 350px;
}
.persono_popup .post_nav span{
	display: block;
    line-height: 50px;
    padding: 0 40px;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 4px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.persono_popup .post_nav a{
	display: block;
    line-height: 60px;
    padding: 0 40px;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 0;
    background-color: #856267;
    color: #fff;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    text-decoration: none;
    width: 100%;
    height: 60px;
	border-radius: 10px;
}
.persono_popup .go_home{
	width: 60px;
	height: 60px;
	min-width: 60px;
	background-color: #856267;
	margin: 0 20px;
	border-radius: 10px;
	position: relative;
}
.persono_popup .go_home a{
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	z-index: 5;
}
.persono_popup .go_home ul{
	padding: 0;
	list-style-type: none;
	width: 21px;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-webkit-flex-direction: row;
	-moz-flex-direction: row;
	-ms-flex-direction: row;
	-o-flex-direction: row;
	flex-direction: row;
	-ms-align-items: center;
	align-items: center;
	flex-wrap: wrap;
	gap: 3px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -10px 0 0 -10px;
}
.persono_popup .go_home li{
	margin: 0;
	padding: 0;
	width: 3px;
	height: 3px;
	display: block;
	background-color: #fff;
}
.persono_popup .popup_in{
	opacity: 0;
	transition: all .5s ease;
}
.persono_popup .popup_in.opened{
	opacity: 1;
}
.persono_popup.transition-end .fn__closer,
.persono_popup.transition-end .popup_nav{
	opacity: 1;
}
body.modal-open{
	height: 100vh;
	overflow-y: hidden;
	padding-right: 17px;
}
/*------------------------------------------------------------------*/
/*	10) PORTFOLIO Section
/*------------------------------------------------------------------*/
.section_portfolio{
	padding: 100px 0 55px;
}
.section_portfolio .portfolio_footer > *,
.section_portfolio .portfolio_footer{
	width: 100%;
	float: left;
	clear: both;
}
.section_portfolio .portfolio_filter ul{
	list-style-type: none;
	text-align: center;
	margin: 0;
	padding: 0;
	margin-left: -44px;
	margin-bottom: 40px;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-wrap: wrap;
	-ms-align-items: center;
	align-items: center;
	-webkit-flex-direction: row;
	-moz-flex-direction: row;
	-ms-flex-direction: row;
	-o-flex-direction: row;
	flex-direction: row;
	justify-content: center;
}
.section_portfolio .portfolio_filter li{
	padding-left: 44px;
}
.section_portfolio .portfolio_filter a{
	text-decoration: none;
	color: #777;
	font-size: 14px;
	font-weight: 400;
	position: relative;
	text-transform: uppercase;
}
.section_portfolio .portfolio_filter a.current,
.section_portfolio .portfolio_filter a:hover{
	color: #0e090d;
}
.section_portfolio .portfolio_filter a:after{
	position: absolute;
	content: "";
	width: 1px;
	height: 10px;
	background-color: #777;
	right: -23px;
	top: 50%;
	margin-top: -5px;
}
.section_portfolio .portfolio_filter a:hover:after{
	background-color: #000;
}
.section_portfolio .portfolio_filter li:last-child a:after{
	width: 0;
}
.section_portfolio .portfolio_list{
	max-width: 100%;
}
.section_portfolio .portfolio_list ul{
	list-style-type: none;
	margin: 0;
	padding: 0;
	margin-left: -45px;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-wrap: wrap;
}
.section_portfolio .portfolio_list li{
	width: 33.3333%;
	float: left;
	padding-left: 45px;
	margin-bottom: 45px;
	position: relative;
}
.section_portfolio .portfolio_list a{
	color: #777;
}
.section_portfolio .item{
	position: relative;
	border-radius: 5px;
	overflow: hidden;
	cursor: pointer;
}
.section_portfolio .gallery_img{
	position: absolute;
	bottom: 0;
	left: 0;
	top: -40px;
	right: 0;
	z-index: 15;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
	overflow: hidden;
	transition: all .5s ease;
}
.section_portfolio .item:hover .gallery_text{
	opacity: 1;
	height: 100%;
	overflow: hidden;
}
.section_portfolio .item:hover .gallery_img{
	top: 0;
}
.section_portfolio .portfolio_list img{
	min-width: 100%;
	position: relative;
	z-index: 10;
	opacity: 0;
	display: block;
	overflow: hidden;
}
.section_portfolio .gallery_text{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	text-align: center;
	opacity: 0;
	z-index: 15;
	transition: all 0.5s ease;
	background-color: rgba(0,0,0,0.8);
	height: 0;
	overflow: inherit;
	display: flex;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-webkit-flex-direction: column;
	-moz-flex-direction: column;
	-ms-flex-direction: column;
	-o-flex-direction: column;
	flex-direction: column;
	-ms-align-items: center;
	align-items: center;
	justify-content: center;
	padding: 0 10px;
}
.section_portfolio li span{
	position: relative;
	overflow: hidden;
	color: #ccc;
}
.section_portfolio .gallery_title{
	text-transform: uppercase;
	margin-bottom: 9px;
}
.section_portfolio li span:first-child{
	font-size: 14px;
	font-weight: 400;
	overflow: hidden;
}
.section_portfolio li .fn__title{
	color: #fff;
	font-size: 24px;
	font-weight: 500;
	overflow: hidden;
}
/*------------------------------------------------------------------*/
/*	11) BLOG Section
/*------------------------------------------------------------------*/
.section_blog{
	padding: 100px 0 0px;
}
.section_blog .blog_content{
	max-width: 100%;
}
.section_blog ul{
	list-style-type: none;
	margin: 0;
	padding: 0;
	margin-left: -45px;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-wrap: wrap;
}
.section_blog li{
	width: 33.3333%;
	float: left;
	padding-left: 45px;
	margin-bottom: 45px;
	position: relative;
}
.section_blog .item{
	width: 100%;
	float: left;
	clear: both;
	height: 100%;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-webkit-flex-direction: column;
	-moz-flex-direction: column;
	-ms-flex-direction: column;
	-o-flex-direction: column;
	flex-direction: column;
	cursor: pointer;
}
.section_blog .img_in{
	position: relative;
	overflow: hidden;
	border-radius: 3px;
	box-shadow: 0 3px 20px rgba(0,0,0,0.04);
}
.section_blog .img_holder img{
	opacity: 0;
	min-width: 100%;
}
.section_blog .img_holder a{
	position: absolute;
	display: block;
	z-index: 5;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}
.section_blog .blog_img{
	position: absolute;
	top: -40px;
	right: 0;
	left: 0;
	bottom: 0;
	background-size: cover;
	background-position: center center;
	transition: all .5s ease;
}
.section_blog .item:hover .blog_img{
	top: 0;
}
.section_blog .title_holder p{
	font-size: 14px;
}
.section_blog .title_holder{
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-webkit-flex-direction: column;
	-moz-flex-direction: column;
	-ms-flex-direction: column;
	-o-flex-direction: column;
	flex-direction: column;
	height: 100%;
}
.section_blog .title_holder .read_more{
	margin-top: auto;
}
.section_blog .meta{
	padding: 26px 0 11px 0;
	text-transform: uppercase;
}
.section_blog p.meta a{
	text-decoration: none;
	color: inherit;
	transition: all 0.5s ease;
	border-bottom: 1px solid transparent;
	padding-bottom: 1px;
}
.section_blog p.meta a:hover{
	color: #000;
	border-bottom-color: #000;
}
.section_blog .read_more{
	position: relative;
}
.section_blog .read_more a{
	text-decoration: none;
	color: inherit;
	transition: all 0.5s ease;
	position: relative;
	padding-right: 30px;
}
.section_blog .read_more a:hover{
	color: #000;
}
.section_blog .read_more a:before{
	content: '';
	width: 0%;
    top: 0;
    bottom: 0;
    height: inherit;
    background: #f6efef;
    position: absolute;
	z-index: 25;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
}
.section_blog .read_more a:hover:before{
	-webkit-animation: animateLine 1s cubic-bezier(0.74, 0.06, 0.4, 0.92) forwards;
    -o-animation: animateLine 1s cubic-bezier(0.74, 0.06, 0.4, 0.92) forwards;
    animation: animateLine 1s cubic-bezier(0.74, 0.06, 0.4, 0.92) forwards;
}
.section_blog .read_more a:after{
	position: absolute;
	content: "";
	width: 20px;
	height: 1px;
	background-color: #777;
	right: 0;
	right: 0px;
	top: 50%;
	transition: all 0.5s ease;
}
.section_blog .read_more a:hover:after{
	background-color: #000;
}
.section_blog h3{
	line-height: 28px;
	margin: 0;
	padding: 0;
	margin-bottom: 23px;
}
.section_blog h3 a{
	color: #0e090d;
	font-weight: 500;
	font-size: 24px;
	text-decoration: none;
	line-height: 0.28;
}
.section_blog h3 a:hover{
	color: #856267;
}
/*------------------------------------------------------------------*/
/*	12) CONTACT Section
/*------------------------------------------------------------------*/
.section_contact{
	padding: 150px 0 200px 0;
}
.section_contact .contact_footer{
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	width: 100%;
}
.section_contact .contact_footer_form{
	width: 85%;
}
.section_contact ul{
	margin: 0;
	padding: 0;
	list-style-type: none;
	margin-left: -20px;
}
.section_contact li{
	float: left;
	margin: 0;
	padding: 0;
	padding-left: 20px;
	width: 100%;
	margin-bottom: 20px;
}
.section_contact li:last-child{
	margin-bottom: 0;
}
.section_contact .half{
	width: 50%;
}
.section_contact input{
	background-color: #f2f2f2;
	width: 100%;
	min-width: 100%;
	outline: none;
	font-size: 16px;
	font-weight: 400;
	height: 50px;
	border: none;
	line-height: 50px;
	border-radius: 3px;
	font-family: "Jost",sans-serif;
	padding: 0 20px !important;
}
.section_contact textarea{
	background-color: #f2f2f2;
	outline: none;
	border: none;
	font-size: 16px;
	font-weight: 400;
	width: 100%;
	min-height: 250px;
	max-height: 500px;
	border-radius: 3px;
	font-family: "Jost",sans-serif;
	padding: 14px 20px !important;
}
.section_contact input[type="tel"]:focus,
.section_contact input[type="email"]:focus,
.section_contact input[type="text"]:focus,
.section_contact textarea:focus{
	background-color: #f6efef;
}
.section_contact textarea:focus::placeholder,
.section_contact input[type="tel"]:focus::placeholder,
.section_contact input[type="email"]:focus::placeholder,
.section_contact input[type="text"]:focus::placeholder {
	color: transparent;
}
.section_contact input[type="submit"]{
	color: #fffeff;
	font-size: 16px;
	font-weight: 500;
	background-color: #856267;
	width: 100%;
	text-align: center;
	display: block;
	transition: all 0.5s ease;
	padding: 0 !important;
	border-radius: 3px;
}
.section_contact input[type="submit"]:hover{
	background-color: #0e090d;
}
.section_contact .contact_footer_address{
	padding-left: 50px;
}
.section_contact .address_header{
	padding-bottom: 37px;
}
.section_contact p{
	font-size: 14px;
	text-transform: uppercase;
	padding-bottom: 8px;
}
.section_contact h4{
	margin: 0;
	padding: 0;
	font-size: 30px;
	font-weight: 500;
}
.section_contact .address_middle{
	padding-bottom: 44px;
}
.section_contact p{
	font-size: 14px;
	padding-bottom: 8px;
}
.section_contact .address_middle p{
	padding-bottom: 10px;
}
.section_contact h4{
	font-size: 30px;
	font-weight: 500;
}
.section_contact a{
	text-decoration: none;
	color: inherit;
}
.section_contact .address_footer a{
	text-decoration: none;
	border-bottom: 1px solid #777;
	color: #777;
	padding-bottom: 1px;
	transition: all 0.5s ease;
}
.section_contact .address_footer a:hover{
	color: #000;
	border-bottom: 1px solid #000;
}
.contact_form .empty_notice{
	color: #856267;
	margin-bottom: 7px;
	display: none;
	text-align: left;
}
.contact_form .error{
	color: #856267;
	text-align: left;
	font-weight: 500;
}
.contact_form .success{
	color:#3A00FF;
	margin-bottom: 7px;
	text-align: left;
	font-weight: 500;
}

/*------------------------------------------------------------------*/
/*	13) NEW SLIDER: main slider
/*------------------------------------------------------------------*/
.main_slider{
	width: 100%;
	float: left;
	clear: both;
}
.main_slider .swiper-slide {
  	height: auto;
}
.main_slider .img_holder{
	z-index: 1;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	transition: all 1s ease-in-out;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}
.main_slider .swiper-slide-active .img_holder{
	transform: scale(1.2);
}
.main_slider .img_holder:after{
	content: '';
	position: absolute;
	z-index: 1;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(24,24,24,.8);
}
.main_slider .item{
	padding: 200px 0;
	min-height: 100vh;
	height: 100%;
	display: flex;
	align-items: center;
	overflow: hidden;
}
.main_slider .title_holder{
	position: relative;
	z-index: 4;
	max-width: 1360px;
	margin: 0 auto;
	padding: 0 180px;
	text-align: center;
}
.main_slider .title_holder h3{
	font-size: 72px;
	line-height: 1.25;
	margin: 0;
	padding: 0;
	color: #fff;
	font-weight: 500;
	letter-spacing: 0;
	opacity: 0;
	transform: translateY(20px) rotate(5deg);
	transition: all .3s ease-in-out;
}
.main_slider .swiper-slide-active .title_holder h3{
	opacity: 1;
	transform: translateY(0px) rotate(0deg);
}
.main_slider .title_holder h3 .word{
	display: inline-block;
}
.main_slider .title_holder h3 .char{
	display: inline-block;
	position: relative;
	opacity: 0;
	visibility: hidden;
	transform: translateZ(0) rotateY(-90deg);
	
	-webkit-transition: all .4s ease-in-out;
	   -moz-transition: all .4s ease-in-out;
	    -ms-transition: all .4s ease-in-out;
	     -o-transition: all .4s ease-in-out;
	        transition: all .4s ease-in-out;
}
.main_slider .title_holder h3 .char.opened{
	opacity: 1;
	visibility: visible;
	transform: rotate(0deg);
}
.nav__prev,
.nav__next{
	display: block;
	margin: 0;
	padding: 0;
	position: absolute;
	z-index: 5;
	top: 50%;
	margin-top: -40px;
	width: 80px;
	height: 80px;
	border-radius: 50%;
	background-color: rgba(0,0,0,0.8);
	cursor: pointer;
}
.nav__prev .persono_fn_svg,
.nav__next .persono_fn_svg{
	opacity: 0;
	width: 24px;
	height: 24px;
	position: absolute;
	left: 50%;
	top: 50%;
	margin: -12px 0 0 -12px;
	color: #fff;
}
.nav__prev .persono_fn_svg.replaced-svg,
.nav__next .persono_fn_svg.replaced-svg{
	opacity: 1;
}
.nav__next{
	right: 50px;
}
.nav__prev{
	left: 50px;
}
.nav__prev .persono_fn_svg{
	transform: rotate(180deg);
}
@media(max-width: 1040px){
	.main_slider .title_holder h3{font-size: 36px;}
	.nav__next{right: 20px;}
	.nav__prev{left: 20px;}
	.nav__prev,
	.nav__next{
		width: 40px;
		height: 40px;
		margin-top: -20px;
	}
	.main_slider .title_holder{
		padding: 0 80px;
		max-width: 960px;
	}
	.nav__prev .persono_fn_svg,
	.nav__next .persono_fn_svg{
		width: 16px;
		height: 16px;
		margin: -8px 0 0 -8px;
	}
	.main_slider .title_holder{
		padding: 0 80px;
		max-width: 960px;
	}
}
/*------------------------------------------------------------------*/
/*	14) RESPONSIVE MEDIA QUERIES
/*------------------------------------------------------------------*/
@media(max-width: 1400px){
	.persono_fn_sidebar{width: 300px;}
	.persono_fn_content{padding-left: 300px;}
	.persono_popup{left: 300px;}
	.persono_popup .content{padding: 40px 0;}
}
@media(min-width: 1041px) and (max-width: 1400px){
	.persono_popup .fn__closer{right: 24px;top: 18px;}
}
@media(max-width: 1200px){
	.section_home .home_left{width: 60%;min-width: 60%;}
	.section_home .home_right{left: -30%;}
	.section_about .about_left{width: 100%;padding-right: 0;margin-bottom: 70px;}
	.section_about .about_right{width: 100%;padding-left: 0;}
	.section_about .about_content{
		-webkit-flex-direction: column;
		-moz-flex-direction: column;
		-ms-flex-direction: column;
		-o-flex-direction: column;
		flex-direction: column;
	}
	.section_about .about_mover{right: 0;}
	.section_portfolio .portfolio_list li{width: 50%;}
	.section_blog li{width: 50%;}
	.section_blog li:nth-of-type(3n+1){width: 100%;}
	.section_contact .contact_footer{
		-webkit-flex-direction: column;
		-moz-flex-direction: column;
		-ms-flex-direction: column;
		-o-flex-direction: column;
		flex-direction: column;
	}
	.section_contact .contact_footer_form{width: 100%;margin-bottom: 70px;}
	.section_contact .contact_footer_address{padding-left: 0;}
}
@media(max-width: 1040px){
	.persono_popup .info_list li{width: 50%;}
	.persono_fn_sidebar{display: none;}
	.persono_fn_mobilemenu{display: block;}
	.persono_fn_content{padding-left: 0;}
	.container{padding: 0 20px;}
	.persono_popup .content{padding: 20px 0;}
	.section_about{padding-top: 100px;}
	.section_services{padding-top: 100px;}
	.section_resume{padding-top: 0;}
	.section_portfolio{padding-top: 0;}
	.section_blog{padding-top: 0;}
	.section_contact{padding-top: 50px;padding-bottom: 100px;}
}
@media(max-width: 768px){
	.section_home .home_left{width: 100%;min-width: 100%;}
	.section_home .home_right{left: -85%;opacity: .3;width: 100%;min-width: 100%;}
	.section_about .left_in{padding: 37px 30px 44px;}
	.persono_services .list > li{width: 100%;margin-bottom: 30px;}
	.persono_services.opened .service_list{display: none;}
	.persono_services.opened .content{width: 100%;}
	.section_resume li > span{width: 100%;margin-bottom: 10px;}
	.section_resume li > span:last-child{margin-bottom: 0px;}
	.section_resume li .middle_text{padding-left: 0;}
	.section_resume li:nth-of-type(2n+1) > span{text-align: left !important;}
	.section_resume li:nth-of-type(2n) > span{text-align: right !important;}
	.section_resume .fn_tooltip{width: 100%;}
	.section_portfolio .portfolio_list li{width: 100%;margin-bottom: 30px;}
	.section_blog li{width: 100%;}
	.persono_popup .popup_nav{
		-webkit-flex-direction: column;
		-moz-flex-direction: column;
		-ms-flex-direction: column;
		-o-flex-direction: column;
		flex-direction: column;
		-ms-align-items: center;
		align-items: center;
	}
	.persono_popup .post_nav{width: 100%;max-width: 100%;}
	.persono_popup .go_home{margin: 20px;}
	.persono_popup .post_nav span{display: none;}
	.persono_popup .post_nav a{padding: 0 20px;}
	.section_about .about_left h5{
		-webkit-flex-direction: column;
		-moz-flex-direction: column;
		-ms-flex-direction: column;
		-o-flex-direction: column;
		flex-direction: column;
	}
	.section_about .about_left .about_title{margin: 0 0 5px;}
}
@media(max-width: 480px){
	.section_home .home_right{left: -100%;}
	.section_contact .half{width: 100%;}
	.persono_popup .img_list li{width: 100%;}
	.persono_popup .info_list li{width: 100%;}
}

/* ====== AYŞENAZ – HOTFIX: Tema ile çakışan override'ları toparla ====== */

/* 1) Genel: aşırı müdahaleleri geri al */
body{ background:initial; color:inherit; line-height:inherit; }
section{ padding:initial; } /* Tema kendi boşluklarını versin */
h1,h2,h3,h4{ color:inherit; } /* Temanın renkleri kalsın */

/* 2) Hero (Home): overlay taşmasını ve içerik kontrastını düzelt */
.section_home{
  position: relative;              /* ::before artık doğru bağlanır */
  min-height: 92vh;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0,0,0,.12);
}
.section_home::before{
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.20) 60%, rgba(0,0,0,.15));
  pointer-events:none;
}
.section_home .home_slider_content{
  position: relative;
  z-index: 1;
  text-align: center;
  color: #fff;
  padding: 36px 16px;
  max-width: 980px;
  margin: 0 auto;
}
.section_home .home_slider_content h1{
  font-weight: 800;
  font-size: clamp(32px, 5vw, 56px);
  margin-bottom: 14px;
}
.section_home .home_slider_content p{
  font-size: clamp(15px, 2vw, 20px);
  margin: 0 auto 22px;
  max-width: 760px;
}

/* 3) About bölümünü sabitle (inline style'a gerek kalmasın) */
.section_about .about_content{
  display:flex; gap:32px; align-items:center; 
}
.section_about .about_left img{
  border-radius: 16px;
  box-shadow: 0 10px 25px rgba(0,0,0,.12);
  max-width: 340px; width: 100%; height: auto; display:block;
}
.section_about .about_right{
  background: #fff;
  border: 1px solid #eee;
  border-radius: 16px;
  box-shadow: 0 8px 18px rgba(0,0,0,.08);
  padding: 22px;
}
@media (max-width: 992px){
  .section_about .about_content{ flex-direction: column; gap:20px; }
}

/* 4) Hizmet kartları – sadece hafif kozmetik */
.persono_services .item{
  border-radius: 16px;
  border: 1px solid #f1f1f1;
  box-shadow: 0 8px 20px rgba(0,0,0,.08);
}
.persono_services .item:hover{
  transform: translateY(-2px);
  box-shadow: 0 14px 30px rgba(0,0,0,.12);
}

/* 5) Portföy/blog grid'lerini temaya bırak (biz bozmayalım) */
.section_portfolio .portfolio_list .list{
  display: block;   /* önceki grid override'ını geri al */
}
.section_portfolio .list_item .item{
  border-radius: 16px; overflow: hidden;
}
.section_portfolio .list_item img{
  width:100%; height:auto; display:block;
  transition: transform .25s ease, opacity .25s ease;
}
.section_portfolio .list_item .item:hover img{ transform: scale(1.02); opacity: .98; }

.section_blog .list{
  display: block; /* grid’i kapat, tema düzeni kalsın */
}
.section_blog .item{
  border-radius: 14px;
  border: 1px solid #f1f1f1;
  box-shadow: 0 8px 18px rgba(0,0,0,.07);
  padding: 18px;
}

/* 6) Form yerleşimi: :has() kullanmadan sağlam layout */
.contact_form ul{
  list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:12px;
}
.contact_form li.half{ grid-column: span 1; }
.contact_form li textarea.message{ width:100%; }
.contact_form li:nth-child(4){ grid-column: 1 / -1; } /* mesaj alanı tam genişlik */
@media (max-width: 768px){
  .contact_form ul{ grid-template-columns: 1fr; }
  .contact_form li.half{ grid-column: auto; }
}
.contact_form input, .contact_form textarea{
  border-radius: 10px; border:1px solid #e8e8e8; background:#fff; font-size:16px; padding:12px 14px;
}
.contact_form .submit{
  border-radius: 999px; font-weight:700; background: #856267; color:#fff; border:none;
}

/* 7) Buton – sade ve temaya uyumlu */
.persono_fn_button,
.persono_fn_button:visited{
  display:inline-flex; align-items:center; justify-content:center;
  padding:12px 20px; border-radius:999px; text-decoration:none;
  background:#856267; color:#fff; font-weight:700;
  transition: transform .15s ease, box-shadow .15s ease;
  box-shadow: 0 8px 18px rgba(0,0,0,.12);
}
.persono_fn_button:hover{ transform: translateY(-1px); box-shadow: 0 12px 26px rgba(0,0,0,.16); }

/* =========================================================
   NEW LANDING (CV) — Ayşenaz Demir
   Not: Bu blok style.css dosyasının EN ALTINA eklensin.
   ========================================================= */

:root{
  --nl-bg:#0b0b10;
  --nl-card:#11111a;
  --nl-muted:#b9b9c6;
  --nl-text:#ffffff;
  --nl-brand:#856267;
  --nl-line:rgba(255,255,255,.10);
  --nl-radius:18px;
  --nl-shadow: 0 18px 50px rgba(0,0,0,.35);
  --nl-max: 1120px;
  --nl-h1: clamp(40px, 6vw, 68px);
  --nl-h2: clamp(26px, 3.5vw, 42px);
}

html{scroll-behavior:smooth}

/* Sayfanın geneli (bu tasarım kullanılan sayfada body’yi etkiler) */
body{
  margin:0;
  font-family:"Manrope", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  background:
    radial-gradient(1200px 600px at 20% -10%, rgba(255,82,81,.18), transparent 60%),
    radial-gradient(900px 600px at 90% 10%, rgba(120,80,255,.15), transparent 55%),
    var(--nl-bg);
  color:var(--nl-text);
}

a{color:inherit;text-decoration:none}

/* Container */
.nl-container{
  width:min(var(--nl-max), calc(100% - 40px));
  margin:0 auto;
}

/* ================= Header ================= */
.nl-topbar{
  position:sticky; top:0; z-index:100;
  backdrop-filter: blur(10px);
  background: rgba(11,11,16,.6);
  border-bottom: 1px solid var(--nl-line);
}
.nl-nav{
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 0;
  gap:16px;
}
.nl-brand{
  display:flex; align-items:center; gap:12px;
  min-width:200px;
}
.nl-brand img{
  width:40px;height:40px;object-fit:contain;border-radius:10px;
  background: rgba(255,255,255,.06);
  border:1px solid var(--nl-line);
  padding:6px;
}
.nl-brand .nl-brand-text{
  display:flex; flex-direction:column; line-height:1.1;
}
.nl-brand .nl-brand-text strong{font-weight:800; letter-spacing:.2px}
.nl-brand .nl-brand-text span{color:var(--nl-muted); font-size:12.5px}

.nl-menu{display:flex; gap:18px; align-items:center}
.nl-menu a{
  color:var(--nl-muted);
  font-weight:700;
  font-size:14px;
  padding:10px 10px;
  border-radius:999px;
  transition:.2s;
}
.nl-menu a:hover{color:var(--nl-text); background:rgba(255,255,255,.06)}

.nl-cta{display:flex; gap:10px; align-items:center}

.nl-btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:11px 16px;
  border-radius:999px;
  border:1px solid var(--nl-line);
  background:rgba(255,255,255,.06);
  color:var(--nl-text);
  font-weight:800;
  font-size:14px;
  transition:.2s;
  white-space:nowrap;
}
.nl-btn:hover{transform:translateY(-1px); box-shadow:0 10px 24px rgba(0,0,0,.25)}
.nl-btn.nl-primary{
  background:linear-gradient(135deg, var(--nl-brand), #ff7a79);
  border-color: transparent;
}

.nl-burger{display:none}
.nl-burger button{
  width:44px;height:44px;border-radius:12px;
  border:1px solid var(--nl-line);
  background:rgba(255,255,255,.06);
  color:#fff; font-size:18px; cursor:pointer;
}

/* Mobile drawer */
.nl-drawer{
  display:none;
  border-top:1px solid var(--nl-line);
  padding:10px 0 14px;
}
.nl-drawer a{
  display:block;
  padding:12px 10px;
  border-radius:12px;
  color:var(--nl-muted);
  font-weight:800;
}
.nl-drawer a:hover{
  background:rgba(255,255,255,.06);
  color:#fff;
}

/* ================= Hero ================= */
.nl-hero{padding:64px 0 34px}

.nl-hero-grid{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap:28px;
  align-items:stretch;
}

.nl-hero-card{
  border:1px solid var(--nl-line);
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  border-radius:var(--nl-radius);
  box-shadow:var(--nl-shadow);
  overflow:hidden;
  position:relative;
  padding:34px;
  min-height:420px;
}
.nl-hero-card:before{
  content:"";
  position:absolute; inset:-2px;
  background: radial-gradient(900px 300px at 20% 0%, rgba(255,82,81,.25), transparent 60%);
  pointer-events:none;
}

.nl-hero-kicker{
  display:inline-flex; gap:10px; align-items:center;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid var(--nl-line);
  background:rgba(255,255,255,.05);
  color:var(--nl-muted);
  font-weight:800;
  font-size:12px;
  position:relative;
}
.nl-hero-kicker b{color:var(--nl-text)}

.nl-hero-title{
  margin:14px 0 10px;
  font-family:"Dancing Script", cursive;
  font-size:var(--nl-h1);
  line-height:1.02;
  position:relative;
}
.nl-hero-p{
  color:rgba(255,255,255,.86);
  font-size:16px;
  line-height:1.75;
  max-width:60ch;
  position:relative;
}
.nl-hero-actions{
  margin-top:18px;
  display:flex; gap:12px; flex-wrap:wrap;
  position:relative;
}
.nl-chips{
  margin-top:18px;
  display:flex; flex-wrap:wrap; gap:10px;
  position:relative;
}
.nl-chip{
  padding:8px 12px;
  border-radius:999px;
  border:1px solid var(--nl-line);
  background:rgba(255,255,255,.05);
  color:rgba(255,255,255,.86);
  font-weight:700;
  font-size:13px;
}

.nl-hero-side{
  border:1px solid var(--nl-line);
  background:rgba(255,255,255,.04);
  border-radius:var(--nl-radius);
  box-shadow:var(--nl-shadow);
  overflow:hidden;
  display:flex;
  flex-direction:column;
}
.nl-hero-img{
  aspect-ratio: 4 / 3;
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
  filter: saturate(1.05) contrast(1.05);
}
.nl-hero-side-body{
  padding:18px 18px 20px;
  display:grid;
  gap:12px;
}
.nl-mini{
  border:1px solid var(--nl-line);
  border-radius:14px;
  padding:12px 12px;
  background:rgba(0,0,0,.18);
}
.nl-mini strong{display:block; font-size:13px; color:rgba(255,255,255,.90)}
.nl-mini span{
  display:block;
  font-size:13px;
  color:var(--nl-muted);
  margin-top:4px;
  line-height:1.5;
}

/* ================= Responsive ================= */
@media (max-width: 980px){
  .nl-menu{display:none}
  .nl-burger{display:block}
  .nl-hero-grid{grid-template-columns:1fr}
  .nl-hero-card{min-height:auto}
}
/* ================= Sections: Headings ================= */
.nl-sec-head{margin:44px 0 18px}
.nl-sec-title{
  margin:0 0 8px 0;
  font-size: var(--nl-h2);
  font-weight:800;
  letter-spacing:.2px;
}
.nl-sec-sub{margin:0;color:var(--nl-muted);max-width:70ch;line-height:1.7}
/* ================= Hero Right Premium ================= */
.nl-hero-side-premium .nl-hero-side-body{
  padding:16px 16px 18px;
  display:grid;
  gap:12px;
}

.nl-feature{
  border:1px solid rgba(120, 84, 113, .14);
  background: rgba(255,255,255,.78);
  border-radius: 16px;
  padding:12px 12px;
}

.nl-feature-top{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:10px;
  margin-bottom:8px;
}

.nl-feature-top strong{
  font-weight:900;
  color: var(--nl-murdum);
  font-size:13.5px;
}

.nl-feature-top span{
  font-weight:800;
  color: rgba(106, 44, 112, .70);
  font-size:12.5px;
}

.nl-feature p{
  margin:0;
  color: var(--nl-muted);
  line-height:1.65;
  font-size:13.5px;
}

.nl-feature-cta{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  justify-content:flex-start;
  background: transparent;
  border:0;
  padding:0;
}

/* ================= About ================= */
.nl-about{padding:10px 0 18px}
.nl-about-grid{
  display:grid;
  grid-template-columns: .9fr 1.1fr;
  gap:22px;
  align-items:start;
}

.nl-about-card{
  position:relative;
  border:1px solid var(--nl-line);
  background:rgba(255,255,255,.04);
  border-radius:var(--nl-radius);
  box-shadow:var(--nl-shadow);
  padding:18px;
}

.nl-about-badge{
  position:absolute; top:14px; left:14px;
  background:linear-gradient(135deg, var(--nl-brand), #ff7a79);
  color:#fff;
  font-weight:900;
  font-size:12px;
  letter-spacing:.3px;
  padding:7px 10px;
  border-radius:999px;
}

.nl-about-photo{
  margin-top:26px;
  border-radius:16px;
  border:1px solid var(--nl-line);
  aspect-ratio: 4 / 3;
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
  box-shadow:0 12px 26px rgba(0,0,0,.35);
}

.nl-about-name{margin:14px 4px 10px; display:grid; gap:3px}
.nl-about-name strong{font-size:18px}
.nl-about-name span{color:var(--nl-muted); font-weight:700; font-size:13px}

.nl-about-pills{
  list-style:none; margin:0; padding:0;
  display:grid; gap:10px;
}
.nl-about-pills li{
  border:1px dashed rgba(255,255,255,.18);
  background:rgba(0,0,0,.18);
  border-radius:14px;
  padding:10px 12px;
}
.nl-about-pills b{display:block; color:#6c2f72; font-size:13px}
.nl-about-pills span{display:block; color:var(--nl-muted); font-size:13px; margin-top:4px; line-height:1.45}

.nl-about-actions{display:flex; gap:10px; flex-wrap:wrap; margin-top:14px}

.nl-about-story{
  border:1px solid var(--nl-line);
  background:rgba(255,255,255,.03);
  border-radius:var(--nl-radius);
  box-shadow:var(--nl-shadow);
  padding:18px 18px;
}
.nl-about-story p{margin:0 0 12px; color:rgba(255,255,255,.88); line-height:1.8}
.nl-about-story p:last-child{margin-bottom:0}

.nl-about-tags{display:flex; flex-wrap:wrap; gap:10px; margin-top:10px}
.nl-tag{
  padding:8px 12px;
  border-radius:999px;
  border:1px solid var(--nl-line);
  background:rgba(255,255,255,.05);
  color:rgba(255,255,255,.86);
  font-weight:800;
  font-size:13px;
}

@media (max-width: 980px){
  .nl-about-grid{grid-template-columns:1fr}
}
	/* ================= Services ================= */
.nl-services{padding:10px 0 18px}

.nl-services-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:18px;
}

.nl-svc-card{
  border:1px solid var(--nl-line);
  background:rgba(255,255,255,.03);
  border-radius:var(--nl-radius);
  box-shadow:var(--nl-shadow);
  overflow:hidden;
  transition: transform .2s ease, box-shadow .2s ease;
}
.nl-svc-card:hover{
  transform: translateY(-2px);
  box-shadow: 0 22px 70px rgba(0,0,0,.45);
}

.nl-svc-media{
  position:relative;
  aspect-ratio: 4 / 3;
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
  filter:saturate(1.05) contrast(1.05);
}
.nl-svc-media:after{
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.55));
  pointer-events:none;
}

.nl-svc-badge{
  position:absolute; top:12px; left:12px; z-index:2;
  width:38px; height:38px; border-radius:999px;
  display:flex; align-items:center; justify-content:center;
  font-weight:900; font-size:14px;
  color:#fff;
  background:linear-gradient(135deg, var(--nl-brand), #ff7a79);
  box-shadow:0 10px 24px rgba(0,0,0,.35);
}

.nl-svc-body{padding:14px 14px 16px}
.nl-svc-title{margin:2px 0 6px; font-size:16px; font-weight:900}
.nl-svc-desc{margin:0 0 10px; color:rgba(255,255,255,.82); line-height:1.65; font-size:14px}

.nl-svc-tags{display:flex; flex-wrap:wrap; gap:8px}
.nl-svc-tags span{
  font-size:12.5px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid var(--nl-line);
  background:rgba(255,255,255,.05);
  color:rgba(255,255,255,.86);
  font-weight:800;
}

.nl-services-cta{margin-top:16px; display:flex; gap:10px; flex-wrap:wrap}

@media (max-width: 1100px){
  .nl-services-grid{grid-template-columns: repeat(2, minmax(0, 1fr));}
}
@media (max-width: 680px){
  .nl-services-grid{grid-template-columns: 1fr;}
}
/* ================= Resume / Timeline ================= */
.nl-resume{padding:10px 0 18px}

.nl-timeline{
  list-style:none;
  margin:16px 0 0;
  padding:0;
  position:relative;
}

/* dikey çizgi */
.nl-timeline::before{
  content:"";
  position:absolute;
  left:26px;
  top:0;
  bottom:0;
  width:2px;
  background: linear-gradient(rgba(255,255,255,.10), rgba(255,82,81,.65), rgba(255,255,255,.10));
  opacity:.8;
}

.nl-t-item{
  position:relative;
  padding-left:72px;
  margin:0 0 18px 0;
}

.nl-t-dot{
  position:absolute;
  left:0;
  top:6px;
  width:92px;
  transform: translateX(-8px);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  padding:7px 10px;
  border:1px solid rgba(255,255,255,.18);
  background: rgba(0,0,0,.25);
  color:#fff;
  font-weight:900;
  font-size:12px;
  box-shadow:0 10px 24px rgba(0,0,0,.35);
}

.nl-t-card{
  border:1px solid var(--nl-line);
  background: rgba(255,255,255,.03);
  border-radius: var(--nl-radius);
  box-shadow: var(--nl-shadow);
  padding:14px 16px;
}

.nl-t-title{
  margin:0 0 6px 0;
  font-size:16px;
  font-weight:900;
}
.nl-t-place{
  color:var(--nl-muted);
  font-weight:800;
  font-size:13px;
  margin-bottom:8px;
}
.nl-t-desc{
  margin:0;
  color:rgba(255,255,255,.86);
  line-height:1.75;
  font-size:14px;
}

.nl-badges{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:10px;
}
.nl-badges span{
  font-size:12.5px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid var(--nl-line);
  background:rgba(255,255,255,.05);
  color:rgba(255,255,255,.88);
  font-weight:900;
}

.nl-resume-cta{margin-top:14px; display:flex; gap:10px; flex-wrap:wrap}

/* Responsive */
@media (max-width: 720px){
  .nl-timeline::before{left:18px;}
  .nl-t-item{padding-left:54px;}
  .nl-t-dot{
    width:auto;
    left:0;
    transform:none;
    padding:6px 10px;
    font-size:12px;
  }
}
/* ================= News ================= */
.nl-news{padding:10px 0 18px}

.nl-news-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:18px;
}

.nl-news-card{
  border:1px solid var(--nl-line);
  background:rgba(255,255,255,.03);
  border-radius:var(--nl-radius);
  box-shadow:var(--nl-shadow);
  overflow:hidden;
  transition: transform .2s ease, box-shadow .2s ease;
}
.nl-news-card:hover{
  transform: translateY(-2px);
  box-shadow: 0 22px 70px rgba(0,0,0,.45);
}

.nl-news-media{
  aspect-ratio: 16 / 10;
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
  filter:saturate(1.05) contrast(1.05);
  position:relative;
}
.nl-news-media:after{
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,.05), rgba(0,0,0,.45));
  pointer-events:none;
}

.nl-news-body{padding:14px 14px 16px}
.nl-news-meta{
  display:flex; align-items:center; gap:10px;
  color:var(--nl-muted);
  font-weight:800;
  font-size:12.5px;
  margin-bottom:8px;
}
.nl-news-tag{
  padding:6px 10px;
  border-radius:999px;
  border:1px solid var(--nl-line);
  background:rgba(255,255,255,.05);
  color:rgba(255,255,255,.88);
  font-weight:900;
  font-size:12px;
}
.nl-news-title{margin:0 0 8px; font-size:15.5px; font-weight:900; line-height:1.25}
.nl-news-desc{margin:0; color:rgba(255,255,255,.84); line-height:1.7; font-size:14px}

.nl-news-cta{margin-top:14px; display:flex; gap:10px; flex-wrap:wrap}

@media (max-width: 1100px){
  .nl-news-grid{grid-template-columns: repeat(2, minmax(0, 1fr));}
}
@media (max-width: 680px){
  .nl-news-grid{grid-template-columns: 1fr;}
}
/* ================= Contact ================= */
.nl-contact{padding:10px 0 34px}

.nl-contact-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:18px;
  align-items:start;
}

.nl-contact-card{
  border:1px solid var(--nl-line);
  background:rgba(255,255,255,.03);
  border-radius:var(--nl-radius);
  box-shadow:var(--nl-shadow);
  padding:16px;
}

.nl-form-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:12px;
}
.nl-field{display:grid; gap:6px}
.nl-field label{
  font-size:12.5px;
  font-weight:900;
  color:rgba(255,255,255,.90);
}
.nl-field input,
.nl-field textarea{
  width:100%;
  padding:12px 12px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(0,0,0,.22);
  color:#fff;
  outline:none;
}
.nl-field textarea{resize:vertical; min-height:160px}
.nl-field input::placeholder,
.nl-field textarea::placeholder{color:rgba(255,255,255,.50)}
.nl-field input:focus,
.nl-field textarea:focus{
  border-color: rgba(255,82,81,.65);
  box-shadow:0 0 0 2px rgba(255,82,81,.18);
}
.nl-full{grid-column: 1 / -1}

.nl-form-actions{
  margin-top:12px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.nl-contact-info .nl-info-block{margin-bottom:14px}
.nl-info-label{
  display:block;
  color:var(--nl-muted);
  font-weight:900;
  font-size:12px;
  margin-bottom:6px;
}
.nl-contact-info strong{
  display:block;
  font-size:14.5px;
  line-height:1.6;
}
.nl-info-link{
  font-weight:900;
  font-size:14.5px;
  color:#6a2c70;
}
.nl-info-link:hover{opacity:.9}

.nl-info-mini{
  display:grid;
  gap:12px;
  margin-top:12px;
}

/* ================= Footer ================= */
.nl-footer{
  border-top:1px solid var(--nl-line);
  padding:18px 0 22px;
  background: rgba(0,0,0,.22);
}
.nl-footer-grid{
  display:grid;
  grid-template-columns: 1fr 1.2fr 1fr;
  gap:14px;
  align-items:center;
}
.nl-footer-brand{display:grid; gap:4px}
.nl-footer-brand strong{font-weight:900}
.nl-footer-brand span{color:var(--nl-muted); font-weight:800; font-size:13px}

.nl-footer-links{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:center;
}
.nl-footer-links a{
  padding:8px 10px;
  border-radius:999px;
  border:1px solid var(--nl-line);
  background:rgba(255,255,255,.04);
  color:rgba(255,255,255,.88);
  font-weight:900;
  font-size:12.5px;
}
.nl-footer-links a:hover{background:rgba(255,255,255,.07)}

.nl-footer-copy{
  display:grid;
  gap:4px;
  justify-items:end;
  text-align:right;
  color:rgba(255,255,255,.82);
  font-weight:800;
  font-size:12.5px;
}
.nl-footer-muted{color:var(--nl-muted)}

@media (max-width: 980px){
  .nl-contact-grid{grid-template-columns:1fr}
  .nl-form-grid{grid-template-columns:1fr}
  .nl-footer-grid{grid-template-columns:1fr; justify-items:center; text-align:center}
  .nl-footer-copy{justify-items:center; text-align:center}
}
/* ================= WhatsApp Floating Button ================= */
.nl-wa{
  position:fixed;
  right:18px;
  bottom:18px;
  z-index:9999;
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:12px 14px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(0,0,0,.35);
  backdrop-filter: blur(10px);
  color:#fff;
  font-weight:900;
  font-size:14px;
  box-shadow:0 18px 45px rgba(0,0,0,.45);
}
.nl-wa:hover{transform:translateY(-1px)}
.nl-wa-dot{
  width:10px;height:10px;border-radius:999px;
  background:#25D366;
  box-shadow:0 0 0 4px rgba(37,211,102,.18);
}
/* =========================================================
   NEW LANDING — PASTEL THEME OVERRIDE
   style.css EN ALTINA ekle
   ========================================================= */

:root{
  /* Ana palet */
  --nl-bg: #fff7fb;              /* pudra beyazı */
  --nl-text: #2b2430;            /* koyu mürdüm-gri */
  --nl-muted: #6f6372;           /* yumuşak metin */
  --nl-line: rgba(120, 84, 113, .14);

  /* Kartlar */
  --nl-card: rgba(255,255,255,.72);
  --nl-shadow: 0 18px 45px rgba(120, 84, 113, .14);

  /* Vurgu renkleri */
  --nl-brand: #d88aa6;           /* toz pembe */
  --nl-gold:  #caa24a;           /* altın sarısı */
  --nl-baby:  #9fc9e8;           /* bebek mavisi */
  --nl-murdum:#6a2c70;           /* mürdüm */
}

/* Arka planı yumuşatıp “gelinlik” havası verelim */
body{
  background:
    radial-gradient(900px 420px at 15% 0%, rgba(216,138,166,.28), transparent 62%),
    radial-gradient(900px 420px at 90% 10%, rgba(159,201,232,.30), transparent 60%),
    radial-gradient(800px 520px at 50% 100%, rgba(202,162,74,.16), transparent 60%),
    linear-gradient(180deg, #fff7fb 0%, #fffdf7 55%, #fff7fb 100%);
  color: var(--nl-text);
}

/* Header (şeffaf siyah yerine pastel cam efekti) */
.nl-topbar{
  background: rgba(255, 247, 251, .72);
  border-bottom: 1px solid var(--nl-line);
}

/* Link/menü renkleri */
.nl-menu a{ color: var(--nl-muted); }
.nl-menu a:hover{
  color: var(--nl-murdum);
  background: rgba(216,138,166,.14);
}

/* Genel kart yüzeyleri (hero/about/services/news/resume/contact hepsi etkilenir) */
.nl-hero-card,
.nl-hero-side,
.nl-about-card,
.nl-about-story,
.nl-svc-card,
.nl-news-card,
.nl-t-card,
.nl-contact-card{
  background: var(--nl-card);
  border: 1px solid var(--nl-line);
  box-shadow: var(--nl-shadow);
}

/* Küçük kutular */
.nl-mini{
  background: rgba(255,255,255,.75);
  border: 1px solid rgba(120, 84, 113, .16);
}

/* Başlık rengi */
.nl-sec-title{ color: var(--nl-murdum); }
.nl-sec-sub{ color: var(--nl-muted); }

/* Hero kicker/chips/tags */
.nl-hero-kicker,
.nl-chip,
.nl-tag,
.nl-svc-tags span,
.nl-news-tag,
.nl-badges span,
.nl-footer-links a{
  background: rgba(255,255,255,.70);
  border: 1px solid rgba(120, 84, 113, .16);
  color: var(--nl-murdum);
}

/* Primary buton: pudra → altın geçişli */
.nl-btn.nl-primary{
  background: linear-gradient(135deg, var(--nl-brand), var(--nl-gold));
  color: #ffffff;
}

/* Normal buton */
.nl-btn{
  background: rgba(255,255,255,.72);
  border: 1px solid rgba(120, 84, 113, .18);
  color: var(--nl-murdum);
}

/* Badge numaraları (kart üstü) */
.nl-svc-badge{
  background: linear-gradient(135deg, var(--nl-murdum), var(--nl-brand));
}
.nl-about-badge{
  background: linear-gradient(135deg, var(--nl-gold), var(--nl-brand));
}

/* Timeline çizgisi daha soft */
.nl-timeline::before{
  background: linear-gradient(rgba(216,138,166,.25), rgba(202,162,74,.55), rgba(159,201,232,.25));
}

/* Footer */
.nl-footer{
  background: rgba(255, 255, 255, .65);
  border-top: 1px solid var(--nl-line);
}
.nl-footer-brand span,
.nl-footer-muted{ color: var(--nl-muted); }

/* WhatsApp butonu: koyu yerine pastel cam */
.nl-wa{
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(120, 84, 113, .18);
  color: var(--nl-murdum);
}
.nl-hero-card:before{
  background:
    radial-gradient(900px 300px at 20% 0%, rgba(216,138,166,.20), transparent 62%);
}
/* =========================================================
   PREMIUM TOUCHES — gold hairline + soft hover + satin glow
   style.css EN ALTINA ekle
   ========================================================= */

/* Kartlara ince altın “hairline” ve çok hafif parlama */
.nl-hero-card,
.nl-hero-side,
.nl-about-card,
.nl-about-story,
.nl-svc-card,
.nl-news-card,
.nl-t-card,
.nl-contact-card{
  position:relative;
  overflow:hidden;
}

/* üst kenarda altın çizgi */
.nl-hero-card::after,
.nl-hero-side::after,
.nl-about-card::after,
.nl-about-story::after,
.nl-svc-card::after,
.nl-news-card::after,
.nl-t-card::after,
.nl-contact-card::after{
  content:"";
  position:absolute;
  left:14px;
  right:14px;
  top:10px;
  height:1px;
  background: linear-gradient(90deg, transparent, rgba(202,162,74,.85), transparent);
  opacity:.55;
  pointer-events:none;
}

/* Kart içine “saten” yansıma */
.nl-hero-card::before,
.nl-about-card::before,
.nl-svc-card::before,
.nl-news-card::before,
.nl-t-card::before,
.nl-contact-card::before{
  content:"";
  position:absolute;
  inset:-60px -120px auto auto;
  width:260px;
  height:260px;
  background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.55), rgba(255,255,255,0) 60%);
  transform: rotate(18deg);
  opacity:.35;
  pointer-events:none;
}

/* Hover: yükselme + gölge + border rengi */
.nl-svc-card:hover,
.nl-news-card:hover{
  transform: translateY(-3px);
  box-shadow: 0 22px 55px rgba(120, 84, 113, .18);
  border-color: rgba(202,162,74,.35);
}

/* Hizmet/Haber görsellerine yumuşak “şampanya” filtre */
.nl-svc-media,
.nl-news-media{
  filter: saturate(1.03) contrast(1.02);
}

/* Butonlar daha zarif: hover’da altın halo */
.nl-btn:hover{
  box-shadow: 0 14px 28px rgba(202,162,74,.16);
  border-color: rgba(202,162,74,.35);
}

/* Primary buton: altın ışık */
.nl-btn.nl-primary{
  box-shadow: 0 14px 30px rgba(216,138,166,.22);
}
.nl-btn.nl-primary:hover{
  box-shadow: 0 16px 34px rgba(202,162,74,.22);
}

/* Menü linklerinde ince underline animasyonu */
.nl-menu a{
  position:relative;
}
.nl-menu a::after{
  content:"";
  position:absolute;
  left:12px;
  right:12px;
  bottom:6px;
  height:1px;
  background: linear-gradient(90deg, transparent, rgba(202,162,74,.85), transparent);
  transform: scaleX(0);
  transform-origin:center;
  transition: transform .22s ease;
  opacity:.75;
}
.nl-menu a:hover::after{
  transform: scaleX(1);
}

/* WhatsApp butonuna premium uyum */
.nl-wa{
  box-shadow: 0 18px 40px rgba(120, 84, 113, .16);
}
.nl-wa:hover{
  box-shadow: 0 20px 44px rgba(202,162,74,.18);
}
/* =========================================================
   PREMIUM TOUCHES — gold hairline + soft hover + satin glow
   style.css EN ALTINA ekle
   ========================================================= */

/* Kartlara ince altın “hairline” ve çok hafif parlama */
.nl-hero-card,
.nl-hero-side,
.nl-about-card,
.nl-about-story,
.nl-svc-card,
.nl-news-card,
.nl-t-card,
.nl-contact-card{
  position:relative;
  overflow:hidden;
}

/* üst kenarda altın çizgi */
.nl-hero-card::after,
.nl-hero-side::after,
.nl-about-card::after,
.nl-about-story::after,
.nl-svc-card::after,
.nl-news-card::after,
.nl-t-card::after,
.nl-contact-card::after{
  content:"";
  position:absolute;
  left:14px;
  right:14px;
  top:10px;
  height:1px;
  background: linear-gradient(90deg, transparent, rgba(202,162,74,.85), transparent);
  opacity:.55;
  pointer-events:none;
}

/* Kart içine “saten” yansıma */
.nl-hero-card::before,
.nl-about-card::before,
.nl-svc-card::before,
.nl-news-card::before,
.nl-t-card::before,
.nl-contact-card::before{
  content:"";
  position:absolute;
  inset:-60px -120px auto auto;
  width:260px;
  height:260px;
  background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.55), rgba(255,255,255,0) 60%);
  transform: rotate(18deg);
  opacity:.35;
  pointer-events:none;
}

/* Hover: yükselme + gölge + border rengi */
.nl-svc-card:hover,
.nl-news-card:hover{
  transform: translateY(-3px);
  box-shadow: 0 22px 55px rgba(120, 84, 113, .18);
  border-color: rgba(202,162,74,.35);
}

/* Hizmet/Haber görsellerine yumuşak “şampanya” filtre */
.nl-svc-media,
.nl-news-media{
  filter: saturate(1.03) contrast(1.02);
}

/* Butonlar daha zarif: hover’da altın halo */
.nl-btn:hover{
  box-shadow: 0 14px 28px rgba(202,162,74,.16);
  border-color: rgba(202,162,74,.35);
}

/* Primary buton: altın ışık */
.nl-btn.nl-primary{
  box-shadow: 0 14px 30px rgba(216,138,166,.22);
}
.nl-btn.nl-primary:hover{
  box-shadow: 0 16px 34px rgba(202,162,74,.22);
}

/* Menü linklerinde ince underline animasyonu */
.nl-menu a{
  position:relative;
}
.nl-menu a::after{
  content:"";
  position:absolute;
  left:12px;
  right:12px;
  bottom:6px;
  height:1px;
  background: linear-gradient(90deg, transparent, rgba(202,162,74,.85), transparent);
  transform: scaleX(0);
  transform-origin:center;
  transition: transform .22s ease;
  opacity:.75;
}
.nl-menu a:hover::after{
  transform: scaleX(1);
}

/* WhatsApp butonuna premium uyum */
.nl-wa{
  box-shadow: 0 18px 40px rgba(120, 84, 113, .16);
}
.nl-wa:hover{
  box-shadow: 0 20px 44px rgba(202,162,74,.18);
}
/* Başlıklara biraz daha zarif letter-spacing */
.nl-sec-title{
  letter-spacing: .4px;
}
/* =========================================================
   TEXT FIX — Pastel theme’de beyaz kalan metinleri düzeltir
   style.css EN ALTINA ekle
   ========================================================= */

.nl-topbar,
.nl-hero,
.nl-about,
.nl-services,
.nl-resume,
.nl-news,
.nl-contact,
.nl-footer{
  color: var(--nl-text);
}

/* Genel paragraflar/açıklamalar */
.nl-hero-p,
.nl-sec-sub,
.nl-about-story p,
.nl-svc-desc,
.nl-news-desc,
.nl-t-desc{
  color: var(--nl-muted) !important;
}

/* Başlıklar */
.nl-hero-title,
.nl-sec-title,
.nl-svc-title,
.nl-news-title,
.nl-t-title{
  color: var(--nl-murdum) !important;
}

/* Küçük metinler */
.nl-brand .nl-brand-text span,
.nl-news-meta,
.nl-t-place,
.nl-info-label,
.nl-footer-muted,
.nl-footer-brand span{
  color: var(--nl-muted) !important;
}

/* Chip/Tag/Badge içleri */
.nl-chip,
.nl-tag,
.nl-svc-tags span,
.nl-badges span,
.nl-news-tag{
  color: var(--nl-murdum) !important;
}

/* Form alanları yazıları */
.nl-field label{
  color: var(--nl-murdum) !important;
}
.nl-field input,
.nl-field textarea{
  color: var(--nl-text) !important;
  background: rgba(255,255,255,.85) !important;
  border-color: rgba(120, 84, 113, .18) !important;
}
.nl-field input::placeholder,
.nl-field textarea::placeholder{
  color: rgba(111, 99, 114, .75) !important;
}

/* Kart içindeki “mini” kutular */
.nl-mini strong{
  color: var(--nl-murdum) !important;
}
.nl-mini span{
  color: var(--nl-muted) !important;
}

/* Butonlar */
.nl-btn{
  color: var(--nl-murdum) !important;
}
.nl-btn.nl-primary{
  color: #fff !important;
}

/* WhatsApp butonu */
.nl-wa{
  color: var(--nl-murdum) !important;
}


/* ================= FULLSCREEN HERO (Banner) ================= */
.nl-hero-full{
  min-height: 100vh;
  display:flex;
  align-items:center;
  padding: 84px 0 34px; /* sticky header için üst pay */
}

.nl-hero-full .nl-hero-grid{
  align-items: stretch;
}

/* Sol kart banner gibi: daha geniş, daha nefes alan */
.nl-hero-full .nl-hero-card{
  padding: 42px;
  min-height: 520px;
}

/* Sağ görsel alanı büyüt */
.nl-hero-full .nl-hero-side{
  min-height: 520px;
}

/* Görsel daha “banner” his versin */
.nl-hero-full .nl-hero-img{
  aspect-ratio: auto;
  min-height: 340px;
}

/* Hero başlık/alt metin biraz daha büyük */
.nl-hero-full .nl-hero-title{
  font-size: clamp(44px, 6.2vw, 78px);
}
.nl-hero-full .nl-hero-p{
  font-size: 16.5px;
}

/* Scroll indicator */
.nl-scroll{
  position:absolute;
  left:50%;
  bottom:16px;
  transform:translateX(-50%);
  width:44px;
  height:44px;
  border-radius:999px;
  border:1px solid rgba(120, 84, 113, .18);
  background: rgba(255,255,255,.75);
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow: 0 16px 40px rgba(120, 84, 113, .12);
}
.nl-scroll span{
  width:10px; height:10px;
  border-right:2px solid rgba(106,44,112,.65);
  border-bottom:2px solid rgba(106,44,112,.65);
  transform: rotate(45deg);
  margin-top:-4px;
  animation: nlScrollBounce 1.4s infinite;
}
@keyframes nlScrollBounce{
  0%,100%{ transform: translateY(0) rotate(45deg); opacity:.75; }
  50%{ transform: translateY(4px) rotate(45deg); opacity:1; }
}

/* Hero kapsayıcıya relative verelim ki scroll düzgün konumlansın */
.nl-hero-full .nl-container{ position:relative; }

/* Responsive */
@media (max-width: 980px){
  .nl-hero-full{
    min-height: auto;
    padding: 74px 0 18px;
  }
  .nl-hero-full .nl-hero-card,
  .nl-hero-full .nl-hero-side{
    min-height: auto;
  }
  .nl-scroll{ display:none; }
}
/* ================= HERO Banner v2 (Full background + portrait) ================= */
.nl-hero-banner2{
  position:relative;
  min-height: 100vh;
  display:flex;
  align-items:center;
  padding: 84px 0 24px;
  overflow:hidden;
}

/* arka plan görsel (tam ekran) */
.nl-hero-banner2 .nl-hero-bg{
  position:absolute;
  inset:0;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  transform:scale(1.02);
  filter:saturate(1.04) contrast(1.04);
}

/* okunurluk için overlay */
.nl-hero-overlay2{
  position:absolute;
  inset:0;
  background:
    radial-gradient(900px 560px at 12% 10%, rgba(216,138,166,.40), transparent 60%),
    radial-gradient(900px 560px at 92% 20%, rgba(159,201,232,.30), transparent 60%),
    linear-gradient(90deg, rgba(255,247,251,.92) 0%, rgba(255,247,251,.84) 45%, rgba(255,247,251,.55) 100%);
}

/* container yerine full inner (kenar boşluğu az) */
.nl-hero-inner{
  position:relative;
  width: min(1320px, calc(100% - 44px)); /* sağ-sol boşluk az */
  margin: 0 auto;
}

/* grid */
.nl-hero-2grid{
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  gap:18px;
  align-items:stretch;
}

/* Sol metin kutusu */
.nl-hero-copy{
  border:1px solid rgba(120, 84, 113, .16);
  background: rgba(255,255,255,.76);
  backdrop-filter: blur(10px);
  border-radius: 26px;
  box-shadow: 0 26px 70px rgba(120, 84, 113, .16);
  padding: 44px;
}

/* Sağ portre alanı (Sadece görsel) */
.nl-hero-portrait{
  position:relative;
  border-radius: 26px;
  overflow:hidden;
  border:1px solid rgba(120, 84, 113, .16);
  box-shadow: 0 26px 70px rgba(120, 84, 113, .16);
  background: rgba(255,255,255,.35);
  backdrop-filter: blur(8px);
  min-height: 560px;
}

/* portre görsel */
.nl-portrait-img{
  position:absolute;
  inset:0;
  background-size:cover;
  background-position:center top;
  filter:saturate(1.02) contrast(1.02);
}

/* portre üzerine çok hafif perde (yazı yok, sadece premium hava) */
.nl-hero-portrait::before{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(180deg, rgba(255,247,251,.06), rgba(255,247,251,.22));
  pointer-events:none;
}

/* ===== İmza Detay: solda premium kutu ===== */
.nl-hero-signleft{
  margin-top: 14px;
  border:1px solid rgba(120, 84, 113, .16);
  background: rgba(255,255,255,.86);
  border-radius: 18px;
  box-shadow: 0 18px 45px rgba(120, 84, 113, .12);
  padding: 12px 12px;
}
.nl-sign-top{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:8px;
}
.nl-sign-dot{
  width:10px;height:10px;border-radius:999px;
  background: var(--nl-gold);
  box-shadow: 0 0 0 4px rgba(202,162,74,.18);
}
.nl-hero-signleft strong{
  color: var(--nl-murdum);
  font-weight:900;
  font-size:13px;
}
.nl-hero-signleft p{
  margin:0;
  color: var(--nl-muted);
  font-weight:800;
  line-height:1.6;
  font-size:13.5px;
}

/* Öne çıkanlar (daha şık mini kutular) */
.nl-hero-points2{
  margin-top:18px;
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap:10px;
}
.nl-point2{
  border:1px solid rgba(120, 84, 113, .14);
  background: rgba(255,255,255,.82);
  border-radius: 16px;
  padding: 12px 12px;
}
.nl-point2 b{
  display:block;
  color:var(--nl-murdum);
  font-weight:900;
  font-size:13px;
}
.nl-point2 span{
  display:block;
  margin-top:4px;
  color:var(--nl-muted);
  font-weight:800;
  font-size:12.5px;
  line-height:1.45;
}

/* Scroll */
.nl-scroll-2{
  position:absolute;
  left:50%;
  bottom:-6px;
  transform:translateX(-50%);
}

/* Responsive */
@media (max-width: 980px){
  .nl-hero-banner2{min-height:auto; padding:74px 0 18px;}
  .nl-hero-2grid{grid-template-columns:1fr;}
  .nl-hero-copy{padding:26px;}
  .nl-hero-portrait{min-height:320px;}
  .nl-hero-points2{grid-template-columns:1fr;}
  .nl-scroll-2{display:none;}
}
/* HERO üst boşluk kısaltma */
.nl-hero-banner2{
  padding: 58px 0 18px !important;  /* 84px yerine */
  min-height: calc(100vh - 0px) !important;
}
/* Sol taraf taşma fix */
.nl-hero-inner{ overflow: visible; }
.nl-hero-2grid{ width:100%; }

/* Çok kritik: grid item’ların taşmasını engeller */
.nl-hero-copy,
.nl-hero-portrait{
  min-width: 0;
}

/* Kartların bulunduğu alan kesinlikle taşmasın */
.nl-hero-copy{
  overflow: hidden; /* içerik sağa taşarsa kırp */
}

/* 4’lü kutu grid: her zaman container içine sığsın */
.nl-hero-points2{
  width: 100%;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

/* Kutucukların içindeki uzun metinler taşmasın */
.nl-point2,
.nl-point2 b,
.nl-point2 span{
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* Eğer stiller inline/padding yüzünden taşıyorsa */
.nl-point2{
  box-sizing: border-box;
}
.nl-hero-copy{ padding: 36px !important; }
.nl-hero-points2{ gap: 8px !important; }
.nl-point2{ padding: 10px 10px !important; }
/* =========================================================
   HERO GARANTİ PATCH
   - Üst boşluğu kısaltır
   - Kutucukların taşmasını kesin çözer
   style.css EN ALT
   ========================================================= */

/* 0) Hero içindeki her şey box-model düzgün olsun */
#home.nl-hero-banner2,
#home.nl-hero-banner2 *{
  box-sizing: border-box !important;
}

/* 1) Üst boşluk: içeriği yukarı çek */
#home.nl-hero-banner2{
  padding-top: 32px !important;
  padding-bottom: 18px !important;
}
#home.nl-hero-banner2 .nl-hero-inner{
  width: min(1400px, calc(100% - 24px)) !important;
  margin: 0 auto !important;
  transform: translateY(-18px) !important; /* yukarı al */
}

/* 2) Sol kutu daha kompakt (boşluk azalır) */
#home.nl-hero-banner2 .nl-hero-copy{
  padding: 30px !important;
  min-width: 0 !important;
}

/* 3) Sağ taraf çok alan yiyorsa sol tarafı büyüt */
@media (min-width: 981px){
  #home.nl-hero-banner2 .nl-hero-2grid{
    grid-template-columns: 1.22fr .78fr !important;
    gap: 16px !important;
  }
}

/* 4) KUTUCUKLAR KAPANMIYOR sorunu: Flex/float vs. ne varsa ez */
#home.nl-hero-banner2 .nl-hero-points2{
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;

  width: 100% !important;
  max-width: 100% !important;

  /* base.css ile gelen flex/float/wrap bozucularını iptal */
  float: none !important;
  flex: none !important;
  flex-wrap: initial !important;
}

/* Kartların width’leri sabitlenmişse iptal et */
#home.nl-hero-banner2 .nl-point2{
  width: auto !important;
  max-width: 100% !important;
  min-width: 0 !important;

  /* bazı temalarda margin-left vb. kaydırıyor */
  margin: 0 !important;
  padding: 12px 12px !important;

  overflow: hidden !important;
}

/* Metinler taşmasın */
#home.nl-hero-banner2 .nl-point2 b,
#home.nl-hero-banner2 .nl-point2 span{
  min-width: 0 !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}

/* 5) Eğer bazı temalarda kutular <li> ise: list stilini iptal */
#home.nl-hero-banner2 .nl-hero-points2,
#home.nl-hero-banner2 .nl-hero-points2 li{
  list-style: none !important;
  padding-left: 0 !important;
}

/* 6) Mobilde tek kolon olsun */
@media (max-width: 720px){
  #home.nl-hero-banner2 .nl-hero-inner{ transform:none !important; }
  #home.nl-hero-banner2 .nl-hero-points2{
    grid-template-columns: 1fr !important;
  }
}
/* ===================== Hakkımda Bölümü Düzenlemesi ===================== */

/* 1) Hakkımda sol ve sağ alanları dengeli hale getirme */
.nl-about-grid{
  display:grid;
  grid-template-columns: 1.1fr 1.1fr; /* Sol ve sağ eşit */
  gap: 32px;
  align-items:start;
}

/* 2) Sol kutu kartındaki boşluğu azalt */
.nl-about-card{
  border: 1px solid #eee;
  padding: 14px;
  background: rgba(255, 255, 255, .8);
  box-shadow: 0 12px 45px rgba(120, 84, 113, .18);
  border-radius: 16px;
}

/* 3) Sol kutudaki badge'i daha kompakt hale getirelim */
.nl-about-badge{
  font-size: 13px;
  background: #856267;
  color: white;
  border-radius: 50px;
  padding: 3px 12px;
  font-weight: 600;
  display: inline-block;
  margin-bottom: 18px;
}

/* 4) Sol kutudaki "özellikler" alanı daha düzgün görünsün */
.nl-about-pills{
  list-style:none;
  padding: 0;
  margin-top: 20px;
  font-size: 13px;
}

.nl-about-pills li{
  background: #f5f5f5;
  padding: 8px 12px;
  border-radius: 14px;
  margin-bottom: 10px;
  display: flex;
  justify-content: space-between;
}

/* 5) Sağdaki metin alanı biraz daha derli toplu olsun */
.nl-about-story{
  padding: 16px;
  background: rgba(255, 255, 255, .9);
  box-shadow: 0 10px 45px rgba(120, 84, 113, .15);
  border-radius: 16px;
}

/* Metin arasındaki boşlukları ayarla */
.nl-about-story p{
  font-size: 15px;
  line-height: 1.7;
  color: #333;
  margin-bottom: 20px;
}

/* 6) Sağdaki metin alanındaki etiketleri daha şık hale getirelim */
.nl-about-tags{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.nl-tag{
  background: #f8f8f8;
  padding: 8px 12px;
  border-radius: 999px;
  font-size: 13px;
  color: #555;
  border: 1px solid #eee;
}

/* 7) Butonları biraz daha belirgin ve kompakt yapalım */
.nl-about-actions a{
  padding: 10px 22px;
  font-size: 14px;
  text-decoration: none;
  display: inline-block;
  border-radius: 50px;
  margin-top: 15px;
  background: #856267;
  color: white;
  box-shadow: 0 6px 18px rgba(0, 0, 0, .12);
}

.nl-about-actions a:hover{
  background: #e44747;
}

/* 8) Ekran boyutuna göre responsive değişiklikler */
@media (max-width: 768px){
  .nl-about-grid{
    grid-template-columns: 1fr !important;
  }

  .nl-about-card{
    margin-bottom: 20px;
  }

  .nl-about-photo{
    width: 100%;
    height: 320px; /* Resmi kesmeyelim */
    background-size: cover;
    background-position: center;
    border-radius: 16px;
  }
}

/* ================== Footer Düzenlemeleri ================== */

/* Footer'ın genel görünümünü iyileştirelim */
.nl-footer {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 50px 20px;
  background-color: #fff; /* Hafif gri arka plan */
  border-top: 1px solid #ddd;
  position: relative;
  margin-top: 20px;
}

/* Logo ve Başlık */
.nl-footer-brand {
  text-align: center;
  margin-bottom: 20px;
}

.nl-footer-brand img {
  width: 120px; /* Logo boyutunu ayarlayalım */
  height: auto;
  margin-bottom: 10px;
}

.nl-footer-brand strong {
  font-size: 22px;
  font-weight: 800;
  color: #3f3f3f;
}

.nl-footer-brand span {
  display: block;
  color: #888;
  font-size: 16px;
}

/* Bağlantılar kısmı */
.nl-footer-links {
  display: flex;
  justify-content: center;
  gap: 20px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.nl-footer-links a {
  font-size: 14px;
  color: #333;
  text-decoration: none;
  padding: 8px 15px;
  transition: color 0.3s ease;
}

.nl-footer-links a:hover {
  color: #ff5251; /* Hover rengini kırmızı yapalım */
  border-bottom: 2px solid #ff5251; /* Alt çizgi ekleyelim */
}

/* Footer metni */
.nl-footer-copy {
  text-align: center;
  font-size: 12px;
  color: #888;
  margin-top: 30px; /* Daha aşağıda olmasını sağlıyoruz */
}

/* Footer tasarım bilgisi */
.nl-footer-muted {
  display: block;
  font-size: 12px;
  color: #bbb;
  margin-top: 5px;
  text-align: center;
}

/* Butonların tasarımı */
.nl-footer-actions {
  display: flex;
  justify-content: center;
  gap: 20px;
  margin-top: 25px;
}

.nl-footer-actions a {
  padding: 12px 30px;
  background: #ff5251;
  color: #fff;
  border-radius: 25px;
  font-size: 14px;
  text-decoration: none;
  transition: background 0.3s ease;
}

.nl-footer-actions a:hover {
  background: #e44747;
}

/* Mobil uyumlu footer */
@media (max-width: 768px) {
  .nl-footer-links {
    flex-direction: column;
    gap: 15px;
  }

  .nl-footer-actions {
    flex-direction: column;
    gap: 15px;
  }

  .nl-footer-brand {
    margin-bottom: 15px;
  }
}
/* ===============================
   HEADER – MOBİL DÜZELTME
================================ */

/* Varsayılan */
.nl-burger {
  display: none;
}

/* MOBİL */
@media (max-width: 992px) {

  /* Header yapısını koru */
  .nl-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }

  /* Masaüstü menüyü gizle */
  .nl-menu {
    display: none !important;
  }

  /* CTA butonları mobilde gizle */
  .nl-cta .nl-btn {
    display: none;
  }

  /* Burger göster */
  .nl-burger {
    display: block;
  }

  .nl-burger button {
    font-size: 26px;
    background: none;
    border: none;
    cursor: pointer;
    color: #654321;
  }

  /* Drawer (mobil menü) */
  .nl-drawer {
    display: none;
    position: fixed;
    top: 70px;
    left: 0;
    width: 100%;
    background: #fff;
    z-index: 9999;
    padding: 20px;
    box-shadow: 0 10px 30px rgba(0,0,0,.08);
  }

  .nl-drawer a {
    display: block;
    padding: 12px 0;
    font-size: 16px;
    color: #654321;
    text-decoration: none;
    border-bottom: 1px solid #eee;
  }

  .nl-drawer a:last-child {
    border-bottom: none;
  }
}
/* ===============================
   BANNER DÜZENLEMESİ
================================ */

/* Banner container */
.banner {
  width: 100%;
  overflow: hidden; /* Taşma engellendi */
  position: relative;
}

/* Banner görseli */
.banner img {
  width: 100%; /* Görselin genişliği %100 olacak */
  height: auto; /* Yükseklik orantılı olacak */
  object-fit: cover; /* Görselin kesilmeden tamamen uyumlu olmasını sağlar */
}

/* Banner içeriği (başlık, metin vb.) */
.banner-content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%); /* İçeriği ortalar */
  color: #fff;
  text-align: center;
  padding: 10px;
}

/* Mobilde banner görseli */
@media (max-width: 768px) {
  .banner img {
    width: 100%;
    height: auto; /* Görselin taşmaması için yüksekliği orantılı tut */
    object-fit: cover;
  }

  .banner-content {
    padding: 20px;
    font-size: 18px; /* Metin boyutunu küçültme */
  }
}

/* Küçük ekranlar için */
@media (max-width: 480px) {
  .banner-content {
    font-size: 16px; /* Daha küçük ekranlarda metin boyutunu daha da küçült */
  }
}
.nl-hero * {
  max-width: 100%;
  box-sizing: border-box;
}