@import url("../css/fonts.css");



        * {

            box-sizing: border-box;

            margin: 0;

            padding: 0;

        }



        body {

            font-family: "Chakra Petch", sans-serif;

            background: linear-gradient(135deg, #0f0f1a 0%, #1a1a2f 100%);

            color: #ffffff;

            min-width: 320px;

        }



        .header {

            display: flex;

            justify-content: space-between;

            align-items: center;

            position: sticky;

            top: 20px;

            margin: 0 clamp(20px, 5vw, 200px);

            background-color: #101522;

            padding: clamp(15px, 3vw, 30px);

            border-radius: 20px;

            z-index: 999;

            box-shadow: 0px 6px 20px rgba(0, 0, 0, 0.5);

        }



        .logo {

            font-size: clamp(18px, 4vw, 24px);

            font-weight: bold;

            color: #00ff6a;

            text-shadow: 0 0 8px #00ff6a;

            text-decoration: none;

        }



        .menu-toggle {

            display: none;

            cursor: pointer;

            font-size: 24px;

            transition: color 0.3s ease;

        }



        .link-container {

            display: flex;

            gap: clamp(5px, 1.5vw, 20px);

            align-items: center;

        }



        .link-container a {

            text-decoration: none;

            color: #ffffff;

            font-size: clamp(14px, 2vw, 16px);

            font-weight: bold;

            padding: 8px 15px;

            transition: all 0.3s ease;

        }



        .link-container a:hover {

            color: #00ff6a;

            text-shadow: 0 0 50px #00ff6a;

        }



        .discord-btn {

            display: inline-block;

            padding: clamp(8px, 2vw, 10px) clamp(15px, 3vw, 20px);

            background-color: #5865F2;

            color: #ffffff;

            font-size: clamp(12px, 2vw, 14px);

            font-weight: bold;

            border-radius: 10px;

            text-decoration: none;

            transition: all 0.3s ease;

            margin-left: 10px;

        }



        .discord-btn:hover {

            background-color: #4752C4;

            box-shadow: 0 0 20px rgba(88, 101, 242, 0.5);

        }



        /* Hero Section */

        .hero-section {

            margin: 80px clamp(20px, 5vw, 200px) 20px;

            min-height: 400px;

            position: relative;

            display: flex;

            align-items: center;

            background-image: url('../images/Image1.jpg');

            background-size: cover;

            background-position: center;

            border-radius: 20px;

            overflow: hidden;

        }



        .hero-section::before {

            content: '';

            position: absolute;

            top: 0;

            left: 0;

            right: 0;

            bottom: 0;

            background: linear-gradient(to right, rgba(15, 15, 26, 0.9), rgba(15, 15, 26, 0.7));

            z-index: 1;

        }



        .hero-content {

            display: flex;

            flex-direction: column;

            gap: 30px;

            padding-left: 10%;

            position: relative;

            z-index: 2;

        }



        .hero-title {

            font-size: clamp(2.5rem, 5vw, 4rem);

            color: #00ff6a;

            text-shadow: 0 0 20px rgba(0, 255, 106, 0.3);

            font-weight: bold;

            margin: 0;

        }



        .hero-buttons {

            display: flex;

            flex-wrap: wrap;

            gap: 15px;

        }



        .hero-btn {

            padding: 12px 25px;

            border-radius: 10px;

            font-weight: bold;

            text-decoration: none;

            transition: all 0.3s ease;

        }



        .buy-btn {

            background: #00ff6a;

            color: #0f0f1a;

        }



        .buy-btn:hover {

            background: #00cc55;

            transform: scale(1.05);

        }



        .video-btn {

            background: rgba(255, 255, 255, 0.1);

            color: #ffffff;

            border: 2px solid #ffffff;

        }



        .video-btn:hover {

            background: rgba(255, 255, 255, 0.2);

        }



        .trophy-container {

            position: absolute;

            bottom: 30px;

            left: 40px;

        }



        .trophy-container img {

            height: 60px;

            width: auto;

            filter: drop-shadow(0 0 5px rgba(255, 255, 255, 0.3));

        }



        .features-box {

            background: rgba(16, 21, 34, 0.8);

            padding: 20px;

            border-radius: 15px;

            max-height: 400px;

            overflow-y: auto;

            scrollbar-width: thin;

            scrollbar-color: #00ff6a #101522;

        }



        .features-box::-webkit-scrollbar {

            width: 8px;

        }



        .features-box::-webkit-scrollbar-track {

            background: #101522;

            border-radius: 10px;

        }



        .features-box::-webkit-scrollbar-thumb {

            background: #00ff6a;

            border-radius: 10px;

        }



        .features-box ul {

            list-style: none;

            font-size: 0.9em;

        }



        .features-box li {

            margin-bottom: 12px;

            padding-left: 20px;

            position: relative;

        }



        .features-box li:before {

            content: "•";

            color: #00ff6a;

            position: absolute;

            left: 0;

        }



        .action-buttons {

            display: flex;

            gap: 15px;

            margin-top: 20px;

            flex-wrap: wrap;

        }



        .action-button {

            padding: 12px 25px;

            border-radius: 10px;

            text-decoration: none;

            font-weight: bold;

            transition: all 0.3s ease;

            text-align: center;

            min-width: 120px;

        }



        .youtube-btn {

            background: #ff0000;

            color: white;

        }



        .youtube-btn:hover {

            background: #cc0000;

            box-shadow: 0 0 20px rgba(255, 0, 0, 0.4);

        }



        .tutorial-btn {

            background: #4752C4;

            color: white;

        }



        .tutorial-btn:hover {

            background: #3a43a3;

            box-shadow: 0 0 20px rgba(71, 82, 196, 0.4);

        }



        .buy-btn {

            background: #00ff6a;

            color: #101522;

        }



        .buy-btn:hover {

            background: #00cc55;

            box-shadow: 0 0 20px rgba(0, 255, 106, 0.4);

        }



        /* Features Section Styles */

        .features-section {

            margin: 50px clamp(20px, 5vw, 200px);

        }



        .feature-card {

            display: grid;

            grid-template-columns: 1fr 1fr;

            gap: 30px;

            background: rgba(16, 21, 34, 0.9);

            border-radius: 20px;

            padding: 30px;

            margin-bottom: 30px;

            backdrop-filter: blur(10px);

            transition: transform 0.3s ease;

        }



        .feature-card:hover {

            transform: translateY(-5px);

        }



        .feature-content {

            display: flex;

            flex-direction: column;

            justify-content: center;

        }



        .feature-content h3 {

            color: #00ff6a;

            font-size: clamp(1.5em, 3vw, 2em);

            margin-bottom: 15px;

        }



        .feature-content p {

            line-height: 1.6;

            font-size: clamp(0.9em, 2vw, 1em);

        }



        .feature-image {

            width: 100%;

            height: 300px;

            border-radius: 10px;

            object-fit: cover;

            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);

        }



        /* Gallery Section Styles */

        .gallery-section {

            margin: 50px clamp(20px, 5vw, 200px);

            overflow: hidden;

        }



        .gallery-swiper {

            overflow: visible;

            padding: 20px 0;

        }



        .gallery-slide {

            width: 300px;

            height: 200px;

            border-radius: 10px;

            overflow: hidden;

            cursor: pointer;

        }



        .gallery-slide img {

            width: 100%;

            height: 100%;

            object-fit: cover;

            transition: transform 0.3s ease;

        }



        .gallery-slide:hover img {

            transform: scale(1.05);

        }



        .gallery-title {

            text-align: center;

            color: #00ff6a;

            font-size: clamp(2em, 4vw, 2.5em);

            margin-bottom: 30px;

        }



        /* Reviews Section Styles */

        .reviews-title {

            text-align: center;

            color: #00ff6a;

            font-size: clamp(2em, 4vw, 2.5em);

            margin-bottom: 30px;

            text-shadow: 0 0 10px rgba(0, 255, 106, 0.3);

        }



        .reviews-section {

            margin: 50px clamp(20px, 5vw, 200px);

            overflow: hidden;

        }



        .review-card {

            height: 100%;

            background: rgba(16, 21, 34, 0.9);

            border-radius: 15px;

            padding: 25px;

            backdrop-filter: blur(10px);

            transition: transform 0.3s ease;

        }



        .review-card:hover {

            transform: translateY(-5px);

        }



        .review-header {

            display: flex;

            align-items: center;

            margin-bottom: 15px;

        }



        .reviewer-avatar {

            width: 50px;

            height: 50px;

            border-radius: 50%;

            margin-right: 15px;

        }



        .reviewer-info h4 {

            margin: 0;

            color: #00ff6a;

        }



        .reviewer-info p {

            margin: 5px 0 0;

            font-size: 0.9em;

            opacity: 0.7;

        }



        .stars {

            color: #ffd700;

            margin-bottom: 15px;

        }



        .review-text {

            line-height: 1.6;

            font-size: 0.95em;

        }



        /* Footer Styles */

        .footer {

            background-color: #101522;

            margin: 100px clamp(20px, 5vw, 200px) 20px;

            padding: clamp(20px, 4vw, 40px);

            border-radius: 20px;

            box-shadow: 0px -6px 20px rgba(0, 0, 0, 0.5);

        }



        /* Önceki tüm stiller aynen kalacak... */

/* Sadece footer ile ilgili stilleri güncelliyoruz */
.footer-section {
    flex: 1;
    min-width: 250px;
    background: rgba(255, 255, 255, 0.03);
    padding: 20px;
    border-radius: 12px;
    border: 1px solid rgba(0, 255, 106, 0.1);
    backdrop-filter: blur(5px);
}

.footer-section h3 {
    color: #00ff6a;
    margin-bottom: 15px;
    font-size: clamp(16px, 2.5vw, 18px);
    text-shadow: 0 0 8px rgba(0, 255, 106, 0.3);
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(0, 255, 106, 0.1);
}

.footer-section ul {
    list-style: none;
}

.footer-section ul li {
    margin-bottom: 8px;
}

.footer-section a {
    color: rgba(255, 255, 255, 0.8);
    text-decoration: none;
    font-size: clamp(14px, 2vw, 15px);
    transition: all 0.3s ease;
    display: block;
    padding: 5px 10px;
    border-radius: 6px;
}

.footer-section a:hover {
    color: #00ff6a;
    background: rgba(0, 255, 106, 0.05);
    transform: translateX(5px);
}

/* Footer content container için yeni stil */
.footer-content {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
    width: 100%;
}

/* Mobil görünüm için düzenleme */
@media (max-width: 768px) {
    .footer-content {
        grid-template-columns: 1fr;
    }

    .footer-section {
        min-width: 100%;
    }
}

/* Diğer tüm stiller aynen kalacak... */



        .social-icons {

            display: grid;

            grid-template-columns: repeat(5, 1fr);

            gap: 12px;

            max-width: 300px;

        }



        .social-icons a {

            width: clamp(45px, 9vw, 48px);

            height: clamp(45px, 9vw, 48px);

            background: rgba(255, 255, 255, 0.05);

            border: 1px solid rgba(255, 255, 255, 0.1);

            border-radius: 12px;

            display: flex;

            align-items: center;

            justify-content: center;

            transition: all 0.3s ease;

            backdrop-filter: blur(5px);

        }



        .social-icons a i, 
        .social-icons a .bmc-icon {

            font-size: 20px;

            color: rgba(255, 255, 255, 0.8);

            transition: all 0.3s ease;

        }



        .social-icons a:hover {

            background: rgba(0, 255, 106, 0.1);

            border-color: #00ff6a;

            transform: translateY(-3px);

            box-shadow: 0 5px 15px rgba(0, 255, 106, 0.2);

        }



        .social-icons a:hover i,

        .social-icons a:hover .bmc-icon {

            color: #00ff6a;

        }



        /* Mobil için düzenleme */

        @media (max-width: 768px) {

            .social-icons {

                grid-template-columns: repeat(4, 1fr);

                gap: 10px;

            }

            
            
            .social-icons a {

                width: clamp(40px, 8vw, 45px);

                height: clamp(40px, 8vw, 45px);

            }

        }



        .copyright {

            text-align: center;

            margin-top: clamp(20px, 4vw, 40px);

            padding-top: clamp(15px, 3vw, 20px);

            border-top: 1px solid rgba(255, 255, 255, 0.1);

            color: rgba(255, 255, 255, 0.6);

            font-size: clamp(12px, 2vw, 14px);

        }



        /* Lightbox Styles */

        .lightbox {

            display: none;

            position: fixed;

            top: 0;

            left: 0;

            width: 100%;

            height: 100%;

            background: rgba(0, 0, 0, 0.9);

            z-index: 9999;

            justify-content: center;

            align-items: center;

        }



        .lightbox img {

            max-width: 90%;

            max-height: 90vh;

            object-fit: contain;

            border-radius: 10px;

            border: 3px solid #00ff6a;

        }



        .close-lightbox {

            position: absolute;

            top: 20px;

            right: 20px;

            color: white;

            font-size: 30px;

            cursor: pointer;

            z-index: 10000;

            width: 40px;

            height: 40px;

            display: flex;

            align-items: center;

            justify-content: center;

            background: rgba(0, 0, 0, 0.5);

            border-radius: 50%;

        }



        /* Sticky Buy Button */

        .sticky-buy {

            display: none;

            position: fixed;

            bottom: 30px;

            right: 30px;

            background: #00ff6a;

            color: #0f0f1a;

            padding: 15px 30px;

            border-radius: 10px;

            font-weight: bold;

            text-decoration: none;

            box-shadow: 0 5px 20px rgba(0, 255, 106, 0.3);

            z-index: 999;

            opacity: 0;

            transform: translateY(20px);

            transition: all 0.3s ease;

        }



        .sticky-buy.show {

            display: block;

            opacity: 1;

            transform: translateY(0);

        }



        .sticky-buy:hover {

            background: #00cc55;

            transform: translateY(-5px);

            box-shadow: 0 8px 25px rgba(0, 255, 106, 0.5);

        }



        /* Galeri pagination için yeni stil */

        .swiper-pagination {

            background: rgba(0, 255, 106, 0.4);

            width: fit-content !important;

            padding: 0.8px 20px;

            border-radius: 20px;

            left: 50% !important;

            transform: translateX(-50%);

        }



        .boxes-container {

            display: flex;

            justify-content: center;

            gap: clamp(10px, 2vw, 20px);

            margin: 30px auto;

            padding: 0 clamp(20px, 5vw, 200px);

            flex-wrap: wrap;

        }



        .content {

            padding: clamp(20px, 4vw, 50px);

            margin-top: 50px;

        }



        .box {

            width: clamp(280px, 80vw, 400px);

            height: clamp(400px, 70vw, 600px);

            position: relative;

            overflow: hidden;

            transition: background 0.4s ease;

            text-decoration: none;

            background-size: cover;

            background-position: center;

            display: flex;

            flex-direction: column;

            align-items: center;

            justify-content: center;

            gap: 20px;

        }



        .box img {

            width: 200px;

            height: auto;

            transition: transform 0.3s ease;

        }



        .box:hover img {

            transform: scale(1.1);

        }



        .box-left {

            border-radius: clamp(15px, 3vw, 30px) 0 0 clamp(15px, 3vw, 30px);

            background: linear-gradient(135deg, #1a1a4f, #3498db);

        }



        .box-middle {

            border-radius: 0;

            background: linear-gradient(135deg, #1a4f1a, #2ecc71);

        }



        .box-right {

            border-radius: 0 clamp(15px, 3vw, 30px) clamp(15px, 3vw, 30px) 0;

            background: linear-gradient(135deg, #4f1a4f, #9b59b6);

        }



        .box-left:hover {

            box-shadow: -5px 0 20px rgba(52, 152, 219, 0.4);

            background: linear-gradient(135deg, #2980b9, #3498db);

        }



        .box-middle:hover {

            box-shadow: 0 0 20px rgba(46, 204, 113, 0.4);

            background: linear-gradient(135deg, #27ae60, #2ecc71);

        }



        .box-right:hover {

            box-shadow: 5px 0 20px rgba(155, 89, 182, 0.4);

            background: linear-gradient(135deg, #8e44ad, #9b59b6);

        }



        .about-section {

            background: rgba(255, 255, 255, 0.1);

            border-radius: 20px;

            padding: 40px;

            margin: 20px;

            backdrop-filter: blur(10px);

        }



        .about-title {

            color: #00ff6a;

            font-size: 2.5em;

            margin-bottom: 30px;

            text-align: center;

            text-shadow: 0 0 10px rgba(0, 255, 106, 0.5);

        }



        .about-text {

            max-width: 800px;

            margin: 0 auto;

        }



        .about-text p {

            margin-bottom: 20px;

            line-height: 1.8;

            font-size: 1.1em;

            color: #ffffff;

            text-align: justify;

        }



        .stats-container {

            display: flex;

            justify-content: space-around;

            flex-wrap: wrap;

            gap: 20px;

            margin-top: 40px;

        }



        .stat-item {

            text-align: center;

            padding: 20px;

            background: rgba(0, 255, 106, 0.1);

            border-radius: 15px;

            min-width: 200px;

        }



        .stat-number {

            font-size: 2.5em;

            color: #00ff6a;

            margin-bottom: 10px;

        }



        .stat-label {

            color: #ffffff;

            font-size: 1.1em;

        }



        .about_content {

            padding: clamp(20px, 4vw, 50px);

            margin-top: 50px;

            max-width: 1200px;

            margin: 50px auto;

        }



        .privacy_content {

            max-width: 1200px;

            margin: 50px auto;

            padding: 0 20px;

        }



        .privacy-section {

            background: rgba(255, 255, 255, 0.1);

            border-radius: 20px;

            padding: 40px;

            margin-bottom: 30px;

        }



        .privacy-section h1 {

            color: #00ff6a;

            font-size: 2.5em;

            margin-bottom: 30px;

            text-align: center;

        }



        .privacy-section h2 {

            color: #00ff6a;

            font-size: 1.8em;

            margin: 25px 0 15px;

        }



        .privacy-section p {

            line-height: 1.8;

            margin-bottom: 15px;

            text-align: justify;

        }



        .privacy-section ul {

            margin: 15px 0;

            padding-left: 20px;

        }



        .privacy-section li {

            margin-bottom: 10px;

            line-height: 1.6;

        }



        .product_content {

            padding: clamp(20px, 4vw, 50px);

            margin-top: 50px;

        }



        .product-container {

            max-width: 1200px;

            margin: 0 auto;

            padding: 20px;

            transition: transform 0.3s ease;

        }



        .product-card {

            background: rgba(255, 255, 255, 0.1);

            border-radius: 20px;

            padding: 30px;

            margin-bottom: 40px;

            backdrop-filter: blur(10px);

            display: flex;

            gap: 30px;

            align-items: center;

            transition: transform 0.3s ease, box-shadow 0.3s ease;

        }



        .product-card:hover {

            transform: translateY(-5px);

            box-shadow: 0 10px 20px rgba(0, 255, 106, 0.1);

        }



        .product-image {

            width: 400px;

            height: 250px;

            object-fit: cover;

            border-radius: 15px;

            border: 3px solid #00ff6a;

        }



        .product-info {

            flex: 1;

        }



        .product-title {

            font-size: 24px;

            color: #00ff6a;

            margin-bottom: 15px;

        }



        .product-description {

            color: #ffffff;

            margin-bottom: 25px;

            line-height: 1.6;

        }



        .product-buttons {

            display: flex;

            gap: 15px;

            flex-wrap: wrap;

        }



        .product-button {

            padding: 12px 25px;

            border-radius: 10px;

            text-decoration: none;

            font-weight: bold;

            transition: all 0.3s ease;

        }



        .product_download-btn {

            background: #00ff6a;

            color: #101522;

        }



        .product_download-btn:hover {

            background: #00cc54;

            box-shadow: 0 0 20px rgba(0, 255, 106, 0.5);

        }



        .product_video-btn {

            background: #ff3366;

            color: #ffffff;

        }



        .product_video-btn:hover {

            background: #cc2952;

            box-shadow: 0 0 20px rgba(255, 51, 102, 0.5);

        }



        .product_setup-btn {

            background: #3366ff;

            color: #ffffff;

        }



        .product_setup-btn:hover {

            background: #2952cc;

            box-shadow: 0 0 20px rgba(51, 102, 255, 0.5);

        }



        .supporter_content {

            padding: clamp(20px, 4vw, 50px);

            margin-top: 50px;

        }



        /* Ekip kartları container */

        .supporter-container {

            display: flex;

            justify-content: center;

            gap: 20px;

            flex-wrap: wrap;

            padding: 0 clamp(20px, 5vw, 200px);

            margin-top: 30px;

        }



        /* Ekip kartı stilleri */

        .supporter-card {

            background: rgba(255, 255, 255, 0.1);

            border-radius: 15px;

            padding: 20px;

            width: 280px;

            text-align: center;

            backdrop-filter: blur(10px);

            transition: transform 0.3s ease;

        }



        .supporter-card:hover {

            transform: translateY(-10px);

        }



        /* Profil resmi stilleri */

        .support-profile-img {

            width: 150px;

            height: 150px;

            border-radius: 50%;

            margin-bottom: 15px;

            border: 3px solid #00ff6a;

        }



        /* İsim stilleri */

        .supporter-name {

            color: #ffffff;

            font-size: 1.2em;

            margin-bottom: 10px;

            font-weight: bold;

        }



        /* Sosyal medya ikonları */

        .card-social-icons {

            display: flex;

            justify-content: center;

            gap: 15px;

            margin-top: 15px;

        }



        .card-social-icons a {

            color: #ffffff;

            font-size: 20px;

            transition: color 0.3s ease;

        }



        .card-social-icons a:hover {

            color: #00ff6a;

        }



        .team_content {

            padding: clamp(20px, 4vw, 50px);

            margin-top: 50px;

        }



        /* Ekip kartları container */

        .team-container {

            display: flex;

            justify-content: center;

            gap: 20px;

            flex-wrap: wrap;

            padding: 0 clamp(20px, 5vw, 200px);

            margin-top: 30px;

        }



        /* Ekip kartı stilleri */

        .team-card {

            background: rgba(255, 255, 255, 0.1);

            border-radius: 15px;

            padding: 20px;

            width: 280px;

            text-align: center;

            backdrop-filter: blur(10px);

            transition: transform 0.3s ease;

        }



        .team-card:hover {

            transform: translateY(-10px);

        }



        /* Profil resmi stilleri */

        .team-profile-img {

            width: 150px;

            height: 150px;

            border-radius: 50%;

            margin-bottom: 15px;

            border: 3px solid #00ff6a;

        }



        /* İsim stilleri */

        .team-name {

            color: #ffffff;

            font-size: 1.2em;

            margin-bottom: 10px;

            font-weight: bold;

        }



        #selected {

            color: #00ff6a;

            text-shadow: 0 0 50px #00ff6a;

        }



        /* Duyuru sayfası için ek stiller */

        .news_content {

            padding: clamp(20px, 4vw, 50px);

            margin-top: 50px;

            max-width: 1200px;

            margin: 50px auto;

        }



        .news-section {

            background: rgba(255, 255, 255, 0.1);

            border-radius: 20px;

            padding: 40px;

            backdrop-filter: blur(10px);

        }



        .news-title {

            color: #00ff6a;

            font-size: 2.5em;

            margin-bottom: 30px;

            text-align: center;

            text-shadow: 0 0 10px rgba(0, 255, 106, 0.5);

        }



        .announcements-container {

            display: flex;

            flex-direction: column;

            gap: 20px;

        }



        .announcement-card {

            background: rgba(16, 21, 34, 0.9);

            border-radius: 15px;

            padding: 25px;

            transition: transform 0.3s ease;

            margin-bottom: 20px;

        }



        .announcement-card:hover {

            transform: translateY(-5px);

        }



        .announcement-header {

            display: flex;

            justify-content: space-between;

            align-items: center;

            margin-bottom: 15px;

            border-bottom: 1px solid rgba(0, 255, 106, 0.3);

            padding-bottom: 10px;

        }



        .announcement-header h2 {

            color: #00ff6a;

            font-size: 1.5em;

            margin: 0;

        }



        .announcement-date {

            color: #ffffff;

            font-size: 0.9em;

        }



        .announcement-content {

            line-height: 1.6;

            color: #ffffff;

            margin-bottom: 15px;

        }



        .announcement-image {

            width: 100%;

            max-height: 400px;

            overflow: hidden;

            border-radius: 10px;

            cursor: pointer;

        }



        .announcement-img {

            width: 100%;

            height: 100%;

            object-fit: cover;

            border-radius: 10px;

        }



        /* Duyuru Lightbox stilleri */

        .announcement-lightbox {

            display: none;

            position: fixed;

            top: 0;

            left: 0;

            width: 100%;

            height: 100%;

            background: rgba(0, 0, 0, 0.9);

            z-index: 1000;

            justify-content: center;

            align-items: center;

        }



        .announcement-lightbox.active {

            display: flex;

        }



        .announcement-lightbox img {

            max-width: 90%;

            max-height: 90vh;

            border-radius: 10px;

        }



        /* Responsive Design */

        @media (max-width: 768px) {

            .header {

                justify-content: space-between;

            }

            
            
            .menu-toggle {

                display: block;

                order: 3;

            }



            .link-container {

                display: none;

                position: absolute;

                top: 100%;

                left: 0;

                right: 0;

                background-color: #101522;

                flex-direction: column;

                padding: 20px;

                border-radius: 20px;

                margin-top: 10px;

                text-align: center;

            }



            .link-container.active {

                display: flex;

            }



            .feature-card {

                grid-template-columns: 1fr;

            }



            .action-buttons {

                justify-content: center;

            }

            .box-left, .box-middle, .box-right {

                border-radius: 20px;

                width: 100%;

            }

            .product-card {

                flex-direction: column;

                text-align: center;

            }



            .product-image {

                width: 100%;

                max-width: 400px;

                margin: 0 auto;

            }



            .product-buttons {

                justify-content: center;

            }

            .supporter-card {

                width: 100%;

                max-width: 280px;

            }

            .team-card {

                width: 100%;

                max-width: 280px;

            }




            
        }



        /* Ürün galerisi için güncellenmiş stiller */

        .product-gallery {

            width: 450px;

            display: flex;

            flex-direction: column;

            gap: 10px;

            transition: transform 0.3s ease;

        }



        .product-gallery:hover {

            transform: translateY(-3px);

        }



        .main-image {

            width: 100%;

            height: 250px;

            object-fit: cover;

            border-radius: 15px;

            border: 3px solid #00ff6a;

            transition: all 0.3s ease;

        }



        .main-image:hover {

            transform: scale(1.02);

            box-shadow: 0 5px 15px rgba(0, 255, 106, 0.2);

            border-color: #fff;

        }



        .small-images {

            display: flex;

            gap: 10px;

        }



        .small-image {

            flex: 1;

            height: 65px;

            object-fit: cover;

            border-radius: 10px;

            border: 2px solid #00ff6a;

            cursor: pointer;

            transition: all 0.3s ease;

        }



        .small-image:hover {

            transform: scale(1.05);

            box-shadow: 0 3px 10px rgba(0, 255, 106, 0.2);

            border-color: #fff;

        }



        /* Responsive düzenlemeler için hover efektlerini devre dışı bırak */

        @media (max-width: 768px) {

            .product-card:hover {

                transform: none;

                box-shadow: none;

            }



            .product-gallery:hover {

                transform: none;

            }



            .main-image:hover {

                transform: none;

                box-shadow: none;

                border-color: #00ff6a;

            }



            .small-image:hover {

                transform: none;

                box-shadow: none;

                border-color: #00ff6a;

            }

        }



        /* Lightbox stilleri */

        .gallery-lightbox,

        .product-lightbox {

            display: none;

            position: fixed;

            top: 0;

            left: 0;

            width: 100%;

            height: 100%;

            background: rgba(0, 0, 0, 0.95);

            z-index: 9999;

            justify-content: center;

            align-items: center;

        }



        .gallery-lightbox.active,

        .product-lightbox.active {

            display: flex;

        }



        .gallery-lightbox img,

        .product-lightbox img {

            max-width: 90%;

            max-height: 90vh;

            object-fit: contain;

            border-radius: 10px;

            border: 3px solid #00ff6a;

        }



        .close-lightbox {

            position: absolute;

            top: 20px;

            right: 20px;

            color: white;

            font-size: 30px;

            cursor: pointer;

            width: 40px;

            height: 40px;

            display: flex;

            align-items: center;

            justify-content: center;

            background: rgba(0, 0, 0, 0.5);

            border-radius: 50%;

            transition: all 0.3s ease;

        }



        .close-lightbox:hover {

            background: rgba(255, 255, 255, 0.2);

        }



        /* Ürün resimleri için cursor pointer ekleyelim */

        .product-image {

            cursor: pointer;

        }



        /* Hero Section responsive stilleri */

        .hero-section {

            margin: 80px clamp(20px, 5vw, 200px) 20px;

            min-height: 400px;

            position: relative;

            display: flex;

            align-items: center;

        }



        .hero-content {

            display: flex;

            flex-direction: column;

            gap: 30px;

            padding-left: 10%;

        }



        .hero-title {

            font-size: clamp(2.5rem, 5vw, 4rem);

            color: #00ff6a;

            text-shadow: 0 0 20px rgba(0, 255, 106, 0.3);

            font-weight: bold;

            margin: 0;

        }



        .hero-buttons {

            display: flex;

            flex-wrap: wrap;

            gap: 15px;

        }



        /* Mobil için hero düzenlemeleri */

        @media (max-width: 768px) {

            .hero-section {

                margin: 40px 20px;

                min-height: 300px;

                text-align: center;

                background-position: center center;

            }



            .hero-section::before {

                background: linear-gradient(to bottom, rgba(15, 15, 26, 0.9), rgba(15, 15, 26, 0.7));

            }



            .hero-content {

                padding-left: 0;

                align-items: center;

            }



            .hero-buttons {

                width: 100%;

            }



            .hero-btn {

                width: 100%;

                text-align: center;

            }

        }



        /* Coming Soon sayfası stilleri */

        .coming-soon-content {

            min-height: calc(100vh - 200px);

            display: flex;

            align-items: center;

            justify-content: center;

            padding: 50px 20px;

        }



        .coming-soon-container {

            max-width: 800px;

            width: 100%;

            text-align: center;

            background: rgba(255, 255, 255, 0.1);

            padding: 40px;

            border-radius: 20px;

            backdrop-filter: blur(10px);

        }



        .coming-soon-title {

            font-size: clamp(2rem, 5vw, 3rem);

            color: #00ff6a;

            margin-bottom: 20px;

            text-shadow: 0 0 20px rgba(0, 255, 106, 0.3);

        }



        .coming-soon-description {

            font-size: clamp(1rem, 2vw, 1.2rem);

            color: #ffffff;

            margin-bottom: 40px;

            opacity: 0.9;

            line-height: 1.6;

        }



        .return-home-btn {

            display: inline-block;

            padding: clamp(8px, 2vw, 10px) clamp(15px, 3vw, 20px);

            background-color: #00ff6a;

            color: #101522;

            font-size: clamp(12px, 2vw, 14px);

            font-weight: bold;

            border-radius: 10px;

            text-decoration: none;

            transition: all 0.3s ease;

        }



        .return-home-btn:hover {

            background-color: #00cc55;

            box-shadow: 0 0 20px rgba(0, 255, 106, 0.5);

        }



        @media (max-width: 768px) {

            .coming-soon-container {

                padding: 30px 20px;

                margin: 20px;

            }

        }



        /* 404 Error sayfası stilleri */

        .error-container {

            position: relative;

            overflow: hidden;

        }



        .error-title {

            font-size: clamp(4rem, 15vw, 8rem);

            color: #00ff6a;

            margin-bottom: 0;

            text-shadow: 0 0 30px rgba(0, 255, 106, 0.3);

            animation: pulse 2s infinite;

        }



        .error-subtitle {

            font-size: clamp(1.5rem, 4vw, 2.5rem);

            color: #ffffff;

            margin-bottom: 20px;

        }



        .error-description {

            font-size: clamp(1rem, 2vw, 1.2rem);

            color: #ffffff;

            margin-bottom: 40px;

            opacity: 0.9;

            line-height: 1.6;

            max-width: 600px;

            margin-left: auto;

            margin-right: auto;

        }



        .error-buttons {

            display: flex;

            gap: 20px;

            justify-content: center;

            flex-wrap: wrap;

        }



        .error-discord {

            display: inline-block;

            padding: clamp(8px, 2vw, 10px) clamp(15px, 3vw, 20px);

            background-color: #5865F2;

            color: #ffffff;

            font-size: clamp(12px, 2vw, 14px);

            font-weight: bold;

            border-radius: 10px;

            text-decoration: none;

            transition: all 0.3s ease;

        }



        .error-discord:hover {

            background-color: #4752C4;

            box-shadow: 0 0 20px rgba(88, 101, 242, 0.5);

        }



        @keyframes pulse {

            0% {

                text-shadow: 0 0 30px rgba(0, 255, 106, 0.3);

            }

            50% {

                text-shadow: 0 0 50px rgba(0, 255, 106, 0.5);

            }

            100% {

                text-shadow: 0 0 30px rgba(0, 255, 106, 0.3);

            }

        }



        @media (max-width: 768px) {

            .error-discord {

                width: 100%;

                text-align: center;

                margin: 10px 0;

            }

        }



        /* Galeri Lightbox Stilleri */

        .gallery-lightbox {

            display: none;

            position: fixed;

            top: 0;

            left: 0;

            width: 100%;

            height: 100%;

            background: rgba(0, 0, 0, 0.95);

            z-index: 9999;

        }



        .gallery-lightbox.active {

            display: flex;

            justify-content: center;

            align-items: center;

        }



        .gallery-lightbox img {

            max-width: 90%;

            max-height: 90vh;

            object-fit: contain;

            border-radius: 10px;

            border: 3px solid #00ff6a;

        }



        .gallery-lightbox .close-lightbox {

            position: absolute;

            top: 20px;

            right: 20px;

            color: white;

            font-size: 30px;

            cursor: pointer;

            width: 40px;

            height: 40px;

            display: flex;

            align-items: center;

            justify-content: center;

            background: rgba(0, 0, 0, 0.5);

            border-radius: 50%;

            transition: all 0.3s ease;

        }



        .gallery-lightbox .close-lightbox:hover {

            background: rgba(255, 255, 255, 0.2);

        }



        /* Gallery Slide Styles */

        .gallery-slide img {

            cursor: pointer;

            transition: transform 0.3s ease;

        }



        .gallery-slide img:hover {

            transform: scale(1.05);

        }



        /* Sticky Buy Button */

        .sticky-buy {

            display: none;

            position: fixed;

            bottom: 30px;

            right: 30px;

            background: #00ff6a;

            color: #0f0f1a;

            padding: 15px 30px;

            border-radius: 10px;

            font-weight: bold;

            text-decoration: none;

            box-shadow: 0 5px 20px rgba(0, 255, 106, 0.3);

            z-index: 999;

            opacity: 0;

            transform: translateY(20px);

            transition: all 0.3s ease;

        }



        .sticky-buy.show {

            display: block;

            opacity: 1;

            transform: translateY(0);

        }



        .sticky-buy:hover {

            background: #00cc55;

            transform: translateY(-5px);

            box-shadow: 0 8px 25px rgba(0, 255, 106, 0.5);

        }



        /* Buymeacoffee özel stil */

        .bmc-icon {

            width: 20px;

            height: 20px;

            fill: currentColor;

            transition: all 0.3s ease;

        }



        /* Lightbox için yeni stiller */

        .gallery-lightbox,

        .product-lightbox {

            display: none;

            position: fixed;

            top: 0;

            left: 0;

            width: 100%;

            height: 100%;

            background: rgba(0, 0, 0, 0.95);

            z-index: 9999;

            justify-content: center;

            align-items: center;

        }



        .gallery-lightbox.active,

        .product-lightbox.active {

            display: flex;

        }



        .gallery-lightbox img,

        .product-lightbox img {

            max-width: 90%;

            max-height: 90vh;

            object-fit: contain;

            border-radius: 10px;

        }



        .nav-buttons {

            position: absolute;

            width: 100%;

            display: flex;

            justify-content: space-between;

            padding: 0 20px;

            pointer-events: none;

        }



        .prev-btn,

        .next-btn {

            background: rgba(0, 255, 106, 0.3);

            border: none;

            color: white;

            padding: 15px 25px;

            cursor: pointer;

            border-radius: 5px;

            font-size: 20px;

            transition: all 0.3s ease;

            pointer-events: auto;

        }



        .prev-btn:hover,

        .next-btn:hover {

            background: rgba(0, 255, 106, 0.5);

        }



        /* Mobil için düzenlemeler */

        @media (max-width: 768px) {

            .prev-btn,

            .next-btn {

                padding: 10px 15px;

                font-size: 16px;

            }

        }



        /* Product Lightbox Styles */

        .product-lightbox {

            display: none;

            position: fixed;

            top: 0;

            left: 0;

            width: 100%;

            height: 100%;

            background: rgba(0, 0, 0, 0.95);

            z-index: 9999;

            justify-content: center;

            align-items: center;

        }



        .product-lightbox.active {

            display: flex !important;

        }



        .product-lightbox img {

            max-width: 90%;

            max-height: 90vh;

            object-fit: contain;

            border-radius: 10px;

            border: 3px solid #00ff6a;

        }



        .product-lightbox .nav-buttons {

            position: absolute;

            width: 100%;

            display: flex;

            justify-content: space-between;

            padding: 0 30px;

            pointer-events: none;

        }



        .product-lightbox .prev-btn,

        .product-lightbox .next-btn {

            background: rgba(0, 255, 106, 0.15);

            border: 1px solid rgba(0, 255, 106, 0.3);

            width: 70px;

            height: 50px;

            cursor: pointer;

            border-radius: 6px;

            transition: all 0.3s ease;

            pointer-events: auto;

            display: flex;

            align-items: center;

            justify-content: center;

            backdrop-filter: blur(5px);

            box-shadow: 0 0 15px rgba(0, 255, 106, 0.2);

        }



        .product-lightbox .prev-btn svg,

        .product-lightbox .next-btn svg {

            width: 32px;

            height: 32px;

            fill: none;

            stroke: #00ff6a;

            stroke-width: 1.5;

            stroke-linecap: round;

            stroke-linejoin: round;

        }



        /* Mobil için düzenlemeler */

        @media (max-width: 768px) {

            .product-lightbox .prev-btn,

            .product-lightbox .next-btn {

                width: 55px;

                height: 40px;

            }

            
            
            .product-lightbox .prev-btn svg,

            .product-lightbox .next-btn svg {

                width: 24px;

                height: 24px;

            }

            
            
            .product-lightbox .nav-buttons {

                padding: 0 15px;

            }

        }



        /* Support Box Styles */

        .support-box {

            position: fixed;

            bottom: 30px;

            right: 30px;

            width: 60px;

            height: 60px;

            background: #00ff6a;

            border-radius: 50%;

            cursor: pointer;

            box-shadow: 0 5px 20px rgba(0, 255, 106, 0.3);

            z-index: 999;

            transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);

        }



        .support-box.expanded {

            width: 350px;

            height: 500px;

            border-radius: 15px;

            background: #101522;

            border: 2px solid #00ff6a;

        }



        .support-icon {

            position: absolute;

            top: 50%;

            left: 50%;

            transform: translate(-50%, -50%);

            color: #101522;

            font-size: 24px;

            transition: all 0.3s ease;

        }



        .support-box.expanded .support-icon {

            opacity: 0;

        }



        .support-content {

            position: absolute;

            top: 0;

            left: 0;

            width: 100%;

            height: 100%;

            display: flex;

            flex-direction: column;

            opacity: 0;

            visibility: hidden;

            transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);

        }



        .support-box.expanded .support-content {

            opacity: 1;

            visibility: visible;

        }



        .support-header {

            display: flex;

            justify-content: space-between;

            align-items: center;

            padding: 15px 20px;

            border-bottom: 1px solid rgba(0, 255, 106, 0.2);

        }



        .support-title {

            color: #00ff6a;

            font-size: 18px;

            font-weight: bold;

        }



        .close-support {

            color: #ffffff;

            cursor: pointer;

            font-size: 20px;

            transition: color 0.3s ease;

        }



        .close-support:hover {

            color: #00ff6a;

        }



        .chat-container {

            flex: 1;

            overflow-y: auto;

            padding: 20px;

            display: flex;

            flex-direction: column;

            gap: 15px;

            background: #0a0d14;

        }



        .chat-message {

            max-width: 80%;

            padding: 12px 15px;

            border-radius: 15px;

            font-size: 14px;

            line-height: 1.4;

            opacity: 0;

            transform: translateY(20px);

            animation: messageAppear 0.5s cubic-bezier(0.4, 0, 0.2, 1) forwards;

        }



        .message-incoming {

            background: rgba(255, 255, 255, 0.1);

            color: #ffffff;

            align-self: flex-start;

            border-bottom-left-radius: 5px;

        }



        .message-outgoing {

            background: #00ff6a;

            color: #101522;

            align-self: flex-end;

            border-bottom-right-radius: 5px;

        }



        .message-time {

            font-size: 11px;

            opacity: 0.7;

            margin-top: 5px;

            text-align: right;

        }



        /* Input container stilleri */

        .chat-input-container {

            padding: 15px;

            background: #0a0d14;

            border-top: 2px solid #00ff6a;

            border-radius: 0 0 15px 15px;

        }



        /* Combobox stilleri */

        .question-select {

            width: 100%;

            padding: 12px 15px;

            background: #101522;

            border: 2px solid #00ff6a;

            border-radius: 10px;

            color: #ffffff;

            font-family: "Chakra Petch", sans-serif;

            font-size: 14px;

            outline: none;

            cursor: pointer;

            transition: all 0.3s ease;

            -webkit-appearance: none;

            -moz-appearance: none;

            appearance: none;

            background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2300ff6a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");

            background-repeat: no-repeat;

            background-position: right 15px center;

            background-size: 15px;

            padding-right: 40px;

            transition: all 0.3s ease;

        }



        .question-select:hover {

            background-position: right 12px center;

        }



        .question-select:focus {

            background-position: right 15px center;


        }



        .question-select.active {

            background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2300ff6a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='18 15 12 9 6 15'%3e%3c/polyline%3e%3c/svg%3e");

        }



        .question-select option {

            background: #101522;

            color: #ffffff;

            padding: 15px;

        }



        .question-select option[value=""] {

            color: rgba(255, 255, 255, 0.5);

        }



        @keyframes messageAppear {

            0% {

                opacity: 0;

                transform: translateY(20px);

            }

            100% {

                opacity: 1;

                transform: translateY(0);

            }

        }



        /* Mobile styles */

        @media (max-width: 768px) {

            .support-box.expanded {

                width: calc(100% - 40px);

                height: 80vh;

                bottom: 20px;

                right: 20px;

            }



            .chat-input-container {

                padding: 10px 15px;

            }

        }



        /* Yeni FAQ stilleri */

        .faq_content {

            padding: clamp(20px, 4vw, 50px);

            margin: 50px auto;

            max-width: 1200px;

        }



        .faq-section {

            background: rgba(16, 21, 34, 0.9);

            border-radius: 25px;

            padding: 40px;

            backdrop-filter: blur(10px);

            border: 1px solid rgba(0, 255, 106, 0.1);

            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);

        }



        .faq-main-title {

            color: #00ff6a;

            font-size: 2.5em;

            margin-bottom: 40px;

            text-align: center;

            text-shadow: 0 0 15px rgba(0, 255, 106, 0.3);

            position: relative;

        }



        .faq-main-title:after {

            display: none;

        }



        .faq-accordion {

            display: flex;

            flex-direction: column;

            gap: 15px;

        }



        .faq-item {

            background: rgba(255, 255, 255, 0.03);

            border-radius: 15px;

            overflow: hidden;

            border: 1px solid rgba(0, 255, 106, 0.1);

            transition: all 0.3s ease;

        }



        .faq-item:hover {

            border-color: rgba(0, 255, 106, 0.3);

        }



        .faq-question {

            padding: 20px 25px;

            display: flex;

            justify-content: space-between;

            align-items: center;

            cursor: pointer;

            transition: all 0.3s ease;

            color: #ffffff;

        }



        .faq-question span {

            font-size: 1.1em;

            font-weight: 500;

            flex: 1;

            margin-right: 20px;

            word-wrap: break-word;

            line-height: 1.4;

        }



        .faq-question i {

            color: #00ff6a;

            font-size: 1.1em;

            transition: all 0.3s ease;

            opacity: 0.7;

        }



        .faq-item.active {

            background: rgba(0, 255, 106, 0.05);

            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);

        }



        .faq-item.active .faq-question {

            color: #00ff6a;

        }



        .faq-item.active .faq-question i {

            transform: rotate(180deg);

            opacity: 1;

        }



        .faq-answer {

            max-height: 0;

            overflow: hidden;

            transition: max-height 0.3s ease-out;

            background-color: rgba(255, 255, 255, 0.05);

            border-radius: 0 0 10px 10px;

            padding: 0 20px;

        }



        .faq-item.active .faq-answer {

            max-height: 500px;

            padding: 20px;

        }



        .faq-answer p {

            color: #ffffff;

            font-size: 16px;

            line-height: 1.6;

            margin: 0;

            padding: 0;

        }



        /* Mobil görünüm için düzenlemeyi kaldırıyoruz çünkü artık fit-content kullanıyoruz */

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

            .faq-item.active .faq-answer {

                max-height: fit-content;

            }

        }



        /* Oyunlayici Banner Styles */

        .banner-container {
            display: flex;
            gap: 20px;
            margin-top: 40px;
            padding-top: 30px;
            border-top: 1px solid rgba(255, 255, 255, 0.1);
        }

        .oyunlayici-banner {
            flex: 1;
            text-align: center;
            padding: 15px 20px;
            background: rgba(0, 0, 0, 0.1);
            border-radius: 8px;
            border: 1px solid rgba(0, 255, 106, 0.1);
            backdrop-filter: blur(5px);
            display: flex;
            align-items: center;
            justify-content: center;
            min-height: 80px;
            text-decoration: none;
            color: #ffffff;
            transition: all 0.3s ease;
        }

        .oyunlayici-banner:hover {
            background: rgba(0, 255, 106, 0.1);
            border-color: #00ff6a;
            transform: translateY(-3px);
            box-shadow: 0 5px 15px rgba(0, 255, 106, 0.2);
        }

        .oyunlayici-logo {
            height: 40px;
            vertical-align: middle;
            margin-right: 10px;
        }

        .banner-text {
            display: inline-block;
            vertical-align: middle;
            font-size: 1.1em;
        }

        .neron-text {
            color: #2ecc71;
            font-weight: bold;
            animation: glow-green 2s ease-in-out infinite;
        }

        .oyunlayici-text {
            color: #3498db;
            font-weight: bold;
            text-decoration: none;
            animation: glow-blue 2s ease-in-out infinite;
            transition: color 0.3s ease;
        }

        .oyunlayici-text:hover {
            color: #2980b9;
        }

        @keyframes glow-green {
            0%, 100% { text-shadow: 0 0 5px rgba(46, 204, 113, 0.5); }
            50% { text-shadow: 0 0 20px rgba(46, 204, 113, 0.8); }
        }

        @keyframes glow-blue {
            0%, 100% { text-shadow: 0 0 5px rgba(52, 152, 219, 0.5); }
            50% { text-shadow: 0 0 20px rgba(52, 152, 219, 0.8); }
        }

        /* Mobil için düzenlemeler */
        @media (max-width: 768px) {
            .banner-container {
                flex-direction: column;
                gap: 15px;
            }

            .oyunlayici-banner {
                padding: 10px;
            }

            .oyunlayici-logo {
                height: 30px;
                margin-right: 5px;
            }

            .banner-text {
                font-size: 0.9em;
            }
        }

        /* Dropdown Menu Styles */
        .dropdown {
            position: relative;
            display: inline-block;
        }

        .dropdown-toggle {
            text-decoration: none;
            color: #ffffff;
            font-size: clamp(14px, 2vw, 16px);
            font-weight: bold;
            padding: 8px 15px;
            transition: all 0.3s ease;
            cursor: pointer;
            display: flex;
            align-items: center;
            gap: 5px;
        }

        .dropdown-toggle:hover {
            color: #00ff6a;
        }

        .dropdown-menu {
            position: absolute;
            top: calc(100% + 10px);
            left: 50%;
            transform: translateX(-50%) translateY(10px);
            background: rgba(16, 21, 34, 0.95);
            backdrop-filter: blur(10px);
            border: 1px solid rgba(0, 255, 106, 0.1);
            border-radius: 10px;
            padding: 15px;
            min-width: 250px;
            opacity: 0;
            visibility: hidden;
            transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
            box-shadow: 0 5px 25px rgba(0, 0, 0, 0.2);
            z-index: 1000;
        }

        .dropdown.active .dropdown-menu {
            opacity: 1;
            visibility: visible;
            transform: translateX(-50%) translateY(0);
        }

        .dropdown-item {
            display: block;
            padding: 12px 20px;
            color: #ffffff;
            text-decoration: none;
            font-size: 14px;
            transition: all 0.3s ease;
            border-radius: 10px;
            margin-bottom: 5px;
        }

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

        .dropdown-item:hover {
            background: rgba(0, 255, 106, 0.1);
            color: #00ff6a;
            transform: translateX(5px);
        }

        @media (max-width: 768px) {
            .header {
                margin: 10px;
                padding: 15px;
                flex-wrap: wrap;
            }

            .menu-toggle {
                display: block;
                order: 3;
            }

            .link-container {
                display: none;
                width: 100%;
                flex-direction: column;
                align-items: stretch;
                padding: 15px;
                gap: 8px;
                margin-top: 15px;
                background: rgba(16, 21, 34, 0.95);
                backdrop-filter: blur(10px);
                border-radius: 15px;
                border: 1px solid rgba(0, 255, 106, 0.1);
            }

            .link-container.active {
                display: flex;
            }

            .link-container a {
                width: 100%;
                padding: 12px 20px;
                text-align: left;
                border-radius: 8px;
                transition: all 0.3s ease;
                font-size: 15px;
            }

            .link-container a:hover {
                color: #00ff6a;
                background: rgba(0, 255, 106, 0.05);
                transform: translateX(5px);
            }

            .dropdown {
                width: 100%;
            }

            .dropdown-toggle {
                width: 100%;
                padding: 12px 20px;
                display: flex;
                justify-content: space-between;
                align-items: center;
                border-radius: 8px;
                font-size: 15px;
            }

            .dropdown-menu {
                position: static;
                width: 100%;
                transform: none;
                opacity: 0;
                visibility: hidden;
                max-height: 0;
                padding: 0;
                margin: 0;
                border: none;
                background: rgba(0, 255, 106, 0.03);
                border-radius: 8px;
                box-shadow: none;
                overflow: hidden;
            }

            .dropdown.active .dropdown-menu {
                opacity: 1;
                visibility: visible;
                max-height: 300px;
                padding: 8px;
                margin-top: 8px;
                transform: none;
            }

            .dropdown-item {
                padding: 12px 20px;
                margin-bottom: 4px;
                background: rgba(16, 21, 34, 0.5);
                border-radius: 6px;
                font-size: 14px;
                border: 1px solid rgba(0, 255, 106, 0.05);
            }

            .dropdown-item:hover {
                background: rgba(0, 255, 106, 0.1);
                color: #00ff6a;
                transform: translateX(5px);
            }

            .header > .discord-btn {
                display: none;
            }

            .link-container .discord-btn {
                display: inline-block;
                width: 100%;
                text-align: center;
                padding: 12px 20px;
                margin-top: 8px;
                background: rgba(88, 101, 242, 0.15);
                border: 1px solid rgba(88, 101, 242, 0.3);
                border-radius: 8px;
                font-size: 15px;
            }

            .link-container .discord-btn:hover {
                background: rgba(88, 101, 242, 0.25);
                transform: translateX(0);
            }
        }

/*
     FILE ARCHIVED ON 14:12:03 Mar 19, 2025 AND RETRIEVED FROM THE
     INTERNET ARCHIVE ON 06:22:46 May 12, 2025.
     JAVASCRIPT APPENDED BY WAYBACK MACHINE, COPYRIGHT INTERNET ARCHIVE.

     ALL OTHER CONTENT MAY ALSO BE PROTECTED BY COPYRIGHT (17 U.S.C.
     SECTION 108(a)(3)).
*/
/*
playback timings (ms):
  captures_list: 0.454
  exclusion.robots: 0.018
  exclusion.robots.policy: 0.008
  esindex: 0.009
  cdx.remote: 29.555
  LoadShardBlock: 158.019 (3)
  PetaboxLoader3.datanode: 99.628 (4)
  PetaboxLoader3.resolve: 175.881 (2)
  load_resource: 138.824
*/