@import url('https://fonts.googleapis.com/css2?family=Asap+Condensed:wght@400;500;600;700&family=Noto+Sans:wght@300;400;500;600;700;800&display=swap');

/*
 * ARAJEL Frontend — v13 unified stylesheet
 * LTR + RTL + responsive + CMS + blog + FAQ in one cascade.
 * Vendor styles (Bootstrap, Owl, AOS) remain separate and untouched.
 */



.wrapper{
    max-width: 1620px;
    margin-left: auto;
    margin-right: auto;
}
.special-txt{
    font-size: 24px;
    font-weight: 300;
}
h1{
    font-size: 80px;
    line-height: 80px;
    font-weight: 600;
    font-family: 'Noto Sans', sans-serif;
}
h2{
    font-size: 60px;
    font-weight: 600;
    line-height: 70px;
    color: var(--primary--color);    
    font-family: 'Noto Sans', sans-serif;
}
h3{
    font-size: 24px;
    line-height: 24px;
    color: var(--primary--color);    
    font-family: 'Noto Sans', sans-serif;
}
h4{
    font-size: 20px;
    line-height: 24px;
    color: var(--primary--color);    
    font-family: 'Noto Sans', sans-serif;
}
h5{
    font-size: 18px;
    line-height: 18px;
}
h6{
    font-size: 16px;
    line-height: 16px;
}
p {
    font-size: 18px;
    line-height: 30px;
    font-weight: 400;
}

.light-grren-btn a{
    background: var(--accent);
    color: var(--white-color);
}
.generic-btn.light-grren-btn a:hover{
    background: var(--white-color);
    color: var(--accent);
}
.light-grren-btn a:hover:after{
    border-top: 15px solid var(--accent);
}
.white-btn a{
    background: var(--white-color);
    color: var(--primary--color);
}
.white-btn a:hover:after{
    border-top: 15px solid var(--white-color);
}
.white-btn a:hover{
    color: var(--white-color);
    background: var(--accent);
}
.grren-btn a,
.submit-btn{
    color: var(--white-color);
    background: var(--green-color);
}
.generic-btn a{
    position: relative;
}
.generic-btn a,.submit-btn {
    font-size: 18px;
    font-weight: 500;
    line-height: 18px;
    display: inline-block;
    text-decoration: none;
    padding:21px 38px 21px;
    transition: all 0.5s ease-in-out;
}
.generic-btn a:hover, .submit-btn:hover{
    color: #fff;
    background: var(--accent);
}
.generic-btn a:hover{
    transform: translateY(-8px);
}
.white-btn a:after,
.light-grren-btn a:after,
.cart-btn a:after,
.grren-btn a:after,
.submit-btn:after{
    top: 2px;
    left: 3px;
    width: 0;
    height: 0;
    content: "";
    position: absolute;
    transition: all 0.5s ease-in-out;
    border-top: 15px solid var(--accent);
    border-right: 15px solid transparent;
}
.light-grren-btn a:after{
    border-top: 15px solid var(--white-color);
}

.generic-title span,
.wrok-content > span,
.generic-box-content span{
    font-size: 20px;
    line-height: 20px;
    margin-bottom: 24px;
    color: var(--primary--color);
}
.generic-title h2{
    margin-bottom: 54px;
}
.padding-top{
    padding-top: 160px;
}
.padding-bottom{
    padding-bottom: 160px;
}
.generic-title{
    width: 49%;
}
.grren-btn a:after,
.submit-btn:after{
    border-top: 15px solid var(--white-color);
    border-right: 15px solid transparent;
}
.box-shadow img{
    box-shadow: 0 40px 60px 0px rgb(0 0 0 / 29%);
}


500;600;700&family=Noto+Sans:wght@300;400;500;600;700;800&display=swap');
*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
a:hover,
button:hover
input{
	outline: none;
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-ms-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
}
body{
    font-size: 18px;
    line-height: 30px;
    font-weight: 400;
    color: var(--text-color);
    font-family: 'Noto Sans', sans-serif;
}
:root{
    --primary--color: #000;
    --secondary--color: #94c22e;
    --text-color:#777;
    --accent:#94c22e;
    --white-color: #fff;
    --green-color: #174f2c;
    --dark-green-color: #174e2b;
    --light-green-color: #90bd2d;
}
/* HEADER SECTION */
.dropdown-item {
    text-transform: capitalize;
  }
.header-con .dropdown-item:hover {
    color: var(--white-color);
    background: var(--secondary--color);
}
.header-con .dropdown-menu {
    top: 33px;
}
.btn-wrap button:focus{
    outline: none;
}
.header-con {
    top: 17px;
    z-index: 99;
    position: absolute;    
}
.header-con .navbar-light .navbar-nav .nav-link{
    font-size: 18px;
    line-height: 30px;
    font-weight: 500;
    color: var(--white-color);
}
.header-con .navbar-light .navbar-nav .nav-link:hover{
    color: var(--accent);
}
.header-con .navbar-nav{
    gap: 64px;
}
.header-btn {
    margin-left: 31px;
    margin-right: 31px;
}
.header-btn a{
    font-size: 16px;
    line-height: 16px;
    padding: 12px 15px 12px 14px;
}
.header-btn a:after{
    left: 2px;
    border-top: 10px solid var(--accent);
    border-right: 10px solid transparent;
}
.social-icon ul {
    gap: 9px;
}
.social-icon ul li a i {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    color: var(--secondary--color);
    transition: all 0.55s ease-in-out;
    border: 1px solid var(--secondary--color);
}
.social-icon ul li a i:hover{
    transform: translateY(-8px);
    color: var(--white-color);
    background: var(--secondary--color);
}
.social-icon ul li a{
    text-decoration: none;
}
/* HEADER SECTION */
/* BANNER SECTION */
.banner-con {
    overflow: hidden;
    padding:172px 0 162px;
    background: var(--green-color);
}
.banner-inner-con {
    display: grid;
    align-items: center;
    grid-template-columns: 25.6% 48.7% 25.6%;
}
.banner-img-box1 figure{
    margin-bottom: 83px;
}
.banner-title .special-txt{
    margin-bottom: 27px;
    color: var(--secondary--color);
}
.banner-title h1{
    margin-bottom: 23px;
    color: var(--white-color);
}
.banner-title h1 span{
    color: var(--secondary--color);
}
.header-con .navbar-light .navbar-nav .active>.nav-link{
    color: var(--accent);
}
.banner-title {
    padding: 0 35px;
}
.text-border:after{
    bottom: 0;
    content: "";
    width: 257px;
    height: 13px;
    left: 50%;
    transform:translateX(-50%);
    position: absolute;
    background: url(../images/shape-border-img.png) no-repeat;
}
.banner-con .text-border:after{
    transform: translateX(-54%);
}
.banner-title p{
    font-size: 24px;
    line-height: 24px;
    margin-bottom: 39px;
    color: var(--white-color);
}
.banner-btn{
    gap: 30px;
}
.banner-img-box2 figure::before,
.leaf-img2::before{
    content: "";
    left: -49px;
    bottom: -47px;
    width: 59px;
    height: 52px;
    position: absolute;
    background: url(../images/leaf-img1.png) no-repeat;
}
.banner-title::before{
    top: -92px;
    right: 60px;
    content: "";
    width: 99px;
    height: 146px;
    position: absolute;
    background: url(../images/leaf-img2.png) no-repeat;
}
.banner-img-box1 figure:first-child::before,
.leaf-img::before{
    top: -90px;
    left: -46px;
    content: "";
    width: 91px;
    height: 180px;
    position: absolute;
    background: url(../images/leaf-img3.png) no-repeat;
}
.banner-con::before,
.sub-banner::before{
    left: 50%;
    content: "";
    width: 99px;
    height: 146px;
    bottom: -55px;
    position: absolute;
    transform: translateX(-50%);
    background: url(../images/leaf-img2.png) no-repeat;
}
.banner-img-box1 figure:last-child::before{
    top: 50%;
    left: -112px;
    content: "";
    width: 65px;
    height: 109px;
    position: absolute;
    transform: translateY(-52%);
    background: url(../images/double-leaf.png) no-repeat;
}
/* BANNER SECTION */
/* SERVICE SECTION */
.service-con{
    background: #d6e0ea;
}
#service-slider .owl-item img {
    width: auto;
    margin: 0 auto;
    filter: grayscale(100%);
}
.service-item h4 {
    font-size: 22px;
    line-height: 28px;
    margin-top: auto;
}
.service-item {
    padding:46px 20px 26px;
    border-radius: 30px 30px 0 0;
    border: 3px solid transparent;
    background: var(--white-color);
}
.service-item:hover{
    border: 3px solid var(--accent);
}
#service-slider .service-item:hover figure img{
    filter: none !important;
}
.service-item figure {
    height: 70px;
    margin-bottom: 26px;
}
.service-con .owl-stage-outer::after, 
.service-con .owl-stage-outer::before {
    top: 0;
    left: 0;
    z-index: 1;
    content: "";
    height: 100%;
    position: absolute;
    box-shadow: 0px 0px 100px 90px #d6e0ea;
}
.plant-img .container:after {
    left: 15px;
    bottom: 0;
    content: "";
    width: 100%;
    height: 79px;
    position: absolute;
    background: url(../images/plant-img.png) no-repeat;
}
#service-slider .owl-stage-outer::before {
    right: 0;
    z-index: 2;
    left: initial;
}
.btn-wrap{
    text-align: center;
}
.btn-wrap button i {
    color: var(--white-color);
    position: relative;
    z-index: 1;
}
#service-slider {
    margin-bottom: 78px;
}
.next-btn{
    margin-left: 22px;
}
.border-style-thin {
    background-color: transparent;
}
.border-style-thin:hover{
    background-color:var(--dark-green-color);
}
.clip-each {
    width: 45px;
    height: 45px;
    border: none;
    cursor: pointer;
    position: relative;
}
.clip-each, .clip-each:after {
    clip-path: polygon(30% 0%, 70% 0%, 100% 30%, 100% 70%, 70% 100%, 30% 100%, 0% 70%, 0% 30%);
}
.border-style-thin:after {
    top: 2px;
    left: 2px;
    right: 2px;
    bottom: 2px;
}
.clip-each:after {
    content: "";
    position: absolute;
    background: var(--dark-green-color);
}
.clip-each:hover:after{
    background: var(--light-green-color);
}
.btn-wrap button:hover i{
    color: var(--dark-green-color);
}
/* SERVICE SECTION */
/* WORK SECTION */
.work-box {
    gap: 30px;
    display: grid;
    grid-template-columns: 32% 32% 32%;
}
.work-box-item {
    width: 350px;
    height: 350px;
    position: relative;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 0 100px rgb(0 0 0 / 10%);
}
.work-box-item:hover .work-box-inner-item{
    border-color: var(--accent);
}
.work-box-item:hover .work-box-inner-item figure img{
    filter: none;
}
.work-box-item figure{
    height: 70px;
    margin-bottom: 27px;
}
.work-box-item figure img{
    filter: grayscale(100%);
}
.work-box-item h3{
    margin-bottom: 18px;
}
.work-box-item span{
    padding: 0 50px;
}
.work-box-inner-item{
    width: 320px;
    height: 320px;
    border-radius: 50%;
    border: 5px solid #d1dce4;
}
.work-con .container:after{
    content: "";
    bottom: -5px;
    left: -357px;
    width: 360px;
    height: 521px;
    position: absolute;
    background: url(../images/tree-img1.png) no-repeat;
}
.vedio-img{
    position: relative;
}
.vedio-img:after{
    content: "";
    position: absolute;
    width: 493px;
    height: 493px;
    border: 4px solid var(--accent);
    left: 50%;
    top: 50%;
    border-radius: 50%;
    transform: translate(-50%, -50%);
}
.work-con .container:before{
    content: "";
    bottom: -3px;
    right:-189px;
    width: 187px;
    height: 271px;
    position: absolute;
    background: url(../images/tree-img2.png) no-repeat;
}
.work-box-item:after{
    top: -35px;
    left: 50%;
    content: "";
    width: 280px;
    height: 62px;
    position: absolute;
    transform: translateX(-50%);
    background: url(../images/arrow-up.png) no-repeat;
}
.work-box .work-box-item:nth-child(2):after{
    top: auto;
    bottom: -35px;
    background: url(../images/arrow-down.png) no-repeat;
}
.work-con{
    background: #f1f8f8;
}
.work-con .generic-title h2 {
    margin-bottom: 104px;
}
.help-con{
    background: url(../images/work-bg-img.jpg) no-repeat center;
    background-size: cover;
}
.wrok-content span{
    color: var(--white-color);
}
.wrok-content{
    padding-right: 75px;
}
.wrok-content h2{
    margin-bottom: 28px;
    color: var(--white-color);
}
.wrok-content p{
    font-size: 20px;
    line-height: 30px;
    margin-bottom: 43px;
    color: var(--white-color);
}
/* WORK SECTION */
/* HELP SECTION */
.phone-con a:hover{
    background: var(--white-color);
}
.phone-con a {
    border-radius: 10px;
    background: var(--accent);
    text-decoration: none;
    padding: 15px 59px 15px 20px;
}
.phone-text {
    padding-top: 2px;
    padding-left: 18px;
}
.phone-text span{
    font-size: 20px;
    line-height: 20px;
    margin-bottom: 10px;
    color: var(--green-color);
}
.phone-text small{
    font-size: 50px;
    font-weight: 600;
    line-height: 50px;
    text-decoration: none;
    color: var(--green-color);
    font-family: 'Noto Sans', sans-serif;
}
.phone-text a:hover{
    color: var(--white-color);
}
.phone-con figure{
    width: 90px;
    height: 90px;
    border-radius: 50%;
    background: var(--white-color);
}
#fade1 {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: .80;
    z-index: 1001;
    display: none;
    position: fixed;
    filter: alpha(opacity=80);
    /* background-color: black; */
}
#fade2 {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: .80;
    z-index: 1001;
    display: none;
    position: fixed;
    filter: alpha(opacity=80);
    background-color: black;
}

#light iframe {
    width: 103%;
    height: 600px;
    border: none;
}
#light2,
#light {
    top: 78%;
    left: 50%;
    display: none;
    z-index: 1002;
    position: absolute;
    margin-top: -180px;
    transform: translate(-50%, -50%);
}
#light {
    width: 100%;
}
#light2 {
    width: 58%;
}
#light2 iframe {
    width: 100%;
    height: 500px;
}
.index3-poster {
    position: absolute;
    left: 10%;
}
.index3-video-wrap {
    left: 50%;
    top: 42%;
    height: 56px;
    width: 53px;
}
#boxclose {
    top: -12px;
    width: 30px;
    right: -47px;
    float: right;
    height: 30px;
    display: flex;
    z-index: 1002;
    cursor: pointer;
    font-size: 30px;
    font-weight: bold;
    line-height: 26px;
    position: absolute;
    border-radius: 50%;
    justify-content: center;
    color: var(--white-color);
    background: var(--accent);
}
.boxclose:before {
    content: "×";
}
#fade1:hover~#boxclose {
    display: none;
}
.test:hover~.test2 {
    display: none;
}
.index1-poster {
    width: 540px;
    height: 540px;
    object-fit: cover;
    border-radius: 50%;
    object-position: 68%;
}
.video-wrap {
    top: 50%;
    left: 50%;
    width: 100px;
    display: flex;
    height: 100px;
    z-index: 1;
    background: #fff;
    border-radius: 50%;
    align-items: center;
    outline-offset: 10px;
    justify-content: center;
    outline: 3px dashed #fff;
    transform: translate(-50%, -50%);
}
/* HELP SECTION */
/* PRODUCT SECTION */
.product-con{
    background: #d6e0ea;
}
.owl-carousel .owl-item img{
    width: auto;
    margin: 0 auto;
}
.product-item {
    padding: 20px;
    background: #fff;
    border-radius: 30px 30px 0 0;
    border: 3px solid transparent;
}
.product-item:hover{
    z-index: 2;
    position: relative;
    border: 3px solid var(--accent);
    transition:all 0.1s ease-in-out;
}
.product-img figure {
    background: #f1f8f8;
    height: 252px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 30px 30px 0 0;
}
.cart-btn a {
    text-decoration: none;
    background: #93c12e;
    width: 100%;
    display: inline-block;
    color: #fff;
    font-weight: 500;
    font-size: 18px;
    padding: 6px 10px;
    position: relative;
}
.cart-btn {
    margin-top: -60px;
}
.product-img{
    margin-bottom: 30px;
}
.cart-btn a:after{
    top: 4px;
    border-top: 10px solid var(--white-color);
    border-right: 10px solid transparent;
}
.star-img{
    margin-bottom: 10px;
}
.product-price{
    font-size: 16px;
    font-weight: 600;
    color: var(--green-color);
    font-family: 'Noto Sans', sans-serif;
}
.product-price span {
    color: var(--text-color);
    text-decoration: line-through;
}
.product-detail h3{
    margin-bottom: 3px;
}
.owl-nav,.owl-dots{
    display: none;
}
#product-slider{
    margin-bottom: 68px;
}
.about-box{
    background: #d6e0ea;
}
.product-box-con{
    gap: 30px;
    display: grid;
    grid-template-columns: 23% 23% 23% 23%;
}
.product-img img {
    width: 100%;
    object-fit: scale-down;
}
/* PRODUCT SECTION */
/* GENERIC SECTION */
.generic-list li{
    font-size: 20px;
    color: #164c2a;
    line-height: 20px;
    position: relative;
    margin-bottom: 20px;
    padding-left: 33px;
}
.generic-list li::after{
    content: "\f058";
    top: 0;
    left: 0;
    color: var(--green-color);
    position: absolute;
    font-family: "Font Awesome 5 Free";
}
.about-box .generic-list{
    margin-bottom: 35px;
}
.generic-box {
    gap: 124px;
    display: grid;
    align-items: center;
    grid-template-columns: 40.2% 55%;
}
.generic-box-service {
    gap: 20px;
    display: grid;
    grid-template-columns: 42.8% 42.8%;
}
.generic-box-service-item {
    padding: 30px 39px;
    background: var(--white-color);
    border-radius: 30px 30px 0 0;
    box-shadow: 0 0 100px rgb(0 0 0 / 10%);
    border: 3px solid transparent;
}
.generic-box-service-item figure img{
    filter: grayscale(100);
}
.generic-box-service-item:hover figure img{
    filter: none;
}
.generic-box-service-item:hover{
    border: 3px solid var(--secondary--color);
}
.generic-box-service-item figure{
    margin-bottom: 28px;
}
.generic-box-service-item h3{
    margin-bottom: 0;
}
.generic-box-content h2{
    margin-bottom: 29px;
}
.generic-box-content p{
    font-size: 20px;
    padding-right: 72px;
    margin-bottom: 40px;
}
.generic-box-img figure:after {
    content: "";
    position: absolute;
    width: 405px;
    height: 518px;
    border: 5px solid #fff;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
}
.generic-box-img figure:before {
    content: "";
    left: -49px;
    bottom: -47px;
    width: 59px;
    height: 52px;
    position: absolute;
    background: url(../images/green-leaf.png) no-repeat;
}
.generic-box-img{
    position: relative;
}
/* GENERIC SECTION */
/* CHOOSE SECTION */
.choose-con {
    background: #f1f8f8;
}
.choose-con .container:before {
    bottom: 0;
    right: -355px;
    content: "";
    width: 421px;
    height: 481px;
    position: absolute;
    background: url(../images/long-tree.png) no-repeat;
}
/* CHOOSE SECTION */
/* TASTIMONIALS SECTION */
.tastimonials-con{
    background: url(../images/tastimonials-bg-image.jpg) no-repeat center;
    background-size: cover;
}
.tastimonials-con .generic-title span,
.tastimonials-con .generic-title h2{
    color: var(--white-color);
}
.tastimonials-con .generic-title {
    width: 52%;
}
.tastimonials-con .generic-title::after{
    top: -58px;
    content: "";
    width: 65px;
    height: 109px;
    right: -172px;
    position: absolute;
    background: url(../images/double-leaf.png) no-repeat;
}
.testimonials-item {
    gap: 30px;
    display: flex;
}
.testimonials-item-content figure {
    background: #fdfdfd;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 80px;
    height: 80px;
    border-radius: 10px;
    margin-bottom: 32px;
}
.testimonials-item-content p {
    font-size: 20px;
    line-height: 30px;
    padding-right: 33px;
    margin-bottom: 21px;
    color: var(--white-color);
}
.testimonials-item-img img {
    width: 100% !important;
    border-radius: 50%;
    object-fit: cover;
}
.testimonials-item-img figure {
    width: 136px;
    height: 136px;
    border-radius: 50%;
    background: #fff;
    padding: 4px;
    position: relative;
    margin-top: 25px;
}
.admin-con span{
    font-size: 20px;
    line-height: 20px;
    margin-bottom: 2px;
    color: var(--secondary--color);
    font-family: 'Noto Sans', sans-serif;
}
.admin-con small{
    font-size: 16px;
    color: var(--white-color);
}
.testimonials-item-img figure:after {
    content: "";
    top: -25px;
    left: -23px;
    width: 92px;
    z-index: -1;
    height: 184px;
    position: absolute;
    background: url(../images/half-circle-img.png) no-repeat;
}
.tastimonials-con .btn-wrap button {
    height: 40px;
    width: 40px;
    border: none;
    cursor: pointer;
    background: var(--white-color);
    clip-path: polygon(30% 0%, 70% 0%, 100% 30%, 100% 70%, 70% 100%, 30% 100%, 0% 70%, 0% 30%);
}
.tastimonials-con .btn-wrap button i{
    color: #164d2b;
}
.tastimonials-con .btn-wrap button:hover{
    background: var(--accent);
}
#testimonials-slider{
    position: relative;
    margin-bottom: 70px;
}
.tastimonials-con .owl-item .item {
    margin-left: 24px;
}
#testimonials-slider::before {
    content: "";
    left: 0;
    bottom: -96px;
    width: 59px;
    height: 52px;
    position: absolute;
    background: url(../images/green-leaf.png) no-repeat;
}
/* TASTIMONIALS SECTION */
/* BLOG SECTION */
.blog-con{
    background: #d6e0ea;
}
.blog-con .generic-title {
    width: 64%;
}
.blog-box {
    gap: 30px;
    display: grid;
    margin-bottom: 80px;
    grid-template-columns: 31.55% 31.55% 31.55%;    
}
.blog-box-item {
    display: flex;
    background: #fff;
    flex-direction: column;
    border-radius: 30px 30px 0 0;
    border: 3px solid transparent;
}
.blog-box-item:hover{
    border: 3px solid var(--accent);
    box-shadow: 0 0 50px rgb(0 0 0 / 10%);
}
.blog-box-img > figure img {
    width: 100%;
    border-radius: 30px 30px 0 0;
}
.blog-box-content {
    margin-top: auto;
    padding: 0 19px 30px 30px;
    border-bottom: 1px solid #e5e5e5;
}
.blog-box-content span {
    margin-bottom: 28px;
    position: relative;
    padding-left: 21px;
    line-height: 20px;
}
.blog-box-content span:after {
    content: "";
    position: absolute;
    border-left: 6px solid #92c13e;
    height: 27px;
    left: 0;
    top: 0;
}
.blog-box-content h3 {
    line-height: 30px;
    font-weight: 600;
    margin-bottom: 13px;
}
.blog-box-content p{
    margin-bottom: 18px;
}
.blog-box-img > figure {
    position: relative;
    margin-bottom: 30px;
}
.blog-btn a {
    font-size: 16px;
    font-weight: 500;
    padding: 4px 20px;
    position: relative;
    text-decoration: none;
    display: inline-block;
    color: var(--green-color);
    box-shadow: 0 0 0 1px var(--green-color);
}
.blog-btn a:hover{
    color: var(--white-color);
    background: var(--accent);
    box-shadow: 0 0 0 1px var(--accent);
}
.blog-btn a:hover:after{
    border-top: 10px solid var(--white-color);
}
.blog-btn a:after{
    top: 2px;
    left: 2px;
    width: 0;
    height: 0;
    content: "";
    position: absolute;
    border-top: 10px solid var(--green-color);
    border-right: 10px solid transparent;
    transition: all 0.5s ease-in-out;
}
.blog-time {
    font-size: 16px;
    padding: 12px 30px 11px;
}
.blog-box-outer-content {
    margin-top: auto;
}
.blog-time span{
    font-weight: 600;
    color: var(--green-color);
}
.articles-btn a{
    background: var(--green-color);
    color: var(--white-color);
}
.blog-box::before,
.blog-box::after,
.left-design::before,
.right-design::after{
    content: "";
    left: -49px;
    bottom: -46px;
    width: 59px;
    height: 52px;
    position: absolute;
    background: url(../images/green-leaf.png) no-repeat;
}
.blog-box::after,
.right-design::after{
    bottom: auto;
    top: -46px;
    left: auto;
    right: -50px;
    background: url(../images/green-top-leaf.png) no-repeat;
}
.blog-box-img{
    position: relative;
}
.blog-sub-img {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}
.service-blog-con .blog-box::before, .service-blog-con .blog-box::after{
    display: none;
}
/* BLOG SECTION */
/* LOGO SECTION */
.logo-con ul {
    display: grid;
    text-align: center;
    grid-template-columns: 25% 25% 25% 25%;
}
.logo-con ul li:first-child,
.logo-con ul li:nth-child(5){
    border-left: none;
}
.logo-con ul li {
    display: flex;
    align-items: center;
    padding: 32px 0 31px;
    justify-content: center;
    border-left: 1px solid #e0e8eb;
    border-bottom: 1px solid #e0e8eb;
}
.logo-con ul {
    overflow: hidden;
    border-radius: 30px;
    background: #f1f8f8;
    box-shadow: 0 0 100px rgb(23 79 44 / 10%);
}
.logo-con{
    z-index: 1;
    position: relative;
    margin-top: -144px;
}
.logo-con ul li:first-child{
    border-radius: 30px 0 0 0;
}
.logo-con ul li:hover {
    background: var(--white-color);
    box-shadow: 0 0 50px rgb(0 0 0 / 10%);
}
.blog-con{
    padding-bottom: 305px;
}
/* LOGO SECTION */
/* FOOTER SECTION */
.footer-con {
    padding-top: 254px;
    padding-bottom: 123px;
    margin-top: -154px;
    background: url(../images/footer-bg-img.jpg) no-repeat center;
    background-size: cover;
}
.footer-inner-con {
    gap: 30px;
    display: grid;
    grid-template-columns: 31.3% 14.7% 22.7% 23%;
}
.footer-content p,
.footer-content span{
    font-size: 16px;
    line-height: 24px;
    margin-bottom: 28px;
    padding-right: 94px;
    color: var(--white-color);
}
.footer-content span{
    margin-bottom: 17px;
    padding-right: 116px;
}
.footre-logo figure{
    margin-bottom: 25px;
}
.footer-social-con ul {
    gap: 10px;
    display: flex;
}
.footer-social-con ul li a i{
    font-size: 14px;
    color: var(--white-color);
    transition: all 0.5s ease-in-out;
}
.footer-social-con ul li a i:hover{
    color: var(--accent);
    transform: translateY(-8px);
}
.site-map h4 {
    padding-top: 20px;
    margin-bottom: 26px;
    color: var(--white-color);
    font-family: 'Noto Sans', sans-serif;
}
.site-map ul li a {
    font-size: 16px;
    position: relative;
    line-height: 16px;
    text-decoration: none;
    color: var(--white-color);
}
.site-map ul li a:hover{
    color: var(--accent);
}
.footre-logo {
    display: inline-block;
}
.footer-link ul li {
    margin-bottom: 1px;
}
.site-map ul li a i{
    padding-right: 8px;
}
.footer-link ul li:last-child,.contact-info ul li:last-child{
    margin-bottom: 0;
}
.contact-info ul li{
    font-size: 16px;
    line-height: 24px;
    margin-bottom: 10px;
    padding-right: 10px;
    color: var(--white-color);
}
.contact-info ul li span{
    font-size: 16px;
    line-height: 16px;
    margin-bottom: 7px;
    color: var(--secondary--color);
}
.footer-con .carousel-item img{
    border-radius: 30px 30px 0 0;
    border: 2px solid var(--secondary--color) !important;
}
.carousel-control-next, .carousel-control-prev{
    top: 50%;
    opacity: 1;
    width: 34px;
    height: 34px;
    color: var(--green-color);
    transform: translateY(-50%);
    background: var(--white-color);
    clip-path: polygon(30% 0%, 70% 0%, 100% 30%, 100% 70%, 70% 100%, 30% 100%, 0% 70%, 0% 30%);
}
.carousel-control-prev {
    left: -16px;
}
.carousel-control-next {
    right: -16px;
}
.carousel-control-next:hover,
.carousel-control-prev:hover,
.carousel-control-next:focus,
.carousel-control-prev:focus{
    opacity: 1;
    color: var(--green-color);
    background: var(--accent);
}
/* FOOTER SECTION */
/* SUB PAGES BANNER SECTION */
.sub-banner {
    padding: 173px 0 107px;
    background: var(--green-color);
}
.sub-banner-inner-con{
    display: grid;
    align-items: center;
    grid-template-columns: 25.6% 48.7% 25.6%;
}
.sub-banner-title h1{
    color: var(--white-color);
}
.sub-banner-title .text-border:after {
    left: 50%;
    bottom: -22px;
}
.sub-banner-img img{
    z-index: 1;
    position: relative;
}
.service-blog-con{
    background:#d6e0ea;
}
/* SUB PAGES BANNER SECTION */
/* BREADCRUM SECTION */
.breadcrum ul {
    gap: 18px;
    margin-bottom: 21px;
}
.breadcrum ul li a{
    font-size: 24px;
    font-weight: 300;
    text-decoration: none;
    color: var(--secondary--color);
}
.breadcrum ul li a:hover{
    color: var(--white-color);
}
.breadcrum ul li {
    position: relative;
}
.breadcrum ul li:first-child:after {
    right: -12px;
    content: "-";
    font-size: 24px;
    font-weight: 300;
    position: absolute;
    color: var(--secondary--color);
}
/* BREADCRUM SECTION */
/* VEDIO SECTION */

.black-layer{
    position: relative;
}
.black-layer::before{
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: radial-gradient(ellipse at center, rgb(255 255 255 / 0%) 0%,rgb(6 44 20 / 40%) 100%);
}
.vedio-img a{
    display: inline-block;
}
.vedio-img .black-layer::before{
    border-radius: 50%;
}
.blog-box-img > figure:after,
.generic-box-img > div:after{
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    border-radius: 30px 30px 0 0;
    background: radial-gradient(ellipse at center, rgb(255 255 255 / 0%) 0%,rgb(6 44 20 / 40%) 100%);
}
.generic-box-img > div:after{
    border-radius: 0;
}
/* VEDIO SECTION */
.blog-sub-img figure {
    width: 107px;
    height: 81px;
    display: flex;
    align-items: end;
    background: #fff;
    justify-content: center;
    border-radius: 20px 20px 0 0;
}
/* PRICE SECTION */
.pricing-con{
    background: #d6e0ea;
}
.price-box {
    gap: 30px;
    display: grid;
    grid-template-columns: 31.55% 31.55% 31.55%;
}
.price-box-item {
    padding: 56px 15px 56px;
    border-radius: 30px 30px 0 0;
    border: 3px solid transparent;
    background: var(--white-color);
    box-shadow: 0 0 100px rgb(0 0 0 / 10%);
}
.price-box-item span{
    font-size: 24px;
    font-weight: 600;
    line-height: 24px;
    margin-bottom: 16px;
    color: var(--primary--color);  
    font-family: 'Noto Sans', sans-serif;
}
.price-value{
    font-size: 54px;
    font-weight: 600;
    line-height: 54px;
    margin-bottom: 26px;
    color: var(--secondary--color);
    font-family: 'Noto Sans', sans-serif;
}
.price-box-item ul {
    text-align: left;
    margin-bottom: 47px;
    display: inline-block;
}
.price-box-item ul li {
    font-size: 20px;
    line-height: 20px;
    position: relative;
    padding-left: 33px;
    margin-bottom: 18px;
}
.price-box-item ul li:last-child{
    margin-bottom: 0;
}
.price-box-item ul li:after {
    content: "\f058";
    top: 0;
    left: 0;
    color: var(--green-color);
    position: absolute;
    font-family: "Font Awesome 5 Free";
}
/* PRICE SECTION */
/* TEAM SECTION */
.team-banner .text-border:after{
    left: 50%;
}
.team-con{
    background: #d6e0ea; 
}
.team-box {
    gap: 30px;
    display: grid;
    grid-template-columns: 23% 23% 23% 23%;
}
.team-box-item {
    padding:19px 18px 37px;
    background: #fff;
    border-radius: 30px 30px 0 0;
    border: 3px solid transparent;
}
.team-box:hover > * ,
#team-slider .owl-stage-outer .owl-stage:hover > *,
.product-box-con:hover > *,
#product-slider .owl-stage-outer .owl-stage:hover > *
{
    opacity: 0.6 !important;
}
.team-box:hover > * .social-link,
#team-slider .owl-stage-outer .owl-stage:hover > * .social-link,
#product-slider .owl-stage-outer .owl-stage:hover > * .product-item .product-img .cart-btn,
.product-box-con:hover > * .product-img .cart-btn{
    opacity: 0;
}
.team-box *:hover .social-link,
#team-slider .owl-stage-outer .owl-stage *:hover .social-link,
#product-slider .owl-stage-outer .owl-stage *:hover,
#product-slider .owl-stage-outer .owl-stage *:hover .product-item .product-img .cart-btn,
.product-box-con *:hover .product-img .cart-btn
{
    opacity: 1;
}
.cart-btn{
    opacity: 0;
}
.team-box *:hover,
#team-slider .owl-stage-outer .owl-stage *:hover,
.product-box-con *:hover,
#product-slider .owl-stage-outer .owl-stage *:hover
{
    opacity: 1 !important;
}
#product-slider .owl-stage-outer .owl-stage *:hover .product-item .product-img .cart-btn a {
    box-shadow: -20px -20px 20px 0px rgb(147 193 46 / 20%);
}
.team-box-item:hover {
    border-color: var(--accent);                        
}
.team-box-img figure img {
    width: 213px;
    height: 252px;
    display: flex;
    align-items: end;
    justify-content: center;
    object-fit: cover;
    border-radius: 30px 30px 0 0;
}

.team-box-img {
    position: relative;
    margin-bottom: 28px;
}
.team-box-item h3{
    margin-bottom: 10px;
}
.team-box-item h3 a{
    text-decoration: none;
    color: var(--primary--color);
}
.team-box-item span{
    font-size: 16px;
    line-height: 16px;
    font-weight: 600;
    color: var(--green-color);
}
#team-slider .owl-item img{
    width: 100%;
}
#team-slider {
    margin-bottom: 80px;
}
/* TEAM SECTION */
/* SOCIAL SECTION */
.social-link {
    padding: 6px 15px;
    background: var(--secondary--color);
    position: absolute;
    width: 100%;
    bottom: 0;
}
.social-link ul{
    gap: 5px;
}
.social-link ul li a{
    text-decoration: none;
}
.social-link ul li a i{
    color: var(--white-color);
    background: #164d2b;  
    width: 30px; 
    height: 30px;
    font-size: 14px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.5s ease-in-out;
}
.social-link ul li a i:hover {
    color: #164d2b;
    background: transparent;
    box-shadow: inset 0 0 0px 1px #164d2b;
}
/* SOCIAL SECTION */
/* STATIC SECTION */
.static-con{
    padding-top: 120px;
    padding-bottom: 120px;
    background: url(../images/static-bg-img.jpg) no-repeat center;
    background-size: cover;
}
.static-box {
    gap: 30px;
    display: grid;
    grid-template-columns: 23% 23% 23% 23%;
}
.static-box-item {
    color: var(--white-color);
    padding: 41px 10px 42px;
    border-radius: 30px 30px 0 0;
    background: rgb(20 26 25 / 30%);
}
.static-value{
    font-size: 60px;
    font-weight: 600;
    line-height: 60px;
    margin-bottom: 14px;
    font-family: 'Noto Sans', sans-serif;
}
.static-box-item{
    font-size: 20px;
}
.static-box-item:hover{
    background: var(--secondary--color);
}
/* STATIC SECTION */
/* FAQ SECTION */
.faq-con{
    background: #d6e0ea;
}
.faq-box .card-header{
    padding: 0;
    border: none;
    background: transparent;
}
.faq-box .card-header h5 button {
    width: 100%;
    font-size: 24px;
    font-weight: 600;
    text-align: left;
    white-space: normal;
    text-decoration: none;
    padding: 16px 65px 17px 30px;
    color: var(--primary--color);
    font-family: 'Noto Sans', sans-serif;
}
.faq-box .card {
    border: none;
    margin-bottom: 25px;
    border-radius: 15px 15px 0 0;
    background: var(--white-color);
}
.faq-box .card-header h5 button:after {
    top: 16px;
    right: 24px;
    font-size: 14px;
    position: absolute;
    background: var(--accent);
    color: var(--green-color);
    font-family: "Font Awesome 5 Free";
    clip-path: polygon(30% 0%, 70% 0%, 100% 30%, 100% 70%, 70% 100%, 30% 100%, 0% 70%, 0% 30%);
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.faq-box .card-header h5 button.collapsed:after{
    content: "\f067";
}
.faq-box .card-header h5 button:not(.collapsed):after{
    content: "\f068";
}
.faq-box .card-body {
    padding: 0 65px 25px 30px;
}
.faq-box{
    width: 82%;
    margin: 0 auto;
}
.faq-box #accordion .card:last-child{
    margin-bottom: 0;
}
/* FAQ SECTION */
/* PERSONAL INFO SECTION */
.personal-info{
    padding: 57px 53px;
    border-radius: 30px 30px 0 0;
    background: var(--secondary--color);
    box-shadow: 0 0 100px rgb(148 194 46 / 10%);
}
.personal-info h3{
    font-size: 46px;
    font-weight: 600;
    line-height: 48px;
    margin-bottom: 28px;
    color: var(--white-color);
    font-family: 'Noto Sans', sans-serif;
}
.personal-info ul li {
    position: relative;
    margin-bottom: 17px;
    display: flex;
    align-items: center;
    
}
.personal-info ul li figure {
    width: 70px;
    height: 70px;
    background: var(--white-color);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: 0;
    margin-top: -7px;
    box-shadow: -4px 13px 50px rgb(0 0 0 / 10%);
}
.error{
    color: red;
}
.personal-info ul li figure img{
    transition: all 0.5s ease-in-out;
}
.personal-info ul li figure img:hover{
    transform: translateY(-8px);
}
.personal-details {
    padding-left: 93px;
}
.personal-details h5 {
    font-size: 24px;
    line-height: 24px;
    margin-bottom: 14px;
    color: var(--white-color);
    font-family: 'Noto Sans', sans-serif;
    margin-top: 2px;
}
.form-box h2{
    margin-bottom: 27px;
}
.form-box {
    width: 100%;
}
.personal-details span,
.personal-details a{
    line-height: 24px;
    color: var(--white-color);
}
.personal-details a{
    display: block;
    text-decoration: none;
}
.personal-details a:hover{
    color: var(--green-color);
}
/* PERSONAL INFO SECTION */
/* CONTACT SECTION */
.contact-form ul {
    display: grid;
    gap: 20px 15px;
    margin-bottom: 22px;
    grid-template-columns: 47.8% 47.8%;
}
.contact-form ul li input:focus,.contact-form ul li textarea:focus{
    outline: none;
}
.breadcrum ul li{
    font-size: 24px;
    font-weight: 300;
    color: var(--white-color);
}
.contact-form ul li input, .contact-form ul li textarea {
    width: 100%;
    border: none;
    font-size: 18px;
    color: #777777;
    background: #fff;
    padding: 21px 24px 20px;
    border-radius: 10px;
    box-shadow: 12px 12px 38px rgb(0 0 0 / 3%);
}
.contact-form ul li input:focus, 
.contact-form ul li textarea:focus{
    box-shadow: inset 0 0 0px 2px var(--accent);
}
.contact-form ul li input::placeholder,.contact-form ul li textarea::placeholder{
    font-size: 18px;
    color: #777777;
}
.contact-form ul li textarea{
    height: 134px;
    resize: none;
}
.contact-form ul li:last-child {
    grid-column: 1/-1;
}
.contact-con{
    background: #d6e0ea;
}
.form-box h2{
    font-size: 46px;
    line-height: 46px;
}
.submit-btn{
    border: none;
    cursor: pointer;
    position: relative;
    padding: 21px 34px 21px;
}
.contact-banner .text-border:after{
    width: 316px;
    height: 19px;
    background: url(../images/contact-border-line.png) no-repeat;
}
/* CONTACT SECTION */
.map-con iframe {
    width: 100%;
    border: none;
    height: 615px;
    filter: grayscale(1);
}
/* EXPERIENCE SECTION */
.experience-title {
    bottom: 30px;
    z-index: 2;
    display: flex;
    align-items: center;
    position: absolute;
    color: var(--white-color);
    background: var(--secondary--color);
    width: 199px;
    padding: 13px 19px 14px;
    right: 35px;
}
.experience-value{
    font-size: 50px;
    line-height: 50px;
    font-weight: 600;
    font-family: 'Noto Sans', sans-serif;
}

.experience-title span {
    text-transform: uppercase;
    display: inline-block;
    font-size: 16px;
    line-height: 16px;
    padding-left: 4px;
    padding-top: 7px;
}
/* EXPERIENCE SECTION */
/* NOT FOUND PAGE SECTION */
.not-found-page {
    background: #d6e0ea;
    padding: 100px 0 200px;
}
.not-found-title h2{
    font-size: 250px;
    line-height: 250px;
    margin-bottom: 40px;
}
.not-found-title span {
    font-size: 30px;
    margin-bottom: 25px;
    letter-spacing: 10px;
}
.not-found-title p {
    font-size: 18px;
    line-height: 24px;
    margin-bottom: 40px;
}
.not-found-title p {
    font-size: 18px;
    line-height: 24px;
    margin-bottom: 30px;
}
.not-found-title span {
    font-size: 28px;
    margin-bottom: 22px;
    letter-spacing: 8px;
}
/* NOT FOUND PAGE SECTION */
/* LOADER SECTION */
.loader-mask {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #fff;
    z-index: 99999;
}

.loader {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 50px;
    height: 50px;
    font-size: 0;
    color: var(--dark-green-color);
    display: inline-block;
    margin: -25px 0 0 -25px;
    text-indent: -9999em;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
}
.lead{
  font-size:13px;
}
.loader div {
    background-color: var(--dark-green-color);
    display: inline-block;
    float: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 50px;
    height: 50px;
    opacity: .5;
    border-radius: 50%;
    -webkit-animation: ballPulseDouble 2s ease-in-out infinite;
    animation: ballPulseDouble 2s ease-in-out infinite;
}
.nav-item.dropdown .dropdown-menu {
    margin-top: -2px;
}
.loader div:last-child {
    -webkit-animation-delay: -1s;
    animation-delay: -1s;
}

@-webkit-keyframes ballPulseDouble {
    0%,
    100% {
        -webkit-transform: scale(0);
        transform: scale(0);
    }
    50% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes ballPulseDouble {
    0%,
    100% {
        -webkit-transform: scale(0);
        transform: scale(0);
    }
    50% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}
.blogpage-section .blog-box.hide-blog{
    display: none;
}
/* LOADER SECTION */
/* BACK TO TOP BUTTON */

#button {
    display: inline-block;
    background-color: var(--accent);
    width: 82px;
    height: 82px;
    text-align: center;
    border-radius: 50%;
    position: fixed;
    bottom: 57px;
    right: 113px;
    transition: background-color .3s, 
      opacity .5s, visibility .5s;
    opacity: 0;
    visibility: hidden;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;    
    -webkit-animation: spineer 2s infinite;
    animation: spineer 2s infinite;   
    cursor: pointer;
}

.blog-box-content h3 a{
    text-decoration: none;
    color: var(--primary--color);
}
.blog-box-content h3 a:hover{
    color: var(--accent);   
}
input.error {
    box-shadow: inset 0 0 0px 2px red !important;
}
@-webkit-keyframes spineer {
    from {
    box-shadow: 0 0 0 0 rgba(148, 194, 46, .99)
    }
    to {
    box-shadow: 0 0 0 45px rgba(148, 194, 46, .01)
    }
    }    
    
    @keyframes spineer {
    from {
    box-shadow: 0 0 0 0 rgba(148, 194, 46, .99)
    }
    to {
    box-shadow: 0 0 0 45px rgba(148, 194, 46, .01)
    }
    }

  #button::after {
    content: "\f062";
    font-family: "Font Awesome 5 free";
    font-size: 26px;
    line-height: 50px;
    color: #fff;
    font-weight: 600;
}

  #button:hover {
    cursor: pointer;
  }
  #button:active {
    background-color: #555;
  }
  #button.show {
    opacity: 1;
    visibility: visible;
  }
  .logo-con ul li:nth-child(5n){
    padding: 51px 0 50px;
  }
/* BACK TO TOP BUTTON */



@media only screen and (max-width: 1850px) {
    .choose-con .container:before {
        width: 220px;
        height: 251px;
        right: -150px;
        background-size: contain;
    }
    .work-con .container:after {
        width: 194px;
        left: -149px;
        height: 282px;
        background-size: contain;
    }
    .work-con .container:before {
        width: 160px;
        height: 231px;
        right: -135px;
        background-size: contain;
    }
    .wrapper {
        padding: 0 15px;
    }
    .banner-img-box2 img{
        width: 360px;
    }
    .banner-img-box1 figure:first-child img{
        width: 360px;
    }
    .banner-img-box1 figure:first-child::before {
        left: -10px;
    }
    .banner-img-box1 figure:last-child::before {
        left: -92px;
    }
    .sub-banner-img img {
        width: 363px;
    }
}
@media only screen and (max-width: 1440px) {
    .logo-con ul li:nth-child(5n) {
        padding: 39px 0;
    }
    #light iframe {
        width: 100%;
        height: 600px;
    }
    #boxclose {
        right: -5px;
    }    
    .left-design::before, .right-design::after {
        left: -27px;
        width: 38px;
        background-size: contain;
    }
   .right-design::after {
        left: auto;
        right: 0;
    }
    .leaf-img::before {
        left: -4px;
    }
    .vedio-img:after {
        width: 400px;
        height: 400px;
    }
    .contact-banner .text-border:after {
        width: 256px;
        background-size: contain;
    }
    .personal-info {
        padding: 45px 60px;
    }
    .personal-info h3 {
        font-size: 44px;
        line-height: 46px;
        margin-bottom: 24px;
    }
    .form-box h2 {
        font-size: 44px;
    }
    .form-box h2 {
        margin-bottom: 24px;
    }
    .map-con iframe {
        height: 515px;
    }
    .static-con {
        padding-top: 100px;
        padding-bottom: 100px;
    }
    .static-box-item {
        padding: 34px 10px;
    }
    .static-value {
        font-size: 54px;
        line-height: 54px;
        margin-bottom: 8px;
    }
    .product-img img {
        width: 83%;
    }
    h1 {
        font-size: 64px;
        line-height: 72px;
    }
    .text-border:after {
        width: 202px;
        bottom: -4px;
    }
    .banner-img-box2 img {
        width: 300px;
    }
    .banner-img-box1 figure:first-child img {
        width: 300px;
    }
    .banner-img-box1 figure:last-child::before{
        left: -44px;
        width: 32px;
        height: 80px;
        background-size: contain;
    }
    .banner-con {
        padding: 224px 0 150px;
    }
    .banner-title .special-txt {
        margin-bottom: 16px;
    }
    .banner-title::before {
        right: 40px;
    }
    .banner-title p {
        font-size: 20px;
        line-height: 24px;
        margin-bottom: 32px;
    }
    .padding-top {
        padding-top: 140px;
    }
    .padding-bottom {
        padding-bottom: 140px;
    }
    .generic-title span, .wrok-content > span, .generic-box-content span {
        margin-bottom: 16px;
    }
    .generic-title h2 {
        margin-bottom: 44px;
    }
    h2 {
        font-size: 55px;
        line-height: 64px;
    }
    #service-slider {
        margin-bottom: 70px;
    }
    .work-con .generic-title h2 {
        margin-bottom: 68px;
    }
    .work-box-item {
        width: 340px;
        height: 340px;
    }
    .work-box-inner-item {
        width: 310px;
        height: 310px;
    }
    .work-con .container:before,
    .work-con .container:after,
    .choose-con .container:before{
        display: none;
    }
    .wrok-content h2 {
        margin-bottom: 24px;
    }
    .wrok-content p {
        margin-bottom: 38px;
    }
    .phone-text small {
        font-size: 46px;
        line-height: 46px;
    }
    .phone-con a {
        padding: 12px 59px 12px 20px;
    }
    .index1-poster {
        width: 444px;
        height: 440px;
    }
    .generic-box-img figure:before {
        left: -34px;
        bottom: -58px;
    }
    .generic-box-content h2 {
        margin-bottom: 22px;
    }
    .generic-box-content p {
        margin-bottom: 30px;
    }
    .generic-box {
        gap: 52px;
    }
    .generic-box-service-item figure {
        margin-bottom: 22px;
    }
    .generic-box-service-item {
        padding: 24px 39px;
    }
    .testimonials-item-content figure {
        margin-bottom: 24px;
    }
    #testimonials-slider {
        margin-bottom: 60px;
    }
    .blog-box::after {
        right: -32px;
    }
    .blog-box::before{
        left: -36px;
        bottom: -65px;
    }
    .blog-box {
        margin-bottom: 70px;
    }
    .logo-con ul li {
        padding: 26px 0 31px;
    }
    .blog-con {
        padding-bottom: 282px;
    }
    .footer-con {
        padding-top: 200px;
        padding-bottom: 100px;
    }
    .sub-banner-img img {
        width: 300px;
    }
}
@media only screen and (max-width: 1199px) {
    #button {
        right: 42px;
    }
    #button::after {
        font-size: 22px;
    }
    .price-box-item {
        padding: 46px 15px;
    }
    .not-found-title h2 {
        font-size: 200px;
        line-height: 200px;
        margin-bottom: 30px;
    }
    
    .team-box-img figure img {
        width: 167px;
        height: 200px;
    }
    .experience-value {
        font-size: 44px;
        line-height: 46px;
    }
    .vedio-img:after {
        width: 350px;
        height: 350px;
    }
    .contact-banner .text-border:after {
        width: 207px;
    }
    .personal-info {
        padding: 38px 38px;
    }
    #team-slider {
        margin-bottom: 60px;
    }  
    .personal-info h3 {
        font-size: 40px;
        line-height: 42px;
        margin-bottom: 22px;
    } .contact-form ul li input, .contact-form ul li textarea {
        padding: 18px 24px;
    }
    .map-con iframe {
        height: 415px;
    }
    .contact-form ul li textarea {
        height: 114px;
    }
    .personal-details h5 {
        font-size: 22px;
        line-height: 22px;
        margin-bottom: 8px;
    }
    .form-box h2 {
        margin-bottom: 20px;
    }
    .form-box h2 {
        font-size: 40px;
        line-height: 42px;
    } 
    .team-box-img figure {
        width: 162px;
        height: 200px;
    }
    .team-box-item {
        padding: 19px 21px 20px;
    }
    .static-con {
        padding-top: 80px;
        padding-bottom: 80px;
    }
    .static-box-item {
        padding: 28px 10px;
    }
    .static-value {
        font-size: 50px;
        line-height: 50px;
        margin-bottom: 6px;
    }
    .product-img figure {
        height: 214px;
        width: 185px;
    }
    .cart-btn {
        margin-top: -56px;
    }
    .sub-banner-img img {
        width: 245px;
    }
    .sub-banner {
        padding: 165px 0 100px;
    }
    .blog-sub-img {
        bottom: 24px;
    }
   
    .banner-img-box2 img {
        width: 246px;
    }
    .banner-img-box1 figure:first-child img {
        width: 270px;
    }
    .banner-img-box1 figure:last-child img{
        width: 200px;
    }
    .banner-img-box1 figure {
        margin-bottom: 50px;
    }
    h1 {
        font-size: 52px;
        line-height: 60px;
    }
    .banner-title .special-txt {
        margin-bottom: 12px;
    }
    .banner-title p {
        font-size: 18px;
        line-height: 20px;
        margin-bottom: 28px;
    }
    .banner-title::before {
        top: -48px;
        right: 40px;
        width: 64px;
        height: 98px;
        background-size: contain;
    }
    .header-con .navbar-nav {
        gap: 20px;
    }
    .generic-btn a {
        padding: 18px 38px;
    }
    .padding-bottom {
        padding-bottom: 120px;
    }
    .padding-top {
        padding-top: 120px;
    }
    .generic-title h2 {
        margin-bottom: 40px;
    }
    h2 {
        font-size: 48px;
        line-height: 58px;
    }
    .service-item {
        padding: 46px 6px 26px;
    }
    #service-slider {
        margin-bottom: 60px;
    }
    .work-box-item {
        width: 290px;
        height: 290px;
    }
    .work-box-inner-item {
        width: 270px;
        height: 270px;
    }
    .work-box-item figure {
        margin-bottom: 18px;
    }
    .work-box-item h3 {
        margin-bottom: 10px;
    }
    .work-con .generic-title h2 {
        margin-bottom: 64px;
    }
    .index1-poster {
        width: 384px;
        height: 384px;
    }
    .wrok-content h2 {
        margin-bottom: 18px;
    }
    .wrok-content p {
        margin-bottom: 28px;
    }
    .phone-text small {
        font-size: 42px;
        line-height: 42px;
    }
    .phone-con a {
        padding: 10px 41px 10px 20px;
    }
    #product-slider {
        margin-bottom: 58px;
    }
    .product-item {
        padding: 15px 15px;
    }
    .generic-box-img img{
        width: 100%;
    }
    .generic-box-img figure:after {
        width: 340px;
        height: 444px;
    }
    .generic-box-img figure:before {
        left: -22px;
    }
    .generic-box-content h2 {
        margin-bottom: 15px;
    }
    .generic-box-content p {
        font-size: 18px;
        margin-bottom: 26px;
    }
    .generic-box-service-item {
        padding: 20px 18px;
    }
    h3 {
        font-size: 22px;
        line-height: 24px;
    }
    .testimonials-item-content figure {
        width: 70px;
        height: 70px;
        margin-bottom: 18px;
    }
    .testimonials-item-content p {
        font-size: 18px;
        line-height: 26px;
        padding-right: 0;
        margin-bottom: 16px;
    }
    .testimonials-item-img figure {
        width: 130px;
        height: 130px;
    }
    .testimonials-item-img figure:after {
        top: -22px;
        width: 85px;
        height: 175px;
        background-size: contain;
    }
    .testimonials-item {
        gap: 16px;
    }
    .owl-carousel .owl-item .testimonials-item-content figure img {
        width: 30px;
    }
    #testimonials-slider {
        margin-bottom: 50px;
    }
    .blog-box::after {
        right: -17px;
        top: -69px;
    }
    .blog-box-content span {
        margin-bottom: 22px;
    }
    .blog-box-content h3 {
        margin-bottom: 8px;
    }
    body {
        line-height: 26px;
    }
    .blog-box-content p {
        margin-bottom: 14px;
    }
    .blog-box-content {
        padding: 0 19px 24px 30px;
    }
    .blog-box-item figure {
        margin-bottom: 24px;
    }
    .blog-box {
        gap: 25px;
        margin-bottom: 60px;
    }
    .blog-con {
        padding-bottom: 262px;
    }
    .logo-con ul li {
        padding: 22px 0;
    }
    .footer-con {
        padding-top: 180px;
        padding-bottom: 75px;
    }
    .footer-content p, .footer-content span {
        margin-bottom: 16px;
        padding-right: 38px;
    }
    .footer-content span {
        margin-bottom: 14px;
        padding-right: 68px;
    }
    .footer-inner-con {
        gap: 20px;
    }
    .banner-con {
        padding: 214px 0 140px;
    }
    .header-btn a {
        padding: 12px 15px 12px 14px;
    }
    .footer-con #carouselExampleControls .carousel-control-prev {
        font-size: 20px;
        line-height: 20px;
        top: 50%;
    }
}
@media only screen and (max-width: 991px) {
    .navbar-brand img{
        width: 175px;
    }
    .team-box-img figure {
        width: 168px;
        height: 200px;
    }
    .product-img figure {
        width: 100%;
    }
    #button {
        width: 65px;
        height: 65px;
    }
    .price-box {
        gap: 15px;
    }
    .price-box-item ul li {
        font-size: 16px;
        line-height: 16px;
        margin-bottom: 16px;
    }
    .price-box-item ul {
        margin-bottom: 37px;
    }
    .price-value {
        font-size: 46px;
        line-height: 46px;
        margin-bottom: 18px;
    }
    .header-con .navbar-light .navbar-nav .active>.nav-link{
        color: #fff;
    }
    .not-found-title h2 {
        font-size: 180px;
        line-height: 180px;
    }
    .video-wrap {
        width: 80px;
        height: 80px;
    }
    .logo-con ul li img {
        width: 100px;
    }
    .tastimonials-con .btn-wrap button.prev-btn {
        margin-right: 0;
    }
    .team-box-item {
        padding: 19px 18px 20px;
    }
    .header-con .navbar-light .navbar-nav .nav-link:hover{
        color: var(--green-color);
    }
    .header-con .generic-btn a:hover{
        background: var(--green-color);
    }
    .experience-value {
        font-size: 40px;
        line-height: 40px;
    }
    .experience-title {
        bottom: 24px;
        right: 24px;
    }
    .vedio-img:after {
        width: 300px;
        height: 300px;
    }
    .contact-banner .text-border:after {
        width: 155px;
    }
    .personal-info {
        padding: 28px 28px;
        margin-bottom: 30px;
    }
    .personal-info ul li figure {
        width: 60px;
        height: 60px;
    }
    .contact-form ul li input, .contact-form ul li textarea {
        padding: 15px 24px;
    }
    .form-box h2 {
        font-size: 36px;
        line-height: 40px;
    }
    .personal-info h3 {
        font-size: 36px;
        line-height: 40px;
        margin-bottom: 18px;
    }
    .map-con iframe {
        height: 350px;
    }
    .submit-btn {
        padding: 18px 34px;
    }
    .personal-info ul{
        gap: 15px;
        display: grid;
        grid-template-columns: 48% 48%;
    }
    .personal-info ul li {
        margin-bottom: 0;
    }
    .personal-details {
        padding-left: 78px;
    }
    .personal-info ul li figure img {
        width: 28px;
    }
    .faq-box .card-header h5 button {
        font-size: 22px;
    }
    .faq-box .card-body {
        padding: 0 30px 25px 30px;
    }
    .generic-list li {
        font-size: 18px;
        line-height: 18px;
        margin-bottom: 15px;
    }
    #team-slider {
        margin-bottom: 50px;
    }
    .team-box {
        grid-template-columns: 30.5% 30.5% 30.5%;
    }    
    .static-con {
        padding-top: 70px;
        padding-bottom: 70px;
    }
    .static-box-item {
        padding: 24px 10px;
    }
    .static-box {
        grid-template-columns: 48% 48%;
    }
    .static-value {
        font-size: 44px;
        line-height: 44px;
    }
    .product-img {
        margin-bottom: 15px;
    }
    .product-box-con {
        gap: 30px 15px;
        grid-template-columns: 32% 32% 32%;
    }
    .cart-btn {
        margin-top: -21px;
    }
    .sub-banner-img img {
        width: 190px;
    }
    .banner-img-box2 figure::before, .leaf-img2::before {
        left: -39px;
        bottom: -41px;
        width: 50px;
        height: 46px;
        background-size: contain;
    }
    .blog-sub-img {
        bottom: 18px;
    }
    .banner-img-box1 figure:first-child::before, .leaf-img::before {
        left: -37px;
        width: 74px;
        height: 170px;
        background-size: contain;
    }
    .sub-banner {
        padding: 150px 0 95px;
    }
    /****************/
    .navbar-toggler {
        right: 0;
        padding: 0;
        bottom: 4px;
        width: 36px;
        border: none;
        position: absolute;
    }
    .navbar-toggler-icon{
        float: left;
        width: 100%;
        height: 2px;
        margin: 3px 0;
        background: var(--accent);
    }
    .navbar-toggler:focus{
        outline: none;
    }
    .navbar-toggler .navbar-toggler-icon:nth-child(1),
    .navbar-toggler .navbar-toggler-icon:nth-child(3) {
    -webkit-transition: transform .35s ease-in-out;
    -moz-transition: transform .35s ease-in-out;
    -o-transition: transform .35s ease-in-out;
    transition: transform .35s ease-in-out;
    }
    .navbar-toggler:not(.collapsed) .navbar-toggler-icon:nth-child(1) {
    position: absolute;
    top:8px;
    -webkit-transform: rotate(135deg);
    -moz-transform: rotate(135deg);
    -o-transform: rotate(135deg);
    transform: rotate(135deg);
    left: 0px;
    }
    .navbar-toggler:not(.collapsed) .navbar-toggler-icon:nth-child(2) {
    height: 12px;
    visibility: hidden;
    background-color: transparent;
    }
    .navbar-toggler:not(.collapsed) .navbar-toggler-icon:nth-child(3) {
    position: absolute;
    top:8px;
    -webkit-transform: rotate(-135deg);
    -moz-transform: rotate(-135deg);
    -o-transform: rotate(-135deg);
    transform: rotate(-135deg);
    left: 0px;
    }
    .social-icon{
        display: none;
    }
    .navbar-collapse.collapse, .navbar-collapse.collapsing {
        width: 100%;
        right: 0;
        top: 68px;
        z-index: 999;
        position: absolute;
        background: var(--accent);
    }
    .header-btn {
        margin-left: 15px;
        margin-right: 15px;
        margin-bottom: 20px;
        margin-top: 15px;
    }
    .header-con .navbar-nav {
        gap: 6px;
    }
    .header-btn {
        margin-left: 15px;
        margin-right: 15px;
    }
    .header-con ul.navbar-nav .nav-item {
        padding: 0 15px;
    }
    .header-con .navbar-collapse ul.navbar-nav:first-child .nav-item:first-child {
        padding-top: 15px;
    }
    
    .header-con ul.navbar-nav .nav-item:last-child {
        padding-bottom: 10px;
    }
    /********************/
    .banner-img-box1 figure:first-child img {
        width: 200px;
    }
    .banner-img-box1 figure:last-child img {
        width: 150px;
    }
    .banner-img-box1 figure:first-child::before {
        left: -10px;
        width: 68px;
        height: 150px;
        background-size: contain;
    }
    .banner-title .special-txt {
        margin-bottom: 6px;
    }
    h1 {
        font-size: 40px;
        line-height: 46px;
    }
    .text-border:after {
        width: 124px;
        bottom: -8px;
        background-size: contain;
    }
    .banner-title h1 {
        margin-bottom: 14px;
        color: var(--white-color);
    }
    .banner-title p {
        font-size: 18px;
        line-height: 20px;
        margin-bottom: 24px;
    }
    .generic-btn a {
        padding: 17px 22px;
    }
    .banner-img-box2 img {
        width: 190px;
    }
    .banner-img-box2 figure::before {
        left: -40px;
        width: 50px;
        height: 45px;
        bottom: -55px;
        background-size: contain;
    }
    .banner-con {
        padding: 180px 0 110px;
    }
    .banner-title::before {
        top: -38px;
        right: 9px;
        width: 48px;
    }
    .padding-top {
        padding-top: 70px;
    }
    .padding-bottom {
        padding-bottom: 70px;
    }
    .generic-title span, 
    .wrok-content > span,
    .generic-box-content span {
        margin-bottom: 12px;
    }
    .generic-title h2 {
        margin-bottom: 36px;
    }
    .generic-title {
        width: 62%;
    }
    .service-item {
        padding: 40px 8px 26px;
    }
    .service-item figure {
        margin-bottom: 20px;
    }
    #service-slider {
        margin-bottom: 40px;
    }
    .service-con .padding-bottom, .product-con .padding-bottom{
        padding-bottom: 120px;
    }
    h2 {
        font-size: 38px;
        line-height: 46px;
    }
    .generic-title h2 {
        margin-bottom: 32px;
    }
    .plant-img .container:after {
        height: 52px;
        background-size: contain;
    }
    .work-box {
        gap: 15px;
    }
    .work-box-item {
        width: 230px;
        height: 230px;
    }
    .work-box-item figure {
        margin-bottom: 14px;
    }
    .work-box-item h3 {
        margin-bottom: 8px;
    }
    .work-box-item span {
        padding: 0 32px;
        font-size: 14px;
        line-height: 20px;
    }
    .work-box-inner-item {
        width: 220px;
        height: 220px;
    }
    .work-box-item:after {
        top: -22px;
        width: 230px;
        height: 46px;
        background-size: contain;
    }
    .work-box .work-box-item:nth-child(2):after {
        bottom: -22px;
        background-size: contain;
    }
    .work-con .generic-title h2 {
        margin-bottom: 44px;
    }
    .wrok-content h2 {
        margin-bottom: 10px;
    }
    .wrok-content {
        padding-right: 0;
    }
    .phone-text small {
        font-size: 31px;
        line-height: 31px;
    }
    .phone-text span {
        font-size: 18px;
        line-height: 18px;
        margin-bottom: 10px;
    }
    .index1-poster {
        width: 330px;
        height: 330px;
    }
    .wrok-content p {
        font-size: 18px;
        line-height: 26px;
    }
    .phone-con img{
        width: 50px;
    }
    .phone-con figure {
        width: 80px;
        height: 80px;
    }
    #product-slider {
        margin-bottom: 48px;
    }
    .generic-box-img figure:after {
        width: 258px;
        height: 325px;
    }
    .generic-box {
        gap: 40px;
    }
    .generic-box-content p {
        font-size: 16px;
        padding-right: 0;
        margin-bottom: 24px;
    }
    .generic-box-service-item {
        padding: 15px 12px;
    }
    .generic-box-service-item figure {
        margin-bottom: 18px;
    }
    h3 {
        font-size: 18px;
        line-height: 20px;
    }
    .testimonials-item-content figure {
        width: 50px;
        height: 50px;
        margin-bottom: 14px;
    }
    .owl-carousel .owl-item .testimonials-item-content figure img {
        width: 22px;
    }
    .testimonials-item-content p {
        font-size: 18px;
        line-height: 26px;
        margin-bottom: 10px;
    }
    .tastimonials-con .generic-title::after {
        width: 56px;
        height: 100px;
        background-size: contain;
    }
    #testimonials-slider {
        margin-bottom: 40px;
    }
    .blog-box {
        gap: 15px;
        margin-bottom: 50px;
    }
    .blog-box-content {
        padding: 0 15px 20px 15px;
    }
    body {
        line-height: 22px;
        font-size: 16px;
    }
    .blog-box-item figure {
        margin-bottom: 18px;
    }
    .blog-box-content span {
        margin-bottom: 16px;
    }
    .blog-time {
        font-size: 14px;
        padding: 8px 15px;
    }
    .blog-con {
        padding-bottom: 215px;
    }
    .logo-con ul li {
        padding: 18px 0;
    }
    .footer-con {
        margin-top: -112px;
        padding-top: 170px;
        padding-bottom: 65px;
    }
    .footer-content{
        text-align: center;
        grid-column: 1/-1;
    }
    .footre-logo figure {
        margin-bottom: 20px;
    }
    .footer-inner-con {
        grid-template-columns: 25% 31% 36%;
    }
    .footer-content p, .footer-content span {
        margin-bottom: 8px;
        padding: 0 168px;
    }
    .footer-content span{
        padding: 0;
    }
    .footer-social-con ul {
        justify-content: center;
    }
    .site-map h4 {
        margin-bottom: 18px;
    }
    .footer-link ul li {
        margin-bottom: 9px;
    }
}
@media only screen and (max-width: 767px) {
    .product-detail .product-tab ul li {
        margin: 0 10.5px;
    }
    .logo-con ul li:nth-child(5n) {
        padding: 37px 0;
    }
    .service-con .owl-stage-outer::after, .service-con .owl-stage-outer::before {
        box-shadow: 0px 0px 100px 47px #d6e0ea;
    }
    .blog-box::before, .blog-box::after{
        width: 42px;
        height: 42px;
        background-size: contain;
    }
    #testimonials-slider::before {
        width: 48px;
        height: 42px;
        background-size: contain;
    }
    .price-box-item {
        padding: 36px 15px;
        width: 64%;
        margin: 0 auto;
    }
    .price-box-item ul {
        margin-bottom: 27px;
    }
    .price-value {
        font-size: 42px;
        line-height: 46px;
        margin-bottom: 16px;
    }
    .price-box {
        gap: 30px;
        grid-template-columns: 100%;
    }
    .not-found-title h2 {
        font-size: 150px;
        line-height: 150px;
        margin-bottom: 24px;
    }
    .not-found-title p br{
        display: none;
    }
    #light {
        left: 50%;
    }
    .next-btn {
        margin-left: 10px;
    }
    .team-box-img figure img {
        width: 206px;
        height: 200px;
    }
    .experience-title{
        text-align: left;
    }
    .experience-title {
        width: 184px;
    }
    
    .experience-value {
        font-size: 35px;
        line-height: 35px;
    }
    .personal-info h3 {
        font-size: 32px;
        line-height: 36px;
        margin-bottom: 15px;
    }
    .submit-btn {
        padding: 16px 26px 17px;
    }
    .contact-form ul {
        gap: 15px 15px;
        margin-bottom: 15px;
    }
    .contact-form ul li textarea {
        height: 100px;
    }
    .personal-info ul li figure img {
        width: 22px;
    }
    .contact-form ul li input, .contact-form ul li textarea {
        padding: 12px 18px;
    }
    .personal-details {
        padding-left: 58px;
    }
    .form-box h2 {
        font-size: 32px;
        line-height: 36px;
    }    
    .personal-info ul li figure {
        width: 50px;
        height: 50px;
    }
    .personal-details h5 {
        font-size: 20px;
        line-height: 20px;
    }
    .faq-box {
        width: 100%;
    }
    .about-box .generic-list {
        text-align: left;
        margin-bottom: 15px;
        display: inline-block;
    }
    #team-slider {
        margin-bottom: 30px;
    }
    #team-slider .team-box-img figure {
        width: 100%;
    }
    #team-slider .owl-item img {
        width: 100%;
    }
    .team-box {
        gap: 15px;
        grid-template-columns: 48.5% 48.5%;
    }
    .social-link ul li a i {
        width: 24px;
        height: 24px;
        font-size: 12px;
    }
    .team-box-img {
        margin-bottom: 20px;
    }
    .team-box-img figure {
        width: 204px;
    }
    .static-value {
        font-size: 32px;
        line-height: 32px;
    }
    .static-con {
        padding-top: 50px;
        padding-bottom: 50px;
    }
    .static-value {
        font-size: 40px;
        line-height: 40px;
    }
    
    .product-img figure {
        width: 214px;
    }
    .product-box-con {
        gap: 30px;
        grid-template-columns: 48% 48%;
    }
    .sub-banner-img img {
        width: 260px;
    }
    .service-blog-con .blog-box {
        grid-template-columns: 48% 48%;
    }
    .sub-banner-inner-con {
        gap: 30px;
        grid-template-columns: 100%;
    }
    .banner-inner-con {
        grid-template-columns: 100%;
    }
    .breadcrum ul {
        margin-bottom: 5px;
    }
    .banner-con::before, .sub-banner::before {
        height: 110px;
        background-size: contain;
    }
    .breadcrum ul li a {
        font-size: 20px;
    }
     .leaf-img::before {
        left: -30px;
        width: 60px;
        height: 140px;
        top: -25px;
    }
    .sub-banner-img figure{
        display: inline-block;
    }
    .banner-img-box1 figure {
        float: left;
        margin-bottom: 30px;        
    }
    .banner-img-box1 figure:last-child img {
        width: 100%;
    }
    .banner-img-box1 figure:first-child img {
        width: 264px;
    }
    .banner-img-box1 figure:last-child::before{
        display: none;
    }
    .banner-img-box2{
        text-align: center;
    }
    .banner-img-box2 figure{
        display: inline-block;
    }
    .banner-title {
        margin-bottom: 25px;
    }
    .service-item {
        padding: 40px 17px 26px;
    }
    h2 {
        font-size: 34px;
        line-height: 40px;
    }
    .generic-title h2 {
        margin-bottom: 28px;
    }
    .plant-img .container:after {
        left: 18px;
        height: 36px;
        background-size: contain;
    }
    .padding-top {
        padding-top: 60px;
    }
    .padding-bottom{
        padding-bottom: 60px;
    }
    .service-con .padding-bottom, .product-con .padding-bottom {
        padding-bottom: 80px;
    }
    .work-box {
        gap: 38px;
        grid-template-columns: 1fr 1fr;
    }
    .help-con{
        text-align: center;
    }
    .wrok-content {
        margin-top: 30px;
    }
    .wrok-content p {
        font-size: 16px;
        line-height: 24px;
        margin-bottom: 22px;
    }
    .phone-text small {
        font-size: 28px;
        line-height: 28px;
    }
    .phone-con a {
        padding: 8px 32px 8px 20px;
    }
    .generic-box {
        gap: 80px;
        grid-template-columns: 100%;
    }
    .generic-box-img img {
        width: 290px;
    }
    .generic-box-img figure{
        display: inline-block;
    }
    .generic-box{
        text-align: center;
    }
    .generic-box-service {
        justify-content: center;
    }
    .tastimonials-con .generic-title {
        width: 64%;
    }
    .tastimonials-con .generic-title::after {
        width: 38px;
        height: 69px;
        right: -46px;
        top: -36px;
    }
    #testimonials-slider {
        margin-bottom: 30px;
    }
    .blog-box {
        gap: 15px;
        margin-bottom: 40px;
        grid-template-columns: 100%;
    }
    .blog-con {
        padding-bottom: 205px;
    }
    .logo-con ul li figure img {
        width: 72px;
    }
    .logo-con ul li {
        padding: 14px 0;
    }
    .footer-content p, .footer-content span {
        margin-bottom: 5px;
        padding: 0 94px;
    }
    .footer-con {
        padding-top: 162px;
        padding-bottom: 46px;
    }
    .contact-info ul li {
        padding-right: 0;
    }
    .footer-inner-con {
        grid-template-columns: 20% 37% 36%;
    }    
}
@media only screen and (max-width: 575px) {
    .product-detail .product-tab ul li {
        margin: 0 6.5px;
    }
    .footer-content {
        text-align: center;
        grid-column: 1/-1;
        margin-bottom: 15px;
    }
    .logo-con ul li:nth-child(5n) {
        padding: 26px 0;
    }
    .logo-con ul li:nth-child(7n) {
        padding: 26px 0;
    }
    #light2, #light {
        top: 50%;
    }
    #light iframe {
        width: 96%;
        height: 400px;
    }
    #boxclose {
        right: 0;
    }
    .banner-con {
        padding: 165px 0 110px;
    }
    .banner-img-box1 figure:first-child::before {
        width: 53px;
        height: 115px;
        top: -56px;
        background-size: contain;
    }
    .team-box-item {
        width: 296px;
        margin: 0 auto;
    }
    .product-item {
        width: 300px;
        margin: 0 auto;
    }
    .service-item {
        width: 300px;
        margin: 0 auto;
    }
    @-webkit-keyframes spineer {
        from {
        box-shadow: 0 0 0 0 rgba(148, 194, 46, .99)
        }
        to {
        box-shadow: 0 0 0 25px rgba(148, 194, 46, .01)
        }
        }    
        
        @keyframes spineer {
        from {
        box-shadow: 0 0 0 0 rgba(148, 194, 46, .99)
        }
        to {
        box-shadow: 0 0 0 25px rgba(148, 194, 46, .01)
        }
        }
    #button::after {
        font-size: 18px;
    }
    #button {
        right: 24px;
        width: 55px;
        height: 55px;
    }
    .left-design::before, .right-design::after {
        left: -10px;
        bottom: -57px;
    }
    .price-box-item {
        padding: 26px 15px;
        width: 100%;
    }
    .not-found-page {
        padding: 40px 0 200px;
    }
    .not-found-title span {
        font-size: 22px;
        margin-bottom: 11px;
        letter-spacing: 5px;
        line-height: 28px;
    }
    .not-found-title h2 {
        font-size: 80px;
        line-height: 80px;
        margin-bottom: 12px;
    }
    .service-con .padding-bottom, .product-con .padding-bottom {
        padding-bottom: 60px;
    }
    .clip-each {
        width: 40px;
        height: 40px;
    }
    .logo-con ul li:nth-child(3) figure img{
        width: 50px;
    }
    .logo-con ul li:last-child figure img{
        width: 100px;
    }
    .plant-img .container:after{
        display: none;
    }
    .contact-banner .text-border:after {
        width: 138px;
        height: 24px;
    }
    .footer-link ul{
        text-align: left;
        display: inline-block;
    }
    .personal-info ul {
        gap: 15px;
        grid-template-columns: 100%;
    }
    .generic-btn a, .submit-btn {
        font-size: 16px;
    }
    .contact-form ul li input, .contact-form ul li textarea,
    .contact-form ul li input::placeholder, .contact-form ul li textarea::placeholder
    {
        font-size: 16px;
    }
    .contact-form ul {
        grid-template-columns: 100%;
    }
    .personal-info h3 {
        font-size: 30px;
        line-height: 34px;
    }
    .faq-box .card-header h5 button {
        font-size: 20px;
        line-height: 22px;
    }
    .faq-box .card-header h5 button:after {
        width: 30px;
        height: 30px;
    }
    .generic-list li {
        font-size: 16px;
        line-height: 22px;
        margin-bottom: 8px;
    }
    .generic-box-content p {
        margin-bottom: 14px;
    }
    .team-box {
        grid-template-columns: 100%;
    }
    .team-box-img figure {
        width: 100%;
    }
    .team-box-img figure img {
        width: 100%;
    }
    .static-box {
        gap: 15px;
    }
    .static-con {
        padding-top: 40px;
        padding-bottom: 40px;
    }
    .static-box-item {
        font-size: 16px;
    }
    .static-box-item {
        padding: 20px 10px;
    }
    .static-value {
        font-size: 28px;
        line-height: 28px;
    }
    .product-img figure {
        width: 100%;
    }
    .product-img img {
        width: 100%;
        object-fit: none;
    }
    .product-box-con {
        gap: 30px;
        grid-template-columns: 100%;
    }
    .service-blog-con .blog-box {
        grid-template-columns: 100%;
    }
    .blog-sub-img img {
        width: 65px;
    }
    .service-con .owl-stage-outer::after, 
    .service-con .owl-stage-outer::before,
    .work-box-item:after,
    .blog-box::after{
        display: none;
    }
    .work-box {
        gap: 15px;
        grid-template-columns: 100%;
    }
    .banner-img-box1 figure {
        float: none !important;
        margin-bottom: 15px;
    }
    .banner-img-box1 figure:first-child img {
        width: 100%;
    }
    .banner-img-box1{
        margin-bottom: 15px;
    }
    .banner-title {
        padding: 0 0;
    }
    h1 {
        font-size: 34px;
        line-height: 46px;
    }
    .generic-title {
        width: 100%;
    }
    h2 {
        font-size: 30px;
        line-height: 34px;
    }
    .generic-title h2 {
        margin-bottom: 22px;
    }
    .plant-img .container:after {
        left: 18px;
        height: 23px;
        width: 91%;
        background-size: contain;
    }
    .work-box{
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }
    .phone-con img {
        width: 40px;
    }
    .phone-text small {
        font-size: 24px;
        line-height: 22px;
    }
    .phone-con a {
        padding: 6px 24px 5px 12px;
    }
    .testimonials-item {
        gap: 16px;
        flex-wrap: wrap;
        text-align: center;
    }
    .testimonials-item {
        gap: 16px;
        flex-wrap: wrap;
        text-align: center;
        justify-content: center;
    }
    .testimonials-item-content{
        text-align: left;
    }
    .tastimonials-con .btn-wrap button.prev-btn {
        margin-right: 0;
    }
    .tastimonials-con .generic-title,.blog-con .generic-title {
        width: 100%;
    }
    .tastimonials-con .generic-title::after {
        right: 0;
    }
    .blog-box::before {
        left: 0;
    }
    .logo-con ul {
        grid-template-columns: 50% 50%;
    }
    .footer-con {
        padding-top: 200px;
        padding-bottom: 50px;
        margin-top: -153px;
    }
    .footer-link,.contact-info{
        text-align: left;
    }
    h4 {
        font-size: 18px;
    }
    .footer-content p, .footer-content span {
        padding: 0 60px;
    }
    .footer-inner-con .site-map:last-child{
        display: none;
    }
    .footer-inner-con {
        gap: 0 0px;
        text-align: center;
        grid-template-columns: 50% 50%;
    }
    .video-wrap {
        width: 80px;
        height: 80px;
    }
    .carousel-control-next, .carousel-control-prev {
        width: 30px;
        height: 30px;
    }
    .carousel-control-next {
        right: -4px;
    }.carousel-control-prev {
        left: -4px;
    }
}

@media only screen and (max-width: 475px) {
    .footer-content p {
        padding: 0;
        margin-bottom: 12px;
    }
    .footer-content span {
        padding: 0 27px;
        margin-bottom: 12px;
    }
}


/*
 * ARAJEL entegrasyon ekleri
 * X temasının orijinal CSS/animasyon dosyalarına dokunulmamıştır.
 * Bu dosya yalnızca Y temasından alınan menü yaprağı efektini ve
 * kullanıcının istediği mobil banner sıralamasını ekler.
 */
html,
body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}
img,
video,
iframe { max-width: 100%; }

.header-con .navbar-nav > .nav-item {
    position: relative;
}
.header-con .navbar-nav > .nav-item > .nav-link {
    position: relative;
    z-index: 1;
}
.header-con .navbar-nav > .nav-item > .nav-link::after {
    content: "";
    position: absolute;
    z-index: -1;
    top: 4px;
    left: 50%;
    width: 43px;
    height: 25px;
    margin-left: -21.5px;
    background: url('../images/menu-leaf.png') center center / 43px 25px no-repeat;
    opacity: 0;
    pointer-events: none;
    transform-origin: 50% 100%;
}
.header-con .navbar-nav > .nav-item:hover > .nav-link::after,
.header-con .navbar-nav > .nav-item.active > .nav-link::after,
.header-con .navbar-nav > .nav-item.show > .nav-link::after {
    opacity: 1;
    animation: arajel-nav-leaf 0.8s ease-out both;
}
@keyframes arajel-nav-leaf {
    0% { transform: translateY(40px) scale(0); }
    65% { transform: translateY(0) scale(1); }
    70% { transform: rotate(-6deg); }
    75% { transform: rotate(6deg); }
    80% { transform: rotate(-6deg); }
    85% { transform: rotate(6deg); }
    90% { transform: rotate(-6deg); }
    95% { transform: rotate(6deg); }
    100% { transform: rotate(0); }
}
@media only screen and (max-width: 991px) {
    .header-con .navbar-nav > .nav-item > .nav-link::after {
        top: 3px;
    }
    /* Mobilde önce metin, ardından X temasının görselleri görünür. */
    .banner-inner-con .banner-title { order: 1; }
    .banner-inner-con .banner-img-box1 { order: 2; }
    .banner-inner-con .banner-img-box2 { order: 3; }
}
@media (prefers-reduced-motion: reduce) {
    .header-con .navbar-nav > .nav-item > .nav-link::after {
        animation: none !important;
    }
}


/* 2026 ARAJEL içerik ve görünüm revizyonları — X temasının çekirdek dosyaları değiştirilmemiştir. */
.header-con .navbar-nav { gap: 38px; }
.header-con .navbar-light .navbar-nav .nav-link { font-size: 16px; }
.header-con .navbar-nav > .nav-item > .nav-link::after { top: -14px; }
.header-action-group { gap: 10px; margin-left: 25px; }
.header-action-group .header-btn { margin: 0; }
.header-buy-btn a { font-size: 16px; line-height: 16px; padding: 12px 18px; }
.header-buy-btn a::after { left: 2px; border-top: 10px solid var(--green-color); border-right: 10px solid transparent; }
.header-buy-btn a:hover::after { border-top-color: var(--white-color); }
.navbar-brand img { width: auto; max-width: 180px !important; }
.footre-logo img { width: auto; max-width: 165px; }

.banner-title .arajel-hero-lead {
    max-width: 610px;
    margin-left: auto;
    margin-right: auto;
    font-family: 'Noto Sans', sans-serif;
    font-size: 25px;
    line-height: 1.45;
    font-weight: 500;
    letter-spacing: .15px;
    text-shadow: 0 2px 20px rgba(0,0,0,.14);
}
#service-slider .owl-stage { display: flex; }
#service-slider .owl-item { display: flex; height: auto; }
#service-slider .item, #service-slider .service-item { width: 100%; height: 100%; }
#service-slider .service-item { min-height: 185px; display: flex; flex-direction: column; justify-content: flex-start; }
#service-slider .service-item h4 { min-height: 56px; display: flex; align-items: center; justify-content: center; }

.home-faq-section .faq-more-btn, .knowledge-all-btn, .technical-btn { margin-top: 42px; }
.home-faq-section .faq-more-btn a, .knowledge-all-btn a, .technical-btn a { display: inline-block; }

.arajel-application-section {
    position: relative;
    background: linear-gradient(rgba(9,77,43,.88),rgba(9,77,43,.88)), url('../images/tastimonials-bg-image.jpg') center/cover no-repeat;
}
.arajel-application-section .container:before { opacity: .16; }
.arajel-application-section .generic-box-content > span,
.arajel-application-section .generic-box-content h2,
.arajel-application-section .generic-box-content p { color: var(--white-color); }
.arajel-application-section .generic-box-service-item h3 { color: var(--primary--color); }

.knowledge-hub-section { background: #d6e0ea; position: relative; overflow: hidden; }
.knowledge-hub-section::before { content:""; position:absolute; width:360px; height:521px; right:-120px; bottom:-170px; background:url('../images/tree-img1.png') center/contain no-repeat; opacity:.18; }
.knowledge-hub-heading { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr); align-items:end; gap:70px; margin-bottom:55px; position:relative; z-index:1; }
.knowledge-hub-heading .generic-title { width:auto; margin:0; text-align:left; }
.knowledge-hub-heading p { margin:0 0 8px; font-size:19px; line-height:1.7; color:#355e48; }
.knowledge-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:24px; position:relative; z-index:1; }
.knowledge-grid-home { grid-template-columns:repeat(4,minmax(0,1fr)); }
.knowledge-card { min-height:330px; padding:32px 28px 30px; background:#fff; border:3px solid transparent; border-radius:28px 28px 0 0; text-decoration:none!important; display:flex; flex-direction:column; box-shadow:0 18px 45px rgba(22,76,42,.08); transition:.4s ease; }
.knowledge-card:hover { transform:translateY(-10px); border-color:var(--accent); box-shadow:0 28px 65px rgba(22,76,42,.16); }
.knowledge-icon { width:62px; height:62px; border-radius:20px 20px 0 20px; display:flex; align-items:center; justify-content:center; background:#eff7e6; color:var(--green-color); font-size:25px; margin-bottom:24px; }
.knowledge-card small { color:#66904d; font-weight:700; text-transform:uppercase; letter-spacing:.8px; margin-bottom:9px; }
.knowledge-card h3 { font-size:25px; line-height:1.15; margin-bottom:15px; color:var(--primary--color); }
.knowledge-card p { color:#5a6c60; line-height:1.65; margin-bottom:24px; }
.knowledge-link { margin-top:auto; color:var(--green-color); font-weight:700; }
.knowledge-link i { margin-left:8px; transition:.3s ease; }
.knowledge-card:hover .knowledge-link i { transform:translateX(6px); }

.product-identity-section { background:#d6e0ea; }
.product-identity-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.product-identity-card { padding:28px 30px; background:#fff; border-radius:22px 22px 0 0; border:3px solid transparent; box-shadow:0 16px 40px rgba(22,76,42,.08); }
.product-identity-card:hover { border-color:var(--accent); }
.product-identity-card small { display:block; color:#719556; font-weight:700; text-transform:uppercase; letter-spacing:.65px; margin-bottom:8px; }
.product-identity-card strong { display:block; font-family:'Noto Sans',sans-serif; color:var(--primary--color); font-size:24px; line-height:1.2; }
.arajel-benefits-section { background:#f1f8f8; }
.benefit-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:25px; }
.benefit-card { min-height:285px; padding:32px; background:#fff; border-radius:28px 28px 0 0; border:3px solid transparent; box-shadow:0 18px 48px rgba(22,76,42,.08); }
.benefit-card:hover { border-color:var(--secondary--color); transform:translateY(-6px); }
.benefit-card > span { width:62px; height:62px; border-radius:50%; background:#eef6e4; color:var(--green-color); display:flex; align-items:center; justify-content:center; font-size:24px; margin-bottom:24px; }
.benefit-card h3 { font-size:25px; margin-bottom:13px; }
.benefit-card p { line-height:1.65; margin:0; }
.technical-summary-section { background:#fff; }
.technical-summary { display:grid; grid-template-columns:.9fr 1.1fr; gap:70px; align-items:center; padding:55px; border-radius:32px 32px 0 0; background:#164c2a; color:#fff; box-shadow:0 25px 70px rgba(22,76,42,.18); }
.technical-summary > div > span { color:var(--secondary--color); font-weight:700; }
.technical-summary h2 { color:#fff; margin:12px 0 18px; }
.technical-summary p { color:rgba(255,255,255,.82); font-size:18px; line-height:1.7; margin:0; }
.technical-summary-list { list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.technical-summary-list li { padding:20px; border:1px solid rgba(255,255,255,.16); background:rgba(255,255,255,.07); }
.technical-summary-list strong { display:block; color:var(--secondary--color); font-size:26px; margin-bottom:4px; }
.technical-summary-list span { color:#fff; }

.knowledge-detail-hero { background:#f1f8f8; }
.knowledge-detail-copy > span { color:#77a44b; font-weight:700; margin-bottom:10px; }
.knowledge-detail-copy h2 { margin-bottom:22px; }
.knowledge-lead { font-size:21px; line-height:1.75; color:#476153; }
.knowledge-detail-image { margin:0; overflow:hidden; border-radius:34px 34px 0 0; }
.knowledge-detail-image img { width:100%; height:470px; object-fit:cover; }
.knowledge-facts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:30px; }
.knowledge-fact { padding:17px 16px; background:#fff; border-left:4px solid var(--accent); box-shadow:0 12px 30px rgba(22,76,42,.07); }
.knowledge-fact strong,.knowledge-fact span { display:block; }
.knowledge-fact strong { color:var(--green-color); font-size:18px; margin-bottom:5px; }
.knowledge-fact span { font-size:14px; line-height:1.4; color:#68796e; }
.knowledge-article-section { background:#fff; padding:80px 0 95px; }
.knowledge-article-layout { display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:65px; align-items:start; }
.knowledge-article-block { padding:0 0 32px; margin-bottom:32px; border-bottom:1px solid #e0e9e4; }
.knowledge-article-block:last-child { margin-bottom:0; }
.knowledge-article-block h2 { font-size:34px; margin-bottom:14px; }
.knowledge-article-block p { font-size:19px; line-height:1.8; color:#4e6558; margin:0; }
.knowledge-aside { position:sticky; top:30px; padding:34px; background:#164c2a; color:#fff; border-radius:28px 28px 0 0; }
.knowledge-aside > span { color:var(--secondary--color); font-weight:700; }
.knowledge-aside h3 { color:#fff; margin:12px 0 15px; font-size:28px; }
.knowledge-aside p { color:rgba(255,255,255,.82); line-height:1.7; }
.knowledge-aside a { display:block; color:#fff; padding:12px 0; border-top:1px solid rgba(255,255,255,.15); font-weight:700; }
.knowledge-cta { background:#fff; padding:0 0 95px; }
.knowledge-cta-box { padding:46px 52px; background:#164c2a; color:#fff; display:flex; align-items:center; justify-content:space-between; gap:40px; border-radius:30px 30px 0 0; }
.knowledge-cta-box span { color:var(--secondary--color); font-weight:700; }
.knowledge-cta-box h2 { color:#fff; margin:9px 0 10px; }
.knowledge-cta-box p { color:rgba(255,255,255,.8); margin:0; }

.purchase-page { padding:90px 0 120px; background:#f1f8f8; }
.purchase-intro { max-width:790px; margin:0 auto 55px; text-align:center; }
.purchase-intro span { color:#77a44b; font-weight:700; }
.purchase-intro h2 { margin:10px 0 15px; }
.purchase-intro p { font-size:18px; line-height:1.7; }
.purchase-product { display:flex; gap:15px; align-items:center; padding:20px 0; border-bottom:1px solid #e6e6e6; }
.purchase-product img { width:72px; height:72px; object-fit:contain; background:#f4f8f5; border-radius:14px; }
.purchase-product strong,.purchase-product small { display:block; }
.purchase-product small { margin-top:4px; color:#748077; }
.purchase-select { margin-top:20px; }
.purchase-consent { margin-top:18px; padding-left:26px!important; }
.purchase-consent label { font-size:14px; line-height:1.45; }
.purchase-note { font-size:13px; line-height:1.5; color:#718078; margin:18px 0 0; }

@media only screen and (max-width: 1199px) {
    .header-con .navbar-nav { gap: 22px; }
    .header-action-group { margin-left: 16px; }
    .header-con .navbar-light .navbar-nav .nav-link { font-size:15px; }
    .header-buy-btn a,.header-btn a { padding-left:12px; padding-right:12px; font-size:14px; }
    .knowledge-grid,.knowledge-grid-home { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media only screen and (max-width: 991px) {
    .header-con .navbar-nav > .nav-item > .nav-link::after { top:-12px; }
    .header-action-group { margin:14px 0 8px; flex-wrap:wrap; }
    .header-action-group .generic-btn { margin:0; }
    .header-action-group .generic-btn a { min-width:115px; text-align:center; }
    .knowledge-hub-heading,.technical-summary,.knowledge-article-layout { grid-template-columns:1fr; gap:32px; }
    .product-identity-grid,.benefit-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .knowledge-aside { position:static; }
    .knowledge-detail-image img { height:390px; }
    .knowledge-cta-box { align-items:flex-start; flex-direction:column; }
}
@media only screen and (max-width: 767px) {
    .banner-title .arajel-hero-lead { font-size:20px; line-height:1.45; }
    .knowledge-grid,.knowledge-grid-home,.product-identity-grid,.benefit-grid,.technical-summary-list,.knowledge-facts { grid-template-columns:1fr; }
    .knowledge-hub-heading { margin-bottom:35px; }
    .knowledge-card { min-height:0; }
    .technical-summary { padding:35px 25px; }
    .knowledge-detail-image img { height:300px; }
    .knowledge-article-section { padding:60px 0 70px; }
    .knowledge-article-block h2 { font-size:29px; }
    .knowledge-article-block p { font-size:17px; }
    .knowledge-cta-box { padding:35px 26px; }
}


/* ARAJEL teknik değer şeridi */
.arajel-trust-strip ul { grid-template-columns:repeat(4,minmax(0,1fr)); }
.arajel-trust-strip ul li { min-height:132px; flex-direction:column; gap:8px; padding:25px 20px; }
.arajel-trust-strip strong { font-family:'Noto Sans',sans-serif; color:var(--green-color); font-size:31px; line-height:1; }
.arajel-trust-strip span { max-width:180px; color:#5b6f62; line-height:1.35; font-size:15px; }
@media only screen and (max-width:767px){.arajel-trust-strip ul{grid-template-columns:repeat(2,minmax(0,1fr));}.arajel-trust-strip ul li:nth-child(3){border-left:none;}}

/* ARAJEL kapasite rozeti */
.arajel-about-intro .experience-title { width: 245px; right: 12px; padding: 13px 16px; }
.arajel-about-intro .experience-title span { font-size: 13px; line-height: 14px; padding-top: 2px; }
.arajel-about-intro .experience-value { flex: 0 0 auto; }
@media only screen and (max-width: 575px) { .arajel-about-intro .experience-title { width: 210px; right: 8px; } .arajel-about-intro .experience-title span { font-size: 12px; line-height: 13px; } }

/* Satın alma ürün kimliği */
.purchase-product img { width: 112px; height: 72px; object-fit: contain; padding: 12px; background: var(--green-color); }

/* 2026-07-23 requested refinements */
.header-con .navbar-nav { gap: 27px; }
.header-con .navbar-light .navbar-nav .nav-link { font-size: 14.5px; line-height: 19px; }
.header-con .navbar-nav > .nav-item > .nav-link::after {
    width: 34px; height: 20px; margin-left: -17px; top: -15px;
    background-size: 34px 20px;
}
.header-con .knowledge-dropdown-menu { min-width: 310px; max-height: 72vh; overflow-y: auto; }
.header-con .knowledge-dropdown-menu .dropdown-item { white-space: normal; line-height: 1.35; padding-top: 9px; padding-bottom: 9px; }
.banner-title .hero-line-break { display: block; }
.banner-title .hero-line-break .text-border { display: inline-block; white-space: nowrap; }

/* X temasındaki eski referans/logo bandının ARAJEL satış ve destek kanalları olarak uyarlanması */
.arajel-sales-strip { clear: both; position: relative; z-index: 2; }
.arajel-sales-strip ul { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); align-items:stretch; }
.arajel-sales-strip ul li { width:auto; min-height:126px; padding:0; border-left:1px solid #e2e9e4; }
.arajel-sales-strip ul li:first-child { border-left:none; }
.arajel-sales-strip a { height:100%; min-height:126px; padding:20px 12px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; text-decoration:none!important; transition:.35s ease; }
.arajel-sales-strip a:hover { background:#f0f8e8; transform:translateY(-5px); }
.arajel-sales-strip i { font-size:22px; color:var(--green-color); margin-bottom:9px; }
.arajel-sales-strip strong { display:block; color:var(--primary--color); font-family:'Noto Sans',sans-serif; font-size:20px; line-height:1.05; }
.arajel-sales-strip span { display:block; margin-top:6px; color:#6a796f; font-size:12px; line-height:1.25; }
.home-sales-strip { margin-top: 0; }

/* Satın alma kanalları ve doğrudan sipariş */
html { scroll-behavior:smooth; }
.purchase-channel-section { padding:90px 0 40px; background:#fff; }
.purchase-channel-heading { max-width:790px; margin:0 auto 46px; }
.purchase-channel-heading > span { color:#77a44b; font-weight:700; }
.purchase-channel-heading h2 { margin:10px 0 14px; }
.purchase-channel-heading p { margin:0; color:#5d6e63; font-size:18px; line-height:1.7; }
.purchase-channel-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:25px; }
.purchase-channel-card { min-height:310px; padding:34px 30px 30px; border-radius:30px 30px 0 0; border:3px solid transparent; background:#f4f8f5; display:flex; flex-direction:column; text-decoration:none!important; box-shadow:0 18px 45px rgba(22,76,42,.08); transition:.4s ease; }
.purchase-channel-card:hover { transform:translateY(-10px); box-shadow:0 28px 65px rgba(22,76,42,.16); }
.purchase-channel-card .channel-icon { width:64px; height:64px; border-radius:22px 22px 0 22px; display:flex; align-items:center; justify-content:center; background:#fff; color:var(--green-color); font-size:25px; margin-bottom:22px; }
.purchase-channel-card small { text-transform:uppercase; letter-spacing:.8px; font-weight:700; color:#73847a; }
.purchase-channel-card h3 { margin:8px 0 13px; font-size:31px; }
.purchase-channel-card p { color:#5f6f65; line-height:1.65; margin-bottom:25px; }
.purchase-channel-card b { margin-top:auto; color:var(--green-color); }
.purchase-channel-card b i { margin-left:7px; transition:.3s ease; }
.purchase-channel-card:hover b i { transform:translateX(6px); }
.purchase-channel-card.direct-card { background:#164c2a; border-color:#b7d87a; }
.purchase-channel-card.direct-card .channel-icon { background:#b7d87a; color:#164c2a; }
.purchase-channel-card.direct-card small,.purchase-channel-card.direct-card h3,.purchase-channel-card.direct-card p,.purchase-channel-card.direct-card b { color:#fff; }
.purchase-channel-card.trendyol-card:hover { border-color:#f27a1a; }
.purchase-channel-card.hepsiburada-card:hover { border-color:#ff6000; }
.purchase-page { padding-top:70px; scroll-margin-top:20px; }
.purchase-intro { margin-bottom:48px; }
.direct-order-form { overflow:hidden; }
.direct-purchase-summary { position:sticky; top:25px; }
.fixed-package,.order-price-row { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:16px 0; border-bottom:1px solid #e8ece9; }
.fixed-package span,.order-price-row span { color:#64736a; }
.fixed-package strong,.order-price-row strong { color:var(--primary--color); }
.order-price-row.total-row { padding-top:19px; }
.order-price-row.total-row strong { color:var(--green-color); font-size:24px; }
.purchase-price-note { padding:13px 14px; background:#f4f8f5; font-size:12px; line-height:1.5; color:#67776d; margin:16px 0 18px; }
.purchase-agreements { display:flex; flex-direction:column; gap:11px; }
.agreement-row { padding:13px 14px; border:1px solid #dfe8e2; background:#fff; }
.agreement-row.optional { background:#f8faf9; }
.agreement-check { display:grid; grid-template-columns:18px 1fr; gap:10px; align-items:start; }
.agreement-check input { width:17px; height:17px; margin-top:3px; accent-color:#164c2a; }
.agreement-check label { margin:0; font-size:13px; line-height:1.48; color:#53645a; }
.agreement-row details { margin:8px 0 0 28px; }
.agreement-row summary { cursor:pointer; color:var(--green-color); font-weight:700; font-size:12px; }
.agreement-row details > div { max-height:210px; overflow:auto; margin-top:9px; padding:13px; background:#f3f7f4; border-left:3px solid var(--secondary--color); }
.agreement-row details h4 { font-size:17px; margin-bottom:8px; }
.agreement-row details p { font-size:12px; line-height:1.55; margin-bottom:8px; }
.checkout-sales-strip { margin-top:72px; margin-bottom:0; }

/* Profesyonel teknik bilgiler sayfası */
.technical-overview-section { background:#f1f8f8; }
.technical-lead { max-width:880px; margin:18px auto 0; color:#53695b; font-size:18px; line-height:1.75; }
.technical-spec-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; margin-top:48px; }
.technical-spec-card { min-height:260px; padding:30px; background:#fff; border-radius:28px 28px 0 0; border:3px solid transparent; box-shadow:0 18px 45px rgba(22,76,42,.08); transition:.35s ease; }
.technical-spec-card:hover { transform:translateY(-7px); border-color:var(--secondary--color); }
.technical-spec-card i { width:58px; height:58px; display:flex; align-items:center; justify-content:center; border-radius:19px 19px 0 19px; background:#eff7e6; color:var(--green-color); font-size:23px; margin-bottom:21px; }
.technical-spec-card small,.technical-spec-card strong { display:block; }
.technical-spec-card small { color:#78975d; text-transform:uppercase; letter-spacing:.7px; font-weight:700; margin-bottom:7px; }
.technical-spec-card strong { color:var(--primary--color); font-family:'Noto Sans',sans-serif; font-size:25px; line-height:1.15; }
.technical-spec-card p { margin:12px 0 0; color:#637269; line-height:1.6; }
.technical-performance-section { padding:95px 0; background:#fff; }
.technical-performance-panel { padding:56px; background:#164c2a; color:#fff; border-radius:34px 34px 0 0; display:grid; grid-template-columns:.9fr 1.1fr; gap:55px; position:relative; box-shadow:0 25px 70px rgba(22,76,42,.18); }
.technical-performance-copy > span { color:var(--secondary--color); font-weight:700; }
.technical-performance-copy h2 { color:#fff; margin:12px 0 18px; }
.technical-performance-copy p { color:rgba(255,255,255,.82); line-height:1.75; font-size:17px; }
.technical-data-table { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.technical-data-table > div { padding:18px; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.15); }
.technical-data-table span,.technical-data-table strong { display:block; }
.technical-data-table span { font-size:13px; color:rgba(255,255,255,.68); margin-bottom:5px; }
.technical-data-table strong { color:#fff; font-size:17px; }
.technical-footnote { grid-column:1/-1; margin:0; color:rgba(255,255,255,.65); font-size:12px; }
.technical-dose-section { background:#f1f8f8; }
.dose-table-wrap { margin-top:48px; overflow-x:auto; background:#fff; box-shadow:0 18px 50px rgba(22,76,42,.09); }
.technical-dose-table { width:100%; min-width:850px; border-collapse:collapse; }
.technical-dose-table th { background:#164c2a; color:#fff; padding:19px 22px; text-align:left; }
.technical-dose-table td { padding:20px 22px; border-bottom:1px solid #e4ebe6; color:#596b60; line-height:1.6; vertical-align:top; }
.technical-dose-table tbody tr:hover { background:#f5faef; }
.technical-dose-table td:nth-child(1) { width:22%; }
.technical-dose-table td:nth-child(2) { width:24%; color:var(--green-color); }
.dose-warning { display:flex; gap:18px; align-items:flex-start; margin-top:28px; padding:24px 27px; background:#fff6e3; border-left:5px solid #e7a736; }
.dose-warning i { color:#d59628; font-size:23px; margin-top:3px; }
.dose-warning strong { color:#76531c; }
.dose-warning p { margin:5px 0 0; color:#765f39; line-height:1.65; }
.technical-factors-section { background:#fff; }
.technical-factor-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:22px; margin-top:45px; }
.technical-factor-card { min-height:270px; padding:29px; border:1px solid #e1eae4; border-top:5px solid var(--secondary--color); background:#fff; box-shadow:0 15px 38px rgba(22,76,42,.06); }
.technical-factor-card > span { display:block; color:#b1ce7b; font-size:38px; font-family:'Noto Sans',sans-serif; font-weight:700; }
.technical-factor-card h3 { font-size:24px; margin:11px 0 13px; }
.technical-factor-card p { margin:0; color:#627269; line-height:1.65; }
.technical-step-list { list-style:none; counter-reset:steps; padding:0; margin:25px 0 0; }
.technical-step-list li { counter-increment:steps; position:relative; padding:13px 0 13px 48px; border-bottom:1px solid rgba(255,255,255,.15); }
.technical-step-list li:before { content:counter(steps); position:absolute; left:0; top:12px; width:32px; height:32px; border-radius:50%; background:var(--secondary--color); color:#164c2a; display:flex; align-items:center; justify-content:center; font-weight:700; }
.technical-step-list strong,.technical-step-list span { display:block; }
.technical-step-list strong { color:#fff; }
.technical-step-list span { color:rgba(255,255,255,.75); font-size:14px; margin-top:2px; }
.technical-storage-section { background:#f1f8f8; }
.technical-storage-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; margin-top:45px; }
.technical-storage-grid > div { padding:33px; background:#fff; border-radius:26px 26px 0 0; box-shadow:0 18px 45px rgba(22,76,42,.08); }
.technical-storage-grid i { color:var(--green-color); font-size:27px; margin-bottom:19px; }
.technical-storage-grid h3 { font-size:25px; margin-bottom:12px; }
.technical-storage-grid p { color:#607168; line-height:1.7; margin:0; }
.technical-sales-strip { margin-top:0; }

@media only screen and (max-width:1199px) {
  .header-con .navbar-nav { gap:18px; }
  .header-con .navbar-light .navbar-nav .nav-link { font-size:13px; }
  .header-con .knowledge-dropdown-menu { min-width:280px; }
  .arajel-sales-strip ul { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .arajel-sales-strip ul li:nth-child(4) { border-left:none; }
  .technical-factor-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media only screen and (max-width:991px) {
  .header-con .navbar-nav > .nav-item > .nav-link::after { top:-9px; }
  .header-con .navbar-light .navbar-nav .nav-link { font-size:14px; }
  .header-con .knowledge-dropdown-menu { max-height:none; min-width:100%; }
  .purchase-channel-grid,.technical-spec-grid,.technical-storage-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .purchase-channel-card.direct-card { order:-1; grid-column:1/-1; min-height:260px; }
  .direct-purchase-summary { position:static; }
  .technical-performance-panel { grid-template-columns:1fr; padding:42px 34px; }
}
@media only screen and (max-width:767px) {
  .banner-title .hero-line-break .text-border { font-size:.76em; }
  .arajel-sales-strip ul { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .arajel-sales-strip ul li:nth-child(odd) { border-left:none; }
  .purchase-channel-section { padding:65px 0 25px; }
  .purchase-channel-grid,.technical-spec-grid,.technical-factor-grid,.technical-storage-grid { grid-template-columns:1fr; }
  .purchase-channel-card.direct-card { grid-column:auto; }
  .purchase-page { padding-top:55px; }
  .technical-performance-section { padding:70px 0; }
  .technical-performance-panel { padding:34px 24px; }
  .technical-data-table { grid-template-columns:1fr; }
  .checkout-sales-strip { margin-top:52px; }
}
@media only screen and (max-width:420px) {
  .banner-title .hero-line-break .text-border { font-size:.64em; }
}

/* 2026-07-23 — Menü, mega menü ve ana sayfa yerleşim revizyonu */
.header-con .navbar-nav > .nav-item > .nav-link::after {
    border: 0 !important;
    border-top: 0 !important;
    border-right: 0 !important;
    border-bottom: 0 !important;
    border-left: 0 !important;
}
.banner-con .text-border::after {
    bottom: -16px !important;
    transform: translateX(-50%) !important;
}

@media only screen and (min-width: 992px) {
    .header-con .navbar {
        position: relative;
        padding: 27px 0 16px !important;
    }
    .header-con .navbar-collapse { position: static; }
    .header-con .arajel-main-nav {
        gap: 18px;
        align-items: center;
        position: static;
    }
    .header-con .navbar-light .arajel-main-nav > .nav-item > .nav-link {
        font-size: 13.5px;
        line-height: 18px;
        white-space: nowrap;
        letter-spacing: -.1px;
    }
    .header-con .arajel-main-nav > .nav-item > .nav-link {
        padding-top: 2px !important;
        padding-bottom: 2px !important;
    }
    .header-con .arajel-main-nav > .nav-item > .nav-link::after {
        z-index: 2;
        width: 29px;
        height: 17px;
        margin-left: -14.5px;
        top: -24px;
        background-size: 29px 17px;
    }
    .header-con .arajel-main-nav > .nav-item > .nav-link { z-index: 3; }
    .header-con .knowledge-mega-item { position: static !important; }
    .header-con .knowledge-mega-menu {
        display: block !important;
        width: 100%;
        max-width: 100%;
        max-height: none;
        overflow: visible;
        left: 0 !important;
        right: 0 !important;
        top: calc(100% - 1px) !important;
        padding: 0;
        margin: 0;
        border: 0;
        border-radius: 22px 22px 4px 4px;
        background: #ffffff;
        box-shadow: 0 26px 70px rgba(8, 49, 29, .22);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transform: translateY(12px);
        transition: opacity .25s ease, transform .25s ease, visibility .25s ease;
        z-index: 1100;
    }
    .header-con .knowledge-mega-menu::before {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        top: -24px;
        height: 26px;
        background: transparent;
    }
    .header-con .knowledge-mega-item:hover > .knowledge-mega-menu,
    .header-con .knowledge-mega-item:focus-within > .knowledge-mega-menu,
    .header-con .knowledge-mega-item.show > .knowledge-mega-menu,
    .header-con .knowledge-mega-menu.show {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translateY(0);
    }
    .header-con .mega-menu-intro {
        display: grid;
        grid-template-columns: 170px minmax(280px, .8fr) minmax(360px, 1.2fr);
        gap: 26px;
        align-items: center;
        padding: 23px 28px;
        border-bottom: 1px solid #e3ebe6;
        background: #f2f8f3;
        border-radius: 22px 22px 0 0;
    }
    .header-con .mega-menu-intro > span {
        color: #77a44b;
        font-size: 12px;
        line-height: 1.2;
        font-weight: 800;
        letter-spacing: .8px;
    }
    .header-con .mega-menu-intro h3 {
        margin: 0;
        color: var(--primary--color);
        font-size: 22px;
        line-height: 1.18;
    }
    .header-con .mega-menu-intro p {
        margin: 0;
        color: #5d7064;
        font-size: 14px;
        line-height: 1.55;
    }
    .header-con .mega-menu-grid { margin: 0; padding: 25px 15px 27px; }
    .header-con .mega-menu-column { padding: 0 14px; }
    .header-con .mega-menu-column + .mega-menu-column { border-left: 1px solid #e5ece8; }
    .header-con .mega-menu-column h4 {
        margin: 0 0 13px;
        padding: 0 8px 11px;
        color: var(--green-color);
        font-size: 17px;
        line-height: 1.2;
        border-bottom: 1px solid #e5ece8;
    }
    .header-con .mega-menu-link {
        display: flex;
        gap: 12px;
        align-items: flex-start;
        padding: 10px 8px;
        border-radius: 12px;
        text-decoration: none !important;
        transition: background .22s ease, transform .22s ease;
    }
    .header-con .mega-menu-link:hover {
        background: #f1f8e9;
        transform: translateX(3px);
    }
    .header-con .mega-menu-icon {
        flex: 0 0 32px;
        width: 32px;
        height: 32px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 9px;
        background: #eaf4df;
        color: var(--green-color);
        font-size: 13px;
    }
    .header-con .mega-menu-copy { min-width: 0; }
    .header-con .mega-menu-copy strong,
    .header-con .mega-menu-copy small { display: block; }
    .header-con .mega-menu-copy strong {
        color: var(--primary--color);
        font-size: 14px;
        line-height: 1.25;
        margin-bottom: 3px;
    }
    .header-con .mega-menu-copy small {
        color: #748279;
        font-size: 11.5px;
        line-height: 1.35;
    }
    .header-con .purchase-nav-item > .nav-link,
    .header-con .contact-nav-item > .nav-link { font-weight: 700; }
}

/* FAQ bitki görselleri ile teknik değer kutularının çakışmasını önler. */
.home-faq-section + .arajel-trust-strip,
.arajel-trust-strip {
    clear: both;
    margin-top: 0 !important;
    padding: 76px 0 88px;
    background: #d6e0ea;
    overflow: hidden;
}
.home-faq-section + .arajel-trust-strip { padding-top: 92px; }
.home-faq-section .padding-bottom { padding-bottom: 155px; }

/* Bilgi Merkezi açıklaması başlığın altında, tek ve dengeli bir kolon olarak yer alır. */
.knowledge-hub-section .padding-top { padding-top: 112px; }
.knowledge-hub-section .padding-bottom { padding-bottom: 118px; }
.knowledge-hub-heading {
    display: block;
    max-width: 820px;
    margin: 0 auto 54px;
    text-align: center;
}
.knowledge-hub-heading .generic-title {
    width: 100%;
    margin: 0;
    text-align: center;
}
.knowledge-hub-subtitle {
    max-width: 760px;
    margin: 20px auto 0 !important;
    color: #355e48;
    font-size: 18px;
    line-height: 1.7;
}

/* İlk X temasındaki 4 + 4 referans/logo düzeni footer üstünde yeniden kullanılır. */
.arajel-client-logos {
    clear: both;
    margin-top: 0 !important;
    padding: 92px 0 0;
    background: #ffffff;
    z-index: 3;
}
.knowledge-hub-section + .arajel-client-logos { padding-top: 132px; }
.arajel-client-logos ul { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.arajel-client-logos ul li { min-height: 122px; }
.arajel-client-logos ul li img {
    max-width: 128px;
    max-height: 58px;
    width: auto;
    height: auto;
    object-fit: contain;
    filter: grayscale(1);
    opacity: .72;
    transition: filter .3s ease, opacity .3s ease, transform .3s ease;
}
.arajel-client-logos ul li:hover img {
    filter: grayscale(0);
    opacity: 1;
    transform: scale(1.04);
}

@media only screen and (max-width: 1199px) and (min-width: 992px) {
    .header-con .arajel-main-nav { gap: 11px; }
    .header-con .navbar-light .arajel-main-nav > .nav-item > .nav-link { font-size: 12.5px; }
    .navbar-brand img { max-width: 145px; }
    .header-con .social-icon { margin-left: 10px; }
}

@media only screen and (max-width: 991px) {
    .header-con .navbar { padding: 13px 0 !important; }
    .header-con .arajel-main-nav { gap: 5px; }
    .header-con .arajel-main-nav > .nav-item > .nav-link::after { display: none; }
    .header-con .knowledge-mega-menu {
        width: 100%;
        max-height: 58vh;
        overflow-y: auto;
        padding: 12px 15px 16px;
        border: 0;
        border-radius: 0;
        box-shadow: none;
        background: rgba(255,255,255,.08);
    }
    .header-con .mega-menu-intro { display: none; }
    .header-con .mega-menu-grid { margin: 0; }
    .header-con .mega-menu-column { padding: 0; }
    .header-con .mega-menu-column h4 {
        margin: 10px 0 5px;
        color: var(--secondary--color);
        font-size: 15px;
    }
    .header-con .mega-menu-link {
        display: block;
        padding: 7px 0;
        color: #fff;
        text-decoration: none !important;
    }
    .header-con .mega-menu-icon,
    .header-con .mega-menu-copy small { display: none; }
    .header-con .mega-menu-copy strong { color: #fff; font-size: 14px; }
    .banner-con .text-border::after { bottom: -10px !important; }
    .home-faq-section + .arajel-trust-strip,
    .arajel-trust-strip { padding: 58px 0 70px; }
    .home-faq-section + .arajel-trust-strip { padding-top: 68px; }
    .knowledge-hub-section .padding-top { padding-top: 85px; }
    .knowledge-hub-section .padding-bottom { padding-bottom: 90px; }
    .arajel-client-logos { padding-top: 72px; }
    .knowledge-hub-section + .arajel-client-logos { padding-top: 94px; }
}

@media only screen and (max-width: 767px) {
    .home-faq-section .padding-bottom { padding-bottom: 125px; }
    .knowledge-hub-subtitle { font-size: 16px; line-height: 1.6; }
    .arajel-client-logos ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .arajel-client-logos ul li:nth-child(odd) { border-left: none; }
    .arajel-client-logos ul li { min-height: 105px; padding: 22px 10px; }
    .arajel-client-logos ul li img { max-width: 105px; max-height: 48px; }
}

/* 2026-07-23 — X tema menü tipografisi ve profesyonel tam genişlik mega menü düzeltmesi */
@media only screen and (min-width: 992px) {
    .header-con .navbar {
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        padding: 27px 0 16px !important;
    }
    .header-con .navbar-brand {
        flex: 0 0 auto;
        margin-right: 30px;
    }
    .header-con .navbar-collapse {
        display: flex !important;
        align-items: center;
        min-width: 0;
        position: static;
    }
    .header-con .arajel-main-nav {
        display: flex;
        align-items: center;
        gap: 24px;
        margin-left: auto !important;
        position: static;
    }
    .header-con .navbar-light .arajel-main-nav > .nav-item > .nav-link {
        /* X temasının orijinal masaüstü menü ölçüsü */
        font-family: 'Noto Sans', sans-serif;
        font-size: 18px;
        line-height: 30px;
        font-weight: 500;
        letter-spacing: 0;
        white-space: nowrap;
        padding: 2px 0 !important;
    }
    .header-con .arajel-main-nav > .nav-item > .nav-link::after {
        width: 29px;
        height: 17px;
        margin-left: -14.5px;
        top: -23px;
        background-size: 29px 17px;
    }

    /* Satın alma ve iletişim, X temasındaki header buton formuna geri döner. */
    .header-con .header-action-group {
        flex: 0 0 auto;
        gap: 9px;
        margin-left: 24px;
    }
    .header-con .header-action-group .header-btn {
        margin: 0;
    }
    .header-con .header-action-group .header-btn a {
        font-size: 15px;
        line-height: 16px;
        font-weight: 500;
        padding: 12px 14px;
        white-space: nowrap;
    }
    .header-con .header-action-group .active-action a {
        box-shadow: 0 0 0 2px rgba(255,255,255,.22);
    }

    /* Sosyal ikonlar menü bütünlüğünü bozmayacak daha kompakt ölçüdedir. */
    .header-con .social-icon {
        flex: 0 0 auto;
        margin-left: 14px;
    }
    .header-con .social-icon ul { gap: 7px; }
    .header-con .social-icon ul li a i {
        width: 31px;
        height: 31px;
        font-size: 11px;
    }

    /* Mega menü ekranın sağ ve sol sınırına kadar açılır. */
    .header-con .knowledge-mega-item { position: static !important; }
    .header-con .knowledge-mega-menu {
        display: block !important;
        width: 100%;
        max-width: 100%;
        left: 0 !important;
        right: 0 !important;
        top: calc(100% - 1px) !important;
        margin: 0;
        padding: 0;
        border: 0;
        border-radius: 0;
        background: #fff;
        box-shadow: 0 28px 68px rgba(8,49,29,.20);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transform: translateY(12px);
        transition: opacity .24s ease, transform .24s ease, visibility .24s ease;
        z-index: 1100;
        font-family: 'Noto Sans', sans-serif;
    }
    .header-con .knowledge-mega-menu::before {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        top: -24px;
        height: 26px;
        background: transparent;
    }
    .header-con .knowledge-mega-item:hover > .knowledge-mega-menu,
    .header-con .knowledge-mega-item:focus-within > .knowledge-mega-menu,
    .header-con .knowledge-mega-item.show > .knowledge-mega-menu,
    .header-con .knowledge-mega-menu.show {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translateY(0);
    }
    .header-con .mega-menu-intro {
        display: grid;
        grid-template-columns: 180px minmax(300px,.78fr) minmax(360px,1.22fr);
        gap: 30px;
        align-items: center;
        padding-top: 22px;
        padding-bottom: 22px;
        padding-left: max(28px, calc((100vw - 1560px) / 2));
        padding-right: max(28px, calc((100vw - 1560px) / 2));
        border-bottom: 1px solid #e4ece7;
        border-radius: 0;
        background: #f3f8f4;
    }
    .header-con .mega-menu-intro > span,
    .header-con .mega-menu-intro h3,
    .header-con .mega-menu-column h4,
    .header-con .mega-menu-copy strong {
        font-family: 'Noto Sans', sans-serif;
        font-weight: 500;
    }
    .header-con .mega-menu-intro > span {
        color: #719e48;
        font-size: 12px;
        line-height: 1.3;
        letter-spacing: .65px;
    }
    .header-con .mega-menu-intro h3 {
        margin: 0;
        color: var(--primary--color);
        font-size: 21px;
        line-height: 1.28;
    }
    .header-con .mega-menu-intro p {
        margin: 0;
        color: #5d7064;
        font-size: 14px;
        line-height: 1.55;
        font-weight: 400;
    }
    .header-con .mega-menu-grid {
        margin: 0;
        padding-top: 25px;
        padding-bottom: 28px;
        padding-left: max(18px, calc((100vw - 1560px) / 2));
        padding-right: max(18px, calc((100vw - 1560px) / 2));
    }
    .header-con .mega-menu-column { padding: 0 18px; }
    .header-con .mega-menu-column + .mega-menu-column {
        border-left: 1px solid #e5ece8;
    }
    .header-con .mega-menu-column h4 {
        margin: 0 0 12px;
        padding: 0 8px 11px;
        color: var(--green-color);
        font-size: 16px;
        line-height: 1.3;
        border-bottom: 1px solid #e5ece8;
    }
    .header-con .mega-menu-link {
        display: flex;
        gap: 12px;
        align-items: flex-start;
        padding: 10px 8px;
        border-radius: 10px;
        text-decoration: none !important;
        transition: background .22s ease, transform .22s ease;
    }
    .header-con .mega-menu-link:hover {
        background: #f1f8e9;
        transform: translateX(3px);
    }
    .header-con .mega-menu-copy strong {
        color: var(--primary--color);
        font-size: 14px;
        line-height: 1.3;
        margin-bottom: 3px;
    }
    .header-con .mega-menu-copy small {
        color: #748279;
        font-size: 11.5px;
        line-height: 1.4;
        font-weight: 400;
    }
}

/* Orta masaüstü çözünürlüklerde X tipografisinin oranı korunur, taşma engellenir. */
@media only screen and (min-width: 1200px) and (max-width: 1539px) {
    .header-con .navbar-brand { margin-right: 20px; }
    .navbar-brand img { max-width: 145px; }
    .header-con .arajel-main-nav { gap: 16px; }
    .header-con .navbar-light .arajel-main-nav > .nav-item > .nav-link {
        font-size: 17px;
    }
    .header-con .header-action-group { gap: 7px; margin-left: 17px; }
    .header-con .header-action-group .header-btn a {
        font-size: 13.5px;
        padding: 11px 11px;
    }
    .header-con .social-icon { margin-left: 9px; }
    .header-con .social-icon ul li a i {
        width: 28px;
        height: 28px;
        font-size: 10px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .header-con .navbar-brand { margin-right: 14px; }
    .navbar-brand img { max-width: 128px; }
    .header-con .arajel-main-nav { gap: 10px; }
    .header-con .navbar-light .arajel-main-nav > .nav-item > .nav-link {
        font-size: 14px;
        line-height: 24px;
    }
    .header-con .header-action-group { gap: 6px; margin-left: 12px; }
    .header-con .header-action-group .header-btn a {
        font-size: 12px;
        padding: 10px 8px;
    }
    .header-con .social-icon { display: none; }
    .header-con .arajel-main-nav > .nav-item > .nav-link::after {
        top: -20px;
    }
}

@media only screen and (max-width: 991px) {
    .header-con .header-action-group {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
        margin: 13px 15px 18px;
    }
    .header-con .header-action-group .header-btn { margin: 0; }
    .header-con .header-action-group .header-btn a {
        display: block;
        width: 100%;
        padding: 13px 10px;
        font-size: 14px;
        text-align: center;
    }
}

/* 2026-07-29 — Ana sayfa referans şeridi, bölüm dengesi ve mobil footer */
.home-stats-strip {
    display: flex;
    align-items: center;
    min-height: 270px;
    padding: 64px 0 !important;
}
.home-stats-strip .container,
.home-stats-strip ul { width: 100%; }
.home-stats-strip ul {
    max-width: 1140px;
    margin: 0 auto !important;
}
.home-knowledge-section .padding-top { padding-top: 96px; }
.home-knowledge-section .padding-bottom { padding-bottom: 220px; }
.knowledge-hub-section + .home-client-logos {
    margin-top: -144px !important;
    padding: 0 !important;
    background: transparent;
    z-index: 4;
}
.home-client-logos + .footer-con { margin-top: -154px; }

@media only screen and (max-width: 991px) {
    .home-stats-strip {
        min-height: 240px;
        padding: 52px 0 !important;
    }
    .home-knowledge-section .padding-top { padding-top: 84px; }
    .home-knowledge-section .padding-bottom { padding-bottom: 190px; }
    .knowledge-hub-section + .home-client-logos {
        margin-top: -118px !important;
        padding: 0 !important;
    }
}

@media only screen and (max-width: 767px) {
    body > header,
    body > section,
    body > div,
    body > footer {
        max-width: 100%;
    }
    .container {
        width: 100%;
        padding-left: 20px;
        padding-right: 20px;
    }
    .row {
        margin-left: -10px;
        margin-right: -10px;
    }
    .row > [class*="col-"] {
        padding-left: 10px;
        padding-right: 10px;
    }
    .wrapper,
    .banner-inner-con,
    .banner-img-box1,
    .banner-img-box2,
    .generic-box,
    .generic-box-img,
    .generic-box-content,
    .faq-box,
    .knowledge-grid,
    .knowledge-card,
    .product-item,
    .team-box-item,
    .blog-box,
    .service-item,
    .footer-inner-con,
    .site-map {
        min-width: 0;
        max-width: 100%;
    }
    .banner-img-box1 img,
    .banner-img-box2 img,
    .sub-banner-img img {
        width: auto;
        max-width: 100%;
        height: auto;
    }

    .home-faq-section .padding-bottom { padding-bottom: 92px; }
    .home-stats-strip {
        min-height: 0;
        padding: 58px 0 !important;
    }
    .home-stats-strip ul {
        max-width: 520px;
        border-radius: 24px;
    }
    .home-stats-strip ul li {
        min-width: 0;
        padding: 22px 12px;
    }
    .home-stats-strip strong { font-size: 27px; }
    .home-stats-strip span {
        max-width: 150px;
        font-size: 13px;
    }
    .home-knowledge-section .padding-top { padding-top: 82px; }
    .home-knowledge-section .padding-bottom { padding-bottom: 118px; }

    /* Mobilde referans kartı footer dokusu içinde, beyaz ara bant olmadan devam eder. */
    .knowledge-hub-section + .home-client-logos {
        margin-top: 0 !important;
        padding: 68px 0 0 !important;
        background: url('../images/footer-bg-img.jpg') no-repeat center top;
        background-size: cover;
    }
    .home-client-logos + .footer-con {
        margin-top: 0 !important;
        padding-top: 64px !important;
    }
    .home-client-logos ul {
        border-radius: 24px;
        box-shadow: 0 22px 55px rgba(4, 37, 22, .24);
    }

    .footer-con {
        margin-top: 0;
        padding: 68px 0 42px;
        background-position: center top;
    }
    .footer-inner-con {
        display: grid;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 0 !important;
        text-align: left !important;
    }
    .footer-inner-con .site-map {
        display: block !important;
        grid-column: 1 !important;
        min-width: 0;
        width: 100%;
        margin: 0;
        padding: 27px 0;
        border-bottom: 1px solid rgba(255, 255, 255, .16);
    }
    .footer-inner-con .site-map:first-child { padding-top: 0; }
    .footer-inner-con .site-map:last-child {
        display: block !important;
        padding-bottom: 0;
        border-bottom: 0;
    }
    .footer-content {
        grid-column: 1 !important;
        margin: 0 !important;
        text-align: center;
    }
    .footre-logo { display: block; }
    .footre-logo figure { margin-bottom: 20px; }
    .footer-content p,
    .footer-content span {
        max-width: 540px;
        margin: 0 auto 16px;
        padding: 0 !important;
        font-size: 15px;
        line-height: 1.65;
    }
    .footer-social-con ul {
        justify-content: center;
        flex-wrap: wrap;
        gap: 16px;
    }
    .footer-link,
    .contact-info { text-align: left !important; }
    .site-map h4 {
        padding-top: 0;
        margin-bottom: 17px;
        font-size: 21px;
        line-height: 1.3;
    }
    .footer-link ul li { margin-bottom: 10px; }
    .site-map ul li a {
        font-size: 15px;
        line-height: 1.45;
    }
    .contact-info ul li {
        margin-bottom: 14px;
        padding-right: 0;
        overflow-wrap: anywhere;
    }
    .footer-slider {
        width: 100%;
        max-width: 420px;
        margin: 0 auto;
    }
    .footer-con .carousel-control-prev { left: 10px; }
    .footer-con .carousel-control-next { right: 10px; }
}

@media only screen and (max-width: 475px) {
    .container {
        padding-left: 17px;
        padding-right: 17px;
    }
    .home-stats-strip { padding: 48px 0 !important; }
    .home-stats-strip ul { grid-template-columns: 1fr !important; }
    .home-stats-strip ul li {
        min-height: 104px;
        border-left: 0 !important;
        border-bottom: 1px solid #e0e8eb;
    }
    .home-stats-strip ul li:last-child { border-bottom: 0; }
    .home-knowledge-section .padding-bottom { padding-bottom: 105px; }
    .knowledge-hub-section + .home-client-logos { padding-top: 56px !important; }
    .home-client-logos + .footer-con { padding-top: 54px !important; }
    .footer-con { padding-bottom: 34px; }
    .footer-inner-con .site-map { padding: 24px 0; }
    .footer-content p,
    .footer-content span {
        font-size: 14px;
        line-height: 1.6;
    }
}

/* =========================================================
   ARAJEL 500 g - Profesyonel sipariş / fatura formu (2026-08-20)
   ========================================================= */
.purchase-professional { --purchase-green:#164c2a; --purchase-accent:#b7d87a; --purchase-soft:#f4f8f5; --purchase-line:#dfe9e2; --purchase-text:#20372a; --purchase-muted:#6b7c71; --purchase-error:#c43c3c; --purchase-success:#2f8b55; background:linear-gradient(180deg,#f4f9f6 0%,#eef7f2 100%); padding-bottom:110px; }
.purchase-professional .purchase-intro { max-width:900px; }
.purchase-professional .purchase-intro h2 { font-size:42px; }
.purchase-intro-badges { display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin-top:24px; }
.purchase-intro-badges span { display:inline-flex; align-items:center; gap:8px; padding:9px 14px; border:1px solid #dce9df; border-radius:999px; background:#fff; color:#53675a; font-size:13px; font-weight:600; box-shadow:0 8px 24px rgba(22,76,42,.05); }
.purchase-intro-badges span i { color:var(--purchase-green); }
.purchase-checkout-grid { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(340px,.72fr); gap:30px; align-items:start; }
.purchase-form-card,.purchase-summary-card { background:#fff; border:1px solid rgba(22,76,42,.08); box-shadow:0 24px 70px rgba(22,76,42,.10); }
.purchase-form-card { border-radius:30px 30px 4px 4px; overflow:hidden; }
.purchase-card-heading { display:flex; align-items:flex-start; gap:18px; padding:30px 32px; background:linear-gradient(135deg,#164c2a 0%,#1f6038 100%); color:#fff; }
.purchase-card-heading.compact { margin:-28px -30px 26px; padding:25px 30px; }
.purchase-heading-icon { width:54px; height:54px; flex:0 0 54px; display:flex; align-items:center; justify-content:center; background:var(--purchase-accent); color:var(--purchase-green); border-radius:18px 18px 4px 18px; font-size:21px; box-shadow:0 10px 24px rgba(0,0,0,.12); }
.purchase-card-heading > div:last-child > span { display:block; color:#d7ecae; font-size:12px; font-weight:800; letter-spacing:.9px; text-transform:uppercase; margin:2px 0 5px; }
.purchase-card-heading h3 { color:#fff; margin:0 0 5px; font-size:27px; }
.purchase-card-heading p { margin:0; color:rgba(255,255,255,.72); line-height:1.55; font-size:14px; }
.purchase-form-section { padding:30px; border-bottom:1px solid #edf2ef; }
.purchase-form-section.last-section { border-bottom:none; }
.purchase-section-title { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:22px; }
.purchase-section-title span { color:var(--purchase-text); font-family:'Noto Sans',sans-serif; font-size:24px; font-weight:700; }
.purchase-section-title small { color:#89968e; font-size:12px; }
.purchase-fields-grid { display:grid; gap:18px; }
.purchase-fields-grid.two-col { grid-template-columns:repeat(2,minmax(0,1fr)); }
.purchase-fields-grid .full-span { grid-column:1/-1; }
.purchase-field { min-width:0; }
.purchase-field label,.choice-group-label { display:flex; align-items:center; gap:6px; margin:0 0 8px; color:#344b3d; font-size:13px; font-weight:700; }
.purchase-field label b,.choice-group-label b,.agreement-check-pro b { color:var(--purchase-error); }
.purchase-field label em { margin-left:auto; color:#8c9991; font-size:10px; font-style:normal; font-weight:600; text-transform:uppercase; letter-spacing:.35px; }
.purchase-input-wrap { position:relative; }
.purchase-input-wrap > i { position:absolute; z-index:2; left:15px; top:50%; transform:translateY(-50%); color:#8ca097; font-size:14px; pointer-events:none; transition:.25s ease; }
.purchase-input-wrap.textarea-wrap > i { top:18px; transform:none; }
.purchase-professional .purchase-control { width:100%; min-height:50px; height:50px; padding:10px 15px 10px 42px!important; border:1.5px solid #dbe5df!important; border-radius:12px!important; background:#fbfdfc!important; color:#213a2b!important; font-size:14px!important; line-height:1.4; outline:none; box-shadow:none!important; transition:border-color .22s ease,box-shadow .22s ease,background .22s ease; }
.purchase-professional textarea.purchase-control { height:auto; min-height:104px; resize:vertical; padding-top:14px!important; }
.purchase-professional .purchase-control:focus { border-color:#7aa25d!important; background:#fff!important; box-shadow:0 0 0 4px rgba(122,162,93,.12)!important; }
.purchase-field.is-checking .purchase-control { border-color:#d3b24f!important; background:#fffcf2!important; }
.purchase-field.is-valid .purchase-control,.purchase-choice-scope.is-valid .invoice-choice,.purchase-choice-scope.is-valid .payment-choice { border-color:var(--purchase-success)!important; background:#f7fcf9!important; box-shadow:0 0 0 3px rgba(47,139,85,.08)!important; }
.purchase-field.is-valid .purchase-input-wrap > i { color:var(--purchase-success); }
.purchase-field.is-invalid .purchase-control,.purchase-choice-scope.is-invalid .invoice-choice,.purchase-choice-scope.is-invalid .payment-choice { border-color:var(--purchase-error)!important; background:#fff9f9!important; box-shadow:0 0 0 3px rgba(196,60,60,.07)!important; }
.purchase-field.is-invalid .purchase-input-wrap > i { color:var(--purchase-error); }
.field-feedback { min-height:17px; margin-top:6px; font-size:11.5px; line-height:1.35; color:#7d8c83; }
.validation-scope.is-checking > .field-feedback { color:#9a7c20; }
.validation-scope.is-valid > .field-feedback { color:var(--purchase-success); }
.validation-scope.is-invalid > .field-feedback { color:var(--purchase-error); }
.validation-scope.is-valid > .field-feedback::before,.validation-scope.is-invalid > .field-feedback::before { font-family:'Font Awesome 5 Free'; font-weight:900; margin-right:5px; }
.validation-scope.is-valid > .field-feedback::before { content:'\f058'; }
.validation-scope.is-invalid > .field-feedback::before { content:'\f06a'; }
.invoice-section { background:#fbfdfc; }
.choice-group-label { margin-bottom:11px; }
.invoice-choice-grid,.payment-choice-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.invoice-choice,.payment-choice { position:relative; display:grid; grid-template-columns:44px 1fr 20px; gap:11px; align-items:center; min-height:78px; margin:0; padding:13px 14px; border:1.5px solid #dbe5df; border-radius:14px; background:#fff; cursor:pointer; transition:.25s ease; }
.invoice-choice:hover,.payment-choice:hover { border-color:#a9c58c; transform:translateY(-1px); }
.invoice-choice input,.payment-choice input { position:absolute; opacity:0; pointer-events:none; }
.choice-icon { width:44px; height:44px; display:flex; align-items:center; justify-content:center; border-radius:12px; background:#eff6f1; color:var(--purchase-green); font-size:16px; }
.invoice-choice strong,.invoice-choice small,.payment-choice strong,.payment-choice small { display:block; }
.invoice-choice strong,.payment-choice strong { color:#2b4334; font-size:14px; margin-bottom:2px; }
.invoice-choice small,.payment-choice small { color:#819087; font-size:11px; line-height:1.3; }
.choice-check { width:20px; height:20px; border-radius:50%; display:flex; align-items:center; justify-content:center; border:1.5px solid #ccd9d1; color:transparent; font-size:9px; transition:.2s ease; }
.invoice-choice:has(input:checked),.payment-choice:has(input:checked) { border-color:var(--purchase-green); background:#f5faf7; box-shadow:0 0 0 3px rgba(22,76,42,.07); }
.invoice-choice:has(input:checked) .choice-check,.payment-choice:has(input:checked) .choice-check { background:var(--purchase-green); border-color:var(--purchase-green); color:#fff; }
.invoice-choice:has(input:checked) .choice-icon,.payment-choice:has(input:checked) .choice-icon { background:#dcefcf; }
.conditional-panel { margin-top:18px; padding:20px; border:1px solid #dce8e0; border-left:4px solid var(--purchase-accent); border-radius:14px; background:#fff; animation:purchaseReveal .28s ease both; }
.conditional-panel[hidden] { display:none!important; }
@keyframes purchaseReveal { from { opacity:0; transform:translateY(-5px); } to { opacity:1; transform:translateY(0); } }
.conditional-panel-head { display:flex; gap:11px; align-items:center; margin-bottom:17px; padding-bottom:13px; border-bottom:1px solid #edf2ef; color:var(--purchase-green); }
.conditional-panel-head > i { width:34px; height:34px; display:flex; align-items:center; justify-content:center; background:#edf6e7; border-radius:10px; }
.conditional-panel-head strong,.conditional-panel-head small { display:block; }
.conditional-panel-head strong { color:#2b4334; font-size:14px; }
.conditional-panel-head small { color:#87948d; font-size:11px; margin-top:2px; }
.billing-toggle-scope { margin-top:18px; }
.professional-checkbox { position:relative; display:grid; grid-template-columns:22px 1fr; gap:11px; align-items:start; margin:0; cursor:pointer; }
.professional-checkbox input { position:absolute; opacity:0; pointer-events:none; }
.custom-check { width:20px; height:20px; margin-top:1px; display:flex; align-items:center; justify-content:center; border:1.5px solid #bccbc2; border-radius:6px; background:#fff; color:transparent; font-size:9px; transition:.2s ease; }
.professional-checkbox input:checked + .custom-check { background:var(--purchase-green); border-color:var(--purchase-green); color:#fff; }
.billing-toggle { padding:15px 16px; border:1.5px solid #dce7e0; border-radius:13px; background:#f7fbf8; transition:.2s ease; }
.billing-toggle:hover { border-color:#b6cbbd; }
.billing-toggle span:last-child strong,.billing-toggle span:last-child small { display:block; }
.billing-toggle span:last-child strong { color:#304738; font-size:13px; }
.billing-toggle span:last-child small { color:#829087; font-size:11px; margin-top:2px; }
.billing-toggle-scope.is-valid .billing-toggle { border-color:var(--purchase-success); }
.order-note-field { margin-top:18px; }
.purchase-summary-card { position:sticky; top:24px; border-radius:28px 28px 4px 4px; overflow:hidden; padding:0 24px 24px; }
.summary-topbar { margin:0 -24px; padding:22px 24px; background:var(--purchase-green); color:#fff; display:flex; justify-content:space-between; gap:12px; align-items:center; }
.summary-topbar > div span,.summary-topbar > div small { display:block; }
.summary-topbar > div span { font-family:'Noto Sans',sans-serif; font-size:23px; font-weight:700; }
.summary-topbar > div small { color:rgba(255,255,255,.66); font-size:11px; margin-top:2px; }
.summary-secure { display:inline-flex; align-items:center; gap:6px; padding:7px 9px; border:1px solid rgba(255,255,255,.18); background:rgba(255,255,255,.08); border-radius:999px; color:#dcefb9; font-size:10px; font-weight:700; white-space:nowrap; }
.summary-product { display:grid; grid-template-columns:86px 1fr; gap:14px; align-items:center; padding:22px 0 17px; border-bottom:1px solid #e9efeb; }
.summary-product-image { height:76px; display:flex; align-items:center; justify-content:center; background:linear-gradient(145deg,#174e2b,#23633a); border-radius:18px 18px 4px 18px; padding:12px; }
.summary-product-image img { width:100%; height:100%; object-fit:contain; filter:brightness(0) invert(1); }
.summary-product > div:last-child span,.summary-product > div:last-child strong,.summary-product > div:last-child small { display:block; }
.summary-product > div:last-child span { color:#7f9e62; font-size:10px; font-weight:800; letter-spacing:.7px; }
.summary-product > div:last-child strong { color:#243d2d; font-size:14px; line-height:1.35; margin:3px 0; }
.summary-product > div:last-child small { color:#849188; font-size:10.5px; line-height:1.4; }
.summary-package-badge { display:flex; justify-content:space-between; align-items:center; margin:14px 0; padding:11px 12px; background:#f1f7f3; border-radius:10px; color:#65766c; font-size:12px; }
.summary-package-badge span { display:flex; gap:7px; align-items:center; }
.summary-package-badge i { color:var(--purchase-green); }
.summary-package-badge strong { color:var(--purchase-green); }
.summary-quantity-field { margin-bottom:12px; }
.quantity-stepper { display:grid; grid-template-columns:44px 1fr 44px; border:1.5px solid #dbe5df; border-radius:12px; overflow:hidden; background:#fff; }
.quantity-stepper .purchase-control { border:0!important; border-left:1px solid #e5ece8!important; border-right:1px solid #e5ece8!important; border-radius:0!important; padding:5px!important; min-height:44px; height:44px; text-align:center; font-weight:700; background:#fff!important; }
.quantity-stepper input[type=number]::-webkit-inner-spin-button,.quantity-stepper input[type=number]::-webkit-outer-spin-button { -webkit-appearance:none; margin:0; }
.quantity-btn { border:0; background:#f6faf7; color:var(--purchase-green); cursor:pointer; transition:.2s ease; }
.quantity-btn:hover { background:#eaf4ec; }
.summary-quantity-field.is-valid .quantity-stepper { border-color:var(--purchase-success); box-shadow:0 0 0 3px rgba(47,139,85,.08); }
.summary-quantity-field.is-invalid .quantity-stepper { border-color:var(--purchase-error); box-shadow:0 0 0 3px rgba(196,60,60,.07); }
.summary-price-box { border-top:1px solid #e8eeea; border-bottom:1px solid #e8eeea; padding:3px 0; }
.purchase-professional .order-price-row { padding:11px 0; border:0; }
.purchase-professional .order-price-row.total-row { margin-top:2px; padding-top:13px; border-top:1px dashed #d8e3dc; }
.purchase-professional .order-price-row.total-row strong { font-size:23px; }
.summary-info-list { display:grid; gap:8px; margin:15px 0; }
.summary-info-list > div { display:grid; grid-template-columns:32px 1fr; gap:9px; align-items:center; padding:9px 10px; border:1px solid #edf1ee; border-radius:10px; background:#fbfdfc; }
.summary-info-list > div > i { width:32px; height:32px; display:flex; align-items:center; justify-content:center; border-radius:9px; background:#edf6e8; color:var(--purchase-green); font-size:12px; }
.summary-info-list strong,.summary-info-list small { display:block; }
.summary-info-list strong { color:#344a3c; font-size:11px; }
.summary-info-list small { color:#88948d; font-size:9.5px; margin-top:1px; }
.professional-agreements { gap:8px; }
.professional-agreements .agreement-row { padding:11px 12px; border-radius:10px; border:1.5px solid #e0e8e3; }
.professional-agreements .agreement-row.is-valid { border-color:var(--purchase-success); background:#f8fcf9; }
.professional-agreements .agreement-row.is-invalid { border-color:var(--purchase-error); background:#fff9f9; }
.agreement-check-pro { grid-template-columns:20px 1fr; gap:8px; }
.agreement-check-pro > span:last-child { color:#596960; font-size:10.5px; line-height:1.42; }
.agreement-check-pro > span:last-child strong { color:#344b3d; }
.professional-agreements .field-feedback { margin:5px 0 0 28px; min-height:0; font-size:9.7px; }
.professional-agreements .agreement-row details { margin:7px 0 0 28px; }
.professional-agreements .agreement-row summary { font-size:10px; }
.professional-agreements .agreement-row details > div { max-height:180px; font-size:11px; }
.purchase-form-status { display:none; gap:9px; align-items:flex-start; margin-top:14px; padding:11px 12px; border-radius:10px; font-size:10.5px; line-height:1.45; }
.purchase-form-status:not(:empty) { display:flex; }
.purchase-form-status.checking { background:#fff8e5; color:#81661e; border:1px solid #eedc9c; }
.purchase-form-status.error { background:#fff4f4; color:#a32f2f; border:1px solid #efc4c4; }
.purchase-form-status.success { background:#f0faf4; color:#287b4a; border:1px solid #b9dfc9; }
.professional-submit { width:100%; min-height:52px; margin-top:14px; display:flex; align-items:center; justify-content:center; gap:10px; border:0!important; border-radius:12px!important; background:linear-gradient(135deg,#164c2a,#25683d)!important; color:#fff!important; font-size:13px!important; font-weight:800!important; letter-spacing:.2px; box-shadow:0 12px 28px rgba(22,76,42,.22); transition:.25s ease; }
.professional-submit:hover { transform:translateY(-2px); box-shadow:0 16px 34px rgba(22,76,42,.28); }
.professional-submit:disabled { opacity:.65; cursor:not-allowed; transform:none; }
.professional-submit.is-loading i { animation:purchaseArrowPulse .8s ease infinite alternate; }
@keyframes purchaseArrowPulse { to { transform:translateX(4px); } }
.purchase-professional .purchase-note { display:flex; gap:7px; align-items:flex-start; margin-top:12px; padding:10px 11px; background:#f7faf8; border-radius:9px; font-size:9.8px; line-height:1.45; }
.purchase-professional .purchase-note i { margin-top:2px; color:#779365; }

@media only screen and (max-width:1199px) {
  .purchase-checkout-grid { grid-template-columns:minmax(0,1.4fr) minmax(310px,.72fr); gap:22px; }
  .purchase-form-section { padding:26px; }
  .purchase-card-heading { padding:27px 28px; }
}
@media only screen and (max-width:991px) {
  .purchase-checkout-grid { grid-template-columns:1fr; }
  .purchase-summary-card { position:static; max-width:none; }
  .purchase-professional .purchase-intro h2 { font-size:36px; }
}
@media only screen and (max-width:767px) {
  .purchase-professional { padding-top:55px; padding-bottom:75px; }
  .purchase-professional .purchase-intro h2 { font-size:32px; }
  .purchase-intro-badges { justify-content:flex-start; }
  .purchase-intro-badges span { width:100%; justify-content:flex-start; }
  .purchase-fields-grid.two-col,.invoice-choice-grid,.payment-choice-grid { grid-template-columns:1fr; }
  .purchase-fields-grid .full-span { grid-column:auto; }
  .purchase-card-heading { padding:24px 20px; }
  .purchase-card-heading.compact { margin:-24px -20px 22px; padding:23px 20px; }
  .purchase-form-section { padding:24px 20px; }
  .purchase-section-title { align-items:flex-start; flex-direction:column; gap:5px; }
  .purchase-heading-icon { width:48px; height:48px; flex-basis:48px; }
  .purchase-card-heading h3 { font-size:23px; }
  .purchase-summary-card { padding:0 18px 20px; }
  .summary-topbar { margin:0 -18px; padding:20px 18px; }
}
@media only screen and (max-width:430px) {
  .purchase-card-heading { gap:12px; }
  .purchase-heading-icon { display:none; }
  .summary-topbar { align-items:flex-start; flex-direction:column; }
  .summary-product { grid-template-columns:72px 1fr; }
  .summary-product-image { height:68px; }
}

/* Sipariş özeti görsel okunabilirliği ve kısa ekranlarda scroll güvenliği */
.purchase-professional .summary-product-image { background:#f2f7f4; border:1px solid #dfe9e2; }
.purchase-professional .summary-product-image img { filter:none; }
@media (min-width:992px) and (max-height:900px) { .purchase-professional .purchase-summary-card { position:relative; top:auto; } }



/*
 * ARAJEL son görünüm düzeltmeleri — 2026-07-29
 * Bu dosya önbellekte kalmış eski yerleşim kurallarını da güvenle geçersiz kılar.
 */

/* Sayfa genelindeki yatay taşmayı, AOS dönüşümleri ve dekoratif görseller dahil kilitle. */
html,
body {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-right: 0 !important;
    overflow-x: hidden !important;
}

/* Son katman: eski anasayfa negatif marjin kurallarını tüm sayfalarda eşitler. */
.knowledge-hub-section + .home-client-logos,
.arajel-client-logos {
    margin-top: 0 !important;
    padding: 70px 0 !important;
    background:
        linear-gradient(to bottom, #d6e0ea 0%, #d6e0ea 50%, rgba(5, 75, 39, .9) 50%, rgba(5, 75, 39, .9) 100%),
        url("../images/footer-bg-img.jpg") center bottom / cover no-repeat !important;
}
.home-client-logos + .footer-con,
.arajel-client-logos + .footer-con {
    margin-top: 0 !important;
    padding-top: 72px !important;
}

@media (max-width: 991px) {
    .knowledge-hub-section + .home-client-logos,
    .arajel-client-logos { margin-top: 0 !important; padding: 56px 0 !important; }
    .home-client-logos + .footer-con,
    .arajel-client-logos + .footer-con { margin-top: 0 !important; padding-top: 58px !important; }
}

/* Slider okları: görünür, tıklanabilir ve carousel üzerinde kalır. */
.service-con .btn-wrap { position: relative; z-index: 8; display: flex; justify-content: center; }
.service-con .btn-wrap button { cursor: pointer; pointer-events: auto; }

.phone-con figure .fa-whatsapp {
    color: #25d366;
    font-size: 38px;
    line-height: 1;
}

@media (max-width: 767px) {
    .work-con .work-box-inner-item h3 { font-size: 19px !important; line-height: 1.15 !important; margin-bottom: 9px; }
    .work-con .work-box-inner-item > span { font-size: 14px !important; line-height: 1.35 !important; padding: 0 18px; }

    /* Modern mobil header */
    .header-con { background: #fff; box-shadow: 0 8px 28px rgba(15, 65, 38, .1); }
    .header-con .wrapper { width: 100%; padding: 0 18px; }
    .header-con .navbar { min-height: 76px; padding: 10px 0 !important; display: flex; align-items: center; }
    .header-con .navbar-brand { display: flex; align-items: center; margin: 0 !important; padding: 0; }
    .header-con .navbar-brand img { display: block; width: auto; max-width: 138px !important; max-height: 52px; }
    .header-con .navbar-toggler {
        display: flex; flex-direction: column; justify-content: center; align-items: center;
        width: 46px; height: 46px; margin: 0 0 0 auto; padding: 0 !important;
        border: 1px solid #dce9df !important; border-radius: 14px; background: #f4f9f1;
        box-shadow: none !important;
    }
    .header-con .navbar-toggler-icon { width: 22px; height: 2px; margin: 3px 0; border-radius: 3px; background: #164c2a !important; }
    .header-con .navbar-collapse {
        position: absolute !important; left: 0; right: 0; top: calc(100% + 10px);
        max-height: calc(100vh - 105px); overflow-y: auto; padding: 14px;
        border: 1px solid #dce9df; border-radius: 18px; background: #fff;
        box-shadow: 0 22px 55px rgba(14, 65, 37, .16); z-index: 1200;
    }
    .header-con .arajel-main-nav { padding: 0; gap: 5px !important; }
    .header-con .navbar-light .arajel-main-nav > .nav-item > .nav-link {
        padding: 13px 15px !important; border-radius: 12px; color: #164c2a !important;
        font-size: 15px !important; line-height: 20px !important; font-weight: 600 !important;
    }
    .header-con .arajel-main-nav > .nav-item.active > .nav-link,
    .header-con .arajel-main-nav > .nav-item > .nav-link:hover { background: #eef6e8; color: #4f852c !important; }
    .header-con .header-action-group { gap: 8px; padding: 10px 0 2px; }
    .header-con .header-action-group .generic-btn { flex: 1; }
    .header-con .header-action-group .generic-btn a { width: 100%; min-width: 0; padding: 14px 10px; border-radius: 11px; font-size: 14px; }
}

body {
    position: relative;
}

body > header,
body > section,
body > footer,
.wrapper,
.header-con,
.banner-con,
.sub-banner,
.service-con,
.choose-con,
.work-con,
.blog-con,
.faq-con,
.knowledge-hub-section,
.footer-con {
    max-width: 100% !important;
}

.wrapper,
.container,
.row,
[class*="col-"] {
    min-width: 0;
}

img,
svg,
video,
iframe {
    max-width: 100%;
}

/* Bilgi Merkezi menü başlığı açık/kapalı ve hover durumlarında aynı kalınlıkta kalır. */
.header-con .navbar-light .arajel-main-nav > .knowledge-mega-item > .nav-link,
.header-con .navbar-light .arajel-main-nav > .knowledge-mega-item > .nav-link:hover,
.header-con .navbar-light .arajel-main-nav > .knowledge-mega-item > .nav-link:focus,
.header-con .navbar-light .arajel-main-nav > .knowledge-mega-item > .nav-link:active,
.header-con .navbar-light .arajel-main-nav > .knowledge-mega-item.show > .nav-link,
.header-con .navbar-light .arajel-main-nav > .knowledge-mega-item > .nav-link[aria-expanded="true"] {
    font-family: "Noto Sans", sans-serif !important;
    font-weight: 500 !important;
    font-synthesis: none;
    -webkit-font-smoothing: antialiased;
    text-shadow: none !important;
    transition: color .25s ease, opacity .25s ease !important;
}

.header-con .knowledge-mega-menu .mega-menu-copy strong,
.header-con .knowledge-mega-menu .mega-menu-copy:hover strong,
.header-con .knowledge-mega-menu .mega-menu-copy:focus strong {
    font-weight: 500 !important;
    font-synthesis: none;
}

/* Video görseli ve dekoratif çember aynı ölçü/maske içinde kalır. */
.help-con .vedio-img {
    width: min(493px, 42vw);
    aspect-ratio: 1;
    border-radius: 50%;
}
.help-con .vedio-img > a {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    overflow: hidden;
}
.help-con .vedio-img .index1-poster {
    display: block;
    width: 100% !important;
    height: 100% !important;
    max-width: none;
    border-radius: 50%;
    object-fit: cover;
    object-position: 68% center;
}
.help-con .vedio-img::after {
    box-sizing: border-box;
    width: 100% !important;
    height: 100% !important;
    position: absolute !important;
    inset: 0 !important;
    left: 0 !important;
    top: 0 !important;
    transform: none !important;
    border-radius: 50% !important;
    z-index: 3;
    pointer-events: none;
}

/* Tüm sayfalardaki ortak FAQ, anasayfadaki koyu zemin ve alt geçişi kullanır. */
.home-faq-section {
    position: relative;
    clear: both;
    background: #d6e0ea !important;
    background-position: center;
    background-size: cover;
    overflow: hidden;
}

/* Birleştirilmiş uygulama ve teknik değer özeti. */
.technical-summary { grid-template-columns: minmax(0,.9fr) minmax(0,.8fr) minmax(0,1.1fr); gap: 34px; }
.application-summary { padding: 28px; border: 1px solid rgba(255,255,255,.16); background: rgba(255,255,255,.07); }
.application-summary > span { color: var(--secondary--color); font-weight: 700; }
.application-summary h3 { color: #fff; font-size: 25px; line-height: 1.25; margin: 9px 0 13px; }
.application-summary p { font-size: 15px; line-height: 1.55; }
.application-summary-points { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.application-summary-points strong { padding: 8px 10px; color: #fff; background: rgba(255,255,255,.1); font-size: 13px; }

/* Dropdown metinleri hover sırasında yeniden kalınlaşmaz. */
.header-con .knowledge-mega-menu .mega-menu-link,
.header-con .knowledge-mega-menu .mega-menu-link:hover,
.header-con .knowledge-mega-menu .mega-menu-link:focus,
.header-con .knowledge-mega-menu .mega-menu-copy strong,
.header-con .knowledge-mega-menu .mega-menu-link:hover .mega-menu-copy strong {
    font-weight: 500 !important;
    font-synthesis: none;
}

.header-con .knowledge-mega-menu .mega-menu-link,
.header-con .knowledge-mega-menu .mega-menu-link:hover,
.header-con .knowledge-mega-menu .mega-menu-link:focus,
.header-con .knowledge-mega-menu .mega-menu-link:active {
    font-size: 14px !important;
    line-height: 1.3 !important;
    transform: none !important;
    transition: background-color .24s ease, color .24s ease !important;
}
.header-con .knowledge-mega-menu .mega-menu-copy strong,
.header-con .knowledge-mega-menu .mega-menu-link:hover .mega-menu-copy strong,
.header-con .knowledge-mega-menu .mega-menu-link:focus .mega-menu-copy strong,
.header-con .knowledge-mega-menu .mega-menu-link:active .mega-menu-copy strong {
    display: block;
    font-family: "Noto Sans", sans-serif !important;
    font-size: 14px !important;
    line-height: 1.3 !important;
    font-weight: 500 !important;
    letter-spacing: 0 !important;
    transform: none !important;
    transition: color .24s ease !important;
}

/* Referans logoları her sayfada aynı renkli, footer dokusuna oturan karttır. */
.arajel-client-logos,
.knowledge-hub-section + .home-client-logos {
    clear: both;
    position: relative;
    z-index: 3;
    margin: 0 !important;
    padding: 70px 0 !important;
    overflow: visible !important;
    background:
        linear-gradient(to bottom, #d6e0ea 0%, #d6e0ea 50%, rgba(5, 75, 39, .9) 50%, rgba(5, 75, 39, .9) 100%),
        url("../images/footer-bg-img.jpg") center bottom / cover no-repeat !important;
}
.arajel-client-logos .container { position: relative; z-index: 2; }
.arajel-client-logos ul,
.home-client-logos ul {
    margin: 0 auto !important;
    overflow: hidden;
    border-radius: 30px !important;
    background: #f1f8f8 !important;
    box-shadow: 0 24px 70px rgba(4, 37, 22, .2) !important;
}
.arajel-client-logos ul li,
.home-client-logos ul li { min-height: 122px; padding: 30px 12px !important; }
.arajel-client-logos ul li img,
.arajel-client-logos ul li:hover img,
.home-client-logos img {
    opacity: 1 !important;
    filter: none !important;
    transform: none !important;
}
.arajel-client-logos + .footer-con,
.home-client-logos + .footer-con {
    margin-top: 0 !important;
    padding-top: 72px !important;
}

@media (max-width: 991px) {
    .help-con .vedio-img { width: min(384px, 82vw); }
    .technical-summary { grid-template-columns: 1fr; }
    .arajel-client-logos,
    .knowledge-hub-section + .home-client-logos { padding: 56px 0 !important; }
}

/*
 * Referans kartı:
 * 122 px mavi Bilgi Merkezi bölümüne, 122 px yeşil footera taşar.
 * Böylece arada beyaz bant oluşmaz; butonla kart arasında kontrollü boşluk kalır.
 */
.home-knowledge-section {
    position: relative;
    z-index: 2;
    overflow: visible !important;
}

.home-knowledge-section .padding-bottom {
    padding-bottom: 220px !important;
}

.home-knowledge-section .knowledge-all-btn {
    margin-top: 42px !important;
    margin-bottom: 0 !important;
}

.knowledge-hub-section + .home-client-logos {
    clear: both;
    position: relative;
    z-index: 10;
    margin-top: -122px !important;
    padding: 0 !important;
    background: transparent !important;
    overflow: visible !important;
}

.home-client-logos .container {
    position: relative;
    z-index: 2;
}

.home-client-logos ul {
    margin: 0 auto !important;
    border-radius: 30px !important;
    background: #f1f8f8 !important;
    box-shadow: 0 24px 70px rgba(4, 37, 22, .2) !important;
}

.home-client-logos ul li {
    min-height: 122px;
    padding-top: 30px !important;
    padding-bottom: 30px !important;
}

.home-client-logos img {
    opacity: 1 !important;
    filter: none !important;
}

.home-client-logos + .footer-con {
    position: relative;
    z-index: 1;
    margin-top: -122px !important;
    padding-top: 254px !important;
}

@media only screen and (max-width: 991px) and (min-width: 768px) {
    .home-knowledge-section .padding-bottom {
        padding-bottom: 196px !important;
    }

    .knowledge-hub-section + .home-client-logos {
        margin-top: -112px !important;
    }

    .home-client-logos ul li {
        min-height: 112px;
        padding-top: 25px !important;
        padding-bottom: 25px !important;
    }

    .home-client-logos + .footer-con {
        margin-top: -112px !important;
        padding-top: 232px !important;
    }
}

@media only screen and (max-width: 767px) {
    body > header,
    body > section,
    body > footer,
    body > div {
        max-width: 100% !important;
    }

    .home-knowledge-section {
        overflow: hidden !important;
    }

    .home-knowledge-section .padding-bottom {
        padding-bottom: 100px !important;
    }

    .knowledge-hub-section + .home-client-logos {
        margin-top: 0 !important;
        padding: 56px 0 0 !important;
        background: url("../images/footer-bg-img.jpg") no-repeat center top !important;
        background-size: cover !important;
        overflow: hidden !important;
    }

    .home-client-logos ul {
        border-radius: 24px !important;
        box-shadow: 0 22px 55px rgba(4, 37, 22, .24) !important;
    }

    .home-client-logos ul li {
        min-height: 104px;
        padding: 22px 12px !important;
    }

    .home-client-logos + .footer-con {
        margin-top: 0 !important;
        padding-top: 58px !important;
    }
}

@media only screen and (max-width: 475px) {
    .home-knowledge-section .padding-bottom {
        padding-bottom: 88px !important;
    }

    .knowledge-hub-section + .home-client-logos {
        padding-top: 48px !important;
    }

    .home-client-logos + .footer-con {
        padding-top: 50px !important;
    }
}

/* Kesin son katman: logo kartını masaüstü ve mobilde aynı kompozisyonda tutar. */
.knowledge-hub-section + .home-client-logos,
.arajel-client-logos {
    margin-top: 0 !important;
    padding: 70px 0 !important;
    overflow: visible !important;
    background:
        linear-gradient(to bottom, #d6e0ea 0%, #d6e0ea 50%, rgba(5, 75, 39, .9) 50%, rgba(5, 75, 39, .9) 100%),
        url("../images/footer-bg-img.jpg") center bottom / cover no-repeat !important;
}
.home-client-logos + .footer-con,
.arajel-client-logos + .footer-con {
    margin-top: 0 !important;
    padding-top: 72px !important;
}
@media (max-width: 991px) {
    .knowledge-hub-section + .home-client-logos,
    .arajel-client-logos { padding: 56px 0 !important; }
    .home-client-logos + .footer-con,
    .arajel-client-logos + .footer-con { padding-top: 58px !important; }
}

/* ARAJEL Tanıtım ve Teknik Bilgiler — izole, çakışmasız sayfa sistemi */
.arajel-page main { display: block; width: 100%; overflow: hidden; background: #fff; }
.arajel-page .loader-mask { display: none !important; }
.arajel-page main section,
.arajel-page main section .container,
.arajel-page main section .ap-hero-grid,
.arajel-page main section .ap-hero-copy,
.arajel-page main section .ap-hero-media,
.arajel-page main section .ap-heading,
.arajel-page main section article,
.arajel-page main section aside {
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
}
.ap-hero { width: 100%; padding: 92px 0 96px; background: linear-gradient(135deg, #f3f8f5 0%, #dce8ef 100%); }
.ap-hero-grid { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(380px, .92fr); gap: 72px; align-items: center; }
.arajel-page .ap-hero-grid,
.arajel-page .ap-spec-grid,
.arajel-page .ap-process-grid,
.arajel-page .ap-benefit-layout,
.arajel-page .ap-benefit-list,
.arajel-page .ap-report-grid {
    position: relative;
    left: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}
.ap-breadcrumb { display: flex; flex-wrap: wrap; gap: 9px; align-items: center; margin-bottom: 34px; color: #738178; font-size: 14px; }
.ap-breadcrumb a { color: #42604d; text-decoration: none; }
.ap-eyebrow { display: block; margin-bottom: 13px; color: #709b4c; font-size: 14px; line-height: 1.2; font-weight: 700; letter-spacing: 1.15px; text-transform: uppercase; }
.ap-hero-copy h1 { max-width: 760px; margin: 0 0 24px; color: #153e27; font-family: 'Noto Sans', sans-serif; font-size: clamp(46px, 4.25vw, 68px); line-height: 1.02; font-weight: 600; }
.ap-hero-copy > p { max-width: 700px; margin: 0; color: #52675a; font-size: 19px; line-height: 1.7; }
.ap-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; }
.ap-btn { display: inline-flex; min-height: 52px; padding: 14px 24px; align-items: center; justify-content: center; border: 1px solid transparent; border-radius: 12px; font-size: 16px; line-height: 1.2; font-weight: 600; text-decoration: none !important; transition: background-color .2s ease, color .2s ease, border-color .2s ease; }
.ap-btn-primary { color: #fff !important; background: #76a947; }
.ap-btn-primary:hover { background: #5f9135; }
.ap-btn-ghost { color: #18482d !important; border-color: #b9ccc0; background: rgba(255,255,255,.68); }
.ap-btn-ghost:hover { background: #fff; border-color: #76a947; }
.ap-hero-media { position: relative; min-height: 500px; margin: 0; overflow: hidden; border-radius: 34px 34px 8px 34px; box-shadow: 0 30px 75px rgba(24, 72, 45, .16); }
.ap-hero-media > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.ap-hero-media figcaption { position: absolute; left: 24px; right: 24px; bottom: 24px; display: flex; gap: 14px; align-items: center; padding: 18px 20px; border: 1px solid rgba(255,255,255,.2); border-radius: 18px; color: #fff; background: rgba(15, 62, 35, .89); backdrop-filter: blur(8px); }
.ap-hero-media figcaption strong { flex: 0 0 auto; color: #b9df66; font-family: 'Noto Sans', sans-serif; font-size: 26px; }
.ap-hero-media figcaption span { font-size: 14px; line-height: 1.4; }
.ap-section { width: 100%; padding: 94px 0; }
.ap-heading { max-width: 780px; margin: 0 auto 48px; text-align: center; }
.ap-heading h2 { margin: 0 0 16px; color: #173e27; font-size: clamp(38px, 3.2vw, 54px); line-height: 1.08; }
.ap-heading p { margin: 0; color: #63746a; font-size: 18px; line-height: 1.7; }
.ap-overview { background: #fff; }
.ap-spec-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 18px; }
.ap-spec { min-height: 185px; padding: 30px 26px; border: 1px solid #e0ebe4; border-radius: 22px; background: #f8fbf9; box-shadow: 0 13px 35px rgba(24,72,45,.06); }
.ap-spec i { display: flex; width: 48px; height: 48px; margin-bottom: 25px; align-items: center; justify-content: center; border-radius: 14px; color: #4f862d; background: #e9f3df; font-size: 19px; }
.ap-spec small { display: block; margin-bottom: 7px; color: #77877e; font-size: 12px; font-weight: 700; letter-spacing: .8px; text-transform: uppercase; }
.ap-spec strong { display: block; color: #173e27; font-size: 20px; line-height: 1.3; }
.ap-process { color: #fff; background: #164c2a; }
.ap-heading-light h2 { color: #fff; }
.ap-heading-light p { color: rgba(255,255,255,.72); }
.ap-process-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 22px; }
.ap-process-grid article { position: relative; min-height: 300px; padding: 36px; overflow: hidden; border: 1px solid rgba(255,255,255,.12); border-radius: 26px; background: rgba(255,255,255,.07); }
.ap-process-grid article > span { position: absolute; top: 18px; right: 24px; color: rgba(255,255,255,.1); font: 600 64px/1 'Noto Sans',sans-serif; }
.ap-process-icon { display: flex; width: 60px; height: 60px; margin-bottom: 44px; align-items: center; justify-content: center; border-radius: 18px; color: #164c2a; background: #b9df66; font-size: 23px; }
.ap-process-grid h3 { margin: 0 0 12px; color: #fff; font-size: 26px; }
.ap-process-grid p { margin: 0; color: rgba(255,255,255,.72); font-size: 16px; line-height: 1.65; }
.ap-benefits { background: #f3f7f4; }
.ap-benefit-layout { display: grid; grid-template-columns: minmax(0,1.35fr) minmax(330px,.65fr); gap: 30px; align-items: start; }
.ap-benefit-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
.ap-benefit-list article { display: flex; gap: 18px; min-height: 155px; padding: 26px; border: 1px solid #dfe9e2; border-radius: 20px; background: #fff; }
.ap-benefit-list article > i { flex: 0 0 44px; display: flex; width: 44px; height: 44px; align-items: center; justify-content: center; border-radius: 13px; color: #4f862d; background: #ecf5e3; }
.ap-benefit-list h3 { margin: 1px 0 8px; color: #173e27; font-size: 21px; }
.ap-benefit-list p { margin: 0; color: #697970; font-size: 15px; line-height: 1.55; }
.ap-note { padding: 32px; border-radius: 22px; color: #fff; background: #173e27; box-shadow: 0 20px 50px rgba(23,62,39,.14); }
.ap-note > i { margin-bottom: 22px; color: #b9df66; font-size: 28px; }
.ap-note h3 { margin: 0 0 14px; color: #fff; font-size: 24px; }
.ap-note p { margin: 0 0 14px; color: rgba(255,255,255,.76); font-size: 15px; line-height: 1.65; }

/* Teknik sayfa ve tablolar */
.ap-technical-hero { padding-bottom: 82px; }
.ap-tech-summary { padding: 36px; border: 1px solid rgba(255,255,255,.45); border-radius: 28px; background: #164c2a; box-shadow: 0 28px 65px rgba(22,76,42,.18); }
.ap-tech-summary > span { display: block; margin-bottom: 9px; color: #b9df66; font-size: 13px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; }
.ap-tech-summary > strong { display: block; margin-bottom: 25px; color: #fff; font: 600 35px/1.1 'Noto Sans',sans-serif; }
.ap-tech-summary ul { margin: 0; padding: 0; list-style: none; }
.ap-tech-summary li { position: relative; padding: 12px 0 12px 26px; border-top: 1px solid rgba(255,255,255,.12); color: rgba(255,255,255,.8); font-size: 15px; }
.ap-tech-summary li::before { content: '✓'; position: absolute; left: 0; color: #b9df66; font-weight: 700; }
.ap-table-card { overflow: hidden; border: 1px solid #dce8e0; border-radius: 22px; background: #fff; box-shadow: 0 18px 50px rgba(23,62,39,.08); }
.ap-table { width: 100%; margin: 0; border-collapse: collapse; color: #52655a; font-size: 15px; }
.ap-table th { padding: 19px 22px; border: 0; color: #fff; background: #164c2a; font-size: 13px; font-weight: 700; letter-spacing: .45px; text-align: left; text-transform: uppercase; }
.ap-table td { padding: 18px 22px; border: 0; border-bottom: 1px solid #e4ece7; line-height: 1.5; vertical-align: middle; }
.ap-table tbody tr:nth-child(even) { background: #f6f9f7; }
.ap-table tbody tr:last-child td { border-bottom: 0; }
.ap-table td:first-child { color: #193f28; font-weight: 600; }
.ap-report { background: #f0f5f2; }
.ap-report-grid { display: grid; grid-template-columns: minmax(0,1.25fr) minmax(320px,.75fr); gap: 28px; align-items: start; }
.ap-text-link { display: inline-flex; gap: 8px; align-items: center; margin-top: 8px; color: #b9df66 !important; font-weight: 600; text-decoration: none !important; }
.ap-metals { background: #fff; }
.ap-table-footnote { margin: 18px 0 0; color: #6d7c73; font-size: 13px; line-height: 1.55; }

@media (max-width: 991px) {
    .ap-hero { padding: 70px 0; }
    .ap-hero-grid { grid-template-columns: 1fr; gap: 44px; }
    .ap-hero-media { min-height: 420px; }
    .ap-spec-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .ap-process-grid { grid-template-columns: 1fr; }
    .ap-process-grid article { min-height: 0; }
    .ap-benefit-layout, .ap-report-grid { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
    .ap-hero { padding: 48px 0 58px; }
    .ap-breadcrumb { margin-bottom: 26px; }
    .ap-hero-copy h1 { font-size: 41px; line-height: 1.04; }
    .ap-hero-copy > p, .ap-heading p { font-size: 16px; line-height: 1.62; }
    .ap-hero-media { min-height: 340px; border-radius: 24px 24px 6px 24px; }
    .ap-hero-media figcaption { left: 14px; right: 14px; bottom: 14px; padding: 14px; flex-direction: column; gap: 3px; align-items: flex-start; }
    .ap-hero-media figcaption strong { font-size: 22px; }
    .ap-section { padding: 68px 0; }
    .ap-heading { margin-bottom: 34px; }
    .ap-heading h2 { font-size: 36px; }
    .ap-spec-grid, .ap-benefit-list { grid-template-columns: 1fr; }
    .ap-spec { min-height: 0; }
    .ap-process-grid article { padding: 28px; }
    .ap-process-icon { margin-bottom: 30px; }
    .ap-benefit-list article { min-height: 0; }
    .ap-note, .ap-tech-summary { padding: 26px; }
    .ap-table { min-width: 650px; }
    .ap-table th, .ap-table td { padding: 15px 17px; }
}

/* İki özel sayfada tema header/footer'ının içerik üzerine binmesini kesin olarak engeller. */
.arajel-page .header-con {
    position: relative !important;
    top: 0 !important;
    left: 0 !important;
    min-height: 92px;
    padding: 12px 0;
    background: #164c2a !important;
    box-shadow: 0 8px 25px rgba(14, 55, 31, .14);
}
.arajel-page .header-con .navbar { min-height: 68px; align-items: center; }
.arajel-page .header-con .navbar-light .arajel-main-nav > .nav-item > .nav-link {
    color: rgba(255,255,255,.9);
}
.arajel-page .header-con .navbar-light .arajel-main-nav > .nav-item.active > .nav-link,
.arajel-page .header-con .navbar-light .arajel-main-nav > .nav-item > .nav-link:hover {
    color: #b9df66 !important;
}
.arajel-page .header-con .header-contact-btn a { color: #173e27; background: #fff; }
.arajel-page .footer-con {
    position: relative !important;
    z-index: 1 !important;
    clear: both !important;
    margin-top: 0 !important;
    padding-top: 92px !important;
}
.arajel-page main { position: relative; z-index: 2; overflow: visible; }
.arajel-page .ap-metals { padding-bottom: 110px; }
.arajel-page .ap-table-card { position: relative; z-index: 2; }
.arajel-page .ap-table-footnote { position: relative; z-index: 2; }

/* Hero ölçülerini tema ile daha dengeli hale getirir. */
.arajel-page .ap-hero { padding-top: 76px; }
.arajel-page .ap-hero-copy h1 { font-size: clamp(44px, 3.45vw, 58px); line-height: 1.06; }
.arajel-page .ap-hero-media { min-height: 460px; }
.arajel-page .ap-technical-hero .ap-hero-grid { grid-template-columns: minmax(0,1.1fr) minmax(360px,.75fr); }

@media (max-width: 991px) {
    .arajel-page .header-con { min-height: 76px; padding: 0; }
    .arajel-page .header-con .navbar-collapse { top: calc(100% + 8px); }
    .arajel-page .header-con .navbar-light .arajel-main-nav > .nav-item > .nav-link { color: #164c2a !important; }
    .arajel-page .ap-hero { padding-top: 58px; }
    .arajel-page .ap-hero-media { min-height: 410px; }
    .arajel-page .ap-technical-hero .ap-hero-grid { grid-template-columns: 1fr; }
    .arajel-page .footer-con { padding-top: 68px !important; }
}
@media (max-width: 767px) {
    .arajel-page .ap-hero-copy h1 { font-size: 38px; }
    .arajel-page .ap-hero-media { min-height: 330px; }
    .arajel-page .ap-metals { padding-bottom: 72px; }
}

/* Bespoke product pages: keep typography, tables and ending sections isolated. */
.arajel-page .ap-heading h2,
.arajel-page .ap-hero-copy h1,
.arajel-page .ap-spec strong,
.arajel-page .ap-table th,
.arajel-page .ap-table td { overflow-wrap: anywhere; }
.arajel-page .arajel-about-faq { clear: both; background: #edf4f7 !important; }
.arajel-page .arajel-about-faq .padding-top { padding-top: 90px; }
.arajel-page .arajel-about-faq .padding-bottom { padding-bottom: 90px; }
.arajel-page .arajel-about-clients { clear: both; }

@media (max-width: 767.98px) {
    html, body.arajel-page { max-width: 100%; overflow-x: hidden; }
    .arajel-page .ap-section { padding: 68px 0; }
    .arajel-page .ap-heading h2 { font-size: 36px; line-height: 1.08; }
    .arajel-page .ap-table-wrap { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .arajel-page .ap-table { min-width: 650px; }
    .arajel-page .arajel-about-faq .padding-top { padding-top: 68px; }
    .arajel-page .arajel-about-faq .padding-bottom { padding-bottom: 68px; }
    .arajel-page .header-con .navbar-toggler { border-color: rgba(255,255,255,.35) !important; background: #fff !important; }
    .arajel-page .header-con .navbar-toggler-icon { background: #164c2a !important; }
}

@media (max-width: 420px) {
    .arajel-page .ap-hero-copy h1 { font-size: 34px; }
    .arajel-page .ap-heading h2 { font-size: 32px; }
    .arajel-page .ap-hero-copy > p { font-size: 15px; }
}



/*
 * ARAJEL canonical UI layer.
 * Loaded last so shared navigation and inner-page layouts have one source of truth.
 */

.loader-mask { display: none !important; }

/* Shared inner-page hero --------------------------------------------------- */
.site-inner-hero {
    position: relative;
    width: 100%;
    min-height: 620px;
    overflow: hidden;
    padding: 185px 0 92px;
    color: #fff;
    background: #164f2d;
}
.site-inner-hero::before,
.site-inner-hero::after {
    position: absolute;
    content: "";
    pointer-events: none;
}
.site-inner-hero::before {
    inset: 0;
    opacity: .15;
    background:
        radial-gradient(circle at 50% 105%, transparent 0 115px, rgba(148,194,46,.5) 116px 118px, transparent 119px),
        linear-gradient(115deg, rgba(255,255,255,.08), transparent 34%);
}
.site-inner-hero::after {
    width: 180px;
    height: 180px;
    right: 7%;
    bottom: -115px;
    border: 1px solid rgba(255,255,255,.12);
    transform: rotate(45deg);
}
.site-inner-hero .wrapper { position: relative; z-index: 1; width: min(100% - 56px, 1840px); margin: 0 auto; }
.site-inner-hero-grid {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) minmax(500px, 1.65fr) minmax(260px, 1fr);
    gap: clamp(34px, 4vw, 78px);
    align-items: center;
    width: 100%;
}
.site-inner-hero-image {
    position: relative;
    width: 100%;
    height: clamp(270px, 20vw, 330px);
    margin: 0;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.18);
    background: rgba(255,255,255,.08);
    box-shadow: 0 28px 65px rgba(4,42,23,.22);
}
.site-inner-hero-image-left { border-radius: 4px 32px 4px 32px; }
.site-inner-hero-image-right { border-radius: 32px 4px 32px 4px; }
.site-inner-hero-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.site-inner-hero-copy { min-width: 0; text-align: center; }
.site-inner-breadcrumb {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    justify-content: center;
    align-items: center;
    margin: 0 0 26px;
    color: rgba(255,255,255,.78);
    font-size: 16px;
    line-height: 1.4;
}
.site-inner-breadcrumb a { color: #b4dc58; text-decoration: none; }
.site-inner-breadcrumb a:hover,
.site-inner-breadcrumb a:focus { color: #fff; text-decoration: none; }
.site-inner-hero h1 {
    max-width: 780px;
    margin: 0 auto;
    color: #fff;
    font-family: 'Noto Sans', sans-serif;
    font-size: clamp(52px, 5vw, 78px);
    font-weight: 600;
    line-height: 1.02;
    overflow-wrap: anywhere;
}
.site-inner-hero-line {
    display: block;
    width: min(320px, 72%);
    height: 10px;
    margin: 27px auto 0;
    border-bottom: 5px solid #94c22e;
    border-radius: 50%;
}

/* Product introduction ---------------------------------------------------- */
.ap-product-intro { background: linear-gradient(135deg, #f4f8f5 0%, #dfeaf0 100%); }
.arajel-page .ap-product-intro-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(390px, .95fr);
    gap: clamp(42px, 6vw, 90px);
    align-items: center;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
}
.ap-product-intro-copy h2 {
    max-width: 760px;
    margin: 13px 0 24px;
    color: #153e27;
    font-family: 'Noto Sans', sans-serif;
    font-size: clamp(44px, 4.1vw, 64px);
    font-weight: 600;
    line-height: 1.05;
}
.ap-product-intro-copy > p { max-width: 720px; margin: 0; color: #52675a; font-size: 19px; line-height: 1.72; }
.ap-product-intro-media {
    position: relative;
    min-height: 470px;
    margin: 0;
    overflow: hidden;
    border-radius: 32px 32px 6px 32px;
    box-shadow: 0 30px 72px rgba(24,72,45,.16);
}
.ap-product-intro-media > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.ap-product-intro-media figcaption {
    position: absolute;
    left: 22px;
    right: 22px;
    bottom: 22px;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 16px;
    align-items: center;
    padding: 18px 20px;
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 18px;
    color: #fff;
    background: rgba(15,62,35,.92);
    -webkit-backdrop-filter: blur(9px);
    backdrop-filter: blur(9px);
}
.ap-product-intro-media figcaption strong { color: #b9df66; font-family: 'Noto Sans', sans-serif; font-size: 27px; white-space: nowrap; }
.ap-product-intro-media figcaption span { font-size: 14px; line-height: 1.4; }

/* Technical information -------------------------------------------------- */
.technical-overview { padding: 100px 0 108px; background: #f4f8f5; }
.technical-section-heading { max-width: 840px; margin: 0 auto 46px; text-align: center; }
.technical-section-heading > span,
.technical-report-head > div > span {
    color: #6f9a45;
    font-size: 13px;
    line-height: 1.3;
    font-weight: 700;
    letter-spacing: 1.2px;
    text-transform: uppercase;
}
.technical-section-heading h2,
.technical-report-head h2 {
    margin: 11px 0 0;
    color: #153e27;
    font-family: 'Noto Sans', sans-serif;
    font-size: clamp(42px, 4vw, 58px);
    font-weight: 600;
    line-height: 1.08;
}
.technical-fact-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    width: 100%;
}
.technical-fact-grid article {
    position: relative;
    min-height: 155px;
    padding: 28px 25px 25px 84px;
    border: 1px solid #dce8df;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 14px 35px rgba(20,67,39,.055);
}
.technical-fact-grid article i {
    position: absolute;
    top: 28px;
    left: 24px;
    display: flex;
    width: 44px;
    height: 44px;
    align-items: center;
    justify-content: center;
    border-radius: 13px;
    color: #4f862d;
    background: #ebf4e3;
}
.technical-fact-grid article span { display: block; margin-bottom: 9px; color: #7a897f; font-size: 12px; line-height: 1.3; font-weight: 700; letter-spacing: .65px; text-transform: uppercase; }
.technical-fact-grid article strong { display: block; color: #173e27; font-size: 19px; line-height: 1.35; }
.technical-report { padding: 104px 0 118px; background: #fff; }
.technical-report-head { display: flex; gap: 30px; align-items: flex-end; justify-content: space-between; margin-bottom: 38px; }
.technical-report-button {
    display: inline-flex;
    flex: 0 0 auto;
    gap: 10px;
    align-items: center;
    justify-content: center;
    min-height: 54px;
    padding: 14px 22px;
    border-radius: 13px;
    color: #fff;
    background: #73aa3d;
    font-size: 15px;
    font-weight: 700;
    text-decoration: none !important;
    box-shadow: 0 13px 25px rgba(79,134,45,.18);
}
.technical-report-button:hover,
.technical-report-button:focus { color: #fff; background: #164f2d; transform: translateY(-2px); }
.technical-table-shell { overflow: hidden; border: 1px solid #d8e5dc; border-radius: 24px; background: #fff; box-shadow: 0 24px 60px rgba(20,67,39,.09); }
.technical-table-scroll { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.technical-report-table { width: 100%; min-width: 760px; margin: 0; border-collapse: collapse; table-layout: auto; }
.technical-report-table th { padding: 22px 24px; color: #fff; background: #164f2d; font-size: 14px; line-height: 1.35; font-weight: 700; text-align: left; text-transform: uppercase; }
.technical-report-table td { padding: 20px 24px; border-bottom: 1px solid #e1e9e4; color: #52675a; font-size: 16px; line-height: 1.45; }
.technical-report-table tbody tr:nth-child(even) td { background: #f5f8f6; }
.technical-report-table tbody tr:last-child td { border-bottom: 0; }
.technical-report-table td:first-child { color: #173e27; font-weight: 700; }

/* Application detail pages ---------------------------------------------- */
.application-detail-main { display: block; width: 100%; overflow: hidden; background: #f4f8f5; }
.application-detail-section { padding: 105px 0 116px; }
.application-detail-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(310px, 390px);
    gap: clamp(35px, 5vw, 75px);
    align-items: start;
    width: 100%;
    max-width: 100%;
    margin: 0;
}
.application-detail-content { min-width: 0; }
.application-detail-heading { padding-bottom: 42px; border-bottom: 1px solid #d9e5dd; }
.application-detail-heading > span,
.application-essentials > span { color: #70a046; font-size: 13px; line-height: 1.3; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; }
.application-detail-heading h2 {
    max-width: 850px;
    margin: 12px 0 21px;
    color: #153e27;
    font-family: 'Noto Sans', sans-serif;
    font-size: clamp(43px, 4.2vw, 61px);
    font-weight: 600;
    line-height: 1.05;
    overflow-wrap: anywhere;
}
.application-detail-heading p { max-width: 900px; margin: 0; color: #52675a; font-size: 19px; line-height: 1.75; }
.application-detail-cards { display: grid; gap: 16px; margin-top: 34px; }
.application-detail-card {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr);
    gap: 22px;
    align-items: start;
    margin: 0;
    padding: 28px;
    border: 1px solid #dce7df;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(20,67,39,.045);
}
.application-detail-card > span { display: flex; width: 52px; height: 52px; align-items: center; justify-content: center; border-radius: 16px; color: #164f2d; background: #e9f3df; font: 600 20px/1 'Noto Sans', sans-serif; }
.application-detail-card h3 { margin: 1px 0 9px; color: #173e27; font-size: 24px; line-height: 1.25; }
.application-detail-card p { margin: 0; color: #65766c; font-size: 16px; line-height: 1.68; }
.application-essentials {
    position: -webkit-sticky;
    position: sticky;
    top: 24px;
    padding: 35px;
    border-radius: 26px 26px 6px 26px;
    color: #fff;
    background: #164f2d;
    box-shadow: 0 24px 55px rgba(14,65,37,.16);
}
.application-essentials > span { color: #b7dc63; }
.application-essentials h3 { margin: 11px 0 23px; color: #fff; font-size: 29px; line-height: 1.22; }
.application-essentials ul { margin: 0 0 26px; padding: 0; list-style: none; }
.application-essentials li { display: flex; gap: 12px; padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,.13); color: rgba(255,255,255,.87); font-size: 15px; line-height: 1.5; }
.application-essentials li i { flex: 0 0 auto; margin-top: 4px; color: #b7dc63; }
.application-essentials > a { display: inline-flex; gap: 10px; align-items: center; color: #fff; font-size: 15px; font-weight: 700; text-decoration: none; }
.application-essentials > a:hover,
.application-essentials > a:focus { color: #b7dc63; }

/* Navigation: desktop ----------------------------------------------------- */
.mobile-mega-toggle { display: none; }
.mobile-nav-backdrop { display: none; }
@media (min-width: 992px) {
    .arajel-page .header-con {
        position: absolute !important;
        top: 17px !important;
        min-height: 0 !important;
        padding: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }
    .arajel-page .header-con .navbar { min-height: 0 !important; }
}

/* Navigation: tablet and mobile ----------------------------------------- */
@media (max-width: 991.98px) {
    body.mobile-nav-open { overflow: hidden !important; }
    .mobile-nav-backdrop {
        position: fixed;
        inset: 0;
        z-index: 1190;
        display: none;
        width: 100%;
        height: 100%;
        padding: 0;
        border: 0;
        background: rgba(5,35,20,.58);
        touch-action: none;
        -webkit-backdrop-filter: blur(3px);
        backdrop-filter: blur(3px);
    }
    body.mobile-nav-open .mobile-nav-backdrop { display: block; }
    .header-con,
    .arajel-page .header-con {
        position: relative !important;
        top: 0 !important;
        z-index: 1200 !important;
        min-height: 78px !important;
        padding: 0 !important;
        background: #164f2d !important;
        box-shadow: 0 8px 28px rgba(5,47,25,.16) !important;
    }
    .header-con .wrapper { width: 100% !important; max-width: none !important; padding: 0 18px !important; }
    .header-con .navbar { position: relative; min-height: 78px !important; padding: 10px 0 !important; align-items: center !important; }
    .header-con .navbar-brand { display: flex !important; align-items: center !important; margin: 0 !important; padding: 0 !important; }
    .header-con .navbar-brand img { display: block !important; width: auto !important; max-width: 134px !important; max-height: 52px !important; opacity: 1 !important; visibility: visible !important; }
    .header-con .navbar-toggler {
        position: relative !important;
        inset: auto !important;
        display: flex !important;
        flex: 0 0 46px !important;
        flex-direction: column !important;
        justify-content: center !important;
        align-items: center !important;
        width: 46px !important;
        height: 46px !important;
        margin: 0 0 0 auto !important;
        padding: 0 !important;
        border: 1px solid #dbe8dd !important;
        border-radius: 14px !important;
        background: #f6faf3 !important;
        box-shadow: 0 6px 18px rgba(4,42,23,.16) !important;
    }
    .header-con .navbar-toggler-icon {
        position: relative !important;
        top: auto !important;
        left: auto !important;
        display: block !important;
        float: none !important;
        width: 22px !important;
        height: 2px !important;
        margin: 3px 0 !important;
        border: 0 !important;
        border-radius: 2px !important;
        background: #164f2d !important;
        visibility: visible !important;
        transition: transform .24s ease, opacity .18s ease !important;
    }
    .header-con .navbar-toggler:not(.collapsed) .navbar-toggler-icon:nth-child(1) { position: absolute !important; transform: rotate(45deg) !important; }
    .header-con .navbar-toggler:not(.collapsed) .navbar-toggler-icon:nth-child(2) { opacity: 0 !important; }
    .header-con .navbar-toggler:not(.collapsed) .navbar-toggler-icon:nth-child(3) { position: absolute !important; transform: rotate(-45deg) !important; }
    .header-con .navbar-collapse,
    .header-con .navbar-collapse.collapsing {
        position: fixed !important;
        top: 88px !important;
        left: 12px !important;
        right: 12px !important;
        width: auto !important;
        max-width: 560px !important;
        max-height: calc(100vh - 104px) !important;
        max-height: calc(100dvh - 104px - env(safe-area-inset-bottom)) !important;
        margin: 0 auto !important;
        padding: 14px 14px calc(14px + env(safe-area-inset-bottom)) !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch;
        touch-action: pan-y;
        overscroll-behavior: contain;
        border: 1px solid rgba(22,79,45,.13) !important;
        border-radius: 22px !important;
        background: #fff !important;
        box-shadow: 0 28px 75px rgba(4,39,21,.3) !important;
        z-index: 1210 !important;
    }
    .header-con .navbar-collapse.collapsing { display: block !important; transition: height .22s ease !important; }
    .header-con .arajel-main-nav { display: block !important; width: 100% !important; margin: 0 !important; padding: 0 !important; }
    .header-con .arajel-main-nav > .nav-item { position: relative !important; width: 100% !important; margin: 0 0 5px !important; padding: 0 !important; }
    .header-con .navbar-light .arajel-main-nav > .nav-item > .nav-link {
        display: flex !important;
        width: 100% !important;
        min-height: 48px !important;
        align-items: center !important;
        margin: 0 !important;
        padding: 13px 15px !important;
        border-radius: 12px !important;
        color: #173e27 !important;
        background: transparent !important;
        font-family: 'Noto Sans', sans-serif !important;
        font-size: 15px !important;
        line-height: 20px !important;
        font-weight: 600 !important;
        text-decoration: none !important;
    }
    .header-con .arajel-main-nav > .nav-item.active > .nav-link,
    .header-con .arajel-main-nav > .nav-item > .nav-link:hover,
    .header-con .arajel-main-nav > .nav-item > .nav-link:focus { color: #4f852c !important; background: #edf5e8 !important; }
    .header-con .arajel-main-nav > .nav-item > .nav-link::after { display: none !important; }
    .header-con .knowledge-mega-item > .nav-link { padding-right: 56px !important; }
    .header-con .mobile-mega-toggle {
        position: absolute;
        top: 5px;
        right: 5px;
        z-index: 3;
        display: flex;
        width: 44px;
        height: 44px;
        align-items: center;
        justify-content: center;
        padding: 0;
        border: 0;
        border-radius: 10px;
        color: #315d3f;
        background: #eaf3e5;
        cursor: pointer;
    }
    .header-con .mobile-mega-toggle i { transition: transform .22s ease; }
    .header-con .mobile-mega-toggle[aria-expanded="true"] i { transform: rotate(180deg); }
    .header-con .knowledge-mega-menu {
        position: static !important;
        display: none !important;
        width: 100% !important;
        max-width: none !important;
        max-height: none !important;
        margin: 7px 0 4px !important;
        padding: 9px !important;
        overflow: visible !important;
        border: 1px solid #e0eadf !important;
        border-radius: 14px !important;
        background: #f6f9f5 !important;
        box-shadow: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        transform: none !important;
    }
    .header-con .knowledge-mega-item.mobile-mega-open > .knowledge-mega-menu { display: block !important; }
    .header-con .knowledge-mega-menu::before { display: none !important; }
    .header-con .mega-menu-grid { display: block !important; width: 100% !important; margin: 0 !important; padding: 0 !important; }
    .header-con .mega-menu-column { display: block !important; width: 100% !important; max-width: none !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; border: 0 !important; }
    .header-con .mega-menu-column + .mega-menu-column { margin-top: 8px !important; padding-top: 8px !important; border-top: 1px solid #e0e9df !important; }
    .header-con .mega-menu-column h4 { margin: 0 !important; padding: 8px 10px 5px !important; border: 0 !important; color: #709d47 !important; font-size: 11px !important; line-height: 1.3 !important; font-weight: 700 !important; letter-spacing: .8px !important; text-transform: uppercase !important; }
    .header-con .mega-menu-link {
        display: grid !important;
        grid-template-columns: 34px minmax(0,1fr) !important;
        gap: 10px !important;
        align-items: center !important;
        min-height: 48px !important;
        margin: 2px 0 !important;
        padding: 8px 9px !important;
        border-radius: 10px !important;
        color: #173e27 !important;
        background: transparent !important;
        text-decoration: none !important;
        transform: none !important;
    }
    .header-con .mega-menu-link:hover,
    .header-con .mega-menu-link:focus { background: #eaf3e5 !important; }
    .header-con .mega-menu-icon { display: flex !important; width: 34px !important; height: 34px !important; align-items: center !important; justify-content: center !important; border-radius: 10px !important; color: #4f852c !important; background: #e6f0df !important; font-size: 13px !important; }
    .header-con .mega-menu-copy { min-width: 0 !important; }
    .header-con .mega-menu-copy strong { display: block !important; margin: 0 !important; color: #173e27 !important; font-size: 14px !important; line-height: 1.3 !important; font-weight: 600 !important; }
    .header-con .mega-menu-copy small { display: block !important; margin-top: 2px !important; color: #718078 !important; font-size: 11px !important; line-height: 1.3 !important; font-weight: 400 !important; }
    .header-con .header-action-group { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 8px !important; width: 100% !important; margin: 10px 0 0 !important; padding: 10px 0 0 !important; border-top: 1px solid #e3ebe5 !important; }
    .header-con .header-action-group .generic-btn { width: 100% !important; margin: 0 !important; }
    .header-con .header-action-group .generic-btn a { display: flex !important; width: 100% !important; min-height: 46px !important; align-items: center !important; justify-content: center !important; padding: 11px 8px !important; border: 1px solid #dce7df !important; border-radius: 11px !important; font-size: 13px !important; line-height: 1.2 !important; }
    .header-con .header-action-group .header-buy-btn a { border-color: #94c22e !important; color: #fff !important; background: #94c22e !important; }
    .header-con .header-action-group .header-contact-btn a { color: #173e27 !important; background: #f5f8f6 !important; }
    .header-con .header-action-group .generic-btn a::after { display: none !important; }

    .site-inner-hero { min-height: 0; padding: 56px 0 62px; }
    .site-inner-hero .wrapper { width: min(100% - 36px, 700px); }
    .site-inner-hero-grid { display: block; }
    .site-inner-hero-image { display: none; }
    .site-inner-breadcrumb { margin-bottom: 20px; font-size: 14px; }
    .site-inner-hero h1 { font-size: clamp(42px, 9vw, 58px); }
    .site-inner-hero-line { width: min(240px, 65%); margin-top: 20px; }

    .arajel-page .ap-product-intro-grid { grid-template-columns: 1fr; gap: 42px; }
    .ap-product-intro-media { min-height: 410px; }
    .technical-fact-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .application-detail-layout { grid-template-columns: 1fr; gap: 32px; }
    .application-essentials { position: static; }
}

@media (max-width: 767.98px) {
    .ap-product-intro-copy h2 { font-size: 39px; }
    .ap-product-intro-copy > p { font-size: 16px; line-height: 1.65; }
    .ap-product-intro-media { min-height: 340px; border-radius: 24px 24px 5px 24px; }
    .ap-product-intro-media figcaption { left: 13px; right: 13px; bottom: 13px; grid-template-columns: 1fr; gap: 3px; padding: 14px; }
    .ap-product-intro-media figcaption strong { font-size: 23px; }
    .technical-overview { padding: 72px 0 78px; }
    .technical-fact-grid { grid-template-columns: 1fr; }
    .technical-fact-grid article { min-height: 0; }
    .technical-report { padding: 76px 0 86px; }
    .technical-report-head { display: block; }
    .technical-report-button { margin-top: 22px; }
    .technical-table-shell { border-radius: 18px; }
    .technical-report-table th { padding: 18px 19px; font-size: 12px; }
    .technical-report-table td { padding: 17px 19px; font-size: 14px; }
    .application-detail-section { padding: 74px 0 84px; }
    .application-detail-heading h2 { font-size: 39px; }
    .application-detail-heading p { font-size: 16px; line-height: 1.68; }
    .application-detail-card { grid-template-columns: 46px minmax(0,1fr); gap: 16px; padding: 22px 20px; }
    .application-detail-card > span { width: 44px; height: 44px; border-radius: 13px; font-size: 18px; }
    .application-detail-card h3 { font-size: 21px; }
    .application-essentials { padding: 28px 24px; border-radius: 22px 22px 5px 22px; }
}

@media (max-width: 420px) {
    .header-con .wrapper { padding: 0 14px !important; }
    .header-con .navbar-brand img { max-width: 124px !important; }
    .header-con .navbar-collapse,
    .header-con .navbar-collapse.collapsing { top: 86px !important; left: 8px !important; right: 8px !important; padding: 11px !important; border-radius: 19px !important; }
    .header-con .mega-menu-copy small { display: none !important; }
    .header-con .header-action-group { grid-template-columns: 1fr !important; }
    .site-inner-hero .wrapper { width: calc(100% - 28px); }
    .site-inner-hero h1 { font-size: 40px; }
    .ap-product-intro-copy h2,
    .application-detail-heading h2 { font-size: 35px; }
    .technical-section-heading h2,
    .technical-report-head h2 { font-size: 39px; }
    .technical-fact-grid article { padding-left: 76px; }
    .technical-fact-grid article i { left: 20px; }
}

@media (prefers-reduced-motion: reduce) {
    .site-inner-hero-image img,
    .header-con .navbar-toggler-icon,
    .header-con .mobile-mega-toggle i,
    .technical-report-button { transition: none !important; }
}

/* 2026-08-04 visual refinement: titles, premium cards and section rhythm. */
body > main h1,
body > main h2,
body > main h3,
body > section:not(.footer-con) h1,
body > section:not(.footer-con) h2,
body > section:not(.footer-con) h3 {
    text-transform: capitalize;
}
.no-titlecase { text-transform: none !important; }

/* Show the complete package instead of cropping it behind the caption. */
.ap-product-intro-media {
    display: flex;
    min-height: 0;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid rgba(22,79,45,.12);
    background: rgba(255,255,255,.88);
}
.ap-product-intro-media > img {
    position: relative;
    inset: auto;
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
}
.ap-product-intro-media figcaption {
    position: relative;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    margin: 0;
    border: 0;
    border-top: 1px solid rgba(255,255,255,.18);
    border-radius: 0;
    background: linear-gradient(135deg, #124a29, #0c3b21);
}

/* Product identity cards. */
.ap-overview { position: relative; overflow: hidden; background: radial-gradient(circle at 12% 10%, rgba(148,194,46,.10), transparent 30%), #fff; }
.ap-overview .ap-spec-grid { gap: 22px; }
.ap-overview .ap-spec {
    position: relative;
    min-height: 210px;
    overflow: hidden;
    padding: 30px 28px;
    border: 1px solid rgba(255,255,255,.9);
    border-radius: 25px;
    background: linear-gradient(145deg, rgba(255,255,255,.96), rgba(233,243,236,.78));
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
    box-shadow: 0 18px 48px rgba(20,67,39,.10), inset 0 1px 0 rgba(255,255,255,.9);
    transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}
.ap-overview .ap-spec::before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    content: "";
    background: linear-gradient(90deg, #94c22e, #4d8a3b, transparent 92%);
}
.ap-overview .ap-spec::after {
    position: absolute;
    right: -52px;
    bottom: -62px;
    width: 145px;
    height: 145px;
    content: "";
    border-radius: 50%;
    background: radial-gradient(circle, rgba(148,194,46,.18), transparent 68%);
    pointer-events: none;
}
.ap-overview .ap-spec:hover { transform: translateY(-7px); border-color: rgba(116,171,62,.35); box-shadow: 0 28px 62px rgba(20,67,39,.16); }
.ap-overview .ap-spec i {
    position: relative;
    z-index: 1;
    width: 54px;
    height: 54px;
    margin-bottom: 28px;
    border: 1px solid rgba(148,194,46,.24);
    border-radius: 17px;
    background: linear-gradient(145deg, #f2f8eb, #dceccb);
    box-shadow: 0 10px 22px rgba(79,134,45,.12);
}
.ap-overview .ap-spec small,
.ap-overview .ap-spec strong { position: relative; z-index: 1; }

/* Benefit cards use a soft glass surface and a stronger information panel. */
.ap-benefits {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at 12% 18%, rgba(148,194,46,.13), transparent 28%),
        radial-gradient(circle at 88% 78%, rgba(50,120,76,.12), transparent 30%),
        linear-gradient(135deg, #edf5f0, #f8faf9) !important;
}
.ap-benefit-list { gap: 22px; }
.ap-benefit-list article {
    position: relative;
    min-height: 168px;
    overflow: hidden;
    padding: 28px;
    border: 1px solid rgba(255,255,255,.92);
    border-radius: 24px;
    background: rgba(255,255,255,.70);
    -webkit-backdrop-filter: blur(15px);
    backdrop-filter: blur(15px);
    box-shadow: 0 18px 45px rgba(20,67,39,.09), inset 0 1px 0 #fff;
    transition: transform .28s ease, box-shadow .28s ease;
}
.ap-benefit-list article::after {
    position: absolute;
    right: -45px;
    bottom: -55px;
    width: 130px;
    height: 130px;
    content: "";
    border-radius: 50%;
    background: radial-gradient(circle, rgba(148,194,46,.14), transparent 70%);
}
.ap-benefit-list article:hover { transform: translateY(-6px); box-shadow: 0 27px 58px rgba(20,67,39,.14); }
.ap-benefit-list article > i { position: relative; z-index: 1; width: 50px; height: 50px; border-radius: 16px; background: linear-gradient(145deg, #edf6e5, #dbeccb); box-shadow: 0 9px 20px rgba(79,134,45,.12); }
.ap-benefit-list article > div { position: relative; z-index: 1; }
.ap-note {
    position: relative;
    overflow: hidden;
    padding: 38px !important;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 26px !important;
    background: linear-gradient(145deg, rgba(22,79,45,.98), rgba(9,55,29,.98)) !important;
    box-shadow: 0 27px 65px rgba(12,59,33,.22) !important;
}
.ap-note::after { position: absolute; right: -70px; bottom: -80px; width: 190px; height: 190px; content: ""; border: 1px solid rgba(185,223,102,.18); border-radius: 50%; }

/* Technical cards: expanded 4-column glass grid. */
.technical-overview {
    background:
        radial-gradient(circle at 8% 15%, rgba(148,194,46,.12), transparent 26%),
        radial-gradient(circle at 92% 85%, rgba(37,111,68,.11), transparent 27%),
        #eef5f0;
}
.technical-fact-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.technical-fact-grid article {
    min-height: 174px;
    overflow: hidden;
    padding: 29px 24px 26px 82px;
    border: 1px solid rgba(255,255,255,.94);
    border-radius: 24px;
    background: linear-gradient(145deg, rgba(255,255,255,.86), rgba(237,246,240,.72));
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
    box-shadow: 0 17px 42px rgba(20,67,39,.09), inset 0 1px 0 #fff;
    transition: transform .26s ease, box-shadow .26s ease;
}
.technical-fact-grid article::before { position: absolute; top: 0; left: 0; width: 100%; height: 3px; content: ""; background: linear-gradient(90deg, #94c22e, #4f862d, transparent 85%); }
.technical-fact-grid article::after { position: absolute; right: -42px; bottom: -50px; width: 120px; height: 120px; content: ""; border-radius: 50%; background: radial-gradient(circle, rgba(148,194,46,.13), transparent 70%); }
.technical-fact-grid article:hover { transform: translateY(-6px); box-shadow: 0 26px 58px rgba(20,67,39,.15); }
.technical-fact-grid article i { z-index: 1; border: 1px solid rgba(148,194,46,.22); background: linear-gradient(145deg, #f0f7e9, #dceccb); box-shadow: 0 9px 19px rgba(79,134,45,.11); }
.technical-fact-grid article span,
.technical-fact-grid article strong { position: relative; z-index: 1; }

/* Shared content cards receive the same polished design language. */
.application-detail-card,
.knowledge-card,
.service-blog-con .blog-box-item {
    border: 1px solid rgba(214,229,219,.96) !important;
    border-radius: 24px !important;
    background: linear-gradient(145deg, rgba(255,255,255,.97), rgba(240,247,242,.91)) !important;
    box-shadow: 0 17px 42px rgba(20,67,39,.08) !important;
    transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease !important;
}
.application-detail-card:hover,
.knowledge-card:hover,
.service-blog-con .blog-box-item:hover { transform: translateY(-7px); border-color: rgba(116,171,62,.42) !important; box-shadow: 0 28px 60px rgba(20,67,39,.14) !important; }
.application-detail-card { position: relative; overflow: hidden; }
.application-detail-card::before { position: absolute; top: 0; left: 0; width: 4px; height: 100%; content: ""; background: linear-gradient(#94c22e, #39794a); }
.service-blog-con .blog-box-img > figure img { border-radius: 23px 23px 0 0 !important; }
.service-blog-con .blog-box-content { border-bottom: 0; padding-bottom: 32px; }

/* FAQ shelf spacing: reserve room for the 79px potted-plant image. */
.home-faq-section .padding-bottom,
.arajel-page .arajel-about-faq .padding-bottom { padding-bottom: 165px !important; }

/* Knowledge-center CTA is now a true full-width green band. */
.knowledge-cta {
    position: relative;
    clear: both;
    width: 100%;
    overflow: hidden;
    padding: clamp(78px, 7vw, 112px) 0 !important;
    background: linear-gradient(120deg, #103f24, #176038) !important;
}
.knowledge-cta::before { position: absolute; inset: 0; content: ""; opacity: .2; background: radial-gradient(circle at 85% 15%, rgba(185,223,102,.55), transparent 25%), linear-gradient(115deg, rgba(255,255,255,.08), transparent 35%); }
.knowledge-cta .container { position: relative; z-index: 1; }
.knowledge-cta-box {
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}
.knowledge-cta-box h2 { max-width: 930px; font-size: clamp(42px, 4.2vw, 64px); line-height: 1.08; }
.knowledge-cta-box p { max-width: 930px; font-size: 18px; line-height: 1.65; }
.knowledge-cta-box .generic-btn a { min-width: 160px; padding: 17px 22px; border-radius: 13px; text-align: center; box-shadow: 0 16px 30px rgba(7,40,22,.18); }
.knowledge-cta-box > div > span { color: #b9df66; }
.knowledge-cta-box h2,
.knowledge-cta-box p { color: #fff; }

/* FAQ cards share the same glass-and-depth language as the product cards. */
.home-faq-section .faq-box .card {
    overflow: hidden;
    margin-bottom: 14px;
    border: 1px solid rgba(64,112,72,.14);
    border-radius: 18px;
    background: linear-gradient(145deg, rgba(255,255,255,.98), rgba(246,251,247,.92));
    box-shadow: 0 14px 34px rgba(18,62,37,.08);
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.home-faq-section .faq-box .card:hover { transform: translateY(-2px); border-color: rgba(148,194,46,.38); box-shadow: 0 19px 42px rgba(18,62,37,.12); }
.home-faq-section .faq-box .card-header { border: 0; background: transparent; }
.home-faq-section .faq-box .card-body { border-top: 1px solid rgba(64,112,72,.1); background: rgba(255,255,255,.46); }

/* The legacy theme pulled footers 154px over these cards. Keep a clean gap. */
.application-detail-section { padding-bottom: 150px; }
.application-detail-main + .footer-con {
    position: relative;
    clear: both;
    margin-top: 0 !important;
    padding-top: clamp(82px, 7vw, 112px) !important;
}

@media (max-width: 1199.98px) and (min-width: 992px) {
    .site-inner-hero { min-height: 0; padding: 64px 0 70px; }
    .site-inner-hero .wrapper { width: min(100% - 48px, 940px); }
    .site-inner-hero-grid { display: block; }
    .site-inner-hero-image { display: none; }
    .technical-fact-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 991.98px) {
    .sub-banner.mobile-compact-banner {
        min-height: 0 !important;
        padding: 56px 0 62px !important;
    }
    .sub-banner.mobile-compact-banner .wrapper { width: min(100% - 36px, 700px) !important; }
    .sub-banner.mobile-compact-banner .sub-banner-inner-con { display: block !important; min-height: 0 !important; }
    .sub-banner.mobile-compact-banner .sub-banner-img { display: none !important; }
    .sub-banner.mobile-compact-banner .sub-banner-title { width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; }
    .sub-banner.mobile-compact-banner .breadcrum { margin-bottom: 22px !important; }
    .sub-banner.mobile-compact-banner h1 { max-width: 680px; font-size: clamp(42px, 9vw, 58px) !important; line-height: 1.04 !important; }
    .technical-fact-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .knowledge-cta-box { align-items: flex-start !important; }
}

@media (max-width: 767.98px) {
    .ap-product-intro-media { min-height: 0; }
    .ap-product-intro-media figcaption { grid-template-columns: 1fr; }
    .ap-overview .ap-spec { min-height: 0; }
    .technical-fact-grid { grid-template-columns: 1fr; }
    .technical-fact-grid article { min-height: 0; }
    .home-faq-section .padding-bottom,
    .arajel-page .arajel-about-faq .padding-bottom { padding-bottom: 110px !important; }
    .knowledge-cta-box h2 { font-size: 39px; }
    .application-detail-section { padding-bottom: 105px; }
}

@media (max-width: 575.98px) {
    .home-faq-section .padding-bottom,
    .arajel-page .arajel-about-faq .padding-bottom { padding-bottom: 74px !important; }
}



/* =========================================================
   ARAJEL refinements - 2026-08-20
   Typography, stable hovers, application rates, contact map,
   WhatsApp support widget and small consistency fixes.
   ========================================================= */

/* 1) Satış/destek bandı: hover sırasında arka plan ve geometri değişmez. */
.arajel-sales-strip ul li,
.arajel-sales-strip ul li:hover {
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
}
.arajel-sales-strip a,
.arajel-sales-strip a:hover,
.arajel-sales-strip a:focus {
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    text-decoration: none !important;
}
.arajel-sales-strip a:hover i,
.arajel-sales-strip a:focus i,
.arajel-sales-strip a:hover strong,
.arajel-sales-strip a:focus strong,
.arajel-sales-strip a:hover span,
.arajel-sales-strip a:focus span {
    color: inherit;
}
.arajel-sales-strip a i { color: var(--green-color) !important; }
.arajel-sales-strip a strong { color: var(--primary--color) !important; }
.arajel-sales-strip a span { color: #6a796f !important; }
.arajel-sales-strip a:focus-visible {
    outline: 2px solid rgba(23,79,44,.42);
    outline-offset: -5px;
    border-radius: 14px;
}

/* 2) Satın alma sayfası: sitenin ana metin ailesi olan Assistant ile tek tip tipografi. */
.purchase-channel-section,
.purchase-professional,
.checkout-sales-strip {
    font-family: 'Noto Sans', sans-serif !important;
}
.purchase-channel-section h1,
.purchase-channel-section h2,
.purchase-channel-section h3,
.purchase-channel-section h4,
.purchase-channel-section h5,
.purchase-channel-section h6,
.purchase-channel-section strong,
.purchase-channel-section b,
.purchase-professional h1,
.purchase-professional h2,
.purchase-professional h3,
.purchase-professional h4,
.purchase-professional h5,
.purchase-professional h6,
.purchase-professional label,
.purchase-professional input,
.purchase-professional select,
.purchase-professional textarea,
.purchase-professional button,
.purchase-professional strong,
.purchase-professional b,
.purchase-professional .purchase-section-title span,
.purchase-professional .summary-topbar > div span,
.checkout-sales-strip strong,
.checkout-sales-strip span {
    font-family: 'Noto Sans', sans-serif !important;
}
.purchase-channel-heading h2,
.purchase-professional .purchase-intro h2 {
    font-weight: 700;
    letter-spacing: -.5px;
}
.purchase-channel-card h3,
.purchase-card-heading h3,
.purchase-section-title span,
.summary-topbar > div span {
    font-weight: 700 !important;
}

/* 3) Uygulama oranları */
.application-rate-panel {
    position: relative;
    overflow: hidden;
    margin-top: 26px;
    padding: 30px;
    border: 1px solid #d7e5db;
    border-radius: 24px;
    background: linear-gradient(145deg, #ffffff 0%, #f2f8f3 100%);
    box-shadow: 0 18px 44px rgba(20,67,39,.08);
}
.application-rate-panel::after {
    position: absolute;
    right: -55px;
    top: -55px;
    width: 150px;
    height: 150px;
    border-radius: 50%;
    content: '';
    pointer-events: none;
    background: radial-gradient(circle, rgba(148,194,46,.16), rgba(148,194,46,0) 70%);
}
.application-rate-heading { position: relative; z-index: 1; max-width: 760px; }
.application-rate-heading > span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 9px;
    color: #6d9947;
    font-size: 12px;
    line-height: 1.3;
    font-weight: 700;
    letter-spacing: .8px;
    text-transform: uppercase;
}
.application-rate-heading h3 {
    margin: 0 0 10px;
    color: #173e27;
    font-size: 28px;
    line-height: 1.2;
}
.application-rate-heading p {
    margin: 0;
    color: #65766c;
    font-size: 15px;
    line-height: 1.65;
}
.application-rate-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 12px;
    margin-top: 24px;
}
.application-rate-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    min-height: 78px;
    padding: 15px 17px;
    border: 1px solid #dce8df;
    border-radius: 15px;
    background: rgba(255,255,255,.88);
}
.application-rate-item > div { min-width: 0; }
.application-rate-item strong {
    display: block;
    color: #244936;
    font-size: 15px;
    line-height: 1.35;
}
.application-rate-item small {
    display: block;
    margin-top: 5px;
    color: #7a887f;
    font-size: 11px;
    line-height: 1.4;
}
.application-rate-item > span {
    flex: 0 0 auto;
    padding: 8px 11px;
    border-radius: 10px;
    color: #164f2d;
    background: #eaf4e2;
    font-size: 13px;
    line-height: 1.2;
    font-weight: 700;
    text-align: center;
}
.application-rate-notice {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin-top: 16px;
    padding: 12px 14px;
    border-radius: 12px;
    color: #5d6f64;
    background: #edf5ef;
    font-size: 12px;
    line-height: 1.5;
}
.application-rate-notice i { flex: 0 0 auto; margin-top: 3px; color: #739d51; }

/* 4) Bize Ulaşın */
.contact-professional-section {
    position: relative;
    overflow: hidden;
    background: linear-gradient(180deg, #f4f8f6 0%, #edf5f1 100%) !important;
}
.contact-professional-section::before {
    position: absolute;
    top: -160px;
    right: -160px;
    width: 420px;
    height: 420px;
    border-radius: 50%;
    content: '';
    background: radial-gradient(circle, rgba(148,194,46,.16), rgba(148,194,46,0) 70%);
    pointer-events: none;
}
.contact-professional-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(330px,.86fr) minmax(0,1.25fr);
    gap: 28px;
    align-items: stretch;
}
.contact-info-card,
.contact-form-card {
    min-width: 0;
    border-radius: 28px;
    box-shadow: 0 24px 65px rgba(20,67,39,.11);
}
.contact-info-card {
    padding: 38px 34px;
    color: #fff;
    background: linear-gradient(145deg, #123f25 0%, #1d6037 100%);
}
.contact-card-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 17px;
    color: #c7e68b;
    font-size: 12px;
    line-height: 1.2;
    font-weight: 700;
    letter-spacing: .8px;
    text-transform: uppercase;
}
.contact-info-card h2,
.contact-form-card h2,
.contact-map-copy h2 {
    font-family: 'Noto Sans', sans-serif !important;
    font-weight: 700;
}
.contact-info-card h2 { margin: 0 0 15px; color: #fff; font-size: 34px; line-height: 1.16; }
.contact-info-card > p { margin: 0; color: rgba(255,255,255,.72); font-size: 15px; line-height: 1.7; }
.contact-info-list { display: grid; gap: 10px; margin-top: 28px; }
.contact-info-row {
    position: relative;
    display: grid;
    grid-template-columns: 44px minmax(0,1fr) 18px;
    gap: 12px;
    align-items: center;
    min-height: 72px;
    padding: 12px 12px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 16px;
    color: #fff !important;
    background: rgba(255,255,255,.07);
    text-decoration: none !important;
}
.contact-info-row > span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 13px;
    color: #173f28;
    background: #c6e681;
}
.contact-info-row div { min-width: 0; }
.contact-info-row small,
.contact-info-row strong { display: block; }
.contact-info-row small { margin-bottom: 3px; color: rgba(255,255,255,.6); font-size: 11px; line-height: 1.2; }
.contact-info-row strong { color: #fff; font-size: 14px; line-height: 1.45; font-weight: 600; overflow-wrap: anywhere; }
.contact-row-arrow { color: rgba(255,255,255,.42); font-size: 10px; transform: rotate(45deg); }
.contact-support-note {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 22px;
    padding-top: 20px;
    border-top: 1px solid rgba(255,255,255,.12);
    color: rgba(255,255,255,.72);
    font-size: 12px;
    line-height: 1.45;
}
.contact-support-note i { color: #c8e887; font-size: 18px; }
.contact-form-card {
    padding: 38px;
    border: 1px solid rgba(22,76,42,.08);
    background: #fff;
}
.contact-form-heading > span {
    display: block;
    margin-bottom: 8px;
    color: #75a14d;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .8px;
    text-transform: uppercase;
}
.contact-form-heading h2 { margin: 0 0 8px; color: #173e27; font-size: 36px; line-height: 1.15; }
.contact-form-heading p { margin: 0; color: #708077; font-size: 14px; line-height: 1.6; }
.contact-form-professional { margin-top: 26px; }
.contact-field-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 17px; }
.contact-field { display: block; margin: 0; }
.contact-field > span { display: block; margin-bottom: 7px; color: #3a5143; font-size: 12px; line-height: 1.3; font-weight: 700; }
.contact-field > div {
    position: relative;
    display: flex;
    align-items: center;
    border: 1.5px solid #dde8e0;
    border-radius: 13px;
    background: #fafcfb;
}
.contact-field > div > i { position: absolute; left: 15px; z-index: 1; color: #8c9c92; font-size: 13px; pointer-events: none; }
.contact-field input,
.contact-field textarea {
    width: 100% !important;
    margin: 0 !important;
    border: 0 !important;
    outline: 0 !important;
    border-radius: 13px !important;
    box-shadow: none !important;
    color: #344b3c !important;
    background: transparent !important;
    font-family: 'Noto Sans', sans-serif !important;
    font-size: 14px !important;
}
.contact-field input { min-height: 50px; padding: 12px 14px 12px 42px !important; }
.contact-field textarea { min-height: 125px; padding: 14px 14px 14px 42px !important; resize: vertical; }
.contact-field > div:focus-within { border-color: #78a64f; box-shadow: 0 0 0 4px rgba(120,166,79,.10); background: #fff; }
.contact-field-full { grid-column: 1/-1; }
.contact-textarea-wrap { align-items: flex-start !important; }
.contact-textarea-wrap > i { top: 18px; }
.contact-submit-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-width: 168px;
    min-height: 52px;
    margin-top: 18px;
    border-radius: 13px !important;
    color: #fff !important;
    background: #164f2d !important;
    font-family: 'Noto Sans', sans-serif !important;
    font-size: 14px !important;
    font-weight: 700;
    box-shadow: 0 14px 28px rgba(22,79,45,.18);
}
.contact-map-section { padding: 0 0 145px; background: #edf5f1; }
.contact-map-card {
    overflow: hidden;
    border: 1px solid #d9e6de;
    border-radius: 28px;
    background: #fff;
    box-shadow: 0 24px 65px rgba(20,67,39,.10);
}
.contact-map-copy {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 28px;
    padding: 28px 30px;
}
.contact-map-copy > div { max-width: 720px; }
.contact-map-copy > div > span { display: inline-flex; align-items: center; gap: 7px; margin-bottom: 8px; color: #72a04a; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .7px; }
.contact-map-copy h2 { margin: 0 0 7px; color: #173e27; font-size: 31px; line-height: 1.15; }
.contact-map-copy p { margin: 0; color: #6c7c72; font-size: 14px; line-height: 1.6; }
.contact-map-copy > a {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 12px 16px;
    border: 1px solid #d9e6dd;
    border-radius: 12px;
    color: #164f2d !important;
    background: #f4f8f5;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none !important;
}
.contact-map-frame { position: relative; height: 430px; border-top: 1px solid #e3ebe6; }
.contact-map-frame iframe { display: block; width: 100%; height: 100%; border: 0; filter: saturate(.86) contrast(1.02); }

/* 5) WhatsApp sabit destek bileşeni */
.arajel-whatsapp {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 2100;
    font-family: 'Noto Sans', sans-serif;
}
.arajel-whatsapp-trigger {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 62px;
    height: 62px;
    margin-left: auto;
    padding: 0;
    border: 0;
    border-radius: 50%;
    color: #fff;
    background: #1f9d55;
    box-shadow: 0 14px 34px rgba(16,94,48,.28);
    cursor: pointer;
}
.arajel-whatsapp-trigger > i { position: relative; z-index: 2; font-size: 30px; }
.arajel-whatsapp-pulse {
    position: absolute;
    inset: -5px;
    border: 1px solid rgba(31,157,85,.28);
    border-radius: 50%;
    animation: arajelWhatsappPulse 2.2s ease-out infinite;
}
@keyframes arajelWhatsappPulse {
    0% { transform: scale(.88); opacity: .75; }
    70%,100% { transform: scale(1.35); opacity: 0; }
}
.arajel-whatsapp-panel {
    position: absolute;
    right: 0;
    bottom: 76px;
    width: min(340px, calc(100vw - 32px));
    overflow: hidden;
    border: 1px solid rgba(22,76,42,.10);
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 24px 70px rgba(8,52,28,.22);
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px) scale(.98);
    transform-origin: bottom right;
    transition: opacity .2s ease, visibility .2s ease, transform .2s ease;
}
.arajel-whatsapp.is-open .arajel-whatsapp-panel { opacity: 1; visibility: visible; transform: none; }
.arajel-whatsapp-panel-head {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr) 30px;
    gap: 10px;
    align-items: center;
    padding: 16px;
    color: #fff;
    background: linear-gradient(135deg,#164f2d,#1f7040);
}
.arajel-whatsapp-avatar { display: flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 50%; color: #164f2d; background: #c8e889; font-size: 20px; }
.arajel-whatsapp-panel-head strong,
.arajel-whatsapp-panel-head small { display: block; }
.arajel-whatsapp-panel-head strong { color: #fff; font-size: 14px; line-height: 1.3; }
.arajel-whatsapp-panel-head small { margin-top: 2px; color: rgba(255,255,255,.7); font-size: 10px; line-height: 1.2; }
.arajel-whatsapp-close { display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; padding: 0; border: 0; border-radius: 9px; color: rgba(255,255,255,.8); background: rgba(255,255,255,.09); cursor: pointer; }
.arajel-whatsapp-panel-body { padding: 17px; }
.arajel-whatsapp-panel-body > p { margin: 0 0 14px; color: #5d6e63; font-size: 13px; line-height: 1.55; }
.arajel-whatsapp-form label { display: block; margin-bottom: 6px; color: #354d3d; font-size: 11px; line-height: 1.3; font-weight: 700; }
.arajel-whatsapp-input { position: relative; display: flex; align-items: center; }
.arajel-whatsapp-input > i { position: absolute; left: 13px; color: #88988e; font-size: 12px; pointer-events: none; }
.arajel-whatsapp-input input { width: 100%; height: 46px; padding: 10px 12px 10px 38px; border: 1.5px solid #dce7df; border-radius: 12px; outline: 0; color: #304638; background: #fafcfb; font: 400 13px/1.3 'Noto Sans',sans-serif; }
.arajel-whatsapp-input input:focus { border-color: #74a14d; box-shadow: 0 0 0 4px rgba(116,161,77,.10); background: #fff; }
.arajel-whatsapp-input input.is-invalid { border-color: #cf5252; box-shadow: 0 0 0 4px rgba(207,82,82,.08); }
.arajel-whatsapp-error { display: block; min-height: 16px; padding-top: 3px; color: #b43d3d; font-size: 10px; line-height: 1.3; }
.arajel-whatsapp-form button[type="submit"] { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 45px; margin-top: 5px; padding: 10px 13px; border: 0; border-radius: 12px; color: #fff; background: #1f9d55; font: 700 13px/1.2 'Noto Sans',sans-serif; cursor: pointer; }
.arajel-whatsapp-form button[type="submit"] i { font-size: 17px; }
.arajel-whatsapp-privacy { display: block; margin-top: 10px; color: #8a988f; font-size: 9.5px; line-height: 1.4; text-align: center; }

/* 6) FAQ sayfasında kendi sayfasına giden gereksiz buton yok; kartlar aynı veri setini kullanır. */
.faq-page-section .faq-box { margin-bottom: 0; }

@media (max-width: 991.98px) {
    .application-rate-grid { grid-template-columns: 1fr; }
    .contact-professional-grid { grid-template-columns: 1fr; }
    .contact-map-copy { align-items: flex-start; flex-direction: column; }
    .contact-map-frame { height: 390px; }
}

@media (max-width: 767.98px) {
    .arajel-sales-strip ul { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
    .arajel-sales-strip ul li { min-height: 112px !important; border-left: 0 !important; border-right: 1px solid #e0e8eb; border-bottom: 1px solid #e0e8eb; }
    .arajel-sales-strip ul li:nth-child(2n) { border-right: 0; }
    .arajel-sales-strip a { min-height: 112px; padding: 16px 10px; }
    .application-rate-panel { padding: 23px 20px; border-radius: 20px; }
    .application-rate-heading h3 { font-size: 24px; }
    .application-rate-item { align-items: flex-start; flex-direction: column; gap: 9px; }
    .application-rate-item > span { align-self: flex-start; }
    .contact-info-card,
    .contact-form-card { padding: 27px 22px; border-radius: 22px; }
    .contact-info-card h2,
    .contact-form-heading h2 { font-size: 30px; }
    .contact-field-grid { grid-template-columns: 1fr; }
    .contact-field-full { grid-column: auto; }
    .contact-map-section { padding-bottom: 110px; }
    .contact-map-copy { padding: 23px 20px; }
    .contact-map-copy h2 { font-size: 27px; }
    .contact-map-frame { height: 330px; }
    .arajel-whatsapp { right: 16px; bottom: 16px; }
    .arajel-whatsapp-trigger { width: 56px; height: 56px; }
    .arajel-whatsapp-trigger > i { font-size: 27px; }
    .arajel-whatsapp-panel { bottom: 68px; }
}

@media (max-width: 420px) {
    .arajel-sales-strip ul { grid-template-columns: 1fr !important; }
    .arajel-sales-strip ul li { border-right: 0 !important; }
    .contact-info-row { grid-template-columns: 40px minmax(0,1fr); }
    .contact-info-row > span { width: 40px; height: 40px; }
    .contact-row-arrow { display: none; }
}



/* =========================================================
   ARAJEL final polish — 2026-08-20
   Unified Unicode typography, application detail redesign,
   seamless logo/footer transition and AJAX contact states.
   ========================================================= */

/* 1) Site-wide multilingual typography
   Noto Sans covers Turkish and a broad Unicode range. Page-level h1 titles
   retain the condensed display character used by the original theme. */
html,
body {
    font-family: 'Noto Sans', Arial, sans-serif !important;
    font-synthesis: none;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}
body p,
body a,
body span,
body small,
body strong,
body b,
body label,
body button,
body input,
body textarea,
body select,
body option,
body th,
body td,
body h2,
body h3,
body h4,
body h5,
body h6 {
    font-family: 'Noto Sans', Arial, sans-serif !important;
}
body h1,
body .text-border,
body .site-inner-hero-copy h1,
body .ap-hero-copy h1 {
    font-family: 'Asap Condensed', 'Noto Sans', Arial, sans-serif !important;
}

/* Mega menu: parent context + exact child page are both obvious without
   changing size/weight during hover. */
.header-con .knowledge-mega-menu .mega-menu-link.is-current,
.header-con .knowledge-mega-menu .mega-menu-link.is-current:hover,
.header-con .knowledge-mega-menu .mega-menu-link.is-current:focus {
    background: #eef6e9 !important;
    color: #174f2c !important;
    transform: none !important;
    box-shadow: inset 3px 0 0 #94c22e !important;
}
.header-con .knowledge-mega-menu .mega-menu-link.is-current .mega-menu-icon {
    color: #174f2c !important;
    background: #dfeecd !important;
}
.header-con .knowledge-mega-menu .mega-menu-link.is-current .mega-menu-copy strong {
    color: #174f2c !important;
    font-weight: 600 !important;
}

/* 2) Sales/support strip: outer white void replaced with the same cool blue
   used by the logo/trust transition. Hover stays dimensionally stable. */
.checkout-sales-strip,
.arajel-sales-strip.checkout-sales-strip {
    clear: both;
    margin-top: 0 !important;
    padding: 72px 0 78px !important;
    background: #d6e0ea !important;
}
.checkout-sales-strip .container { position: relative; z-index: 2; }
.checkout-sales-strip ul {
    box-shadow: 0 24px 70px rgba(21, 56, 42, .13) !important;
}
.checkout-sales-strip ul li,
.checkout-sales-strip ul li:hover,
.checkout-sales-strip a,
.checkout-sales-strip a:hover,
.checkout-sales-strip a:focus {
    background: #f1f8f8 !important;
    transform: none !important;
}

/* 3) Logo/footer transition: no artificial flat green band. The lower half
   continues directly into the photographic footer texture. */
.knowledge-hub-section + .home-client-logos,
.home-client-logos,
.arajel-client-logos {
    position: relative !important;
    isolation: isolate;
    margin-top: 0 !important;
    padding: 70px 0 !important;
    overflow: visible !important;
    background:
        linear-gradient(to bottom, #d6e0ea 0%, #d6e0ea 50%, rgba(214,224,234,0) 50%, rgba(214,224,234,0) 100%),
        url('../images/footer-bg-img.jpg') center bottom / cover no-repeat !important;
}
.knowledge-hub-section + .home-client-logos::after,
.home-client-logos::after,
.arajel-client-logos::after {
    content: '';
    position: absolute;
    z-index: -1;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 2px;
    background: url('../images/footer-bg-img.jpg') center bottom / cover no-repeat;
    pointer-events: none;
}
.home-client-logos + .footer-con,
.arajel-client-logos + .footer-con {
    margin-top: 0 !important;
    padding-top: 78px !important;
    background-image: url('../images/footer-bg-img.jpg') !important;
    background-repeat: no-repeat !important;
    background-position: center top !important;
    background-size: cover !important;
}

/* 4) Application detail pages — wider, calmer, professional composition. */
.application-detail-main {
    background:
        radial-gradient(circle at 90% 7%, rgba(148,194,46,.09), transparent 28%),
        linear-gradient(180deg, #f7faf8 0%, #eef5f2 100%) !important;
}
.application-detail-section {
    padding: 92px 0 124px !important;
}
.application-detail-layout {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 350px) !important;
    gap: 28px !important;
    align-items: start !important;
}
.application-detail-content { min-width: 0; }
.application-detail-heading {
    position: relative;
    overflow: hidden;
    padding: clamp(30px, 4vw, 46px) !important;
    border: 1px solid #dce8e1 !important;
    border-radius: 30px !important;
    background: rgba(255,255,255,.92) !important;
    box-shadow: 0 24px 65px rgba(20,67,39,.08) !important;
}
.application-detail-heading::after {
    content: '';
    position: absolute;
    top: -90px;
    right: -85px;
    width: 220px;
    height: 220px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(148,194,46,.14), rgba(148,194,46,0) 70%);
    pointer-events: none;
}
.application-detail-eyebrow {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 14px;
    color: #6e9d49;
    font-size: 12px;
    line-height: 1.25;
    font-weight: 700;
    letter-spacing: .9px;
    text-transform: uppercase;
}
.application-detail-heading h2 {
    position: relative;
    z-index: 1;
    max-width: 880px !important;
    margin: 0 0 18px !important;
    color: #153e27 !important;
    font-size: clamp(35px, 3.15vw, 50px) !important;
    font-weight: 650 !important;
    line-height: 1.13 !important;
    letter-spacing: -.9px;
    overflow-wrap: normal !important;
}
.application-detail-heading > p {
    position: relative;
    z-index: 1;
    max-width: 920px !important;
    margin: 0 !important;
    color: #607269 !important;
    font-size: 17px !important;
    line-height: 1.8 !important;
}
.application-detail-principles {
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 26px;
}
.application-detail-principles span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 40px;
    padding: 9px 13px;
    border: 1px solid #dfeade;
    border-radius: 12px;
    color: #3e5a49;
    background: #f7faf7;
    font-size: 12.5px;
    line-height: 1.25;
    font-weight: 600;
}
.application-detail-principles i { color: #78a54e; }
.application-detail-cards {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 16px !important;
    margin-top: 18px !important;
}
.application-detail-card {
    grid-template-columns: 48px minmax(0,1fr) !important;
    gap: 16px !important;
    min-height: 100%;
    padding: 25px !important;
    border: 1px solid #dce7df !important;
    border-radius: 22px !important;
    box-shadow: 0 16px 38px rgba(20,67,39,.055) !important;
    transition: border-color .22s ease, box-shadow .22s ease !important;
}
.application-detail-card:hover {
    border-color: #cbdccf !important;
    box-shadow: 0 19px 45px rgba(20,67,39,.075) !important;
    transform: none !important;
}
.application-detail-card > span {
    width: 46px !important;
    height: 46px !important;
    border-radius: 14px !important;
    font-size: 17px !important;
    font-weight: 750 !important;
}
.application-detail-card h3 {
    margin: 0 0 9px !important;
    color: #173e27 !important;
    font-size: 19px !important;
    line-height: 1.35 !important;
    font-weight: 700 !important;
}
.application-detail-card p {
    color: #65766c !important;
    font-size: 14px !important;
    line-height: 1.72 !important;
}
.application-essentials {
    top: 22px !important;
    overflow: hidden;
    padding: 31px !important;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 28px !important;
    background: linear-gradient(155deg, #123d25 0%, #1b5b35 100%) !important;
    box-shadow: 0 24px 55px rgba(14,65,37,.16) !important;
}
.application-essentials::after {
    content: '';
    position: absolute;
    right: -75px;
    bottom: -75px;
    width: 180px;
    height: 180px;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 50%;
}
.application-essentials-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    margin-bottom: 20px;
    border-radius: 15px;
    color: #173f28;
    background: #c5e77f;
    font-size: 20px;
}
.application-essentials > span { font-size: 11px !important; letter-spacing: .9px !important; }
.application-essentials h3 {
    margin: 10px 0 18px !important;
    font-size: 24px !important;
    line-height: 1.3 !important;
    font-weight: 700 !important;
}
.application-essentials li {
    padding: 12px 0 !important;
    font-size: 13.5px !important;
    line-height: 1.55 !important;
}
.application-essentials > a {
    position: relative;
    z-index: 1;
    font-size: 13px !important;
}
.application-essentials-support {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 38px minmax(0,1fr);
    gap: 11px;
    align-items: center;
    margin-top: 24px;
    padding: 15px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 15px;
    background: rgba(255,255,255,.07);
}
.application-essentials-support > i {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 11px;
    color: #c5e77f;
    background: rgba(255,255,255,.08);
}
.application-essentials-support small,
.application-essentials-support a { display: block; }
.application-essentials-support small { margin-bottom: 2px; color: rgba(255,255,255,.58); font-size: 10px; }
.application-essentials-support a { color: #fff !important; font-size: 12px; line-height: 1.35; font-weight: 650; text-decoration: none !important; }

/* Full-container application rates. */
.application-rate-panel.application-rate-panel-full {
    width: 100% !important;
    max-width: none !important;
    margin: 32px 0 0 !important;
    padding: clamp(30px, 4vw, 46px) !important;
    border: 1px solid #d3e1d7 !important;
    border-radius: 30px !important;
    background: linear-gradient(145deg, #ffffff 0%, #f2f8f3 100%) !important;
    box-shadow: 0 24px 65px rgba(20,67,39,.08) !important;
}
.application-rate-panel-full .application-rate-heading {
    display: grid !important;
    grid-template-columns: minmax(0,.9fr) minmax(360px,1.1fr);
    gap: clamp(28px,5vw,72px);
    align-items: end;
    max-width: none !important;
}
.application-rate-panel-full .application-rate-heading > div { min-width: 0; }
.application-rate-panel-full .application-rate-heading h3 {
    max-width: 650px;
    margin: 0 !important;
    color: #173e27 !important;
    font-size: clamp(29px, 2.6vw, 40px) !important;
    line-height: 1.18 !important;
    font-weight: 650 !important;
    letter-spacing: -.6px;
}
.application-rate-panel-full .application-rate-heading > p {
    margin: 0 !important;
    padding-left: 22px;
    border-left: 2px solid #dbe8dc;
    color: #66786d !important;
    font-size: 14px !important;
    line-height: 1.72 !important;
}
.application-rate-panel-full .application-rate-grid {
    grid-template-columns: repeat(3, minmax(0,1fr)) !important;
    gap: 14px !important;
    margin-top: 30px !important;
}
.application-rate-panel-full .application-rate-item {
    display: block !important;
    min-height: 112px !important;
    padding: 19px !important;
    border-radius: 17px !important;
    background: rgba(255,255,255,.92) !important;
}
.application-rate-item-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}
.application-rate-item-top strong {
    min-width: 0;
    color: #244936 !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
    font-weight: 700 !important;
}
.application-rate-item-top > span {
    flex: 0 0 auto;
    padding: 8px 11px;
    border-radius: 10px;
    color: #164f2d;
    background: #eaf4e2;
    font-size: 12px;
    line-height: 1.25;
    font-weight: 750;
    text-align: center;
}
.application-rate-panel-full .application-rate-item > small {
    display: block;
    margin-top: 12px !important;
    padding-top: 11px;
    border-top: 1px solid #e5ece7;
    color: #7a887f !important;
    font-size: 10.5px !important;
    line-height: 1.5 !important;
}
.application-rate-panel-full .application-rate-notice {
    margin-top: 18px !important;
    padding: 14px 16px !important;
    border: 1px solid #e0ebe3;
    border-radius: 13px !important;
    background: #edf5ef !important;
    font-size: 11.5px !important;
}
.application-detail-cta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    margin-top: 24px;
    padding: 28px 30px;
    border-radius: 22px;
    color: #fff;
    background: #164f2d;
    box-shadow: 0 18px 44px rgba(20,67,39,.13);
}
.application-detail-cta > div:first-child { max-width: 720px; }
.application-detail-cta > div:first-child > span { display: block; margin-bottom: 5px; color: #bede75; font-size: 11px; font-weight: 700; letter-spacing: .8px; text-transform: uppercase; }
.application-detail-cta h3 { margin: 0; color: #fff !important; font-size: 21px !important; line-height: 1.35 !important; font-weight: 650 !important; }
.application-detail-cta-actions { display: flex; gap: 9px; flex: 0 0 auto; }
.application-detail-cta-actions a { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 10px 15px; border-radius: 11px; font-size: 12px; font-weight: 700; text-decoration: none !important; }
.application-detail-cta-secondary { border: 1px solid rgba(255,255,255,.18); color: #fff !important; background: rgba(255,255,255,.08); }
.application-detail-cta-primary { color: #173e27 !important; background: #c5e77f; }
.application-detail-cta-actions a:hover { transform: none !important; }

/* 5) AJAX contact form states */
.contact-honeypot {
    position: absolute !important;
    left: -10000px !important;
    width: 1px !important;
    height: 1px !important;
    opacity: 0 !important;
    pointer-events: none !important;
}
.contact-field > span b { color: #b94949; font-weight: 700; }
.contact-field-feedback {
    display: block;
    min-height: 18px;
    margin-top: 5px;
    color: #87948b;
    font-size: 10.5px;
    line-height: 1.35;
}
.contact-field.is-invalid > div {
    border-color: #d35a5a !important;
    background: #fffafa !important;
    box-shadow: 0 0 0 4px rgba(211,90,90,.07) !important;
}
.contact-field.is-invalid > div > i,
.contact-field.is-invalid .contact-field-feedback { color: #bf4141 !important; }
.contact-field.is-valid > div {
    border-color: #67a36c !important;
    background: #fbfefb !important;
    box-shadow: 0 0 0 4px rgba(103,163,108,.07) !important;
}
.contact-field.is-valid > div > i,
.contact-field.is-valid .contact-field-feedback { color: #4d8b55 !important; }
.contact-form-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-top: 17px;
}
.contact-form-privacy {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    max-width: 410px;
    color: #7b8a81;
    font-size: 10.5px;
    line-height: 1.45;
}
.contact-form-privacy i { flex: 0 0 auto; margin-top: 2px; color: #78a44f; }
.contact-submit-btn { margin-top: 0 !important; flex: 0 0 auto; }
.contact-submit-btn:disabled { opacity: .72; cursor: wait; }
.contact-submit-btn.is-loading i { animation: arajelContactSpin .8s linear infinite; }
.contact-form-result {
    display: none;
    align-items: flex-start;
    gap: 9px;
    margin-top: 16px;
    padding: 13px 14px;
    border-radius: 12px;
    font-size: 12px;
    line-height: 1.5;
}
.contact-form-result.is-success,
.contact-form-result.is-error { display: flex; }
.contact-form-result.is-success { border: 1px solid #cfe4d3; color: #356641; background: #f1f8f2; }
.contact-form-result.is-error { border: 1px solid #edd2d2; color: #a23e3e; background: #fff5f5; }
.contact-form-result i { flex: 0 0 auto; margin-top: 3px; }
@keyframes arajelContactSpin { to { transform: rotate(360deg); } }

/* Map wording/section gains clearer hierarchy. */
.contact-map-copy > div > span { color: #6d9c49 !important; }
.contact-map-copy h2 { font-size: clamp(28px, 2.4vw, 36px) !important; font-weight: 650 !important; }

@media (max-width: 1199.98px) {
    .application-rate-panel-full .application-rate-grid { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
}

@media (max-width: 991.98px) {
    .checkout-sales-strip { padding: 58px 0 62px !important; }
    .knowledge-hub-section + .home-client-logos,
    .home-client-logos,
    .arajel-client-logos { padding: 56px 0 !important; }
    .home-client-logos + .footer-con,
    .arajel-client-logos + .footer-con { padding-top: 62px !important; }
    .application-detail-section { padding: 72px 0 94px !important; }
    .application-detail-layout { grid-template-columns: 1fr !important; }
    .application-detail-cards { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .application-essentials { position: static !important; }
    .application-rate-panel-full .application-rate-heading { grid-template-columns: 1fr !important; gap: 18px; }
    .application-rate-panel-full .application-rate-heading > p { padding: 0; border-left: 0; }
    .application-detail-cta { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 767.98px) {
    .checkout-sales-strip { padding: 48px 0 52px !important; }
    .knowledge-hub-section + .home-client-logos,
    .home-client-logos,
    .arajel-client-logos {
        padding: 50px 0 !important;
        background:
            linear-gradient(to bottom, #d6e0ea 0%, #d6e0ea 46%, rgba(214,224,234,0) 46%, rgba(214,224,234,0) 100%),
            url('../images/footer-bg-img.jpg') center bottom / cover no-repeat !important;
    }
    .application-detail-section { padding: 58px 0 76px !important; }
    .application-detail-heading { padding: 26px 22px !important; border-radius: 22px !important; }
    .application-detail-heading h2 { font-size: 32px !important; letter-spacing: -.45px; }
    .application-detail-heading > p { font-size: 15px !important; line-height: 1.7 !important; }
    .application-detail-principles { gap: 7px; margin-top: 20px; }
    .application-detail-principles span { width: 100%; }
    .application-detail-cards { grid-template-columns: 1fr; }
    .application-detail-card { padding: 21px !important; }
    .application-rate-panel.application-rate-panel-full { padding: 25px 21px !important; border-radius: 22px !important; }
    .application-rate-panel-full .application-rate-grid { grid-template-columns: 1fr !important; gap: 10px !important; }
    .application-rate-item-top { align-items: flex-start; }
    .application-rate-item-top > span { max-width: 44%; }
    .application-detail-cta { padding: 23px 21px; border-radius: 18px; }
    .application-detail-cta-actions { width: 100%; flex-direction: column; }
    .application-detail-cta-actions a { width: 100%; }
    .contact-form-footer { align-items: stretch; flex-direction: column; }
    .contact-submit-btn { width: 100%; }
}

@media (max-width: 420px) {
    .application-detail-card { grid-template-columns: 42px minmax(0,1fr) !important; gap: 13px !important; }
    .application-detail-card > span { width: 40px !important; height: 40px !important; }
    .application-rate-item-top { flex-direction: column; gap: 10px; }
    .application-rate-item-top > span { max-width: none; }
}



/* =========================================================
   ARAJEL v4 visual refinements — 2026-08-20
   Mobile application steps, footer image/brand, buttons,
   technical support card and technical fact cards.
   ========================================================= */

/* 1) Legacy corner triangles are removed from every theme button. */
.generic-btn a::after,
.light-grren-btn a::after,
.white-btn a::after,
.grren-btn a::after,
.cart-btn a::after,
.submit-btn::after,
.header-buy-btn a::after {
    display: none !important;
    content: none !important;
}

.generic-btn a,
.submit-btn {
    overflow: hidden;
    border-radius: 14px !important;
    box-shadow: 0 10px 24px rgba(18, 72, 40, .12);
    transform: none !important;
    transition: background-color .22s ease, color .22s ease, border-color .22s ease, box-shadow .22s ease, transform .22s ease !important;
}
.generic-btn a:hover,
.generic-btn a:focus,
.submit-btn:hover,
.submit-btn:focus {
    transform: translateY(-2px) !important;
    box-shadow: 0 14px 30px rgba(18, 72, 40, .17);
}
.light-grren-btn a {
    border: 1px solid rgba(255,255,255,.12);
}
.generic-btn.light-grren-btn a:hover,
.generic-btn.light-grren-btn a:focus {
    color: #fff !important;
    background: #7eb51f !important;
}
.grren-btn a:hover,
.grren-btn a:focus,
.submit-btn:hover,
.submit-btn:focus {
    color: #fff !important;
    background: #103f24 !important;
}
.white-btn a {
    border: 1px solid rgba(22,76,42,.12);
}
.white-btn a:hover,
.white-btn a:focus {
    color: #fff !important;
    background: #164c2a !important;
    border-color: #164c2a !important;
}

/* 2) Mobile application workflow circles: viewport-safe sizing. */
@media (max-width: 767.98px) {
    .work-con {
        overflow: hidden !important;
    }
    .work-con .container {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 24px !important;
        padding-right: 24px !important;
    }
    .work-con .container::before,
    .work-con .container::after,
    .work-con .work-box-item::after {
        display: none !important;
    }
    .work-con .work-box {
        display: flex !important;
        width: 100% !important;
        max-width: 100% !important;
        flex-direction: column !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 38px !important;
        margin: 0 auto !important;
    }
    .work-con .work-box-item {
        display: flex !important;
        width: clamp(238px, 74vw, 288px) !important;
        height: clamp(238px, 74vw, 288px) !important;
        min-width: 0 !important;
        max-width: calc(100vw - 56px) !important;
        max-height: calc(100vw - 56px) !important;
        flex: 0 0 auto !important;
        align-items: center !important;
        justify-content: center !important;
        margin: 0 auto !important;
        border-radius: 50% !important;
        box-shadow: 0 22px 52px rgba(20,67,39,.09) !important;
    }
    .work-con .work-box-inner-item {
        width: calc(100% - 16px) !important;
        height: calc(100% - 16px) !important;
        max-width: none !important;
        max-height: none !important;
        padding: 28px 22px 24px !important;
        border: 4px solid #d1dce4 !important;
        border-radius: 50% !important;
        box-sizing: border-box !important;
    }
    .work-con .work-box-item figure {
        display: flex !important;
        width: 62px !important;
        height: 62px !important;
        align-items: center !important;
        justify-content: center !important;
        margin: 0 0 13px !important;
    }
    .work-con .work-box-item figure img {
        width: auto !important;
        max-width: 62px !important;
        max-height: 62px !important;
        object-fit: contain !important;
    }
    .work-con .work-box-inner-item h3 {
        margin: 0 0 9px !important;
        font-size: clamp(19px, 5.4vw, 22px) !important;
        line-height: 1.14 !important;
        text-align: center !important;
    }
    .work-con .work-box-inner-item > span {
        width: 100% !important;
        max-width: 215px !important;
        margin: 0 auto !important;
        padding: 0 !important;
        font-size: clamp(13px, 3.7vw, 14.5px) !important;
        line-height: 1.45 !important;
        text-align: center !important;
    }
}
@media (max-width: 359.98px) {
    .work-con .container { padding-left: 20px !important; padding-right: 20px !important; }
    .work-con .work-box-item {
        width: min(232px, calc(100vw - 48px)) !important;
        height: min(232px, calc(100vw - 48px)) !important;
    }
    .work-con .work-box-inner-item { padding: 23px 18px 20px !important; }
    .work-con .work-box-item figure { width: 54px !important; height: 54px !important; }
    .work-con .work-box-item figure img { max-width: 54px !important; max-height: 54px !important; }
}

/* 3) Footer transition and footer use a cleaner field photo from the project. */
.knowledge-hub-section + .home-client-logos,
.home-client-logos,
.arajel-client-logos {
    background:
        linear-gradient(to bottom, #d6e0ea 0%, #d6e0ea 50%, rgba(214,224,234,0) 50%, rgba(214,224,234,0) 100%),
        url('../images/work-bg-img.jpg') center top / cover no-repeat !important;
}
.footer-con,
.home-client-logos + .footer-con,
.arajel-client-logos + .footer-con,
.arajel-page .footer-con {
    background-image:
        linear-gradient(rgba(6,49,27,.58), rgba(5,43,24,.72)),
        url('../images/work-bg-img.jpg') !important;
    background-position: center top !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
}
@media (max-width: 767.98px) {
    .knowledge-hub-section + .home-client-logos,
    .home-client-logos,
    .arajel-client-logos {
        background:
            linear-gradient(to bottom, #d6e0ea 0%, #d6e0ea 46%, rgba(214,224,234,0) 46%, rgba(214,224,234,0) 100%),
            url('../images/work-bg-img.jpg') center top / cover no-repeat !important;
    }
}

/* Header brand is reused in the footer, with a restrained light plate for contrast. */
.footre-logo {
    display: inline-flex !important;
    align-items: center;
    justify-content: flex-start;
    max-width: 220px;
    padding: 10px 14px;
    border: 1px solid rgba(255,255,255,.26);
    border-radius: 14px;
    background: rgba(255,255,255,.93);
    box-shadow: 0 12px 30px rgba(3,34,18,.18);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
}
.footre-logo figure { margin: 0 !important; }
.footre-logo img.footer-header-brand {
    display: block;
    width: auto !important;
    max-width: 184px !important;
    max-height: 56px !important;
    object-fit: contain;
}
.footer-content .footre-logo + p { margin-top: 22px; }

/* 4) Home technical support WhatsApp card: compact number and better balance. */
.phone-con {
    max-width: 100%;
}
.phone-con a,
.phone-con a:hover,
.phone-con a:focus {
    display: inline-flex !important;
    max-width: 100%;
    gap: 14px;
    padding: 12px 24px 12px 13px !important;
    border: 1px solid rgba(255,255,255,.2);
    border-radius: 18px !important;
    color: #164c2a;
    background: #9ccb27 !important;
    box-shadow: 0 16px 34px rgba(0,0,0,.14);
    transform: none !important;
}
.phone-con a:hover,
.phone-con a:focus {
    background: #a5d431 !important;
    box-shadow: 0 20px 40px rgba(0,0,0,.18);
}
.phone-con figure {
    width: 66px !important;
    height: 66px !important;
    flex: 0 0 66px;
    border-radius: 50% !important;
    box-shadow: inset 0 0 0 1px rgba(22,76,42,.06);
}
.phone-con figure .fa-whatsapp {
    font-size: 32px !important;
}
.phone-text {
    min-width: 0;
    padding: 0 !important;
}
.phone-text span {
    margin: 0 0 4px !important;
    color: #23522f !important;
    font-size: 14px !important;
    line-height: 1.25 !important;
    font-weight: 500 !important;
}
.phone-text small {
    display: block;
    margin: 0 !important;
    color: #164c2a !important;
    font-family: 'Noto Sans', sans-serif !important;
    font-size: clamp(21px, 2.1vw, 28px) !important;
    line-height: 1.1 !important;
    font-weight: 700 !important;
    letter-spacing: -.45px;
    white-space: nowrap;
}
@media (max-width: 575.98px) {
    .phone-con a { padding: 10px 16px 10px 10px !important; gap: 10px; }
    .phone-con figure { width: 54px !important; height: 54px !important; flex-basis: 54px; }
    .phone-con figure .fa-whatsapp { font-size: 27px !important; }
    .phone-text span { font-size: 12px !important; }
    .phone-text small { font-size: clamp(18px, 5.4vw, 22px) !important; }
}

/* 5) Technical fact cards: corporate, readable and safely wrapping. */
.technical-overview {
    background:
        radial-gradient(circle at 12% 10%, rgba(148,194,46,.09), transparent 27%),
        radial-gradient(circle at 88% 92%, rgba(41,105,65,.09), transparent 28%),
        #eef5f1 !important;
}
.technical-fact-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 18px !important;
}
.technical-fact-grid article {
    position: relative !important;
    display: flex !important;
    min-width: 0 !important;
    min-height: 206px !important;
    overflow: hidden !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    padding: 24px 23px 25px !important;
    border: 1px solid #d7e5dc !important;
    border-radius: 22px !important;
    background: linear-gradient(155deg, #ffffff 0%, #f4f8f5 100%) !important;
    box-shadow: 0 14px 36px rgba(20,67,39,.07), inset 0 1px 0 rgba(255,255,255,.9) !important;
    isolation: isolate;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease !important;
}
.technical-fact-grid article::before {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 4px !important;
    content: '' !important;
    background: linear-gradient(90deg, #8fc22d 0%, #4f862d 45%, #1d6439 100%) !important;
}
.technical-fact-grid article::after {
    position: absolute !important;
    right: -62px !important;
    bottom: -78px !important;
    width: 165px !important;
    height: 165px !important;
    content: '' !important;
    border-radius: 50% !important;
    background: radial-gradient(circle, rgba(148,194,46,.12), rgba(148,194,46,0) 68%) !important;
    z-index: -1;
}
.technical-fact-grid article:hover {
    transform: translateY(-5px) !important;
    border-color: rgba(111,163,63,.48) !important;
    box-shadow: 0 24px 50px rgba(20,67,39,.13), inset 0 1px 0 rgba(255,255,255,.95) !important;
}
.technical-fact-grid article i {
    position: static !important;
    display: inline-flex !important;
    width: 48px !important;
    height: 48px !important;
    flex: 0 0 48px !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 0 19px !important;
    border: 1px solid #cfe4be !important;
    border-radius: 14px !important;
    color: #4f862d !important;
    background: #edf6e5 !important;
    box-shadow: none !important;
    font-size: 18px !important;
    transition: color .25s ease, background-color .25s ease, transform .25s ease !important;
}
.technical-fact-grid article:hover i {
    color: #fff !important;
    background: #4f862d !important;
    transform: rotate(-4deg) scale(1.04);
}
.technical-fact-grid article span {
    position: relative !important;
    z-index: 1 !important;
    display: block !important;
    margin: 0 0 8px !important;
    color: #78867e !important;
    font-size: 11.5px !important;
    line-height: 1.35 !important;
    font-weight: 750 !important;
    letter-spacing: .72px !important;
    text-transform: uppercase !important;
}
.technical-fact-grid article strong {
    position: relative !important;
    z-index: 1 !important;
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    color: #173e27 !important;
    font-family: 'Noto Sans', sans-serif !important;
    font-size: 17.5px !important;
    line-height: 1.43 !important;
    font-weight: 700 !important;
    overflow-wrap: anywhere !important;
    word-break: normal !important;
    hyphens: auto;
}

@media (max-width: 1399.98px) {
    .technical-fact-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}
@media (max-width: 991.98px) {
    .technical-fact-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
    .technical-fact-grid article { min-height: 188px !important; }
}
@media (max-width: 575.98px) {
    .technical-overview { padding-top: 68px !important; padding-bottom: 74px !important; }
    .technical-fact-grid { grid-template-columns: 1fr !important; gap: 13px !important; }
    .technical-fact-grid article {
        min-height: 0 !important;
        padding: 21px 20px 22px !important;
        border-radius: 18px !important;
    }
    .technical-fact-grid article i {
        width: 44px !important;
        height: 44px !important;
        flex-basis: 44px !important;
        margin-bottom: 15px !important;
    }
    .technical-fact-grid article strong { font-size: 16.5px !important; }
}

@media (prefers-reduced-motion: reduce) {
    .technical-fact-grid article,
    .technical-fact-grid article i,
    .generic-btn a,
    .submit-btn {
        transition: none !important;
    }
    .technical-fact-grid article:hover,
    .technical-fact-grid article:hover i,
    .generic-btn a:hover,
    .submit-btn:hover {
        transform: none !important;
    }
}



/* SEO/CMS integration layer */
.footre-logo,
.footre-logo a,
.footre-logo figure,
.footre-logo img.footer-header-brand {
    background: transparent !important;
    box-shadow: none !important;
    border: 0 !important;
}
.footre-logo { padding: 0 !important; display: block !important; }
.footre-logo figure { width: auto !important; min-height: 0 !important; }
.footre-logo img.footer-header-brand {
    display: block;
    width: min(180px, 75%) !important;
    max-width: 180px !important;
    height: auto !important;
    padding: 0 !important;
    filter: none !important;
    opacity: 1;
}
.cms-override-content { width: 100%; overflow: hidden; }
.cms-override-content img { max-width: 100%; height: auto; }
.cms-override-content .cms-container { width: min(1180px, calc(100% - 32px)); margin: 0 auto; }
@media (max-width: 575.98px) {
    .footre-logo img.footer-header-brand { width: 145px !important; }
}

.footre-logo{max-width:none!important;border-radius:0!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;}

/* Footer: three-column information layout, no gallery block */
.footer-inner-con{display:grid!important;grid-template-columns:minmax(0,1.35fr) minmax(180px,.75fr) minmax(220px,.9fr)!important;gap:54px!important;align-items:start!important}
.footer-inner-con .site-map{width:auto!important;max-width:none!important;float:none!important;margin:0!important;padding:0!important}
.footre-logo img.footer-header-brand{width:150px!important;max-width:150px!important;filter:brightness(0) invert(1)!important}
.footer-content .footre-logo+ p{margin-top:20px!important}
@media(max-width:991.98px){.footer-inner-con{grid-template-columns:1fr 1fr!important;gap:34px!important}.footer-content{grid-column:1/-1!important}}
@media(max-width:575.98px){.footer-inner-con{grid-template-columns:1fr!important;gap:28px!important}.footer-content{grid-column:auto!important}.footre-logo img.footer-header-brand{width:132px!important}}

/* Public Blog */
.blog-inner-hero{min-height:410px;display:flex;align-items:center;background:linear-gradient(120deg,rgba(236,245,241,.97),rgba(245,249,247,.92)),url('../images/home-bannar-img1.jpg') center/cover no-repeat;position:relative;overflow:hidden}
.blog-hero-copy{max-width:760px;padding:82px 0 74px}.blog-hero-copy>span,.blog-eyebrow{display:block;color:#789f24;font-size:13px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;margin-bottom:13px}.blog-hero-copy h1{font-size:clamp(48px,6vw,78px);line-height:.98;color:#143c2a;margin:0 0 20px}.blog-hero-copy p{max-width:680px;color:#5f756a;font-size:18px;line-height:1.75;margin:0}.blog-index-section{padding:94px 0 110px;background:#f7faf8}.blog-index-heading{display:flex;justify-content:space-between;align-items:end;gap:34px;margin-bottom:42px}.blog-index-heading h2{font-size:42px;line-height:1.08;margin:0;color:#153d2b}.blog-index-heading>p{max-width:440px;color:#718279;line-height:1.7;margin:0}.blog-index-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.blog-index-card{background:#fff;border:1px solid #dfe8e2;border-radius:24px;overflow:hidden;box-shadow:0 14px 38px rgba(27,57,43,.06);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}.blog-index-card:hover{transform:translateY(-5px);box-shadow:0 24px 48px rgba(27,57,43,.10);border-color:#cfddd4}.blog-card-media{display:block;aspect-ratio:16/10;background:#eaf2ed;overflow:hidden}.blog-card-media img{width:100%;height:100%;object-fit:cover;transition:transform .45s ease}.blog-index-card:hover .blog-card-media img{transform:scale(1.035)}.blog-card-placeholder{width:100%;height:100%;display:grid;place-items:center;font-size:40px;color:#7d9e8b}.blog-card-body{padding:25px 25px 27px}.blog-card-meta{display:flex;justify-content:space-between;gap:12px;color:#8a9a91;font-size:12px;margin-bottom:14px}.blog-card-meta span{color:#6c9222;font-weight:800}.blog-card-body h3{font-size:24px;line-height:1.3;margin:0 0 13px}.blog-card-body h3 a{color:#173c2c;text-decoration:none}.blog-card-body p{color:#718178;line-height:1.7;margin:0 0 18px}.blog-read-link{display:inline-flex;align-items:center;gap:8px;color:#0f5b39;font-weight:800;text-decoration:none}.blog-empty-state{text-align:center;padding:78px 20px;background:#fff;border:1px dashed #cfddd4;border-radius:24px}.blog-empty-state>span{display:grid;place-items:center;width:62px;height:62px;margin:0 auto 18px;border-radius:18px;background:#eef5e4;color:#6c9422;font-size:23px}.blog-empty-state h3{font-size:27px;color:#173c2c;margin:0 0 9px}.blog-empty-state p{color:#7a8b82;margin:0}.blog-detail-main{background:#f8faf9}.blog-detail-hero{padding:105px 0 48px;background:#edf4f0}.blog-detail-head-inner{max-width:900px;margin:0 auto;text-align:center}.blog-detail-meta{display:flex;align-items:center;justify-content:center;gap:10px;color:#7e9086;font-size:13px;margin-bottom:19px}.blog-detail-meta a{color:#668d22;font-weight:800;text-decoration:none}.blog-detail-head-inner h1{font-size:clamp(42px,6vw,72px);line-height:1.03;color:#143b2a;margin:0 0 20px}.blog-detail-head-inner>p{font-size:19px;line-height:1.75;color:#667b70;max-width:790px;margin:0 auto}.blog-detail-byline{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:22px;color:#86958e;font-size:12px}.blog-detail-cover{max-width:1180px;margin:42px auto 0;border-radius:26px;overflow:hidden;box-shadow:0 28px 60px rgba(25,53,40,.12)}.blog-detail-cover img{display:block;width:100%;max-height:650px;object-fit:cover}.blog-detail-content-section{padding:70px 0 110px}.blog-detail-layout{display:grid;grid-template-columns:minmax(0,780px) minmax(250px,320px);gap:72px;justify-content:center;align-items:start}.blog-prose{font-size:17px;line-height:1.85;color:#385147}.blog-prose h2{font-size:34px;line-height:1.2;color:#153c2a;margin:44px 0 16px}.blog-prose h3{font-size:25px;line-height:1.3;color:#173c2c;margin:34px 0 13px}.blog-prose p{margin:0 0 22px}.blog-prose ul,.blog-prose ol{padding-left:24px;margin-bottom:25px}.blog-prose img{max-width:100%;height:auto;border-radius:18px}.blog-prose blockquote{border-left:4px solid #98c928;background:#f0f6e7;border-radius:0 14px 14px 0;margin:34px 0;padding:22px 26px;color:#294638}.blog-detail-aside{position:sticky;top:120px;background:#0f5637;color:#fff;padding:28px;border-radius:22px}.blog-detail-aside>span{color:#b8d85c;font-size:11px;font-weight:800;letter-spacing:.12em}.blog-detail-aside h3{color:#fff;font-size:25px;line-height:1.25;margin:12px 0}.blog-detail-aside p{color:rgba(255,255,255,.75);line-height:1.7}.blog-detail-aside a{display:flex;align-items:center;justify-content:space-between;color:#17331f;background:#a0cf2e;padding:13px 15px;border-radius:11px;font-weight:800;text-decoration:none;margin-top:20px}.blog-not-found{min-height:62vh;display:grid;place-items:center;text-align:center;padding:80px 20px}.blog-not-found span{color:#8db52b;font-weight:900;letter-spacing:.14em}.blog-not-found h1{font-size:45px;color:#173c2c;margin:12px 0}.blog-not-found p{color:#74867c}.blog-not-found a{display:inline-block;margin-top:15px;background:#0f5b39;color:#fff;padding:12px 18px;border-radius:10px;text-decoration:none;font-weight:800}
@media(max-width:991.98px){.blog-index-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.blog-detail-layout{grid-template-columns:1fr;gap:34px}.blog-detail-aside{position:static}.blog-index-heading{display:block}.blog-index-heading>p{margin-top:16px}.blog-hero-copy{padding:65px 0}}
@media(max-width:575.98px){.blog-inner-hero{min-height:330px}.blog-hero-copy h1{font-size:45px}.blog-hero-copy p{font-size:16px}.blog-index-section{padding:64px 0 75px}.blog-index-heading h2{font-size:33px}.blog-index-grid{grid-template-columns:1fr}.blog-card-body h3{font-size:21px}.blog-detail-hero{padding:75px 0 35px}.blog-detail-head-inner h1{font-size:39px}.blog-detail-head-inner>p{font-size:16px}.blog-detail-content-section{padding:46px 0 75px}.blog-prose{font-size:16px}.blog-prose h2{font-size:28px}.blog-prose h3{font-size:22px}}

/* Blog v8 — aligned with ARAJEL inner-page design */
.blog-sub-banner{min-height:0!important;background:var(--green-color,#0b4f32)!important;overflow:hidden}.blog-sub-banner .sub-banner-content{position:relative;z-index:3;max-width:790px;margin:auto}.blog-sub-banner .sub-banner-content p{max-width:690px;margin:18px auto 0;color:rgba(255,255,255,.78);font-size:17px;line-height:1.7}.blog-sub-banner .breadcrumb-item,.blog-sub-banner .breadcrumb-item a{color:rgba(255,255,255,.78)!important}.blog-sub-banner .breadcrumb-item.active{color:#a6cf2e!important}.blog-intro-section{padding:74px 0 44px;background:#f7faf8}.blog-intro-grid{display:grid;grid-template-columns:minmax(210px,.42fr) minmax(0,1fr);gap:72px;align-items:start;padding-bottom:42px;border-bottom:1px solid #dce6df}.blog-intro-kicker{display:grid;gap:8px;padding-top:7px}.blog-intro-kicker span{font-size:11px;letter-spacing:.13em;text-transform:uppercase;font-weight:800;color:#82a62a}.blog-intro-kicker strong{font-size:14px;font-weight:600;color:#77877e}.blog-intro-copy h2{font-size:clamp(32px,4vw,48px);line-height:1.08;color:#123d29;margin:0 0 16px}.blog-intro-copy p{font-size:17px;line-height:1.8;color:#63776c;max-width:760px;margin:0}.blog-index-section{padding:42px 0 110px!important}.blog-index-card{border-radius:18px!important}.blog-card-media{aspect-ratio:16/9}.blog-card-body{padding:23px 23px 25px}.blog-index-heading{border-bottom:0;margin-bottom:34px}.blog-empty-state{padding:58px 20px;background:linear-gradient(145deg,#fff,#f4f8f5);border-style:solid}.blog-empty-state p{max-width:560px;margin:0 auto}.blog-index-card:focus-within{outline:3px solid rgba(151,198,42,.25);outline-offset:3px}
@media(max-width:991.98px){.blog-intro-grid{grid-template-columns:1fr;gap:20px}.blog-intro-kicker{display:flex;gap:12px;align-items:center}.blog-sub-banner .sub-banner-content p{font-size:15px}}@media(max-width:575.98px){.blog-intro-section{padding:54px 0 28px}.blog-intro-copy h2{font-size:31px}.blog-intro-copy p{font-size:15px}.blog-index-section{padding:30px 0 74px!important}.blog-sub-banner .sub-banner-content p{margin-top:12px;line-height:1.55}}



/* ARAJEL multilingual + RTL layer */
.language-switcher{position:relative;margin:0 8px}.language-switcher-toggle{height:42px;min-width:62px;padding:0 12px;border:1px solid rgba(15,75,45,.14);border-radius:12px;background:#fff;color:#174a31;display:inline-flex;align-items:center;justify-content:center;gap:8px;font:700 12px/1 "Noto Sans",Arial,sans-serif;letter-spacing:.04em;cursor:pointer;transition:border-color .2s ease,box-shadow .2s ease,background .2s ease}.language-switcher-toggle:hover,.language-switcher.show .language-switcher-toggle{background:#f7faf8;border-color:rgba(15,75,45,.26);box-shadow:0 8px 22px rgba(10,68,40,.08)}.language-switcher-toggle i{font-size:8px}.language-switcher-menu{min-width:178px;padding:7px;border:1px solid rgba(15,75,45,.11);border-radius:14px;box-shadow:0 18px 50px rgba(14,54,35,.13);background:#fff}.language-option{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:9px 10px;border-radius:9px;color:#334d40!important;font-size:12px;text-decoration:none!important;transition:background .18s ease,color .18s ease}.language-option small{font-size:9px;font-weight:800;letter-spacing:.08em;color:#87978e}.language-option:hover,.language-option.active{background:#f0f6f2;color:#0c5632!important}.language-option.disabled{opacity:.42;cursor:not-allowed}.cms-language-unavailable{min-height:58vh;display:grid;place-items:center;padding:90px 20px;background:#f4f8f5;text-align:center}.cms-language-unavailable>div{max-width:660px}.cms-language-unavailable span{font-size:12px;font-weight:800;color:#80aa27;letter-spacing:.12em}.cms-language-unavailable h1{margin:12px 0 18px;color:#123d28;font-size:34px}.cms-language-unavailable a{display:inline-flex;padding:12px 20px;border-radius:10px;background:#0d5131;color:#fff;text-decoration:none;font-weight:700}

html[dir="rtl"] body{direction:rtl;text-align:right}html[dir="rtl"] .navbar-brand{margin-right:0;margin-left:1rem}html[dir="rtl"] .navbar-nav{padding-right:0}html[dir="rtl"] .navbar-nav.ml-auto{margin-left:0!important;margin-right:auto!important}html[dir="rtl"] .header-action-group{margin-left:0;margin-right:20px}html[dir="rtl"] .knowledge-mega-menu{text-align:right}html[dir="rtl"] .mega-menu-link{direction:rtl;text-align:right}html[dir="rtl"] .mega-menu-icon{margin-right:0;margin-left:12px}html[dir="rtl"] .mega-menu-copy{text-align:right}html[dir="rtl"] .generic-title,html[dir="rtl"] .generic-box-content,html[dir="rtl"] .wrok-content,html[dir="rtl"] .blog-prose,html[dir="rtl"] .blog-card-body,html[dir="rtl"] .site-map{text-align:right}html[dir="rtl"] .fa-chevron-right:before{content:"\f053"}html[dir="rtl"] .fa-arrow-right:before{content:"\f060"}html[dir="rtl"] .fa-arrow-left:before{content:"\f061"}html[dir="rtl"] .footer-link ul,html[dir="rtl"] .contact-info ul{padding-right:0}html[dir="rtl"] .owl-carousel{direction:ltr}html[dir="rtl"] .owl-carousel .item{direction:rtl}html[dir="rtl"] input,html[dir="rtl"] textarea,html[dir="rtl"] select{text-align:right}html[dir="rtl"] .language-switcher-menu{text-align:right}html[dir="rtl"] .language-option{direction:rtl}

@media(max-width:991px){.language-switcher{margin:10px 0;width:100%}.language-switcher-toggle{width:100%;justify-content:space-between}.language-switcher-menu{position:static!important;transform:none!important;width:100%;margin-top:6px}.header-action-group{flex-wrap:wrap}.header-action-group .header-btn{flex:1;min-width:145px}html[dir="rtl"] .header-action-group{margin-right:0}html[dir="rtl"] .navbar-collapse{text-align:right}}
@media(max-width:575px){.cms-language-unavailable h1{font-size:27px}.language-option{padding:10px 11px}}

/* v8 multilingual + RTL */
html[dir="rtl"] body{text-align:right}html[dir="rtl"] .breadcrumb{direction:rtl}html[dir="rtl"] .blog-card-meta,html[dir="rtl"] .blog-read-link{direction:rtl}html[dir="rtl"] .blog-read-link i{transform:rotate(180deg)}html[dir="rtl"] .footer-link ul,html[dir="rtl"] .contact-info ul{padding-right:0}html[dir="rtl"] .arajel-whatsapp{right:auto;left:24px}html[dir="rtl"] .arajel-whatsapp-panel{right:auto;left:0}



/* ========================================================================
   ARAJEL Frontend RTL Layer — v9
   Arabic / RTL-safe desktop + tablet + mobile overrides.
   Loaded only when the current language direction is RTL.
   ======================================================================== */

html[dir="rtl"] {
    direction: rtl;
    overflow-x: hidden;
}

html[dir="rtl"] body {
    direction: rtl;
    text-align: right;
    overflow-x: hidden;
    font-family: "Noto Sans Arabic", "Noto Sans", Arial, sans-serif !important;
}

/* Arabic needs a typeface with proper joining/shaping. The Latin display font
   is intentionally disabled for headings in RTL. */
html[dir="rtl"] body,
html[dir="rtl"] button,
html[dir="rtl"] input,
html[dir="rtl"] textarea,
html[dir="rtl"] select,
html[dir="rtl"] option,
html[dir="rtl"] h1,
html[dir="rtl"] h2,
html[dir="rtl"] h3,
html[dir="rtl"] h4,
html[dir="rtl"] h5,
html[dir="rtl"] h6,
html[dir="rtl"] .generic-title,
html[dir="rtl"] .banner-title,
html[dir="rtl"] .site-inner-hero-copy h1,
html[dir="rtl"] .blog-detail-head-inner h1 {
    font-family: "Noto Sans Arabic", "Noto Sans", Arial, sans-serif !important;
}

html[dir="rtl"] p,
html[dir="rtl"] li,
html[dir="rtl"] label,
html[dir="rtl"] small,
html[dir="rtl"] strong,
html[dir="rtl"] span,
html[dir="rtl"] a,
html[dir="rtl"] td,
html[dir="rtl"] th {
    unicode-bidi: plaintext;
}

html[dir="rtl"] .wrapper,
html[dir="rtl"] .container,
html[dir="rtl"] .container-fluid,
html[dir="rtl"] main,
html[dir="rtl"] section,
html[dir="rtl"] footer {
    direction: rtl;
}

/* ------------------------------------------------------------------------
   Header / navigation
   ------------------------------------------------------------------------ */
html[dir="rtl"] .header-con .navbar {
    direction: rtl;
}

html[dir="rtl"] .header-con .navbar-brand {
    margin-right: 0 !important;
    margin-left: 24px !important;
}

html[dir="rtl"] .header-con .navbar-nav {
    padding-right: 0 !important;
    padding-left: 0 !important;
}

html[dir="rtl"] .header-con .navbar-nav.ml-auto,
html[dir="rtl"] .header-con .arajel-main-nav {
    margin-left: 0 !important;
    margin-right: auto !important;
}

html[dir="rtl"] .header-con .navbar-light .navbar-nav .nav-link,
html[dir="rtl"] .header-con .mega-menu-column,
html[dir="rtl"] .header-con .mega-menu-column h4,
html[dir="rtl"] .header-con .mega-menu-copy,
html[dir="rtl"] .header-con .mega-menu-copy strong {
    text-align: right !important;
}

html[dir="rtl"] .header-action-group {
    direction: rtl;
    margin-left: 0 !important;
    margin-right: 20px !important;
}

html[dir="rtl"] .knowledge-mega-menu {
    direction: rtl;
    text-align: right !important;
}

html[dir="rtl"] .mega-menu-grid,
html[dir="rtl"] .mega-menu-link {
    direction: rtl;
}

html[dir="rtl"] .mega-menu-link {
    text-align: right !important;
}

html[dir="rtl"] .mega-menu-icon {
    margin-right: 0 !important;
    margin-left: 12px !important;
}

html[dir="rtl"] .language-switcher {
    direction: rtl;
}

html[dir="rtl"] .language-switcher-toggle,
html[dir="rtl"] .language-option {
    direction: rtl;
}

html[dir="rtl"] .language-switcher-menu {
    right: auto !important;
    left: 0 !important;
    text-align: right !important;
}

html[dir="rtl"] .language-option {
    text-align: right !important;
}

html[dir="rtl"] .language-option small {
    margin-right: auto;
    margin-left: 0;
}

/* ------------------------------------------------------------------------
   Breadcrumbs / arrows / directional UI
   ------------------------------------------------------------------------ */
html[dir="rtl"] .breadcrumb,
html[dir="rtl"] .site-inner-breadcrumb {
    direction: rtl;
    justify-content: flex-start !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
    text-align: right !important;
}

html[dir="rtl"] .breadcrumb-item + .breadcrumb-item {
    padding-right: .5rem;
    padding-left: 0;
}

html[dir="rtl"] .breadcrumb-item + .breadcrumb-item::before {
    float: right;
    padding-right: 0;
    padding-left: .5rem;
}

/* Font Awesome directional glyphs are already swapped by the multilingual
   base layer; keep transforms neutral so they are not flipped twice. */
html[dir="rtl"] .fa-chevron-right,
html[dir="rtl"] .fa-angle-right,
html[dir="rtl"] .fa-arrow-right,
html[dir="rtl"] .blog-read-link i,
html[dir="rtl"] .contact-row-arrow i,
html[dir="rtl"] .application-detail-cta a i {
    transform: none !important;
}
html[dir="rtl"] .fa-angle-right::before { content: "\f104"; }

/* ------------------------------------------------------------------------
   Shared typography / sections / cards
   ------------------------------------------------------------------------ */
html[dir="rtl"] .generic-title,
html[dir="rtl"] .generic-box-content,
html[dir="rtl"] .wrok-content,
html[dir="rtl"] .site-inner-hero-copy,
html[dir="rtl"] .ap-product-intro-copy,
html[dir="rtl"] .ap-heading,
html[dir="rtl"] .application-detail-content,
html[dir="rtl"] .application-detail-heading,
html[dir="rtl"] .application-rate-heading,
html[dir="rtl"] .application-rate-item,
html[dir="rtl"] .application-rate-notice,
html[dir="rtl"] .technical-report-head,
html[dir="rtl"] .technical-spec-card,
html[dir="rtl"] .technical-factor-card,
html[dir="rtl"] .blog-card-body,
html[dir="rtl"] .blog-intro-copy,
html[dir="rtl"] .blog-index-heading,
html[dir="rtl"] .blog-prose,
html[dir="rtl"] .blog-detail-aside,
html[dir="rtl"] .contact-form-card,
html[dir="rtl"] .contact-info-card,
html[dir="rtl"] .contact-map-copy,
html[dir="rtl"] .purchase-form-card,
html[dir="rtl"] .purchase-summary-card,
html[dir="rtl"] .site-map,
html[dir="rtl"] .footer-content {
    text-align: right !important;
}

html[dir="rtl"] .site-inner-hero-grid,
html[dir="rtl"] .ap-product-intro-grid,
html[dir="rtl"] .ap-process-grid,
html[dir="rtl"] .ap-spec-grid,
html[dir="rtl"] .application-detail-layout,
html[dir="rtl"] .application-detail-cards,
html[dir="rtl"] .application-rate-grid,
html[dir="rtl"] .blog-intro-grid,
html[dir="rtl"] .blog-index-grid,
html[dir="rtl"] .blog-detail-layout,
html[dir="rtl"] .contact-professional-grid,
html[dir="rtl"] .contact-field-grid,
html[dir="rtl"] .purchase-fields-grid,
html[dir="rtl"] .purchase-checkout-grid,
html[dir="rtl"] .purchase-channel-grid,
html[dir="rtl"] .footer-inner-con {
    direction: rtl;
}

html[dir="rtl"] .ap-actions,
html[dir="rtl"] .application-detail-cta-actions,
html[dir="rtl"] .purchase-intro-badges,
html[dir="rtl"] .contact-form-footer,
html[dir="rtl"] .blog-card-meta,
html[dir="rtl"] .blog-detail-meta,
html[dir="rtl"] .blog-detail-byline,
html[dir="rtl"] .blog-read-link {
    direction: rtl;
}

html[dir="rtl"] ul,
html[dir="rtl"] ol {
    padding-left: 0;
    padding-right: 1.35rem;
}

html[dir="rtl"] .footer-link ul,
html[dir="rtl"] .contact-info ul,
html[dir="rtl"] .contact-info-list,
html[dir="rtl"] .site-map ul,
html[dir="rtl"] .ap-benefit-list,
html[dir="rtl"] .application-essentials ul {
    padding-right: 0 !important;
    padding-left: 0 !important;
}

html[dir="rtl"] .application-essentials li,
html[dir="rtl"] .contact-info-row,
html[dir="rtl"] .application-detail-card,
html[dir="rtl"] .application-rate-item,
html[dir="rtl"] .ap-benefit-list li {
    direction: rtl;
    text-align: right;
}

html[dir="rtl"] .application-essentials li i {
    margin-left: 0;
    margin-right: 0;
}

html[dir="rtl"] .blog-prose ul,
html[dir="rtl"] .blog-prose ol {
    padding-left: 0 !important;
    padding-right: 26px !important;
}

html[dir="rtl"] .blog-prose blockquote {
    border-left: 0 !important;
    border-right: 4px solid #98c928 !important;
    border-radius: 14px 0 0 14px !important;
}

html[dir="rtl"] .blog-detail-aside a,
html[dir="rtl"] .blog-read-link {
    flex-direction: row;
}

/* ------------------------------------------------------------------------
   Forms
   ------------------------------------------------------------------------ */
html[dir="rtl"] label,
html[dir="rtl"] .contact-field label,
html[dir="rtl"] .purchase-field label,
html[dir="rtl"] .contact-form-heading,
html[dir="rtl"] .purchase-section-title {
    text-align: right !important;
}

html[dir="rtl"] input,
html[dir="rtl"] textarea,
html[dir="rtl"] select,
html[dir="rtl"] .form-control,
html[dir="rtl"] .purchase-control {
    direction: rtl;
    text-align: right !important;
}

/* Numeric and machine-readable values remain LTR while aligning naturally
   within the RTL form. */
html[dir="rtl"] input[type="email"],
html[dir="rtl"] input[type="tel"],
html[dir="rtl"] input[type="number"],
html[dir="rtl"] input[inputmode="email"],
html[dir="rtl"] input[inputmode="tel"],
html[dir="rtl"] .technical-phone,
html[dir="rtl"] .contact-info-row a[href^="tel:"],
html[dir="rtl"] .contact-info-row a[href^="mailto:"] {
    direction: ltr;
    text-align: right !important;
    unicode-bidi: embed;
}

html[dir="rtl"] input[type="checkbox"],
html[dir="rtl"] input[type="radio"] {
    margin-right: 0;
    margin-left: 8px;
}

html[dir="rtl"] .arajel-whatsapp-input > i {
    left: auto !important;
    right: 13px !important;
}

html[dir="rtl"] .arajel-whatsapp-input input {
    padding-left: 12px !important;
    padding-right: 38px !important;
}

html[dir="rtl"] .arajel-whatsapp-privacy,
html[dir="rtl"] .arajel-whatsapp-error {
    text-align: right !important;
}

/* ------------------------------------------------------------------------
   Footer / floating tools
   ------------------------------------------------------------------------ */
html[dir="rtl"] .footer-link,
html[dir="rtl"] .contact-info,
html[dir="rtl"] .footer-content {
    direction: rtl;
}

html[dir="rtl"] .arajel-whatsapp {
    right: auto !important;
    left: 24px !important;
}

html[dir="rtl"] .arajel-whatsapp-panel {
    right: auto !important;
    left: 0 !important;
    transform-origin: bottom left !important;
}

html[dir="rtl"] .arajel-whatsapp-panel-head,
html[dir="rtl"] .arajel-whatsapp-panel-body {
    direction: rtl;
    text-align: right;
}

html[dir="rtl"] .arajel-whatsapp-close {
    margin-right: auto;
    margin-left: 0;
}

html[dir="rtl"] .scroll-top,
html[dir="rtl"] .scroll-to-top,
html[dir="rtl"] #back-to-top {
    right: auto !important;
    left: 20px !important;
}

/* Carousels keep their engine in LTR to prevent index/translateX problems,
   but each slide's content is rendered RTL. */
html[dir="rtl"] .owl-carousel {
    direction: ltr !important;
}
html[dir="rtl"] .owl-carousel .owl-item,
html[dir="rtl"] .owl-carousel .item {
    direction: rtl !important;
    text-align: right;
}

/* ------------------------------------------------------------------------
   Tablet + mobile navigation
   ------------------------------------------------------------------------ */
@media (max-width: 991.98px) {
    html[dir="rtl"] .header-con .wrapper {
        padding-right: 18px !important;
        padding-left: 18px !important;
    }

    html[dir="rtl"] .header-con .navbar-brand {
        margin: 0 !important;
    }

    html[dir="rtl"] .header-con .navbar-toggler {
        margin: 0 auto 0 0 !important;
    }

    html[dir="rtl"] .header-con .navbar-collapse,
    html[dir="rtl"] .header-con .navbar-collapse.collapsing {
        right: 12px !important;
        left: 12px !important;
        margin-right: auto !important;
        margin-left: auto !important;
        text-align: right !important;
        direction: rtl;
    }

    html[dir="rtl"] .header-con .arajel-main-nav {
        margin: 0 !important;
    }

    html[dir="rtl"] .header-con .navbar-light .arajel-main-nav > .nav-item > .nav-link {
        justify-content: flex-start !important;
        text-align: right !important;
    }

    html[dir="rtl"] .header-con .knowledge-mega-item > .nav-link {
        padding-right: 15px !important;
        padding-left: 56px !important;
    }

    html[dir="rtl"] .header-con .mobile-mega-toggle {
        right: auto !important;
        left: 5px !important;
    }

    html[dir="rtl"] .header-con .mega-menu-link {
        text-align: right !important;
    }

    html[dir="rtl"] .header-action-group {
        width: 100%;
        margin: 10px 0 0 !important;
        padding: 0 !important;
        flex-direction: column !important;
        align-items: stretch !important;
    }

    html[dir="rtl"] .language-switcher {
        width: 100%;
        margin: 0 0 8px !important;
    }

    html[dir="rtl"] .language-switcher-toggle {
        width: 100%;
        justify-content: space-between !important;
    }

    html[dir="rtl"] .language-switcher-menu {
        position: static !important;
        right: auto !important;
        left: auto !important;
        width: 100% !important;
        min-width: 0 !important;
        margin: 6px 0 0 !important;
        transform: none !important;
    }

    html[dir="rtl"] .header-action-group .header-btn,
    html[dir="rtl"] .header-action-group .header-btn a {
        width: 100% !important;
        text-align: center !important;
    }

    html[dir="rtl"] .site-inner-hero-grid,
    html[dir="rtl"] .ap-product-intro-grid,
    html[dir="rtl"] .application-detail-layout,
    html[dir="rtl"] .blog-intro-grid,
    html[dir="rtl"] .blog-detail-layout,
    html[dir="rtl"] .contact-professional-grid,
    html[dir="rtl"] .purchase-checkout-grid {
        direction: rtl;
    }

    html[dir="rtl"] .blog-intro-kicker {
        justify-content: flex-start;
    }

    html[dir="rtl"] .footer-inner-con {
        text-align: right;
    }

    html[dir="rtl"] .arajel-whatsapp {
        left: 16px !important;
        right: auto !important;
    }
}

@media (max-width: 575.98px) {
    html[dir="rtl"] .header-con .wrapper {
        padding-right: 12px !important;
        padding-left: 12px !important;
    }

    html[dir="rtl"] .header-con .navbar-collapse,
    html[dir="rtl"] .header-con .navbar-collapse.collapsing {
        right: 8px !important;
        left: 8px !important;
        width: auto !important;
    }

    html[dir="rtl"] .site-inner-hero-copy,
    html[dir="rtl"] .application-detail-heading,
    html[dir="rtl"] .ap-heading,
    html[dir="rtl"] .blog-intro-copy,
    html[dir="rtl"] .blog-index-heading,
    html[dir="rtl"] .contact-form-heading {
        text-align: right !important;
    }

    html[dir="rtl"] .blog-card-meta {
        align-items: flex-start;
        flex-direction: row;
    }

    html[dir="rtl"] .application-rate-item,
    html[dir="rtl"] .application-detail-card,
    html[dir="rtl"] .ap-spec,
    html[dir="rtl"] .purchase-channel-card {
        text-align: right !important;
    }

    html[dir="rtl"] .arajel-whatsapp {
        left: 12px !important;
        right: auto !important;
    }

    html[dir="rtl"] .arajel-whatsapp-panel {
        left: 0 !important;
        right: auto !important;
        width: min(330px, calc(100vw - 24px)) !important;
    }
}

/* Reduced motion remains respected in RTL as well. */
@media (prefers-reduced-motion: reduce) {
    html[dir="rtl"] *,
    html[dir="rtl"] *::before,
    html[dir="rtl"] *::after {
        scroll-behavior: auto !important;
    }
}

/* ========================================================================
   v9.1 hardening: forms, inner pages, utility alignment and mobile safety
   ======================================================================== */
html[dir="rtl"] .text-left { text-align: right !important; }
html[dir="rtl"] .text-right { text-align: left !important; }
html[dir="rtl"] table { direction: rtl; text-align: right; }
html[dir="rtl"] th,
html[dir="rtl"] td { text-align: right; }

html[dir="rtl"] .sub-banner-inner-con,
html[dir="rtl"] .banner-inner-con,
html[dir="rtl"] .contact-map-card,
html[dir="rtl"] .contact-map-copy,
html[dir="rtl"] .knowledge-grid,
html[dir="rtl"] .knowledge-detail-grid,
html[dir="rtl"] .knowledge-article-layout,
html[dir="rtl"] .knowledge-hub-heading,
html[dir="rtl"] .knowledge-card,
html[dir="rtl"] .faq-box,
html[dir="rtl"] .faq-item,
html[dir="rtl"] .accordion,
html[dir="rtl"] .card,
html[dir="rtl"] .arajel-trust-strip ul,
html[dir="rtl"] .arajel-client-logos ul {
    direction: rtl;
}

html[dir="rtl"] .sub-banner-title,
html[dir="rtl"] .breadcrum,
html[dir="rtl"] .knowledge-detail-copy,
html[dir="rtl"] .knowledge-article-main,
html[dir="rtl"] .knowledge-aside,
html[dir="rtl"] .faq-box,
html[dir="rtl"] .faq-item,
html[dir="rtl"] .accordion .card-header,
html[dir="rtl"] .accordion .card-body {
    text-align: right !important;
}

html[dir="rtl"] .breadcrum ul,
html[dir="rtl"] .sub-banner-title .breadcrum ul {
    direction: rtl;
    padding-right: 0 !important;
    padding-left: 0 !important;
}

html[dir="rtl"] .breadcrum ul li + li::before,
html[dir="rtl"] .site-inner-breadcrumb li + li::before {
    transform: scaleX(-1);
}

/* Icon-inside-input forms. */
html[dir="rtl"] .contact-field > div > i,
html[dir="rtl"] .contact-textarea-wrap > i,
html[dir="rtl"] .purchase-field-control > i,
html[dir="rtl"] .form-input-icon > i {
    left: auto !important;
    right: 16px !important;
}
html[dir="rtl"] .contact-field input,
html[dir="rtl"] .contact-field textarea,
html[dir="rtl"] .purchase-field input,
html[dir="rtl"] .purchase-field textarea,
html[dir="rtl"] .purchase-field select {
    padding-left: 16px !important;
    padding-right: 46px !important;
}
html[dir="rtl"] .contact-textarea-wrap textarea { padding-right: 46px !important; }
html[dir="rtl"] .contact-form-result,
html[dir="rtl"] .contact-field-feedback,
html[dir="rtl"] .purchase-field-feedback { text-align: right !important; }

/* Contact rows / CTA controls. */
html[dir="rtl"] .contact-info-row { grid-template-columns: auto minmax(0,1fr) auto; }
html[dir="rtl"] .contact-row-arrow { transform: rotate(-45deg) scaleX(-1); }
html[dir="rtl"] .contact-map-copy > a,
html[dir="rtl"] .contact-submit-btn,
html[dir="rtl"] .application-detail-cta-primary,
html[dir="rtl"] .application-detail-cta-secondary { direction: rtl; }

/* Checkbox/radio controls keep label text on the correct side. */
html[dir="rtl"] .custom-control { padding-left: 0; padding-right: 1.5rem; }
html[dir="rtl"] .custom-control-input { left: auto; right: 0; }
html[dir="rtl"] .custom-control-label::before,
html[dir="rtl"] .custom-control-label::after { left: auto; right: -1.5rem; }

/* Footer */
html[dir="rtl"] .footer-inner-con { direction: rtl; }
html[dir="rtl"] .footer-social-con ul { direction: rtl; justify-content: flex-start; padding: 0 !important; }
html[dir="rtl"] .contact-info a[href^="tel:"],
html[dir="rtl"] .contact-info a[href^="mailto:"] { direction: ltr; unicode-bidi: embed; display: inline-block; }

/* Keep the back-to-top control opposite WhatsApp in RTL to avoid overlap. */
html[dir="rtl"] .scroll-top,
html[dir="rtl"] .scroll-to-top,
html[dir="rtl"] #back-to-top,
html[dir="rtl"] .scroll-top-arrow {
    left: auto !important;
    right: 20px !important;
}

/* Language menu: every globally active language is interactive. */
.language-option[href] { opacity: 1 !important; cursor: pointer !important; pointer-events: auto !important; }
.language-option[href]:focus-visible { outline: 2px solid #8fc52a; outline-offset: 2px; }
html[dir="rtl"] .language-option > span { text-align: right; }

@media (max-width: 991.98px) {
    html[dir="rtl"] .sub-banner-inner-con { direction: rtl; }
    html[dir="rtl"] .sub-banner-title { order: 2; }
    html[dir="rtl"] .contact-map-copy,
    html[dir="rtl"] .application-detail-cta { text-align: right !important; }
    html[dir="rtl"] .contact-form-footer,
    html[dir="rtl"] .application-detail-cta-actions { align-items: stretch; }
    html[dir="rtl"] .footer-inner-con > * { text-align: right !important; }
}

@media (max-width: 575.98px) {
    html[dir="rtl"] body { font-size: 15px; }
    html[dir="rtl"] .container,
    html[dir="rtl"] .wrapper { max-width: 100%; }
    html[dir="rtl"] .breadcrum ul,
    html[dir="rtl"] .site-inner-breadcrumb { flex-wrap: wrap; justify-content: flex-start !important; }
    html[dir="rtl"] .application-detail-cta-actions,
    html[dir="rtl"] .contact-form-footer { width: 100%; flex-direction: column !important; }
    html[dir="rtl"] .application-detail-cta-actions a,
    html[dir="rtl"] .contact-submit-btn { width: 100%; justify-content: center; text-align: center !important; }
    html[dir="rtl"] .contact-info-row { gap: 10px; }
    html[dir="rtl"] .language-switcher-menu { max-height: min(58vh, 390px); overflow-y: auto; overscroll-behavior: contain; }
    html[dir="rtl"] .arajel-whatsapp-panel { max-height: calc(100vh - 110px); overflow-y: auto; }
    html[dir="rtl"] .scroll-top,
    html[dir="rtl"] .scroll-to-top,
    html[dir="rtl"] #back-to-top,
    html[dir="rtl"] .scroll-top-arrow { right: 12px !important; }
}



/* ARAJEL v11 — language-aware responsive typography
   Keeps long German/French/Italian/Spanish words inside cards, navigation and
   CTA boundaries without shrinking Turkish/English unnecessarily. */

html[lang^="de"],html[lang^="fr"],html[lang^="es"],html[lang^="it"]{
  --i18n-copy-scale:1;
  --i18n-heading-scale:1;
}
html[lang^="de"]{--i18n-copy-scale:.94;--i18n-heading-scale:.90}
html[lang^="fr"]{--i18n-copy-scale:.97;--i18n-heading-scale:.95}
html[lang^="es"],html[lang^="it"]{--i18n-copy-scale:.98;--i18n-heading-scale:.96}

/* Every flex/grid copy column must be allowed to shrink. */
html:not([lang^="tr"]) :where(
  .site-inner-hero-copy,.mega-menu-copy,.generic-box-content,.ap-product-intro-copy,
  .ap-heading,.ap-benefit-list article>div,.ap-process-grid article,.ap-spec,
  .technical-spec-card,.technical-factor-card,.application-rate-item,
  .application-rate-item-top,.application-detail-copy,.application-detail-card,
  .blog-card-body,.blog-index-card,.blog-prose,.blog-detail-head-inner,
  .contact-map-copy,.contact-form-card,.footer-link,.contact-info,
  .knowledge-card,.knowledge-cta-box,.content-box,.wrok-content
){min-width:0!important;max-width:100%}

/* Natural language wrapping: use dictionary hyphenation first, safe wrapping second. */
html[lang^="de"] :where(h1,h2,h3,h4,h5,h6,p,strong,span,a,button,label,li,small),
html[lang^="fr"] :where(h1,h2,h3,h4,h5,h6,p,strong,span,a,button,label,li,small),
html[lang^="es"] :where(h1,h2,h3,h4,h5,h6,p,strong,span,a,button,label,li,small),
html[lang^="it"] :where(h1,h2,h3,h4,h5,h6,p,strong,span,a,button,label,li,small){
  hyphens:auto;
  -webkit-hyphens:auto;
  word-break:normal;
  overflow-wrap:break-word;
}

/* Components with hard boundaries may break an exceptionally long compound. */
html[lang^="de"] :where(
  .technical-spec-card strong,.technical-factor-card h3,.ap-spec strong,
  .application-rate-item strong,.application-rate-item small,.mega-menu-copy strong,
  .header-btn a,.generic-btn a,.site-inner-hero h1,.blog-card-body h3,
  .knowledge-card h3,.application-detail-card h3,.ap-process-grid h3
){overflow-wrap:anywhere!important}

/* Header: German copy needs more horizontal breathing room on wide screens. */
@media (min-width:1200px){
  html[lang^="de"] .header-con .arajel-main-nav{gap:clamp(7px,.72vw,12px)!important}
  html[lang^="de"] .header-con .navbar-light .arajel-main-nav>.nav-item>.nav-link{font-size:12px!important;line-height:1.2!important;letter-spacing:-.015em!important;white-space:nowrap}
  html[lang^="de"] .header-con .header-action-group{gap:6px!important;margin-left:10px!important}
  html[lang^="de"] .header-con .header-action-group .generic-btn a{font-size:12.5px!important;padding-left:10px!important;padding-right:10px!important;white-space:nowrap}
  html[lang^="fr"] .header-con .arajel-main-nav,
  html[lang^="es"] .header-con .arajel-main-nav,
  html[lang^="it"] .header-con .arajel-main-nav{gap:clamp(9px,.9vw,15px)!important}
  html[lang^="fr"] .header-con .navbar-light .arajel-main-nav>.nav-item>.nav-link,
  html[lang^="es"] .header-con .navbar-light .arajel-main-nav>.nav-item>.nav-link,
  html[lang^="it"] .header-con .navbar-light .arajel-main-nav>.nav-item>.nav-link{font-size:12.8px!important;white-space:nowrap}
}

/* Headings: fluid caps prevent translated copy from pushing outside fixed art. */
html[lang^="de"] :where(.site-inner-hero h1,.sub-banner h1,.ap-hero-copy h1){font-size:clamp(34px,3.45vw,54px)!important;line-height:1.06!important;letter-spacing:-.025em!important}
html[lang^="de"] :where(.ap-heading h2,.knowledge-cta-box h2,.blog-index-heading h2,.blog-intro-copy h2){font-size:clamp(29px,2.65vw,43px)!important;line-height:1.12!important;letter-spacing:-.02em!important}
html[lang^="fr"] :where(.site-inner-hero h1,.sub-banner h1,.ap-hero-copy h1),
html[lang^="es"] :where(.site-inner-hero h1,.sub-banner h1,.ap-hero-copy h1),
html[lang^="it"] :where(.site-inner-hero h1,.sub-banner h1,.ap-hero-copy h1){font-size:clamp(37px,3.7vw,58px)!important;line-height:1.06!important}

/* Dense cards and technical facts. */
html[lang^="de"] .technical-spec-card strong{font-size:clamp(19px,1.45vw,22px)!important;line-height:1.28!important}
html[lang^="de"] .technical-factor-card h3{font-size:clamp(19px,1.45vw,22px)!important;line-height:1.28!important}
html[lang^="de"] .ap-spec strong{font-size:clamp(17px,1.25vw,19px)!important;line-height:1.35!important}
html[lang^="de"] .ap-process-grid h3{font-size:clamp(21px,1.7vw,24px)!important;line-height:1.25!important}
html[lang^="de"] .application-rate-item-top strong{font-size:clamp(15px,1.15vw,18px)!important;line-height:1.3!important}
html[lang^="de"] .blog-card-body h3{font-size:clamp(20px,1.6vw,23px)!important;line-height:1.34!important}
html[lang^="de"] .mega-menu-copy strong{font-size:12px!important;line-height:1.3!important}

/* Buttons never overflow their boxes; they may become two lines in long-copy languages. */
html[lang^="de"] :where(.ap-btn,.generic-btn a,.application-detail-cta-actions a,.blog-read-link),
html[lang^="fr"] :where(.ap-btn,.generic-btn a,.application-detail-cta-actions a,.blog-read-link),
html[lang^="es"] :where(.ap-btn,.generic-btn a,.application-detail-cta-actions a,.blog-read-link),
html[lang^="it"] :where(.ap-btn,.generic-btn a,.application-detail-cta-actions a,.blog-read-link){
  max-width:100%;
  min-width:0;
  white-space:normal!important;
  text-align:center;
  line-height:1.25!important;
}

/* Tablet: reduce display typography before layout reaches the mobile stack. */
@media (min-width:768px) and (max-width:1199.98px){
  html[lang^="de"] :where(.site-inner-hero h1,.sub-banner h1,.ap-hero-copy h1){font-size:clamp(32px,4.7vw,46px)!important}
  html[lang^="de"] :where(.technical-spec-card strong,.technical-factor-card h3,.ap-spec strong){font-size:18px!important}
}

/* Mobile: keep a comfortable gutter and eliminate horizontal text overflow. */
@media (max-width:767.98px){
  html[lang^="de"] :where(.site-inner-hero h1,.sub-banner h1,.ap-hero-copy h1),
  html[lang^="fr"] :where(.site-inner-hero h1,.sub-banner h1,.ap-hero-copy h1),
  html[lang^="es"] :where(.site-inner-hero h1,.sub-banner h1,.ap-hero-copy h1),
  html[lang^="it"] :where(.site-inner-hero h1,.sub-banner h1,.ap-hero-copy h1){font-size:clamp(30px,9vw,40px)!important;line-height:1.08!important}
  html[lang^="de"] :where(.ap-heading h2,.knowledge-cta-box h2,.blog-index-heading h2,.blog-intro-copy h2){font-size:clamp(26px,7.4vw,34px)!important}
  html:not([lang^="tr"]) :where(.technical-spec-card,.technical-factor-card,.ap-spec,.application-rate-item,.blog-index-card){width:100%;max-width:100%}
  html[lang^="de"] .header-con .navbar-light .arajel-main-nav>.nav-item>.nav-link{font-size:13px!important;white-space:normal!important;line-height:1.3!important}
  html[lang^="de"] .header-con .header-action-group .generic-btn a{font-size:12.5px!important}
}

/* v11 hard overflow guard --------------------------------------------------
   German compounds (and, to a lesser degree, FR/ES/IT copy) can be wider
   than the original Turkish art direction.  The rules below are deliberately
   scoped to translated Latin languages and never alter the Turkish baseline. */
html[lang^="de"] :where(
  h1,h2,h3,h4,h5,h6,
  .nav-link,.mega-menu-link,.mega-menu-copy,.generic-btn a,.header-btn a,
  .ap-btn,.ap-spec,.ap-note,.technical-spec-card,.technical-factor-card,
  .technical-fact-grid article,.knowledge-card,.knowledge-cta-box,
  .application-detail-card,.application-detail-cta,.application-rate-item,
  .blog-index-card,.blog-card-body,.blog-detail-aside,.faq-section .card,
  .contact-info,.contact-map-copy,.wrok-content,.generic-box-content
){
  min-width:0!important;
  max-width:100%;
  overflow-wrap:anywhere;
  word-break:normal;
}

html[lang^="fr"] :where(h1,h2,h3,h4,h5,h6,.nav-link,.mega-menu-copy,.generic-btn a,.ap-spec,.technical-spec-card,.technical-factor-card,.application-rate-item,.blog-card-body),
html[lang^="es"] :where(h1,h2,h3,h4,h5,h6,.nav-link,.mega-menu-copy,.generic-btn a,.ap-spec,.technical-spec-card,.technical-factor-card,.application-rate-item,.blog-card-body),
html[lang^="it"] :where(h1,h2,h3,h4,h5,h6,.nav-link,.mega-menu-copy,.generic-btn a,.ap-spec,.technical-spec-card,.technical-factor-card,.application-rate-item,.blog-card-body){
  min-width:0!important;
  max-width:100%;
  overflow-wrap:anywhere;
}

/* Let every translated flex/grid child actually shrink; min-width:auto is a
   common cause of seemingly inexplicable horizontal overflow. */
html[lang^="de"] :where(.row,[class*="-grid"],[class*="-layout"],[class*="-actions"]) > *,
html[lang^="fr"] :where(.row,[class*="-grid"],[class*="-layout"],[class*="-actions"]) > *,
html[lang^="es"] :where(.row,[class*="-grid"],[class*="-layout"],[class*="-actions"]) > *,
html[lang^="it"] :where(.row,[class*="-grid"],[class*="-layout"],[class*="-actions"]) > *{
  min-width:0!important;
}

/* Long translated captions in the product visual used to be forced to one
   line by the original theme. */
html:not([lang^="tr"]) .ap-product-intro-media figcaption strong{
  white-space:normal!important;
  overflow-wrap:anywhere;
  line-height:1.2!important;
}

/* A 992–1280 px desktop/tablet band is where German navigation is tightest. */
@media (min-width:992px) and (max-width:1280px){
  html[lang^="de"] .header-con .navbar-brand img{max-width:116px!important}
  html[lang^="de"] .header-con .arajel-main-nav{gap:4px!important}
  html[lang^="de"] .header-con .navbar-light .arajel-main-nav>.nav-item>.nav-link{
    font-size:11.25px!important;
    letter-spacing:-.025em!important;
    padding-inline:2px!important;
  }
  html[lang^="de"] .header-con .header-action-group{gap:4px!important;margin-left:6px!important}
  html[lang^="de"] .header-con .header-action-group .generic-btn a{font-size:11.25px!important;padding-inline:8px!important}
  html[lang^="fr"] .header-con .navbar-light .arajel-main-nav>.nav-item>.nav-link,
  html[lang^="es"] .header-con .navbar-light .arajel-main-nav>.nav-item>.nav-link,
  html[lang^="it"] .header-con .navbar-light .arajel-main-nav>.nav-item>.nav-link{font-size:11.75px!important}
}

@media (max-width:575.98px){
  html[lang^="de"] body{font-size:15px}
  html[lang^="de"] :where(.technical-spec-card strong,.technical-factor-card h3,.ap-spec strong,.application-rate-item strong,.blog-card-body h3){
    font-size:clamp(16px,4.8vw,20px)!important;
    line-height:1.3!important;
  }
  html[lang^="de"] .knowledge-cta-box h2{font-size:clamp(25px,7.2vw,32px)!important}
}



/* ARAJEL v12 — Blog, editor-output and media refinements */
.blog-page .blog-main-banner{margin:0!important}
.blog-page .blog-main-banner .sub-banner-title h1{max-width:100%;overflow-wrap:anywhere}
.blog-page .blog-intro-section{position:relative;padding:72px 0 52px;background:#f5f8f6}
.blog-page .blog-intro-grid{max-width:1180px;margin:0 auto;padding-bottom:44px}
.blog-page .blog-index-section{padding:50px 0 110px!important;background:#f5f8f6}
.blog-page .blog-index-heading,.blog-page .blog-index-grid,.blog-page .blog-empty-state{max-width:1180px;margin-left:auto;margin-right:auto}
.blog-page .blog-index-card{height:100%;display:flex;flex-direction:column}
.blog-page .blog-card-body{display:flex;flex:1;flex-direction:column}
.blog-page .blog-card-body p{flex:1}
.cms-override-content img,.blog-prose img,.ck-content img{max-width:100%;height:auto}
@media(max-width:991.98px){.blog-page .blog-intro-section{padding:56px 0 36px}.blog-page .blog-index-section{padding:38px 0 82px!important}}
@media(max-width:575.98px){.blog-page .blog-intro-section{padding:42px 0 28px}.blog-page .blog-index-section{padding:28px 0 68px!important}.blog-page .blog-main-banner .sub-banner-inner-con{width:100%}}



/* ===== V13 FINAL NORMALIZATION — authoritative layer ===== */
:root{
  --arajel-green:#0d5434;
  --arajel-green-deep:#0a472c;
  --arajel-lime:#98c91f;
  --arajel-surface:#d6e0ea;
  --arajel-surface-soft:#eef3f0;
  --arajel-card:#ffffff;
  --arajel-text:#153d2b;
  --arajel-muted:#667b70;
  --arajel-border:rgba(18,72,45,.12);
  --arajel-shadow:0 18px 44px rgba(21,61,43,.08);
}
html{scroll-behavior:smooth}
body{overflow-x:hidden;background:#fff}
html[dir="rtl"] body{font-family:"Noto Sans Arabic","Noto Sans",Arial,sans-serif}
html[dir="ltr"] body{font-family:"Noto Sans",Arial,sans-serif}
img,svg,video,iframe{max-width:100%}

/* Inner page banners: one visual language for all pages including Blog/FAQ. */
.sub-banner{
  position:relative!important;
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  overflow:hidden!important;
  background:var(--arajel-green)!important;
}
.sub-banner .wrapper{position:relative;z-index:2}
.sub-banner .sub-banner-inner-con{position:relative;z-index:2}
.sub-banner .sub-banner-title h1{color:#fff!important}
.sub-banner .breadcrum ul li,.sub-banner .breadcrum ul li a{color:rgba(255,255,255,.82)!important}
.sub-banner .breadcrum ul li:last-child{color:var(--arajel-lime)!important}
.sub-banner [data-aos]{will-change:auto}

/* Blog: deliberately reuses the Kullanım Alanları page rhythm and background. */
.blog-page{background:var(--arajel-surface)}
.blog-page .sub-banner{margin:0!important}
.blog-page .sub-banner [data-aos]{opacity:1!important;transform:none!important}
.blog-page .blog-index-section{
  float:left;
  width:100%;
  background:var(--arajel-surface)!important;
  padding:0!important;
  position:relative;
}
.blog-page .blog-index-section .padding-top{padding-top:96px}
.blog-page .blog-index-section .padding-bottom{padding-bottom:112px}
.blog-page .blog-page-heading{max-width:900px;margin:0 auto 44px!important}
.blog-page .blog-page-heading>span{color:#789f24!important;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.blog-page .blog-page-heading h2{color:var(--arajel-text)!important;margin-bottom:18px}
.blog-page .blog-page-heading p{max-width:720px;margin:0 auto;color:var(--arajel-muted);font-size:17px;line-height:1.75}
.blog-page .blog-index-grid{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px}
.blog-page .blog-index-card{background:#fff;border:1px solid rgba(13,84,52,.10);border-radius:22px;overflow:hidden;box-shadow:var(--arajel-shadow);height:100%;display:flex;flex-direction:column;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
.blog-page .blog-index-card:hover{transform:translateY(-5px);box-shadow:0 25px 55px rgba(21,61,43,.13);border-color:rgba(152,201,31,.35)}
.blog-page .blog-card-media{display:block;aspect-ratio:16/10;background:#edf4ef;overflow:hidden}
.blog-page .blog-card-media img{width:100%;height:100%;object-fit:cover;display:block}
.blog-page .blog-card-body{padding:25px 25px 28px;display:flex;flex:1;flex-direction:column}
.blog-page .blog-card-body p{flex:1}
.blog-page .blog-empty-state{max-width:900px;margin:0 auto;text-align:center;padding:62px 28px;background:#fff;border:1px solid rgba(13,84,52,.12);border-radius:22px;box-shadow:var(--arajel-shadow)}
.blog-page .blog-empty-state>span{display:grid;place-items:center;width:64px;height:64px;margin:0 auto 18px;border-radius:18px;background:#eef5e4;color:#6c9422;font-size:23px}
.blog-page .blog-empty-state h3{margin:0 0 10px;color:var(--arajel-text);font-size:28px}
.blog-page .blog-empty-state p{margin:0 auto;max-width:620px;color:var(--arajel-muted);line-height:1.7}

/* FAQ: one active language only; styling stays stable across LTR/RTL. */
.faq-page-section,.home-faq-section{background:var(--arajel-surface)!important}
.faq-page-section .faq-box,.home-faq-section .faq-box{max-width:1040px;margin-left:auto;margin-right:auto}
.faq-page-section .faq-box .card,.home-faq-section .faq-box .card{overflow:hidden;border:1px solid rgba(13,84,52,.10)!important;border-radius:20px!important;background:#fff!important;box-shadow:0 12px 32px rgba(21,61,43,.055);margin-bottom:16px!important}
.faq-page-section .card-header,.home-faq-section .card-header{padding:0!important}
.faq-page-section .card-header .btn,.home-faq-section .card-header .btn{display:flex!important;align-items:center!important;justify-content:space-between!important;width:100%!important;white-space:normal!important;text-align:start!important;min-height:78px;padding:20px 78px 20px 28px!important;color:#102f21!important;font-size:21px!important;line-height:1.35!important;font-weight:700!important;text-decoration:none!important;position:relative}
html[dir="rtl"] .faq-page-section .card-header .btn,html[dir="rtl"] .home-faq-section .card-header .btn{padding:20px 28px 20px 78px!important;text-align:right!important}
.faq-page-section .card-body,.home-faq-section .card-body{padding:20px 28px 24px!important;color:#65766e!important;font-size:17px!important;line-height:1.75!important}

/* Global language-fit rules for long-word languages. */
html[lang^="de"] :where(.navbar-nav .nav-link,.mega-menu-link strong,.generic-btn a,.language-option,.blog-card-body h3,.faq-box .btn){overflow-wrap:anywhere;hyphens:auto}
html[lang^="de"] .navbar-nav .nav-link{font-size:clamp(12px,1vw,14px)!important}
html[lang^="de"] :where(.sub-banner h1,.generic-title h2){font-size:clamp(34px,3.6vw,56px)!important;line-height:1.08!important;letter-spacing:-.02em}
html[lang^="fr"] :where(.navbar-nav .nav-link,.mega-menu-link strong,.generic-btn a),html[lang^="it"] :where(.navbar-nav .nav-link,.mega-menu-link strong,.generic-btn a),html[lang^="es"] :where(.navbar-nav .nav-link,.mega-menu-link strong,.generic-btn a){overflow-wrap:anywhere}

/* Unified RTL. No separate RTL stylesheet is required. */
html[dir="rtl"]{direction:rtl}
html[dir="rtl"] body{text-align:right}
html[dir="rtl"] .navbar-nav{margin-left:0!important;margin-right:auto!important}
html[dir="rtl"] .header-action-group{margin-left:0;margin-right:18px}
html[dir="rtl"] .sub-banner-inner-con{direction:rtl}
html[dir="rtl"] .breadcrum ul{flex-direction:row-reverse}
html[dir="rtl"] .blog-index-heading,html[dir="rtl"] .blog-card-body,html[dir="rtl"] .generic-title,html[dir="rtl"] .knowledge-card,html[dir="rtl"] .technical-spec-card{text-align:right}
html[dir="rtl"] .blog-read-link i,html[dir="rtl"] .knowledge-link i{transform:scaleX(-1)}
html[dir="rtl"] .blog-card-meta{direction:rtl}
html[dir="rtl"] input,html[dir="rtl"] textarea,html[dir="rtl"] select{text-align:right}
html[dir="rtl"] .dropdown-menu{text-align:right}

@media (max-width:1199.98px){
  .blog-page .blog-index-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  html[lang^="de"] .header-con .navbar-light .arajel-main-nav>.nav-item>.nav-link{padding-left:9px!important;padding-right:9px!important;font-size:12.5px!important}
}
@media (max-width:991.98px){
  .sub-banner.mobile-compact-banner{padding:58px 0 64px!important}
  .blog-page .blog-index-section .padding-top{padding-top:66px}
  .blog-page .blog-index-section .padding-bottom{padding-bottom:84px}
  .blog-page .blog-page-heading{margin-bottom:34px!important}
  html[dir="rtl"] .header-action-group{margin-right:0}
  html[dir="rtl"] .navbar-collapse{text-align:right}
}
@media (max-width:767.98px){
  .blog-page .blog-index-grid{grid-template-columns:1fr;gap:20px}
  .blog-page .blog-page-heading p{font-size:15px}
  .faq-page-section .card-header .btn,.home-faq-section .card-header .btn{min-height:70px;padding:18px 68px 18px 20px!important;font-size:18px!important}
  html[dir="rtl"] .faq-page-section .card-header .btn,html[dir="rtl"] .home-faq-section .card-header .btn{padding:18px 20px 18px 68px!important}
  .faq-page-section .card-body,.home-faq-section .card-body{padding:18px 20px 22px!important;font-size:15px!important}
}
@media (max-width:575.98px){
  .sub-banner.mobile-compact-banner{padding:46px 0 54px!important}
  .sub-banner.mobile-compact-banner .wrapper{width:min(100% - 28px,700px)!important}
  .sub-banner.mobile-compact-banner h1{font-size:clamp(34px,10vw,44px)!important;line-height:1.08!important}
  .blog-page .blog-index-section .padding-top{padding-top:48px}
  .blog-page .blog-index-section .padding-bottom{padding-bottom:68px}
  .blog-page .blog-page-heading{margin-bottom:26px!important}
  .blog-page .blog-empty-state{padding:44px 20px;border-radius:18px}
  html[lang^="de"] :where(.sub-banner h1,.generic-title h2){font-size:clamp(30px,9vw,38px)!important}
}


/* ===== ARAJEL V14 FINAL — 2026-08-25 =====
   Language-fit typography, grammatical wrapping, blog detail and purchase visibility. */

/* Do not let the browser invent language-dependent visible hyphens. Existing
   punctuation written by editors is preserved; wrapping happens at real word
   boundaries and exceptionally long compounds are safely wrapped without a dash. */
html :where(h1,h2,h3,h4,h5,h6,p,li,a,span,strong,small,button,label){
  -webkit-hyphens:manual!important;
  hyphens:manual!important;
  word-break:normal!important;
}
html[lang^="de"] :where(h1,h2,h3,h4,h5,h6,p,li,a,span,strong,small,button,label),
html[lang^="fr"] :where(h1,h2,h3,h4,h5,h6,p,li,a,span,strong,small,button,label),
html[lang^="es"] :where(h1,h2,h3,h4,h5,h6,p,li,a,span,strong,small,button,label),
html[lang^="it"] :where(h1,h2,h3,h4,h5,h6,p,li,a,span,strong,small,button,label){
  overflow-wrap:break-word!important;
}

/* Desktop header: JS selects the largest candidate that actually fits the
   available header width. Minimum sizes remain legible instead of collapsing
   German navigation to the former 11–12px range. */
@media (min-width:992px){
  .header-con{
    --arajel-nav-font:16px;
    --arajel-nav-gap:14px;
    --arajel-action-font:13px;
    --arajel-action-pad:13px;
    --arajel-brand-size:142px;
  }
  .header-con .navbar{display:flex!important;align-items:center!important;gap:clamp(12px,1.2vw,22px)!important;min-width:0}
  .header-con .navbar-brand{flex:0 0 auto!important;margin:0!important}
  .header-con .navbar-brand img{max-width:var(--arajel-brand-size)!important}
  .header-con .navbar-collapse{display:flex!important;align-items:center!important;min-width:0!important;flex:1 1 auto!important}
  .header-con .arajel-main-nav{display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:var(--arajel-nav-gap)!important;min-width:0!important;margin-inline-start:auto!important}
  .header-con .arajel-main-nav>.nav-item{flex:0 0 auto!important;min-width:0!important}
  .header-con .navbar-light .arajel-main-nav>.nav-item>.nav-link,
  html[lang^="de"] .header-con .navbar-light .arajel-main-nav>.nav-item>.nav-link,
  html[lang^="fr"] .header-con .navbar-light .arajel-main-nav>.nav-item>.nav-link,
  html[lang^="es"] .header-con .navbar-light .arajel-main-nav>.nav-item>.nav-link,
  html[lang^="it"] .header-con .navbar-light .arajel-main-nav>.nav-item>.nav-link{
    font-size:var(--arajel-nav-font)!important;
    line-height:1.25!important;
    letter-spacing:-.01em!important;
    padding-inline:0!important;
    white-space:nowrap!important;
    overflow-wrap:normal!important;
  }
  .header-con .header-action-group{display:flex!important;align-items:center!important;flex:0 0 auto!important;gap:7px!important;margin-inline-start:12px!important;margin-inline-end:0!important;white-space:nowrap}
  html[dir="rtl"] .header-con .header-action-group{margin-inline-start:12px!important;margin-inline-end:0!important}
  .header-con .header-action-group .generic-btn a,
  html[lang^="de"] .header-con .header-action-group .generic-btn a{
    font-size:var(--arajel-action-font)!important;
    padding-inline:var(--arajel-action-pad)!important;
    white-space:nowrap!important;
    line-height:1.25!important;
  }
  .header-con .language-switcher{margin:0 2px!important}
  .header-con .language-switcher-toggle{min-width:56px;height:40px;padding-inline:10px}
}

/* Mega-menu rows: icon and copy share one vertical centre, including two-line labels. */
@media (min-width:992px){
  .header-con .mega-menu-link{display:flex!important;align-items:center!important;gap:12px!important;min-height:54px!important;padding-block:8px!important}
  .header-con .mega-menu-icon{display:inline-flex!important;align-items:center!important;justify-content:center!important;align-self:center!important;flex:0 0 40px!important;margin:0!important}
  .header-con .mega-menu-copy{display:flex!important;align-items:center!important;min-height:40px!important;min-width:0!important}
  .header-con .mega-menu-copy strong,
  html[lang^="de"] .header-con .mega-menu-copy strong{font-size:14px!important;line-height:1.35!important;overflow-wrap:break-word!important}
}

/* Home process circles: keep translated titles/copy comfortably away from the ring. */
@media (min-width:992px){
  .work-box{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:clamp(22px,2.3vw,38px)!important;align-items:start!important}
  .work-box-item{width:min(100%,360px)!important;height:auto!important;aspect-ratio:1/1!important;margin-inline:auto!important;display:grid!important;place-items:center!important}
  .work-box-inner-item{box-sizing:border-box!important;width:calc(100% - 22px)!important;height:calc(100% - 22px)!important;padding:clamp(28px,2.25vw,38px) clamp(30px,2.45vw,42px) clamp(26px,2.1vw,34px)!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important}
  .work-box-item figure{height:60px!important;min-height:60px!important;margin:0 0 14px!important;display:flex!important;align-items:center!important;justify-content:center!important}
  .work-box-item figure img{max-height:60px!important;width:auto!important}
  .work-box-item h3{width:100%!important;max-width:270px!important;margin:0 auto 12px!important;font-size:clamp(20px,1.52vw,24px)!important;line-height:1.18!important;letter-spacing:-.018em!important;text-align:center!important;overflow-wrap:break-word!important}
  .work-box-item span{display:block!important;width:100%!important;max-width:248px!important;margin:0 auto!important;padding:0!important;font-size:clamp(15px,1.07vw,17px)!important;line-height:1.5!important;text-align:center!important;overflow-wrap:break-word!important}
  html[lang^="de"] .work-box-item h3{font-size:clamp(18px,1.34vw,21px)!important;line-height:1.18!important;max-width:276px!important}
  html[lang^="de"] .work-box-item span{font-size:clamp(14px,1vw,16px)!important;line-height:1.48!important;max-width:252px!important}
  html[lang^="fr"] .work-box-item h3,html[lang^="es"] .work-box-item h3,html[lang^="it"] .work-box-item h3{font-size:clamp(19px,1.4vw,22px)!important}
}
@media (min-width:992px) and (max-width:1199.98px){
  .work-box-inner-item{padding:24px 26px!important}
  .work-box-item h3{font-size:18px!important}
  .work-box-item span{font-size:14px!important;line-height:1.43!important}
}

/* Purchase page states. When direct ordering is disabled only marketplace
   channels remain, centred with the same card design. */
.purchase-channel-grid.marketplace-only{grid-template-columns:repeat(2,minmax(0,1fr))!important;max-width:900px;margin-inline:auto}
.checkout-sales-strip ul.marketplace-only{grid-template-columns:repeat(2,minmax(0,1fr))!important;max-width:760px;margin-inline:auto!important}
.checkout-sales-strip ul.marketplace-only li{border-left:1px solid #e2e9e4!important}
.checkout-sales-strip ul.marketplace-only li:first-child{border-left:none!important}
@media(max-width:767.98px){.purchase-channel-grid.marketplace-only{grid-template-columns:1fr!important;max-width:560px}.checkout-sales-strip ul.marketplace-only{grid-template-columns:1fr 1fr!important}}
@media(max-width:430px){.checkout-sales-strip ul.marketplace-only{grid-template-columns:1fr!important}.checkout-sales-strip ul.marketplace-only li{border-left:none!important;border-top:1px solid #e2e9e4}.checkout-sales-strip ul.marketplace-only li:first-child{border-top:none}}

/* Blog detail: full-width editorial surface consistent with the current blog index. */
.blog-detail-page{background:var(--arajel-surface)!important}
.blog-detail-page .blog-detail-main{background:var(--arajel-surface)!important}
.blog-detail-page .blog-detail-banner{margin:0!important}
.blog-detail-page .blog-detail-banner .blog-detail-banner-inner{justify-content:center!important;min-height:245px}
.blog-detail-page .blog-detail-banner .sub-banner-title{width:100%!important;max-width:900px!important;margin-inline:auto!important}
.blog-detail-page .blog-detail-banner .breadcrum ul{flex-wrap:wrap;gap:7px 12px}
.blog-detail-page .blog-detail-banner .breadcrum li a{color:rgba(255,255,255,.84)!important}
.blog-article-section{padding:82px 0 112px!important;background:var(--arajel-surface)!important}
.blog-article-shell{width:min(100%,1120px);margin:0 auto;background:#fff;border:1px solid rgba(13,84,52,.10);border-radius:28px;box-shadow:0 22px 58px rgba(21,61,43,.09);overflow:hidden}
.blog-article-header{max-width:930px;margin:0 auto;padding:clamp(42px,5vw,72px) clamp(28px,6vw,74px) clamp(30px,4vw,46px);text-align:center}
.blog-article-kicker{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:10px;color:#7d9186;font-size:13px;font-weight:600;line-height:1.4}
.blog-article-kicker>span:first-child{color:#6f9826;font-weight:800;letter-spacing:.04em}
.blog-article-dot{width:4px;height:4px;border-radius:50%;background:#a2b0a8}
.blog-article-header h1{max-width:900px;margin:18px auto 20px;color:var(--arajel-text);font-size:clamp(38px,5.1vw,66px)!important;line-height:1.06!important;letter-spacing:-.035em;overflow-wrap:break-word!important}
.blog-article-lead{max-width:790px;margin:0 auto;color:var(--arajel-muted);font-size:clamp(17px,1.4vw,20px);line-height:1.72}
.blog-detail-page .blog-detail-byline{justify-content:center;margin-top:22px;color:#87978e;font-size:12px;gap:9px}
.blog-detail-page .blog-detail-cover{width:calc(100% - clamp(28px,6vw,72px));max-width:none;margin:0 auto 0!important;border-radius:22px;box-shadow:none;overflow:hidden;background:#edf4ef}
.blog-detail-page .blog-detail-cover img{display:block;width:100%;height:auto;max-height:620px;object-fit:cover}
.blog-detail-page .blog-prose{max-width:860px;margin:0 auto;padding:clamp(40px,5vw,68px) clamp(28px,6vw,70px);font-size:17px;line-height:1.88;color:#385147}
.blog-detail-page .blog-prose>*:first-child{margin-top:0!important}
.blog-detail-page .blog-prose>*:last-child{margin-bottom:0!important}
.blog-detail-page .blog-prose h2{font-size:clamp(28px,3vw,36px)!important;line-height:1.2!important;margin:44px 0 16px}
.blog-detail-page .blog-prose h3{font-size:clamp(23px,2.2vw,28px)!important;line-height:1.28!important;margin:34px 0 13px}
.blog-detail-page .blog-prose a{color:#0c6940;text-decoration:underline;text-underline-offset:3px}
.blog-detail-page .blog-prose img{display:block;margin:30px auto;border-radius:18px}
.blog-article-footer{display:flex;align-items:center;justify-content:space-between;gap:34px;margin:0 clamp(28px,6vw,70px) clamp(32px,5vw,60px);padding:30px 32px;border-radius:20px;background:var(--arajel-green);color:#fff}
.blog-article-footer>div{max-width:680px}
.blog-article-footer>div>span{color:#b9dc62;font-size:12px;font-weight:800;letter-spacing:.11em;text-transform:uppercase}
.blog-article-footer h2{margin:8px 0 9px;color:#fff;font-size:clamp(23px,2.4vw,31px);line-height:1.2}
.blog-article-footer p{margin:0;color:rgba(255,255,255,.78);line-height:1.65}
.blog-article-footer>a{display:inline-flex;align-items:center;justify-content:center;gap:10px;flex:0 0 auto;padding:13px 17px;border-radius:11px;background:var(--arajel-lime);color:#17331f!important;font-weight:800;text-decoration:none!important;white-space:nowrap}
.blog-detail-page .blog-not-found{min-height:52vh;background:var(--arajel-surface);padding:80px 20px}
.blog-detail-page .blog-not-found>div{max-width:720px;padding:48px 34px;border-radius:24px;background:#fff;box-shadow:var(--arajel-shadow)}
.blog-detail-page .blog-not-found h2{font-size:clamp(30px,4vw,44px);color:var(--arajel-text);margin:12px 0}
html[dir="rtl"] .blog-article-header,html[dir="rtl"] .blog-detail-page .blog-prose{text-align:right}
html[dir="rtl"] .blog-article-kicker,html[dir="rtl"] .blog-detail-page .blog-detail-byline{direction:rtl}
html[dir="rtl"] .blog-article-footer{text-align:right}
html[dir="rtl"] .blog-article-footer>a i{transform:scaleX(-1)}
@media(max-width:767.98px){
  .blog-article-section{padding:52px 0 76px!important}
  .blog-article-shell{border-radius:20px}
  .blog-article-header{padding:38px 22px 28px}
  .blog-article-header h1{font-size:clamp(32px,9vw,44px)!important}
  .blog-detail-page .blog-detail-cover{width:calc(100% - 32px);border-radius:15px}
  .blog-detail-page .blog-prose{padding:38px 22px;font-size:16px;line-height:1.8}
  .blog-article-footer{margin:0 16px 24px;padding:25px 22px;flex-direction:column;align-items:flex-start}
  .blog-article-footer>a{width:100%;white-space:normal;text-align:center}
}

/* ARAJEL v16 legal documents & footer legal bar */
.footer-legal-bar{
    display:flex;align-items:center;gap:18px;margin-top:34px;padding:17px 0 0;border-top:1px solid rgba(255,255,255,.16);
    width:100%;min-width:0
}
.footer-legal-label{display:inline-flex;align-items:center;gap:7px;flex:0 0 auto;color:#b8d483;font-size:11px;font-weight:700;letter-spacing:.025em}
.footer-legal-label i{font-size:10px}
.footer-legal-links{display:flex;align-items:center;justify-content:flex-start;gap:0;flex-wrap:wrap;min-width:0}
.footer-legal-links a{position:relative;display:inline-flex;align-items:center;color:rgba(255,255,255,.73)!important;font-size:10.5px;line-height:1.45;font-weight:500;text-decoration:none!important;padding:3px 11px;transition:color .18s ease}
.footer-legal-links a:first-child{padding-left:0}
.footer-legal-links a:not(:last-child):after{content:"";position:absolute;right:0;top:50%;width:3px;height:3px;border-radius:50%;background:rgba(184,212,131,.58);transform:translate(50%,-50%)}
.footer-legal-links a:hover{color:#b8d483!important}

.legal-main{background:#f6faf8;overflow:hidden}
.legal-banner{min-height:290px!important}
.legal-banner .sub-banner-title h1{font-size:48px}
.legal-document-section{padding:76px 0 92px;background:linear-gradient(180deg,#f8fbf9 0%,#fff 100%)}
.legal-layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:30px;align-items:start}
.legal-document-card{min-width:0;padding:42px 48px 50px;border:1px solid #e4ece7;border-radius:26px;background:#fff;box-shadow:0 24px 64px rgba(25,74,50,.07)}
.legal-document-header{padding-bottom:28px;margin-bottom:30px;border-bottom:1px solid #e7eee9}
.legal-kicker{display:inline-flex;align-items:center;gap:8px;margin-bottom:14px;color:#719724;font-size:11px;font-weight:800;letter-spacing:.07em;text-transform:uppercase}
.legal-kicker i{font-size:12px}
.legal-document-header h1{max-width:900px;margin:0;color:#173b2a;font-size:38px;line-height:1.14;font-weight:700;letter-spacing:-.035em}
.legal-meta{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:18px;color:#7d8f86;font-size:10.5px}
.legal-meta span{display:inline-flex;align-items:center;gap:7px}.legal-meta i{color:#8eb53a}.legal-meta a{color:#536c60;text-decoration:none}.legal-meta a:hover{color:#6e9621}
.legal-prose{color:#556a60;font-size:15px;line-height:1.82;overflow-wrap:anywhere}
.legal-prose h2{margin:32px 0 10px;color:#1a452f;font-size:20px;line-height:1.35;font-weight:700;letter-spacing:-.012em}
.legal-prose h2:first-child{margin-top:0}
.legal-prose p{margin:0 0 16px}.legal-prose ul,.legal-prose ol{margin:8px 0 20px;padding-left:22px}.legal-prose li{margin:7px 0}.legal-prose a{color:#668d21;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}.legal-prose strong{color:#2b4b3c;font-weight:700}
.legal-sidebar{position:sticky;top:98px;display:grid;gap:16px}
.legal-sidebar-card,.legal-contact-card{border:1px solid #e2ebe5;border-radius:20px;background:#fff;box-shadow:0 18px 46px rgba(25,74,50,.055)}
.legal-sidebar-card>span{display:block;padding:18px 20px 14px;border-bottom:1px solid #ebf0ed;color:#7b8a82;font-size:10px;font-weight:800;letter-spacing:.075em;text-transform:uppercase}
.legal-sidebar-card nav{padding:8px}
.legal-sidebar-card a{display:grid;grid-template-columns:20px minmax(0,1fr) 12px;align-items:center;gap:9px;padding:11px 12px;border-radius:12px;color:#566a60;text-decoration:none;font-size:11px;font-weight:600;line-height:1.35;transition:.18s ease}
.legal-sidebar-card a>i:first-child{color:#91a399;text-align:center}.legal-sidebar-card a>i:last-child{font-size:8px;color:#aab7b0}.legal-sidebar-card a:hover,.legal-sidebar-card a.active{background:#f0f6e8;color:#31582f}.legal-sidebar-card a.active>i{color:#759d23}
.legal-contact-card{display:grid;gap:5px;padding:18px 20px}.legal-contact-card>i{margin-bottom:5px;color:#88aa34;font-size:19px}.legal-contact-card span{color:#7d8e85;font-size:9px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}.legal-contact-card a{color:#214b35;font-size:11px;font-weight:700;text-decoration:none;overflow-wrap:anywhere}
.legal-empty-card{max-width:720px;margin:70px auto 90px;padding:48px;border:1px solid #e2ebe5;border-radius:24px;background:#fff;text-align:center;box-shadow:0 20px 54px rgba(25,74,50,.06)}.legal-empty-card>span{display:block;color:#9ac439;font-size:46px;font-weight:800}.legal-empty-card h2{margin:8px 0 8px;color:#183e2b}.legal-empty-card p{color:#6c7e75}.legal-empty-card a{display:inline-flex;margin-top:13px;padding:10px 18px;border-radius:999px;background:#164e34;color:#fff;text-decoration:none}
html[dir="rtl"] .legal-prose ul,html[dir="rtl"] .legal-prose ol{padding-left:0;padding-right:22px}
html[dir="rtl"] .footer-legal-links a:first-child{padding-left:11px;padding-right:0}
html[dir="rtl"] .footer-legal-links a:not(:last-child):after{right:auto;left:0;transform:translate(-50%,-50%)}
html[dir="rtl"] .legal-sidebar-card a{grid-template-columns:12px minmax(0,1fr) 20px}
html[dir="rtl"] .legal-sidebar-card a>i:first-child{grid-column:3;grid-row:1}html[dir="rtl"] .legal-sidebar-card a>span{grid-column:2;grid-row:1}html[dir="rtl"] .legal-sidebar-card a>i:last-child{grid-column:1;grid-row:1;transform:rotate(180deg)}
@media(max-width:991.98px){.legal-layout{grid-template-columns:1fr}.legal-sidebar{position:static;order:-1}.legal-sidebar-card nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.legal-document-card{padding:34px 34px 40px}.legal-document-header h1{font-size:34px}}
@media(max-width:767.98px){.footer-legal-bar{align-items:flex-start;flex-direction:column;gap:8px;margin-top:28px;padding-top:15px}.footer-legal-links{margin:0 -8px}.footer-legal-links a,.footer-legal-links a:first-child{padding:4px 8px}.footer-legal-links a:not(:last-child):after{display:none}.legal-banner{min-height:235px!important}.legal-banner .sub-banner-title h1{font-size:34px}.legal-document-section{padding:48px 0 64px}.legal-document-card{padding:28px 22px 32px;border-radius:20px}.legal-document-header{padding-bottom:22px;margin-bottom:24px}.legal-document-header h1{font-size:29px}.legal-prose{font-size:14px;line-height:1.75}.legal-prose h2{font-size:18px}.legal-sidebar-card nav{grid-template-columns:1fr}.legal-contact-card{display:none}}
@media(max-width:480px){.legal-document-header h1{font-size:26px}.legal-meta{display:grid;gap:7px}}
.agreement-legal-link{color:#557f21!important;text-decoration:underline!important;text-decoration-thickness:1px!important;text-underline-offset:2px!important}.agreement-legal-link:hover{color:#315e18!important}.purchase-commercial-legal{display:flex;align-items:center;gap:7px;margin-top:8px;padding:9px 10px;border-radius:9px;background:#f6f9f4;color:#70806f;font-size:10px}.purchase-commercial-legal i{color:#7fa02c}.purchase-commercial-legal a{color:#55752e;text-decoration:underline;text-underline-offset:2px}

.contact-legal-link{color:#557f21!important;text-decoration:underline!important;text-decoration-thickness:1px!important;text-underline-offset:2px!important;font-weight:600}.contact-legal-link:hover{color:#315e18!important}


/* ================================================================
   ARAJEL v17 — Kurumsal yasal alan / footer sadeleştirmesi
   ================================================================ */
.footer-legal-bar{
  width:100%;
  margin-top:30px;
  padding:17px 0 5px;
  border-top:1px solid rgba(255,255,255,.10);
  display:block;
}
.footer-legal-links{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:0;
  flex-wrap:wrap;
  min-width:0;
  font-family:'Noto Sans',Arial,sans-serif;
}
.footer-legal-links a{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:4px 13px;
  color:rgba(255,255,255,.70)!important;
  font-family:'Noto Sans',Arial,sans-serif!important;
  font-size:11px;
  line-height:1.5;
  font-weight:400;
  letter-spacing:.005em;
  text-decoration:none!important;
  white-space:normal;
  transition:color .18s ease,opacity .18s ease;
}
.footer-legal-links a:first-child{padding-left:13px}
.footer-legal-links a:not(:last-child)::after{
  content:"";
  position:absolute;
  right:0;
  top:50%;
  width:3px;
  height:3px;
  border-radius:50%;
  background:rgba(184,212,131,.48);
  transform:translate(50%,-50%);
}
.footer-legal-links a:hover,.footer-legal-links a:focus{color:#b8d483!important}
.footer-legal-label{display:none!important}

/* Legal page hero: a single centered title, not the generic section name. */
.legal-page,.legal-page button,.legal-page input,.legal-page textarea,.legal-page select{
  font-family:'Noto Sans',Arial,sans-serif;
}
.legal-banner{
  min-height:300px!important;
  padding-top:118px!important;
  padding-bottom:82px!important;
}
.legal-banner .wrapper{
  width:min(100% - 48px,1180px)!important;
  margin-inline:auto!important;
}
.legal-banner .sub-banner-inner-con{
  width:100%!important;
  min-height:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  grid-template-columns:none!important;
}
.legal-banner .sub-banner-title{
  width:100%!important;
  max-width:1100px!important;
  margin:0 auto!important;
  padding:0!important;
  text-align:center!important;
}
.legal-banner .breadcrum{
  width:100%;
  display:flex;
  justify-content:center;
  margin-bottom:22px;
  font-family:'Noto Sans',Arial,sans-serif;
}
.legal-banner .breadcrum ul{
  justify-content:center!important;
  max-width:100%;
  margin-left:auto;
  margin-right:auto;
  text-align:center;
}
.legal-banner .breadcrum ul li,
.legal-banner .breadcrum ul li a{
  font-family:'Noto Sans',Arial,sans-serif!important;
  font-size:17px!important;
  line-height:1.45!important;
  font-weight:400!important;
}
.legal-banner .breadcrum ul li:last-child{
  max-width:min(720px,72vw);
  overflow-wrap:anywhere;
}
.legal-banner .sub-banner-title h1{
  display:block!important;
  width:100%!important;
  max-width:1000px!important;
  margin:0 auto!important;
  color:#fff!important;
  font-family:'Noto Sans',Arial,sans-serif!important;
  font-size:clamp(36px,3.35vw,56px)!important;
  line-height:1.12!important;
  font-weight:600!important;
  letter-spacing:-.035em!important;
  text-align:center!important;
  overflow-wrap:break-word;
  hyphens:none;
}
.legal-banner .sub-banner-title .text-border::after{
  left:50%!important;
  right:auto!important;
  width:min(320px,45vw)!important;
  transform:translateX(-50%)!important;
}

/* Legal content: quieter corporate typography and spacing. */
.legal-document-card{
  padding:44px 50px 52px;
  border-radius:20px;
  box-shadow:0 18px 52px rgba(25,74,50,.055);
}
.legal-document-header{
  padding-bottom:22px;
  margin-bottom:30px;
}
.legal-kicker{
  display:block;
  margin:0 0 14px;
  color:#315b43;
  font-family:'Noto Sans',Arial,sans-serif;
  font-size:18px;
  line-height:1.45;
  font-weight:600;
  letter-spacing:-.015em;
  text-transform:none;
}
.legal-meta{
  margin-top:0;
  gap:18px;
  color:#788a81;
  font-family:'Noto Sans',Arial,sans-serif;
  font-size:12px;
  line-height:1.55;
}
.legal-prose{
  color:#4f6259;
  font-family:'Noto Sans',Arial,sans-serif!important;
  font-size:15px;
  line-height:1.86;
  letter-spacing:0;
  overflow-wrap:break-word;
  word-break:normal;
  hyphens:none;
}
.legal-prose h2{
  margin:34px 0 12px;
  color:#183f2c;
  font-family:'Noto Sans',Arial,sans-serif!important;
  font-size:20px;
  line-height:1.38;
  font-weight:600;
  letter-spacing:-.015em;
}
.legal-prose strong{font-weight:600}
.legal-sidebar-card>span,
.legal-sidebar-card a,
.legal-contact-card span,
.legal-contact-card a{
  font-family:'Noto Sans',Arial,sans-serif!important;
}
.legal-sidebar-card a{font-size:11.5px;font-weight:500}

html[dir="rtl"] .legal-banner .sub-banner-title,
html[dir="rtl"] .legal-banner .breadcrum{
  text-align:center!important;
}
html[dir="rtl"] .legal-banner .breadcrum ul{
  justify-content:center!important;
}
html[dir="rtl"] .footer-legal-links a:first-child{padding-right:13px;padding-left:13px}

@media(max-width:991.98px){
  .legal-banner{min-height:260px!important;padding:92px 0 68px!important}
  .legal-banner .sub-banner-title h1{font-size:clamp(34px,5.4vw,48px)!important}
  .legal-document-card{padding:36px 36px 42px}
}
@media(max-width:767.98px){
  .footer-legal-bar{margin-top:25px;padding-top:14px}
  .footer-legal-links{justify-content:flex-start;margin:0!important}
  .footer-legal-links a,.footer-legal-links a:first-child{padding:5px 9px;font-size:10.5px}
  .footer-legal-links a:not(:last-child)::after{display:none}
  .legal-banner{min-height:225px!important;padding:72px 0 58px!important}
  .legal-banner .wrapper{width:calc(100% - 30px)!important}
  .legal-banner .breadcrum{margin-bottom:17px}
  .legal-banner .breadcrum ul{gap:14px;flex-wrap:wrap}
  .legal-banner .breadcrum ul li,.legal-banner .breadcrum ul li a{font-size:14px!important}
  .legal-banner .breadcrum ul li:first-child::after{right:-10px;font-size:16px}
  .legal-banner .breadcrum ul li:last-child{max-width:72vw}
  .legal-banner .sub-banner-title h1{font-size:clamp(30px,8.2vw,39px)!important;line-height:1.14!important;letter-spacing:-.03em!important}
  .legal-banner .sub-banner-title .text-border::after{bottom:-18px!important;width:min(220px,55vw)!important}
  .legal-document-card{padding:28px 22px 32px;border-radius:18px}
  .legal-kicker{font-size:16px}
  .legal-meta{font-size:11px}
  .legal-prose{font-size:14px;line-height:1.8}
  .legal-prose h2{font-size:18px}
}
@media(max-width:480px){
  .footer-legal-links{margin:0 -6px!important}
  .legal-banner .breadcrum ul li:last-child{max-width:68vw}
}

/* ================================================================
   ARAJEL v18 — Legal spacing, balanced legal hero & managed logos
   ================================================================ */

/* Legal document pages end with a deliberate breathing area. The spacer is a
   real cleared block, so floated legacy sections can never visually collide
   with the footer. */
.legal-footer-spacer{
  clear:both;
  display:block;
  width:100%;
  height:72px;
  background:linear-gradient(180deg,#fff 0%,#f5f9f6 100%);
}
.legal-page .footer-con{clear:both!important;margin-top:0!important}

/* Corporate legal hero: centered as one typographic group, with a quieter
   breadcrumb and a title that stays proportional at desktop/tablet widths. */
.legal-banner{
  min-height:310px!important;
  padding:0!important;
  display:flex!important;
  align-items:stretch!important;
}
.legal-banner .wrapper{
  width:min(100% - 48px,1180px)!important;
  margin-inline:auto!important;
  display:flex!important;
  align-items:stretch!important;
}
.legal-banner .legal-banner-inner{
  width:100%!important;
  min-height:310px!important;
  padding:82px 0 76px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}
.legal-banner .sub-banner-title{
  width:100%!important;
  max-width:960px!important;
  margin:0 auto!important;
  padding:0!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:27px!important;
  text-align:center!important;
}
.legal-banner .breadcrum{
  width:100%!important;
  margin:0!important;
  display:flex!important;
  justify-content:center!important;
}
.legal-banner .breadcrum ul{
  margin:0!important;
  gap:18px!important;
  align-items:center!important;
  justify-content:center!important;
  flex-wrap:wrap!important;
}
.legal-banner .breadcrum ul li,
.legal-banner .breadcrum ul li a{
  font-family:'Noto Sans',Arial,sans-serif!important;
  font-size:15px!important;
  line-height:1.45!important;
  font-weight:400!important;
  letter-spacing:0!important;
}
.legal-banner .breadcrum ul li:first-child::after{
  content:"/"!important;
  right:-12px!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  color:rgba(255,255,255,.45)!important;
  font-size:14px!important;
  font-weight:400!important;
}
.legal-banner .breadcrum ul li:last-child{
  max-width:min(680px,68vw)!important;
  overflow-wrap:break-word!important;
  word-break:normal!important;
}
.legal-banner .sub-banner-title h1{
  display:block!important;
  width:auto!important;
  max-width:900px!important;
  margin:0 auto!important;
  font-family:'Noto Sans',Arial,sans-serif!important;
  font-size:clamp(34px,3vw,48px)!important;
  line-height:1.14!important;
  font-weight:600!important;
  letter-spacing:-.025em!important;
  text-align:center!important;
  overflow-wrap:break-word!important;
  word-break:normal!important;
  hyphens:none!important;
}
.legal-banner .sub-banner-title .text-border::after{
  left:50%!important;
  right:auto!important;
  bottom:-24px!important;
  width:min(250px,38vw)!important;
  transform:translateX(-50%)!important;
}

/* Managed logo strip keeps the exact public design even when a logo has an
   optional external URL. */
.arajel-client-logos ul li figure,
.home-client-logos ul li figure{
  width:100%;
  height:100%;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}
.arajel-client-logos ul li figure>a,
.home-client-logos ul li figure>a{
  width:100%;
  height:100%;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-decoration:none!important;
}

@media(max-width:991.98px){
  .legal-footer-spacer{height:58px}
  .legal-banner{min-height:275px!important}
  .legal-banner .legal-banner-inner{min-height:275px!important;padding:68px 0 62px!important}
  .legal-banner .sub-banner-title{gap:22px!important}
  .legal-banner .sub-banner-title h1{font-size:clamp(32px,4.5vw,42px)!important}
  .legal-banner .breadcrum ul li,.legal-banner .breadcrum ul li a{font-size:14px!important}
}
@media(max-width:767.98px){
  .legal-footer-spacer{height:46px}
  .legal-banner{min-height:235px!important}
  .legal-banner .wrapper{width:calc(100% - 30px)!important}
  .legal-banner .legal-banner-inner{min-height:235px!important;padding:54px 0 52px!important}
  .legal-banner .sub-banner-title{gap:18px!important}
  .legal-banner .breadcrum ul{gap:14px!important}
  .legal-banner .breadcrum ul li,.legal-banner .breadcrum ul li a{font-size:13px!important}
  .legal-banner .breadcrum ul li:first-child::after{right:-10px!important;font-size:12px!important}
  .legal-banner .breadcrum ul li:last-child{max-width:72vw!important}
  .legal-banner .sub-banner-title h1{font-size:clamp(29px,8vw,37px)!important;line-height:1.16!important;letter-spacing:-.02em!important}
  .legal-banner .sub-banner-title .text-border::after{bottom:-18px!important;width:min(190px,52vw)!important}
}
@media(max-width:480px){
  .legal-footer-spacer{height:38px}
  .legal-banner .legal-banner-inner{padding:48px 0 46px!important}
  .legal-banner .breadcrum ul li:last-child{max-width:67vw!important}
}

/* =========================================================
   V19 · Google Analytics + KVKK uyumlu çerez tercih katmanı
   ========================================================= */
.cookie-consent-open{overflow:hidden}
.cookie-consent-layer{position:fixed;inset:0;z-index:10050;background:rgba(5,32,20,.28);backdrop-filter:blur(5px);display:flex;align-items:flex-end;justify-content:center;padding:18px;opacity:0;visibility:hidden;transition:opacity .22s ease,visibility .22s ease}
.cookie-consent-layer.is-open{opacity:1;visibility:visible}
.cookie-consent-sheet{position:relative;width:min(1180px,calc(100vw - 36px));background:rgba(255,255,255,.985);border:1px solid rgba(18,91,57,.12);border-radius:24px;box-shadow:0 26px 80px rgba(6,42,25,.22);transform:translateY(24px);transition:transform .24s ease;overflow:hidden;color:#193b2c}
.cookie-consent-layer.is-open .cookie-consent-sheet{transform:translateY(0)}
.cookie-consent-close{position:absolute;right:18px;top:18px;width:36px;height:36px;border:1px solid #dfe9e3;border-radius:50%;background:#fff;color:#5f756b;display:grid;place-items:center;cursor:pointer;z-index:3;transition:.16s ease}
.cookie-consent-close:hover{background:#f2f7f4;color:#0e5b39;border-color:#cfe0d6}
.cookie-consent-main{display:grid;grid-template-columns:58px minmax(0,1fr) minmax(430px,.75fr);gap:22px;align-items:center;padding:24px 64px 24px 26px}
.cookie-consent-icon{width:54px;height:54px;border-radius:17px;background:#edf6df;color:#6b9625;display:grid;place-items:center;font-size:21px}
.cookie-consent-copy h2,.cookie-preferences-head h2{margin:0 0 7px;font-size:20px;line-height:1.25;font-weight:700;letter-spacing:-.02em;color:#123d2a;font-family:inherit}
.cookie-consent-copy p,.cookie-preferences-head p{margin:0;color:#60736a;font-size:12px;line-height:1.65;max-width:700px}
.cookie-policy-link{display:inline-flex;align-items:center;gap:6px;margin-top:8px;color:#367347!important;font-size:10.5px;font-weight:700;text-decoration:none!important}
.cookie-policy-link:hover{color:#82aa2d!important}
.cookie-policy-link i{font-size:8px}
.cookie-consent-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.cookie-btn{min-height:44px;border-radius:11px;padding:10px 13px;font-size:10.5px;font-weight:750;letter-spacing:.005em;cursor:pointer;transition:transform .15s ease,background .15s ease,border-color .15s ease,color .15s ease;white-space:nowrap}
/* Ana üç seçim bilinçli biçimde eşit görsel ağırlıktadır. */
.cookie-consent-actions .cookie-btn{background:#fff;border:1px solid #cddbd3;color:#285c42;box-shadow:none}
.cookie-consent-actions .cookie-btn:hover,.cookie-consent-actions .cookie-btn:focus{background:#eff6e8;border-color:#9fbe73;color:#174d32;transform:translateY(-1px)}
.cookie-btn-primary{background:#0e5b39;border:1px solid #0e5b39;color:#fff}
.cookie-btn-primary:hover{background:#0a4b2f;border-color:#0a4b2f;color:#fff;transform:translateY(-1px)}
.cookie-btn-neutral{background:#f4f7f5;border:1px solid #dbe5df;color:#385a49}
.cookie-btn-outline{background:#fff;border:1px solid #cad8d0;color:#315d47}
.cookie-consent-preferences{padding:25px 28px 24px}
.cookie-preferences-head{display:grid;grid-template-columns:auto 1fr;align-items:start;gap:16px;padding:0 45px 20px 0;border-bottom:1px solid #e8eeea}
.cookie-back-btn{display:inline-flex;align-items:center;gap:7px;border:0;background:#f2f6f3;color:#486557;border-radius:10px;padding:9px 11px;font-size:10px;font-weight:750;cursor:pointer}
.cookie-category-list{display:grid;gap:9px;margin:18px 0}
.cookie-category-row{display:grid;grid-template-columns:42px minmax(0,1fr) auto;align-items:center;gap:13px;padding:13px 15px;border:1px solid #e4ebe7;border-radius:14px;background:#fbfcfb;margin:0;cursor:pointer}
.cookie-category-row.is-necessary{cursor:default;background:#f7faf8}
.cookie-category-icon{width:38px;height:38px;border-radius:11px;background:#edf5e8;color:#5e8927;display:grid;place-items:center;font-size:13px}
.cookie-category-copy{display:grid;gap:3px}
.cookie-category-copy strong{font-size:11.5px;color:#244737;font-weight:750}
.cookie-category-copy p{margin:0;font-size:9.8px;line-height:1.5;color:#718078}
.cookie-always-on{display:inline-flex;align-items:center;justify-content:center;padding:6px 9px;border-radius:999px;background:#eef6e5;color:#557a25;font-size:8.5px;font-weight:800;white-space:nowrap}
.cookie-switch{position:relative;width:42px;height:24px;flex:0 0 auto}
.cookie-switch input{position:absolute;opacity:0;pointer-events:none}
.cookie-switch i{position:absolute;inset:0;border-radius:999px;background:#d8dfdb;transition:.18s ease;box-shadow:inset 0 0 0 1px rgba(31,71,50,.05)}
.cookie-switch i:after{content:"";position:absolute;width:18px;height:18px;left:3px;top:3px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(10,44,26,.18);transition:.18s ease}
.cookie-switch input:checked+i{background:#8fc529}
.cookie-switch input:checked+i:after{transform:translateX(18px)}
.cookie-switch input:focus-visible+i{outline:3px solid rgba(84,137,105,.18);outline-offset:2px}
.cookie-preferences-footer{display:flex;align-items:center;justify-content:space-between;gap:18px;padding-top:4px}
.cookie-preferences-footer .cookie-policy-link{margin:0}
.cookie-preferences-footer .cookie-btn{min-width:180px}
.cookie-settings-fab{position:fixed;left:18px;bottom:18px;z-index:9990;display:inline-flex;align-items:center;gap:8px;min-height:38px;padding:8px 12px;border-radius:999px;border:1px solid rgba(19,88,55,.18);background:rgba(255,255,255,.96);box-shadow:0 8px 28px rgba(8,51,29,.13);color:#285c43;font-size:9px;font-weight:750;cursor:pointer;backdrop-filter:blur(8px);transition:.18s ease}
.cookie-settings-fab:hover{background:#f0f6ec;color:#0e5b39;transform:translateY(-1px)}
.cookie-settings-fab i{color:#81ad2c;font-size:11px}
.cookie-consent-toast{position:fixed;left:50%;bottom:26px;z-index:10070;transform:translate(-50%,15px);padding:10px 15px;border-radius:10px;background:#123f2c;color:#fff;font-size:10px;font-weight:650;box-shadow:0 10px 35px rgba(4,39,22,.2);opacity:0;transition:.2s ease}
.cookie-consent-toast.is-visible{opacity:1;transform:translate(-50%,0)}
.external-media-placeholder{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:24px;background:linear-gradient(145deg,#eef4f0,#e5eee9);text-align:center;color:#436052}
.external-media-placeholder i{font-size:25px;color:#86ad38}
.external-media-placeholder strong{font-size:12px;color:#294b3a}
.external-media-placeholder button{border:1px solid #bfd1c5;background:#fff;color:#285b42;border-radius:9px;padding:8px 12px;font-size:9.5px;font-weight:750;cursor:pointer}
.contact-map-frame{position:relative}
html[dir="rtl"] .cookie-consent-close{right:auto;left:18px}
html[dir="rtl"] .cookie-consent-main{padding-right:26px;padding-left:64px}
html[dir="rtl"] .cookie-preferences-head{padding-right:0;padding-left:45px}
html[dir="rtl"] .cookie-back-btn i{transform:rotate(180deg)}
html[dir="rtl"] .cookie-switch input:checked+i:after{transform:translateX(-18px)}
html[dir="rtl"] .cookie-switch i:after{left:auto;right:3px}
html[dir="rtl"] .cookie-settings-fab{left:auto;right:18px}
@media(max-width:1050px){
  .cookie-consent-main{grid-template-columns:52px minmax(0,1fr);padding-right:26px}
  .cookie-consent-actions{grid-column:1/-1;margin-top:2px}
  html[dir="rtl"] .cookie-consent-main{padding-left:26px}
}
@media(max-width:700px){
  .cookie-consent-layer{padding:8px;align-items:flex-end}
  .cookie-consent-sheet{width:calc(100vw - 16px);border-radius:20px;max-height:calc(100dvh - 16px);overflow:auto}
  .cookie-consent-main{grid-template-columns:42px minmax(0,1fr);gap:13px;padding:20px 18px 18px}
  .cookie-consent-icon{width:40px;height:40px;border-radius:13px;font-size:16px}
  .cookie-consent-copy h2,.cookie-preferences-head h2{font-size:17px;padding-right:26px}
  .cookie-consent-copy p,.cookie-preferences-head p{font-size:10.5px;line-height:1.58}
  .cookie-consent-actions{grid-template-columns:1fr;gap:7px}
  .cookie-btn{min-height:42px;width:100%;font-size:10px}
  .cookie-consent-close{top:13px;right:13px;width:32px;height:32px}
  .cookie-consent-preferences{padding:18px 16px 16px}
  .cookie-preferences-head{grid-template-columns:1fr;padding:0 34px 16px 0;gap:10px}
  .cookie-back-btn{width:max-content;padding:7px 9px}
  .cookie-category-row{grid-template-columns:36px minmax(0,1fr) auto;gap:9px;padding:11px 10px}
  .cookie-category-icon{width:34px;height:34px}
  .cookie-category-copy strong{font-size:10.5px}.cookie-category-copy p{font-size:8.8px}
  .cookie-always-on{font-size:7.5px;padding:5px 7px}
  .cookie-preferences-footer{display:grid;gap:12px}.cookie-preferences-footer .cookie-btn{min-width:0}
  .cookie-settings-fab{left:10px;bottom:10px;padding:9px;width:38px;height:38px;justify-content:center}.cookie-settings-fab span{display:none}
  html[dir="rtl"] .cookie-consent-close{right:auto;left:13px}
  html[dir="rtl"] .cookie-consent-main{padding:20px 18px 18px}
  html[dir="rtl"] .cookie-preferences-head{padding-right:0;padding-left:34px}
  html[dir="rtl"] .cookie-settings-fab{left:auto;right:10px}
}
.cookie-consent-layer[hidden],.cookie-settings-fab[hidden],.cookie-consent-toast[hidden],[data-cookie-view][hidden],[data-external-media-placeholder][hidden]{display:none!important}


/* ==========================================================================\n   v25 — Footer logo smart sizing\n   Different source logos have very different aspect ratios. The renderer now\n   calculates a safe width/height from the real PNG/SVG ratio and applies an\n   optional per-logo panel scale. Wide municipality/partner wordmarks therefore\n   remain readable without making compact logos oversized.\n   ========================================================================== */
.arajel-client-logos .footer-logo-managed-img,
.home-client-logos .footer-logo-managed-img {
    display: block !important;
    width: var(--footer-logo-width, 50%) !important;
    max-width: var(--footer-logo-width, 50%) !important;
    max-height: var(--footer-logo-height, 76px) !important;
    height: auto !important;
    object-fit: contain !important;
    object-position: center !important;
    margin: 0 auto !important;
}
.arajel-client-logos .footer-logo-cell figure,
.home-client-logos .footer-logo-cell figure,
.arajel-client-logos .footer-logo-cell figure > a,
.home-client-logos .footer-logo-cell figure > a {
    min-width: 0 !important;
    padding: 0 10px !important;
}
@media (max-width: 767.98px) {
    .arajel-client-logos .footer-logo-cell figure,
    .home-client-logos .footer-logo-cell figure,
    .arajel-client-logos .footer-logo-cell figure > a,
    .home-client-logos .footer-logo-cell figure > a { padding-left: 6px !important; padding-right: 6px !important; }
}


/* ARAJEL V29 — header marka işareti: mevcut oran korunarak çok hafif büyütme */
@media (max-width: 991.98px){
  .header-con .navbar-brand img{max-width:130px!important;}
}
@media (max-width: 575.98px){
  .header-con .navbar-brand img{max-width:126px!important;}
}