/*body{margin:0;font-family:"Arial",sans-serif}.hero-header{color:#fff;padding:20px 0}.hero-header .container{width:90%;max-width:1200px;margin:auto}.hero-header .hero-top{display:flex;justify-content:space-between;align-items:center}.hero-header .hero-top .logo{height:70px;align-items:center}.hero-header .hero-top .lang-dropdown{position:relative}.hero-header .hero-top .lang-dropdown .lang-btn{background:linear-gradient(45deg, #f73c00, #f96000);border:none;border-radius:20px;color:#fff;padding:8px 16px;cursor:pointer;font-weight:bold}.hero-header .hero-top .lang-dropdown .lang-menu{display:none;list-style:none;position:absolute;top:100%;right:0;background:#fff;color:#1a1a1a;border-radius:5px;box-shadow:0 4px 10px rgba(0,0,0,.1)}.hero-header .hero-top .lang-dropdown .lang-menu li{padding:8px 16px;cursor:pointer}.hero-header .hero-top .lang-dropdown .lang-menu li:hover{background:#f9f9f9}.hero-header .hero-top .lang-dropdown.active .lang-menu{display:block}.hero-header .hero-content{display:flex;justify-content:space-between;align-items:center;margin-top:10px 10px 10px;flex-wrap:wrap;background:linear-gradient(90deg, #e30613, #b1050f);padding:0 20px;border-radius:35px;margin-top:15px}.hero-header .hero-content .hero-text{flex:1 1 50%;padding-right:40px;padding-left:40px}.hero-header .hero-content .hero-text .tagline{text-transform:uppercase;font-weight:600;margin-bottom:10px;font-size:clamp(.9rem,2vw,2.2rem)}.hero-header .hero-content .hero-text h1{text-transform:uppercase;font-size:clamp(.9rem,7vw,3.2rem);margin-bottom:20px}.hero-header .hero-content .hero-text .btn{background:#fff;color:#e30613;padding:10px 20px;text-decoration:none;border-radius:20px;font-weight:bold;transition:all .3s}.hero-header .hero-content .hero-text .btn:hover{background:#e6e6e6}.hero-header .hero-content .hero-image{flex:1 1 40%;text-align:center}.hero-header .hero-content .hero-image img{max-width:80%;border-radius:20px;margin-left:15px}@media(max-width: 768px){.hero-header .hero-content{flex-direction:column;text-align:center}.hero-header .hero-content .hero-text,.hero-header .hero-content .hero-image{flex:1 1 100%}.hero-header .hero-content .hero-text{margin-bottom:20px}}.steps-section{text-align:center;padding:10px 20px;max-width:1200px;margin:0 auto}.steps-section h2{font-size:1.8rem;margin-bottom:40px;font-weight:700}.steps-section .steps-container{display:grid;grid-template-columns:repeat(auto-fit, minmax(200px, 1fr));gap:20px}.steps-section .steps-container .step-card{background:#fff;border:2px solid #ff003c;border-radius:15px;padding:20px;transition:transform .3s ease,box-shadow .3s ease}.steps-section .steps-container .step-card:hover{transform:translateY(-8px);box-shadow:0 8px 20px rgba(0,0,0,.15)}.steps-section .steps-container .step-card .step-icon{width:70px;height:70px;border-radius:50%;margin:-40px auto 15px;display:flex;align-items:center;justify-content:center}.steps-section .steps-container .step-card .step-icon img{width:72px;height:72px}.steps-section .steps-container .step-card h3{color:#ff003c;margin-bottom:10px;font-size:1.2rem}.steps-section .steps-container .step-card p{margin:0;font-size:.95rem}@media(max-width: 600px){.steps-section h2{font-size:1.4rem}}.promotions{max-width:1200px;margin:0 auto;padding:20px 20px;text-align:center}.promotions h2{font-size:2rem;margin-bottom:40px}.promotions .promotion-card{display:flex;flex-wrap:wrap;border:2px solid #ff003c;border-radius:15px;margin-bottom:30px;overflow:hidden}.promotions .promotion-card .promo-img{flex:1 1 222px;display:center}.promotions .promotion-card .promo-img img{width:88%;height:auto;border-radius:15px 15px;margin:12px}.promotions .promotion-card .promo-content{flex:1 1 150px;padding:20px;text-align:left;margin-top:-48px}.promotions .promotion-card .promo-content h3{color:#ff003c;margin-bottom:15px;font-size:clamp(2.2rem,3.5vw,3rem)}.promotions .promotion-card .promo-content p,.promotions .promotion-card .promo-content ul{margin:10px 0}.promotions .promotion-card .promo-content .btn{display:inline-block;background:#ff003c;color:#fff;padding:10px 20px;text-decoration:none;border-radius:20px;margin-top:10px;font-weight:bold;transition:background .3s}.promotions .promotion-card .promo-content .btn:hover{background:#cc0030}@media(max-width: 768px){.promotion-card{flex-direction:column;display:flow}.promotion-card .promo-img{border-radius:15px 15px 0 0}.promotion-card .promo-content{text-align:center}}.feedback-section{max-width:1200px;margin:0 auto;padding:40px 20px;text-align:center}.feedback-section h2{font-size:clamp(1.5rem,3vw,2rem);margin-bottom:20px}.feedback-section .slider-container{overflow:hidden;position:relative}.feedback-section .slider{display:flex;transition:transform .5s ease;width:1200%}.feedback-section .slide{flex:0 0 33.333%;padding:10px;width:33.3333333333%}.feedback-section .slide img{width:50%;border-radius:10px}@media(max-width: 768px){.slide{flex:0 0 100%}}.promo-banner{background:linear-gradient(90deg, #d4a657, #f9f9f9);border-radius:20px;flex-wrap:wrap;max-width:1200px;margin:0;display:flex;align-items:center;justify-content:center;gap:40px}.promo-banner .promo-text{flex:1 1 40%;color:#fff}.promo-banner .promo-text h2{font-size:2.5rem;margin:0}.promo-banner .promo-text h1{font-size:2rem;font-weight:800;margin:10px 0;text-transform:uppercase}.promo-banner .promo-text .btn{display:inline-block;margin-top:20px;padding:10px 20px;background:#fff;color:#ff003c;font-weight:bold;border-radius:20px;text-decoration:none;transition:background .3s}.promo-banner .promo-text .btn:hover{background:#eee}.promo-banner .promo-images{display:flex;justify-content:center;align-items:center;flex-wrap:wrap}.promo-banner .promo-images .product{max-width:300px;width:100%;margin:10px}.footer-note{text-align:center;margin-top:20px;font-size:.8rem;color:#888}@media(max-width: 768px){.promo-banner{flex-direction:column;text-align:center}.promo-banner .promo-text{flex:1 1 100%;margin-bottom:20px}.promo-banner .promo-images{flex:1 1 70%}}.promo-banner{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;background:linear-gradient(135deg, #fbe18d, #d5a838);padding:2rem;border-radius:2rem;margin:2rem;box-shadow:0 8px 24px rgba(0,0,0,.1);max-width:1200px;width:100%}.promo-banner .promo-content{flex:1;min-width:300px;padding-right:2rem}.promo-banner .promo-content h1{font-size:3rem;margin-bottom:1rem;color:#000}.promo-banner .promo-content p{font-size:1.2rem;color:#000;margin-bottom:.5rem}.promo-banner .promo-content p strong{color:#000;font-size:clamp(1.2rem,3.5vw,3rem)}.promo-banner .promo-content .terms{font-size:.9rem;margin-top:1rem;color:#000}.promo-banner .promo-content button{margin-top:1rem;padding:.75rem 2rem;font-size:1.2rem;border:none;background-color:#ff0050;color:#fff;border-radius:999px;cursor:pointer;transition:background-color .3s ease}.promo-banner .promo-content button:hover{background-color:#d40044}.promo-banner .promo-image{flex:1;text-align:center;margin-left:-35px}.promo-banner .promo-image img{max-width:100%;height:auto}.footer{text-align:center;padding:1rem;background:#d7dde5;font-size:.9rem;color:#333}@media(max-width: 768px){.promo-banner{flex-direction:column;text-align:center;max-width:89%}.promo-content,.promo-image{max-width:100%}.promo-content{padding:1rem 0}}.center-container{display:flex;justify-content:center;padding:2px}.vip-banner{width:100%;max-width:1200px;padding:2rem;box-sizing:border-box}.vip-container{background-color:#1a1a1a;border-radius:12px;padding:2.5rem;text-align:center;box-shadow:0 10px 30px rgba(0,0,0,.3);border:1px solid rgba(255,255,255,.1)}.vip-container h1{color:#e94560;font-size:2.5rem;margin-bottom:1rem;text-transform:uppercase;letter-spacing:1px}.vip-container .subtitle{font-size:1.2rem;margin-bottom:1rem;line-height:1.5}.vip-container .promo-text{background-color:rgba(233,69,96,.2);padding:1.2rem;border-radius:8px;font-size:1.1rem;margin-bottom:2rem;line-height:1.6;border-left:4px solid #e94560}.cta-button{background-color:#f9c74f;color:#b1050f;border:none;padding:.8rem 2rem;font-size:1.1rem;font-weight:bold;border-radius:6px;cursor:pointer;transition:all .3s ease;text-transform:uppercase;letter-spacing:1px}.cta-button:hover{background-color:#f8961e;transform:translateY(-2px);box-shadow:0 5px 15px rgba(0,0,0,.2)}.cta-button:active{transform:translateY(0)}@media(max-width: 768px){.vip-container{padding:1.5rem}.vip-container h1{font-size:2rem}.vip-container .subtitle,.vip-container .promo-text{font-size:1rem}.cta-button{padding:.7rem 1.5rem;font-size:1rem}}@media(max-width: 480px){.vip-banner{padding:1rem}.vip-container{padding:1.2rem}.vip-container h1{font-size:1.6rem}.vip-container .promo-text{padding:1rem}}.cards{position:relative;display:inline-block}.cards img{display:block;width:100%;height:auto}.cards .card-text{position:absolute;top:19%;left:50%;transform:translate(-50%, -50%);color:#ff8c00;font-size:24px;font-weight:bold;text-align:center;pointer-events:none}.card-description{margin-top:10px;text-align:center;font-size:14px;color:#fff;line-height:1.4;padding:0 10px}.back-to-top{position:fixed;bottom:30px;right:30px;width:50px;height:50px;border-radius:50%;background-color:#e94560;color:#fff;border:none;cursor:pointer;font-size:20px;box-shadow:0 4px 12px rgba(0,0,0,.15);opacity:0;visibility:hidden;transition:all .3s ease;z-index:999;display:flex;align-items:center;justify-content:center}.back-to-top:hover{background-color:#e01b3b;transform:translateY(-3px);box-shadow:0 6px 16px rgba(0,0,0,.2)}.back-to-top:active{transform:translateY(0)}.back-to-top.show{opacity:1;visibility:visible}@media(max-width: 768px){.back-to-top{width:45px;height:45px;font-size:18px;bottom:20px;right:20px}}@media(max-width: 480px){.back-to-top{width:40px;height:40px;font-size:16px;bottom:15px;right:15px}}.button-container{display:flex;flex-wrap:wrap;justify-content:center;gap:30px;padding:20px}.t2club-button{background-color:#f05;color:#fff;font-size:1rem;font-weight:500;padding:12px 30px;border:none;border-radius:50px;cursor:pointer;transition:transform .3s ease,background-color .3s ease,box-shadow .3s ease;min-width:180px;text-align:center}.t2club-button:hover{background-color:#e6004c;transform:scale(1.05);box-shadow:0 8px 20px rgba(255,0,85,.3)}@media(max-width: 600px){.t2club-button{width:100%;font-size:1rem}}@media(max-width: 600px){.button-container{flex-direction:column;align-items:stretch}.t2club-button{width:100%;font-size:1rem}}.vip-section{background:#000;color:#fff;text-align:center;padding:40px 20px;max-width:1200px;margin:auto;border-radius:32px}.vip-section .stage{margin-bottom:1px}.vip-section .stage .vip-stage-img{width:100%;height:auto;display:block}.vip-section .vip-intro h2{color:#ffb640;font-size:clamp(20px,3vw,29px);margin-bottom:10px}.vip-section .vip-intro p{font-size:16px;line-height:1.6;max-width:700px;margin:0 auto 30px}.vip-section .vip-cards-grid{display:flex;flex-wrap:wrap-reverse;justify-content:center;gap:30px}.vip-section .vip-cards-grid .vip-card{background:#111;border:2px solid #ffb640;border-radius:12px;padding:15px 20px;width:100%;max-width:400px;display:flex;align-items:center;gap:15px;text-align:left;box-sizing:border-box}.vip-section .vip-cards-grid .vip-card img{width:120px;height:auto;border-radius:8px;flex-shrink:0}.vip-section .vip-cards-grid .vip-card .vip-text{flex:1}.vip-section .vip-cards-grid .vip-card .vip-text h3{color:#ffb640;font-size:clamp(16px,1.5vw,20px);margin:0}.vip-section .vip-cards-grid .vip-card .vip-text p{font-size:15px;margin:5px 0 0}@media(max-width: 768px){.vip-section .vip-card{flex-direction:column;align-items:center;text-align:center}.vip-section .vip-card img{width:80px}.vip-section .vip-card .vip-text h3,.vip-section .vip-card .vip-text p{text-align:center}}@media(max-width: 480px){.vip-section .vip-intro h2{font-size:20px}.vip-section .vip-intro p{font-size:14px}.vip-section .vip-card{padding:10px}.vip-section .vip-card img{width:70px}.vip-section .vip-card .vip-text h3{font-size:16px}.vip-section .vip-card .vip-text p{font-size:13px}}.testimonial-slider{position:relative;overflow:hidden;max-width:100%;margin:0 auto;padding:20px;max-width:1200px}.testimonial-slider .slider-track{display:flex;transition:transform .4s ease;width:-moz-fit-content;width:fit-content}.testimonial-slider .slide{min-width:100%;flex-shrink:0;padding:0 10px}.testimonial-slider .slide img{width:100%;border-radius:12px;max-height:500px;-o-object-fit:contain;object-fit:contain}.testimonial-slider .arrow{position:absolute;top:50%;transform:translateY(-50%);background:#000;color:#fff;border:none;font-size:24px;padding:10px;cursor:pointer;z-index:10}.testimonial-slider .arrow.prev{left:0}.testimonial-slider .arrow.next{right:0}@media(min-width: 768px){.testimonial-slider .slide{min-width:33.3333%}}*/


body {
    margin: 0;
    font-family: "Arial",sans-serif
}

.hero-header {
    color: #fff;
    padding: 20px 0
}

    .hero-header .container {
        width: 90%;
        max-width: 1200px;
        margin: auto
    }

    .hero-header .hero-top {
        display: flex;
        justify-content: space-between;
        align-items: center
    }

        .hero-header .hero-top .logo {
            height: 70px;
            align-items: center
        }

        .hero-header .hero-top .lang-dropdown {
            position: relative
        }

            .hero-header .hero-top .lang-dropdown .lang-btn {
                background: linear-gradient(45deg, #f73c00, #f96000);
                border: none;
                border-radius: 20px;
                color: #fff;
                padding: 8px 16px;
                cursor: pointer;
                font-weight: bold
            }

            .hero-header .hero-top .lang-dropdown .lang-menu {
                display: none;
                list-style: none;
                position: absolute;
                top: 100%;
                right: 0;
                background: #fff;
                color: #1a1a1a;
                border-radius: 5px;
                box-shadow: 0 4px 10px rgba(0,0,0,.1)
            }

                .hero-header .hero-top .lang-dropdown .lang-menu li {
                    padding: 8px 16px;
                    cursor: pointer
                }

                    .hero-header .hero-top .lang-dropdown .lang-menu li:hover {
                        background: #f9f9f9
                    }

            .hero-header .hero-top .lang-dropdown.active .lang-menu {
                display: block
            }

    .hero-header .hero-content {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-top: 10px 10px 10px;
        flex-wrap: wrap;
        background: linear-gradient(90deg, #e30613, #b1050f);
        padding: 0 20px;
        border-radius: 35px;
        margin-top: 15px
    }

        .hero-header .hero-content .hero-text {
            flex: 1 1 50%;
            padding-right: 40px;
            padding-left: 40px
        }

            .hero-header .hero-content .hero-text .tagline {
                text-transform: uppercase;
                font-weight: 600;
                margin-bottom: 10px;
                font-size: clamp(.9rem,2vw,2.2rem)
            }

            .hero-header .hero-content .hero-text h1 {
                text-transform: uppercase;
                font-size: clamp(.9rem,7vw,3.2rem);
                margin-bottom: 20px
            }

            .hero-header .hero-content .hero-text .btn {
                background: #fff;
                color: #e30613;
                padding: 10px 20px;
                text-decoration: none;
                border-radius: 20px;
                font-weight: bold;
                transition: all .3s
            }

                .hero-header .hero-content .hero-text .btn:hover {
                    background: #e6e6e6
                }

        .hero-header .hero-content .hero-image {
            flex: 1 1 40%;
            text-align: center
        }

            .hero-header .hero-content .hero-image img {
                max-width: 80%;
                border-radius: 20px;
                margin-left: 15px
            }

@media(max-width: 768px) {
    .hero-header .hero-content {
        flex-direction: column;
        text-align: center
    }

        .hero-header .hero-content .hero-text, .hero-header .hero-content .hero-image {
            flex: 1 1 100%
        }

        .hero-header .hero-content .hero-text {
            margin-bottom: 20px
        }
}

.steps-section {
    text-align: center;
    padding: 10px 20px;
    max-width: 1200px;
    margin: 0 auto
}

    .steps-section h2 {
        font-size: 1.8rem;
        margin-bottom: 40px;
        font-weight: 700
    }

    .steps-section .steps-container {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
        gap: 20px
    }

        .steps-section .steps-container .step-card {
            background: #fff;
            border: 2px solid #ff003c;
            border-radius: 15px;
            padding: 20px;
            transition: transform .3s ease,box-shadow .3s ease
        }

            .steps-section .steps-container .step-card:hover {
                transform: translateY(-8px);
                box-shadow: 0 8px 20px rgba(0,0,0,.15)
            }

            .steps-section .steps-container .step-card .step-icon {
                width: 70px;
                height: 70px;
                border-radius: 50%;
                margin: -40px auto 15px;
                display: flex;
                align-items: center;
                justify-content: center
            }

                .steps-section .steps-container .step-card .step-icon img {
                    width: 72px;
                    height: 72px
                }

            .steps-section .steps-container .step-card h3 {
                color: #ff003c;
                margin-bottom: 10px;
                font-size: 1.2rem
            }

            .steps-section .steps-container .step-card p {
                margin: 0;
                font-size: .95rem
            }

@media(max-width: 600px) {
    .steps-section h2 {
        font-size: 1.4rem
    }
}

.promotions {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px 20px;
    text-align: center
}

    .promotions h2 {
        font-size: 2rem;
        margin-bottom: 40px
    }

    .promotions .promotion-card {
        display: flex;
        flex-wrap: wrap;
        border: 2px solid #ff003c;
        border-radius: 15px;
        margin-bottom: 30px;
        overflow: hidden
    }

        .promotions .promotion-card .promo-img {
            flex: 1 1 222px;
            display: center
        }

            .promotions .promotion-card .promo-img img {
                width: 88%;
                height: auto;
                border-radius: 15px 15px;
                margin: 12px
            }

        .promotions .promotion-card .promo-content {
            flex: 1 1 150px;
            padding: 20px;
            text-align: left;
            margin-top: -48px
        }

            .promotions .promotion-card .promo-content h3 {
                color: #ff003c;
                margin-bottom: 15px;
                font-size: clamp(2.2rem,3.5vw,3rem)
            }

            .promotions .promotion-card .promo-content p, .promotions .promotion-card .promo-content ul {
                margin: 10px 0
            }

            .promotions .promotion-card .promo-content .btn {
                display: inline-block;
                background: #ff003c;
                color: #fff;
                padding: 10px 20px;
                text-decoration: none;
                border-radius: 20px;
                margin-top: 10px;
                font-weight: bold;
                transition: background .3s
            }

                .promotions .promotion-card .promo-content .btn:hover {
                    background: #cc0030
                }

@media(max-width: 768px) {
    .promotion-card {
        flex-direction: column;
        display: flow
    }

        .promotion-card .promo-img {
            border-radius: 15px 15px 0 0
        }

        .promotion-card .promo-content {
            text-align: center
        }
}

.feedback-section {
    max-width: 1200px;
    margin: 0 auto;
    padding: 40px 20px;
    text-align: center
}

    .feedback-section h2 {
        font-size: clamp(1.5rem,3vw,2rem);
        margin-bottom: 20px
    }

    .feedback-section .slider-container {
        overflow: hidden;
        position: relative
    }

    .feedback-section .slider {
        display: flex;
        transition: transform .5s ease;
        width: 1200%
    }

    .feedback-section .slide {
        flex: 0 0 33.333%;
        padding: 10px;
        width: 33.3333333333%
    }

        .feedback-section .slide img {
            width: 50%;
            border-radius: 10px
        }

        .feedback-section .slide video {
            width: 50%;
            border-radius: 10px
        }

@media(max-width: 768px) {
    .slide {
        flex: 0 0 100%
    }
}

.promo-banner {
    background: linear-gradient(90deg, #d4a657, #f9f9f9);
    border-radius: 20px;
    flex-wrap: wrap;
    max-width: 1200px;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 40px
}

    .promo-banner .promo-text {
        flex: 1 1 40%;
        color: #fff
    }

        .promo-banner .promo-text h2 {
            font-size: 2.5rem;
            margin: 0
        }

        .promo-banner .promo-text h1 {
            font-size: 2rem;
            font-weight: 800;
            margin: 10px 0;
            text-transform: uppercase
        }

        .promo-banner .promo-text .btn {
            display: inline-block;
            margin-top: 20px;
            padding: 10px 20px;
            background: #fff;
            color: #ff003c;
            font-weight: bold;
            border-radius: 20px;
            text-decoration: none;
            transition: background .3s
        }

            .promo-banner .promo-text .btn:hover {
                background: #eee
            }

    .promo-banner .promo-images {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap
    }

        .promo-banner .promo-images .product {
            max-width: 300px;
            width: 100%;
            margin: 10px
        }

.footer-note {
    text-align: center;
    margin-top: 20px;
    font-size: .8rem;
    color: #888
}

@media(max-width: 768px) {
    .promo-banner {
        flex-direction: column;
        text-align: center
    }

        .promo-banner .promo-text {
            flex: 1 1 100%;
            margin-bottom: 20px
        }

        .promo-banner .promo-images {
            flex: 1 1 70%
        }
}

.promo-banner {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    background: linear-gradient(135deg, #fbe18d, #d5a838);
    padding: 2rem;
    border-radius: 2rem;
    margin: 2rem;
    box-shadow: 0 8px 24px rgba(0,0,0,.1);
    max-width: 1200px;
    width: 100%
}

    .promo-banner .promo-content {
        flex: 1;
        min-width: 300px;
        padding-right: 2rem
    }

        .promo-banner .promo-content h1 {
            font-size: 3rem;
            margin-bottom: 1rem;
            color: #000
        }

        .promo-banner .promo-content p {
            font-size: 1.2rem;
            color: #000;
            margin-bottom: .5rem
        }

            .promo-banner .promo-content p strong {
                color: #000;
                font-size: clamp(1.2rem,3.5vw,3rem)
            }

        .promo-banner .promo-content .terms {
            font-size: .9rem;
            margin-top: 1rem;
            color: #000
        }

        .promo-banner .promo-content button {
            margin-top: 1rem;
            padding: .75rem 2rem;
            font-size: 1.2rem;
            border: none;
            background-color: #ff0050;
            color: #fff;
            border-radius: 999px;
            cursor: pointer;
            transition: background-color .3s ease
        }

            .promo-banner .promo-content button:hover {
                background-color: #d40044
            }

    .promo-banner .promo-image {
        flex: 1;
        text-align: center;
        margin-left: -35px
    }

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

.footer {
    text-align: center;
    padding: 1rem;
    background: #d7dde5;
    font-size: .9rem;
    color: #333
}

@media(max-width: 768px) {
    .promo-banner {
        flex-direction: column;
        text-align: center;
        max-width: 89%
    }

    .promo-content, .promo-image {
        max-width: 100%
    }

    .promo-content {
        padding: 1rem 0
    }
}

.center-container {
    display: flex;
    justify-content: center;
    padding: 2px
}

.vip-banner {
    width: 100%;
    max-width: 1200px;
    padding: 2rem;
    box-sizing: border-box
}

.vip-container {
    background-color: #1a1a1a;
    border-radius: 12px;
    padding: 2.5rem;
    text-align: center;
    box-shadow: 0 10px 30px rgba(0,0,0,.3);
    border: 1px solid rgba(255,255,255,.1)
}

    .vip-container h1 {
        color: #e94560;
        font-size: 2.5rem;
        margin-bottom: 1rem;
        text-transform: uppercase;
        letter-spacing: 1px
    }

    .vip-container .subtitle {
        font-size: 1.2rem;
        margin-bottom: 1rem;
        line-height: 1.5
    }

    .vip-container .promo-text {
        background-color: rgba(233,69,96,.2);
        padding: 1.2rem;
        border-radius: 8px;
        font-size: 1.1rem;
        margin-bottom: 2rem;
        line-height: 1.6;
        border-left: 4px solid #e94560
    }

.cta-button {
    background-color: #f9c74f;
    color: #b1050f;
    border: none;
    padding: .8rem 2rem;
    font-size: 1.1rem;
    font-weight: bold;
    border-radius: 6px;
    cursor: pointer;
    transition: all .3s ease;
    text-transform: uppercase;
    letter-spacing: 1px
}

    .cta-button:hover {
        background-color: #f8961e;
        transform: translateY(-2px);
        box-shadow: 0 5px 15px rgba(0,0,0,.2)
    }

    .cta-button:active {
        transform: translateY(0)
    }

@media(max-width: 768px) {
    .vip-container {
        padding: 1.5rem
    }

        .vip-container h1 {
            font-size: 2rem
        }

        .vip-container .subtitle, .vip-container .promo-text {
            font-size: 1rem
        }

    .cta-button {
        padding: .7rem 1.5rem;
        font-size: 1rem
    }
}

@media(max-width: 480px) {
    .vip-banner {
        padding: 1rem
    }

    .vip-container {
        padding: 1.2rem
    }

        .vip-container h1 {
            font-size: 1.6rem
        }

        .vip-container .promo-text {
            padding: 1rem
        }
}

.cards {
    position: relative;
    display: inline-block
}

    .cards img {
        display: block;
        width: 100%;
        height: auto
    }

    .cards .card-text {
        position: absolute;
        top: 19%;
        left: 50%;
        transform: translate(-50%, -50%);
        color: #ff8c00;
        font-size: 24px;
        font-weight: bold;
        text-align: center;
        pointer-events: none
    }

.card-description {
    margin-top: 10px;
    text-align: center;
    font-size: 14px;
    color: #fff;
    line-height: 1.4;
    padding: 0 10px
}

.back-to-top {
    position: fixed;
    bottom: 30px;
    right: 30px;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: #e94560;
    color: #fff;
    border: none;
    cursor: pointer;
    font-size: 20px;
    box-shadow: 0 4px 12px rgba(0,0,0,.15);
    opacity: 0;
    visibility: hidden;
    transition: all .3s ease;
    z-index: 999;
    display: flex;
    align-items: center;
    justify-content: center
}

    .back-to-top:hover {
        background-color: #e01b3b;
        transform: translateY(-3px);
        box-shadow: 0 6px 16px rgba(0,0,0,.2)
    }

    .back-to-top:active {
        transform: translateY(0)
    }

    .back-to-top.show {
        opacity: 1;
        visibility: visible
    }

@media(max-width: 768px) {
    .back-to-top {
        width: 45px;
        height: 45px;
        font-size: 18px;
        bottom: 20px;
        right: 20px
    }
}

@media(max-width: 480px) {
    .back-to-top {
        width: 40px;
        height: 40px;
        font-size: 16px;
        bottom: 15px;
        right: 15px
    }
}

.button-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 30px;
    padding: 20px
}

.t2club-button {
    background-color: #f05;
    color: #fff;
    font-size: 1rem;
    font-weight: 500;
    padding: 12px 30px;
    border: none;
    border-radius: 50px;
    cursor: pointer;
    transition: transform .3s ease,background-color .3s ease,box-shadow .3s ease;
    min-width: 180px;
    text-align: center
}

    .t2club-button:hover {
        background-color: #e6004c;
        transform: scale(1.05);
        box-shadow: 0 8px 20px rgba(255,0,85,.3)
    }

@media(max-width: 600px) {
    .t2club-button {
        width: 100%;
        font-size: 1rem
    }
}

@media(max-width: 600px) {
    .button-container {
        flex-direction: column;
        align-items: stretch
    }

    .t2club-button {
        width: 100%;
        font-size: 1rem
    }
}

.vip-section {
    background: #000;
    color: #fff;
    text-align: center;
    padding: 40px 20px;
    max-width: 1200px;
    margin: auto;
    border-radius: 32px
}

    .vip-section .stage {
        margin-bottom: 1px
    }

        .vip-section .stage .vip-stage-img {
            width: 100%;
            height: auto;
            display: block
        }

    .vip-section .vip-intro h2 {
        color: #ffb640;
        font-size: clamp(20px,3vw,29px);
        margin-bottom: 10px
    }

    .vip-section .vip-intro p {
        font-size: 16px;
        line-height: 1.6;
        max-width: 700px;
        margin: 0 auto 30px
    }

    .vip-section .vip-cards-grid {
        display: flex;
        flex-wrap: wrap-reverse;
        justify-content: center;
        gap: 30px
    }

        .vip-section .vip-cards-grid .vip-card {
            background: #111;
            border: 2px solid #ffb640;
            border-radius: 12px;
            padding: 15px 20px;
            width: 100%;
            max-width: 400px;
            display: flex;
            align-items: center;
            gap: 15px;
            text-align: left;
            box-sizing: border-box
        }

            .vip-section .vip-cards-grid .vip-card img {
                width: 120px;
                height: auto;
                border-radius: 8px;
                flex-shrink: 0
            }

            .vip-section .vip-cards-grid .vip-card .vip-text {
                flex: 1
            }

                .vip-section .vip-cards-grid .vip-card .vip-text h3 {
                    color: #ffb640;
                    font-size: clamp(16px,1.5vw,20px);
                    margin: 0
                }

                .vip-section .vip-cards-grid .vip-card .vip-text p {
                    font-size: 15px;
                    margin: 5px 0 0
                }

@media(max-width: 768px) {
    .vip-section .vip-card {
        flex-direction: column;
        align-items: center;
        text-align: center
    }

        .vip-section .vip-card img {
            width: 80px
        }

        .vip-section .vip-card .vip-text h3, .vip-section .vip-card .vip-text p {
            text-align: center
        }
}

@media(max-width: 480px) {
    .vip-section .vip-intro h2 {
        font-size: 20px
    }

    .vip-section .vip-intro p {
        font-size: 14px
    }

    .vip-section .vip-card {
        padding: 10px
    }

        .vip-section .vip-card img {
            width: 70px
        }

        .vip-section .vip-card .vip-text h3 {
            font-size: 16px
        }

        .vip-section .vip-card .vip-text p {
            font-size: 13px
        }
}

.testimonial-slider {
    position: relative;
    overflow: hidden;
    max-width: 100%;
    margin: 0 auto;
    padding: 20px;
    max-width: 1200px
}

    .testimonial-slider .slider-track {
        display: flex;
        transition: transform .4s ease;
        width: -moz-fit-content;
        width: fit-content
    }

    .testimonial-slider .slide {
        min-width: 100%;
        flex-shrink: 0;
        padding: 0 10px
    }

        .testimonial-slider .slide img {
            width: 100%;
            border-radius: 12px;
            max-height: 500px;
            -o-object-fit: contain;
            object-fit: contain
        }

        .testimonial-slider .slide video {
            width: 100%;
            border-radius: 12px;
            max-height: 500px;
            -o-object-fit: contain;
            object-fit: contain
        }

    .testimonial-slider .arrow {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        background: #000;
        color: #fff;
        border: none;
        font-size: 24px;
        padding: 10px;
        cursor: pointer;
        z-index: 10
    }

        .testimonial-slider .arrow.prev {
            left: 0
        }

        .testimonial-slider .arrow.next {
            right: 0
        }

@media(min-width: 768px) {
    .testimonial-slider .slide {
        min-width: 33.3333%
    }
}