/*
Theme Name: KodFu Theme backup
Theme URI: http://yourwebsite.com
Author: Mehmet Gunes
Description: Custom Theme for KodFu Project
Version: 1.0
*/
.text-blue {
    color: #3C61EC;
}

h1,
h2,
h3,
h4 {
    color: #262626;
}

.fs-42 {
    font-size: 42px;
}

* {
    font-family: "Inter", sans-serif;
}

body {
    background-color: #ffffff;
    padding-top: 100px;
}

/* === GENEL NAVBAR === */
.navbar-kodfu {
    position: fixed;
    top: 0;
    left: 0;
    margin-top: 1rem;
    width: 100%;
    z-index: 1000;
    display: flex;
    justify-content: center;
    padding-top: 15px;
}

.navbar-container {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.8rem 2rem;
    background: white;
    backdrop-filter: blur(8px);
    border-radius: 30px;
    box-shadow: 0px 4px 15px rgba(0, 0, 0, 0.08);
    gap: 2rem;
    max-width: 1100px;
    width: auto;
}

/* Logo */
.navbar-logo img {
    height: 28px;
}

/* Menü */
.navbar-menu {
    display: flex;
    gap: 2rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.navbar-menu li a {
    text-decoration: none;
    color: #000;
    font-size: 0.85rem;
    font-weight: 500;
    transition: color 0.2s ease;
    transition: all 0.1s ease-out;
}

.navbar-menu li a:hover {
    color: #e95d00;
    font-size: 1.2rem;
    font-weight: 900;
}

/* === MOBİL === */
@media (max-width: 991px) {
    .navbar-container {
        flex-direction: row;
        justify-content: space-between;
        width: 90%;
        border-radius: 20px;
    }

    .navbar-toggle {
        background: white;
        border: 1px solid #ccc;
        border-radius: 8px;
        padding: 6px 12px;
        font-size: 1.2rem;
    }

    .navbar-menu {
        display: none;
        position: absolute;
        top: 110%;
        right: 20px;
        background: #ffffff;
        flex-direction: column;
        padding: 1rem 2rem;
        border-radius: 0px 0px 16px 16px;
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
        width: 75vw;
        max-width: 400px;
    }


    .navbar-menu.active {
        display: flex;
    }

    .navbar-menu li {
        margin: 10px 0;
        text-align: center;
    }

    .navbar-menu li a {
        font-size: 1rem;
    }
}


.badge-kodfu {
    background-color: #ffffff;
    display: inline-flex;
    padding: 8px 30px;
    border-radius: 50px;
    overflow: visible;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.badge-kodfu svg {
    height: 16px;
}

.custom-border {
    position: relative;
}

.custom-border::before {
    content: "";
    z-index: -1;
    position: absolute;
    border-radius: 50px;
    top: -4px;
    left: -4px;
    right: -4px;
    bottom: -4px;
    background: linear-gradient(150deg, rgba(255, 255, 255, 0.8) 0%, rgba(153, 153, 153, 0.4) 100%);
    border: 2px solid #f3f5f7;
    box-shadow: 0px 24px 24px 0px rgba(14, 63, 126, 0.04), 0px 12px 12px 0px rgba(14, 63, 126, 0.04), 0px 6px 6px 0px rgba(42, 51, 70, 0.04), 0px 3px 3px 0px rgba(42, 51, 70, 0.04), 0px 1px 1px 0px rgba(42, 51, 69, 0.04);
}

.custom-border input {
    border: none;
    background: #ffffff;
    border-top-left-radius: 50px;
    border-bottom-left-radius: 50px;
    padding: 10px 20px;
    font-size: 1rem;
    font-weight: 400;
}

.custom-border input::placeholder {
    color: #999;
}

.custom-border input::focus {
    outline-width: 0 !important;
    outline: none !important;
    border: 0 !important;
    background-color: red !important;
}

.custom-border input:focus {
    outline: none !important;
    border: none !important;
}

.custom-border button {
    transition: all 0.2s ease;
    border-radius: 50px;
    padding: 10px 20px;
    border-radius: 50px;
    border: 1px solid #F3F5F7;
    background: linear-gradient(69deg, #FEF7F6 0%, #DDE0F0 27%, #FEF7F6 65%, #DDE0F0 93%);
    font-size: 1rem;
    font-weight: 400;
}

.custom-border button:hover {
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
}

.form-contact-cta {
    background-color: #ffffff;
    border-radius: 50px;
}

.container-hero .wrapper {
    overflow: hidden;
    border-radius: 20px;
    border: 1px solid #F3F5F7;
    position: relative;
}

.container-hero .wrapper::before {
    content: "";
    z-index: -1;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(65deg, #FEF7F6 0%, #ECEFFC 47%, #FEF7F6 100%);
}


/* === HERO SLIDER KARTLARI === */
.hero-slider .swiper-slide {
    border-radius: 20px;
    padding: 20px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    height: 480px; /* Figma ölçüsü */
    transition: transform 0.3s ease;
}

.hero-slider .swiper-slide:hover {
    transform: translateY(-5px);
}

.hero-slider .swiper-slide img {
    width: 100%;
     /* Figma ölçüsüne göre sabit */
    max-height: 270px;
    min-height: 270px;
    object-fit: cover;
    border-radius: 12px;
    margin-bottom: 12px;
}

/* Başlık (SVG + Yazı) */
.hero-slider .title {
    display: flex;
    align-items: center;
    font-size: 1rem;
    font-weight: 600;
    color: #000;
  
    margin-bottom: 8px;
}

/* Açıklama */
.hero-slider .description {
    font-size: 0.8rem;
    color: #555;
    line-height: 1.5;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 5; /* Max 5 satır */
    -webkit-box-orient: vertical;
}

/* Responsive Düzenleme */
@media (max-width: 768px) {
    .hero-slider .swiper-slide {
        height: auto;
    }

    .hero-slider .description {
        -webkit-line-clamp: 6;
    }
}


.ref-slider .swiper-slide {
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ref-slider .swiper-slide img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.boxed-icon {
    border: 1px solid #C2E1FF;
    border-radius: 8px;
    padding: 10px;
    background-color: #FEF7F6;
    box-shadow: 0px 5px 11px 0px rgba(0, 0, 0, 0.08);
}

.kodfu-features p.title {
    font-weight: bold;
    color: #262626;
    font-size: 1.2rem;
}

.kodfu-features p.info {
    color: #5F5F5F;
    font-size: 1rem;
}

@media (min-width: 1199px) {
    .trust-us {
        margin-top: 200px;
    }
}

.trust-us h3.title {
    color: #262626;
    font-weight: 500px;
    font-size: 40px;
}

@media (min-width: 1199px) {
    .trust-us h3.title {
        font-size: 60px;
        line-height: 72px;
    }
}

.trust-us .card {
    max-width: 500px;
    border-radius: 10px;
    box-shadow: 0px 24px 24px 0px rgba(14, 63, 126, 0.04), 0px 12px 12px 0px rgba(14, 63, 126, 0.04), 0px 6px 6px 0px rgba(42, 51, 70, 0.04), 0px 3px 3px 0px rgba(42, 51, 70, 0.04), 0px 1px 1px 0px rgba(42, 51, 69, 0.04);
}

.trust-us .card p.big {
    font-weight: bold;
    color: #896CFF;
    font-size: 4rem;
    margin-bottom: 10px;
}

.trust-us .card p:not(.big) {
    font-weight: 600;
    color: #262626;
    font-size: 1rem;
}

.kodfu-sectors h3 {
    color: #262626;
    font-size: 2rem;
    line-height: 2.5rem;
}

@media (min-width: 1199px) {
    .kodfu-sectors h3 {
        font-size: 3.5rem;
        line-height: 4.5rem;
    }
}

.kodfu-sectors p .img-sector {
    border-radius: 20px;
}

.partner-logos {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 55px;
}

.partner-logos img {
    width: 14.2857142857%;
}

@media (max-width: 991px) {
    .partner-logos img {
        width: 20%;
    }
}

@media (max-width: 767px) {
    .partner-logos img .your-class {
        width: 33.3333333333%;
        height: auto;
    }
}

.certificate-logos {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 30px;
    margin-top: 40px;
}

.cert-card {
    width: 160px;
    min-height: 150px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    background: #fff;
    padding: 10px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
    border-radius: 8px;
}

.cert-card img {
    max-height: 80px;
    object-fit: contain;
    margin-bottom: 10px;
}

.cert-card p {
    font-size: 0.9rem;
    font-weight: 500;
    margin-bottom: 4px;
    color: #111;
}

.cert-card .cert-link {
    font-size: 0.85rem;
    color: #3C61EC;
    text-decoration: none;
    font-weight: 500;
}


.start-working .inset {
    border-radius: 30px;
    overflow: hidden;
    padding: 30px;
    background: linear-gradient(90deg, #1f2fff, #7258ff, #c156ff, #ff6e5d);



    min-height: 400px;
}

.start-working .inset h3 {
    color: #ffffff;
}

.start-working .inset p {
    color: #ffffff;
}

.footer-menu li a {
    transition: all 0.2s ease;
    text-decoration: none;
    color: #000000;
}

.footer-menu li a:hover {
    color: #da5000;
    font-weight: 800;
    font-size: 1.2rem;
}

@media (max-width: 991px) {
    .footer-menu .col-footer-certificates img {
        height: 40px !important;
    }
}

/*-------------------------------------------------------*/
/* HEALTTECH CSS */

/* Başlık */
.header-title h2 {
    font-size: 5rem;
    line-height: 1.2;
}

.header-content p {
    font-size: 1.1rem;
    color: #4a4a4a;
    max-width: 480px;
    margin: auto;
}

/* Responsive */
@media (max-width: 992px) {
    .header-title h2 {
        font-size: 2.2rem;
    }

    .header-content p {
        font-size: 1rem;
    }
}

@media (max-width: 576px) {
    .header-title h2 {
        font-size: 1.8rem;
    }

    .header-content p {
        font-size: 0.95rem;
    }
}


.ortak-logolar .ortak-logo {
    max-height: 50px;
    opacity: 0.85;
    transition: transform 0.3s ease, opacity 0.3s ease;
}

.ortak-logolar .ortak-logo:hover {
    opacity: 1;
    transform: scale(1.05);
}

/* Responsive */
@media (max-width: 768px) {
    .ortak-logolar .ortak-logo {
        max-height: 40px;
    }
}

@media (max-width: 480px) {
    .ortak-logolar .ortak-logo {
        max-height: 35px;
    }
}


.psp-header h2 {
    font-size: 3rem;
    line-height: 1.2;
}

.psp-header .badge {
    font-size: 0.95rem;
    background: #fff;
}

/* Responsive Ayarlar */
@media (max-width: 992px) {
    .psp-header h2 {
        font-size: 2.2rem;
    }
}

@media (max-width: 576px) {
    .psp-header h2 {
        font-size: 1.8rem;
    }

    .psp-header .badge {
        font-size: 0.85rem;
        padding: 6px 16px;
    }
}


/* Genel Section */
.innovation-section {
    padding-left: 3%;
    padding-right: 3%;
}

.innovation-section h2 {
    line-height: 1.3;
    color: #262626;
}

.innovation-section p {
    font-size: 1rem;
    color: #555;
    max-width: 600px;
}

/* Badge */
.badge {
    font-size: 0.95rem;
}

/* Tik İşareti */
.check-icon {
    font-size: 1rem;
    color: #3C61EC;
    /* Ana proje rengi */
    font-weight: bold;
}

/* Sağdaki Görsel */
.image-area img {
    border-radius: 20px;
}

/* Logo Badge */
.logo-badge {
    bottom: 15px;
    right: 15px;
    font-size: 0.9rem;
    padding: 6px 14px;
    display: flex;
    align-items: center;
    gap: 8px;
    border: 1px solid #E3EAFD;
}

/* Responsive */
@media (max-width: 992px) {
    .innovation-section {
        padding-left: 20px;
        padding-right: 20px;
    }

    .innovation-section h2 {
        font-size: 1.8rem;
    }

    .logo-badge {
        font-size: 0.85rem;
        padding: 5px 10px;
    }
}

@media (max-width: 576px) {
    .innovation-section h2 {
        font-size: 1.4rem;
    }

    .logo-badge {
        font-size: 0.8rem;
        padding: 4px 8px;
    }
}


.urun-card {
    background: #f9f9ff;
    border-radius: 20px;
    padding: 16px;
    position: relative;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
}

.urun-card .badge-tag {
    position: absolute;
    top: 35px;
    left: 35px;
    background: #fff;
    color: #262626;
    font-size: 0.85rem;
    padding: 6px 14px;
    border-radius: 50px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
}

.urun-card .card-image {
    width: 100%;
    border-radius: 16px;
    margin-bottom: 12px;
}


.urun-card .website-label {
    display: inline-block;
    background: #fff;
    color: #3c61ec;
    font-size: 0.85rem;
    border-radius: 50px;
    padding: 6px 12px;
    margin-bottom: 10px;
    text-decoration: none;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
    width: fit-content;
    /* sadece içerik kadar genişlik */
    max-width: 100%;
    white-space: nowrap;
}


.urun-card .card-content h5 {
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: 8px;
}

.urun-card .card-content p {
    font-size: 0.95rem;
    color: #555;
    margin-bottom: 16px;
}



/* Pagination */
.pagination .page-item .page-link {
    border-radius: 8px;
    margin: 0 5px;
    color: #3c61ec;
    font-weight: 500;
}

.pagination .active .page-link {
    background: #3c61ec;
    color: #fff;
}

/* Responsive */
@media (max-width: 768px) {
    .urun-card .card-content h5 {
        font-size: 1rem;
    }

    .urun-card .card-content p {
        font-size: 0.9rem;
    }
}

/* Meet the Team Başlık ve Açıklama */
.meet-team h2 {
    font-size: 2.5rem;
    line-height: 1.2;
    color: #111;
    font-weight: 700;
}

.meet-team p {
    font-size: 1rem;
    color: #555;
    max-width: 600px;
}

/* Responsive Tipografi ve Buton */
@media (max-width: 992px) {
    .meet-team h2 {
        font-size: 2rem;
    }
}

@media (max-width: 768px) {
    .meet-team h2 {
        font-size: 1.8rem;
    }

    .meet-team p {
        font-size: 0.95rem;
    }
}

@media (max-width: 576px) {
    .meet-team h2 {
        font-size: 1.6rem;
    }

    .btn-more {
        width: 60%;
        justify-content: center;
    }
}

/*-------------------------------------------------------*/
/* ınsıght CSS */
.latest-tech .tech-box {
    padding: 40px;
}

.latest-tech h1 {
    font-size: 5rem;
    line-height: 1.2;
    color: #262626;
}

.latest-tech p {
    font-size: 1rem;
    color: #5F5F5F;
    max-width: 500px;
}

.filter-buttons .btn {
    background: #fff;
    border: 1px solid #ddd;
    font-weight: 500;
    transition: all 0.3s ease;
    box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.05);
}

.filter-buttons .btn.active {
    background: linear-gradient(90deg, #3C61EC 0%, #6F52E4 100%);
    color: #fff;
    box-shadow: 0px 4px 12px rgba(60, 97, 236, 0.3);
}

.insight-card {
    background: #f8f9ff;
    border-radius: 20px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 0;
    position: relative;
}

/* Görsel */
.insight-card img {
    width: 100%;
    height: 250px;
    object-fit: cover;
    border-radius: 40px 40px 40px 40px;
    padding: 15px;
    display: block;
    position: relative;
}

/* Badge - Görselin sol üstünde */
.insight-card .category-label {
    position: absolute;
    top: 20px;
    left: 20px;
    background: rgba(255, 255, 255, 0.85);
    font-size: 0.8rem;
    padding: 4px 12px;
    border-radius: 50px;
    font-weight: 500;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
    z-index: 2;
}

/* Website etiketi - Görselin sağ altında */
.insight-card .website-label {
    position: absolute;
    bottom: 15px;
    right: 15px;
    background: rgba(255, 255, 255, 0.75);
    color: #3c61ec;
    font-size: 0.8rem;
    padding: 4px 10px;
    border-radius: 50px;
    text-decoration: none;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
    z-index: 2;
}

/* İçerik alanı */
.insight-card .pad-4 {
    padding: 10px 30px 30px 30px;

    flex-grow: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    text-align: left;
    flex-wrap: wrap;
    align-content: flex-start;
    align-items: flex-start;
}

/* Başlık */
.insight-card h5 {
    font-size: 1.5rem;
    font-weight: 500;
    margin-bottom: 8px;
}

/* Açıklama */
.insight-card p {
    font-size: 0.9rem;
    color: #555;
    margin-bottom: 16px;
}

.text-read {
    font-size: 3rem;
}

.readmore-section .content-box {
    font-size: 1rem;
    line-height: 1.6;
    color: #4a4a4a;
}

.readmore-section .content-box p {
    margin-bottom: 1.5rem;
}

.readmore-section img {
    display: block;
    width: 100%;
    border-radius: 20px;
    object-fit: cover;
}



/*-------------------------------------------------------*/
/* Service CSS */
/* ---------------- Utility ---------------- */


.gradient-box-gray {
    background: linear-gradient(69deg, #d7e4f7 45%, #c9c6c7 100%, #bbbbbb00 60%);

}

/* ---------------- Gradient Header ---------------- */
/* Header Başlık ve Paragraf Genel Stil */
/* Gradient Background ve Rounded zaten mevcut utility.css içinde */

/* Başlık */
/* Başlık */
.services-title h2 {
    font-size: 4rem;
    font-weight: 700;
    line-height: 1.2;
}

.services-title h2 span {
    color: #3c61ec;
}

/* İçerik Metni */
.services-content p {
    font-size: 1.1rem;
    color: #4a4a4a;
    max-width: 400px;
    margin: auto;
}

/* Question Card */
.question-card {
    position: absolute;
    bottom: 20px;
    right: 20px;
    background: #fff;
    max-width: 400px;
}

/* =========================
   Responsive Düzenlemeler
   ========================= */
@media (max-width: 992px) {
    .services-title h2 {
        font-size: 2.2rem;
        text-align: center;
    }

    .services-content p {
        font-size: 1rem;
        max-width: 100%;
    }

    .question-card {
        position: static;
        margin-top: 20px;
        width: 100%;
    }
}

@media (max-width: 576px) {
    .services-title h2 {
        font-size: 1.8rem;
    }

    .services-content p {
        font-size: 0.95rem;
    }

    .question-card h6 {
        font-size: 1rem;
    }
}

/* ---------------- Services Image & Question Card ---------------- */
.services-image {
    position: relative;
}

.services-image img {
    width: 100%;
    border-radius: 20px;
}

.question-card {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    background: #fff;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    padding: 20px 30px;
    width: 85%;
    max-width: 700px;
    border-radius: 20px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
    z-index: 10;
}

.question-card h6 {
    font-size: 1.1rem;
    font-weight: 600;
}

.question-card p {
    font-size: 0.95rem;
    color: #6c757d;
}

.question-card a {
    background: #212529;
    color: #fff;
    border-radius: 30px;
    text-decoration: none;
    font-weight: 600;
    transition: 0.3s ease;
    text-wrap: nowrap;
}

.question-card a:hover {
    background: #000;
}


/* ---------------- Expertise Section ---------------- */
.expertise-section {
    text-align: center;
}

.expertise-section h3 {
    font-size: 2rem;
    margin-bottom: 15px;
}

.expertise-section p {
    max-width: 800px;
    margin: 0 auto 20px;
    color: #6c757d;
}

.expertise-card {
    background: linear-gradient(35deg, #f3f4f6 10%, #d8d8ff 100%);
    border: 1px solid #eef1f7;
    transition: 0.3s ease;
    min-height: 300px;
    text-align: left;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    justify-content: flex-end;
    animation-delay: 1s;
    animation-duration: 1s;
}

.expertise-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.05);
}

.expertise-card h5 {
    font-size: 1.1rem;
    font-weight: 600;
}

.expertise-card p {
    font-size: 0.95rem;
    color: #555;
}



/* ---------------- HealthTech Section ---------------- */
.healthtech-section h2 {
    font-size: 2.5rem;
    font-weight: 700;
    line-height: 1.2;
}

.healthtech-section p {
    font-size: 1.1rem;
    color: #4a4a4a;
    max-width: 500px;
}

.healthtech-section .healthtech-section img {
    border-radius: 20px;
    max-width: 100%;
}



.active-link {
    font-weight: 700;
    color: #000;
}

/* YORUM*/
.testimonial-card {
    background: linear-gradient(135deg, #fefeff, #eef2ff);
    border: 1px solid #eef1f7;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
    border-radius: 20px;
    display: flex;
    gap: 10px;
    align-items: center;
    padding: 20px 25px;
    min-height: 250px;
}

.testimonial-card img {
    width: 100px;
    height: 100px;
    object-fit: cover;
}

.custom-swiper-btn {
    width: 36px;
    height: 36px;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    border: none;
    display: flex;
    justify-content: center;
    align-items: center;
}

.custom-swiper-btn i {
    color: #3c61ec;
    font-size: 16px;
}


/* Navigation Buttons */
.custom-swiper-btn {
    width: 40px;
    height: 40px;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
    border: none;
}

.custom-swiper-btn i {
    font-size: 16px;
    color: #3c61ec;
}





/*Project Settings */
.projects-section {

    border-radius: 20px;
}

.project-card img {
    width: 80%;
    height: 350px;
    object-fit: cover;
    border-radius: 16px;
}

.swiper-pagination-bullet {
    background-color: #3c61ec;
    opacity: 0.6;
}

.swiper-pagination-bullet-active {
    opacity: 1;
}


/* Features Section */
.features-section h2 {
    font-size: 2rem;
    margin-bottom: 20px;
    color: #222;
}

.feature-card {
    background: #fff;
    border: 1px solid #eef1f7;
    transition: all 0.3s ease;
    text-align: left;
    min-height: 200px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    /* İkon ve metin sola */
    padding: 20px;
}

.feature-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.05);
}

.icon-box {
    width: 60px;
    height: 60px;
    background: #f5f5ff;
    border-radius: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 15px;
    /* İkon ile başlık arasına boşluk */
}

.icon-box img {
    width: 28px;
    height: 28px;
}

.feature-card h5 {
    font-size: 1rem;
    margin-bottom: 8px;
}

.feature-card p {
    font-size: 0.9rem;
    color: #6c757d;
}





/*----------------ABOUT------------------------*/

.about-hero .hero-box {
    border-radius: 20px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

.about-hero h1 {
    font-size: 4rem;
    line-height: 1.2;
    color: #111;
}

.about-hero p {
    font-size: 1.1rem;
    color: #333;
    max-width: 400px;
}

/* Mobil için başlık boyutunu küçült */
@media (max-width: 992px) {
    .about-hero h1 {
        font-size: 2.5rem;
        text-align: center;
    }

    .about-hero p {
        font-size: 1rem;
        max-width: 100%;
        text-align: center;
    }

    .about-hero .btn-more {
        width: 100%;
        justify-content: center;
    }
}

/* Küçük ekran telefonlar (smaller than 576px) */
@media (max-width: 576px) {
    .about-hero h1 {
        font-size: 2rem;
    }

    .about-hero p {
        font-size: 0.95rem;
        padding: 0 10px;
    }

    .about-hero .btn-more {
        font-size: 0.95rem;
        padding: 10px 16px;
    }
}

.team-photo img {
    max-width: 99%;
    height: auto;
}


.features-section h2 {
    font-size: 2.5rem;
    line-height: 1.3;
}

.feature-card {
    border: 1px solid #f0f0f0;
    background: #fff;
    border-radius: 20px;
    transition: 0.3s ease;
}

.feature-card:hover {
    box-shadow: 0 8px 20px rgba(36, 36, 36, 0.2);
    transform: translateY(-4px);
}

.icon-box {
    width: 50px;
    height: 50px;
    border-radius: 12px;
    background: #f6f8fc;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    color: #6a3ce8;
    flex-shrink: 0;
}

/* Sticky Text */
.trust-us-section .trust-text {
    position: sticky;
    top: 120px;
    /* Navbar ve boşluk için */
}

/* Kartlar */
.trust-card {
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
    padding: 20px;
    transition: transform 0.3s ease, opacity 0.6s ease;
    opacity: 0;
    transform: translateY(40px);
    transition: all 0.5s ease;
}

.trust-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
}

.trust-card .big {
    font-size: 5rem;
    font-weight: 700;
    color: #6a3ce8;
}

/* Animasyon gösterildiğinde */
.trust-card.show {
    opacity: 1;
    transform: translateY(0);
}


/* Etiket */
.culture-label {
    background: #fff;
    border-radius: 30px;
    padding: 6px 18px;
    font-size: 0.9rem;
    font-weight: 500;
    color: #333;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

/* Başlık sola yaslı */
.our-culture-section h2 {
    text-align: left;
    font-size: 2.5rem;
    line-height: 1.3;
}

/* Kartlar */
.culture-card {
    border: 1px solid transparent;
    border-radius: 12px;
    transition: all 0.3s ease;
    text-align: left;
    /* Metin sola yaslı */
    transition: all 0.6s ease;
}

.culture-card:hover {
    border-color: #150074;
    background: #fafafa;
}

/* Responsive */
@media (max-width: 768px) {
    .our-culture-section h2 {
        font-size: 1.8rem;
    }

    .culture-card {
        text-align: left;
    }
}


/* Responsive */
@media (max-width: 768px) {
    .trust-us-section .trust-text {
        position: static;
        margin-bottom: 20px;
        text-align: center;
    }
}


.team-section h2 {
    font-size: 2.2rem;
    line-height: 1.3;
}

.team-section p {
    font-size: 1rem;
    color: #666;
}

.team-avatar {
    max-width: 200px;
    height: auto;
    border-radius: 50%;
    transition: transform 0.3s ease;
}

.team-avatar:hover {
    transform: scale(1.05);
}

@media (max-width: 768px) {
    .team-section h2 {
        font-size: 1.6rem;
    }

    .team-avatar {
        max-width: 90px;
    }
}


.careers-section h2 {
    font-size: 2rem;
    margin-bottom: 0.5rem;
}

.careers-section p {
    font-size: 1rem;
    color: #666;
}

/* Job List */
.job-list {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.job-card {
    border: 1px solid rgba(108, 92, 231, 0.2);
    /* Hafif mor çerçeve */
    border-radius: 12px;
    padding: 14px 20px;
    background: #fff;
    font-size: 1rem;
    transition: all 0.3s ease;
}

.job-card:hover {
    background: #fafafa;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
}

/* Job details */
.job-details span {
    margin: 0 12px;
    color: #555;
    font-size: 0.95rem;
}

/* Apply link */
.apply-link {
    color: #6c5ce7;
    /* Kodfu moru */
    font-weight: 500;
    text-decoration: none;
}

.apply-link:hover {
    text-decoration: underline;
}

/* Responsive */
@media (max-width: 768px) {
    .job-details {
        display: none;
    }
}


/*--------------utility--------------------*/

.gradient-background {
    background: linear-gradient(90deg, #E3EAFD 0%, #F3EAFB 50%, #FDE6EB 100%);
}

.rounded-20 {
    border-radius: 20px;
}

.opacity-0-8 {
    opacity: 0.8;
}

.shadow-soft {
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
}

.outline-4 {
    outline: 2px solid rgba(167, 167, 167, 0.6);
}


.btn-more {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 6px 20px;
    background: linear-gradient(90deg, #1F4DF2 0%, #3C61EC 50%, #8B6ADA 100%);
    color: #fff;
    font-size: 1rem;
    font-weight: 500;
    text-decoration: none;
    border-radius: 50px;
    position: relative;
    transition: all 0.3s ease;
    box-shadow: 0px 8px 20px rgba(60, 97, 236, 0.5),
        0px 4px 10px rgba(111, 82, 228, 0.3);
}


.btn-more:hover {
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0px 10px 25px rgba(67, 1, 247, 0.562),
        0px 6px 12px rgba(111, 82, 228, 0.4);
}

.btn-demo .arrow {
    font-size: 1.2rem;
    line-height: 1;
}

.gradient-box {
    padding: 60px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    flex-wrap: nowrap;
    border-radius: 20px;
}

.baslik-box {
    display: inline-block;
    background: #fff;
    border-radius: 30px;
    padding: 6px 18px;
    font-size: 0.9rem;
    font-weight: 500;
    color: #333;
    outline: 2px solid rgba(167, 167, 167, 0.6);
    box-shadow:
        0px 8px 16px rgba(60, 97, 236, 0.15),
        /* Kodfu mavisi blur gölge */
        0px 4px 8px rgba(0, 0, 0, 0.08);
    /* Nötr hafif gölge */
    transition: all 0.5s ease;
}

.badge-blur:hover {
    box-shadow:
        0px 10px 20px rgba(60, 97, 236, 0.25),
        0px 6px 12px rgba(0, 0, 0, 0.1);
}

#preloader {
    position: fixed;
    top: 0;
    left: 0;
    background: #fff;
    z-index: 99999;
    width: 100vw;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity 1s ease;
}

#preloader .preloader-logo {
    width: 120px;
    animation: pulse 2s ease-in-out infinite;
}

@keyframes pulse {
    0% {
        transform: scale(1);
        opacity: 1;
    }

    50% {
        transform: scale(1.1);
        opacity: 0.7;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}

/* ================== CONTACT PAGE ================== */

/* Preloader kapatma */
body.loaded #preloader {
    opacity: 0;
    pointer-events: none;
}

/* Gradient kutu arka plan */
.gradient-box {
    background: linear-gradient(90deg, rgba(232,238,255,1) 0%, rgba(255,235,238,1) 100%);
    padding: 2rem;
    border-radius: 15px;
}

/* Başlık ve paragraf yan yana */
.contact-hero .row {
    display: flex;
    align-items: center;
}
.contact-hero h1 {
    font-size: 2.5rem;
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 0;
}
.highlight-text {
    color: #2563eb;
}
.contact-hero p {
    font-size: 1.05rem;
    color: #6b7280;
    margin-bottom: 0;
}

/* Form alanı */
.contact-wrapper {
    background: #fff;
    border-radius: 15px;
    padding: 30px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.05);
}
.contact-title {
    font-weight: 700;
    font-size: 1.5rem;
}
.contact-title .text-accent {
    color: #2563eb;
}

/* Modern input alanları */
.modern-contact-form input,
.modern-contact-form textarea {
    border: none;
    border-bottom: 2px solid #ddd;
    border-radius: 0;
    padding: 12px 8px;
    font-size: 1rem;
    background: transparent;
    transition: border-color 0.3s ease;
}
.modern-contact-form input:focus,
.modern-contact-form textarea:focus {
    border-bottom-color: #2563eb;
    outline: none;
    box-shadow: none;
}

/* Butonlar */


.btn-cancel {
    background: transparent;
    border: none;
    color: #e91e63;
    font-weight: 600;
    transition: color 0.3s ease;
}
.btn-cancel:hover {
    color: #c2185b;
}

/* Scroll animasyonu */
.animate-on-scroll {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.6s ease;
}
.animate-on-scroll.show {
    opacity: 1;
    transform: translateY(0);
}

/* Harita kartları */
.info-card {
    background: #fff;
    padding: 20px;
    border-radius: 15px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.05);
}

/* ================== RESPONSIVE ================== */

/* Tablet */
@media (max-width: 992px) {
    .contact-hero .row {
        flex-direction: column;
        text-align: center;
    }
    .contact-hero h1 {
        font-size: 2rem;
        margin-bottom: 1rem;
    }
    .contact-hero p {
        font-size: 1rem;
    }
    .gradient-box {
        padding: 1.5rem;
    }
    .contact-wrapper {
        padding: 20px;
    }
}

/* Mobil */
@media (max-width: 576px) {
    .contact-hero h1 {
        font-size: 1.8rem;
    }
    .contact-hero p {
        font-size: 0.95rem;
    }
    .btn-more {
        padding: 10px 20px;
        font-size: 0.9rem;
    }
    .modern-contact-form input,
    .modern-contact-form textarea {
        font-size: 0.9rem;
    }
}



/* Dil Switcher */

.language-switcher {
    margin-left: 2rem;
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.85rem;
    color: #888;
}

.language-switcher a {
    text-decoration: none;
    color: #888;
    transition: color 0.2s ease;
}

.language-switcher a.active {
    font-weight: 600;
    color: #000;
}

.language-switcher a:hover {
    color: #555;
}

.language-switcher span {
    color: #bbb;
}