/*Header*/
.header {position: fixed;width: 100%;color: #fff;z-index: 1000;transition: background-color 0.3s ease;}
.header.scrolled {background-color: rgba(255, 255, 255, 0.95); box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);}
.header-inner {width: min(100%, 1600px);margin: 0 auto;display: flex;justify-content: space-between;align-items: center;padding: 1rem 2rem;}
.header-logo img {height: 70px;}
.header-menu {display: flex;gap: 2rem;list-style: none;padding: 0;margin: 0;}
.header-menu-item a {color: var(--text-color);text-decoration: none;font-weight: 500;}
.hamburger-btn {display: none;background: none;border: none;font-size: 2rem;color: var(--text-color);cursor: pointer;}
.menu-close-btn{display:none;}

/* Responsive */
@media (max-width: 768px) {
    .hamburger-btn {display: block;}
    .menu-close-btn{display:block;}
    .header-menu {position: fixed;top: 0;right: -100%;height: 100vh;width: 250px;background-color: #fff;flex-direction: column;gap: 2rem; padding: 5rem 2rem;transition: right 0.3s ease-in-out;box-shadow: -2px 0 10px rgba(0, 0, 0, 0.2);z-index: 999;}
    .header-menu.show {right: 0;}
    .header-menu-item a {color: #333;font-size: 1.2rem;}
    .menu-close-btn {align-self: flex-end;margin-bottom: 1rem;}
    .menu-close-btn button {background: none;border: none;font-size: 1.8rem;color: #333;cursor: pointer;}
    .header-logo img {height: 50px;}
    .header-menu-item a {font-size: 1rem;font-weight: 500;}
}

/*Hero Section*/
.home-stage{width:100%; aspect-ratio:16 / 9;}
.hero-container {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%); text-align:center;}
.hero-title{font-size:4.5rem; line-height:5rem; font-weight:400; color:var(--text-color);}
.hero-content{padding:50px 0 70px 0; font-weight:400; color:var(--text-color); font-size:1.5rem; line-height:1.5rem; }
.hero-qr-container{ align-items:center; background-color:#FFFFFF; border-radius:16px; display:grid; width:275px; grid-template-columns:57px 1fr; gap:25px; margin:0px auto; padding:10px 16px;}
.hero-download-container{align-items:center; background-color:#FFFFFF; border-radius:16px; display:grid; width:275px; grid-template-columns:57px 1fr; gap:25px; margin:0px auto; padding:10px 16px; display:none;}
.mobile-video{display:none; width:100%; height:100%; object-fit:cover;}
.desktop-video {display: block;width: 100%;height: 100%;object-fit: cover;}

/*Responsive*/
@media (max-width: 768px) {
    .hero-download-container{display:block;}
    .mobile-video{display:block; width:100%; height:100%;}
    .hero-title{font-size:2rem; line-height:2.4rem;}
    .hero-qr-container{display:none;}
    .desktop-video{display:none;}
}

/*Discovered Section*/
.home-discovered{width:100%; padding:0 0 60px 0;}
.discovered-wrapper{width:100%; display:grid; grid-template-columns:repeat(2, 1fr); align-items:center; align-content:center; gap:10px;}
.discovered-image-container{border-radius:30px; padding:16px; display:grid; align-items:flex-end; background-color:#8E8DC5; position:relative;}
.discovered-title{font-size:3rem; line-height:3.5rem; padding-bottom:2rem; margin:0px;}
.discovered-content{font-size:1.5rem; line-height:1.7rem; padding-top:2rem; padding-bottom:2rem; margin:0px; opacity:.7;}
.discovered-button{background-color:#8E8DC5; width:180px; display:flex; align-items:center; justify-content:center; padding:16px; border-radius:40px; text-decoration:none; color:#FFFFFF; font-size:1.2rem}
.discovered-button:hover{color:#FFFFFF; outline:none; text-decoration:none;}

/*Includes Section*/
.home-includes{padding:50px 0 70px 0;}
.include-card-container{border-radius:30px; display:grid; align-self:flex-end;}
.include-card-container.card-1{background-color:#BBE2CC;}
.include-card-container.card-2{background-color:#F9B5A8;}
.include-card-container.card-3{background-color:#fef4c3;}
.include-card-container{padding:50px 50px 0 50px;}
.include-title{padding-bottom:2rem; margin:0px;}
.include-text{font-size:1.2rem; opacity:0.7;}
.image-wrapper {position: relative;display: inline-block;}
.main-image {display: block;max-width: 100%;height: auto;}
.map-icon {position: absolute;width: 18px;height: 18px;opacity: 0;transform: scale(0);transition: transform 0.3s ease;}
.map-1 {top: 20%;left: 40%;}
.map-2 {top: 28%;left: 42%;}
.map-3 {bottom: 40%;left: 32%;}

/*SSS Section*/
.home-sss{padding:74px 0px; background-color:#F0E8F2}
.sss-title{text-align:center; padding-bottom:2.5rem;}
.faq-container {margin: 0 auto;padding: 40px 20px;}
.all-seen-button{background-color:#8E8DC5; width:200px; display:flex; align-items:center; justify-content:center; padding:16px; border-radius:40px; text-decoration:none; color:#FFFFFF; font-size:1.2rem }
.all-seen-button:hover{color:#FFFFFF; outline:none; text-decoration:none;}
.nav-tabs {justify-content: center;border-bottom: none;}
.nav-tabs .nav-link {font-size: 1.2rem;border: none;color: #555;background-color: transparent;transition: all 0.2s ease;padding: 0.5rem 1rem;margin: 0 8px;border-radius: 40px;display: flex; align-items: center;justify-content: center;height: 60px;line-height: 1;min-width:120px;}
.nav-tabs .nav-link:hover {color: #000;background-color: #f0f0f0;}
.nav-tabs .nav-link.active {background-color: #8E8DC5;display: flex;align-items: center;justify-content: center;padding: 16px;border-radius: 40px;text-decoration: none;color: #FFFFFF; font-size: 1.2rem;min-width:120px;}
.accordion{border-radius:20px; border:none;}
.accordion-button{border-radius:20px !important; border:none; box-shadow:none;}
.accordion-button:focus{box-shadow:none;}
.accordion-button:not(.collapsed){box-shadow:none;}
.accordion-item{border:none; border-radius:20px !important;}

/*Banner Section*/
.home-banner{padding:74px 0px;}
.banner-image-container{border-radius:50%; display:grid; align-items:flex-end; background-color:#ffebcd; position:relative;}
.banner-title{font-size:3rem; line-height:3.5rem; padding-bottom:2rem; margin:0px;}
.banner-content{font-size:1.5rem; line-height:1.7rem; padding-top:2rem; padding-bottom:2rem; margin:0px; opacity:.7;}

/*Footer Section*/
.kampy-footer {
    background: linear-gradient(91deg, var(--primary-color) -1.3%, var(--secondary-color) 104.18%);
    color: var(--text-color-light);
    padding: 60px 0;
    font-family: 'Arial', sans-serif;
}

.kampy-footer__wrapper {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 25px;
}

/* --- Footer Top Section --- */
.kampy-footer__top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 30px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    flex-wrap: wrap;
    gap: 20px;
}

.kampy-footer__brand-logo img {
    height: 60px; /* Logo boyutu */
    max-width: 100%;
}

.kampy-footer__slogan {
    font-size: 1.1rem;
    font-weight: 400;
    flex-grow: 1;
    text-align: center;
    margin: 0;
    padding: 0 20px;
}

.kampy-footer__social {
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0;
    gap: 15px;
}

.kampy-footer__social-link i {
    font-size: 28px; /* İkon boyutu */
    color: var(--text-color-light);
    transition: color 0.2s ease-in-out, transform 0.2s ease-in-out;
}

.kampy-footer__social-link:hover i {
    color: var(--accent-color);
    transform: translateY(-3px);
}

/* --- Footer Middle Section --- */
.kampy-footer__middle {
    display: grid;
    grid-template-columns: repeat(4, 1fr); /* 4 sütunlu düzen */
    gap: 40px;
    padding: 40px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.kampy-footer__column-title {
    font-size: 1.2rem;
    font-weight: 600;
    margin-bottom: 20px;
    color: var(--text-color-light);
}

.kampy-footer__menu {
    list-style: none;
    padding: 0;
    margin: 0;
}

.kampy-footer__menu-item {
    margin-bottom: 10px;
}

.kampy-footer__menu-link {
    color: var(--text-color-dark);
    text-decoration: none;
    font-size: 0.95rem;
    transition: color 0.2s ease-in-out;
}

    .kampy-footer__menu-link:hover {
        color: var(--accent-color);
        text-decoration: underline;
    }

.kampy-footer__contact-info p {
    font-size: 0.95rem;
    margin-bottom: 8px;
    color: var(--text-color-dark);
    display: flex; /* İkon ve metni hizalamak için */
    align-items: center;
}

    .kampy-footer__contact-info p i {
        font-size: 1.1rem; /* İletişim ikonlarının boyutu */
        margin-right: 8px;
        color: var(--text-color-light); /* İkon rengi */
    }


/* --- Footer Bottom Section --- */
.kampy-footer__bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 30px;
    flex-wrap: wrap;
    gap: 20px;
}

.kampy-footer__copyright {
    font-size: 0.85rem;
    color: var(--text-color-dark);
    margin: 0;
}

/* Eğer yasal linkler alt kısımda kalacaksa bu kısmı kullanabilirsin */
/* .kampy-footer__legal {
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0;
    gap: 20px;
}

.kampy-footer__legal-link {
    color: var(--text-color-dark);
    text-decoration: none;
    font-size: 0.85rem;
    transition: color 0.2s ease-in-out;
}

.kampy-footer__legal-link:hover {
    color: var(--accent-color);
    text-decoration: underline;
} */


/* --- Responsive Ayarlamalar --- */

/* Tablet ve küçük masaüstü ekranlar (max-width: 1024px) */
@media (max-width: 1024px) {
    .kampy-footer__middle {
        grid-template-columns: repeat(2, 1fr); /* 2 sütunlu düzen */
        gap: 30px;
    }

    .kampy-footer__top {
        flex-direction: column;
        text-align: center;
    }

    .kampy-footer__slogan {
        padding: 15px 0;
    }

    .kampy-footer__brand-logo {
        margin-bottom: 15px;
    }

    .kampy-footer__social {
        justify-content: center;
        width: 100%;
    }

    .kampy-footer__social-link i {
        font-size: 26px; /* Tablet ikon boyutu */
    }

    .kampy-footer__bottom {
        flex-direction: column;
        text-align: center;
    }

    /* Eğer yasal linkler orta kısma taşınmışsa, bu alanı boş bırakabilirsin */
    /* .kampy-footer__legal {
        margin-top: 15px;
        justify-content: center;
        flex-wrap: wrap;
    }

    .kampy-footer__legal-item {
        margin: 5px 10px;
    } */
}

/* Büyük mobil ekranlar (max-width: 768px) */
@media (max-width: 768px) {
    .kampy-footer {
        padding: 40px 0;
    }

    .kampy-footer__top,
    .kampy-footer__middle,
    .kampy-footer__bottom {
        padding-bottom: 20px;
        padding-top: 20px;
        gap: 20px;
    }

    .kampy-footer__middle {
        grid-template-columns: 1fr; /* Tek sütunlu düzen */
        gap: 25px;
    }

    .kampy-footer__column-title {
        font-size: 1.1rem;
        margin-bottom: 15px;
    }

    .kampy-footer__menu-link,
    .kampy-footer__contact-info p,
    .kampy-footer__copyright {
        font-size: 0.9rem;
    }

        .kampy-footer__contact-info p i {
            font-size: 1rem;
        }


    .kampy-footer__brand-logo img {
        height: 50px;
    }

    .kampy-footer__slogan {
        font-size: 1rem;
        padding: 10px 0;
    }

    .kampy-footer__social-link i {
        font-size: 22px; /* Mobil ikon boyutu */
    }
}

/* Küçük mobil ekranlar (max-width: 480px) */
@media (max-width: 480px) {
    .kampy-footer__wrapper {
        padding: 0 15px;
    }

    .kampy-footer__top {
        gap: 15px;
    }

    .kampy-footer__slogan {
        font-size: 0.9rem;
    }

    .kampy-footer__middle {
        gap: 20px;
    }

    .kampy-footer__column-title {
        font-size: 1rem;
    }

    .kampy-footer__menu-link,
    .kampy-footer__contact-info p,
    .kampy-footer__copyright {
        font-size: 0.8rem;
    }

        .kampy-footer__contact-info p i {
            font-size: 0.9rem;
        }

    /* .kampy-footer__legal {
        gap: 10px;
    } */
}

body {
    overflow-x: hidden; /* Yatay kaydırmayı engelle */
}

.container {
    padding-left: 15px;
    padding-right: 15px;
}

/* --- Header Responsive Ayarlamaları --- */
@media (max-width: 768px) {
    .header-inner {
        padding: 0.8rem 1rem;
    }

    .header-logo img {
        height: 45px;
    }

    .header-menu {
        width: 200px;
    }

    .header-menu-item a {
        font-size: 1.1rem;
    }
}

@media (max-width: 480px) {
    .header-inner {
        padding: 0.6rem 0.8rem;
    }

    .header-logo img {
        height: 40px;
    }
}

/* --- Hero Section Responsive Ayarlamaları --- */
@media (max-width: 1200px) {
    .hero-title {
        font-size: 3.5rem;
        line-height: 4rem;
    }

    .hero-content {
        font-size: 1.3rem;
        line-height: 1.4rem;
        padding: 30px 0 50px 0;
    }
}

@media (max-width: 992px) {
    .hero-title {
        font-size: 3rem;
        line-height: 3.5rem;
    }

    .hero-content {
        font-size: 1.2rem;
        line-height: 1.3rem;
        padding: 25px 0 40px 0;
    }
}

@media (max-width: 768px) {
    .home-stage {
        aspect-ratio: auto;
        height: auto; /* Otomatik yüksekliğe geri döndürüldü */
        min-height: 100vh; /* Minimum ekran yüksekliğini doldur */
        position: relative; /* Hero container'ı konumlandırmak için */
    }

    .video-wrapper {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        overflow: hidden; /* Video taşmasını engelle */
    }

    .mobile-video {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover; /* Videonun kapsayıcıyı doldurmasını sağlar */
    }

    .desktop-video {
        display: none;
    }

    .hero-container {
        position: absolute; /* Tekrar absolute yapıldı */
        top: 15%; /* Kampy yazısını yukarı taşı */
        left: 50%;
        transform: translateX(-50%); /* Sadece yatayda ortala */
        width: 100%; /* Kapsayıcı genişliği */
        max-width: 500px; /* Okunurluk için max genişlik */
        padding: 0 20px;
        text-align: center;
        z-index: 2; /* Video üzerinde görünmesi için */
    }

    .hero-title {
        font-size: 2.5rem; /* Başlığı daha büyük yap */
        line-height: 2.8rem;
        margin-bottom: 15px; /* Başlık ile altındaki içerik arasına boşluk */
    }

        .hero-title .line {
            display: block;
        }

    .hero-content {
        font-size: 1.1rem;
        line-height: 1.6;
        padding: 0;
        margin-bottom: 25px; /* İçerik ile buton arasına boşluk */
    }

    .hero-download-container {
        display: block;
        width: 100%;
        max-width: 280px;
        margin: 0 auto; /* Ortalamak için */
    }

    .hero-qr-container {
        display: none;
    }

    .download-btn {
        background-color: #8E8DC5;
        color: #fff;
        text-decoration: none;
        padding: 15px 25px;
        border-radius: 40px;
        font-size: 1.1rem;
        display: block;
        text-align: center;
    }
}

@media (max-width: 480px) {
    .hero-container {
        top: 10%; /* Daha küçük ekranlarda biraz daha yukarı */
    }

    .hero-title {
        font-size: 2rem;
        line-height: 2.4rem;
    }

    .hero-content {
        font-size: 1rem;
        line-height: 1.5;
    }

    .download-btn {
        font-size: 1rem;
        padding: 12px 20px;
    }
}

/* --- Discovered Section Responsive Ayarlamaları --- */
@media (max-width: 992px) {
    .discovered-wrapper {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .discovered-image-container {
        padding: 10px;
    }

        .discovered-image-container img {
            width: 100%;
            height: auto;
        }

    .discovered-title {
        font-size: 2.5rem;
        line-height: 3rem;
        padding-bottom: 1.5rem;
    }

    .discovered-content {
        font-size: 1.2rem;
        line-height: 1.5rem;
        padding-top: 1.5rem;
        padding-bottom: 1.5rem;
    }

    .discovered-button {
        width: 160px;
        font-size: 1.1rem;
        padding: 14px;
        margin: 0 auto;
    }

    /* Görselin metnin üzerinde olmasını sağlar */
    .home-discovered .col-md-6:first-child {
        order: 2;
    }

    .home-discovered .col-md-6:last-child {
        order: 1;
    }
}

@media (max-width: 768px) {
    .home-discovered {
        padding: 40px 0;
    }

    .discovered-title {
        font-size: 2rem;
        line-height: 2.4rem;
    }

    .discovered-content {
        font-size: 1rem;
        line-height: 1.4rem;
    }

    .discovered-button {
        width: 100%;
        max-width: 200px;
        margin-left: auto;
        margin-right: auto;
    }
}

@media (max-width: 480px) {
    .discovered-title {
        font-size: 1.8rem;
        line-height: 2.2rem;
    }

    .discovered-content {
        font-size: 0.9rem;
        line-height: 1.3rem;
    }
}

/* --- Includes Section Responsive Ayarlamaları --- */
@media (max-width: 992px) {
    .home-includes {
        padding: 40px 0;
    }

    .include-card-container {
        padding: 30px 30px 0 30px;
    }

    .include-title {
        font-size: 1.8rem;
        padding-bottom: 1.5rem;
    }

    .include-text {
        font-size: 1rem;
    }

    .main-image {
        width: 100%;
        height: auto;
    }
}

@media (max-width: 768px) {
    .include-card-container {
        padding: 25px 25px 0 25px;
    }

    .include-title {
        font-size: 1.5rem;
        line-height: 1.8rem;
    }

    .include-text {
        font-size: 0.9rem;
    }
}

@media (max-width: 576px) {
    .include-card-container {
        padding: 20px 20px 0 20px;
    }

    .include-title {
        font-size: 1.3rem;
        line-height: 1.6rem;
    }

    .include-text {
        font-size: 0.85rem;
    }

    .image-wrapper {
        margin-top: 15px;
    }

    .map-icon {
        width: 10px;
        height: 10px;
    }

    .map-1 {
        top: 15%;
        left: 35%;
    }

    .map-2 {
        top: 23%;
        left: 38%;
    }

    .map-3 {
        bottom: 35%;
        left: 28%;
    }
}


/* --- SSS Section Responsive Ayarlamaları --- */
@media (max-width: 992px) {
    .home-sss {
        padding: 50px 0;
    }

    .sss-title {
        font-size: 2.5rem;
        padding-bottom: 2rem;
    }

    .nav-tabs {
        flex-wrap: wrap;
        margin-bottom: 20px !important;
    }

        .nav-tabs .nav-item {
            flex-grow: 1;
            margin-bottom: 10px;
        }

        .nav-tabs .nav-link {
            font-size: 1rem;
            height: 50px;
            min-width: unset;
            padding: 0.5rem 0.8rem;
        }

    .all-seen-button {
        width: 180px;
        font-size: 1.1rem;
        padding: 14px;
        margin: 20px auto 0 auto;
    }
}

@media (max-width: 768px) {
    .sss-title {
        font-size: 2rem;
        padding-bottom: 1.5rem;
    }

    .faq-container {
        padding: 20px 0;
    }

    .nav-tabs .nav-link {
        font-size: 0.9rem;
        height: 45px;
        margin: 0 4px;
    }

    .accordion-button {
        font-size: 1rem;
    }
}

@media (max-width: 576px) {
    .nav-tabs .nav-link {
        font-size: 0.85rem;
        padding: 0.5rem 0.5rem;
    }

    .nav-tabs .nav-item {
        width: 48%;
        margin: 1%;
    }
}

/* --- Banner Section Responsive Ayarlamaları --- */
@media (max-width: 992px) {
    .home-banner {
        padding: 50px 0;
    }

    .banner-image-container {
        border-radius: 20px;
        padding: 10px;
    }

        .banner-image-container img {
            width: 100%;
            height: auto;
        }

    .banner-title {
        font-size: 2.5rem;
        line-height: 3rem;
        padding-bottom: 1.5rem;
        text-align: center;
    }

    .banner-content {
        font-size: 1.2rem;
        line-height: 1.5rem;
        padding-top: 1.5rem;
        padding-bottom: 1.5rem;
        text-align: center;
    }

    .home-banner .col-md-6 {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }
}

@media (max-width: 768px) {
    .banner-title {
        font-size: 2rem;
        line-height: 2.4rem;
    }

    .banner-content {
        font-size: 1rem;
        line-height: 1.4rem;
    }

    /* Mobil görünümde görseli üstte, metni altta göstermek için */
    .home-banner .row {
        flex-direction: column-reverse;
    }
}

@media (max-width: 480px) {
    .banner-title {
        font-size: 1.8rem;
        line-height: 2.2rem;
    }

    .banner-content {
        font-size: 0.9rem;
        line-height: 1.3rem;
    }
}